| [ Index ] |
PHP Cross Reference of WordPress Trunk (Updated Daily) |
[Summary view] [Print] [Text view]
1 var __create = Object.create; 2 var __defProp = Object.defineProperty; 3 var __getOwnPropDesc = Object.getOwnPropertyDescriptor; 4 var __getOwnPropNames = Object.getOwnPropertyNames; 5 var __getProtoOf = Object.getPrototypeOf; 6 var __hasOwnProp = Object.prototype.hasOwnProperty; 7 var __commonJS = (cb, mod) => function __require() { 8 return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; 9 }; 10 var __export = (target, all) => { 11 for (var name in all) 12 __defProp(target, name, { get: all[name], enumerable: true }); 13 }; 14 var __copyProps = (to, from, except, desc) => { 15 if (from && typeof from === "object" || typeof from === "function") { 16 for (let key of __getOwnPropNames(from)) 17 if (!__hasOwnProp.call(to, key) && key !== except) 18 __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); 19 } 20 return to; 21 }; 22 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( 23 // If the importer is in node compatibility mode or this is not an ESM 24 // file that has been converted to a CommonJS file using a Babel- 25 // compatible transform (i.e. "__esModule" has not been set), then set 26 // "default" to the CommonJS "module.exports" for node compatibility. 27 isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, 28 mod 29 )); 30 31 // package-external:@wordpress/i18n 32 var require_i18n = __commonJS({ 33 "package-external:@wordpress/i18n"(exports, module) { 34 module.exports = window.wp.i18n; 35 } 36 }); 37 38 // package-external:@wordpress/element 39 var require_element = __commonJS({ 40 "package-external:@wordpress/element"(exports, module) { 41 module.exports = window.wp.element; 42 } 43 }); 44 45 // vendor-external:react 46 var require_react = __commonJS({ 47 "vendor-external:react"(exports, module) { 48 module.exports = window.React; 49 } 50 }); 51 52 // vendor-external:react/jsx-runtime 53 var require_jsx_runtime = __commonJS({ 54 "vendor-external:react/jsx-runtime"(exports, module) { 55 module.exports = window.ReactJSXRuntime; 56 } 57 }); 58 59 // vendor-external:react-dom 60 var require_react_dom = __commonJS({ 61 "vendor-external:react-dom"(exports, module) { 62 module.exports = window.ReactDOM; 63 } 64 }); 65 66 // node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js 67 var require_use_sync_external_store_shim_development = __commonJS({ 68 "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) { 69 "use strict"; 70 (function() { 71 function is(x2, y2) { 72 return x2 === y2 && (0 !== x2 || 1 / x2 === 1 / y2) || x2 !== x2 && y2 !== y2; 73 } 74 function useSyncExternalStore$2(subscribe2, getSnapshot) { 75 didWarnOld18Alpha || void 0 === React26.startTransition || (didWarnOld18Alpha = true, console.error( 76 "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release." 77 )); 78 var value = getSnapshot(); 79 if (!didWarnUncachedGetSnapshot) { 80 var cachedValue = getSnapshot(); 81 objectIs(value, cachedValue) || (console.error( 82 "The result of getSnapshot should be cached to avoid an infinite loop" 83 ), didWarnUncachedGetSnapshot = true); 84 } 85 cachedValue = useState36({ 86 inst: { value, getSnapshot } 87 }); 88 var inst = cachedValue[0].inst, forceUpdate = cachedValue[1]; 89 useLayoutEffect5( 90 function() { 91 inst.value = value; 92 inst.getSnapshot = getSnapshot; 93 checkIfSnapshotChanged(inst) && forceUpdate({ inst }); 94 }, 95 [subscribe2, value, getSnapshot] 96 ); 97 useEffect32( 98 function() { 99 checkIfSnapshotChanged(inst) && forceUpdate({ inst }); 100 return subscribe2(function() { 101 checkIfSnapshotChanged(inst) && forceUpdate({ inst }); 102 }); 103 }, 104 [subscribe2] 105 ); 106 useDebugValue(value); 107 return value; 108 } 109 function checkIfSnapshotChanged(inst) { 110 var latestGetSnapshot = inst.getSnapshot; 111 inst = inst.value; 112 try { 113 var nextValue = latestGetSnapshot(); 114 return !objectIs(inst, nextValue); 115 } catch (error2) { 116 return true; 117 } 118 } 119 function useSyncExternalStore$1(subscribe2, getSnapshot) { 120 return getSnapshot(); 121 } 122 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error()); 123 var React26 = require_react(), objectIs = "function" === typeof Object.is ? Object.is : is, useState36 = React26.useState, useEffect32 = React26.useEffect, useLayoutEffect5 = React26.useLayoutEffect, useDebugValue = React26.useDebugValue, didWarnOld18Alpha = false, didWarnUncachedGetSnapshot = false, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2; 124 exports.useSyncExternalStore = void 0 !== React26.useSyncExternalStore ? React26.useSyncExternalStore : shim; 125 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error()); 126 })(); 127 } 128 }); 129 130 // node_modules/use-sync-external-store/shim/index.js 131 var require_shim = __commonJS({ 132 "node_modules/use-sync-external-store/shim/index.js"(exports, module) { 133 "use strict"; 134 if (false) { 135 module.exports = null; 136 } else { 137 module.exports = require_use_sync_external_store_shim_development(); 138 } 139 } 140 }); 141 142 // package-external:@wordpress/primitives 143 var require_primitives = __commonJS({ 144 "package-external:@wordpress/primitives"(exports, module) { 145 module.exports = window.wp.primitives; 146 } 147 }); 148 149 // package-external:@wordpress/compose 150 var require_compose = __commonJS({ 151 "package-external:@wordpress/compose"(exports, module) { 152 module.exports = window.wp.compose; 153 } 154 }); 155 156 // package-external:@wordpress/private-apis 157 var require_private_apis = __commonJS({ 158 "package-external:@wordpress/private-apis"(exports, module) { 159 module.exports = window.wp.privateApis; 160 } 161 }); 162 163 // package-external:@wordpress/components 164 var require_components = __commonJS({ 165 "package-external:@wordpress/components"(exports, module) { 166 module.exports = window.wp.components; 167 } 168 }); 169 170 // package-external:@wordpress/keycodes 171 var require_keycodes = __commonJS({ 172 "package-external:@wordpress/keycodes"(exports, module) { 173 module.exports = window.wp.keycodes; 174 } 175 }); 176 177 // package-external:@wordpress/data 178 var require_data = __commonJS({ 179 "package-external:@wordpress/data"(exports, module) { 180 module.exports = window.wp.data; 181 } 182 }); 183 184 // node_modules/remove-accents/index.js 185 var require_remove_accents = __commonJS({ 186 "node_modules/remove-accents/index.js"(exports, module) { 187 var characterMap = { 188 "\xC0": "A", 189 "\xC1": "A", 190 "\xC2": "A", 191 "\xC3": "A", 192 "\xC4": "A", 193 "\xC5": "A", 194 "\u1EA4": "A", 195 "\u1EAE": "A", 196 "\u1EB2": "A", 197 "\u1EB4": "A", 198 "\u1EB6": "A", 199 "\xC6": "AE", 200 "\u1EA6": "A", 201 "\u1EB0": "A", 202 "\u0202": "A", 203 "\u1EA2": "A", 204 "\u1EA0": "A", 205 "\u1EA8": "A", 206 "\u1EAA": "A", 207 "\u1EAC": "A", 208 "\xC7": "C", 209 "\u1E08": "C", 210 "\xC8": "E", 211 "\xC9": "E", 212 "\xCA": "E", 213 "\xCB": "E", 214 "\u1EBE": "E", 215 "\u1E16": "E", 216 "\u1EC0": "E", 217 "\u1E14": "E", 218 "\u1E1C": "E", 219 "\u0206": "E", 220 "\u1EBA": "E", 221 "\u1EBC": "E", 222 "\u1EB8": "E", 223 "\u1EC2": "E", 224 "\u1EC4": "E", 225 "\u1EC6": "E", 226 "\xCC": "I", 227 "\xCD": "I", 228 "\xCE": "I", 229 "\xCF": "I", 230 "\u1E2E": "I", 231 "\u020A": "I", 232 "\u1EC8": "I", 233 "\u1ECA": "I", 234 "\xD0": "D", 235 "\xD1": "N", 236 "\xD2": "O", 237 "\xD3": "O", 238 "\xD4": "O", 239 "\xD5": "O", 240 "\xD6": "O", 241 "\xD8": "O", 242 "\u1ED0": "O", 243 "\u1E4C": "O", 244 "\u1E52": "O", 245 "\u020E": "O", 246 "\u1ECE": "O", 247 "\u1ECC": "O", 248 "\u1ED4": "O", 249 "\u1ED6": "O", 250 "\u1ED8": "O", 251 "\u1EDC": "O", 252 "\u1EDE": "O", 253 "\u1EE0": "O", 254 "\u1EDA": "O", 255 "\u1EE2": "O", 256 "\xD9": "U", 257 "\xDA": "U", 258 "\xDB": "U", 259 "\xDC": "U", 260 "\u1EE6": "U", 261 "\u1EE4": "U", 262 "\u1EEC": "U", 263 "\u1EEE": "U", 264 "\u1EF0": "U", 265 "\xDD": "Y", 266 "\xE0": "a", 267 "\xE1": "a", 268 "\xE2": "a", 269 "\xE3": "a", 270 "\xE4": "a", 271 "\xE5": "a", 272 "\u1EA5": "a", 273 "\u1EAF": "a", 274 "\u1EB3": "a", 275 "\u1EB5": "a", 276 "\u1EB7": "a", 277 "\xE6": "ae", 278 "\u1EA7": "a", 279 "\u1EB1": "a", 280 "\u0203": "a", 281 "\u1EA3": "a", 282 "\u1EA1": "a", 283 "\u1EA9": "a", 284 "\u1EAB": "a", 285 "\u1EAD": "a", 286 "\xE7": "c", 287 "\u1E09": "c", 288 "\xE8": "e", 289 "\xE9": "e", 290 "\xEA": "e", 291 "\xEB": "e", 292 "\u1EBF": "e", 293 "\u1E17": "e", 294 "\u1EC1": "e", 295 "\u1E15": "e", 296 "\u1E1D": "e", 297 "\u0207": "e", 298 "\u1EBB": "e", 299 "\u1EBD": "e", 300 "\u1EB9": "e", 301 "\u1EC3": "e", 302 "\u1EC5": "e", 303 "\u1EC7": "e", 304 "\xEC": "i", 305 "\xED": "i", 306 "\xEE": "i", 307 "\xEF": "i", 308 "\u1E2F": "i", 309 "\u020B": "i", 310 "\u1EC9": "i", 311 "\u1ECB": "i", 312 "\xF0": "d", 313 "\xF1": "n", 314 "\xF2": "o", 315 "\xF3": "o", 316 "\xF4": "o", 317 "\xF5": "o", 318 "\xF6": "o", 319 "\xF8": "o", 320 "\u1ED1": "o", 321 "\u1E4D": "o", 322 "\u1E53": "o", 323 "\u020F": "o", 324 "\u1ECF": "o", 325 "\u1ECD": "o", 326 "\u1ED5": "o", 327 "\u1ED7": "o", 328 "\u1ED9": "o", 329 "\u1EDD": "o", 330 "\u1EDF": "o", 331 "\u1EE1": "o", 332 "\u1EDB": "o", 333 "\u1EE3": "o", 334 "\xF9": "u", 335 "\xFA": "u", 336 "\xFB": "u", 337 "\xFC": "u", 338 "\u1EE7": "u", 339 "\u1EE5": "u", 340 "\u1EED": "u", 341 "\u1EEF": "u", 342 "\u1EF1": "u", 343 "\xFD": "y", 344 "\xFF": "y", 345 "\u0100": "A", 346 "\u0101": "a", 347 "\u0102": "A", 348 "\u0103": "a", 349 "\u0104": "A", 350 "\u0105": "a", 351 "\u0106": "C", 352 "\u0107": "c", 353 "\u0108": "C", 354 "\u0109": "c", 355 "\u010A": "C", 356 "\u010B": "c", 357 "\u010C": "C", 358 "\u010D": "c", 359 "C\u0306": "C", 360 "c\u0306": "c", 361 "\u010E": "D", 362 "\u010F": "d", 363 "\u0110": "D", 364 "\u0111": "d", 365 "\u0112": "E", 366 "\u0113": "e", 367 "\u0114": "E", 368 "\u0115": "e", 369 "\u0116": "E", 370 "\u0117": "e", 371 "\u0118": "E", 372 "\u0119": "e", 373 "\u011A": "E", 374 "\u011B": "e", 375 "\u011C": "G", 376 "\u01F4": "G", 377 "\u011D": "g", 378 "\u01F5": "g", 379 "\u011E": "G", 380 "\u011F": "g", 381 "\u0120": "G", 382 "\u0121": "g", 383 "\u0122": "G", 384 "\u0123": "g", 385 "\u0124": "H", 386 "\u0125": "h", 387 "\u0126": "H", 388 "\u0127": "h", 389 "\u1E2A": "H", 390 "\u1E2B": "h", 391 "\u0128": "I", 392 "\u0129": "i", 393 "\u012A": "I", 394 "\u012B": "i", 395 "\u012C": "I", 396 "\u012D": "i", 397 "\u012E": "I", 398 "\u012F": "i", 399 "\u0130": "I", 400 "\u0131": "i", 401 "\u0132": "IJ", 402 "\u0133": "ij", 403 "\u0134": "J", 404 "\u0135": "j", 405 "\u0136": "K", 406 "\u0137": "k", 407 "\u1E30": "K", 408 "\u1E31": "k", 409 "K\u0306": "K", 410 "k\u0306": "k", 411 "\u0139": "L", 412 "\u013A": "l", 413 "\u013B": "L", 414 "\u013C": "l", 415 "\u013D": "L", 416 "\u013E": "l", 417 "\u013F": "L", 418 "\u0140": "l", 419 "\u0141": "l", 420 "\u0142": "l", 421 "\u1E3E": "M", 422 "\u1E3F": "m", 423 "M\u0306": "M", 424 "m\u0306": "m", 425 "\u0143": "N", 426 "\u0144": "n", 427 "\u0145": "N", 428 "\u0146": "n", 429 "\u0147": "N", 430 "\u0148": "n", 431 "\u0149": "n", 432 "N\u0306": "N", 433 "n\u0306": "n", 434 "\u014C": "O", 435 "\u014D": "o", 436 "\u014E": "O", 437 "\u014F": "o", 438 "\u0150": "O", 439 "\u0151": "o", 440 "\u0152": "OE", 441 "\u0153": "oe", 442 "P\u0306": "P", 443 "p\u0306": "p", 444 "\u0154": "R", 445 "\u0155": "r", 446 "\u0156": "R", 447 "\u0157": "r", 448 "\u0158": "R", 449 "\u0159": "r", 450 "R\u0306": "R", 451 "r\u0306": "r", 452 "\u0212": "R", 453 "\u0213": "r", 454 "\u015A": "S", 455 "\u015B": "s", 456 "\u015C": "S", 457 "\u015D": "s", 458 "\u015E": "S", 459 "\u0218": "S", 460 "\u0219": "s", 461 "\u015F": "s", 462 "\u0160": "S", 463 "\u0161": "s", 464 "\u0162": "T", 465 "\u0163": "t", 466 "\u021B": "t", 467 "\u021A": "T", 468 "\u0164": "T", 469 "\u0165": "t", 470 "\u0166": "T", 471 "\u0167": "t", 472 "T\u0306": "T", 473 "t\u0306": "t", 474 "\u0168": "U", 475 "\u0169": "u", 476 "\u016A": "U", 477 "\u016B": "u", 478 "\u016C": "U", 479 "\u016D": "u", 480 "\u016E": "U", 481 "\u016F": "u", 482 "\u0170": "U", 483 "\u0171": "u", 484 "\u0172": "U", 485 "\u0173": "u", 486 "\u0216": "U", 487 "\u0217": "u", 488 "V\u0306": "V", 489 "v\u0306": "v", 490 "\u0174": "W", 491 "\u0175": "w", 492 "\u1E82": "W", 493 "\u1E83": "w", 494 "X\u0306": "X", 495 "x\u0306": "x", 496 "\u0176": "Y", 497 "\u0177": "y", 498 "\u0178": "Y", 499 "Y\u0306": "Y", 500 "y\u0306": "y", 501 "\u0179": "Z", 502 "\u017A": "z", 503 "\u017B": "Z", 504 "\u017C": "z", 505 "\u017D": "Z", 506 "\u017E": "z", 507 "\u017F": "s", 508 "\u0192": "f", 509 "\u01A0": "O", 510 "\u01A1": "o", 511 "\u01AF": "U", 512 "\u01B0": "u", 513 "\u01CD": "A", 514 "\u01CE": "a", 515 "\u01CF": "I", 516 "\u01D0": "i", 517 "\u01D1": "O", 518 "\u01D2": "o", 519 "\u01D3": "U", 520 "\u01D4": "u", 521 "\u01D5": "U", 522 "\u01D6": "u", 523 "\u01D7": "U", 524 "\u01D8": "u", 525 "\u01D9": "U", 526 "\u01DA": "u", 527 "\u01DB": "U", 528 "\u01DC": "u", 529 "\u1EE8": "U", 530 "\u1EE9": "u", 531 "\u1E78": "U", 532 "\u1E79": "u", 533 "\u01FA": "A", 534 "\u01FB": "a", 535 "\u01FC": "AE", 536 "\u01FD": "ae", 537 "\u01FE": "O", 538 "\u01FF": "o", 539 "\xDE": "TH", 540 "\xFE": "th", 541 "\u1E54": "P", 542 "\u1E55": "p", 543 "\u1E64": "S", 544 "\u1E65": "s", 545 "X\u0301": "X", 546 "x\u0301": "x", 547 "\u0403": "\u0413", 548 "\u0453": "\u0433", 549 "\u040C": "\u041A", 550 "\u045C": "\u043A", 551 "A\u030B": "A", 552 "a\u030B": "a", 553 "E\u030B": "E", 554 "e\u030B": "e", 555 "I\u030B": "I", 556 "i\u030B": "i", 557 "\u01F8": "N", 558 "\u01F9": "n", 559 "\u1ED2": "O", 560 "\u1ED3": "o", 561 "\u1E50": "O", 562 "\u1E51": "o", 563 "\u1EEA": "U", 564 "\u1EEB": "u", 565 "\u1E80": "W", 566 "\u1E81": "w", 567 "\u1EF2": "Y", 568 "\u1EF3": "y", 569 "\u0200": "A", 570 "\u0201": "a", 571 "\u0204": "E", 572 "\u0205": "e", 573 "\u0208": "I", 574 "\u0209": "i", 575 "\u020C": "O", 576 "\u020D": "o", 577 "\u0210": "R", 578 "\u0211": "r", 579 "\u0214": "U", 580 "\u0215": "u", 581 "B\u030C": "B", 582 "b\u030C": "b", 583 "\u010C\u0323": "C", 584 "\u010D\u0323": "c", 585 "\xCA\u030C": "E", 586 "\xEA\u030C": "e", 587 "F\u030C": "F", 588 "f\u030C": "f", 589 "\u01E6": "G", 590 "\u01E7": "g", 591 "\u021E": "H", 592 "\u021F": "h", 593 "J\u030C": "J", 594 "\u01F0": "j", 595 "\u01E8": "K", 596 "\u01E9": "k", 597 "M\u030C": "M", 598 "m\u030C": "m", 599 "P\u030C": "P", 600 "p\u030C": "p", 601 "Q\u030C": "Q", 602 "q\u030C": "q", 603 "\u0158\u0329": "R", 604 "\u0159\u0329": "r", 605 "\u1E66": "S", 606 "\u1E67": "s", 607 "V\u030C": "V", 608 "v\u030C": "v", 609 "W\u030C": "W", 610 "w\u030C": "w", 611 "X\u030C": "X", 612 "x\u030C": "x", 613 "Y\u030C": "Y", 614 "y\u030C": "y", 615 "A\u0327": "A", 616 "a\u0327": "a", 617 "B\u0327": "B", 618 "b\u0327": "b", 619 "\u1E10": "D", 620 "\u1E11": "d", 621 "\u0228": "E", 622 "\u0229": "e", 623 "\u0190\u0327": "E", 624 "\u025B\u0327": "e", 625 "\u1E28": "H", 626 "\u1E29": "h", 627 "I\u0327": "I", 628 "i\u0327": "i", 629 "\u0197\u0327": "I", 630 "\u0268\u0327": "i", 631 "M\u0327": "M", 632 "m\u0327": "m", 633 "O\u0327": "O", 634 "o\u0327": "o", 635 "Q\u0327": "Q", 636 "q\u0327": "q", 637 "U\u0327": "U", 638 "u\u0327": "u", 639 "X\u0327": "X", 640 "x\u0327": "x", 641 "Z\u0327": "Z", 642 "z\u0327": "z", 643 "\u0439": "\u0438", 644 "\u0419": "\u0418", 645 "\u0451": "\u0435", 646 "\u0401": "\u0415" 647 }; 648 var chars = Object.keys(characterMap).join("|"); 649 var allAccents = new RegExp(chars, "g"); 650 var firstAccent = new RegExp(chars, ""); 651 function matcher(match2) { 652 return characterMap[match2]; 653 } 654 var removeAccents2 = function(string) { 655 return string.replace(allAccents, matcher); 656 }; 657 var hasAccents = function(string) { 658 return !!string.match(firstAccent); 659 }; 660 module.exports = removeAccents2; 661 module.exports.has = hasAccents; 662 module.exports.remove = removeAccents2; 663 } 664 }); 665 666 // node_modules/fast-deep-equal/es6/index.js 667 var require_es6 = __commonJS({ 668 "node_modules/fast-deep-equal/es6/index.js"(exports, module) { 669 "use strict"; 670 module.exports = function equal(a2, b2) { 671 if (a2 === b2) return true; 672 if (a2 && b2 && typeof a2 == "object" && typeof b2 == "object") { 673 if (a2.constructor !== b2.constructor) return false; 674 var length, i2, keys; 675 if (Array.isArray(a2)) { 676 length = a2.length; 677 if (length != b2.length) return false; 678 for (i2 = length; i2-- !== 0; ) 679 if (!equal(a2[i2], b2[i2])) return false; 680 return true; 681 } 682 if (a2 instanceof Map && b2 instanceof Map) { 683 if (a2.size !== b2.size) return false; 684 for (i2 of a2.entries()) 685 if (!b2.has(i2[0])) return false; 686 for (i2 of a2.entries()) 687 if (!equal(i2[1], b2.get(i2[0]))) return false; 688 return true; 689 } 690 if (a2 instanceof Set && b2 instanceof Set) { 691 if (a2.size !== b2.size) return false; 692 for (i2 of a2.entries()) 693 if (!b2.has(i2[0])) return false; 694 return true; 695 } 696 if (ArrayBuffer.isView(a2) && ArrayBuffer.isView(b2)) { 697 length = a2.length; 698 if (length != b2.length) return false; 699 for (i2 = length; i2-- !== 0; ) 700 if (a2[i2] !== b2[i2]) return false; 701 return true; 702 } 703 if (a2.constructor === RegExp) return a2.source === b2.source && a2.flags === b2.flags; 704 if (a2.valueOf !== Object.prototype.valueOf) return a2.valueOf() === b2.valueOf(); 705 if (a2.toString !== Object.prototype.toString) return a2.toString() === b2.toString(); 706 keys = Object.keys(a2); 707 length = keys.length; 708 if (length !== Object.keys(b2).length) return false; 709 for (i2 = length; i2-- !== 0; ) 710 if (!Object.prototype.hasOwnProperty.call(b2, keys[i2])) return false; 711 for (i2 = length; i2-- !== 0; ) { 712 var key = keys[i2]; 713 if (!equal(a2[key], b2[key])) return false; 714 } 715 return true; 716 } 717 return a2 !== a2 && b2 !== b2; 718 }; 719 } 720 }); 721 722 // package-external:@wordpress/date 723 var require_date = __commonJS({ 724 "package-external:@wordpress/date"(exports, module) { 725 module.exports = window.wp.date; 726 } 727 }); 728 729 // package-external:@wordpress/warning 730 var require_warning = __commonJS({ 731 "package-external:@wordpress/warning"(exports, module) { 732 module.exports = window.wp.warning; 733 } 734 }); 735 736 // node_modules/deepmerge/dist/cjs.js 737 var require_cjs = __commonJS({ 738 "node_modules/deepmerge/dist/cjs.js"(exports, module) { 739 "use strict"; 740 var isMergeableObject = function isMergeableObject2(value) { 741 return isNonNullObject(value) && !isSpecial(value); 742 }; 743 function isNonNullObject(value) { 744 return !!value && typeof value === "object"; 745 } 746 function isSpecial(value) { 747 var stringValue = Object.prototype.toString.call(value); 748 return stringValue === "[object RegExp]" || stringValue === "[object Date]" || isReactElement(value); 749 } 750 var canUseSymbol = typeof Symbol === "function" && Symbol.for; 751 var REACT_ELEMENT_TYPE = canUseSymbol ? /* @__PURE__ */ Symbol.for("react.element") : 60103; 752 function isReactElement(value) { 753 return value.$$typeof === REACT_ELEMENT_TYPE; 754 } 755 function emptyTarget(val) { 756 return Array.isArray(val) ? [] : {}; 757 } 758 function cloneUnlessOtherwiseSpecified(value, options) { 759 return options.clone !== false && options.isMergeableObject(value) ? deepmerge(emptyTarget(value), value, options) : value; 760 } 761 function defaultArrayMerge(target, source, options) { 762 return target.concat(source).map(function(element) { 763 return cloneUnlessOtherwiseSpecified(element, options); 764 }); 765 } 766 function getMergeFunction(key, options) { 767 if (!options.customMerge) { 768 return deepmerge; 769 } 770 var customMerge = options.customMerge(key); 771 return typeof customMerge === "function" ? customMerge : deepmerge; 772 } 773 function getEnumerableOwnPropertySymbols(target) { 774 return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(target).filter(function(symbol3) { 775 return Object.propertyIsEnumerable.call(target, symbol3); 776 }) : []; 777 } 778 function getKeys2(target) { 779 return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target)); 780 } 781 function propertyIsOnObject(object, property) { 782 try { 783 return property in object; 784 } catch (_) { 785 return false; 786 } 787 } 788 function propertyIsUnsafe(target, key) { 789 return propertyIsOnObject(target, key) && !(Object.hasOwnProperty.call(target, key) && Object.propertyIsEnumerable.call(target, key)); 790 } 791 function mergeObject(target, source, options) { 792 var destination = {}; 793 if (options.isMergeableObject(target)) { 794 getKeys2(target).forEach(function(key) { 795 destination[key] = cloneUnlessOtherwiseSpecified(target[key], options); 796 }); 797 } 798 getKeys2(source).forEach(function(key) { 799 if (propertyIsUnsafe(target, key)) { 800 return; 801 } 802 if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) { 803 destination[key] = getMergeFunction(key, options)(target[key], source[key], options); 804 } else { 805 destination[key] = cloneUnlessOtherwiseSpecified(source[key], options); 806 } 807 }); 808 return destination; 809 } 810 function deepmerge(target, source, options) { 811 options = options || {}; 812 options.arrayMerge = options.arrayMerge || defaultArrayMerge; 813 options.isMergeableObject = options.isMergeableObject || isMergeableObject; 814 options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified; 815 var sourceIsArray = Array.isArray(source); 816 var targetIsArray = Array.isArray(target); 817 var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray; 818 if (!sourceAndTargetTypesMatch) { 819 return cloneUnlessOtherwiseSpecified(source, options); 820 } else if (sourceIsArray) { 821 return options.arrayMerge(target, source, options); 822 } else { 823 return mergeObject(target, source, options); 824 } 825 } 826 deepmerge.all = function deepmergeAll(array, options) { 827 if (!Array.isArray(array)) { 828 throw new Error("first argument should be an array"); 829 } 830 return array.reduce(function(prev, next) { 831 return deepmerge(prev, next, options); 832 }, {}); 833 }; 834 var deepmerge_1 = deepmerge; 835 module.exports = deepmerge_1; 836 } 837 }); 838 839 // package-external:@wordpress/core-data 840 var require_core_data = __commonJS({ 841 "package-external:@wordpress/core-data"(exports, module) { 842 module.exports = window.wp.coreData; 843 } 844 }); 845 846 // package-external:@wordpress/notices 847 var require_notices = __commonJS({ 848 "package-external:@wordpress/notices"(exports, module) { 849 module.exports = window.wp.notices; 850 } 851 }); 852 853 // node_modules/clsx/dist/clsx.mjs 854 function r(e2) { 855 var t2, f2, n2 = ""; 856 if ("string" == typeof e2 || "number" == typeof e2) n2 += e2; 857 else if ("object" == typeof e2) if (Array.isArray(e2)) { 858 var o2 = e2.length; 859 for (t2 = 0; t2 < o2; t2++) e2[t2] && (f2 = r(e2[t2])) && (n2 && (n2 += " "), n2 += f2); 860 } else for (f2 in e2) e2[f2] && (n2 && (n2 += " "), n2 += f2); 861 return n2; 862 } 863 function clsx() { 864 for (var e2, t2, f2 = 0, n2 = "", o2 = arguments.length; f2 < o2; f2++) (e2 = arguments[f2]) && (t2 = r(e2)) && (n2 && (n2 += " "), n2 += t2); 865 return n2; 866 } 867 var clsx_default = clsx; 868 869 // packages/ui/build-module/badge/badge.mjs 870 var import_element2 = __toESM(require_element(), 1); 871 872 // node_modules/@base-ui/utils/esm/useControlled.js 873 var React2 = __toESM(require_react(), 1); 874 875 // node_modules/@base-ui/utils/esm/error.js 876 var set; 877 if (true) { 878 set = /* @__PURE__ */ new Set(); 879 } 880 function error(...messages) { 881 if (true) { 882 const messageKey = messages.join(" "); 883 if (!set.has(messageKey)) { 884 set.add(messageKey); 885 console.error(`Base UI: $messageKey}`); 886 } 887 } 888 } 889 890 // node_modules/@base-ui/utils/esm/useControlled.js 891 function useControlled({ 892 controlled, 893 default: defaultProp, 894 name, 895 state = "value" 896 }) { 897 const { 898 current: isControlled 899 } = React2.useRef(controlled !== void 0); 900 const [valueState, setValue] = React2.useState(defaultProp); 901 const value = isControlled ? controlled : valueState; 902 if (true) { 903 React2.useEffect(() => { 904 if (isControlled !== (controlled !== void 0)) { 905 error([`A component is changing the $isControlled ? "" : "un"}controlled $state} state of $name} to be $isControlled ? "un" : ""}controlled.`, "Elements should not switch from uncontrolled to controlled (or vice versa).", `Decide between using a controlled or uncontrolled $name} element for the lifetime of the component.`, "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", "More info: https://fb.me/react-controlled-components"].join("\n")); 906 } 907 }, [state, name, controlled]); 908 const { 909 current: defaultValue2 910 } = React2.useRef(defaultProp); 911 React2.useEffect(() => { 912 if (!isControlled && serializeToDevModeString(defaultValue2) !== serializeToDevModeString(defaultProp)) { 913 error([`A component is changing the default $state} state of an uncontrolled $name} after being initialized. To suppress this warning opt to use a controlled $name}.`].join("\n")); 914 } 915 }, [defaultProp]); 916 } 917 const setValueIfUncontrolled = React2.useCallback((newValue) => { 918 if (!isControlled) { 919 setValue(newValue); 920 } 921 }, []); 922 return [value, setValueIfUncontrolled]; 923 } 924 function serializeToDevModeString(input) { 925 let nextId = 0; 926 const seen = /* @__PURE__ */ new WeakMap(); 927 try { 928 const result = JSON.stringify(input, function replacer(key, value) { 929 if (key === "_owner" && this != null && typeof this === "object" && "$$typeof" in this) { 930 return void 0; 931 } 932 if (typeof value === "bigint") { 933 return `__bigint__:$value}`; 934 } 935 if (value !== null && typeof value === "object") { 936 const id = seen.get(value); 937 if (id !== void 0) { 938 return `__object__:$id}`; 939 } 940 seen.set(value, nextId); 941 nextId += 1; 942 } 943 return value; 944 }); 945 return result ?? `__top__:$typeof input}`; 946 } catch { 947 return "__unserializable__"; 948 } 949 } 950 951 // node_modules/@base-ui/utils/esm/useStableCallback.js 952 var React4 = __toESM(require_react(), 1); 953 954 // node_modules/@base-ui/utils/esm/useRefWithInit.js 955 var React3 = __toESM(require_react(), 1); 956 var UNINITIALIZED = {}; 957 function useRefWithInit(init2, initArg) { 958 const ref = React3.useRef(UNINITIALIZED); 959 if (ref.current === UNINITIALIZED) { 960 ref.current = init2(initArg); 961 } 962 return ref; 963 } 964 965 // node_modules/@base-ui/utils/esm/useStableCallback.js 966 var useInsertionEffect = React4[`useInsertionEffect$Math.random().toFixed(1)}`.slice(0, -3)]; 967 var useSafeInsertionEffect = ( 968 // React 17 doesn't have useInsertionEffect. 969 useInsertionEffect && // Preact replaces useInsertionEffect with useLayoutEffect and fires too late. 970 useInsertionEffect !== React4.useLayoutEffect ? useInsertionEffect : (fn) => fn() 971 ); 972 function useStableCallback(callback) { 973 const stable = useRefWithInit(createStableCallback).current; 974 stable.next = callback; 975 useSafeInsertionEffect(stable.effect); 976 return stable.trampoline; 977 } 978 function createStableCallback() { 979 const stable = { 980 next: void 0, 981 callback: assertNotCalled, 982 trampoline: (...args) => stable.callback?.(...args), 983 effect: () => { 984 stable.callback = stable.next; 985 } 986 }; 987 return stable; 988 } 989 function assertNotCalled() { 990 if (true) { 991 throw ( 992 /* minify-error-disabled */ 993 new Error("Base UI: Cannot call an event handler while rendering.") 994 ); 995 } 996 } 997 998 // node_modules/@base-ui/utils/esm/useIsoLayoutEffect.js 999 var React5 = __toESM(require_react(), 1); 1000 var noop = () => { 1001 }; 1002 var useIsoLayoutEffect = typeof document !== "undefined" ? React5.useLayoutEffect : noop; 1003 1004 // node_modules/@base-ui/utils/esm/warn.js 1005 var set2; 1006 if (true) { 1007 set2 = /* @__PURE__ */ new Set(); 1008 } 1009 function warn(...messages) { 1010 if (true) { 1011 const messageKey = messages.join(" "); 1012 if (!set2.has(messageKey)) { 1013 set2.add(messageKey); 1014 console.warn(`Base UI: $messageKey}`); 1015 } 1016 } 1017 } 1018 1019 // node_modules/@base-ui/react/esm/internals/useRenderElement.js 1020 var React8 = __toESM(require_react(), 1); 1021 1022 // node_modules/@base-ui/utils/esm/useMergedRefs.js 1023 function useMergedRefs(a2, b2, c2, d2) { 1024 const forkRef = useRefWithInit(createForkRef).current; 1025 if (didChange(forkRef, a2, b2, c2, d2)) { 1026 update(forkRef, [a2, b2, c2, d2]); 1027 } 1028 return forkRef.callback; 1029 } 1030 function useMergedRefsN(refs) { 1031 const forkRef = useRefWithInit(createForkRef).current; 1032 if (didChangeN(forkRef, refs)) { 1033 update(forkRef, refs); 1034 } 1035 return forkRef.callback; 1036 } 1037 function createForkRef() { 1038 return { 1039 callback: null, 1040 cleanup: null, 1041 refs: [] 1042 }; 1043 } 1044 function didChange(forkRef, a2, b2, c2, d2) { 1045 return forkRef.refs[0] !== a2 || forkRef.refs[1] !== b2 || forkRef.refs[2] !== c2 || forkRef.refs[3] !== d2; 1046 } 1047 function didChangeN(forkRef, newRefs) { 1048 return forkRef.refs.length !== newRefs.length || forkRef.refs.some((ref, index) => ref !== newRefs[index]); 1049 } 1050 function update(forkRef, refs) { 1051 forkRef.refs = refs; 1052 if (refs.every((ref) => ref == null)) { 1053 forkRef.callback = null; 1054 return; 1055 } 1056 forkRef.callback = (instance) => { 1057 if (forkRef.cleanup) { 1058 forkRef.cleanup(); 1059 forkRef.cleanup = null; 1060 } 1061 if (instance != null) { 1062 const cleanupCallbacks = Array(refs.length).fill(null); 1063 for (let i2 = 0; i2 < refs.length; i2 += 1) { 1064 const ref = refs[i2]; 1065 if (ref == null) { 1066 continue; 1067 } 1068 switch (typeof ref) { 1069 case "function": { 1070 const refCleanup = ref(instance); 1071 if (typeof refCleanup === "function") { 1072 cleanupCallbacks[i2] = refCleanup; 1073 } 1074 break; 1075 } 1076 case "object": { 1077 ref.current = instance; 1078 break; 1079 } 1080 default: 1081 } 1082 } 1083 forkRef.cleanup = () => { 1084 for (let i2 = 0; i2 < refs.length; i2 += 1) { 1085 const ref = refs[i2]; 1086 if (ref == null) { 1087 continue; 1088 } 1089 switch (typeof ref) { 1090 case "function": { 1091 const cleanupCallback = cleanupCallbacks[i2]; 1092 if (typeof cleanupCallback === "function") { 1093 cleanupCallback(); 1094 } else { 1095 ref(null); 1096 } 1097 break; 1098 } 1099 case "object": { 1100 ref.current = null; 1101 break; 1102 } 1103 default: 1104 } 1105 } 1106 }; 1107 } 1108 }; 1109 } 1110 1111 // node_modules/@base-ui/utils/esm/getReactElementRef.js 1112 var React7 = __toESM(require_react(), 1); 1113 1114 // node_modules/@base-ui/utils/esm/reactVersion.js 1115 var React6 = __toESM(require_react(), 1); 1116 var majorVersion = parseInt(React6.version, 10); 1117 function isReactVersionAtLeast(reactVersionToCheck) { 1118 return majorVersion >= reactVersionToCheck; 1119 } 1120 1121 // node_modules/@base-ui/utils/esm/getReactElementRef.js 1122 function getReactElementRef(element) { 1123 if (!/* @__PURE__ */ React7.isValidElement(element)) { 1124 return null; 1125 } 1126 const reactElement = element; 1127 const propsWithRef = reactElement.props; 1128 return (isReactVersionAtLeast(19) ? propsWithRef?.ref : reactElement.ref) ?? null; 1129 } 1130 1131 // node_modules/@base-ui/utils/esm/mergeObjects.js 1132 function mergeObjects(a2, b2) { 1133 if (a2 && !b2) { 1134 return a2; 1135 } 1136 if (!a2 && b2) { 1137 return b2; 1138 } 1139 if (a2 || b2) { 1140 return { 1141 ...a2, 1142 ...b2 1143 }; 1144 } 1145 return void 0; 1146 } 1147 1148 // node_modules/@base-ui/utils/esm/empty.js 1149 var EMPTY_ARRAY = Object.freeze([]); 1150 var EMPTY_OBJECT = Object.freeze({}); 1151 1152 // node_modules/@base-ui/react/esm/internals/getStateAttributesProps.js 1153 function getStateAttributesProps(state, customMapping) { 1154 const props = {}; 1155 for (const key in state) { 1156 const value = state[key]; 1157 if (customMapping?.hasOwnProperty(key)) { 1158 const customProps = customMapping[key](value); 1159 if (customProps != null) { 1160 Object.assign(props, customProps); 1161 } 1162 continue; 1163 } 1164 if (value === true) { 1165 props[`data-$key.toLowerCase()}`] = ""; 1166 } else if (value) { 1167 props[`data-$key.toLowerCase()}`] = value.toString(); 1168 } 1169 } 1170 return props; 1171 } 1172 1173 // node_modules/@base-ui/react/esm/utils/resolveClassName.js 1174 function resolveClassName(className, state) { 1175 return typeof className === "function" ? className(state) : className; 1176 } 1177 1178 // node_modules/@base-ui/react/esm/utils/resolveStyle.js 1179 function resolveStyle(style, state) { 1180 return typeof style === "function" ? style(state) : style; 1181 } 1182 1183 // node_modules/@base-ui/react/esm/merge-props/mergeProps.js 1184 var EMPTY_PROPS = {}; 1185 function mergeProps(a2, b2, c2, d2, e2) { 1186 if (!c2 && !d2 && !e2 && !a2) { 1187 return createInitialMergedProps(b2); 1188 } 1189 let merged = createInitialMergedProps(a2); 1190 if (b2) { 1191 merged = mergeInto(merged, b2); 1192 } 1193 if (c2) { 1194 merged = mergeInto(merged, c2); 1195 } 1196 if (d2) { 1197 merged = mergeInto(merged, d2); 1198 } 1199 if (e2) { 1200 merged = mergeInto(merged, e2); 1201 } 1202 return merged; 1203 } 1204 function mergePropsN(props) { 1205 if (props.length === 0) { 1206 return EMPTY_PROPS; 1207 } 1208 if (props.length === 1) { 1209 return createInitialMergedProps(props[0]); 1210 } 1211 let merged = createInitialMergedProps(props[0]); 1212 for (let i2 = 1; i2 < props.length; i2 += 1) { 1213 merged = mergeInto(merged, props[i2]); 1214 } 1215 return merged; 1216 } 1217 function createInitialMergedProps(inputProps) { 1218 if (isPropsGetter(inputProps)) { 1219 return { 1220 ...resolvePropsGetter(inputProps, EMPTY_PROPS) 1221 }; 1222 } 1223 return copyInitialProps(inputProps); 1224 } 1225 function mergeInto(merged, inputProps) { 1226 if (isPropsGetter(inputProps)) { 1227 return resolvePropsGetter(inputProps, merged); 1228 } 1229 return mutablyMergeInto(merged, inputProps); 1230 } 1231 function copyInitialProps(inputProps) { 1232 const copiedProps = { 1233 ...inputProps 1234 }; 1235 for (const propName in copiedProps) { 1236 const propValue = copiedProps[propName]; 1237 if (isEventHandler(propName, propValue)) { 1238 copiedProps[propName] = wrapEventHandler(propValue); 1239 } 1240 } 1241 return copiedProps; 1242 } 1243 function mutablyMergeInto(mergedProps, externalProps) { 1244 if (!externalProps) { 1245 return mergedProps; 1246 } 1247 for (const propName in externalProps) { 1248 const externalPropValue = externalProps[propName]; 1249 switch (propName) { 1250 case "style": { 1251 mergedProps[propName] = mergeObjects(mergedProps.style, externalPropValue); 1252 break; 1253 } 1254 case "className": { 1255 mergedProps[propName] = mergeClassNames(mergedProps.className, externalPropValue); 1256 break; 1257 } 1258 default: { 1259 if (isEventHandler(propName, externalPropValue)) { 1260 mergedProps[propName] = mergeEventHandlers(mergedProps[propName], externalPropValue); 1261 } else { 1262 mergedProps[propName] = externalPropValue; 1263 } 1264 } 1265 } 1266 } 1267 return mergedProps; 1268 } 1269 function isEventHandler(key, value) { 1270 const code0 = key.charCodeAt(0); 1271 const code1 = key.charCodeAt(1); 1272 const code2 = key.charCodeAt(2); 1273 return code0 === 111 && code1 === 110 && code2 >= 65 && code2 <= 90 && (typeof value === "function" || typeof value === "undefined"); 1274 } 1275 function isPropsGetter(inputProps) { 1276 return typeof inputProps === "function"; 1277 } 1278 function resolvePropsGetter(inputProps, previousProps) { 1279 if (isPropsGetter(inputProps)) { 1280 return inputProps(previousProps); 1281 } 1282 return inputProps ?? EMPTY_PROPS; 1283 } 1284 function mergeEventHandlers(ourHandler, theirHandler) { 1285 if (!theirHandler) { 1286 return ourHandler; 1287 } 1288 if (!ourHandler) { 1289 return wrapEventHandler(theirHandler); 1290 } 1291 return (...args) => { 1292 const event = args[0]; 1293 if (isSyntheticEvent(event)) { 1294 const baseUIEvent = event; 1295 makeEventPreventable(baseUIEvent); 1296 const result2 = theirHandler(...args); 1297 if (!baseUIEvent.baseUIHandlerPrevented) { 1298 ourHandler?.(...args); 1299 } 1300 return result2; 1301 } 1302 const result = theirHandler(...args); 1303 ourHandler?.(...args); 1304 return result; 1305 }; 1306 } 1307 function wrapEventHandler(handler) { 1308 if (!handler) { 1309 return handler; 1310 } 1311 return (...args) => { 1312 const event = args[0]; 1313 if (isSyntheticEvent(event)) { 1314 makeEventPreventable(event); 1315 } 1316 return handler(...args); 1317 }; 1318 } 1319 function makeEventPreventable(event) { 1320 event.preventBaseUIHandler = () => { 1321 event.baseUIHandlerPrevented = true; 1322 }; 1323 return event; 1324 } 1325 function mergeClassNames(ourClassName, theirClassName) { 1326 if (theirClassName) { 1327 if (ourClassName) { 1328 return theirClassName + " " + ourClassName; 1329 } 1330 return theirClassName; 1331 } 1332 return ourClassName; 1333 } 1334 function isSyntheticEvent(event) { 1335 return event != null && typeof event === "object" && "nativeEvent" in event; 1336 } 1337 1338 // node_modules/@base-ui/react/esm/internals/useRenderElement.js 1339 var import_react = __toESM(require_react(), 1); 1340 function useRenderElement(element, componentProps, params = {}) { 1341 const renderProp = componentProps.render; 1342 const outProps = useRenderElementProps(componentProps, params); 1343 if (params.enabled === false) { 1344 return null; 1345 } 1346 const state = params.state ?? EMPTY_OBJECT; 1347 return evaluateRenderProp(element, renderProp, outProps, state); 1348 } 1349 function useRenderElementProps(componentProps, params = {}) { 1350 const { 1351 className: classNameProp, 1352 style: styleProp, 1353 render: renderProp 1354 } = componentProps; 1355 const { 1356 state = EMPTY_OBJECT, 1357 ref, 1358 props, 1359 stateAttributesMapping: stateAttributesMapping2, 1360 enabled = true 1361 } = params; 1362 const className = enabled ? resolveClassName(classNameProp, state) : void 0; 1363 const style = enabled ? resolveStyle(styleProp, state) : void 0; 1364 const stateProps = enabled ? getStateAttributesProps(state, stateAttributesMapping2) : EMPTY_OBJECT; 1365 const resolvedProps = enabled && props ? resolveRenderFunctionProps(props) : void 0; 1366 const outProps = enabled ? mergeObjects(stateProps, resolvedProps) ?? {} : EMPTY_OBJECT; 1367 if (typeof document !== "undefined") { 1368 if (!enabled) { 1369 useMergedRefs(null, null); 1370 } else if (Array.isArray(ref)) { 1371 outProps.ref = useMergedRefsN([outProps.ref, getReactElementRef(renderProp), ...ref]); 1372 } else { 1373 outProps.ref = useMergedRefs(outProps.ref, getReactElementRef(renderProp), ref); 1374 } 1375 } 1376 if (!enabled) { 1377 return EMPTY_OBJECT; 1378 } 1379 if (className !== void 0) { 1380 outProps.className = mergeClassNames(outProps.className, className); 1381 } 1382 if (style !== void 0) { 1383 outProps.style = mergeObjects(outProps.style, style); 1384 } 1385 return outProps; 1386 } 1387 function resolveRenderFunctionProps(props) { 1388 if (Array.isArray(props)) { 1389 return mergePropsN(props); 1390 } 1391 return mergeProps(void 0, props); 1392 } 1393 var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy"); 1394 var COMPONENT_IDENTIFIER_PATTERN = /^[A-Z][A-Za-z0-9$]*$/; 1395 var LOWERCASE_CHARACTER_PATTERN = /[a-z]/; 1396 function evaluateRenderProp(element, render4, props, state) { 1397 if (render4) { 1398 if (typeof render4 === "function") { 1399 if (true) { 1400 warnIfRenderPropLooksLikeComponent(render4); 1401 } 1402 return render4(props, state); 1403 } 1404 const mergedProps = mergeProps(props, render4.props); 1405 mergedProps.ref = props.ref; 1406 let newElement = render4; 1407 if (newElement?.$$typeof === REACT_LAZY_TYPE) { 1408 const children = React8.Children.toArray(render4); 1409 newElement = children[0]; 1410 } 1411 if (true) { 1412 if (!/* @__PURE__ */ React8.isValidElement(newElement)) { 1413 throw new Error(["Base UI: The `render` prop was provided an invalid React element as `React.isValidElement(render)` is `false`.", "A valid React element must be provided to the `render` prop because it is cloned with props to replace the default element.", "https://base-ui.com/r/invalid-render-prop"].join("\n")); 1414 } 1415 } 1416 return /* @__PURE__ */ React8.cloneElement(newElement, mergedProps); 1417 } 1418 if (element) { 1419 if (typeof element === "string") { 1420 return renderTag(element, props); 1421 } 1422 } 1423 throw new Error(true ? "Base UI: Render element or function are not defined." : formatErrorMessage_default(8)); 1424 } 1425 function warnIfRenderPropLooksLikeComponent(renderFn) { 1426 const functionName = renderFn.name; 1427 if (functionName.length === 0) { 1428 return; 1429 } 1430 if (!COMPONENT_IDENTIFIER_PATTERN.test(functionName)) { 1431 return; 1432 } 1433 if (!LOWERCASE_CHARACTER_PATTERN.test(functionName)) { 1434 return; 1435 } 1436 warn(`The \`render\` prop received a function named \`$functionName}\` that starts with an uppercase letter.`, "This usually means a React component was passed directly as `render={Component}`.", "Base UI calls `render` as a plain function, which can break the Rules of Hooks during reconciliation.", "If this is an intentional render callback, rename it to start with a lowercase letter.", "Use `render={<Component />}` or `render={(props) => <Component {...props} />}` instead.", "https://base-ui.com/r/invalid-render-prop"); 1437 } 1438 function renderTag(Tag, props) { 1439 if (Tag === "button") { 1440 return /* @__PURE__ */ (0, import_react.createElement)("button", { 1441 type: "button", 1442 ...props, 1443 key: props.key 1444 }); 1445 } 1446 if (Tag === "img") { 1447 return /* @__PURE__ */ (0, import_react.createElement)("img", { 1448 alt: "", 1449 ...props, 1450 key: props.key 1451 }); 1452 } 1453 return /* @__PURE__ */ React8.createElement(Tag, props); 1454 } 1455 1456 // node_modules/@base-ui/react/esm/internals/reason-parts.js 1457 var reason_parts_exports = {}; 1458 __export(reason_parts_exports, { 1459 cancelOpen: () => cancelOpen, 1460 chipRemovePress: () => chipRemovePress, 1461 clearPress: () => clearPress, 1462 closePress: () => closePress, 1463 closeWatcher: () => closeWatcher, 1464 decrementPress: () => decrementPress, 1465 disabled: () => disabled, 1466 drag: () => drag, 1467 escapeKey: () => escapeKey, 1468 focusOut: () => focusOut, 1469 imperativeAction: () => imperativeAction, 1470 incrementPress: () => incrementPress, 1471 inputBlur: () => inputBlur, 1472 inputChange: () => inputChange, 1473 inputClear: () => inputClear, 1474 inputPaste: () => inputPaste, 1475 inputPress: () => inputPress, 1476 itemPress: () => itemPress, 1477 keyboard: () => keyboard, 1478 linkPress: () => linkPress, 1479 listNavigation: () => listNavigation, 1480 none: () => none, 1481 outsidePress: () => outsidePress, 1482 pointer: () => pointer, 1483 scrub: () => scrub, 1484 siblingOpen: () => siblingOpen, 1485 swipe: () => swipe, 1486 trackPress: () => trackPress, 1487 triggerFocus: () => triggerFocus, 1488 triggerHover: () => triggerHover, 1489 triggerPress: () => triggerPress, 1490 wheel: () => wheel, 1491 windowResize: () => windowResize 1492 }); 1493 var none = "none"; 1494 var triggerPress = "trigger-press"; 1495 var triggerHover = "trigger-hover"; 1496 var triggerFocus = "trigger-focus"; 1497 var outsidePress = "outside-press"; 1498 var itemPress = "item-press"; 1499 var closePress = "close-press"; 1500 var linkPress = "link-press"; 1501 var clearPress = "clear-press"; 1502 var chipRemovePress = "chip-remove-press"; 1503 var trackPress = "track-press"; 1504 var incrementPress = "increment-press"; 1505 var decrementPress = "decrement-press"; 1506 var inputChange = "input-change"; 1507 var inputClear = "input-clear"; 1508 var inputBlur = "input-blur"; 1509 var inputPaste = "input-paste"; 1510 var inputPress = "input-press"; 1511 var focusOut = "focus-out"; 1512 var escapeKey = "escape-key"; 1513 var closeWatcher = "close-watcher"; 1514 var listNavigation = "list-navigation"; 1515 var keyboard = "keyboard"; 1516 var pointer = "pointer"; 1517 var drag = "drag"; 1518 var wheel = "wheel"; 1519 var scrub = "scrub"; 1520 var cancelOpen = "cancel-open"; 1521 var siblingOpen = "sibling-open"; 1522 var disabled = "disabled"; 1523 var imperativeAction = "imperative-action"; 1524 var swipe = "swipe"; 1525 var windowResize = "window-resize"; 1526 1527 // node_modules/@base-ui/react/esm/internals/createBaseUIEventDetails.js 1528 function createChangeEventDetails(reason, event, trigger, customProperties) { 1529 let canceled = false; 1530 let allowPropagation = false; 1531 const custom = customProperties ?? EMPTY_OBJECT; 1532 const details = { 1533 reason, 1534 event: event ?? new Event("base-ui"), 1535 cancel() { 1536 canceled = true; 1537 }, 1538 allowPropagation() { 1539 allowPropagation = true; 1540 }, 1541 get isCanceled() { 1542 return canceled; 1543 }, 1544 get isPropagationAllowed() { 1545 return allowPropagation; 1546 }, 1547 trigger, 1548 ...custom 1549 }; 1550 return details; 1551 } 1552 1553 // node_modules/@base-ui/utils/esm/useId.js 1554 var React10 = __toESM(require_react(), 1); 1555 1556 // node_modules/@base-ui/utils/esm/safeReact.js 1557 var React9 = __toESM(require_react(), 1); 1558 var SafeReact = { 1559 ...React9 1560 }; 1561 1562 // node_modules/@base-ui/utils/esm/useId.js 1563 var globalId = 0; 1564 function useGlobalId(idOverride, prefix = "mui") { 1565 const [defaultId, setDefaultId] = React10.useState(idOverride); 1566 const id = idOverride || defaultId; 1567 React10.useEffect(() => { 1568 if (defaultId == null) { 1569 globalId += 1; 1570 setDefaultId(`$prefix}-$globalId}`); 1571 } 1572 }, [defaultId, prefix]); 1573 return id; 1574 } 1575 var maybeReactUseId = SafeReact.useId; 1576 function useId(idOverride, prefix) { 1577 if (maybeReactUseId !== void 0) { 1578 const reactId = maybeReactUseId(); 1579 return idOverride ?? (prefix ? `$prefix}-$reactId}` : reactId); 1580 } 1581 return useGlobalId(idOverride, prefix); 1582 } 1583 1584 // node_modules/@base-ui/react/esm/internals/useBaseUiId.js 1585 function useBaseUiId(idOverride) { 1586 return useId(idOverride, "base-ui"); 1587 } 1588 1589 // node_modules/@base-ui/react/esm/collapsible/root/useCollapsibleRoot.js 1590 var React13 = __toESM(require_react(), 1); 1591 1592 // node_modules/@base-ui/react/esm/internals/useAnimationsFinished.js 1593 var ReactDOM = __toESM(require_react_dom(), 1); 1594 1595 // node_modules/@base-ui/utils/esm/useOnMount.js 1596 var React11 = __toESM(require_react(), 1); 1597 var EMPTY = []; 1598 function useOnMount(fn) { 1599 React11.useEffect(fn, EMPTY); 1600 } 1601 1602 // node_modules/@base-ui/utils/esm/useAnimationFrame.js 1603 var EMPTY2 = null; 1604 var LAST_RAF = globalThis.requestAnimationFrame; 1605 var Scheduler = class { 1606 /* This implementation uses an array as a backing data-structure for frame callbacks. 1607 * It allows `O(1)` callback cancelling by inserting a `null` in the array, though it 1608 * never calls the native `cancelAnimationFrame` if there are no frames left. This can 1609 * be much more efficient if there is a call pattern that alterns as 1610 * "request-cancel-request-cancel-…". 1611 * But in the case of "request-request-…-cancel-cancel-…", it leaves the final animation 1612 * frame to run anyway. We turn that frame into a `O(1)` no-op via `callbacksCount`. */ 1613 callbacks = []; 1614 callbacksCount = 0; 1615 nextId = 1; 1616 startId = 1; 1617 isScheduled = false; 1618 tick = (timestamp) => { 1619 this.isScheduled = false; 1620 const currentCallbacks = this.callbacks; 1621 const currentCallbacksCount = this.callbacksCount; 1622 this.callbacks = []; 1623 this.callbacksCount = 0; 1624 this.startId = this.nextId; 1625 if (currentCallbacksCount > 0) { 1626 for (let i2 = 0; i2 < currentCallbacks.length; i2 += 1) { 1627 currentCallbacks[i2]?.(timestamp); 1628 } 1629 } 1630 }; 1631 request(fn) { 1632 const id = this.nextId; 1633 this.nextId += 1; 1634 this.callbacks.push(fn); 1635 this.callbacksCount += 1; 1636 const didRAFChange = LAST_RAF !== requestAnimationFrame && (LAST_RAF = requestAnimationFrame, true); 1637 if (!this.isScheduled || didRAFChange) { 1638 requestAnimationFrame(this.tick); 1639 this.isScheduled = true; 1640 } 1641 return id; 1642 } 1643 cancel(id) { 1644 const index = id - this.startId; 1645 if (index < 0 || index >= this.callbacks.length) { 1646 return; 1647 } 1648 this.callbacks[index] = null; 1649 this.callbacksCount -= 1; 1650 } 1651 }; 1652 var scheduler = new Scheduler(); 1653 var AnimationFrame = class _AnimationFrame { 1654 static create() { 1655 return new _AnimationFrame(); 1656 } 1657 static request(fn) { 1658 return scheduler.request(fn); 1659 } 1660 static cancel(id) { 1661 return scheduler.cancel(id); 1662 } 1663 currentId = EMPTY2; 1664 /** 1665 * Executes `fn` after `delay`, clearing any previously scheduled call. 1666 */ 1667 request(fn) { 1668 this.cancel(); 1669 this.currentId = scheduler.request(() => { 1670 this.currentId = EMPTY2; 1671 fn(); 1672 }); 1673 } 1674 cancel = () => { 1675 if (this.currentId !== EMPTY2) { 1676 scheduler.cancel(this.currentId); 1677 this.currentId = EMPTY2; 1678 } 1679 }; 1680 disposeEffect = () => { 1681 return this.cancel; 1682 }; 1683 }; 1684 function useAnimationFrame() { 1685 const timeout = useRefWithInit(AnimationFrame.create).current; 1686 useOnMount(timeout.disposeEffect); 1687 return timeout; 1688 } 1689 1690 // node_modules/@base-ui/react/esm/utils/resolveRef.js 1691 function resolveRef(maybeRef) { 1692 if (maybeRef == null) { 1693 return maybeRef; 1694 } 1695 return "current" in maybeRef ? maybeRef.current : maybeRef; 1696 } 1697 1698 // node_modules/@base-ui/react/esm/internals/stateAttributesMapping.js 1699 var TransitionStatusDataAttributes = /* @__PURE__ */ (function(TransitionStatusDataAttributes2) { 1700 TransitionStatusDataAttributes2["startingStyle"] = "data-starting-style"; 1701 TransitionStatusDataAttributes2["endingStyle"] = "data-ending-style"; 1702 return TransitionStatusDataAttributes2; 1703 })({}); 1704 var STARTING_HOOK = { 1705 [TransitionStatusDataAttributes.startingStyle]: "" 1706 }; 1707 var ENDING_HOOK = { 1708 [TransitionStatusDataAttributes.endingStyle]: "" 1709 }; 1710 var transitionStatusMapping = { 1711 transitionStatus(value) { 1712 if (value === "starting") { 1713 return STARTING_HOOK; 1714 } 1715 if (value === "ending") { 1716 return ENDING_HOOK; 1717 } 1718 return null; 1719 } 1720 }; 1721 1722 // node_modules/@base-ui/react/esm/internals/useAnimationsFinished.js 1723 function useAnimationsFinished(elementOrRef, waitForStartingStyleRemoved = false, treatAbortedAsFinished = true) { 1724 const frame = useAnimationFrame(); 1725 return useStableCallback((fnToExecute, signal = null) => { 1726 frame.cancel(); 1727 const element = resolveRef(elementOrRef); 1728 if (element == null) { 1729 return; 1730 } 1731 const resolvedElement = element; 1732 const done = () => { 1733 ReactDOM.flushSync(fnToExecute); 1734 }; 1735 if (typeof resolvedElement.getAnimations !== "function" || globalThis.BASE_UI_ANIMATIONS_DISABLED) { 1736 fnToExecute(); 1737 return; 1738 } 1739 function exec() { 1740 Promise.all(resolvedElement.getAnimations().map((animation) => animation.finished)).then(() => { 1741 if (!signal?.aborted) { 1742 done(); 1743 } 1744 }).catch(() => { 1745 if (treatAbortedAsFinished) { 1746 if (!signal?.aborted) { 1747 done(); 1748 } 1749 return; 1750 } 1751 const currentAnimations = resolvedElement.getAnimations(); 1752 if (!signal?.aborted && currentAnimations.length > 0 && currentAnimations.some((animation) => animation.pending || animation.playState !== "finished")) { 1753 exec(); 1754 } 1755 }); 1756 } 1757 if (waitForStartingStyleRemoved) { 1758 const startingStyleAttribute = TransitionStatusDataAttributes.startingStyle; 1759 if (!resolvedElement.hasAttribute(startingStyleAttribute)) { 1760 frame.request(exec); 1761 return; 1762 } 1763 const attributeObserver = new MutationObserver(() => { 1764 if (!resolvedElement.hasAttribute(startingStyleAttribute)) { 1765 attributeObserver.disconnect(); 1766 exec(); 1767 } 1768 }); 1769 attributeObserver.observe(resolvedElement, { 1770 attributes: true, 1771 attributeFilter: [startingStyleAttribute] 1772 }); 1773 signal?.addEventListener("abort", () => attributeObserver.disconnect(), { 1774 once: true 1775 }); 1776 return; 1777 } 1778 frame.request(exec); 1779 }); 1780 } 1781 1782 // node_modules/@base-ui/react/esm/internals/useTransitionStatus.js 1783 var React12 = __toESM(require_react(), 1); 1784 function useTransitionStatus(open, enableIdleState = false, deferEndingState = false) { 1785 const [transitionStatus, setTransitionStatus] = React12.useState(open && enableIdleState ? "idle" : void 0); 1786 const [mounted, setMounted] = React12.useState(open); 1787 if (open && !mounted) { 1788 setMounted(true); 1789 setTransitionStatus("starting"); 1790 } 1791 if (!open && mounted && transitionStatus !== "ending" && !deferEndingState) { 1792 setTransitionStatus("ending"); 1793 } 1794 if (!open && !mounted && transitionStatus === "ending") { 1795 setTransitionStatus(void 0); 1796 } 1797 useIsoLayoutEffect(() => { 1798 if (!open && mounted && transitionStatus !== "ending" && deferEndingState) { 1799 const frame = AnimationFrame.request(() => { 1800 setTransitionStatus("ending"); 1801 }); 1802 return () => { 1803 AnimationFrame.cancel(frame); 1804 }; 1805 } 1806 return void 0; 1807 }, [open, mounted, transitionStatus, deferEndingState]); 1808 useIsoLayoutEffect(() => { 1809 if (!open || enableIdleState) { 1810 return void 0; 1811 } 1812 const frame = AnimationFrame.request(() => { 1813 setTransitionStatus(void 0); 1814 }); 1815 return () => { 1816 AnimationFrame.cancel(frame); 1817 }; 1818 }, [enableIdleState, open]); 1819 useIsoLayoutEffect(() => { 1820 if (!open || !enableIdleState) { 1821 return void 0; 1822 } 1823 if (open && mounted && transitionStatus !== "idle") { 1824 setTransitionStatus("starting"); 1825 } 1826 const frame = AnimationFrame.request(() => { 1827 setTransitionStatus("idle"); 1828 }); 1829 return () => { 1830 AnimationFrame.cancel(frame); 1831 }; 1832 }, [enableIdleState, open, mounted, transitionStatus]); 1833 return { 1834 mounted, 1835 setMounted, 1836 transitionStatus 1837 }; 1838 } 1839 1840 // node_modules/@base-ui/react/esm/collapsible/root/useCollapsibleRoot.js 1841 function useCollapsibleRoot(parameters) { 1842 const { 1843 open: openParam, 1844 defaultOpen, 1845 onOpenChange, 1846 disabled: disabled2 1847 } = parameters; 1848 const isControlled = openParam !== void 0; 1849 const [open, setOpen] = useControlled({ 1850 controlled: openParam, 1851 default: defaultOpen, 1852 name: "Collapsible", 1853 state: "open" 1854 }); 1855 const { 1856 mounted, 1857 setMounted, 1858 transitionStatus 1859 } = useTransitionStatus(open, true, true); 1860 const [visible, setVisible] = React13.useState(open); 1861 const [{ 1862 height, 1863 width 1864 }, setDimensions] = React13.useState({ 1865 height: void 0, 1866 width: void 0 1867 }); 1868 const defaultPanelId = useBaseUiId(); 1869 const [panelIdState, setPanelIdState] = React13.useState(); 1870 const panelId = panelIdState ?? defaultPanelId; 1871 const [hiddenUntilFound, setHiddenUntilFound] = React13.useState(false); 1872 const [keepMounted, setKeepMounted] = React13.useState(false); 1873 const abortControllerRef = React13.useRef(null); 1874 const animationTypeRef = React13.useRef(null); 1875 const transitionDimensionRef = React13.useRef(null); 1876 const panelRef = React13.useRef(null); 1877 const runOnceAnimationsFinish = useAnimationsFinished(panelRef, false); 1878 const handleTrigger = useStableCallback((event) => { 1879 const nextOpen = !open; 1880 const eventDetails = createChangeEventDetails(reason_parts_exports.triggerPress, event.nativeEvent); 1881 onOpenChange(nextOpen, eventDetails); 1882 if (eventDetails.isCanceled) { 1883 return; 1884 } 1885 const panel = panelRef.current; 1886 if (animationTypeRef.current === "css-animation" && panel != null) { 1887 panel.style.removeProperty("animation-name"); 1888 } 1889 if (!hiddenUntilFound && !keepMounted) { 1890 if (animationTypeRef.current != null && animationTypeRef.current !== "css-animation") { 1891 if (!mounted && nextOpen) { 1892 setMounted(true); 1893 } 1894 } 1895 if (animationTypeRef.current === "css-animation") { 1896 if (!visible && nextOpen) { 1897 setVisible(true); 1898 } 1899 if (!mounted && nextOpen) { 1900 setMounted(true); 1901 } 1902 } 1903 } 1904 setOpen(nextOpen); 1905 if (animationTypeRef.current === "none" && mounted && !nextOpen) { 1906 setMounted(false); 1907 } 1908 }); 1909 useIsoLayoutEffect(() => { 1910 if (isControlled && animationTypeRef.current === "none" && !open) { 1911 setMounted(false); 1912 } 1913 }, [isControlled, open, openParam, setMounted]); 1914 return React13.useMemo(() => ({ 1915 abortControllerRef, 1916 animationTypeRef, 1917 disabled: disabled2, 1918 handleTrigger, 1919 height, 1920 mounted, 1921 open, 1922 panelId, 1923 panelRef, 1924 runOnceAnimationsFinish, 1925 setDimensions, 1926 setHiddenUntilFound, 1927 setKeepMounted, 1928 setMounted, 1929 setOpen, 1930 setPanelIdState, 1931 setVisible, 1932 transitionDimensionRef, 1933 transitionStatus, 1934 visible, 1935 width 1936 }), [abortControllerRef, animationTypeRef, disabled2, handleTrigger, height, mounted, open, panelId, panelRef, runOnceAnimationsFinish, setDimensions, setHiddenUntilFound, setKeepMounted, setMounted, setOpen, setVisible, transitionDimensionRef, transitionStatus, visible, width]); 1937 } 1938 1939 // node_modules/@base-ui/react/esm/collapsible/root/CollapsibleRootContext.js 1940 var React14 = __toESM(require_react(), 1); 1941 var CollapsibleRootContext = /* @__PURE__ */ React14.createContext(void 0); 1942 if (true) CollapsibleRootContext.displayName = "CollapsibleRootContext"; 1943 function useCollapsibleRootContext() { 1944 const context = React14.useContext(CollapsibleRootContext); 1945 if (context === void 0) { 1946 throw new Error(true ? "Base UI: CollapsibleRootContext is missing. Collapsible parts must be placed within <Collapsible.Root>." : formatErrorMessage_default(15)); 1947 } 1948 return context; 1949 } 1950 1951 // node_modules/@base-ui/react/esm/collapsible/panel/CollapsiblePanelDataAttributes.js 1952 var CollapsiblePanelDataAttributes = (function(CollapsiblePanelDataAttributes2) { 1953 CollapsiblePanelDataAttributes2["open"] = "data-open"; 1954 CollapsiblePanelDataAttributes2["closed"] = "data-closed"; 1955 CollapsiblePanelDataAttributes2[CollapsiblePanelDataAttributes2["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle"; 1956 CollapsiblePanelDataAttributes2[CollapsiblePanelDataAttributes2["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle"; 1957 return CollapsiblePanelDataAttributes2; 1958 })({}); 1959 1960 // node_modules/@base-ui/react/esm/collapsible/trigger/CollapsibleTriggerDataAttributes.js 1961 var CollapsibleTriggerDataAttributes = /* @__PURE__ */ (function(CollapsibleTriggerDataAttributes2) { 1962 CollapsibleTriggerDataAttributes2["panelOpen"] = "data-panel-open"; 1963 return CollapsibleTriggerDataAttributes2; 1964 })({}); 1965 1966 // node_modules/@base-ui/react/esm/utils/collapsibleOpenStateMapping.js 1967 var PANEL_OPEN_HOOK = { 1968 [CollapsiblePanelDataAttributes.open]: "" 1969 }; 1970 var PANEL_CLOSED_HOOK = { 1971 [CollapsiblePanelDataAttributes.closed]: "" 1972 }; 1973 var triggerOpenStateMapping = { 1974 open(value) { 1975 if (value) { 1976 return { 1977 [CollapsibleTriggerDataAttributes.panelOpen]: "" 1978 }; 1979 } 1980 return null; 1981 } 1982 }; 1983 var collapsibleOpenStateMapping = { 1984 open(value) { 1985 if (value) { 1986 return PANEL_OPEN_HOOK; 1987 } 1988 return PANEL_CLOSED_HOOK; 1989 } 1990 }; 1991 1992 // node_modules/@base-ui/react/esm/internals/use-button/useButton.js 1993 var React17 = __toESM(require_react(), 1); 1994 1995 // node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs 1996 function hasWindow() { 1997 return typeof window !== "undefined"; 1998 } 1999 function getWindow(node) { 2000 var _node$ownerDocument; 2001 return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window; 2002 } 2003 function isHTMLElement(value) { 2004 if (!hasWindow()) { 2005 return false; 2006 } 2007 return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement; 2008 } 2009 2010 // node_modules/@base-ui/react/esm/internals/composite/root/CompositeRootContext.js 2011 var React15 = __toESM(require_react(), 1); 2012 var CompositeRootContext = /* @__PURE__ */ React15.createContext(void 0); 2013 if (true) CompositeRootContext.displayName = "CompositeRootContext"; 2014 function useCompositeRootContext(optional = false) { 2015 const context = React15.useContext(CompositeRootContext); 2016 if (context === void 0 && !optional) { 2017 throw new Error(true ? "Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>." : formatErrorMessage_default(16)); 2018 } 2019 return context; 2020 } 2021 2022 // node_modules/@base-ui/react/esm/utils/useFocusableWhenDisabled.js 2023 var React16 = __toESM(require_react(), 1); 2024 function useFocusableWhenDisabled(parameters) { 2025 const { 2026 focusableWhenDisabled, 2027 disabled: disabled2, 2028 composite = false, 2029 tabIndex: tabIndexProp = 0, 2030 isNativeButton 2031 } = parameters; 2032 const isFocusableComposite = composite && focusableWhenDisabled !== false; 2033 const isNonFocusableComposite = composite && focusableWhenDisabled === false; 2034 const props = React16.useMemo(() => { 2035 const additionalProps = { 2036 // allow Tabbing away from focusableWhenDisabled elements 2037 onKeyDown(event) { 2038 if (disabled2 && focusableWhenDisabled && event.key !== "Tab") { 2039 event.preventDefault(); 2040 } 2041 } 2042 }; 2043 if (!composite) { 2044 additionalProps.tabIndex = tabIndexProp; 2045 if (!isNativeButton && disabled2) { 2046 additionalProps.tabIndex = focusableWhenDisabled ? tabIndexProp : -1; 2047 } 2048 } 2049 if (isNativeButton && (focusableWhenDisabled || isFocusableComposite) || !isNativeButton && disabled2) { 2050 additionalProps["aria-disabled"] = disabled2; 2051 } 2052 if (isNativeButton && (!focusableWhenDisabled || isNonFocusableComposite)) { 2053 additionalProps.disabled = disabled2; 2054 } 2055 return additionalProps; 2056 }, [composite, disabled2, focusableWhenDisabled, isFocusableComposite, isNonFocusableComposite, isNativeButton, tabIndexProp]); 2057 return { 2058 props 2059 }; 2060 } 2061 2062 // node_modules/@base-ui/react/esm/internals/use-button/useButton.js 2063 function useButton(parameters = {}) { 2064 const { 2065 disabled: disabled2 = false, 2066 focusableWhenDisabled, 2067 tabIndex = 0, 2068 native: isNativeButton = true, 2069 composite: compositeProp 2070 } = parameters; 2071 const elementRef = React17.useRef(null); 2072 const compositeRootContext = useCompositeRootContext(true); 2073 const isCompositeItem = compositeProp ?? compositeRootContext !== void 0; 2074 const { 2075 props: focusableWhenDisabledProps 2076 } = useFocusableWhenDisabled({ 2077 focusableWhenDisabled, 2078 disabled: disabled2, 2079 composite: isCompositeItem, 2080 tabIndex, 2081 isNativeButton 2082 }); 2083 if (true) { 2084 React17.useEffect(() => { 2085 if (!elementRef.current) { 2086 return; 2087 } 2088 const isButtonTag = isButtonElement(elementRef.current); 2089 if (isNativeButton) { 2090 if (!isButtonTag) { 2091 const ownerStackMessage = SafeReact.captureOwnerStack?.() || ""; 2092 const message2 = "A component that acts as a button expected a native <button> because the `nativeButton` prop is true. Rendering a non-<button> removes native button semantics, which can impact forms and accessibility. Use a real <button> in the `render` prop, or set `nativeButton` to `false`."; 2093 error(`$message2}$ownerStackMessage}`); 2094 } 2095 } else if (isButtonTag) { 2096 const ownerStackMessage = SafeReact.captureOwnerStack?.() || ""; 2097 const message2 = "A component that acts as a button expected a non-<button> because the `nativeButton` prop is false. Rendering a <button> keeps native behavior while Base UI applies non-native attributes and handlers, which can add unintended extra attributes (such as `role` or `aria-disabled`). Use a non-<button> in the `render` prop, or set `nativeButton` to `true`."; 2098 error(`$message2}$ownerStackMessage}`); 2099 } 2100 }, [isNativeButton]); 2101 } 2102 const updateDisabled = React17.useCallback(() => { 2103 const element = elementRef.current; 2104 if (!isButtonElement(element)) { 2105 return; 2106 } 2107 if (isCompositeItem && disabled2 && focusableWhenDisabledProps.disabled === void 0 && element.disabled) { 2108 element.disabled = false; 2109 } 2110 }, [disabled2, focusableWhenDisabledProps.disabled, isCompositeItem]); 2111 useIsoLayoutEffect(updateDisabled, [updateDisabled]); 2112 const getButtonProps = React17.useCallback((externalProps = {}) => { 2113 const { 2114 onClick: externalOnClick, 2115 onMouseDown: externalOnMouseDown, 2116 onKeyUp: externalOnKeyUp, 2117 onKeyDown: externalOnKeyDown, 2118 onPointerDown: externalOnPointerDown, 2119 ...otherExternalProps 2120 } = externalProps; 2121 const type = isNativeButton ? "button" : void 0; 2122 return mergeProps({ 2123 type, 2124 onClick(event) { 2125 if (disabled2) { 2126 event.preventDefault(); 2127 return; 2128 } 2129 externalOnClick?.(event); 2130 }, 2131 onMouseDown(event) { 2132 if (!disabled2) { 2133 externalOnMouseDown?.(event); 2134 } 2135 }, 2136 onKeyDown(event) { 2137 if (disabled2) { 2138 return; 2139 } 2140 makeEventPreventable(event); 2141 externalOnKeyDown?.(event); 2142 if (event.baseUIHandlerPrevented) { 2143 return; 2144 } 2145 const isCurrentTarget = event.target === event.currentTarget; 2146 const currentTarget = event.currentTarget; 2147 const isButton2 = isButtonElement(currentTarget); 2148 const isLink = !isNativeButton && isValidLinkElement(currentTarget); 2149 const shouldClick = isCurrentTarget && (isNativeButton ? isButton2 : !isLink); 2150 const isEnterKey = event.key === "Enter"; 2151 const isSpaceKey = event.key === " "; 2152 const role = currentTarget.getAttribute("role"); 2153 const isTextNavigationRole = role?.startsWith("menuitem") || role === "option" || role === "gridcell"; 2154 if (isCurrentTarget && isCompositeItem && isSpaceKey) { 2155 if (event.defaultPrevented && isTextNavigationRole) { 2156 return; 2157 } 2158 event.preventDefault(); 2159 if (isLink || isNativeButton && isButton2) { 2160 currentTarget.click(); 2161 event.preventBaseUIHandler(); 2162 } else if (shouldClick) { 2163 externalOnClick?.(event); 2164 event.preventBaseUIHandler(); 2165 } 2166 return; 2167 } 2168 if (shouldClick) { 2169 if (!isNativeButton && (isSpaceKey || isEnterKey)) { 2170 event.preventDefault(); 2171 } 2172 if (!isNativeButton && isEnterKey) { 2173 externalOnClick?.(event); 2174 } 2175 } 2176 }, 2177 onKeyUp(event) { 2178 if (disabled2) { 2179 return; 2180 } 2181 makeEventPreventable(event); 2182 externalOnKeyUp?.(event); 2183 if (event.target === event.currentTarget && isNativeButton && isCompositeItem && isButtonElement(event.currentTarget) && event.key === " ") { 2184 event.preventDefault(); 2185 return; 2186 } 2187 if (event.baseUIHandlerPrevented) { 2188 return; 2189 } 2190 if (event.target === event.currentTarget && !isNativeButton && !isCompositeItem && event.key === " ") { 2191 externalOnClick?.(event); 2192 } 2193 }, 2194 onPointerDown(event) { 2195 if (disabled2) { 2196 event.preventDefault(); 2197 return; 2198 } 2199 externalOnPointerDown?.(event); 2200 } 2201 }, !isNativeButton ? { 2202 role: "button" 2203 } : void 0, focusableWhenDisabledProps, otherExternalProps); 2204 }, [disabled2, focusableWhenDisabledProps, isCompositeItem, isNativeButton]); 2205 const buttonRef = useStableCallback((element) => { 2206 elementRef.current = element; 2207 updateDisabled(); 2208 }); 2209 return { 2210 getButtonProps, 2211 buttonRef 2212 }; 2213 } 2214 function isButtonElement(elem) { 2215 return isHTMLElement(elem) && elem.tagName === "BUTTON"; 2216 } 2217 function isValidLinkElement(elem) { 2218 return Boolean(elem?.tagName === "A" && elem?.href); 2219 } 2220 2221 // node_modules/@base-ui/react/esm/collapsible/panel/useCollapsiblePanel.js 2222 var React18 = __toESM(require_react(), 1); 2223 2224 // node_modules/@base-ui/utils/esm/addEventListener.js 2225 function addEventListener(target, type, listener, options) { 2226 target.addEventListener(type, listener, options); 2227 return () => { 2228 target.removeEventListener(type, listener, options); 2229 }; 2230 } 2231 2232 // node_modules/@base-ui/react/esm/accordion/root/AccordionRootDataAttributes.js 2233 var AccordionRootDataAttributes = /* @__PURE__ */ (function(AccordionRootDataAttributes2) { 2234 AccordionRootDataAttributes2["disabled"] = "data-disabled"; 2235 AccordionRootDataAttributes2["orientation"] = "data-orientation"; 2236 return AccordionRootDataAttributes2; 2237 })({}); 2238 2239 // node_modules/@base-ui/react/esm/collapsible/panel/useCollapsiblePanel.js 2240 function useCollapsiblePanel(parameters) { 2241 const { 2242 abortControllerRef, 2243 animationTypeRef, 2244 externalRef, 2245 height, 2246 hiddenUntilFound, 2247 keepMounted, 2248 id: idParam, 2249 mounted, 2250 onOpenChange, 2251 open, 2252 panelRef, 2253 runOnceAnimationsFinish, 2254 setDimensions, 2255 setMounted, 2256 setOpen, 2257 setVisible, 2258 transitionDimensionRef, 2259 visible, 2260 width 2261 } = parameters; 2262 const isBeforeMatchRef = React18.useRef(false); 2263 const latestAnimationNameRef = React18.useRef(null); 2264 const shouldCancelInitialOpenAnimationRef = React18.useRef(open); 2265 const shouldCancelInitialOpenTransitionRef = React18.useRef(open); 2266 const endingStyleFrame = useAnimationFrame(); 2267 const hidden = React18.useMemo(() => { 2268 if (animationTypeRef.current === "css-animation") { 2269 return !visible; 2270 } 2271 return !open && !mounted; 2272 }, [open, mounted, visible, animationTypeRef]); 2273 const handlePanelRef = useStableCallback((element) => { 2274 if (!element) { 2275 return void 0; 2276 } 2277 if (animationTypeRef.current == null || transitionDimensionRef.current == null) { 2278 const panelStyles = getComputedStyle(element); 2279 const hasAnimation = panelStyles.animationName !== "none" && panelStyles.animationName !== ""; 2280 const hasTransition = panelStyles.transitionDuration !== "0s" && panelStyles.transitionDuration !== ""; 2281 if (hasAnimation && hasTransition) { 2282 if (true) { 2283 warn("CSS transitions and CSS animations both detected on Collapsible or Accordion panel.", "Only one of either animation type should be used."); 2284 } 2285 } else if (panelStyles.animationName === "none" && panelStyles.transitionDuration !== "0s") { 2286 animationTypeRef.current = "css-transition"; 2287 } else if (panelStyles.animationName !== "none" && panelStyles.transitionDuration === "0s") { 2288 animationTypeRef.current = "css-animation"; 2289 } else { 2290 animationTypeRef.current = "none"; 2291 } 2292 if (element.getAttribute(AccordionRootDataAttributes.orientation) === "horizontal" || panelStyles.transitionProperty.indexOf("width") > -1) { 2293 transitionDimensionRef.current = "width"; 2294 } else { 2295 transitionDimensionRef.current = "height"; 2296 } 2297 } 2298 if (animationTypeRef.current !== "css-transition") { 2299 return void 0; 2300 } 2301 if (height === void 0 || width === void 0) { 2302 setDimensions({ 2303 height: element.scrollHeight, 2304 width: element.scrollWidth 2305 }); 2306 if (shouldCancelInitialOpenTransitionRef.current) { 2307 element.style.setProperty("transition-duration", "0s"); 2308 } 2309 } 2310 let frame = -1; 2311 let nextFrame = -1; 2312 frame = AnimationFrame.request(() => { 2313 shouldCancelInitialOpenTransitionRef.current = false; 2314 nextFrame = AnimationFrame.request(() => { 2315 setTimeout(() => { 2316 element.style.removeProperty("transition-duration"); 2317 }); 2318 }); 2319 }); 2320 return () => { 2321 AnimationFrame.cancel(frame); 2322 AnimationFrame.cancel(nextFrame); 2323 }; 2324 }); 2325 const mergedPanelRef = useMergedRefs(externalRef, panelRef, handlePanelRef); 2326 useIsoLayoutEffect(() => { 2327 if (animationTypeRef.current !== "css-transition") { 2328 return void 0; 2329 } 2330 const panel = panelRef.current; 2331 if (!panel) { 2332 return void 0; 2333 } 2334 let resizeFrame = -1; 2335 if (abortControllerRef.current != null) { 2336 abortControllerRef.current.abort(); 2337 abortControllerRef.current = null; 2338 } 2339 if (open) { 2340 const originalLayoutStyles = { 2341 "justify-content": panel.style.justifyContent, 2342 "align-items": panel.style.alignItems, 2343 "align-content": panel.style.alignContent, 2344 "justify-items": panel.style.justifyItems 2345 }; 2346 Object.keys(originalLayoutStyles).forEach((key) => { 2347 panel.style.setProperty(key, "initial", "important"); 2348 }); 2349 if (!shouldCancelInitialOpenTransitionRef.current && !keepMounted) { 2350 panel.setAttribute(CollapsiblePanelDataAttributes.startingStyle, ""); 2351 } 2352 setDimensions({ 2353 height: panel.scrollHeight, 2354 width: panel.scrollWidth 2355 }); 2356 resizeFrame = AnimationFrame.request(() => { 2357 Object.entries(originalLayoutStyles).forEach(([key, value]) => { 2358 if (value === "") { 2359 panel.style.removeProperty(key); 2360 } else { 2361 panel.style.setProperty(key, value); 2362 } 2363 }); 2364 }); 2365 } else { 2366 if (panel.scrollHeight === 0 && panel.scrollWidth === 0) { 2367 return void 0; 2368 } 2369 setDimensions({ 2370 height: panel.scrollHeight, 2371 width: panel.scrollWidth 2372 }); 2373 const abortController = new AbortController(); 2374 abortControllerRef.current = abortController; 2375 const signal = abortController.signal; 2376 let attributeObserver = null; 2377 const endingStyleAttribute = CollapsiblePanelDataAttributes.endingStyle; 2378 attributeObserver = new MutationObserver((mutationList) => { 2379 const hasEndingStyle = mutationList.some((mutation) => mutation.type === "attributes" && mutation.attributeName === endingStyleAttribute); 2380 if (hasEndingStyle) { 2381 attributeObserver?.disconnect(); 2382 attributeObserver = null; 2383 runOnceAnimationsFinish(() => { 2384 setDimensions({ 2385 height: 0, 2386 width: 0 2387 }); 2388 panel.style.removeProperty("content-visibility"); 2389 setMounted(false); 2390 if (abortControllerRef.current === abortController) { 2391 abortControllerRef.current = null; 2392 } 2393 }, signal); 2394 } 2395 }); 2396 attributeObserver.observe(panel, { 2397 attributes: true, 2398 attributeFilter: [endingStyleAttribute] 2399 }); 2400 return () => { 2401 attributeObserver?.disconnect(); 2402 endingStyleFrame.cancel(); 2403 if (abortControllerRef.current === abortController) { 2404 abortController.abort(); 2405 abortControllerRef.current = null; 2406 } 2407 }; 2408 } 2409 return () => { 2410 AnimationFrame.cancel(resizeFrame); 2411 }; 2412 }, [abortControllerRef, animationTypeRef, endingStyleFrame, hiddenUntilFound, keepMounted, mounted, open, panelRef, runOnceAnimationsFinish, setDimensions, setMounted]); 2413 useIsoLayoutEffect(() => { 2414 if (animationTypeRef.current !== "css-animation") { 2415 return; 2416 } 2417 const panel = panelRef.current; 2418 if (!panel) { 2419 return; 2420 } 2421 latestAnimationNameRef.current = panel.style.animationName || latestAnimationNameRef.current; 2422 panel.style.setProperty("animation-name", "none"); 2423 setDimensions({ 2424 height: panel.scrollHeight, 2425 width: panel.scrollWidth 2426 }); 2427 if (!shouldCancelInitialOpenAnimationRef.current && !isBeforeMatchRef.current) { 2428 panel.style.removeProperty("animation-name"); 2429 } 2430 if (open) { 2431 if (abortControllerRef.current != null) { 2432 abortControllerRef.current.abort(); 2433 abortControllerRef.current = null; 2434 } 2435 setMounted(true); 2436 setVisible(true); 2437 } else { 2438 abortControllerRef.current = new AbortController(); 2439 runOnceAnimationsFinish(() => { 2440 setMounted(false); 2441 setVisible(false); 2442 abortControllerRef.current = null; 2443 }, abortControllerRef.current.signal); 2444 } 2445 }, [abortControllerRef, animationTypeRef, open, panelRef, runOnceAnimationsFinish, setDimensions, setMounted, setVisible, visible]); 2446 useOnMount(() => { 2447 const frame = AnimationFrame.request(() => { 2448 shouldCancelInitialOpenAnimationRef.current = false; 2449 }); 2450 return () => AnimationFrame.cancel(frame); 2451 }); 2452 useIsoLayoutEffect(() => { 2453 if (!hiddenUntilFound) { 2454 return void 0; 2455 } 2456 const panel = panelRef.current; 2457 if (!panel) { 2458 return void 0; 2459 } 2460 let frame = -1; 2461 let nextFrame = -1; 2462 if (open && isBeforeMatchRef.current) { 2463 panel.style.transitionDuration = "0s"; 2464 setDimensions({ 2465 height: panel.scrollHeight, 2466 width: panel.scrollWidth 2467 }); 2468 frame = AnimationFrame.request(() => { 2469 isBeforeMatchRef.current = false; 2470 nextFrame = AnimationFrame.request(() => { 2471 setTimeout(() => { 2472 panel.style.removeProperty("transition-duration"); 2473 }); 2474 }); 2475 }); 2476 } 2477 return () => { 2478 AnimationFrame.cancel(frame); 2479 AnimationFrame.cancel(nextFrame); 2480 }; 2481 }, [hiddenUntilFound, open, panelRef, setDimensions]); 2482 useIsoLayoutEffect(() => { 2483 const panel = panelRef.current; 2484 if (panel && hiddenUntilFound && hidden) { 2485 panel.setAttribute("hidden", "until-found"); 2486 if (animationTypeRef.current === "css-transition") { 2487 panel.setAttribute(CollapsiblePanelDataAttributes.startingStyle, ""); 2488 } 2489 } 2490 }, [hiddenUntilFound, hidden, animationTypeRef, panelRef]); 2491 React18.useEffect(function registerBeforeMatchListener() { 2492 const panel = panelRef.current; 2493 if (!panel) { 2494 return void 0; 2495 } 2496 function handleBeforeMatch(event) { 2497 isBeforeMatchRef.current = true; 2498 setOpen(true); 2499 onOpenChange(true, createChangeEventDetails(reason_parts_exports.none, event)); 2500 } 2501 return addEventListener(panel, "beforematch", handleBeforeMatch); 2502 }, [onOpenChange, panelRef, setOpen]); 2503 return React18.useMemo(() => ({ 2504 props: { 2505 hidden, 2506 id: idParam, 2507 ref: mergedPanelRef 2508 } 2509 }), [hidden, idParam, mergedPanelRef]); 2510 } 2511 2512 // node_modules/@base-ui/react/esm/internals/useOpenChangeComplete.js 2513 var React19 = __toESM(require_react(), 1); 2514 function useOpenChangeComplete(parameters) { 2515 const { 2516 enabled = true, 2517 open, 2518 ref, 2519 onComplete: onCompleteParam 2520 } = parameters; 2521 const onComplete = useStableCallback(onCompleteParam); 2522 const runOnceAnimationsFinish = useAnimationsFinished(ref, open, false); 2523 React19.useEffect(() => { 2524 if (!enabled) { 2525 return void 0; 2526 } 2527 const abortController = new AbortController(); 2528 runOnceAnimationsFinish(onComplete, abortController.signal); 2529 return () => { 2530 abortController.abort(); 2531 }; 2532 }, [enabled, open, onComplete, runOnceAnimationsFinish]); 2533 } 2534 2535 // node_modules/@base-ui/react/esm/collapsible/index.parts.js 2536 var index_parts_exports = {}; 2537 __export(index_parts_exports, { 2538 Panel: () => CollapsiblePanel, 2539 Root: () => CollapsibleRoot, 2540 Trigger: () => CollapsibleTrigger 2541 }); 2542 2543 // node_modules/@base-ui/react/esm/collapsible/root/CollapsibleRoot.js 2544 var React20 = __toESM(require_react(), 1); 2545 2546 // node_modules/@base-ui/react/esm/collapsible/root/stateAttributesMapping.js 2547 var collapsibleStateAttributesMapping = { 2548 ...collapsibleOpenStateMapping, 2549 ...transitionStatusMapping 2550 }; 2551 2552 // node_modules/@base-ui/react/esm/collapsible/root/CollapsibleRoot.js 2553 var import_jsx_runtime = __toESM(require_jsx_runtime(), 1); 2554 var CollapsibleRoot = /* @__PURE__ */ React20.forwardRef(function CollapsibleRoot2(componentProps, forwardedRef) { 2555 const { 2556 render: render4, 2557 className, 2558 defaultOpen = false, 2559 disabled: disabled2 = false, 2560 onOpenChange: onOpenChangeProp, 2561 open, 2562 style, 2563 ...elementProps 2564 } = componentProps; 2565 const onOpenChange = useStableCallback(onOpenChangeProp); 2566 const collapsible = useCollapsibleRoot({ 2567 open, 2568 defaultOpen, 2569 onOpenChange, 2570 disabled: disabled2 2571 }); 2572 const state = React20.useMemo(() => ({ 2573 open: collapsible.open, 2574 disabled: collapsible.disabled, 2575 transitionStatus: collapsible.transitionStatus 2576 }), [collapsible.open, collapsible.disabled, collapsible.transitionStatus]); 2577 const contextValue = React20.useMemo(() => ({ 2578 ...collapsible, 2579 onOpenChange, 2580 state 2581 }), [collapsible, onOpenChange, state]); 2582 const element = useRenderElement("div", componentProps, { 2583 state, 2584 ref: forwardedRef, 2585 props: elementProps, 2586 stateAttributesMapping: collapsibleStateAttributesMapping 2587 }); 2588 return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CollapsibleRootContext.Provider, { 2589 value: contextValue, 2590 children: element 2591 }); 2592 }); 2593 if (true) CollapsibleRoot.displayName = "CollapsibleRoot"; 2594 2595 // node_modules/@base-ui/react/esm/collapsible/trigger/CollapsibleTrigger.js 2596 var React21 = __toESM(require_react(), 1); 2597 var stateAttributesMapping = { 2598 ...triggerOpenStateMapping, 2599 ...transitionStatusMapping 2600 }; 2601 var CollapsibleTrigger = /* @__PURE__ */ React21.forwardRef(function CollapsibleTrigger2(componentProps, forwardedRef) { 2602 const { 2603 panelId, 2604 open, 2605 handleTrigger, 2606 state, 2607 disabled: contextDisabled 2608 } = useCollapsibleRootContext(); 2609 const { 2610 className, 2611 disabled: disabled2 = contextDisabled, 2612 id, 2613 render: render4, 2614 nativeButton = true, 2615 style, 2616 ...elementProps 2617 } = componentProps; 2618 const { 2619 getButtonProps, 2620 buttonRef 2621 } = useButton({ 2622 disabled: disabled2, 2623 focusableWhenDisabled: true, 2624 native: nativeButton 2625 }); 2626 const props = React21.useMemo(() => ({ 2627 "aria-controls": open ? panelId : void 0, 2628 "aria-expanded": open, 2629 onClick: handleTrigger 2630 }), [panelId, open, handleTrigger]); 2631 const element = useRenderElement("button", componentProps, { 2632 state, 2633 ref: [forwardedRef, buttonRef], 2634 props: [props, elementProps, getButtonProps], 2635 stateAttributesMapping 2636 }); 2637 return element; 2638 }); 2639 if (true) CollapsibleTrigger.displayName = "CollapsibleTrigger"; 2640 2641 // node_modules/@base-ui/react/esm/collapsible/panel/CollapsiblePanel.js 2642 var React22 = __toESM(require_react(), 1); 2643 2644 // node_modules/@base-ui/react/esm/collapsible/panel/CollapsiblePanelCssVars.js 2645 var CollapsiblePanelCssVars = /* @__PURE__ */ (function(CollapsiblePanelCssVars2) { 2646 CollapsiblePanelCssVars2["collapsiblePanelHeight"] = "--collapsible-panel-height"; 2647 CollapsiblePanelCssVars2["collapsiblePanelWidth"] = "--collapsible-panel-width"; 2648 return CollapsiblePanelCssVars2; 2649 })({}); 2650 2651 // node_modules/@base-ui/react/esm/collapsible/panel/CollapsiblePanel.js 2652 var CollapsiblePanel = /* @__PURE__ */ React22.forwardRef(function CollapsiblePanel2(componentProps, forwardedRef) { 2653 const { 2654 className, 2655 hiddenUntilFound: hiddenUntilFoundProp, 2656 keepMounted: keepMountedProp, 2657 render: render4, 2658 id: idProp, 2659 style, 2660 ...elementProps 2661 } = componentProps; 2662 if (true) { 2663 useIsoLayoutEffect(() => { 2664 if (hiddenUntilFoundProp && keepMountedProp === false) { 2665 warn("The `keepMounted={false}` prop on a Collapsible will be ignored when using `hiddenUntilFound` since it requires the Panel to remain mounted even when closed."); 2666 } 2667 }, [hiddenUntilFoundProp, keepMountedProp]); 2668 } 2669 const { 2670 abortControllerRef, 2671 animationTypeRef, 2672 height, 2673 mounted, 2674 onOpenChange, 2675 open, 2676 panelId, 2677 panelRef, 2678 runOnceAnimationsFinish, 2679 setDimensions, 2680 setHiddenUntilFound, 2681 setKeepMounted, 2682 setMounted, 2683 setPanelIdState, 2684 setOpen, 2685 setVisible, 2686 state, 2687 transitionDimensionRef, 2688 visible, 2689 width, 2690 transitionStatus 2691 } = useCollapsibleRootContext(); 2692 const hiddenUntilFound = hiddenUntilFoundProp ?? false; 2693 const keepMounted = keepMountedProp ?? false; 2694 useIsoLayoutEffect(() => { 2695 if (idProp) { 2696 setPanelIdState(idProp); 2697 return () => { 2698 setPanelIdState(void 0); 2699 }; 2700 } 2701 return void 0; 2702 }, [idProp, setPanelIdState]); 2703 useIsoLayoutEffect(() => { 2704 setHiddenUntilFound(hiddenUntilFound); 2705 }, [setHiddenUntilFound, hiddenUntilFound]); 2706 useIsoLayoutEffect(() => { 2707 setKeepMounted(keepMounted); 2708 }, [setKeepMounted, keepMounted]); 2709 const { 2710 props 2711 } = useCollapsiblePanel({ 2712 abortControllerRef, 2713 animationTypeRef, 2714 externalRef: forwardedRef, 2715 height, 2716 hiddenUntilFound, 2717 id: panelId, 2718 keepMounted, 2719 mounted, 2720 onOpenChange, 2721 open, 2722 panelRef, 2723 runOnceAnimationsFinish, 2724 setDimensions, 2725 setMounted, 2726 setOpen, 2727 setVisible, 2728 transitionDimensionRef, 2729 visible, 2730 width 2731 }); 2732 useOpenChangeComplete({ 2733 open: open && transitionStatus === "idle", 2734 ref: panelRef, 2735 onComplete() { 2736 if (!open) { 2737 return; 2738 } 2739 setDimensions({ 2740 height: void 0, 2741 width: void 0 2742 }); 2743 } 2744 }); 2745 const panelState = React22.useMemo(() => ({ 2746 ...state, 2747 transitionStatus 2748 }), [state, transitionStatus]); 2749 const element = useRenderElement("div", componentProps, { 2750 state: panelState, 2751 ref: [forwardedRef, panelRef], 2752 props: [props, { 2753 style: { 2754 [CollapsiblePanelCssVars.collapsiblePanelHeight]: height === void 0 ? "auto" : `$height}px`, 2755 [CollapsiblePanelCssVars.collapsiblePanelWidth]: width === void 0 ? "auto" : `$width}px` 2756 } 2757 }, elementProps], 2758 stateAttributesMapping: collapsibleStateAttributesMapping 2759 }); 2760 const shouldRender = keepMounted || hiddenUntilFound || mounted; 2761 if (!shouldRender) { 2762 return null; 2763 } 2764 return element; 2765 }); 2766 if (true) CollapsiblePanel.displayName = "CollapsiblePanel"; 2767 2768 // node_modules/@base-ui/react/esm/use-render/useRender.js 2769 function useRender(params) { 2770 return useRenderElement(params.defaultTagName ?? "div", params, params); 2771 } 2772 2773 // packages/ui/build-module/text/text.mjs 2774 var import_element = __toESM(require_element(), 1); 2775 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='4130d64bea']")) { 2776 const style = document.createElement("style"); 2777 style.setAttribute("data-wp-hash", "4130d64bea"); 2778 style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._83ed8a8da5dd50ea__text{margin:0}._14437cfb77831647__heading-2xl{--_gcd-heading-font-size:var(--wpds-typography-font-size-2xl,32px);font-size:var(--wpds-typography-font-size-2xl,32px);line-height:var(--wpds-typography-line-height-2xl,40px)}._14437cfb77831647__heading-2xl,._3c78b7fa9b4072dd__heading-xl{font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-typography-font-weight-medium,499)}._3c78b7fa9b4072dd__heading-xl{--_gcd-heading-font-size:var(--wpds-typography-font-size-xl,20px);font-size:var(--wpds-typography-font-size-xl,20px);line-height:var(--wpds-typography-line-height-md,24px)}.aa58f227716bcde2__heading-lg{--_gcd-heading-font-size:var(--wpds-typography-font-size-lg,15px);font-size:var(--wpds-typography-font-size-lg,15px)}.aa58f227716bcde2__heading-lg,.fc4da56d8dfe52c4__heading-md{font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-typography-font-weight-medium,499);line-height:var(--wpds-typography-line-height-sm,20px)}.fc4da56d8dfe52c4__heading-md{--_gcd-heading-font-size:var(--wpds-typography-font-size-md,13px);font-size:var(--wpds-typography-font-size-md,13px)}.a9b78c7c82e8dff7__heading-sm{--_gcd-heading-font-size:var(--wpds-typography-font-size-xs,11px);font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-typography-font-size-xs,11px);font-weight:var(--wpds-typography-font-weight-medium,499);line-height:var(--wpds-typography-line-height-xs,16px);text-transform:uppercase}._305ff559e52180d5__body-xl{--_gcd-p-font-size:var(--wpds-typography-font-size-xl,20px);--_gcd-p-line-height:var(--wpds-typography-line-height-xl,32px);font-size:var(--wpds-typography-font-size-xl,20px);line-height:var(--wpds-typography-line-height-xl,32px)}._305ff559e52180d5__body-xl,.ca1aa3fc2029e958__body-lg{font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-typography-font-weight-regular,400)}.ca1aa3fc2029e958__body-lg{--_gcd-p-font-size:var(--wpds-typography-font-size-lg,15px);--_gcd-p-line-height:var(--wpds-typography-line-height-md,24px);font-size:var(--wpds-typography-font-size-lg,15px);line-height:var(--wpds-typography-line-height-md,24px)}._131101940be12424__body-md{--_gcd-p-font-size:var(--wpds-typography-font-size-md,13px);--_gcd-p-line-height:var(--wpds-typography-line-height-sm,20px);font-size:var(--wpds-typography-font-size-md,13px);line-height:var(--wpds-typography-line-height-sm,20px)}._0e8d87a42c1f75fa__body-sm,._131101940be12424__body-md{font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-weight:var(--wpds-typography-font-weight-regular,400)}._0e8d87a42c1f75fa__body-sm{--_gcd-p-font-size:var(--wpds-typography-font-size-sm,12px);--_gcd-p-line-height:var(--wpds-typography-line-height-xs,16px);font-size:var(--wpds-typography-font-size-sm,12px);line-height:var(--wpds-typography-line-height-xs,16px)}}')); 2779 document.head.appendChild(style); 2780 } 2781 var style_default = { "text": "_83ed8a8da5dd50ea__text", "heading-2xl": "_14437cfb77831647__heading-2xl", "heading-xl": "_3c78b7fa9b4072dd__heading-xl", "heading-lg": "aa58f227716bcde2__heading-lg", "heading-md": "fc4da56d8dfe52c4__heading-md", "heading-sm": "a9b78c7c82e8dff7__heading-sm", "body-xl": "_305ff559e52180d5__body-xl", "body-lg": "ca1aa3fc2029e958__body-lg", "body-md": "_131101940be12424__body-md", "body-sm": "_0e8d87a42c1f75fa__body-sm" }; 2782 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='1fb29d3a3c']")) { 2783 const style = document.createElement("style"); 2784 style.setAttribute("data-wp-hash", "1fb29d3a3c"); 2785 style.appendChild(document.createTextNode("._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,#0000);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 #0000);color:var(--_gcd-input-color,var(--wpds-color-fg-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,#0000);border-color:var(--_gcd-input-border-color-disabled,#0000);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid #0000)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-fg-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid #0000);transition:var(--_gcd-a-transition,none)}")); 2786 document.head.appendChild(style); 2787 } 2788 var global_css_defense_default = { "button": "_6defc79820e382c6__button", "input": "d2cff2e5dea83bd1__input", "textarea": "_547d86373d02e108__textarea", "div": "_8c15fd0ed9f28ba4__div", "p": "_43cec3e1eec1066d__p", "heading": "e97669c6d9a38497__heading", "a": "_2c0831b0499dbd6e__a" }; 2789 var Text = (0, import_element.forwardRef)(function Text2({ variant = "body-md", render: render4, className, ...props }, ref) { 2790 const element = useRender({ 2791 render: render4, 2792 defaultTagName: "span", 2793 ref, 2794 props: mergeProps(props, { 2795 className: clsx_default( 2796 style_default.text, 2797 global_css_defense_default.heading, 2798 global_css_defense_default.p, 2799 style_default[variant], 2800 className 2801 ) 2802 }) 2803 }); 2804 return element; 2805 }); 2806 2807 // packages/ui/build-module/badge/badge.mjs 2808 var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1); 2809 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='d6a685e1aa']")) { 2810 const style = document.createElement("style"); 2811 style.setAttribute("data-wp-hash", "d6a685e1aa"); 2812 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._96e6251aad1a6136__badge{border-radius:var(--wpds-border-radius-lg,8px);padding-block:var(--wpds-dimension-padding-xs,4px);padding-inline:var(--wpds-dimension-padding-sm,8px)}._99f7158cb520f750__is-high-intent{background-color:var(--wpds-color-bg-surface-error,#f6e6e3);color:var(--wpds-color-fg-content-error,#470000)}.c20ebef2365bc8b7__is-medium-intent{background-color:var(--wpds-color-bg-surface-warning,#fde6be);color:var(--wpds-color-fg-content-warning,#2e1900)}._365e1626c6202e52__is-low-intent{background-color:var(--wpds-color-bg-surface-caution,#fee995);color:var(--wpds-color-fg-content-caution,#281d00)}._33f8198127ddf4ef__is-stable-intent{background-color:var(--wpds-color-bg-surface-success,#c6f7cd);color:var(--wpds-color-fg-content-success,#002900)}._04c1aca8fc449412__is-informational-intent{background-color:var(--wpds-color-bg-surface-info,#deebfa);color:var(--wpds-color-fg-content-info,#001b4f)}._90726e69d495ec19__is-draft-intent{background-color:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);color:var(--wpds-color-fg-content-neutral,#1e1e1e)}._898f4a544993bd39__is-none-intent{background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral,#dbdbdb);color:var(--wpds-color-fg-content-neutral,#1e1e1e);padding-block:calc(var(--wpds-dimension-padding-xs, 4px) - var(--wpds-border-width-xs, 1px));padding-inline:calc(var(--wpds-dimension-padding-sm, 8px) - var(--wpds-border-width-xs, 1px))}}")); 2813 document.head.appendChild(style); 2814 } 2815 var style_default2 = { "badge": "_96e6251aad1a6136__badge", "is-high-intent": "_99f7158cb520f750__is-high-intent", "is-medium-intent": "c20ebef2365bc8b7__is-medium-intent", "is-low-intent": "_365e1626c6202e52__is-low-intent", "is-stable-intent": "_33f8198127ddf4ef__is-stable-intent", "is-informational-intent": "_04c1aca8fc449412__is-informational-intent", "is-draft-intent": "_90726e69d495ec19__is-draft-intent", "is-none-intent": "_898f4a544993bd39__is-none-intent" }; 2816 var Badge = (0, import_element2.forwardRef)(function Badge2({ intent = "none", className, ...props }, ref) { 2817 return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)( 2818 Text, 2819 { 2820 ref, 2821 className: clsx_default( 2822 style_default2.badge, 2823 style_default2[`is-$intent}-intent`], 2824 className 2825 ), 2826 ...props, 2827 variant: "body-sm" 2828 } 2829 ); 2830 }); 2831 2832 // packages/ui/build-module/icon/icon.mjs 2833 var import_element3 = __toESM(require_element(), 1); 2834 var import_primitives = __toESM(require_primitives(), 1); 2835 var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1); 2836 var Icon = (0, import_element3.forwardRef)(function Icon2({ icon, size = 24, ...restProps }, ref) { 2837 return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)( 2838 import_primitives.SVG, 2839 { 2840 ref, 2841 fill: "currentColor", 2842 ...icon.props, 2843 ...restProps, 2844 width: size, 2845 height: size 2846 } 2847 ); 2848 }); 2849 2850 // packages/ui/build-module/card/index.mjs 2851 var card_exports = {}; 2852 __export(card_exports, { 2853 Content: () => Content, 2854 FullBleed: () => FullBleed, 2855 Header: () => Header, 2856 Root: () => Root, 2857 Title: () => Title 2858 }); 2859 2860 // packages/ui/build-module/card/root.mjs 2861 var import_element4 = __toESM(require_element(), 1); 2862 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='e3ae230cea']")) { 2863 const style = document.createElement("style"); 2864 style.setAttribute("data-wp-hash", "e3ae230cea"); 2865 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}")); 2866 document.head.appendChild(style); 2867 } 2868 var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" }; 2869 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) { 2870 const style = document.createElement("style"); 2871 style.setAttribute("data-wp-hash", "14f5e9ddeb"); 2872 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}")); 2873 document.head.appendChild(style); 2874 } 2875 var style_default3 = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" }; 2876 var Root = (0, import_element4.forwardRef)(function Card({ render: render4, ...restProps }, ref) { 2877 const mergedClassName = clsx_default(style_default3.root, resets_default["box-sizing"]); 2878 const element = useRender({ 2879 defaultTagName: "div", 2880 render: render4, 2881 ref, 2882 props: mergeProps({ className: mergedClassName }, restProps) 2883 }); 2884 return element; 2885 }); 2886 2887 // packages/ui/build-module/card/header.mjs 2888 var import_element5 = __toESM(require_element(), 1); 2889 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) { 2890 const style = document.createElement("style"); 2891 style.setAttribute("data-wp-hash", "14f5e9ddeb"); 2892 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}")); 2893 document.head.appendChild(style); 2894 } 2895 var style_default4 = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" }; 2896 var Header = (0, import_element5.forwardRef)( 2897 function CardHeader({ render: render4, ...props }, ref) { 2898 const element = useRender({ 2899 defaultTagName: "div", 2900 render: render4, 2901 ref, 2902 props: mergeProps({ className: style_default4.header }, props) 2903 }); 2904 return element; 2905 } 2906 ); 2907 2908 // packages/ui/build-module/card/content.mjs 2909 var import_element6 = __toESM(require_element(), 1); 2910 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) { 2911 const style = document.createElement("style"); 2912 style.setAttribute("data-wp-hash", "14f5e9ddeb"); 2913 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}")); 2914 document.head.appendChild(style); 2915 } 2916 var style_default5 = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" }; 2917 var Content = (0, import_element6.forwardRef)( 2918 function CardContent({ render: render4, ...props }, ref) { 2919 const element = useRender({ 2920 defaultTagName: "div", 2921 render: render4, 2922 ref, 2923 props: mergeProps({ className: style_default5.content }, props) 2924 }); 2925 return element; 2926 } 2927 ); 2928 2929 // packages/ui/build-module/card/full-bleed.mjs 2930 var import_element7 = __toESM(require_element(), 1); 2931 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='14f5e9ddeb']")) { 2932 const style = document.createElement("style"); 2933 style.setAttribute("data-wp-hash", "14f5e9ddeb"); 2934 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._02872bf298eadc43__root{--wp-ui-card-padding:var(--wpds-dimension-padding-2xl,24px);--wp-ui-card-header-content-gap:var(--wpds-dimension-gap-xl,24px);--wp-ui-card-header-content-margin:calc(var(--wp-ui-card-header-content-gap) - var(--wp-ui-card-padding));background-color:var(--wpds-color-bg-surface-neutral-strong,#fff);border:1px solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);border-radius:var(--wpds-border-radius-lg,8px);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-direction:column;overflow:clip}._5dffdaf2a6e669ac__content,.bbccc92e6ba5662d__header{padding:var(--wp-ui-card-padding);&:not(:first-child):not(:last-child){padding-block-end:0}}.bbccc92e6ba5662d__header+._5dffdaf2a6e669ac__content{margin-block-start:var(--wp-ui-card-header-content-margin);padding-block-start:0}.c1fa192587e1b4a6__fullbleed{margin-inline:calc(var(--wp-ui-card-padding)*-1);width:calc(100% + var(--wp-ui-card-padding)*2)}}")); 2935 document.head.appendChild(style); 2936 } 2937 var style_default6 = { "root": "_02872bf298eadc43__root", "header": "bbccc92e6ba5662d__header", "content": "_5dffdaf2a6e669ac__content", "fullbleed": "c1fa192587e1b4a6__fullbleed" }; 2938 var FullBleed = (0, import_element7.forwardRef)( 2939 function CardFullBleed({ render: render4, ...props }, ref) { 2940 const element = useRender({ 2941 defaultTagName: "div", 2942 render: render4, 2943 ref, 2944 props: mergeProps( 2945 { className: style_default6.fullbleed }, 2946 props 2947 ) 2948 }); 2949 return element; 2950 } 2951 ); 2952 2953 // packages/ui/build-module/card/title.mjs 2954 var import_element8 = __toESM(require_element(), 1); 2955 var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1); 2956 var DEFAULT_TAG = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", {}); 2957 var Title = (0, import_element8.forwardRef)( 2958 function CardTitle({ render: render4 = DEFAULT_TAG, children, ...props }, ref) { 2959 return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)( 2960 Text, 2961 { 2962 ref, 2963 variant: "heading-lg", 2964 render: render4, 2965 ...props, 2966 children 2967 } 2968 ); 2969 } 2970 ); 2971 2972 // packages/ui/build-module/collapsible/panel.mjs 2973 var import_element9 = __toESM(require_element(), 1); 2974 var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1); 2975 var Panel = (0, import_element9.forwardRef)( 2976 function CollapsiblePanel3(props, forwardedRef) { 2977 return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(index_parts_exports.Panel, { ref: forwardedRef, ...props }); 2978 } 2979 ); 2980 2981 // packages/ui/build-module/collapsible/root.mjs 2982 var import_element10 = __toESM(require_element(), 1); 2983 var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1); 2984 var Root2 = (0, import_element10.forwardRef)( 2985 function CollapsibleRoot3(props, forwardedRef) { 2986 return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(index_parts_exports.Root, { ref: forwardedRef, ...props }); 2987 } 2988 ); 2989 2990 // packages/ui/build-module/collapsible/trigger.mjs 2991 var import_element11 = __toESM(require_element(), 1); 2992 var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1); 2993 var Trigger = (0, import_element11.forwardRef)( 2994 function CollapsibleTrigger3(props, forwardedRef) { 2995 return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(index_parts_exports.Trigger, { ref: forwardedRef, ...props }); 2996 } 2997 ); 2998 2999 // packages/ui/build-module/collapsible-card/index.mjs 3000 var collapsible_card_exports = {}; 3001 __export(collapsible_card_exports, { 3002 Content: () => Content2, 3003 Header: () => Header2, 3004 HeaderDescription: () => HeaderDescription, 3005 Root: () => Root3 3006 }); 3007 3008 // packages/ui/build-module/collapsible-card/root.mjs 3009 var import_element12 = __toESM(require_element(), 1); 3010 var import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1); 3011 var Root3 = (0, import_element12.forwardRef)( 3012 function CollapsibleCardRoot({ render: render4, ...restProps }, ref) { 3013 return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)( 3014 Root2, 3015 { 3016 ref, 3017 render: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Root, { render: render4 }), 3018 ...restProps 3019 } 3020 ); 3021 } 3022 ); 3023 3024 // packages/ui/build-module/collapsible-card/header.mjs 3025 var import_element14 = __toESM(require_element(), 1); 3026 3027 // packages/icons/build-module/library/arrow-down.mjs 3028 var import_primitives2 = __toESM(require_primitives(), 1); 3029 var import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1); 3030 var arrow_down_default = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_primitives2.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_primitives2.Path, { d: "m16.5 13.5-3.7 3.7V4h-1.5v13.2l-3.8-3.7-1 1 5.5 5.6 5.5-5.6z" }) }); 3031 3032 // packages/icons/build-module/library/arrow-left.mjs 3033 var import_primitives3 = __toESM(require_primitives(), 1); 3034 var import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1); 3035 var arrow_left_default = /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_primitives3.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_primitives3.Path, { d: "M20 11.2H6.8l3.7-3.7-1-1L3.9 12l5.6 5.5 1-1-3.7-3.7H20z" }) }); 3036 3037 // packages/icons/build-module/library/arrow-right.mjs 3038 var import_primitives4 = __toESM(require_primitives(), 1); 3039 var import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1); 3040 var arrow_right_default = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_primitives4.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_primitives4.Path, { d: "m14.5 6.5-1 1 3.7 3.7H4v1.6h13.2l-3.7 3.7 1 1 5.6-5.5z" }) }); 3041 3042 // packages/icons/build-module/library/arrow-up.mjs 3043 var import_primitives5 = __toESM(require_primitives(), 1); 3044 var import_jsx_runtime12 = __toESM(require_jsx_runtime(), 1); 3045 var arrow_up_default = /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_primitives5.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_primitives5.Path, { d: "M12 3.9 6.5 9.5l1 1 3.8-3.7V20h1.5V6.8l3.7 3.7 1-1z" }) }); 3046 3047 // packages/icons/build-module/library/block-table.mjs 3048 var import_primitives6 = __toESM(require_primitives(), 1); 3049 var import_jsx_runtime13 = __toESM(require_jsx_runtime(), 1); 3050 var block_table_default = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_primitives6.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_primitives6.Path, { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM5 4.5h14c.3 0 .5.2.5.5v3.5h-15V5c0-.3.2-.5.5-.5zm8 5.5h6.5v3.5H13V10zm-1.5 3.5h-7V10h7v3.5zm-7 5.5v-4h7v4.5H5c-.3 0-.5-.2-.5-.5zm14.5.5h-6V15h6.5v4c0 .3-.2.5-.5.5z" }) }); 3051 3052 // packages/icons/build-module/library/category.mjs 3053 var import_primitives7 = __toESM(require_primitives(), 1); 3054 var import_jsx_runtime14 = __toESM(require_jsx_runtime(), 1); 3055 var category_default = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_primitives7.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_primitives7.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M6 5.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM4 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2V6zm11-.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM13 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2h-3a2 2 0 01-2-2V6zm5 8.5h-3a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5zM15 13a2 2 0 00-2 2v3a2 2 0 002 2h3a2 2 0 002-2v-3a2 2 0 00-2-2h-3zm-9 1.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5v-3a.5.5 0 01.5-.5zM4 15a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2v-3z" }) }); 3056 3057 // packages/icons/build-module/library/check.mjs 3058 var import_primitives8 = __toESM(require_primitives(), 1); 3059 var import_jsx_runtime15 = __toESM(require_jsx_runtime(), 1); 3060 var check_default = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_primitives8.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_primitives8.Path, { d: "M16.5 7.5 10 13.9l-2.5-2.4-1 1 3.5 3.6 7.5-7.6z" }) }); 3061 3062 // packages/icons/build-module/library/chevron-down.mjs 3063 var import_primitives9 = __toESM(require_primitives(), 1); 3064 var import_jsx_runtime16 = __toESM(require_jsx_runtime(), 1); 3065 var chevron_down_default = /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_primitives9.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_primitives9.Path, { d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z" }) }); 3066 3067 // packages/icons/build-module/library/close-small.mjs 3068 var import_primitives10 = __toESM(require_primitives(), 1); 3069 var import_jsx_runtime17 = __toESM(require_jsx_runtime(), 1); 3070 var close_small_default = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_primitives10.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_primitives10.Path, { d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z" }) }); 3071 3072 // packages/icons/build-module/library/cog.mjs 3073 var import_primitives11 = __toESM(require_primitives(), 1); 3074 var import_jsx_runtime18 = __toESM(require_jsx_runtime(), 1); 3075 var cog_default = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_primitives11.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_primitives11.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10.289 4.836A1 1 0 0111.275 4h1.306a1 1 0 01.987.836l.244 1.466c.787.26 1.503.679 2.108 1.218l1.393-.522a1 1 0 011.216.437l.653 1.13a1 1 0 01-.23 1.273l-1.148.944a6.025 6.025 0 010 2.435l1.149.946a1 1 0 01.23 1.272l-.653 1.13a1 1 0 01-1.216.437l-1.394-.522c-.605.54-1.32.958-2.108 1.218l-.244 1.466a1 1 0 01-.987.836h-1.306a1 1 0 01-.986-.836l-.244-1.466a5.995 5.995 0 01-2.108-1.218l-1.394.522a1 1 0 01-1.217-.436l-.653-1.131a1 1 0 01.23-1.272l1.149-.946a6.026 6.026 0 010-2.435l-1.148-.944a1 1 0 01-.23-1.272l.653-1.131a1 1 0 011.217-.437l1.393.522a5.994 5.994 0 012.108-1.218l.244-1.466zM14.929 12a3 3 0 11-6 0 3 3 0 016 0z" }) }); 3076 3077 // packages/icons/build-module/library/envelope.mjs 3078 var import_primitives12 = __toESM(require_primitives(), 1); 3079 var import_jsx_runtime19 = __toESM(require_jsx_runtime(), 1); 3080 var envelope_default = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_primitives12.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_primitives12.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M3 7c0-1.1.9-2 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7Zm2-.5h14c.3 0 .5.2.5.5v1L12 13.5 4.5 7.9V7c0-.3.2-.5.5-.5Zm-.5 3.3V17c0 .3.2.5.5.5h14c.3 0 .5-.2.5-.5V9.8L12 15.4 4.5 9.8Z" }) }); 3081 3082 // packages/icons/build-module/library/error.mjs 3083 var import_primitives13 = __toESM(require_primitives(), 1); 3084 var import_jsx_runtime20 = __toESM(require_jsx_runtime(), 1); 3085 var error_default = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_primitives13.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_primitives13.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M12.218 5.377a.25.25 0 0 0-.436 0l-7.29 12.96a.25.25 0 0 0 .218.373h14.58a.25.25 0 0 0 .218-.372l-7.29-12.96Zm-1.743-.735c.669-1.19 2.381-1.19 3.05 0l7.29 12.96a1.75 1.75 0 0 1-1.525 2.608H4.71a1.75 1.75 0 0 1-1.525-2.608l7.29-12.96ZM12.75 17.46h-1.5v-1.5h1.5v1.5Zm-1.5-3h1.5v-5h-1.5v5Z" }) }); 3086 3087 // packages/icons/build-module/library/format-list-bullets-rtl.mjs 3088 var import_primitives14 = __toESM(require_primitives(), 1); 3089 var import_jsx_runtime21 = __toESM(require_jsx_runtime(), 1); 3090 var format_list_bullets_rtl_default = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_primitives14.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_primitives14.Path, { d: "M4 8.8h8.9V7.2H4v1.6zm0 7h8.9v-1.5H4v1.5zM18 13c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-3c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z" }) }); 3091 3092 // packages/icons/build-module/library/format-list-bullets.mjs 3093 var import_primitives15 = __toESM(require_primitives(), 1); 3094 var import_jsx_runtime22 = __toESM(require_jsx_runtime(), 1); 3095 var format_list_bullets_default = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_primitives15.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_primitives15.Path, { d: "M11.1 15.8H20v-1.5h-8.9v1.5zm0-8.6v1.5H20V7.2h-8.9zM6 13c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }) }); 3096 3097 // packages/icons/build-module/library/funnel.mjs 3098 var import_primitives16 = __toESM(require_primitives(), 1); 3099 var import_jsx_runtime23 = __toESM(require_jsx_runtime(), 1); 3100 var funnel_default = /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_primitives16.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_primitives16.Path, { d: "M10 17.5H14V16H10V17.5ZM6 6V7.5H18V6H6ZM8 12.5H16V11H8V12.5Z" }) }); 3101 3102 // packages/icons/build-module/library/link.mjs 3103 var import_primitives17 = __toESM(require_primitives(), 1); 3104 var import_jsx_runtime24 = __toESM(require_jsx_runtime(), 1); 3105 var link_default = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_primitives17.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_primitives17.Path, { d: "M10 17.389H8.444A5.194 5.194 0 1 1 8.444 7H10v1.5H8.444a3.694 3.694 0 0 0 0 7.389H10v1.5ZM14 7h1.556a5.194 5.194 0 0 1 0 10.39H14v-1.5h1.556a3.694 3.694 0 0 0 0-7.39H14V7Zm-4.5 6h5v-1.5h-5V13Z" }) }); 3106 3107 // packages/icons/build-module/library/mobile.mjs 3108 var import_primitives18 = __toESM(require_primitives(), 1); 3109 var import_jsx_runtime25 = __toESM(require_jsx_runtime(), 1); 3110 var mobile_default = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_primitives18.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_primitives18.Path, { d: "M15 4H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h6c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm.5 14c0 .3-.2.5-.5.5H9c-.3 0-.5-.2-.5-.5V6c0-.3.2-.5.5-.5h6c.3 0 .5.2.5.5v12zm-4.5-.5h2V16h-2v1.5z" }) }); 3111 3112 // packages/icons/build-module/library/more-vertical.mjs 3113 var import_primitives19 = __toESM(require_primitives(), 1); 3114 var import_jsx_runtime26 = __toESM(require_jsx_runtime(), 1); 3115 var more_vertical_default = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_primitives19.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_primitives19.Path, { d: "M13 19h-2v-2h2v2zm0-6h-2v-2h2v2zm0-6h-2V5h2v2z" }) }); 3116 3117 // packages/icons/build-module/library/next.mjs 3118 var import_primitives20 = __toESM(require_primitives(), 1); 3119 var import_jsx_runtime27 = __toESM(require_jsx_runtime(), 1); 3120 var next_default = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_primitives20.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_primitives20.Path, { d: "M6.6 6L5.4 7l4.5 5-4.5 5 1.1 1 5.5-6-5.4-6zm6 0l-1.1 1 4.5 5-4.5 5 1.1 1 5.5-6-5.5-6z" }) }); 3121 3122 // packages/icons/build-module/library/pencil.mjs 3123 var import_primitives21 = __toESM(require_primitives(), 1); 3124 var import_jsx_runtime28 = __toESM(require_jsx_runtime(), 1); 3125 var pencil_default = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_primitives21.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_primitives21.Path, { d: "m19 7-3-3-8.5 8.5-1 4 4-1L19 7Zm-7 11.5H5V20h7v-1.5Z" }) }); 3126 3127 // packages/icons/build-module/library/previous.mjs 3128 var import_primitives22 = __toESM(require_primitives(), 1); 3129 var import_jsx_runtime29 = __toESM(require_jsx_runtime(), 1); 3130 var previous_default = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_primitives22.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_primitives22.Path, { d: "M11.6 7l-1.1-1L5 12l5.5 6 1.1-1L7 12l4.6-5zm6 0l-1.1-1-5.5 6 5.5 6 1.1-1-4.6-5 4.6-5z" }) }); 3131 3132 // packages/icons/build-module/library/scheduled.mjs 3133 var import_primitives23 = __toESM(require_primitives(), 1); 3134 var import_jsx_runtime30 = __toESM(require_jsx_runtime(), 1); 3135 var scheduled_default = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_primitives23.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_primitives23.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M12 18.5a6.5 6.5 0 1 1 0-13 6.5 6.5 0 0 1 0 13ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm9 1V8h-1.5v3.5h-2V13H13Z" }) }); 3136 3137 // packages/icons/build-module/library/search.mjs 3138 var import_primitives24 = __toESM(require_primitives(), 1); 3139 var import_jsx_runtime31 = __toESM(require_jsx_runtime(), 1); 3140 var search_default = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_primitives24.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_primitives24.Path, { d: "M13 5c-3.3 0-6 2.7-6 6 0 1.4.5 2.7 1.3 3.7l-3.8 3.8 1.1 1.1 3.8-3.8c1 .8 2.3 1.3 3.7 1.3 3.3 0 6-2.7 6-6S16.3 5 13 5zm0 10.5c-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5 4.5 2 4.5 4.5-2 4.5-4.5 4.5z" }) }); 3141 3142 // packages/icons/build-module/library/seen.mjs 3143 var import_primitives25 = __toESM(require_primitives(), 1); 3144 var import_jsx_runtime32 = __toESM(require_jsx_runtime(), 1); 3145 var seen_default = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_primitives25.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_primitives25.Path, { d: "M3.99961 13C4.67043 13.3354 4.6703 13.3357 4.67017 13.3359L4.67298 13.3305C4.67621 13.3242 4.68184 13.3135 4.68988 13.2985C4.70595 13.2686 4.7316 13.2218 4.76695 13.1608C4.8377 13.0385 4.94692 12.8592 5.09541 12.6419C5.39312 12.2062 5.84436 11.624 6.45435 11.0431C7.67308 9.88241 9.49719 8.75 11.9996 8.75C14.502 8.75 16.3261 9.88241 17.5449 11.0431C18.1549 11.624 18.6061 12.2062 18.9038 12.6419C19.0523 12.8592 19.1615 13.0385 19.2323 13.1608C19.2676 13.2218 19.2933 13.2686 19.3093 13.2985C19.3174 13.3135 19.323 13.3242 19.3262 13.3305L19.3291 13.3359C19.3289 13.3357 19.3288 13.3354 19.9996 13C20.6704 12.6646 20.6703 12.6643 20.6701 12.664L20.6697 12.6632L20.6688 12.6614L20.6662 12.6563L20.6583 12.6408C20.6517 12.6282 20.6427 12.6108 20.631 12.5892C20.6078 12.5459 20.5744 12.4852 20.5306 12.4096C20.4432 12.2584 20.3141 12.0471 20.1423 11.7956C19.7994 11.2938 19.2819 10.626 18.5794 9.9569C17.1731 8.61759 14.9972 7.25 11.9996 7.25C9.00203 7.25 6.82614 8.61759 5.41987 9.9569C4.71736 10.626 4.19984 11.2938 3.85694 11.7956C3.68511 12.0471 3.55605 12.2584 3.4686 12.4096C3.42484 12.4852 3.39142 12.5459 3.36818 12.5892C3.35656 12.6108 3.34748 12.6282 3.34092 12.6408L3.33297 12.6563L3.33041 12.6614L3.32948 12.6632L3.32911 12.664C3.32894 12.6643 3.32879 12.6646 3.99961 13ZM11.9996 16C13.9326 16 15.4996 14.433 15.4996 12.5C15.4996 10.567 13.9326 9 11.9996 9C10.0666 9 8.49961 10.567 8.49961 12.5C8.49961 14.433 10.0666 16 11.9996 16Z" }) }); 3146 3147 // packages/icons/build-module/library/unseen.mjs 3148 var import_primitives26 = __toESM(require_primitives(), 1); 3149 var import_jsx_runtime33 = __toESM(require_jsx_runtime(), 1); 3150 var unseen_default = /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_primitives26.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_primitives26.Path, { d: "M20.7 12.7s0-.1-.1-.2c0-.2-.2-.4-.4-.6-.3-.5-.9-1.2-1.6-1.8-.7-.6-1.5-1.3-2.6-1.8l-.6 1.4c.9.4 1.6 1 2.1 1.5.6.6 1.1 1.2 1.4 1.6.1.2.3.4.3.5v.1l.7-.3.7-.3Zm-5.2-9.3-1.8 4c-.5-.1-1.1-.2-1.7-.2-3 0-5.2 1.4-6.6 2.7-.7.7-1.2 1.3-1.6 1.8-.2.3-.3.5-.4.6 0 0 0 .1-.1.2s0 0 .7.3l.7.3V13c0-.1.2-.3.3-.5.3-.4.7-1 1.4-1.6 1.2-1.2 3-2.3 5.5-2.3H13v.3c-.4 0-.8-.1-1.1-.1-1.9 0-3.5 1.6-3.5 3.5s.6 2.3 1.6 2.9l-2 4.4.9.4 7.6-16.2-.9-.4Zm-3 12.6c1.7-.2 3-1.7 3-3.5s-.2-1.4-.6-1.9L12.4 16Z" }) }); 3151 3152 // packages/ui/build-module/collapsible-card/context.mjs 3153 var import_element13 = __toESM(require_element(), 1); 3154 var HeaderDescriptionIdContext = (0, import_element13.createContext)({ 3155 setDescriptionId: () => { 3156 } 3157 }); 3158 3159 // packages/ui/build-module/collapsible-card/header.mjs 3160 var import_jsx_runtime34 = __toESM(require_jsx_runtime(), 1); 3161 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='b49ef575a8']")) { 3162 const style = document.createElement("style"); 3163 style.setAttribute("data-wp-hash", "b49ef575a8"); 3164 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.cab17c7a373cb60d__header-content{flex:1;min-width:0}.dd89d27c4f15912d__header-trigger-positioner{align-self:center;flex-shrink:0;max-height:0;overflow:visible}.bcfab5f2448bafef__header-trigger-wrapper{border-radius:var(--wpds-border-radius-sm,2px);display:flex;translate:0 -50%}._3106f8d2b0330faa__header-trigger{@media not (prefers-reduced-motion){transition:rotate .15s ease-out}}._5d2dfcb4085c6d0f__header[data-panel-open] ._3106f8d2b0330faa__header-trigger{rotate:180deg}._5d2dfcb4085c6d0f__header[data-disabled] ._3106f8d2b0330faa__header-trigger{color:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}.e34cf37ccd0d81e0__content{height:var(--collapsible-panel-height);margin-block-start:var(--wp-ui-card-header-content-margin);overflow:hidden;&._165c4572592944b2__overflowVisible{overflow:visible}&[hidden]:not([hidden=until-found]){display:none}&[data-ending-style],&[data-starting-style]{height:0}@media not (prefers-reduced-motion){transition:all .15s ease-out}}}@layer wp-ui-compositions{._41bfdbf7b6c087c2__content-inner{padding-block-start:0}._5d2dfcb4085c6d0f__header{align-items:stretch;display:flex;flex-direction:row;gap:var(--wpds-dimension-gap-sm,8px);outline:none;&:not([data-disabled]){cursor:var(--wpds-cursor-control,pointer)}}}")); 3165 document.head.appendChild(style); 3166 } 3167 var style_default7 = { "header-content": "cab17c7a373cb60d__header-content", "header-trigger-positioner": "dd89d27c4f15912d__header-trigger-positioner", "header-trigger-wrapper": "bcfab5f2448bafef__header-trigger-wrapper", "header-trigger": "_3106f8d2b0330faa__header-trigger", "header": "_5d2dfcb4085c6d0f__header", "content": "e34cf37ccd0d81e0__content", "overflowVisible": "_165c4572592944b2__overflowVisible", "content-inner": "_41bfdbf7b6c087c2__content-inner" }; 3168 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='1fb29d3a3c']")) { 3169 const style = document.createElement("style"); 3170 style.setAttribute("data-wp-hash", "1fb29d3a3c"); 3171 style.appendChild(document.createTextNode("._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,#0000);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 #0000);color:var(--_gcd-input-color,var(--wpds-color-fg-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,#0000);border-color:var(--_gcd-input-border-color-disabled,#0000);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid #0000)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-fg-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid #0000);transition:var(--_gcd-a-transition,none)}")); 3172 document.head.appendChild(style); 3173 } 3174 var global_css_defense_default2 = { "button": "_6defc79820e382c6__button", "input": "d2cff2e5dea83bd1__input", "textarea": "_547d86373d02e108__textarea", "div": "_8c15fd0ed9f28ba4__div", "p": "_43cec3e1eec1066d__p", "heading": "e97669c6d9a38497__heading", "a": "_2c0831b0499dbd6e__a" }; 3175 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='2a5ab8f3a7']")) { 3176 const style = document.createElement("style"); 3177 style.setAttribute("data-wp-hash", "2a5ab8f3a7"); 3178 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active,.ecadb9e080e2dfa5__outset-ring--focus-parent-visible{@media not (prefers-reduced-motion){--_gcd-a-transition:outline 0.1s ease-out;transition:outline .1s ease-out}outline:0 solid #0000;outline-offset:1px}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active),:focus-visible .ecadb9e080e2dfa5__outset-ring--focus-parent-visible{--_gcd-a-outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));--_gcd-div-outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9))}}")); 3179 document.head.appendChild(style); 3180 } 3181 var focus_default = { "outset-ring--focus": "_08e8a2e44959f892__outset-ring--focus", "outset-ring--focus-except-active": "e25b2bdd7aa21721__outset-ring--focus-except-active", "outset-ring--focus-visible": "d0541bc9dd9dc7b6__outset-ring--focus-visible", "outset-ring--focus-within": "cd83dfc2126a0846__outset-ring--focus-within", "outset-ring--focus-within-except-active": "_970d04df7376df67__outset-ring--focus-within-except-active", "outset-ring--focus-within-visible": "c5cb3ee4bddaa8e4__outset-ring--focus-within-visible", "outset-ring--focus-parent-visible": "ecadb9e080e2dfa5__outset-ring--focus-parent-visible" }; 3182 var Header2 = (0, import_element14.forwardRef)( 3183 function CollapsibleCardHeader({ children, className, render: render4, ...restProps }, ref) { 3184 const [descriptionId, setDescriptionId] = (0, import_element14.useState)(); 3185 const contextValue = (0, import_element14.useMemo)( 3186 () => ({ setDescriptionId }), 3187 [setDescriptionId] 3188 ); 3189 return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(HeaderDescriptionIdContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)( 3190 Trigger, 3191 { 3192 className: clsx_default(style_default7.header, className), 3193 render: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)( 3194 Header, 3195 { 3196 ref, 3197 render: render4, 3198 ...restProps 3199 } 3200 ), 3201 nativeButton: false, 3202 "aria-describedby": descriptionId, 3203 children: [ 3204 /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: style_default7["header-content"], children }), 3205 /* @__PURE__ */ (0, import_jsx_runtime34.jsx)( 3206 "div", 3207 { 3208 className: clsx_default( 3209 style_default7["header-trigger-positioner"] 3210 ), 3211 children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)( 3212 "div", 3213 { 3214 className: clsx_default( 3215 style_default7["header-trigger-wrapper"], 3216 global_css_defense_default2.div, 3217 // While the interactive trigger element is the whole header, 3218 // the focus ring will be displayed only on the icon to visually 3219 // emulate it being the button. 3220 focus_default["outset-ring--focus-parent-visible"] 3221 ), 3222 children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)( 3223 Icon, 3224 { 3225 icon: chevron_down_default, 3226 className: style_default7["header-trigger"] 3227 } 3228 ) 3229 } 3230 ) 3231 } 3232 ) 3233 ] 3234 } 3235 ) }); 3236 } 3237 ); 3238 3239 // packages/ui/build-module/collapsible-card/header-description.mjs 3240 var import_element15 = __toESM(require_element(), 1); 3241 var import_jsx_runtime35 = __toESM(require_jsx_runtime(), 1); 3242 var HeaderDescription = (0, import_element15.forwardRef)(function CollapsibleCardHeaderDescription({ children, className, ...restProps }, ref) { 3243 const descriptionId = (0, import_element15.useId)(); 3244 const { setDescriptionId } = (0, import_element15.useContext)(HeaderDescriptionIdContext); 3245 (0, import_element15.useEffect)(() => { 3246 setDescriptionId(descriptionId); 3247 return () => setDescriptionId(void 0); 3248 }, [descriptionId, setDescriptionId]); 3249 return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)( 3250 "div", 3251 { 3252 ref, 3253 id: descriptionId, 3254 "aria-hidden": "true", 3255 className, 3256 ...restProps, 3257 children 3258 } 3259 ); 3260 }); 3261 3262 // packages/ui/build-module/collapsible-card/content.mjs 3263 var import_element16 = __toESM(require_element(), 1); 3264 var import_jsx_runtime36 = __toESM(require_jsx_runtime(), 1); 3265 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='b49ef575a8']")) { 3266 const style = document.createElement("style"); 3267 style.setAttribute("data-wp-hash", "b49ef575a8"); 3268 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.cab17c7a373cb60d__header-content{flex:1;min-width:0}.dd89d27c4f15912d__header-trigger-positioner{align-self:center;flex-shrink:0;max-height:0;overflow:visible}.bcfab5f2448bafef__header-trigger-wrapper{border-radius:var(--wpds-border-radius-sm,2px);display:flex;translate:0 -50%}._3106f8d2b0330faa__header-trigger{@media not (prefers-reduced-motion){transition:rotate .15s ease-out}}._5d2dfcb4085c6d0f__header[data-panel-open] ._3106f8d2b0330faa__header-trigger{rotate:180deg}._5d2dfcb4085c6d0f__header[data-disabled] ._3106f8d2b0330faa__header-trigger{color:var(--wpds-color-fg-interactive-neutral-disabled,#8d8d8d)}.e34cf37ccd0d81e0__content{height:var(--collapsible-panel-height);margin-block-start:var(--wp-ui-card-header-content-margin);overflow:hidden;&._165c4572592944b2__overflowVisible{overflow:visible}&[hidden]:not([hidden=until-found]){display:none}&[data-ending-style],&[data-starting-style]{height:0}@media not (prefers-reduced-motion){transition:all .15s ease-out}}}@layer wp-ui-compositions{._41bfdbf7b6c087c2__content-inner{padding-block-start:0}._5d2dfcb4085c6d0f__header{align-items:stretch;display:flex;flex-direction:row;gap:var(--wpds-dimension-gap-sm,8px);outline:none;&:not([data-disabled]){cursor:var(--wpds-cursor-control,pointer)}}}")); 3269 document.head.appendChild(style); 3270 } 3271 var style_default8 = { "header-content": "cab17c7a373cb60d__header-content", "header-trigger-positioner": "dd89d27c4f15912d__header-trigger-positioner", "header-trigger-wrapper": "bcfab5f2448bafef__header-trigger-wrapper", "header-trigger": "_3106f8d2b0330faa__header-trigger", "header": "_5d2dfcb4085c6d0f__header", "content": "e34cf37ccd0d81e0__content", "overflowVisible": "_165c4572592944b2__overflowVisible", "content-inner": "_41bfdbf7b6c087c2__content-inner" }; 3272 var Content2 = (0, import_element16.forwardRef)( 3273 function CollapsibleCardContent({ className, render: render4, children, hiddenUntilFound = true, ...restProps }, ref) { 3274 return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)( 3275 Panel, 3276 { 3277 ref, 3278 className: (state) => clsx_default( 3279 style_default8.content, 3280 state.open && state.transitionStatus === "idle" && style_default8.overflowVisible, 3281 className 3282 ), 3283 hiddenUntilFound, 3284 ...restProps, 3285 children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)( 3286 Content, 3287 { 3288 className: style_default8["content-inner"], 3289 render: render4, 3290 children 3291 } 3292 ) 3293 } 3294 ); 3295 } 3296 ); 3297 3298 // packages/ui/build-module/stack/stack.mjs 3299 var import_element17 = __toESM(require_element(), 1); 3300 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='b51ff41489']")) { 3301 const style = document.createElement("style"); 3302 style.setAttribute("data-wp-hash", "b51ff41489"); 3303 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._19ce0419607e1896__stack{display:flex}}")); 3304 document.head.appendChild(style); 3305 } 3306 var style_default9 = { "stack": "_19ce0419607e1896__stack" }; 3307 var gapTokens = { 3308 xs: "var(--wpds-dimension-gap-xs, 4px)", 3309 sm: "var(--wpds-dimension-gap-sm, 8px)", 3310 md: "var(--wpds-dimension-gap-md, 12px)", 3311 lg: "var(--wpds-dimension-gap-lg, 16px)", 3312 xl: "var(--wpds-dimension-gap-xl, 24px)", 3313 "2xl": "var(--wpds-dimension-gap-2xl, 32px)", 3314 "3xl": "var(--wpds-dimension-gap-3xl, 40px)" 3315 }; 3316 var Stack = (0, import_element17.forwardRef)(function Stack2({ direction, gap, align, justify, wrap, render: render4, ...props }, ref) { 3317 const style = { 3318 gap: gap && gapTokens[gap], 3319 alignItems: align, 3320 justifyContent: justify, 3321 flexDirection: direction, 3322 flexWrap: wrap 3323 }; 3324 const element = useRender({ 3325 render: render4, 3326 ref, 3327 props: mergeProps(props, { style, className: style_default9.stack }) 3328 }); 3329 return element; 3330 }); 3331 3332 // packages/ui/build-module/visually-hidden/visually-hidden.mjs 3333 var import_element18 = __toESM(require_element(), 1); 3334 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='c46e8cb841']")) { 3335 const style = document.createElement("style"); 3336 style.setAttribute("data-wp-hash", "c46e8cb841"); 3337 style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}")); 3338 document.head.appendChild(style); 3339 } 3340 var style_default10 = { "visually-hidden": "f37b9e2e191ebd66__visually-hidden" }; 3341 var VisuallyHidden = (0, import_element18.forwardRef)( 3342 function VisuallyHidden2({ render: render4, ...restProps }, ref) { 3343 const element = useRender({ 3344 render: render4, 3345 ref, 3346 props: mergeProps( 3347 { className: style_default10["visually-hidden"] }, 3348 restProps, 3349 { 3350 // @ts-expect-error Arbitrary data-* attributes aren't indexable on the typed div props. Kept hardcoded so consumers can't change or remove it. 3351 "data-visually-hidden": "" 3352 } 3353 ) 3354 }); 3355 return element; 3356 } 3357 ); 3358 3359 // packages/admin-ui/build-module/navigable-region/index.mjs 3360 var import_element19 = __toESM(require_element(), 1); 3361 var import_jsx_runtime37 = __toESM(require_jsx_runtime(), 1); 3362 var NavigableRegion = (0, import_element19.forwardRef)( 3363 ({ children, className, ariaLabel, as: Tag = "div", ...props }, ref) => { 3364 return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)( 3365 Tag, 3366 { 3367 ref, 3368 className: clsx_default("admin-ui-navigable-region", className), 3369 "aria-label": ariaLabel, 3370 role: "region", 3371 tabIndex: "-1", 3372 ...props, 3373 children 3374 } 3375 ); 3376 } 3377 ); 3378 NavigableRegion.displayName = "NavigableRegion"; 3379 var navigable_region_default = NavigableRegion; 3380 3381 // packages/admin-ui/build-module/page/sidebar-toggle-slot.mjs 3382 var import_components = __toESM(require_components(), 1); 3383 var { Fill: SidebarToggleFill, Slot: SidebarToggleSlot } = (0, import_components.createSlotFill)("SidebarToggle"); 3384 3385 // packages/admin-ui/build-module/page/header.mjs 3386 var import_jsx_runtime38 = __toESM(require_jsx_runtime(), 1); 3387 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='aa9c241ccc']")) { 3388 const style = document.createElement("style"); 3389 style.setAttribute("data-wp-hash", "aa9c241ccc"); 3390 style.appendChild(document.createTextNode("._956b6df0898efed0__page{text-wrap:pretty;background-color:var(--wpds-color-bg-surface-neutral,#fcfcfc);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-flow:column;height:100%;position:relative;z-index:1}._0625b55e82a0d93d__header{background:var(--wpds-color-bg-surface-neutral-strong,#fff);border-block-end:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);inset-block-start:0;padding:var(--wpds-dimension-padding-lg,16px) var(--wpds-dimension-padding-2xl,24px);position:sticky;z-index:1}.a43c44d5ae28b2e8__header-content{min-height:calc(var(--wpds-dimension-base, 4px)*8)}.b7cb5b9daf3a3b25__header-actions{flex-shrink:0}._8113be94e7caf73c__header-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._9a776c7f70996f61__header-visual{display:grid;flex-shrink:0;grid-template-columns:1fr;grid-template-rows:1fr;height:calc(var(--wpds-dimension-base, 4px)*6);width:calc(var(--wpds-dimension-base, 4px)*6);>*{grid-column:1/-1;grid-row:1/-1;max-height:100%;max-width:100%}}.d5e0920cd15d35bc__sidebar-toggle-slot:empty{display:none}._60fea2f6bf5319cd__header-subtitle{color:var(--wpds-color-fg-content-neutral-weak,#707070);padding-block-end:var(--wpds-dimension-padding-xs,4px)}.be5e57d029ec4036__content{display:flex;flex-direction:column;flex-grow:1;overflow:auto;&._128806d0b26e3a50__has-padding{padding:var(--wpds-dimension-padding-lg,16px) var(--wpds-dimension-padding-2xl,24px)}}")); 3391 document.head.appendChild(style); 3392 } 3393 var style_default11 = { "page": "_956b6df0898efed0__page", "header": "_0625b55e82a0d93d__header", "header-content": "a43c44d5ae28b2e8__header-content", "header-actions": "b7cb5b9daf3a3b25__header-actions", "header-title": "_8113be94e7caf73c__header-title", "header-visual": "_9a776c7f70996f61__header-visual", "sidebar-toggle-slot": "d5e0920cd15d35bc__sidebar-toggle-slot", "header-subtitle": "_60fea2f6bf5319cd__header-subtitle", "content": "be5e57d029ec4036__content", "has-padding": "_128806d0b26e3a50__has-padding" }; 3394 function Header3({ 3395 headingLevel = 1, 3396 breadcrumbs, 3397 badges, 3398 visual, 3399 title, 3400 subTitle, 3401 actions, 3402 showSidebarToggle = true 3403 }) { 3404 const HeadingTag = `h$headingLevel}`; 3405 return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)( 3406 Stack, 3407 { 3408 direction: "column", 3409 className: style_default11.header, 3410 render: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("header", {}), 3411 children: [ 3412 /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)( 3413 Stack, 3414 { 3415 className: style_default11["header-content"], 3416 direction: "row", 3417 gap: "sm", 3418 justify: "space-between", 3419 children: [ 3420 /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Stack, { direction: "row", gap: "sm", align: "center", justify: "start", children: [ 3421 showSidebarToggle && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)( 3422 SidebarToggleSlot, 3423 { 3424 bubblesVirtually: true, 3425 className: style_default11["sidebar-toggle-slot"] 3426 } 3427 ), 3428 visual && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)( 3429 "div", 3430 { 3431 className: style_default11["header-visual"], 3432 "aria-hidden": "true", 3433 children: visual 3434 } 3435 ), 3436 title && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)( 3437 Text, 3438 { 3439 className: style_default11["header-title"], 3440 render: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(HeadingTag, {}), 3441 variant: "heading-lg", 3442 children: title 3443 } 3444 ), 3445 breadcrumbs, 3446 badges 3447 ] }), 3448 actions && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)( 3449 Stack, 3450 { 3451 align: "center", 3452 className: style_default11["header-actions"], 3453 direction: "row", 3454 gap: "sm", 3455 children: actions 3456 } 3457 ) 3458 ] 3459 } 3460 ), 3461 subTitle && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)( 3462 Text, 3463 { 3464 render: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", {}), 3465 variant: "body-md", 3466 className: style_default11["header-subtitle"], 3467 children: subTitle 3468 } 3469 ) 3470 ] 3471 } 3472 ); 3473 } 3474 3475 // packages/admin-ui/build-module/page/index.mjs 3476 var import_jsx_runtime39 = __toESM(require_jsx_runtime(), 1); 3477 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='aa9c241ccc']")) { 3478 const style = document.createElement("style"); 3479 style.setAttribute("data-wp-hash", "aa9c241ccc"); 3480 style.appendChild(document.createTextNode("._956b6df0898efed0__page{text-wrap:pretty;background-color:var(--wpds-color-bg-surface-neutral,#fcfcfc);color:var(--wpds-color-fg-content-neutral,#1e1e1e);display:flex;flex-flow:column;height:100%;position:relative;z-index:1}._0625b55e82a0d93d__header{background:var(--wpds-color-bg-surface-neutral-strong,#fff);border-block-end:var(--wpds-border-width-xs,1px) solid var(--wpds-color-stroke-surface-neutral-weak,#e4e4e4);inset-block-start:0;padding:var(--wpds-dimension-padding-lg,16px) var(--wpds-dimension-padding-2xl,24px);position:sticky;z-index:1}.a43c44d5ae28b2e8__header-content{min-height:calc(var(--wpds-dimension-base, 4px)*8)}.b7cb5b9daf3a3b25__header-actions{flex-shrink:0}._8113be94e7caf73c__header-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._9a776c7f70996f61__header-visual{display:grid;flex-shrink:0;grid-template-columns:1fr;grid-template-rows:1fr;height:calc(var(--wpds-dimension-base, 4px)*6);width:calc(var(--wpds-dimension-base, 4px)*6);>*{grid-column:1/-1;grid-row:1/-1;max-height:100%;max-width:100%}}.d5e0920cd15d35bc__sidebar-toggle-slot:empty{display:none}._60fea2f6bf5319cd__header-subtitle{color:var(--wpds-color-fg-content-neutral-weak,#707070);padding-block-end:var(--wpds-dimension-padding-xs,4px)}.be5e57d029ec4036__content{display:flex;flex-direction:column;flex-grow:1;overflow:auto;&._128806d0b26e3a50__has-padding{padding:var(--wpds-dimension-padding-lg,16px) var(--wpds-dimension-padding-2xl,24px)}}")); 3481 document.head.appendChild(style); 3482 } 3483 var style_default12 = { "page": "_956b6df0898efed0__page", "header": "_0625b55e82a0d93d__header", "header-content": "a43c44d5ae28b2e8__header-content", "header-actions": "b7cb5b9daf3a3b25__header-actions", "header-title": "_8113be94e7caf73c__header-title", "header-visual": "_9a776c7f70996f61__header-visual", "sidebar-toggle-slot": "d5e0920cd15d35bc__sidebar-toggle-slot", "header-subtitle": "_60fea2f6bf5319cd__header-subtitle", "content": "be5e57d029ec4036__content", "has-padding": "_128806d0b26e3a50__has-padding" }; 3484 function Page({ 3485 headingLevel, 3486 breadcrumbs, 3487 badges, 3488 visual, 3489 title, 3490 subTitle, 3491 children, 3492 className, 3493 actions, 3494 ariaLabel, 3495 hasPadding = false, 3496 showSidebarToggle = true 3497 }) { 3498 const classes = clsx_default(style_default12.page, className); 3499 const effectiveAriaLabel = ariaLabel ?? (typeof title === "string" ? title : ""); 3500 return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(navigable_region_default, { className: classes, ariaLabel: effectiveAriaLabel, children: [ 3501 (title || breadcrumbs || badges || actions || visual) && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)( 3502 Header3, 3503 { 3504 headingLevel, 3505 breadcrumbs, 3506 badges, 3507 visual, 3508 title, 3509 subTitle, 3510 actions, 3511 showSidebarToggle 3512 } 3513 ), 3514 hasPadding ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)( 3515 "div", 3516 { 3517 className: clsx_default( 3518 style_default12.content, 3519 style_default12["has-padding"] 3520 ), 3521 children 3522 } 3523 ) : children 3524 ] }); 3525 } 3526 Page.SidebarToggleFill = SidebarToggleFill; 3527 var page_default = Page; 3528 3529 // routes/taxonomies/stage.tsx 3530 var import_components53 = __toESM(require_components()); 3531 3532 // packages/dataviews/build-module/dataviews/index.mjs 3533 var import_element75 = __toESM(require_element(), 1); 3534 var import_compose12 = __toESM(require_compose(), 1); 3535 3536 // packages/dataviews/build-module/components/dataviews-context/index.mjs 3537 var import_element20 = __toESM(require_element(), 1); 3538 3539 // packages/dataviews/build-module/constants.mjs 3540 var import_i18n = __toESM(require_i18n(), 1); 3541 var OPERATOR_IS_ANY = "isAny"; 3542 var OPERATOR_IS_NONE = "isNone"; 3543 var OPERATOR_IS_ALL = "isAll"; 3544 var OPERATOR_IS_NOT_ALL = "isNotAll"; 3545 var OPERATOR_BETWEEN = "between"; 3546 var OPERATOR_IN_THE_PAST = "inThePast"; 3547 var OPERATOR_OVER = "over"; 3548 var OPERATOR_IS = "is"; 3549 var OPERATOR_IS_NOT = "isNot"; 3550 var OPERATOR_LESS_THAN = "lessThan"; 3551 var OPERATOR_GREATER_THAN = "greaterThan"; 3552 var OPERATOR_LESS_THAN_OR_EQUAL = "lessThanOrEqual"; 3553 var OPERATOR_GREATER_THAN_OR_EQUAL = "greaterThanOrEqual"; 3554 var OPERATOR_BEFORE = "before"; 3555 var OPERATOR_AFTER = "after"; 3556 var OPERATOR_BEFORE_INC = "beforeInc"; 3557 var OPERATOR_AFTER_INC = "afterInc"; 3558 var OPERATOR_CONTAINS = "contains"; 3559 var OPERATOR_NOT_CONTAINS = "notContains"; 3560 var OPERATOR_STARTS_WITH = "startsWith"; 3561 var OPERATOR_ON = "on"; 3562 var OPERATOR_NOT_ON = "notOn"; 3563 var SORTING_DIRECTIONS = ["asc", "desc"]; 3564 var sortArrows = { asc: "\u2191", desc: "\u2193" }; 3565 var sortValues = { asc: "ascending", desc: "descending" }; 3566 var sortLabels = { 3567 asc: (0, import_i18n.__)("Sort ascending"), 3568 desc: (0, import_i18n.__)("Sort descending") 3569 }; 3570 var sortIcons = { 3571 asc: arrow_up_default, 3572 desc: arrow_down_default 3573 }; 3574 var LAYOUT_TABLE = "table"; 3575 var LAYOUT_GRID = "grid"; 3576 var LAYOUT_LIST = "list"; 3577 var LAYOUT_ACTIVITY = "activity"; 3578 var LAYOUT_PICKER_GRID = "pickerGrid"; 3579 var LAYOUT_PICKER_TABLE = "pickerTable"; 3580 3581 // packages/dataviews/build-module/components/dataviews-context/index.mjs 3582 var DataViewsContext = (0, import_element20.createContext)({ 3583 view: { type: LAYOUT_TABLE }, 3584 onChangeView: () => { 3585 }, 3586 fields: [], 3587 data: [], 3588 paginationInfo: { 3589 totalItems: 0, 3590 totalPages: 0 3591 }, 3592 selection: [], 3593 onChangeSelection: () => { 3594 }, 3595 setOpenedFilter: () => { 3596 }, 3597 openedFilter: null, 3598 getItemId: (item) => item.id, 3599 isItemClickable: () => true, 3600 renderItemLink: void 0, 3601 containerWidth: 0, 3602 containerRef: (0, import_element20.createRef)(), 3603 resizeObserverRef: () => { 3604 }, 3605 defaultLayouts: { list: {}, grid: {}, table: {} }, 3606 filters: [], 3607 isShowingFilter: false, 3608 setIsShowingFilter: () => { 3609 }, 3610 hasInitiallyLoaded: false, 3611 config: { 3612 perPageSizes: [] 3613 }, 3614 intersectionObserver: null 3615 }); 3616 DataViewsContext.displayName = "DataViewsContext"; 3617 var dataviews_context_default = DataViewsContext; 3618 3619 // packages/dataviews/build-module/components/dataviews-layouts/index.mjs 3620 var import_i18n21 = __toESM(require_i18n(), 1); 3621 3622 // packages/dataviews/build-module/components/dataviews-layouts/table/index.mjs 3623 var import_i18n9 = __toESM(require_i18n(), 1); 3624 var import_components7 = __toESM(require_components(), 1); 3625 var import_element28 = __toESM(require_element(), 1); 3626 var import_keycodes = __toESM(require_keycodes(), 1); 3627 3628 // packages/dataviews/build-module/components/dataviews-selection-checkbox/index.mjs 3629 var import_components2 = __toESM(require_components(), 1); 3630 var import_i18n2 = __toESM(require_i18n(), 1); 3631 var import_jsx_runtime40 = __toESM(require_jsx_runtime(), 1); 3632 function DataViewsSelectionCheckbox({ 3633 selection, 3634 onChangeSelection, 3635 item, 3636 getItemId, 3637 titleField: titleField2, 3638 disabled: disabled2, 3639 ...extraProps 3640 }) { 3641 const id = getItemId(item); 3642 const isInSelectionArray = selection.includes(id); 3643 const checked = !disabled2 && isInSelectionArray; 3644 const selectionLabel = titleField2?.getValue?.({ item }) || (0, import_i18n2.__)("(no title)"); 3645 return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)( 3646 import_components2.CheckboxControl, 3647 { 3648 className: "dataviews-selection-checkbox", 3649 "aria-label": selectionLabel, 3650 "aria-disabled": disabled2, 3651 checked, 3652 onChange: () => { 3653 if (disabled2) { 3654 return; 3655 } 3656 onChangeSelection( 3657 isInSelectionArray ? selection.filter((itemId) => id !== itemId) : [...selection, id] 3658 ); 3659 }, 3660 ...extraProps 3661 } 3662 ); 3663 } 3664 3665 // packages/dataviews/build-module/components/dataviews-item-actions/index.mjs 3666 var import_components3 = __toESM(require_components(), 1); 3667 var import_i18n3 = __toESM(require_i18n(), 1); 3668 var import_element21 = __toESM(require_element(), 1); 3669 var import_data = __toESM(require_data(), 1); 3670 var import_compose = __toESM(require_compose(), 1); 3671 3672 // packages/dataviews/build-module/lock-unlock.mjs 3673 var import_private_apis = __toESM(require_private_apis(), 1); 3674 var { lock, unlock } = (0, import_private_apis.__dangerousOptInToUnstableAPIsOnlyForCoreModules)( 3675 "I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.", 3676 "@wordpress/dataviews" 3677 ); 3678 3679 // packages/dataviews/build-module/components/dataviews-item-actions/index.mjs 3680 var import_jsx_runtime41 = __toESM(require_jsx_runtime(), 1); 3681 var { Menu, kebabCase } = unlock(import_components3.privateApis); 3682 function ButtonTrigger({ 3683 action, 3684 onClick, 3685 items, 3686 variant 3687 }) { 3688 const label = typeof action.label === "string" ? action.label : action.label(items); 3689 return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3690 import_components3.Button, 3691 { 3692 disabled: !!action.disabled, 3693 accessibleWhenDisabled: true, 3694 size: "compact", 3695 variant, 3696 onClick, 3697 children: label 3698 } 3699 ); 3700 } 3701 function MenuItemTrigger({ 3702 action, 3703 onClick, 3704 items 3705 }) { 3706 const label = typeof action.label === "string" ? action.label : action.label(items); 3707 return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Menu.Item, { disabled: action.disabled, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Menu.ItemLabel, { children: label }) }); 3708 } 3709 function ActionModal({ 3710 action, 3711 items, 3712 closeModal 3713 }) { 3714 const label = typeof action.label === "string" ? action.label : action.label(items); 3715 const modalHeader = typeof action.modalHeader === "function" ? action.modalHeader(items) : action.modalHeader; 3716 return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3717 import_components3.Modal, 3718 { 3719 title: modalHeader || label, 3720 __experimentalHideHeader: !!action.hideModalHeader, 3721 onRequestClose: closeModal, 3722 focusOnMount: action.modalFocusOnMount ?? true, 3723 size: action.modalSize || "medium", 3724 overlayClassName: `dataviews-action-modal dataviews-action-modal__$kebabCase( 3725 action.id 3726 )}`, 3727 children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(action.RenderModal, { items, closeModal }) 3728 } 3729 ); 3730 } 3731 function ActionsMenuGroup({ 3732 actions, 3733 item, 3734 registry, 3735 setActiveModalAction 3736 }) { 3737 const { primaryActions, regularActions } = (0, import_element21.useMemo)(() => { 3738 return actions.reduce( 3739 (acc, action) => { 3740 (action.isPrimary ? acc.primaryActions : acc.regularActions).push(action); 3741 return acc; 3742 }, 3743 { 3744 primaryActions: [], 3745 regularActions: [] 3746 } 3747 ); 3748 }, [actions]); 3749 const renderActionGroup = (actionList) => actionList.map((action) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3750 MenuItemTrigger, 3751 { 3752 action, 3753 onClick: () => { 3754 if ("RenderModal" in action) { 3755 setActiveModalAction(action); 3756 return; 3757 } 3758 action.callback([item], { registry }); 3759 }, 3760 items: [item] 3761 }, 3762 action.id 3763 )); 3764 return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Menu.Group, { children: [ 3765 renderActionGroup(primaryActions), 3766 renderActionGroup(regularActions) 3767 ] }); 3768 } 3769 function ItemActions({ 3770 item, 3771 actions, 3772 isCompact 3773 }) { 3774 const registry = (0, import_data.useRegistry)(); 3775 const { primaryActions, eligibleActions } = (0, import_element21.useMemo)(() => { 3776 const _eligibleActions = actions.filter( 3777 (action) => !action.isEligible || action.isEligible(item) 3778 ); 3779 const _primaryActions = _eligibleActions.filter( 3780 (action) => action.isPrimary 3781 ); 3782 return { 3783 primaryActions: _primaryActions, 3784 eligibleActions: _eligibleActions 3785 }; 3786 }, [actions, item]); 3787 const isMobileViewport = (0, import_compose.useViewportMatch)("medium", "<"); 3788 if (isCompact) { 3789 return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3790 CompactItemActions, 3791 { 3792 item, 3793 actions: eligibleActions, 3794 isSmall: true, 3795 registry 3796 } 3797 ); 3798 } 3799 return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)( 3800 Stack, 3801 { 3802 direction: "row", 3803 justify: "flex-end", 3804 className: "dataviews-item-actions", 3805 style: { 3806 flexShrink: 0, 3807 width: "auto" 3808 }, 3809 children: [ 3810 /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3811 PrimaryActions, 3812 { 3813 item, 3814 actions: primaryActions, 3815 registry 3816 } 3817 ), 3818 (primaryActions.length < eligibleActions.length || // Since we hide primary actions on mobile, we need to show the menu 3819 // there if there are any actions at all. 3820 isMobileViewport) && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3821 CompactItemActions, 3822 { 3823 item, 3824 actions: eligibleActions, 3825 registry 3826 } 3827 ) 3828 ] 3829 } 3830 ); 3831 } 3832 function CompactItemActions({ 3833 item, 3834 actions, 3835 isSmall, 3836 registry 3837 }) { 3838 const [activeModalAction, setActiveModalAction] = (0, import_element21.useState)( 3839 null 3840 ); 3841 return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [ 3842 /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Menu, { placement: "bottom-end", children: [ 3843 /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3844 Menu.TriggerButton, 3845 { 3846 render: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3847 import_components3.Button, 3848 { 3849 size: isSmall ? "small" : "compact", 3850 icon: more_vertical_default, 3851 label: (0, import_i18n3.__)("Actions"), 3852 accessibleWhenDisabled: true, 3853 disabled: !actions.length, 3854 className: "dataviews-all-actions-button" 3855 } 3856 ) 3857 } 3858 ), 3859 /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Menu.Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3860 ActionsMenuGroup, 3861 { 3862 actions, 3863 item, 3864 registry, 3865 setActiveModalAction 3866 } 3867 ) }) 3868 ] }), 3869 !!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3870 ActionModal, 3871 { 3872 action: activeModalAction, 3873 items: [item], 3874 closeModal: () => setActiveModalAction(null) 3875 } 3876 ) 3877 ] }); 3878 } 3879 function PrimaryActions({ 3880 item, 3881 actions, 3882 registry, 3883 buttonVariant 3884 }) { 3885 const [activeModalAction, setActiveModalAction] = (0, import_element21.useState)(null); 3886 const isMobileViewport = (0, import_compose.useViewportMatch)("medium", "<"); 3887 if (isMobileViewport) { 3888 return null; 3889 } 3890 if (!Array.isArray(actions) || actions.length === 0) { 3891 return null; 3892 } 3893 return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [ 3894 actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3895 ButtonTrigger, 3896 { 3897 action, 3898 onClick: () => { 3899 if ("RenderModal" in action) { 3900 setActiveModalAction(action); 3901 return; 3902 } 3903 action.callback([item], { registry }); 3904 }, 3905 items: [item], 3906 variant: buttonVariant 3907 }, 3908 action.id 3909 )), 3910 !!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( 3911 ActionModal, 3912 { 3913 action: activeModalAction, 3914 items: [item], 3915 closeModal: () => setActiveModalAction(null) 3916 } 3917 ) 3918 ] }); 3919 } 3920 3921 // packages/dataviews/build-module/components/dataviews-bulk-actions/index.mjs 3922 var import_components4 = __toESM(require_components(), 1); 3923 var import_i18n5 = __toESM(require_i18n(), 1); 3924 var import_element22 = __toESM(require_element(), 1); 3925 var import_data2 = __toESM(require_data(), 1); 3926 var import_compose2 = __toESM(require_compose(), 1); 3927 3928 // packages/dataviews/build-module/utils/get-footer-message.mjs 3929 var import_i18n4 = __toESM(require_i18n(), 1); 3930 function getFooterMessage(selectionCount, itemsCount, totalItems, onlyTotalCount = false) { 3931 if (selectionCount > 0) { 3932 return (0, import_i18n4.sprintf)( 3933 /* translators: %d: number of items. */ 3934 (0, import_i18n4._n)("%d Item selected", "%d Items selected", selectionCount), 3935 selectionCount 3936 ); 3937 } 3938 if (onlyTotalCount || totalItems <= itemsCount) { 3939 return (0, import_i18n4.sprintf)( 3940 /* translators: %d: number of items. */ 3941 (0, import_i18n4._n)("%d Item", "%d Items", totalItems), 3942 totalItems 3943 ); 3944 } 3945 return (0, import_i18n4.sprintf)( 3946 /* translators: %1$d: number of items. %2$d: total number of items. */ 3947 (0, import_i18n4._n)("%1$d of %2$d Item", "%1$d of %2$d Items", totalItems), 3948 itemsCount, 3949 totalItems 3950 ); 3951 } 3952 3953 // packages/dataviews/build-module/components/dataviews-bulk-actions/index.mjs 3954 var import_jsx_runtime42 = __toESM(require_jsx_runtime(), 1); 3955 function ActionWithModal({ 3956 action, 3957 items, 3958 ActionTriggerComponent 3959 }) { 3960 const [isModalOpen, setIsModalOpen] = (0, import_element22.useState)(false); 3961 const actionTriggerProps = { 3962 action, 3963 onClick: () => { 3964 setIsModalOpen(true); 3965 }, 3966 items 3967 }; 3968 return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [ 3969 /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ActionTriggerComponent, { ...actionTriggerProps }), 3970 isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 3971 ActionModal, 3972 { 3973 action, 3974 items, 3975 closeModal: () => setIsModalOpen(false) 3976 } 3977 ) 3978 ] }); 3979 } 3980 function useHasAPossibleBulkAction(actions, item) { 3981 return (0, import_element22.useMemo)(() => { 3982 return actions.some((action) => { 3983 return action.supportsBulk && (!action.isEligible || action.isEligible(item)); 3984 }); 3985 }, [actions, item]); 3986 } 3987 function useSomeItemHasAPossibleBulkAction(actions, data) { 3988 return (0, import_element22.useMemo)(() => { 3989 return data.some((item) => { 3990 return actions.some((action) => { 3991 return action.supportsBulk && (!action.isEligible || action.isEligible(item)); 3992 }); 3993 }); 3994 }, [actions, data]); 3995 } 3996 function BulkSelectionCheckbox({ 3997 selection, 3998 onChangeSelection, 3999 data, 4000 actions, 4001 getItemId, 4002 disableSelectAll = false 4003 }) { 4004 const selectableItems = (0, import_element22.useMemo)(() => { 4005 return data.filter((item) => { 4006 return actions.some( 4007 (action) => action.supportsBulk && (!action.isEligible || action.isEligible(item)) 4008 ); 4009 }); 4010 }, [data, actions]); 4011 const selectedItems = data.filter( 4012 (item) => selection.includes(getItemId(item)) && selectableItems.includes(item) 4013 ); 4014 const hasSelection = selection.length > 0; 4015 const areAllSelected = selectedItems.length === selectableItems.length; 4016 if (disableSelectAll) { 4017 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4018 import_components4.CheckboxControl, 4019 { 4020 className: "dataviews-view-table-selection-checkbox", 4021 checked: hasSelection, 4022 disabled: !hasSelection, 4023 onChange: () => { 4024 onChangeSelection([]); 4025 }, 4026 "aria-label": (0, import_i18n5.__)("Deselect all") 4027 } 4028 ); 4029 } 4030 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4031 import_components4.CheckboxControl, 4032 { 4033 className: "dataviews-view-table-selection-checkbox", 4034 checked: areAllSelected, 4035 indeterminate: !areAllSelected && !!selectedItems.length, 4036 onChange: () => { 4037 if (areAllSelected) { 4038 onChangeSelection([]); 4039 } else { 4040 onChangeSelection( 4041 selectableItems.map((item) => getItemId(item)) 4042 ); 4043 } 4044 }, 4045 "aria-label": areAllSelected ? (0, import_i18n5.__)("Deselect all") : (0, import_i18n5.__)("Select all") 4046 } 4047 ); 4048 } 4049 function ActionTrigger({ 4050 action, 4051 onClick, 4052 isBusy, 4053 items 4054 }) { 4055 const label = typeof action.label === "string" ? action.label : action.label(items); 4056 const isMobile = (0, import_compose2.useViewportMatch)("medium", "<"); 4057 if (isMobile) { 4058 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4059 import_components4.Button, 4060 { 4061 disabled: isBusy, 4062 accessibleWhenDisabled: true, 4063 label, 4064 icon: action.icon, 4065 size: "compact", 4066 onClick, 4067 isBusy 4068 } 4069 ); 4070 } 4071 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4072 import_components4.Button, 4073 { 4074 disabled: isBusy, 4075 accessibleWhenDisabled: true, 4076 size: "compact", 4077 onClick, 4078 isBusy, 4079 children: label 4080 } 4081 ); 4082 } 4083 var EMPTY_ARRAY2 = []; 4084 function ActionButton({ 4085 action, 4086 selectedItems, 4087 actionInProgress, 4088 setActionInProgress 4089 }) { 4090 const registry = (0, import_data2.useRegistry)(); 4091 const selectedEligibleItems = (0, import_element22.useMemo)(() => { 4092 return selectedItems.filter((item) => { 4093 return !action.isEligible || action.isEligible(item); 4094 }); 4095 }, [action, selectedItems]); 4096 if ("RenderModal" in action) { 4097 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4098 ActionWithModal, 4099 { 4100 action, 4101 items: selectedEligibleItems, 4102 ActionTriggerComponent: ActionTrigger 4103 }, 4104 action.id 4105 ); 4106 } 4107 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4108 ActionTrigger, 4109 { 4110 action, 4111 onClick: async () => { 4112 setActionInProgress(action.id); 4113 await action.callback(selectedItems, { 4114 registry 4115 }); 4116 setActionInProgress(null); 4117 }, 4118 items: selectedEligibleItems, 4119 isBusy: actionInProgress === action.id 4120 }, 4121 action.id 4122 ); 4123 } 4124 function renderFooterContent(data, actions, getItemId, isInfiniteScroll, selection, actionsToShow, selectedItems, actionInProgress, setActionInProgress, onChangeSelection, paginationInfo) { 4125 const message2 = getFooterMessage( 4126 selection.length, 4127 data.length, 4128 paginationInfo.totalItems, 4129 isInfiniteScroll 4130 ); 4131 return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)( 4132 Stack, 4133 { 4134 direction: "row", 4135 className: "dataviews-bulk-actions-footer__container", 4136 gap: "md", 4137 align: "center", 4138 children: [ 4139 /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4140 BulkSelectionCheckbox, 4141 { 4142 selection, 4143 onChangeSelection, 4144 data, 4145 actions, 4146 getItemId, 4147 disableSelectAll: isInfiniteScroll 4148 } 4149 ), 4150 /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "dataviews-bulk-actions-footer__item-count", children: message2 }), 4151 /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)( 4152 Stack, 4153 { 4154 direction: "row", 4155 className: "dataviews-bulk-actions-footer__action-buttons", 4156 gap: "xs", 4157 children: [ 4158 actionsToShow.map((action) => { 4159 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4160 ActionButton, 4161 { 4162 action, 4163 selectedItems, 4164 actionInProgress, 4165 setActionInProgress 4166 }, 4167 action.id 4168 ); 4169 }), 4170 selectedItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4171 import_components4.Button, 4172 { 4173 icon: close_small_default, 4174 showTooltip: true, 4175 tooltipPosition: "top", 4176 size: "compact", 4177 label: (0, import_i18n5.__)("Cancel"), 4178 disabled: !!actionInProgress, 4179 accessibleWhenDisabled: false, 4180 onClick: () => { 4181 onChangeSelection(EMPTY_ARRAY2); 4182 } 4183 } 4184 ) 4185 ] 4186 } 4187 ) 4188 ] 4189 } 4190 ); 4191 } 4192 function FooterContent({ 4193 selection, 4194 actions, 4195 onChangeSelection, 4196 data, 4197 getItemId, 4198 isInfiniteScroll, 4199 paginationInfo 4200 }) { 4201 const [actionInProgress, setActionInProgress] = (0, import_element22.useState)( 4202 null 4203 ); 4204 const footerContentRef = (0, import_element22.useRef)(void 0); 4205 const isMobile = (0, import_compose2.useViewportMatch)("medium", "<"); 4206 const bulkActions = (0, import_element22.useMemo)( 4207 () => actions.filter((action) => action.supportsBulk), 4208 [actions] 4209 ); 4210 const selectableItems = (0, import_element22.useMemo)(() => { 4211 return data.filter((item) => { 4212 return bulkActions.some( 4213 (action) => !action.isEligible || action.isEligible(item) 4214 ); 4215 }); 4216 }, [data, bulkActions]); 4217 const selectedItems = (0, import_element22.useMemo)(() => { 4218 return data.filter( 4219 (item) => selection.includes(getItemId(item)) && selectableItems.includes(item) 4220 ); 4221 }, [selection, data, getItemId, selectableItems]); 4222 const actionsToShow = (0, import_element22.useMemo)( 4223 () => actions.filter((action) => { 4224 return action.supportsBulk && (!isMobile || action.icon) && selectedItems.some( 4225 (item) => !action.isEligible || action.isEligible(item) 4226 ); 4227 }), 4228 [actions, selectedItems, isMobile] 4229 ); 4230 if (!actionInProgress) { 4231 if (footerContentRef.current) { 4232 footerContentRef.current = void 0; 4233 } 4234 return renderFooterContent( 4235 data, 4236 actions, 4237 getItemId, 4238 isInfiniteScroll, 4239 selection, 4240 actionsToShow, 4241 selectedItems, 4242 actionInProgress, 4243 setActionInProgress, 4244 onChangeSelection, 4245 paginationInfo 4246 ); 4247 } else if (!footerContentRef.current) { 4248 footerContentRef.current = renderFooterContent( 4249 data, 4250 actions, 4251 getItemId, 4252 isInfiniteScroll, 4253 selection, 4254 actionsToShow, 4255 selectedItems, 4256 actionInProgress, 4257 setActionInProgress, 4258 onChangeSelection, 4259 paginationInfo 4260 ); 4261 } 4262 return footerContentRef.current; 4263 } 4264 function BulkActionsFooter() { 4265 const { 4266 data, 4267 selection, 4268 actions = EMPTY_ARRAY2, 4269 onChangeSelection, 4270 getItemId, 4271 paginationInfo, 4272 view 4273 } = (0, import_element22.useContext)(dataviews_context_default); 4274 return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( 4275 FooterContent, 4276 { 4277 selection, 4278 onChangeSelection, 4279 data, 4280 actions, 4281 getItemId, 4282 isInfiniteScroll: !!view.infiniteScrollEnabled, 4283 paginationInfo 4284 } 4285 ); 4286 } 4287 4288 // packages/dataviews/build-module/components/dataviews-layouts/table/column-header-menu.mjs 4289 var import_i18n6 = __toESM(require_i18n(), 1); 4290 var import_components5 = __toESM(require_components(), 1); 4291 var import_element23 = __toESM(require_element(), 1); 4292 4293 // packages/dataviews/build-module/utils/get-hideable-fields.mjs 4294 function getHideableFields(view, fields) { 4295 const togglableFields = [ 4296 view?.titleField, 4297 view?.mediaField, 4298 view?.descriptionField 4299 ].filter(Boolean); 4300 return fields.filter( 4301 (f2) => !togglableFields.includes(f2.id) && f2.type !== "media" && f2.enableHiding !== false 4302 ); 4303 } 4304 4305 // packages/dataviews/build-module/components/dataviews-layouts/table/column-header-menu.mjs 4306 var import_jsx_runtime43 = __toESM(require_jsx_runtime(), 1); 4307 var { Menu: Menu2 } = unlock(import_components5.privateApis); 4308 function WithMenuSeparators({ children }) { 4309 return import_element23.Children.toArray(children).filter(Boolean).map((child, i2) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_element23.Fragment, { children: [ 4310 i2 > 0 && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Separator, {}), 4311 child 4312 ] }, i2)); 4313 } 4314 var _HeaderMenu = (0, import_element23.forwardRef)(function HeaderMenu({ 4315 fieldId, 4316 view, 4317 fields, 4318 onChangeView, 4319 onHide, 4320 setOpenedFilter, 4321 canMove = true, 4322 canInsertLeft = true, 4323 canInsertRight = true 4324 }, ref) { 4325 const visibleFieldIds = view.fields ?? []; 4326 const index = visibleFieldIds?.indexOf(fieldId); 4327 const isSorted = view.sort?.field === fieldId; 4328 let isHidable = false; 4329 let isSortable = false; 4330 let canAddFilter = false; 4331 let operators = []; 4332 const field = fields.find((f2) => f2.id === fieldId); 4333 const { setIsShowingFilter } = (0, import_element23.useContext)(dataviews_context_default); 4334 if (!field) { 4335 return null; 4336 } 4337 isHidable = field.enableHiding !== false; 4338 isSortable = field.enableSorting !== false; 4339 const header = field.header; 4340 operators = !!field.filterBy && field.filterBy?.operators || []; 4341 canAddFilter = !view.filters?.some((_filter) => fieldId === _filter.field) && !!(field.hasElements || field.Edit) && field.filterBy !== false && !field.filterBy?.isPrimary; 4342 if (!isSortable && !canMove && !isHidable && !canAddFilter) { 4343 return header; 4344 } 4345 const hiddenFields = getHideableFields(view, fields).filter( 4346 (f2) => !visibleFieldIds.includes(f2.id) 4347 ); 4348 const canInsert = (canInsertLeft || canInsertRight) && !!hiddenFields.length; 4349 const isRtl = (0, import_i18n6.isRTL)(); 4350 return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Menu2, { children: [ 4351 /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)( 4352 Menu2.TriggerButton, 4353 { 4354 render: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4355 import_components5.Button, 4356 { 4357 size: "compact", 4358 className: "dataviews-view-table-header-button", 4359 ref, 4360 variant: "tertiary" 4361 } 4362 ), 4363 children: [ 4364 header, 4365 view.sort && isSorted && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { "aria-hidden": "true", children: sortArrows[view.sort.direction] }) 4366 ] 4367 } 4368 ), 4369 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Popover, { style: { minWidth: "240px" }, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(WithMenuSeparators, { children: [ 4370 isSortable && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Group, { children: SORTING_DIRECTIONS.map( 4371 (direction) => { 4372 const isChecked = view.sort && isSorted && view.sort.direction === direction; 4373 const value = `$fieldId}-$direction}`; 4374 return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4375 Menu2.RadioItem, 4376 { 4377 name: "view-table-sorting", 4378 value, 4379 checked: isChecked, 4380 onChange: () => { 4381 onChangeView({ 4382 ...view, 4383 sort: { 4384 field: fieldId, 4385 direction 4386 }, 4387 showLevels: false 4388 }); 4389 }, 4390 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: sortLabels[direction] }) 4391 }, 4392 value 4393 ); 4394 } 4395 ) }), 4396 canAddFilter && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4397 Menu2.Item, 4398 { 4399 prefix: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components5.Icon, { icon: funnel_default }), 4400 onClick: () => { 4401 setOpenedFilter(fieldId); 4402 setIsShowingFilter(true); 4403 onChangeView({ 4404 ...view, 4405 page: 1, 4406 filters: [ 4407 ...view.filters || [], 4408 { 4409 field: fieldId, 4410 value: void 0, 4411 operator: operators[0] 4412 } 4413 ] 4414 }); 4415 }, 4416 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Add filter") }) 4417 } 4418 ) }), 4419 (canMove || isHidable || canInsert) && field && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Menu2.Group, { children: [ 4420 canMove && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4421 Menu2.Item, 4422 { 4423 prefix: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components5.Icon, { icon: arrow_left_default }), 4424 disabled: isRtl ? index >= visibleFieldIds.length - 1 : index < 1, 4425 onClick: () => { 4426 const targetIndex = isRtl ? index + 1 : index - 1; 4427 const newFields = [ 4428 ...visibleFieldIds 4429 ]; 4430 newFields.splice(index, 1); 4431 newFields.splice( 4432 targetIndex, 4433 0, 4434 fieldId 4435 ); 4436 onChangeView({ 4437 ...view, 4438 fields: newFields 4439 }); 4440 }, 4441 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Move left") }) 4442 } 4443 ), 4444 canMove && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4445 Menu2.Item, 4446 { 4447 prefix: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components5.Icon, { icon: arrow_right_default }), 4448 disabled: isRtl ? index < 1 : index >= visibleFieldIds.length - 1, 4449 onClick: () => { 4450 const targetIndex = isRtl ? index - 1 : index + 1; 4451 const newFields = [ 4452 ...visibleFieldIds 4453 ]; 4454 newFields.splice(index, 1); 4455 newFields.splice( 4456 targetIndex, 4457 0, 4458 fieldId 4459 ); 4460 onChangeView({ 4461 ...view, 4462 fields: newFields 4463 }); 4464 }, 4465 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Move right") }) 4466 } 4467 ), 4468 canInsertLeft && !!hiddenFields.length && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Menu2, { children: [ 4469 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.SubmenuTriggerItem, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Insert left") }) }), 4470 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Popover, { children: hiddenFields.map((hiddenField) => { 4471 const insertIndex = isRtl ? index + 1 : index; 4472 return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4473 Menu2.Item, 4474 { 4475 onClick: () => { 4476 onChangeView({ 4477 ...view, 4478 fields: [ 4479 ...visibleFieldIds.slice( 4480 0, 4481 insertIndex 4482 ), 4483 hiddenField.id, 4484 ...visibleFieldIds.slice( 4485 insertIndex 4486 ) 4487 ] 4488 }); 4489 }, 4490 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: hiddenField.label }) 4491 }, 4492 hiddenField.id 4493 ); 4494 }) }) 4495 ] }), 4496 canInsertRight && !!hiddenFields.length && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Menu2, { children: [ 4497 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.SubmenuTriggerItem, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Insert right") }) }), 4498 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.Popover, { children: hiddenFields.map((hiddenField) => { 4499 const insertIndex = isRtl ? index : index + 1; 4500 return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4501 Menu2.Item, 4502 { 4503 onClick: () => { 4504 onChangeView({ 4505 ...view, 4506 fields: [ 4507 ...visibleFieldIds.slice( 4508 0, 4509 insertIndex 4510 ), 4511 hiddenField.id, 4512 ...visibleFieldIds.slice( 4513 insertIndex 4514 ) 4515 ] 4516 }); 4517 }, 4518 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: hiddenField.label }) 4519 }, 4520 hiddenField.id 4521 ); 4522 }) }) 4523 ] }), 4524 isHidable && field && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( 4525 Menu2.Item, 4526 { 4527 prefix: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components5.Icon, { icon: unseen_default }), 4528 onClick: () => { 4529 onHide(field); 4530 onChangeView({ 4531 ...view, 4532 fields: visibleFieldIds.filter( 4533 (id) => id !== fieldId 4534 ) 4535 }); 4536 }, 4537 children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Menu2.ItemLabel, { children: (0, import_i18n6.__)("Hide column") }) 4538 } 4539 ) 4540 ] }) 4541 ] }) }) 4542 ] }); 4543 }); 4544 var ColumnHeaderMenu = _HeaderMenu; 4545 var column_header_menu_default = ColumnHeaderMenu; 4546 4547 // packages/dataviews/build-module/components/dataviews-layouts/utils/item-click-wrapper.mjs 4548 var import_element24 = __toESM(require_element(), 1); 4549 var import_jsx_runtime44 = __toESM(require_jsx_runtime(), 1); 4550 function getClickableItemProps({ 4551 item, 4552 isItemClickable, 4553 onClickItem, 4554 className 4555 }) { 4556 if (!isItemClickable(item) || !onClickItem) { 4557 return { className }; 4558 } 4559 return { 4560 className: className ? `$className} $className}--clickable` : void 0, 4561 role: "button", 4562 tabIndex: 0, 4563 onClick: (event) => { 4564 event.stopPropagation(); 4565 onClickItem(item); 4566 }, 4567 onKeyDown: (event) => { 4568 if (event.key === "Enter" || event.key === "" || event.key === " ") { 4569 event.stopPropagation(); 4570 onClickItem(item); 4571 } 4572 } 4573 }; 4574 } 4575 function ItemClickWrapper({ 4576 item, 4577 isItemClickable, 4578 onClickItem, 4579 renderItemLink, 4580 className, 4581 children, 4582 ...extraProps 4583 }) { 4584 if (!isItemClickable(item)) { 4585 return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className, ...extraProps, children }); 4586 } 4587 if (renderItemLink) { 4588 const renderedElement = renderItemLink({ 4589 item, 4590 className: `$className} $className}--clickable`, 4591 ...extraProps, 4592 children 4593 }); 4594 return (0, import_element24.cloneElement)(renderedElement, { 4595 onClick: (event) => { 4596 event.stopPropagation(); 4597 if (renderedElement.props.onClick) { 4598 renderedElement.props.onClick(event); 4599 } 4600 }, 4601 onKeyDown: (event) => { 4602 if (event.key === "Enter" || event.key === "" || event.key === " ") { 4603 event.stopPropagation(); 4604 if (renderedElement.props.onKeyDown) { 4605 renderedElement.props.onKeyDown(event); 4606 } 4607 } 4608 } 4609 }); 4610 } 4611 const clickProps = getClickableItemProps({ 4612 item, 4613 isItemClickable, 4614 onClickItem, 4615 className 4616 }); 4617 return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { ...clickProps, ...extraProps, children }); 4618 } 4619 4620 // packages/dataviews/build-module/components/dataviews-layouts/table/column-primary.mjs 4621 var import_jsx_runtime45 = __toESM(require_jsx_runtime(), 1); 4622 function ColumnPrimary({ 4623 item, 4624 level, 4625 titleField: titleField2, 4626 mediaField, 4627 descriptionField, 4628 onClickItem, 4629 renderItemLink, 4630 isItemClickable 4631 }) { 4632 return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(Stack, { direction: "row", gap: "md", align: "flex-start", justify: "flex-start", children: [ 4633 mediaField && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)( 4634 ItemClickWrapper, 4635 { 4636 item, 4637 isItemClickable, 4638 onClickItem, 4639 renderItemLink, 4640 className: "dataviews-view-table__cell-content-wrapper dataviews-column-primary__media", 4641 "aria-label": isItemClickable(item) && (!!onClickItem || !!renderItemLink) && !!titleField2 ? titleField2.getValue?.({ item }) : void 0, 4642 children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)( 4643 mediaField.render, 4644 { 4645 item, 4646 field: mediaField, 4647 config: { sizes: "32px" } 4648 } 4649 ) 4650 } 4651 ), 4652 /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)( 4653 Stack, 4654 { 4655 direction: "column", 4656 align: "flex-start", 4657 className: "dataviews-view-table__primary-column-content", 4658 children: [ 4659 titleField2 && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)( 4660 ItemClickWrapper, 4661 { 4662 item, 4663 isItemClickable, 4664 onClickItem, 4665 renderItemLink, 4666 className: "dataviews-view-table__cell-content-wrapper dataviews-title-field", 4667 children: [ 4668 level !== void 0 && level > 0 && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("span", { className: "dataviews-view-table__level", children: [ 4669 Array(level).fill("\u2014").join(" "), 4670 "\xA0" 4671 ] }), 4672 /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(titleField2.render, { item, field: titleField2 }) 4673 ] 4674 } 4675 ), 4676 descriptionField && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)( 4677 descriptionField.render, 4678 { 4679 item, 4680 field: descriptionField 4681 } 4682 ) 4683 ] 4684 } 4685 ) 4686 ] }); 4687 } 4688 var column_primary_default = ColumnPrimary; 4689 4690 // packages/dataviews/build-module/components/dataviews-layouts/table/use-scroll-state.mjs 4691 var import_element25 = __toESM(require_element(), 1); 4692 var import_i18n7 = __toESM(require_i18n(), 1); 4693 var isScrolledToEnd = (element) => { 4694 if ((0, import_i18n7.isRTL)()) { 4695 const scrollLeft = Math.abs(element.scrollLeft); 4696 return scrollLeft <= 1; 4697 } 4698 return element.scrollLeft + element.clientWidth >= element.scrollWidth - 1; 4699 }; 4700 function useScrollState({ 4701 scrollContainerRef, 4702 enabledHorizontal = false 4703 }) { 4704 const [isHorizontalScrollEnd, setIsHorizontalScrollEnd] = (0, import_element25.useState)(false); 4705 const [isVerticallyScrolled, setIsVerticallyScrolled] = (0, import_element25.useState)(false); 4706 const handleScroll = (0, import_element25.useCallback)(() => { 4707 const scrollContainer = scrollContainerRef.current; 4708 if (!scrollContainer) { 4709 return; 4710 } 4711 if (enabledHorizontal) { 4712 setIsHorizontalScrollEnd(isScrolledToEnd(scrollContainer)); 4713 } 4714 setIsVerticallyScrolled(scrollContainer.scrollTop > 0); 4715 }, [scrollContainerRef, enabledHorizontal]); 4716 (0, import_element25.useEffect)(() => { 4717 if (typeof window === "undefined" || !scrollContainerRef.current) { 4718 return () => { 4719 }; 4720 } 4721 const scrollContainer = scrollContainerRef.current; 4722 handleScroll(); 4723 scrollContainer.addEventListener("scroll", handleScroll); 4724 window.addEventListener("resize", handleScroll); 4725 return () => { 4726 scrollContainer.removeEventListener("scroll", handleScroll); 4727 window.removeEventListener("resize", handleScroll); 4728 }; 4729 }, [scrollContainerRef, enabledHorizontal, handleScroll]); 4730 return { isHorizontalScrollEnd, isVerticallyScrolled }; 4731 } 4732 4733 // packages/dataviews/build-module/components/dataviews-layouts/utils/get-data-by-group.mjs 4734 function getDataByGroup(data, groupByField) { 4735 return data.reduce((groups, item) => { 4736 const groupName = groupByField.getValue({ item }); 4737 if (!groups.has(groupName)) { 4738 groups.set(groupName, []); 4739 } 4740 groups.get(groupName)?.push(item); 4741 return groups; 4742 }, /* @__PURE__ */ new Map()); 4743 } 4744 4745 // packages/dataviews/build-module/components/dataviews-view-config/properties-section.mjs 4746 var import_components6 = __toESM(require_components(), 1); 4747 var import_i18n8 = __toESM(require_i18n(), 1); 4748 var import_element26 = __toESM(require_element(), 1); 4749 var import_jsx_runtime46 = __toESM(require_jsx_runtime(), 1); 4750 function FieldItem({ 4751 field, 4752 isVisible: isVisible2, 4753 onToggleVisibility 4754 }) { 4755 return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components6.__experimentalItem, { onClick: field.enableHiding ? onToggleVisibility : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Stack, { direction: "row", gap: "sm", justify: "flex-start", align: "center", children: [ 4756 /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { style: { height: 24, width: 24 }, children: isVisible2 && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components6.Icon, { icon: check_default }) }), 4757 /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "dataviews-view-config__label", children: field.label }) 4758 ] }) }); 4759 } 4760 function isDefined(item) { 4761 return !!item; 4762 } 4763 function PropertiesSection({ 4764 showLabel = true 4765 }) { 4766 const { view, fields, onChangeView } = (0, import_element26.useContext)(dataviews_context_default); 4767 const regularFields = getHideableFields(view, fields); 4768 if (!regularFields?.length) { 4769 return null; 4770 } 4771 const titleField2 = fields.find((f2) => f2.id === view.titleField); 4772 const previewField = fields.find((f2) => f2.id === view.mediaField); 4773 const descriptionField = fields.find( 4774 (f2) => f2.id === view.descriptionField 4775 ); 4776 const lockedFields = [ 4777 { 4778 field: titleField2, 4779 isVisibleFlag: "showTitle" 4780 }, 4781 { 4782 field: previewField, 4783 isVisibleFlag: "showMedia" 4784 }, 4785 { 4786 field: descriptionField, 4787 isVisibleFlag: "showDescription" 4788 } 4789 ].filter(({ field }) => isDefined(field)); 4790 const visibleFieldIds = view.fields ?? []; 4791 const visibleRegularFieldsCount = regularFields.filter( 4792 (f2) => visibleFieldIds.includes(f2.id) 4793 ).length; 4794 const visibleLockedFields = lockedFields.filter( 4795 ({ isVisibleFlag }) => ( 4796 // @ts-expect-error 4797 view[isVisibleFlag] ?? true 4798 ) 4799 ); 4800 const totalVisibleFields = visibleLockedFields.length + visibleRegularFieldsCount; 4801 const isSingleVisibleLockedField = totalVisibleFields === 1 && visibleLockedFields.length === 1; 4802 return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Stack, { direction: "column", className: "dataviews-field-control", children: [ 4803 showLabel && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components6.BaseControl.VisualLabel, { children: (0, import_i18n8.__)("Properties") }), 4804 /* @__PURE__ */ (0, import_jsx_runtime46.jsx)( 4805 Stack, 4806 { 4807 direction: "column", 4808 className: "dataviews-view-config__properties", 4809 children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_components6.__experimentalItemGroup, { isBordered: true, isSeparated: true, size: "medium", children: [ 4810 lockedFields.map(({ field, isVisibleFlag }) => { 4811 const isVisible2 = view[isVisibleFlag] ?? true; 4812 const fieldToRender = isSingleVisibleLockedField && isVisible2 ? { ...field, enableHiding: false } : field; 4813 return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)( 4814 FieldItem, 4815 { 4816 field: fieldToRender, 4817 isVisible: isVisible2, 4818 onToggleVisibility: () => { 4819 onChangeView({ 4820 ...view, 4821 [isVisibleFlag]: !isVisible2 4822 }); 4823 } 4824 }, 4825 field.id 4826 ); 4827 }), 4828 regularFields.map((field) => { 4829 const isVisible2 = visibleFieldIds.includes(field.id); 4830 const fieldToRender = totalVisibleFields === 1 && isVisible2 ? { ...field, enableHiding: false } : field; 4831 return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)( 4832 FieldItem, 4833 { 4834 field: fieldToRender, 4835 isVisible: isVisible2, 4836 onToggleVisibility: () => { 4837 onChangeView({ 4838 ...view, 4839 fields: isVisible2 ? visibleFieldIds.filter( 4840 (fieldId) => fieldId !== field.id 4841 ) : [...visibleFieldIds, field.id] 4842 }); 4843 } 4844 }, 4845 field.id 4846 ); 4847 }) 4848 ] }) 4849 } 4850 ) 4851 ] }); 4852 } 4853 4854 // packages/dataviews/build-module/hooks/use-delayed-loading.mjs 4855 var import_element27 = __toESM(require_element(), 1); 4856 function useDelayedLoading(isLoading, options = { delay: 400 }) { 4857 const [showLoader, setShowLoader] = (0, import_element27.useState)(false); 4858 (0, import_element27.useEffect)(() => { 4859 if (!isLoading) { 4860 return; 4861 } 4862 const timeout = setTimeout(() => { 4863 setShowLoader(true); 4864 }, options.delay); 4865 return () => { 4866 clearTimeout(timeout); 4867 setShowLoader(false); 4868 }; 4869 }, [isLoading, options.delay]); 4870 return showLoader; 4871 } 4872 4873 // packages/dataviews/build-module/components/dataviews-layouts/table/index.mjs 4874 var import_jsx_runtime47 = __toESM(require_jsx_runtime(), 1); 4875 function getEffectiveAlign(explicitAlign, fieldType) { 4876 if (explicitAlign) { 4877 return explicitAlign; 4878 } 4879 if (fieldType === "integer" || fieldType === "number") { 4880 return "end"; 4881 } 4882 return void 0; 4883 } 4884 function TableColumnField({ 4885 item, 4886 fields, 4887 column, 4888 align 4889 }) { 4890 const field = fields.find((f2) => f2.id === column); 4891 if (!field) { 4892 return null; 4893 } 4894 const className = clsx_default("dataviews-view-table__cell-content-wrapper", { 4895 "dataviews-view-table__cell-align-end": align === "end", 4896 "dataviews-view-table__cell-align-center": align === "center" 4897 }); 4898 return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(field.render, { item, field }) }); 4899 } 4900 function TableRow({ 4901 hasBulkActions, 4902 item, 4903 level, 4904 actions, 4905 fields, 4906 id, 4907 view, 4908 titleField: titleField2, 4909 mediaField, 4910 descriptionField, 4911 selection, 4912 getItemId, 4913 isItemClickable, 4914 onClickItem, 4915 renderItemLink, 4916 onChangeSelection, 4917 isActionsColumnSticky, 4918 posinset 4919 }) { 4920 const { paginationInfo } = (0, import_element28.useContext)(dataviews_context_default); 4921 const hasPossibleBulkAction = useHasAPossibleBulkAction(actions, item); 4922 const isSelected2 = hasPossibleBulkAction && selection.includes(id); 4923 const { 4924 showTitle = true, 4925 showMedia = true, 4926 showDescription = true, 4927 infiniteScrollEnabled 4928 } = view; 4929 const isTouchDeviceRef = (0, import_element28.useRef)(false); 4930 const columns = view.fields ?? []; 4931 const hasPrimaryColumn = titleField2 && showTitle || mediaField && showMedia || descriptionField && showDescription; 4932 return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)( 4933 "tr", 4934 { 4935 className: clsx_default("dataviews-view-table__row", { 4936 "is-selected": hasPossibleBulkAction && isSelected2, 4937 "has-bulk-actions": hasPossibleBulkAction 4938 }), 4939 onTouchStart: () => { 4940 isTouchDeviceRef.current = true; 4941 }, 4942 "aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0, 4943 "aria-posinset": posinset, 4944 role: infiniteScrollEnabled ? "article" : void 0, 4945 onMouseDown: (event) => { 4946 const isMetaClick = (0, import_keycodes.isAppleOS)() ? event.metaKey : event.ctrlKey; 4947 if (event.button === 0 && isMetaClick && window.navigator.userAgent.toLowerCase().includes("firefox")) { 4948 event?.preventDefault(); 4949 } 4950 }, 4951 onClick: (event) => { 4952 if (!hasPossibleBulkAction) { 4953 return; 4954 } 4955 const isModifierKeyPressed = (0, import_keycodes.isAppleOS)() ? event.metaKey : event.ctrlKey; 4956 if (isModifierKeyPressed && !isTouchDeviceRef.current && document.getSelection()?.type !== "Range") { 4957 onChangeSelection( 4958 selection.includes(id) ? selection.filter((itemId) => id !== itemId) : [...selection, id] 4959 ); 4960 } 4961 }, 4962 children: [ 4963 hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("td", { className: "dataviews-view-table__checkbox-column", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "dataviews-view-table__cell-content-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 4964 DataViewsSelectionCheckbox, 4965 { 4966 item, 4967 selection, 4968 onChangeSelection, 4969 getItemId, 4970 titleField: titleField2, 4971 disabled: !hasPossibleBulkAction 4972 } 4973 ) }) }), 4974 hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 4975 column_primary_default, 4976 { 4977 item, 4978 level, 4979 titleField: showTitle ? titleField2 : void 0, 4980 mediaField: showMedia ? mediaField : void 0, 4981 descriptionField: showDescription ? descriptionField : void 0, 4982 isItemClickable, 4983 onClickItem, 4984 renderItemLink 4985 } 4986 ) }), 4987 columns.map((column) => { 4988 const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; 4989 const field = fields.find((f2) => f2.id === column); 4990 const effectiveAlign = getEffectiveAlign(align, field?.type); 4991 return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 4992 "td", 4993 { 4994 style: { 4995 width, 4996 maxWidth, 4997 minWidth 4998 }, 4999 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5000 TableColumnField, 5001 { 5002 fields, 5003 item, 5004 column, 5005 align: effectiveAlign 5006 } 5007 ) 5008 }, 5009 column 5010 ); 5011 }), 5012 !!actions?.length && // Disable reason: we are not making the element interactive, 5013 // but preventing any click events from bubbling up to the 5014 // table row. This allows us to add a click handler to the row 5015 // itself (to toggle row selection) without erroneously 5016 // intercepting click events from ItemActions. 5017 /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5018 "td", 5019 { 5020 className: clsx_default("dataviews-view-table__actions-column", { 5021 "dataviews-view-table__actions-column--sticky": true, 5022 "dataviews-view-table__actions-column--stuck": isActionsColumnSticky 5023 }), 5024 onClick: (e2) => e2.stopPropagation(), 5025 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ItemActions, { item, actions }) 5026 } 5027 ) 5028 ] 5029 } 5030 ); 5031 } 5032 function ViewTable({ 5033 actions, 5034 data, 5035 fields, 5036 getItemId, 5037 getItemLevel, 5038 isLoading = false, 5039 onChangeView, 5040 onChangeSelection, 5041 selection, 5042 setOpenedFilter, 5043 onClickItem, 5044 isItemClickable, 5045 renderItemLink, 5046 view, 5047 className, 5048 empty 5049 }) { 5050 const { containerRef } = (0, import_element28.useContext)(dataviews_context_default); 5051 const isDelayedLoading = useDelayedLoading(isLoading); 5052 const headerMenuRefs = (0, import_element28.useRef)(/* @__PURE__ */ new Map()); 5053 const headerMenuToFocusRef = (0, import_element28.useRef)(void 0); 5054 const [nextHeaderMenuToFocus, setNextHeaderMenuToFocus] = (0, import_element28.useState)(); 5055 const [contextMenuAnchor, setContextMenuAnchor] = (0, import_element28.useState)(null); 5056 (0, import_element28.useEffect)(() => { 5057 if (headerMenuToFocusRef.current) { 5058 headerMenuToFocusRef.current.focus(); 5059 headerMenuToFocusRef.current = void 0; 5060 } 5061 }); 5062 const tableNoticeId = (0, import_element28.useId)(); 5063 const { isHorizontalScrollEnd, isVerticallyScrolled } = useScrollState({ 5064 scrollContainerRef: containerRef, 5065 enabledHorizontal: !!actions?.length 5066 }); 5067 const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data); 5068 if (nextHeaderMenuToFocus) { 5069 headerMenuToFocusRef.current = nextHeaderMenuToFocus; 5070 setNextHeaderMenuToFocus(void 0); 5071 return; 5072 } 5073 const onHide = (field) => { 5074 const hidden = headerMenuRefs.current.get(field.id); 5075 const fallback = hidden ? headerMenuRefs.current.get(hidden.fallback) : void 0; 5076 setNextHeaderMenuToFocus(fallback?.node); 5077 }; 5078 const handleHeaderContextMenu = (event) => { 5079 event.preventDefault(); 5080 event.stopPropagation(); 5081 const virtualAnchor = { 5082 getBoundingClientRect: () => ({ 5083 x: event.clientX, 5084 y: event.clientY, 5085 top: event.clientY, 5086 left: event.clientX, 5087 right: event.clientX, 5088 bottom: event.clientY, 5089 width: 0, 5090 height: 0, 5091 toJSON: () => ({}) 5092 }) 5093 }; 5094 window.requestAnimationFrame(() => { 5095 setContextMenuAnchor(virtualAnchor); 5096 }); 5097 }; 5098 const hasData = !!data?.length; 5099 const titleField2 = fields.find((field) => field.id === view.titleField); 5100 const mediaField = fields.find((field) => field.id === view.mediaField); 5101 const descriptionField = fields.find( 5102 (field) => field.id === view.descriptionField 5103 ); 5104 const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; 5105 const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; 5106 const { showTitle = true, showMedia = true, showDescription = true } = view; 5107 const hasPrimaryColumn = titleField2 && showTitle || mediaField && showMedia || descriptionField && showDescription; 5108 const columns = view.fields ?? []; 5109 const headerMenuRef = (column, index) => (node) => { 5110 if (node) { 5111 headerMenuRefs.current.set(column, { 5112 node, 5113 fallback: columns[index > 0 ? index - 1 : 1] 5114 }); 5115 } else { 5116 headerMenuRefs.current.delete(column); 5117 } 5118 }; 5119 const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; 5120 const isRtl = (0, import_i18n9.isRTL)(); 5121 if (!hasData) { 5122 return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5123 "div", 5124 { 5125 className: clsx_default("dataviews-no-results", { 5126 "is-refreshing": isDelayedLoading 5127 }), 5128 id: tableNoticeId, 5129 children: empty 5130 } 5131 ); 5132 } 5133 return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [ 5134 /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)( 5135 "table", 5136 { 5137 className: clsx_default("dataviews-view-table", className, { 5138 [`has-$view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( 5139 view.layout.density 5140 ), 5141 "has-bulk-actions": hasBulkActions, 5142 "is-refreshing": !isInfiniteScroll && isDelayedLoading 5143 }), 5144 "aria-busy": isLoading, 5145 "aria-describedby": tableNoticeId, 5146 role: isInfiniteScroll ? "feed" : void 0, 5147 inert: !isInfiniteScroll && isLoading ? "true" : void 0, 5148 children: [ 5149 /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("colgroup", { children: [ 5150 hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("col", { className: "dataviews-view-table__col-checkbox" }), 5151 hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("col", { className: "dataviews-view-table__col-first-data" }), 5152 columns.map((column, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5153 "col", 5154 { 5155 className: clsx_default( 5156 `dataviews-view-table__col-$column}`, 5157 { 5158 "dataviews-view-table__col-expand": !hasPrimaryColumn && index === columns.length - 1 5159 } 5160 ) 5161 }, 5162 `col-$column}` 5163 )), 5164 !!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("col", { className: "dataviews-view-table__col-actions" }) 5165 ] }), 5166 contextMenuAnchor && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5167 import_components7.Popover, 5168 { 5169 anchor: contextMenuAnchor, 5170 onClose: () => setContextMenuAnchor(null), 5171 placement: "bottom-start", 5172 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(PropertiesSection, { showLabel: false }) 5173 } 5174 ), 5175 /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5176 "thead", 5177 { 5178 className: clsx_default({ 5179 "dataviews-view-table__thead--stuck": isVerticallyScrolled 5180 }), 5181 onContextMenu: handleHeaderContextMenu, 5182 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("tr", { className: "dataviews-view-table__row", children: [ 5183 hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5184 "th", 5185 { 5186 className: "dataviews-view-table__checkbox-column", 5187 scope: "col", 5188 onContextMenu: handleHeaderContextMenu, 5189 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5190 BulkSelectionCheckbox, 5191 { 5192 selection, 5193 onChangeSelection, 5194 data, 5195 actions, 5196 getItemId 5197 } 5198 ) 5199 } 5200 ), 5201 hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("th", { scope: "col", children: titleField2 && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5202 column_header_menu_default, 5203 { 5204 ref: headerMenuRef( 5205 titleField2.id, 5206 0 5207 ), 5208 fieldId: titleField2.id, 5209 view, 5210 fields, 5211 onChangeView, 5212 onHide, 5213 setOpenedFilter, 5214 canMove: false, 5215 canInsertLeft: isRtl ? view.layout?.enableMoving ?? true : false, 5216 canInsertRight: isRtl ? false : view.layout?.enableMoving ?? true 5217 } 5218 ) }), 5219 columns.map((column, index) => { 5220 const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; 5221 const field = fields.find( 5222 (f2) => f2.id === column 5223 ); 5224 const effectiveAlign = getEffectiveAlign( 5225 align, 5226 field?.type 5227 ); 5228 const canInsertOrMove = view.layout?.enableMoving ?? true; 5229 return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5230 "th", 5231 { 5232 style: { 5233 width, 5234 maxWidth, 5235 minWidth, 5236 textAlign: effectiveAlign 5237 }, 5238 "aria-sort": view.sort?.direction && view.sort?.field === column ? sortValues[view.sort.direction] : void 0, 5239 scope: "col", 5240 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5241 column_header_menu_default, 5242 { 5243 ref: headerMenuRef(column, index), 5244 fieldId: column, 5245 view, 5246 fields, 5247 onChangeView, 5248 onHide, 5249 setOpenedFilter, 5250 canMove: canInsertOrMove, 5251 canInsertLeft: canInsertOrMove, 5252 canInsertRight: canInsertOrMove 5253 } 5254 ) 5255 }, 5256 column 5257 ); 5258 }), 5259 !!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5260 "th", 5261 { 5262 className: clsx_default( 5263 "dataviews-view-table__actions-column", 5264 { 5265 "dataviews-view-table__actions-column--sticky": true, 5266 "dataviews-view-table__actions-column--stuck": !isHorizontalScrollEnd 5267 } 5268 ), 5269 children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "dataviews-view-table-header", children: (0, import_i18n9.__)("Actions") }) 5270 } 5271 ) 5272 ] }) 5273 } 5274 ), 5275 hasData && groupField && dataByGroup ? Array.from(dataByGroup.entries()).map( 5276 ([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("tbody", { children: [ 5277 /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("tr", { className: "dataviews-view-table__group-header-row", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5278 "td", 5279 { 5280 colSpan: columns.length + (hasPrimaryColumn ? 1 : 0) + (hasBulkActions ? 1 : 0) + (actions?.length ? 1 : 0), 5281 className: "dataviews-view-table__group-header-cell", 5282 children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n9.sprintf)( 5283 // translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". 5284 (0, import_i18n9.__)("%1$s: %2$s"), 5285 groupField.label, 5286 groupName 5287 ) 5288 } 5289 ) }), 5290 groupItems.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5291 TableRow, 5292 { 5293 item, 5294 level: view.showLevels && typeof getItemLevel === "function" ? getItemLevel(item) : void 0, 5295 hasBulkActions, 5296 actions, 5297 fields, 5298 id: getItemId(item) || index.toString(), 5299 view, 5300 titleField: titleField2, 5301 mediaField, 5302 descriptionField, 5303 selection, 5304 getItemId, 5305 onChangeSelection, 5306 onClickItem, 5307 renderItemLink, 5308 isItemClickable, 5309 isActionsColumnSticky: !isHorizontalScrollEnd 5310 }, 5311 getItemId(item) 5312 )) 5313 ] }, `group-$groupName}`) 5314 ) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("tbody", { children: hasData && data.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( 5315 TableRow, 5316 { 5317 item, 5318 level: view.showLevels && typeof getItemLevel === "function" ? getItemLevel(item) : void 0, 5319 hasBulkActions, 5320 actions, 5321 fields, 5322 id: getItemId(item) || index.toString(), 5323 view, 5324 titleField: titleField2, 5325 mediaField, 5326 descriptionField, 5327 selection, 5328 getItemId, 5329 onChangeSelection, 5330 onClickItem, 5331 renderItemLink, 5332 isItemClickable, 5333 isActionsColumnSticky: !isHorizontalScrollEnd, 5334 posinset: isInfiniteScroll ? index + 1 : void 0 5335 }, 5336 getItemId(item) 5337 )) }) 5338 ] 5339 } 5340 ), 5341 isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "dataviews-loading", id: tableNoticeId, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_components7.Spinner, {}) }) }) 5342 ] }); 5343 } 5344 var table_default = ViewTable; 5345 5346 // packages/dataviews/build-module/components/dataviews-layouts/grid/index.mjs 5347 var import_components10 = __toESM(require_components(), 1); 5348 var import_i18n12 = __toESM(require_i18n(), 1); 5349 5350 // packages/dataviews/build-module/components/dataviews-layouts/grid/composite-grid.mjs 5351 var import_components9 = __toESM(require_components(), 1); 5352 var import_i18n11 = __toESM(require_i18n(), 1); 5353 var import_compose3 = __toESM(require_compose(), 1); 5354 var import_keycodes2 = __toESM(require_keycodes(), 1); 5355 var import_element32 = __toESM(require_element(), 1); 5356 5357 // packages/dataviews/build-module/components/dataviews-layouts/grid/preview-size-picker.mjs 5358 var import_components8 = __toESM(require_components(), 1); 5359 var import_i18n10 = __toESM(require_i18n(), 1); 5360 var import_element29 = __toESM(require_element(), 1); 5361 var import_jsx_runtime48 = __toESM(require_jsx_runtime(), 1); 5362 var imageSizes = [ 5363 { 5364 value: 120, 5365 breakpoint: 1 5366 }, 5367 { 5368 value: 170, 5369 breakpoint: 1 5370 }, 5371 { 5372 value: 230, 5373 breakpoint: 1 5374 }, 5375 { 5376 value: 290, 5377 breakpoint: 1112 5378 // at minimum image width, 4 images display at this container size 5379 }, 5380 { 5381 value: 350, 5382 breakpoint: 1636 5383 // at minimum image width, 6 images display at this container size 5384 }, 5385 { 5386 value: 430, 5387 breakpoint: 588 5388 // at minimum image width, 2 images display at this container size 5389 } 5390 ]; 5391 var DEFAULT_PREVIEW_SIZE = imageSizes[2].value; 5392 function useGridColumns() { 5393 const context = (0, import_element29.useContext)(dataviews_context_default); 5394 const view = context.view; 5395 return (0, import_element29.useMemo)(() => { 5396 const containerWidth = context.containerWidth; 5397 const gap = 32; 5398 const previewSize = view.layout?.previewSize ?? DEFAULT_PREVIEW_SIZE; 5399 const columns = Math.floor( 5400 (containerWidth + gap) / (previewSize + gap) 5401 ); 5402 return Math.max(1, columns); 5403 }, [context.containerWidth, view.layout?.previewSize]); 5404 } 5405 5406 // packages/dataviews/build-module/components/dataviews-layouts/utils/grid-items.mjs 5407 var import_element30 = __toESM(require_element(), 1); 5408 var import_jsx_runtime49 = __toESM(require_jsx_runtime(), 1); 5409 var GridItems = (0, import_element30.forwardRef)(({ className, previewSize, ...props }, ref) => { 5410 return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)( 5411 "div", 5412 { 5413 ref, 5414 className: clsx_default("dataviews-view-grid-items", className), 5415 style: { 5416 gridTemplateColumns: previewSize && `repeat(auto-fill, minmax($previewSize}px, 1fr))` 5417 }, 5418 ...props 5419 } 5420 ); 5421 }); 5422 5423 // packages/dataviews/build-module/components/dataviews-layouts/utils/use-infinite-scroll.mjs 5424 var import_element31 = __toESM(require_element(), 1); 5425 function useIntersectionObserver(elementRef, posinset) { 5426 const { intersectionObserver } = (0, import_element31.useContext)(dataviews_context_default); 5427 (0, import_element31.useEffect)(() => { 5428 const element = elementRef.current; 5429 if (!element || posinset === void 0 || !intersectionObserver) { 5430 return; 5431 } 5432 intersectionObserver.observe(element); 5433 return () => { 5434 intersectionObserver.unobserve(element); 5435 }; 5436 }, [elementRef, intersectionObserver, posinset]); 5437 } 5438 function usePlaceholdersNeeded(data, isInfiniteScroll, gridColumns) { 5439 const hasData = !!data?.length; 5440 const firstItemPosition = hasData && isInfiniteScroll ? data[0].position : void 0; 5441 return firstItemPosition && gridColumns ? (firstItemPosition - 1) % gridColumns : 0; 5442 } 5443 5444 // packages/dataviews/build-module/components/dataviews-layouts/grid/composite-grid.mjs 5445 var import_jsx_runtime50 = __toESM(require_jsx_runtime(), 1); 5446 var { Badge: WCBadge } = unlock(import_components9.privateApis); 5447 function chunk(array, size) { 5448 const chunks = []; 5449 for (let i2 = 0, j2 = array.length; i2 < j2; i2 += size) { 5450 chunks.push(array.slice(i2, i2 + size)); 5451 } 5452 return chunks; 5453 } 5454 var GridItem = (0, import_element32.forwardRef)( 5455 function GridItem2({ 5456 view, 5457 selection, 5458 onChangeSelection, 5459 onClickItem, 5460 isItemClickable, 5461 renderItemLink, 5462 getItemId, 5463 item, 5464 actions, 5465 mediaField, 5466 titleField: titleField2, 5467 descriptionField, 5468 regularFields, 5469 badgeFields, 5470 hasBulkActions, 5471 config, 5472 posinset, 5473 setsize, 5474 ...props 5475 }, forwardedRef) { 5476 const { 5477 showTitle = true, 5478 showMedia = true, 5479 showDescription = true 5480 } = view; 5481 const hasBulkAction = useHasAPossibleBulkAction(actions, item); 5482 const id = getItemId(item); 5483 const elementRef = (0, import_element32.useRef)(null); 5484 const setRefs = (0, import_element32.useCallback)( 5485 (node) => { 5486 elementRef.current = node; 5487 if (typeof forwardedRef === "function") { 5488 forwardedRef(node); 5489 } else if (forwardedRef) { 5490 forwardedRef.current = node; 5491 } 5492 }, 5493 [forwardedRef] 5494 ); 5495 useIntersectionObserver(elementRef, posinset); 5496 const instanceId = (0, import_compose3.useInstanceId)(GridItem2); 5497 const isSelected2 = selection.includes(id); 5498 const mediaPlaceholder = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "dataviews-view-grid__media-placeholder" }); 5499 const rendersMediaField = showMedia && mediaField?.render; 5500 const renderedMediaField = rendersMediaField ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5501 mediaField.render, 5502 { 5503 item, 5504 field: mediaField, 5505 config 5506 } 5507 ) : mediaPlaceholder; 5508 const renderedTitleField = showTitle && titleField2?.render ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(titleField2.render, { item, field: titleField2 }) : null; 5509 let mediaA11yProps; 5510 let titleA11yProps; 5511 if (isItemClickable(item) && onClickItem) { 5512 if (renderedTitleField) { 5513 mediaA11yProps = { 5514 "aria-labelledby": `dataviews-view-grid__title-field-$instanceId}` 5515 }; 5516 titleA11yProps = { 5517 id: `dataviews-view-grid__title-field-$instanceId}` 5518 }; 5519 } else { 5520 mediaA11yProps = { 5521 "aria-label": (0, import_i18n11.__)("Navigate to item") 5522 }; 5523 } 5524 } 5525 return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)( 5526 Stack, 5527 { 5528 direction: "column", 5529 ...props, 5530 ref: setRefs, 5531 "aria-setsize": setsize, 5532 "aria-posinset": posinset, 5533 className: clsx_default( 5534 props.className, 5535 "dataviews-view-grid__row__gridcell", 5536 "dataviews-view-grid__card", 5537 { 5538 "is-selected": hasBulkAction && isSelected2 5539 } 5540 ), 5541 onClickCapture: (event) => { 5542 props.onClickCapture?.(event); 5543 if ((0, import_keycodes2.isAppleOS)() ? event.metaKey : event.ctrlKey) { 5544 event.stopPropagation(); 5545 event.preventDefault(); 5546 if (!hasBulkAction) { 5547 return; 5548 } 5549 onChangeSelection( 5550 isSelected2 ? selection.filter( 5551 (itemId) => id !== itemId 5552 ) : [...selection, id] 5553 ); 5554 } 5555 }, 5556 children: [ 5557 /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5558 ItemClickWrapper, 5559 { 5560 item, 5561 isItemClickable, 5562 onClickItem, 5563 renderItemLink, 5564 className: clsx_default("dataviews-view-grid__media", { 5565 "dataviews-view-grid__media--placeholder": !rendersMediaField 5566 }), 5567 ...mediaA11yProps, 5568 children: renderedMediaField 5569 } 5570 ), 5571 hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5572 DataViewsSelectionCheckbox, 5573 { 5574 item, 5575 selection, 5576 onChangeSelection, 5577 getItemId, 5578 titleField: titleField2, 5579 disabled: !hasBulkAction 5580 } 5581 ), 5582 !!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "dataviews-view-grid__media-actions", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5583 ItemActions, 5584 { 5585 item, 5586 actions, 5587 isCompact: true 5588 } 5589 ) }), 5590 showTitle && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "dataviews-view-grid__title", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5591 ItemClickWrapper, 5592 { 5593 item, 5594 isItemClickable, 5595 onClickItem, 5596 renderItemLink, 5597 className: "dataviews-view-grid__title-field dataviews-title-field", 5598 ...titleA11yProps, 5599 title: titleField2?.getValueFormatted({ 5600 item, 5601 field: titleField2 5602 }) || void 0, 5603 children: renderedTitleField 5604 } 5605 ) }), 5606 /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Stack, { direction: "column", gap: "xs", children: [ 5607 showDescription && descriptionField?.render && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5608 descriptionField.render, 5609 { 5610 item, 5611 field: descriptionField 5612 } 5613 ), 5614 !!badgeFields?.length && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5615 Stack, 5616 { 5617 direction: "row", 5618 className: "dataviews-view-grid__badge-fields", 5619 gap: "sm", 5620 wrap: "wrap", 5621 align: "top", 5622 justify: "flex-start", 5623 children: badgeFields.map((field) => { 5624 return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5625 WCBadge, 5626 { 5627 className: "dataviews-view-grid__field-value", 5628 children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5629 field.render, 5630 { 5631 item, 5632 field 5633 } 5634 ) 5635 }, 5636 field.id 5637 ); 5638 }) 5639 } 5640 ), 5641 !!regularFields?.length && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5642 Stack, 5643 { 5644 direction: "column", 5645 className: "dataviews-view-grid__fields", 5646 gap: "xs", 5647 children: regularFields.map((field) => { 5648 return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5649 import_components9.Flex, 5650 { 5651 className: "dataviews-view-grid__field", 5652 gap: 1, 5653 justify: "flex-start", 5654 expanded: true, 5655 style: { height: "auto" }, 5656 direction: "row", 5657 children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [ 5658 /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components9.Tooltip, { text: field.label, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components9.FlexItem, { className: "dataviews-view-grid__field-name", children: field.header }) }), 5659 /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5660 import_components9.FlexItem, 5661 { 5662 className: "dataviews-view-grid__field-value", 5663 style: { maxHeight: "none" }, 5664 children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5665 field.render, 5666 { 5667 item, 5668 field 5669 } 5670 ) 5671 } 5672 ) 5673 ] }) 5674 }, 5675 field.id 5676 ); 5677 }) 5678 } 5679 ) 5680 ] }) 5681 ] 5682 } 5683 ); 5684 } 5685 ); 5686 function CompositeGrid({ 5687 data, 5688 isInfiniteScroll, 5689 className, 5690 inert, 5691 isLoading, 5692 view, 5693 fields, 5694 selection, 5695 onChangeSelection, 5696 onClickItem, 5697 isItemClickable, 5698 renderItemLink, 5699 getItemId, 5700 actions 5701 }) { 5702 const { paginationInfo, resizeObserverRef } = (0, import_element32.useContext)(dataviews_context_default); 5703 const gridColumns = useGridColumns(); 5704 const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data); 5705 const titleField2 = fields.find( 5706 (field) => field.id === view?.titleField 5707 ); 5708 const mediaField = fields.find( 5709 (field) => field.id === view?.mediaField 5710 ); 5711 const descriptionField = fields.find( 5712 (field) => field.id === view?.descriptionField 5713 ); 5714 const otherFields = view.fields ?? []; 5715 const { regularFields, badgeFields } = otherFields.reduce( 5716 (accumulator, fieldId) => { 5717 const field = fields.find((f2) => f2.id === fieldId); 5718 if (!field) { 5719 return accumulator; 5720 } 5721 const key = view.layout?.badgeFields?.includes(fieldId) ? "badgeFields" : "regularFields"; 5722 accumulator[key].push(field); 5723 return accumulator; 5724 }, 5725 { regularFields: [], badgeFields: [] } 5726 ); 5727 const size = "900px"; 5728 const totalRows = Math.ceil(data.length / gridColumns); 5729 const placeholdersNeeded = usePlaceholdersNeeded( 5730 data, 5731 isInfiniteScroll, 5732 gridColumns 5733 ); 5734 return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { 5735 // Render infinite scroll layout (no rows, feed semantics) 5736 children: [ 5737 isInfiniteScroll && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)( 5738 import_components9.Composite, 5739 { 5740 render: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5741 GridItems, 5742 { 5743 className: clsx_default( 5744 "dataviews-view-grid-infinite-scroll", 5745 className, 5746 { 5747 [`has-$view.layout?.density}-density`]: view.layout?.density && [ 5748 "compact", 5749 "comfortable" 5750 ].includes(view.layout.density) 5751 } 5752 ), 5753 previewSize: view.layout?.previewSize, 5754 "aria-busy": isLoading, 5755 ref: resizeObserverRef 5756 } 5757 ), 5758 role: "feed", 5759 focusWrap: true, 5760 inert, 5761 children: [ 5762 Array.from({ length: placeholdersNeeded }).map( 5763 (_, index) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5764 import_components9.Composite.Item, 5765 { 5766 render: (props) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5767 Stack, 5768 { 5769 ...props, 5770 direction: "column", 5771 role: "article", 5772 className: "dataviews-view-grid__row__gridcell dataviews-view-grid__card dataviews-view-grid__placeholder" 5773 } 5774 ), 5775 "aria-hidden": true, 5776 tabIndex: -1 5777 }, 5778 `placeholder-$index}` 5779 ) 5780 ), 5781 data.map((item) => { 5782 const itemId = getItemId(item); 5783 const stablePosition = item.position; 5784 return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5785 import_components9.Composite.Item, 5786 { 5787 render: (props) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5788 GridItem, 5789 { 5790 ...props, 5791 id: itemId, 5792 role: "article", 5793 view, 5794 selection, 5795 onChangeSelection, 5796 onClickItem, 5797 isItemClickable, 5798 renderItemLink, 5799 getItemId, 5800 item, 5801 actions, 5802 mediaField, 5803 titleField: titleField2, 5804 descriptionField, 5805 regularFields, 5806 badgeFields, 5807 hasBulkActions, 5808 posinset: stablePosition, 5809 setsize: paginationInfo.totalItems, 5810 config: { 5811 sizes: size 5812 } 5813 } 5814 ) 5815 }, 5816 itemId 5817 ); 5818 }) 5819 ] 5820 } 5821 ), 5822 // Render standard grid layout (with rows, grid semantics) 5823 !isInfiniteScroll && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5824 import_components9.Composite, 5825 { 5826 role: "grid", 5827 className: clsx_default("dataviews-view-grid", className, { 5828 [`has-$view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( 5829 view.layout.density 5830 ) 5831 }), 5832 focusWrap: true, 5833 "aria-busy": isLoading, 5834 "aria-rowcount": totalRows, 5835 ref: resizeObserverRef, 5836 inert, 5837 children: chunk(data, gridColumns).map((row, i2) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5838 import_components9.Composite.Row, 5839 { 5840 render: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5841 "div", 5842 { 5843 role: "row", 5844 "aria-rowindex": i2 + 1, 5845 "aria-label": (0, import_i18n11.sprintf)( 5846 /* translators: %d: The row number in the grid */ 5847 (0, import_i18n11.__)("Row %d"), 5848 i2 + 1 5849 ), 5850 className: "dataviews-view-grid__row", 5851 style: { 5852 gridTemplateColumns: `repeat( $gridColumns}, minmax(0, 1fr) )` 5853 } 5854 } 5855 ), 5856 children: row.map((item) => { 5857 const itemId = getItemId(item); 5858 return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5859 import_components9.Composite.Item, 5860 { 5861 render: (props) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( 5862 GridItem, 5863 { 5864 ...props, 5865 id: itemId, 5866 role: "gridcell", 5867 view, 5868 selection, 5869 onChangeSelection, 5870 onClickItem, 5871 isItemClickable, 5872 renderItemLink, 5873 getItemId, 5874 item, 5875 actions, 5876 mediaField, 5877 titleField: titleField2, 5878 descriptionField, 5879 regularFields, 5880 badgeFields, 5881 hasBulkActions, 5882 config: { 5883 sizes: size 5884 } 5885 } 5886 ) 5887 }, 5888 itemId 5889 ); 5890 }) 5891 }, 5892 i2 5893 )) 5894 } 5895 ) 5896 ] 5897 }); 5898 } 5899 5900 // packages/dataviews/build-module/components/dataviews-layouts/grid/index.mjs 5901 var import_jsx_runtime51 = __toESM(require_jsx_runtime(), 1); 5902 function ViewGrid({ 5903 actions, 5904 data, 5905 fields, 5906 getItemId, 5907 isLoading, 5908 onChangeSelection, 5909 onClickItem, 5910 isItemClickable, 5911 renderItemLink, 5912 selection, 5913 view, 5914 className, 5915 empty 5916 }) { 5917 const isDelayedLoading = useDelayedLoading(!!isLoading); 5918 const hasData = !!data?.length; 5919 const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; 5920 const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; 5921 const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; 5922 if (!hasData) { 5923 return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)( 5924 "div", 5925 { 5926 className: clsx_default("dataviews-no-results", { 5927 "is-refreshing": isDelayedLoading 5928 }), 5929 children: empty 5930 } 5931 ); 5932 } 5933 const gridProps = { 5934 className: clsx_default(className, { 5935 "is-refreshing": !isInfiniteScroll && isDelayedLoading 5936 }), 5937 inert: !isInfiniteScroll && !!isLoading ? "true" : void 0, 5938 isLoading, 5939 view, 5940 fields, 5941 selection, 5942 onChangeSelection, 5943 onClickItem, 5944 isItemClickable, 5945 renderItemLink, 5946 getItemId, 5947 actions 5948 }; 5949 return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { 5950 // Render multiple groups. 5951 children: [ 5952 hasData && groupField && dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Stack, { direction: "column", gap: "lg", children: Array.from(dataByGroup.entries()).map( 5953 ([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)( 5954 Stack, 5955 { 5956 direction: "column", 5957 gap: "sm", 5958 children: [ 5959 /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("h3", { className: "dataviews-view-grid__group-header", children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n12.sprintf)( 5960 // translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". 5961 (0, import_i18n12.__)("%1$s: %2$s"), 5962 groupField.label, 5963 groupName 5964 ) }), 5965 /* @__PURE__ */ (0, import_jsx_runtime51.jsx)( 5966 CompositeGrid, 5967 { 5968 ...gridProps, 5969 data: groupItems, 5970 isInfiniteScroll: false 5971 } 5972 ) 5973 ] 5974 }, 5975 groupName 5976 ) 5977 ) }), 5978 // Render a single grid with all data. 5979 !dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)( 5980 CompositeGrid, 5981 { 5982 ...gridProps, 5983 data, 5984 isInfiniteScroll: !!isInfiniteScroll 5985 } 5986 ), 5987 isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_components10.Spinner, {}) }) 5988 ] 5989 }); 5990 } 5991 var grid_default = ViewGrid; 5992 5993 // packages/dataviews/build-module/components/dataviews-layouts/list/index.mjs 5994 var import_compose4 = __toESM(require_compose(), 1); 5995 var import_components11 = __toESM(require_components(), 1); 5996 var import_element33 = __toESM(require_element(), 1); 5997 var import_i18n13 = __toESM(require_i18n(), 1); 5998 var import_data3 = __toESM(require_data(), 1); 5999 var import_jsx_runtime52 = __toESM(require_jsx_runtime(), 1); 6000 var { Menu: Menu3 } = unlock(import_components11.privateApis); 6001 function generateItemWrapperCompositeId(idPrefix) { 6002 return `$idPrefix}-item-wrapper`; 6003 } 6004 function generatePrimaryActionCompositeId(idPrefix, primaryActionId) { 6005 return `$idPrefix}-primary-action-$primaryActionId}`; 6006 } 6007 function generateDropdownTriggerCompositeId(idPrefix) { 6008 return `$idPrefix}-dropdown`; 6009 } 6010 function PrimaryActionGridCell({ 6011 idPrefix, 6012 primaryAction, 6013 item 6014 }) { 6015 const registry = (0, import_data3.useRegistry)(); 6016 const [isModalOpen, setIsModalOpen] = (0, import_element33.useState)(false); 6017 const compositeItemId = generatePrimaryActionCompositeId( 6018 idPrefix, 6019 primaryAction.id 6020 ); 6021 const label = typeof primaryAction.label === "string" ? primaryAction.label : primaryAction.label([item]); 6022 return "RenderModal" in primaryAction ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6023 import_components11.Composite.Item, 6024 { 6025 id: compositeItemId, 6026 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6027 import_components11.Button, 6028 { 6029 disabled: !!primaryAction.disabled, 6030 accessibleWhenDisabled: true, 6031 text: label, 6032 size: "small", 6033 onClick: () => setIsModalOpen(true) 6034 } 6035 ), 6036 children: isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6037 ActionModal, 6038 { 6039 action: primaryAction, 6040 items: [item], 6041 closeModal: () => setIsModalOpen(false) 6042 } 6043 ) 6044 } 6045 ) }, primaryAction.id) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6046 import_components11.Composite.Item, 6047 { 6048 id: compositeItemId, 6049 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6050 import_components11.Button, 6051 { 6052 disabled: !!primaryAction.disabled, 6053 accessibleWhenDisabled: true, 6054 size: "small", 6055 onClick: () => { 6056 primaryAction.callback([item], { registry }); 6057 }, 6058 children: label 6059 } 6060 ) 6061 } 6062 ) }, primaryAction.id); 6063 } 6064 function ListItem({ 6065 view, 6066 actions, 6067 idPrefix, 6068 isSelected: isSelected2, 6069 item, 6070 titleField: titleField2, 6071 mediaField, 6072 descriptionField, 6073 onSelect, 6074 otherFields, 6075 onDropdownTriggerKeyDown, 6076 posinset 6077 }) { 6078 const { 6079 showTitle = true, 6080 showMedia = true, 6081 showDescription = true, 6082 infiniteScrollEnabled 6083 } = view; 6084 const itemRef = (0, import_element33.useRef)(null); 6085 const labelId = `$idPrefix}-label`; 6086 const descriptionId = `$idPrefix}-description`; 6087 const registry = (0, import_data3.useRegistry)(); 6088 const [isHovered, setIsHovered] = (0, import_element33.useState)(false); 6089 const [activeModalAction, setActiveModalAction] = (0, import_element33.useState)( 6090 null 6091 ); 6092 const handleHover = ({ type }) => { 6093 const isHover = type === "mouseenter"; 6094 setIsHovered(isHover); 6095 }; 6096 const { paginationInfo } = (0, import_element33.useContext)(dataviews_context_default); 6097 (0, import_element33.useEffect)(() => { 6098 if (isSelected2) { 6099 itemRef.current?.scrollIntoView({ 6100 behavior: "auto", 6101 block: "nearest", 6102 inline: "nearest" 6103 }); 6104 } 6105 }, [isSelected2]); 6106 const { primaryAction, eligibleActions } = (0, import_element33.useMemo)(() => { 6107 const _eligibleActions = actions.filter( 6108 (action) => !action.isEligible || action.isEligible(item) 6109 ); 6110 const _primaryActions = _eligibleActions.filter( 6111 (action) => action.isPrimary 6112 ); 6113 return { 6114 primaryAction: _primaryActions[0], 6115 eligibleActions: _eligibleActions 6116 }; 6117 }, [actions, item]); 6118 const hasOnlyOnePrimaryAction = primaryAction && actions.length === 1; 6119 const renderedMediaField = showMedia && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "dataviews-view-list__media-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6120 mediaField.render, 6121 { 6122 item, 6123 field: mediaField, 6124 config: { sizes: "52px" } 6125 } 6126 ) }) : null; 6127 const renderedTitleField = showTitle && titleField2?.render ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(titleField2.render, { item, field: titleField2 }) : null; 6128 const renderDescription = showDescription && descriptionField?.render; 6129 const hasOnlyMediaAndTitle = !!renderedMediaField && !renderDescription && !otherFields.length; 6130 const usedActions = eligibleActions?.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6131 Stack, 6132 { 6133 direction: "row", 6134 gap: "md", 6135 className: "dataviews-view-list__item-actions", 6136 children: [ 6137 primaryAction && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6138 PrimaryActionGridCell, 6139 { 6140 idPrefix, 6141 primaryAction, 6142 item 6143 } 6144 ), 6145 !hasOnlyOnePrimaryAction && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { role: "gridcell", children: [ 6146 /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Menu3, { placement: "bottom-end", children: [ 6147 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6148 Menu3.TriggerButton, 6149 { 6150 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6151 import_components11.Composite.Item, 6152 { 6153 id: generateDropdownTriggerCompositeId( 6154 idPrefix 6155 ), 6156 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6157 import_components11.Button, 6158 { 6159 size: "small", 6160 icon: more_vertical_default, 6161 label: (0, import_i18n13.__)("Actions"), 6162 accessibleWhenDisabled: true, 6163 disabled: !actions.length, 6164 onKeyDown: onDropdownTriggerKeyDown 6165 } 6166 ) 6167 } 6168 ) 6169 } 6170 ), 6171 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Menu3.Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6172 ActionsMenuGroup, 6173 { 6174 actions: eligibleActions, 6175 item, 6176 registry, 6177 setActiveModalAction 6178 } 6179 ) }) 6180 ] }), 6181 !!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6182 ActionModal, 6183 { 6184 action: activeModalAction, 6185 items: [item], 6186 closeModal: () => setActiveModalAction(null) 6187 } 6188 ) 6189 ] }) 6190 ] 6191 } 6192 ); 6193 return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6194 import_components11.Composite.Row, 6195 { 6196 ref: itemRef, 6197 render: ( 6198 /* aria-posinset breaks Composite.Row if passed to it directly. */ 6199 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6200 "div", 6201 { 6202 "aria-posinset": posinset, 6203 "aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0 6204 } 6205 ) 6206 ), 6207 role: infiniteScrollEnabled ? "article" : "row", 6208 className: clsx_default({ 6209 "is-selected": isSelected2, 6210 "is-hovered": isHovered 6211 }), 6212 onMouseEnter: handleHover, 6213 onMouseLeave: handleHover, 6214 children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6215 Stack, 6216 { 6217 direction: "row", 6218 className: "dataviews-view-list__item-wrapper", 6219 children: [ 6220 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6221 import_components11.Composite.Item, 6222 { 6223 id: generateItemWrapperCompositeId(idPrefix), 6224 "aria-pressed": isSelected2, 6225 "aria-labelledby": labelId, 6226 "aria-describedby": descriptionId, 6227 className: "dataviews-view-list__item", 6228 onClick: () => onSelect(item) 6229 } 6230 ) }), 6231 /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6232 Stack, 6233 { 6234 direction: "row", 6235 gap: "md", 6236 justify: "start", 6237 align: hasOnlyMediaAndTitle ? "center" : "flex-start", 6238 style: { flex: 1, minWidth: 0 }, 6239 children: [ 6240 renderedMediaField, 6241 /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6242 Stack, 6243 { 6244 direction: "column", 6245 gap: "xs", 6246 className: "dataviews-view-list__field-wrapper", 6247 children: [ 6248 /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Stack, { direction: "row", align: "center", children: [ 6249 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6250 "div", 6251 { 6252 className: "dataviews-title-field dataviews-view-list__title-field", 6253 id: labelId, 6254 children: renderedTitleField 6255 } 6256 ), 6257 usedActions 6258 ] }), 6259 renderDescription && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "dataviews-view-list__field", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6260 descriptionField.render, 6261 { 6262 item, 6263 field: descriptionField 6264 } 6265 ) }), 6266 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6267 "div", 6268 { 6269 className: "dataviews-view-list__fields", 6270 id: descriptionId, 6271 children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6272 "div", 6273 { 6274 className: "dataviews-view-list__field", 6275 children: [ 6276 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6277 VisuallyHidden, 6278 { 6279 className: "dataviews-view-list__field-label", 6280 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", {}), 6281 children: field.label 6282 } 6283 ), 6284 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "dataviews-view-list__field-value", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6285 field.render, 6286 { 6287 item, 6288 field 6289 } 6290 ) }) 6291 ] 6292 }, 6293 field.id 6294 )) 6295 } 6296 ) 6297 ] 6298 } 6299 ) 6300 ] 6301 } 6302 ) 6303 ] 6304 } 6305 ) 6306 } 6307 ); 6308 } 6309 function isDefined2(item) { 6310 return !!item; 6311 } 6312 function ViewList(props) { 6313 const { 6314 actions, 6315 data, 6316 fields, 6317 getItemId, 6318 isLoading, 6319 onChangeSelection, 6320 selection, 6321 view, 6322 className, 6323 empty 6324 } = props; 6325 const baseId = (0, import_compose4.useInstanceId)(ViewList, "view-list"); 6326 const isDelayedLoading = useDelayedLoading(!!isLoading); 6327 const selectedItem = data?.findLast( 6328 (item) => selection.includes(getItemId(item)) 6329 ); 6330 const titleField2 = fields.find((field) => field.id === view.titleField); 6331 const mediaField = fields.find((field) => field.id === view.mediaField); 6332 const descriptionField = fields.find( 6333 (field) => field.id === view.descriptionField 6334 ); 6335 const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f2) => fieldId === f2.id)).filter(isDefined2); 6336 const onSelect = (item) => onChangeSelection([getItemId(item)]); 6337 const generateCompositeItemIdPrefix = (0, import_element33.useCallback)( 6338 (item) => `$baseId}-$getItemId(item)}`, 6339 [baseId, getItemId] 6340 ); 6341 const isActiveCompositeItem = (0, import_element33.useCallback)( 6342 (item, idToCheck) => { 6343 return idToCheck.startsWith( 6344 generateCompositeItemIdPrefix(item) 6345 ); 6346 }, 6347 [generateCompositeItemIdPrefix] 6348 ); 6349 const [activeCompositeId, setActiveCompositeId] = (0, import_element33.useState)(void 0); 6350 const compositeRef = (0, import_element33.useRef)(null); 6351 (0, import_element33.useEffect)(() => { 6352 if (selectedItem) { 6353 setActiveCompositeId( 6354 generateItemWrapperCompositeId( 6355 generateCompositeItemIdPrefix(selectedItem) 6356 ) 6357 ); 6358 } 6359 }, [selectedItem, generateCompositeItemIdPrefix]); 6360 const activeItemIndex = data.findIndex( 6361 (item) => isActiveCompositeItem(item, activeCompositeId ?? "") 6362 ); 6363 const previousActiveItemIndex = (0, import_compose4.usePrevious)(activeItemIndex); 6364 const isActiveIdInList = activeItemIndex !== -1; 6365 const selectCompositeItem = (0, import_element33.useCallback)( 6366 (targetIndex, generateCompositeId) => { 6367 const clampedIndex = Math.min( 6368 data.length - 1, 6369 Math.max(0, targetIndex) 6370 ); 6371 if (!data[clampedIndex]) { 6372 return; 6373 } 6374 const itemIdPrefix = generateCompositeItemIdPrefix( 6375 data[clampedIndex] 6376 ); 6377 const targetCompositeItemId = generateCompositeId(itemIdPrefix); 6378 setActiveCompositeId(targetCompositeItemId); 6379 if (compositeRef.current?.contains( 6380 compositeRef.current.ownerDocument.activeElement 6381 )) { 6382 document.getElementById(targetCompositeItemId)?.focus(); 6383 } 6384 }, 6385 [data, generateCompositeItemIdPrefix] 6386 ); 6387 (0, import_element33.useEffect)(() => { 6388 const wasActiveIdInList = previousActiveItemIndex !== void 0 && previousActiveItemIndex !== -1; 6389 if (!isActiveIdInList && wasActiveIdInList) { 6390 selectCompositeItem( 6391 previousActiveItemIndex, 6392 generateItemWrapperCompositeId 6393 ); 6394 } 6395 }, [isActiveIdInList, selectCompositeItem, previousActiveItemIndex]); 6396 const onDropdownTriggerKeyDown = (0, import_element33.useCallback)( 6397 (event) => { 6398 if (event.key === "ArrowDown") { 6399 event.preventDefault(); 6400 selectCompositeItem( 6401 activeItemIndex + 1, 6402 generateDropdownTriggerCompositeId 6403 ); 6404 } 6405 if (event.key === "ArrowUp") { 6406 event.preventDefault(); 6407 selectCompositeItem( 6408 activeItemIndex - 1, 6409 generateDropdownTriggerCompositeId 6410 ); 6411 } 6412 }, 6413 [selectCompositeItem, activeItemIndex] 6414 ); 6415 const hasData = !!data?.length; 6416 const groupField = view.groupBy?.field ? fields.find((field) => field.id === view.groupBy?.field) : null; 6417 const dataByGroup = hasData && groupField ? getDataByGroup(data, groupField) : null; 6418 const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; 6419 if (!hasData) { 6420 return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6421 "div", 6422 { 6423 className: clsx_default("dataviews-no-results", { 6424 "is-refreshing": isDelayedLoading 6425 }), 6426 children: empty 6427 } 6428 ); 6429 } 6430 if (hasData && groupField && dataByGroup) { 6431 return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6432 import_components11.Composite, 6433 { 6434 ref: compositeRef, 6435 id: `$baseId}`, 6436 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", {}), 6437 className: "dataviews-view-list__group", 6438 role: "grid", 6439 activeId: activeCompositeId, 6440 setActiveId: setActiveCompositeId, 6441 children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6442 Stack, 6443 { 6444 direction: "column", 6445 gap: "lg", 6446 className: clsx_default("dataviews-view-list", className), 6447 children: Array.from(dataByGroup.entries()).map( 6448 ([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( 6449 Stack, 6450 { 6451 direction: "column", 6452 gap: "sm", 6453 children: [ 6454 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h3", { className: "dataviews-view-list__group-header", children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n13.sprintf)( 6455 // translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". 6456 (0, import_i18n13.__)("%1$s: %2$s"), 6457 groupField.label, 6458 groupName 6459 ) }), 6460 groupItems.map((item) => { 6461 const id = generateCompositeItemIdPrefix(item); 6462 return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6463 ListItem, 6464 { 6465 view, 6466 idPrefix: id, 6467 actions, 6468 item, 6469 isSelected: item === selectedItem, 6470 onSelect, 6471 mediaField, 6472 titleField: titleField2, 6473 descriptionField, 6474 otherFields, 6475 onDropdownTriggerKeyDown 6476 }, 6477 id 6478 ); 6479 }) 6480 ] 6481 }, 6482 groupName 6483 ) 6484 ) 6485 } 6486 ) 6487 } 6488 ); 6489 } 6490 return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [ 6491 /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6492 import_components11.Composite, 6493 { 6494 ref: compositeRef, 6495 id: baseId, 6496 render: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", {}), 6497 className: clsx_default("dataviews-view-list", className, { 6498 [`has-$view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( 6499 view.layout.density 6500 ), 6501 "is-refreshing": !isInfiniteScroll && isDelayedLoading 6502 }), 6503 role: view.infiniteScrollEnabled ? "feed" : "grid", 6504 activeId: activeCompositeId, 6505 setActiveId: setActiveCompositeId, 6506 inert: !isInfiniteScroll && !!isLoading ? "true" : void 0, 6507 children: data.map((item, index) => { 6508 const id = generateCompositeItemIdPrefix(item); 6509 return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( 6510 ListItem, 6511 { 6512 view, 6513 idPrefix: id, 6514 actions, 6515 item, 6516 isSelected: item === selectedItem, 6517 onSelect, 6518 mediaField, 6519 titleField: titleField2, 6520 descriptionField, 6521 otherFields, 6522 onDropdownTriggerKeyDown, 6523 posinset: view.infiniteScrollEnabled ? index + 1 : void 0 6524 }, 6525 id 6526 ); 6527 }) 6528 } 6529 ), 6530 isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_components11.Spinner, {}) }) 6531 ] }); 6532 } 6533 6534 // packages/dataviews/build-module/components/dataviews-layouts/activity/index.mjs 6535 var import_components12 = __toESM(require_components(), 1); 6536 6537 // packages/dataviews/build-module/components/dataviews-layouts/activity/activity-group.mjs 6538 var import_i18n14 = __toESM(require_i18n(), 1); 6539 var import_element34 = __toESM(require_element(), 1); 6540 var import_jsx_runtime53 = __toESM(require_jsx_runtime(), 1); 6541 function ActivityGroup({ 6542 groupName, 6543 groupData, 6544 groupField, 6545 showLabel = true, 6546 children 6547 }) { 6548 const groupHeader = showLabel ? (0, import_element34.createInterpolateElement)( 6549 // translators: %s: The label of the field e.g. "Status". 6550 (0, import_i18n14.sprintf)((0, import_i18n14.__)("%s: <groupName />"), groupField.label).trim(), 6551 { 6552 groupName: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)( 6553 groupField.render, 6554 { 6555 item: groupData[0], 6556 field: groupField 6557 } 6558 ) 6559 } 6560 ) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(groupField.render, { item: groupData[0], field: groupField }); 6561 return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)( 6562 Stack, 6563 { 6564 direction: "column", 6565 className: "dataviews-view-activity__group", 6566 children: [ 6567 /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("h3", { className: "dataviews-view-activity__group-header", children: groupHeader }), 6568 children 6569 ] 6570 }, 6571 groupName 6572 ); 6573 } 6574 6575 // packages/dataviews/build-module/components/dataviews-layouts/activity/activity-item.mjs 6576 var import_element35 = __toESM(require_element(), 1); 6577 var import_data4 = __toESM(require_data(), 1); 6578 var import_compose5 = __toESM(require_compose(), 1); 6579 var import_jsx_runtime54 = __toESM(require_jsx_runtime(), 1); 6580 function ActivityItem(props) { 6581 const { 6582 view, 6583 actions, 6584 item, 6585 titleField: titleField2, 6586 mediaField, 6587 descriptionField, 6588 otherFields, 6589 posinset, 6590 onClickItem, 6591 renderItemLink, 6592 isItemClickable 6593 } = props; 6594 const { 6595 showTitle = true, 6596 showMedia = true, 6597 showDescription = true, 6598 infiniteScrollEnabled 6599 } = view; 6600 const itemRef = (0, import_element35.useRef)(null); 6601 const registry = (0, import_data4.useRegistry)(); 6602 const { paginationInfo } = (0, import_element35.useContext)(dataviews_context_default); 6603 const { primaryActions, eligibleActions } = (0, import_element35.useMemo)(() => { 6604 const _eligibleActions = actions.filter( 6605 (action) => !action.isEligible || action.isEligible(item) 6606 ); 6607 const _primaryActions = _eligibleActions.filter( 6608 (action) => action.isPrimary 6609 ); 6610 return { 6611 primaryActions: _primaryActions, 6612 eligibleActions: _eligibleActions 6613 }; 6614 }, [actions, item]); 6615 const isMobileViewport = (0, import_compose5.useViewportMatch)("medium", "<"); 6616 const density = view.layout?.density ?? "balanced"; 6617 const mediaContent = showMedia && density !== "compact" && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6618 mediaField.render, 6619 { 6620 item, 6621 field: mediaField, 6622 config: { 6623 sizes: density === "comfortable" ? "32px" : "24px" 6624 } 6625 } 6626 ) : null; 6627 const renderedMediaField = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-view-activity__item-type-icon", children: mediaContent || /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6628 "span", 6629 { 6630 className: "dataviews-view-activity__item-bullet", 6631 "aria-hidden": "true" 6632 } 6633 ) }); 6634 const renderedTitleField = showTitle && titleField2?.render ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(titleField2.render, { item, field: titleField2 }) : null; 6635 const verticalGap = (0, import_element35.useMemo)(() => { 6636 switch (density) { 6637 case "comfortable": 6638 return "md"; 6639 default: 6640 return "sm"; 6641 } 6642 }, [density]); 6643 return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6644 "div", 6645 { 6646 ref: itemRef, 6647 role: infiniteScrollEnabled ? "article" : void 0, 6648 "aria-posinset": posinset, 6649 "aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0, 6650 className: clsx_default( 6651 "dataviews-view-activity__item", 6652 density === "compact" && "is-compact", 6653 density === "balanced" && "is-balanced", 6654 density === "comfortable" && "is-comfortable" 6655 ), 6656 children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Stack, { direction: "row", gap: "lg", justify: "start", align: "flex-start", children: [ 6657 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6658 Stack, 6659 { 6660 direction: "column", 6661 gap: "xs", 6662 align: "center", 6663 className: "dataviews-view-activity__item-type", 6664 children: renderedMediaField 6665 } 6666 ), 6667 /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)( 6668 Stack, 6669 { 6670 direction: "column", 6671 gap: verticalGap, 6672 align: "flex-start", 6673 className: "dataviews-view-activity__item-content", 6674 children: [ 6675 renderedTitleField && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6676 ItemClickWrapper, 6677 { 6678 item, 6679 isItemClickable, 6680 onClickItem, 6681 renderItemLink, 6682 className: "dataviews-view-activity__item-title", 6683 children: renderedTitleField 6684 } 6685 ), 6686 showDescription && descriptionField && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-view-activity__item-description", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6687 descriptionField.render, 6688 { 6689 item, 6690 field: descriptionField 6691 } 6692 ) }), 6693 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-view-activity__item-fields", children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)( 6694 "div", 6695 { 6696 className: "dataviews-view-activity__item-field", 6697 children: [ 6698 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6699 VisuallyHidden, 6700 { 6701 className: "dataviews-view-activity__item-field-label", 6702 render: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", {}), 6703 children: field.label 6704 } 6705 ), 6706 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "dataviews-view-activity__item-field-value", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6707 field.render, 6708 { 6709 item, 6710 field 6711 } 6712 ) }) 6713 ] 6714 }, 6715 field.id 6716 )) }), 6717 !!primaryActions?.length && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6718 PrimaryActions, 6719 { 6720 item, 6721 actions: primaryActions, 6722 registry, 6723 buttonVariant: "secondary" 6724 } 6725 ) 6726 ] 6727 } 6728 ), 6729 (primaryActions.length < eligibleActions.length || // Since we hide primary actions on mobile, we need to show the menu 6730 // there if there are any actions at all. 6731 isMobileViewport && // At the same time, only show the menu if there are actions to show. 6732 eligibleActions.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-view-activity__item-actions", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( 6733 ItemActions, 6734 { 6735 item, 6736 actions: eligibleActions, 6737 isCompact: true 6738 } 6739 ) }) 6740 ] }) 6741 } 6742 ); 6743 } 6744 var activity_item_default = ActivityItem; 6745 6746 // packages/dataviews/build-module/components/dataviews-layouts/activity/activity-items.mjs 6747 var import_react9 = __toESM(require_react(), 1); 6748 function isDefined3(item) { 6749 return !!item; 6750 } 6751 function ActivityItems(props) { 6752 const { data, fields, getItemId, view } = props; 6753 const titleField2 = fields.find((field) => field.id === view.titleField); 6754 const mediaField = fields.find((field) => field.id === view.mediaField); 6755 const descriptionField = fields.find( 6756 (field) => field.id === view.descriptionField 6757 ); 6758 const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f2) => fieldId === f2.id)).filter(isDefined3); 6759 return data.map((item, index) => { 6760 return /* @__PURE__ */ (0, import_react9.createElement)( 6761 activity_item_default, 6762 { 6763 ...props, 6764 key: getItemId(item), 6765 item, 6766 mediaField, 6767 titleField: titleField2, 6768 descriptionField, 6769 otherFields, 6770 posinset: view.infiniteScrollEnabled ? index + 1 : void 0 6771 } 6772 ); 6773 }); 6774 } 6775 6776 // packages/dataviews/build-module/components/dataviews-layouts/activity/index.mjs 6777 var import_jsx_runtime55 = __toESM(require_jsx_runtime(), 1); 6778 function ViewActivity(props) { 6779 const { empty, data, fields, isLoading, view, className } = props; 6780 const isDelayedLoading = useDelayedLoading(!!isLoading); 6781 const hasData = !!data?.length; 6782 const groupField = view.groupBy?.field ? fields.find((field) => field.id === view.groupBy?.field) : null; 6783 const dataByGroup = hasData && groupField ? getDataByGroup(data, groupField) : null; 6784 const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; 6785 if (!hasData) { 6786 return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)( 6787 "div", 6788 { 6789 className: clsx_default("dataviews-no-results", { 6790 "is-refreshing": isDelayedLoading 6791 }), 6792 children: empty 6793 } 6794 ); 6795 } 6796 const isInert = !isInfiniteScroll && !!isLoading; 6797 const wrapperClassName = clsx_default("dataviews-view-activity", className, { 6798 "is-refreshing": !isInfiniteScroll && isDelayedLoading 6799 }); 6800 const groupedEntries = dataByGroup ? Array.from(dataByGroup.entries()) : []; 6801 if (hasData && groupField && dataByGroup) { 6802 return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)( 6803 Stack, 6804 { 6805 direction: "column", 6806 gap: "sm", 6807 className: wrapperClassName, 6808 inert: isInert ? "true" : void 0, 6809 children: groupedEntries.map( 6810 ([groupName, groupData]) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)( 6811 ActivityGroup, 6812 { 6813 groupName, 6814 groupData, 6815 groupField, 6816 showLabel: view.groupBy?.showLabel !== false, 6817 children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)( 6818 ActivityItems, 6819 { 6820 ...props, 6821 data: groupData 6822 } 6823 ) 6824 }, 6825 groupName 6826 ) 6827 ) 6828 } 6829 ); 6830 } 6831 return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [ 6832 /* @__PURE__ */ (0, import_jsx_runtime55.jsx)( 6833 "div", 6834 { 6835 className: wrapperClassName, 6836 role: view.infiniteScrollEnabled ? "feed" : void 0, 6837 inert: isInert ? "true" : void 0, 6838 children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ActivityItems, { ...props }) 6839 } 6840 ), 6841 isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_components12.Spinner, {}) }) 6842 ] }); 6843 } 6844 6845 // packages/dataviews/build-module/components/dataviews-layouts/picker-grid/index.mjs 6846 var import_components15 = __toESM(require_components(), 1); 6847 var import_i18n17 = __toESM(require_i18n(), 1); 6848 var import_compose6 = __toESM(require_compose(), 1); 6849 var import_element38 = __toESM(require_element(), 1); 6850 6851 // packages/dataviews/build-module/components/dataviews-picker-footer/index.mjs 6852 var import_components14 = __toESM(require_components(), 1); 6853 var import_data5 = __toESM(require_data(), 1); 6854 var import_element37 = __toESM(require_element(), 1); 6855 var import_i18n16 = __toESM(require_i18n(), 1); 6856 6857 // packages/dataviews/build-module/components/dataviews-pagination/index.mjs 6858 var import_components13 = __toESM(require_components(), 1); 6859 var import_element36 = __toESM(require_element(), 1); 6860 var import_i18n15 = __toESM(require_i18n(), 1); 6861 var import_jsx_runtime56 = __toESM(require_jsx_runtime(), 1); 6862 function DataViewsPagination() { 6863 const { 6864 view, 6865 onChangeView, 6866 paginationInfo: { totalItems = 0, totalPages } 6867 } = (0, import_element36.useContext)(dataviews_context_default); 6868 if (!totalItems || !totalPages || view.infiniteScrollEnabled) { 6869 return null; 6870 } 6871 const currentPage = view.page ?? 1; 6872 const pageSelectOptions = Array.from(Array(totalPages)).map( 6873 (_, i2) => { 6874 const page = i2 + 1; 6875 return { 6876 value: page.toString(), 6877 label: page.toString(), 6878 "aria-label": currentPage === page ? (0, import_i18n15.sprintf)( 6879 // translators: 1: current page number. 2: total number of pages. 6880 (0, import_i18n15.__)("Page %1$d of %2$d"), 6881 currentPage, 6882 totalPages 6883 ) : page.toString() 6884 }; 6885 } 6886 ); 6887 return !!totalItems && totalPages !== 1 && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)( 6888 Stack, 6889 { 6890 direction: "row", 6891 className: "dataviews-pagination", 6892 justify: "end", 6893 align: "center", 6894 gap: "xl", 6895 children: [ 6896 /* @__PURE__ */ (0, import_jsx_runtime56.jsx)( 6897 Stack, 6898 { 6899 direction: "row", 6900 justify: "flex-start", 6901 align: "center", 6902 gap: "xs", 6903 className: "dataviews-pagination__page-select", 6904 children: (0, import_element36.createInterpolateElement)( 6905 (0, import_i18n15.sprintf)( 6906 // translators: 1: Current page number, 2: Total number of pages. 6907 (0, import_i18n15._x)( 6908 "<div>Page</div>%1$s<div>of %2$d</div>", 6909 "paging" 6910 ), 6911 "<CurrentPage />", 6912 totalPages 6913 ), 6914 { 6915 div: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { "aria-hidden": true }), 6916 // @ts-expect-error — Tag injected via sprintf argument, not visible in format string. 6917 CurrentPage: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)( 6918 import_components13.SelectControl, 6919 { 6920 "aria-label": (0, import_i18n15.__)("Current page"), 6921 value: currentPage.toString(), 6922 options: pageSelectOptions, 6923 onChange: (newValue) => { 6924 onChangeView({ 6925 ...view, 6926 page: +newValue 6927 }); 6928 }, 6929 size: "small", 6930 variant: "minimal" 6931 } 6932 ) 6933 } 6934 ) 6935 } 6936 ), 6937 /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Stack, { direction: "row", gap: "xs", align: "center", children: [ 6938 /* @__PURE__ */ (0, import_jsx_runtime56.jsx)( 6939 import_components13.Button, 6940 { 6941 onClick: () => onChangeView({ 6942 ...view, 6943 page: currentPage - 1 6944 }), 6945 disabled: currentPage === 1, 6946 accessibleWhenDisabled: true, 6947 label: (0, import_i18n15.__)("Previous page"), 6948 icon: (0, import_i18n15.isRTL)() ? next_default : previous_default, 6949 showTooltip: true, 6950 size: "compact", 6951 tooltipPosition: "top" 6952 } 6953 ), 6954 /* @__PURE__ */ (0, import_jsx_runtime56.jsx)( 6955 import_components13.Button, 6956 { 6957 onClick: () => onChangeView({ ...view, page: currentPage + 1 }), 6958 disabled: currentPage >= totalPages, 6959 accessibleWhenDisabled: true, 6960 label: (0, import_i18n15.__)("Next page"), 6961 icon: (0, import_i18n15.isRTL)() ? previous_default : next_default, 6962 showTooltip: true, 6963 size: "compact", 6964 tooltipPosition: "top" 6965 } 6966 ) 6967 ] }) 6968 ] 6969 } 6970 ); 6971 } 6972 var dataviews_pagination_default = (0, import_element36.memo)(DataViewsPagination); 6973 6974 // packages/dataviews/build-module/components/dataviews-picker-footer/index.mjs 6975 var import_jsx_runtime57 = __toESM(require_jsx_runtime(), 1); 6976 function useIsMultiselectPicker(actions) { 6977 return (0, import_element37.useMemo)(() => { 6978 return actions?.every((action) => action.supportsBulk); 6979 }, [actions]); 6980 } 6981 6982 // packages/dataviews/build-module/components/dataviews-layouts/picker-grid/index.mjs 6983 var import_jsx_runtime58 = __toESM(require_jsx_runtime(), 1); 6984 var { Badge: WCBadge2 } = unlock(import_components15.privateApis); 6985 function GridItem3({ 6986 view, 6987 multiselect, 6988 selection, 6989 onChangeSelection, 6990 getItemId, 6991 item, 6992 mediaField, 6993 titleField: titleField2, 6994 descriptionField, 6995 regularFields, 6996 badgeFields, 6997 config, 6998 posinset, 6999 setsize 7000 }) { 7001 const { showTitle = true, showMedia = true, showDescription = true } = view; 7002 const id = getItemId(item); 7003 const elementRef = (0, import_element38.useRef)(null); 7004 const isSelected2 = selection.includes(id); 7005 useIntersectionObserver(elementRef, posinset); 7006 const renderedMediaField = mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7007 mediaField.render, 7008 { 7009 item, 7010 field: mediaField, 7011 config 7012 } 7013 ) : null; 7014 const renderedTitleField = showTitle && titleField2?.render ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(titleField2.render, { item, field: titleField2 }) : null; 7015 return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)( 7016 import_components15.Composite.Item, 7017 { 7018 ref: elementRef, 7019 "aria-label": titleField2 ? titleField2.getValue({ item }) || (0, import_i18n17.__)("(no title)") : void 0, 7020 render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Stack, { direction: "column", children, ...props }), 7021 role: "option", 7022 "aria-posinset": posinset, 7023 "aria-setsize": setsize, 7024 className: clsx_default("dataviews-view-picker-grid__card", { 7025 "is-selected": isSelected2 7026 }), 7027 "aria-selected": isSelected2, 7028 onClick: () => { 7029 if (isSelected2) { 7030 onChangeSelection( 7031 selection.filter((itemId) => id !== itemId) 7032 ); 7033 } else { 7034 const newSelection = multiselect ? [...selection, id] : [id]; 7035 onChangeSelection(newSelection); 7036 } 7037 }, 7038 children: [ 7039 showMedia && renderedMediaField && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "dataviews-view-picker-grid__media", children: renderedMediaField }), 7040 showMedia && renderedMediaField && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7041 DataViewsSelectionCheckbox, 7042 { 7043 item, 7044 selection, 7045 onChangeSelection, 7046 getItemId, 7047 titleField: titleField2, 7048 disabled: false, 7049 "aria-hidden": true, 7050 tabIndex: -1 7051 } 7052 ), 7053 showTitle && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7054 Stack, 7055 { 7056 direction: "row", 7057 justify: "space-between", 7058 className: "dataviews-view-picker-grid__title-actions", 7059 children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "dataviews-view-picker-grid__title-field dataviews-title-field", children: renderedTitleField }) 7060 } 7061 ), 7062 /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(Stack, { direction: "column", gap: "xs", children: [ 7063 showDescription && descriptionField?.render && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7064 descriptionField.render, 7065 { 7066 item, 7067 field: descriptionField 7068 } 7069 ), 7070 !!badgeFields?.length && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7071 Stack, 7072 { 7073 direction: "row", 7074 className: "dataviews-view-picker-grid__badge-fields", 7075 gap: "sm", 7076 wrap: "wrap", 7077 align: "top", 7078 justify: "flex-start", 7079 children: badgeFields.map((field) => { 7080 return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7081 WCBadge2, 7082 { 7083 className: "dataviews-view-picker-grid__field-value", 7084 children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7085 field.render, 7086 { 7087 item, 7088 field 7089 } 7090 ) 7091 }, 7092 field.id 7093 ); 7094 }) 7095 } 7096 ), 7097 !!regularFields?.length && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7098 Stack, 7099 { 7100 direction: "column", 7101 className: "dataviews-view-picker-grid__fields", 7102 gap: "xs", 7103 children: regularFields.map((field) => { 7104 return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7105 import_components15.Flex, 7106 { 7107 className: "dataviews-view-picker-grid__field", 7108 gap: 1, 7109 justify: "flex-start", 7110 expanded: true, 7111 style: { height: "auto" }, 7112 direction: "row", 7113 children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_jsx_runtime58.Fragment, { children: [ 7114 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components15.FlexItem, { className: "dataviews-view-picker-grid__field-name", children: field.header }), 7115 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7116 import_components15.FlexItem, 7117 { 7118 className: "dataviews-view-picker-grid__field-value", 7119 style: { maxHeight: "none" }, 7120 children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7121 field.render, 7122 { 7123 item, 7124 field 7125 } 7126 ) 7127 } 7128 ) 7129 ] }) 7130 }, 7131 field.id 7132 ); 7133 }) 7134 } 7135 ) 7136 ] }) 7137 ] 7138 }, 7139 id 7140 ); 7141 } 7142 function GridGroup({ 7143 groupName, 7144 groupField, 7145 showLabel = true, 7146 children 7147 }) { 7148 const headerId = (0, import_compose6.useInstanceId)( 7149 GridGroup, 7150 "dataviews-view-picker-grid-group__header" 7151 ); 7152 return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)( 7153 Stack, 7154 { 7155 direction: "column", 7156 gap: "sm", 7157 role: "group", 7158 "aria-labelledby": headerId, 7159 children: [ 7160 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7161 "h3", 7162 { 7163 className: "dataviews-view-picker-grid-group__header", 7164 id: headerId, 7165 children: showLabel ? (0, import_i18n17.sprintf)( 7166 // translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". 7167 (0, import_i18n17.__)("%1$s: %2$s"), 7168 groupField.label, 7169 groupName 7170 ) : groupName 7171 } 7172 ), 7173 children 7174 ] 7175 }, 7176 groupName 7177 ); 7178 } 7179 function ViewPickerGrid({ 7180 actions, 7181 data, 7182 fields, 7183 getItemId, 7184 isLoading, 7185 onChangeSelection, 7186 selection, 7187 view, 7188 className, 7189 empty 7190 }) { 7191 const { resizeObserverRef, paginationInfo, itemListLabel } = (0, import_element38.useContext)(dataviews_context_default); 7192 const titleField2 = fields.find( 7193 (field) => field.id === view?.titleField 7194 ); 7195 const mediaField = fields.find( 7196 (field) => field.id === view?.mediaField 7197 ); 7198 const descriptionField = fields.find( 7199 (field) => field.id === view?.descriptionField 7200 ); 7201 const otherFields = view.fields ?? []; 7202 const { regularFields, badgeFields } = otherFields.reduce( 7203 (accumulator, fieldId) => { 7204 const field = fields.find((f2) => f2.id === fieldId); 7205 if (!field) { 7206 return accumulator; 7207 } 7208 const key = view.layout?.badgeFields?.includes(fieldId) ? "badgeFields" : "regularFields"; 7209 accumulator[key].push(field); 7210 return accumulator; 7211 }, 7212 { regularFields: [], badgeFields: [] } 7213 ); 7214 const hasData = !!data?.length; 7215 const usedPreviewSize = view.layout?.previewSize; 7216 const isMultiselect = useIsMultiselectPicker(actions); 7217 const size = "900px"; 7218 const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; 7219 const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; 7220 const isInfiniteScroll = (view.infiniteScrollEnabled && !dataByGroup) ?? false; 7221 const currentPage = view?.page ?? 1; 7222 const perPage = view?.perPage ?? 0; 7223 const setSize = isInfiniteScroll ? paginationInfo?.totalItems : void 0; 7224 const gridColumns = useGridColumns(); 7225 const placeholdersNeeded = usePlaceholdersNeeded( 7226 data, 7227 isInfiniteScroll, 7228 gridColumns 7229 ); 7230 return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_jsx_runtime58.Fragment, { 7231 // Render multiple groups. 7232 children: [ 7233 hasData && groupField && dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7234 import_components15.Composite, 7235 { 7236 virtualFocus: true, 7237 orientation: "horizontal", 7238 role: "listbox", 7239 "aria-multiselectable": isMultiselect, 7240 className: clsx_default( 7241 "dataviews-view-picker-grid", 7242 className, 7243 { 7244 [`has-$view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( 7245 view.layout.density 7246 ) 7247 } 7248 ), 7249 "aria-label": itemListLabel, 7250 render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7251 Stack, 7252 { 7253 direction: "column", 7254 gap: "lg", 7255 children, 7256 ...props 7257 } 7258 ), 7259 children: Array.from(dataByGroup.entries()).map( 7260 ([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7261 GridGroup, 7262 { 7263 groupName, 7264 groupField, 7265 showLabel: view.groupBy?.showLabel !== false, 7266 children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7267 GridItems, 7268 { 7269 previewSize: usedPreviewSize, 7270 style: { 7271 gridTemplateColumns: usedPreviewSize && `repeat(auto-fill, minmax($usedPreviewSize}px, 1fr))` 7272 }, 7273 "aria-busy": isLoading, 7274 ref: resizeObserverRef, 7275 children: groupItems.map((item) => { 7276 const posInSet = item.position ?? (currentPage - 1) * perPage + data.indexOf(item) + 1; 7277 return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7278 GridItem3, 7279 { 7280 view, 7281 multiselect: isMultiselect, 7282 selection, 7283 onChangeSelection, 7284 getItemId, 7285 item, 7286 mediaField, 7287 titleField: titleField2, 7288 descriptionField, 7289 regularFields, 7290 badgeFields, 7291 config: { 7292 sizes: size 7293 }, 7294 posinset: posInSet, 7295 setsize: setSize 7296 }, 7297 getItemId(item) 7298 ); 7299 }) 7300 } 7301 ) 7302 }, 7303 groupName 7304 ) 7305 ) 7306 } 7307 ), 7308 // Render a single grid with all data. 7309 hasData && !dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)( 7310 import_components15.Composite, 7311 { 7312 render: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7313 GridItems, 7314 { 7315 className: clsx_default( 7316 "dataviews-view-picker-grid", 7317 className, 7318 { 7319 [`has-$view.layout?.density}-density`]: view.layout?.density && [ 7320 "compact", 7321 "comfortable" 7322 ].includes(view.layout.density) 7323 } 7324 ), 7325 previewSize: usedPreviewSize, 7326 "aria-busy": isLoading, 7327 ref: resizeObserverRef 7328 } 7329 ), 7330 virtualFocus: true, 7331 orientation: "horizontal", 7332 role: "listbox", 7333 "aria-multiselectable": isMultiselect, 7334 "aria-label": itemListLabel, 7335 children: [ 7336 Array.from({ length: placeholdersNeeded }).map( 7337 (_, index) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7338 import_components15.Composite.Item, 7339 { 7340 render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7341 Stack, 7342 { 7343 direction: "column", 7344 children, 7345 ...props 7346 } 7347 ), 7348 role: "option", 7349 "aria-hidden": true, 7350 tabIndex: -1, 7351 className: "dataviews-view-picker-grid__card dataviews-view-picker-grid__placeholder" 7352 }, 7353 `placeholder-$index}` 7354 ) 7355 ), 7356 data.map((item) => { 7357 const posinset = item.position; 7358 return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7359 GridItem3, 7360 { 7361 view, 7362 multiselect: isMultiselect, 7363 selection, 7364 onChangeSelection, 7365 getItemId, 7366 item, 7367 mediaField, 7368 titleField: titleField2, 7369 descriptionField, 7370 regularFields, 7371 badgeFields, 7372 config: { 7373 sizes: size 7374 }, 7375 posinset, 7376 setsize: setSize 7377 }, 7378 getItemId(item) 7379 ); 7380 }) 7381 ] 7382 } 7383 ), 7384 // Render empty state. 7385 !hasData && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( 7386 "div", 7387 { 7388 className: clsx_default({ 7389 "dataviews-loading": isLoading, 7390 "dataviews-no-results": !isLoading 7391 }), 7392 children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components15.Spinner, {}) }) : empty 7393 } 7394 ), 7395 hasData && isLoading && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components15.Spinner, {}) }) 7396 ] 7397 }); 7398 } 7399 var picker_grid_default = ViewPickerGrid; 7400 7401 // packages/dataviews/build-module/components/dataviews-layouts/picker-table/index.mjs 7402 var import_i18n18 = __toESM(require_i18n(), 1); 7403 var import_components16 = __toESM(require_components(), 1); 7404 var import_element39 = __toESM(require_element(), 1); 7405 var import_jsx_runtime59 = __toESM(require_jsx_runtime(), 1); 7406 function TableColumnField2({ 7407 item, 7408 fields, 7409 column, 7410 align 7411 }) { 7412 const field = fields.find((f2) => f2.id === column); 7413 if (!field) { 7414 return null; 7415 } 7416 const className = clsx_default("dataviews-view-table__cell-content-wrapper", { 7417 "dataviews-view-table__cell-align-end": align === "end", 7418 "dataviews-view-table__cell-align-center": align === "center" 7419 }); 7420 return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(field.render, { item, field }) }); 7421 } 7422 function TableRow2({ 7423 item, 7424 fields, 7425 id, 7426 view, 7427 titleField: titleField2, 7428 mediaField, 7429 descriptionField, 7430 selection, 7431 getItemId, 7432 onChangeSelection, 7433 multiselect, 7434 posinset 7435 }) { 7436 const { paginationInfo } = (0, import_element39.useContext)(dataviews_context_default); 7437 const isSelected2 = selection.includes(id); 7438 const [isHovered, setIsHovered] = (0, import_element39.useState)(false); 7439 const elementRef = (0, import_element39.useRef)(null); 7440 useIntersectionObserver(elementRef, posinset); 7441 const { 7442 showTitle = true, 7443 showMedia = true, 7444 showDescription = true, 7445 infiniteScrollEnabled 7446 } = view; 7447 const handleMouseEnter = () => { 7448 setIsHovered(true); 7449 }; 7450 const handleMouseLeave = () => { 7451 setIsHovered(false); 7452 }; 7453 const columns = view.fields ?? []; 7454 const hasPrimaryColumn = titleField2 && showTitle || mediaField && showMedia || descriptionField && showDescription; 7455 return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( 7456 import_components16.Composite.Item, 7457 { 7458 ref: elementRef, 7459 render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7460 "tr", 7461 { 7462 className: clsx_default("dataviews-view-table__row", { 7463 "is-selected": isSelected2, 7464 "is-hovered": isHovered 7465 }), 7466 onMouseEnter: handleMouseEnter, 7467 onMouseLeave: handleMouseLeave, 7468 children, 7469 ...props 7470 } 7471 ), 7472 "aria-selected": isSelected2, 7473 "aria-setsize": paginationInfo.totalItems || void 0, 7474 "aria-posinset": posinset, 7475 role: infiniteScrollEnabled ? "article" : "option", 7476 onClick: () => { 7477 if (isSelected2) { 7478 onChangeSelection( 7479 selection.filter((itemId) => id !== itemId) 7480 ); 7481 } else { 7482 const newSelection = multiselect ? [...selection, id] : [id]; 7483 onChangeSelection(newSelection); 7484 } 7485 }, 7486 children: [ 7487 /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7488 "td", 7489 { 7490 className: "dataviews-view-table__checkbox-column", 7491 role: "presentation", 7492 children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "dataviews-view-table__cell-content-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7493 DataViewsSelectionCheckbox, 7494 { 7495 item, 7496 selection, 7497 onChangeSelection, 7498 getItemId, 7499 titleField: titleField2, 7500 disabled: false, 7501 "aria-hidden": true, 7502 tabIndex: -1 7503 } 7504 ) }) 7505 } 7506 ), 7507 hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7508 "td", 7509 { 7510 role: "presentation", 7511 children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7512 column_primary_default, 7513 { 7514 item, 7515 titleField: showTitle ? titleField2 : void 0, 7516 mediaField: showMedia ? mediaField : void 0, 7517 descriptionField: showDescription ? descriptionField : void 0, 7518 isItemClickable: () => false 7519 } 7520 ) 7521 } 7522 ), 7523 columns.map((column) => { 7524 const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; 7525 return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7526 "td", 7527 { 7528 style: { 7529 width, 7530 maxWidth, 7531 minWidth 7532 }, 7533 role: "presentation", 7534 children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7535 TableColumnField2, 7536 { 7537 fields, 7538 item, 7539 column, 7540 align 7541 } 7542 ) 7543 }, 7544 column 7545 ); 7546 }) 7547 ] 7548 }, 7549 id 7550 ); 7551 } 7552 function ViewPickerTable({ 7553 actions, 7554 data, 7555 fields, 7556 getItemId, 7557 isLoading = false, 7558 onChangeView, 7559 onChangeSelection, 7560 selection, 7561 setOpenedFilter, 7562 view, 7563 className, 7564 empty 7565 }) { 7566 const headerMenuRefs = (0, import_element39.useRef)(/* @__PURE__ */ new Map()); 7567 const headerMenuToFocusRef = (0, import_element39.useRef)(void 0); 7568 const [nextHeaderMenuToFocus, setNextHeaderMenuToFocus] = (0, import_element39.useState)(); 7569 const isMultiselect = useIsMultiselectPicker(actions) ?? false; 7570 (0, import_element39.useEffect)(() => { 7571 if (headerMenuToFocusRef.current) { 7572 headerMenuToFocusRef.current.focus(); 7573 headerMenuToFocusRef.current = void 0; 7574 } 7575 }); 7576 const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; 7577 const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; 7578 const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; 7579 const tableNoticeId = (0, import_element39.useId)(); 7580 if (nextHeaderMenuToFocus) { 7581 headerMenuToFocusRef.current = nextHeaderMenuToFocus; 7582 setNextHeaderMenuToFocus(void 0); 7583 return; 7584 } 7585 const onHide = (field) => { 7586 const hidden = headerMenuRefs.current.get(field.id); 7587 const fallback = hidden ? headerMenuRefs.current.get(hidden.fallback) : void 0; 7588 setNextHeaderMenuToFocus(fallback?.node); 7589 }; 7590 const hasData = !!data?.length; 7591 const titleField2 = fields.find((field) => field.id === view.titleField); 7592 const mediaField = fields.find((field) => field.id === view.mediaField); 7593 const descriptionField = fields.find( 7594 (field) => field.id === view.descriptionField 7595 ); 7596 const { showTitle = true, showMedia = true, showDescription = true } = view; 7597 const hasPrimaryColumn = titleField2 && showTitle || mediaField && showMedia || descriptionField && showDescription; 7598 const columns = view.fields ?? []; 7599 const headerMenuRef = (column, index) => (node) => { 7600 if (node) { 7601 headerMenuRefs.current.set(column, { 7602 node, 7603 fallback: columns[index > 0 ? index - 1 : 1] 7604 }); 7605 } else { 7606 headerMenuRefs.current.delete(column); 7607 } 7608 }; 7609 return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_jsx_runtime59.Fragment, { children: [ 7610 /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( 7611 "table", 7612 { 7613 className: clsx_default( 7614 "dataviews-view-table", 7615 "dataviews-view-picker-table", 7616 className, 7617 { 7618 [`has-$view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( 7619 view.layout.density 7620 ) 7621 } 7622 ), 7623 "aria-busy": isLoading, 7624 "aria-describedby": tableNoticeId, 7625 role: isInfiniteScroll ? "feed" : "listbox", 7626 children: [ 7627 /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("thead", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( 7628 "tr", 7629 { 7630 className: "dataviews-view-table__row", 7631 role: "presentation", 7632 children: [ 7633 /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("th", { className: "dataviews-view-table__checkbox-column", children: isMultiselect && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7634 BulkSelectionCheckbox, 7635 { 7636 selection, 7637 onChangeSelection, 7638 data, 7639 actions, 7640 getItemId, 7641 disableSelectAll: isInfiniteScroll 7642 } 7643 ) }), 7644 hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("th", { children: titleField2 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7645 column_header_menu_default, 7646 { 7647 ref: headerMenuRef( 7648 titleField2.id, 7649 0 7650 ), 7651 fieldId: titleField2.id, 7652 view, 7653 fields, 7654 onChangeView, 7655 onHide, 7656 setOpenedFilter, 7657 canMove: false 7658 } 7659 ) }), 7660 columns.map((column, index) => { 7661 const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; 7662 return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7663 "th", 7664 { 7665 style: { 7666 width, 7667 maxWidth, 7668 minWidth, 7669 textAlign: align 7670 }, 7671 "aria-sort": view.sort?.direction && view.sort?.field === column ? sortValues[view.sort.direction] : void 0, 7672 scope: "col", 7673 children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7674 column_header_menu_default, 7675 { 7676 ref: headerMenuRef(column, index), 7677 fieldId: column, 7678 view, 7679 fields, 7680 onChangeView, 7681 onHide, 7682 setOpenedFilter, 7683 canMove: view.layout?.enableMoving ?? true 7684 } 7685 ) 7686 }, 7687 column 7688 ); 7689 }) 7690 ] 7691 } 7692 ) }), 7693 hasData && groupField && dataByGroup ? Array.from(dataByGroup.entries()).map( 7694 ([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( 7695 import_components16.Composite, 7696 { 7697 virtualFocus: true, 7698 orientation: "vertical", 7699 render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("tbody", { role: "group" }), 7700 children: [ 7701 /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7702 "tr", 7703 { 7704 className: "dataviews-view-table__group-header-row", 7705 role: "presentation", 7706 children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7707 "td", 7708 { 7709 colSpan: columns.length + (hasPrimaryColumn ? 1 : 0) + 1, 7710 className: "dataviews-view-table__group-header-cell", 7711 role: "presentation", 7712 children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n18.sprintf)( 7713 // translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". 7714 (0, import_i18n18.__)("%1$s: %2$s"), 7715 groupField.label, 7716 groupName 7717 ) 7718 } 7719 ) 7720 } 7721 ), 7722 groupItems.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7723 TableRow2, 7724 { 7725 item, 7726 fields, 7727 id: getItemId(item) || index.toString(), 7728 view, 7729 titleField: titleField2, 7730 mediaField, 7731 descriptionField, 7732 selection, 7733 getItemId, 7734 onChangeSelection, 7735 multiselect: isMultiselect 7736 }, 7737 getItemId(item) 7738 )) 7739 ] 7740 }, 7741 `group-$groupName}` 7742 ) 7743 ) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7744 import_components16.Composite, 7745 { 7746 render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("tbody", { role: "presentation" }), 7747 virtualFocus: true, 7748 orientation: "vertical", 7749 children: hasData && data.map((item, index) => { 7750 const itemId = getItemId(item); 7751 const posinset = item.position; 7752 return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( 7753 TableRow2, 7754 { 7755 item, 7756 fields, 7757 id: itemId || index.toString(), 7758 view, 7759 titleField: titleField2, 7760 mediaField, 7761 descriptionField, 7762 selection, 7763 getItemId, 7764 onChangeSelection, 7765 multiselect: isMultiselect, 7766 posinset 7767 }, 7768 itemId 7769 ); 7770 }) 7771 } 7772 ) 7773 ] 7774 } 7775 ), 7776 /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( 7777 "div", 7778 { 7779 className: clsx_default({ 7780 "dataviews-loading": isLoading, 7781 "dataviews-no-results": !hasData && !isLoading 7782 }), 7783 id: tableNoticeId, 7784 children: [ 7785 !hasData && (isLoading ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components16.Spinner, {}) }) : empty), 7786 hasData && isLoading && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components16.Spinner, {}) }) 7787 ] 7788 } 7789 ) 7790 ] }); 7791 } 7792 var picker_table_default = ViewPickerTable; 7793 7794 // packages/dataviews/build-module/components/dataviews-layouts/utils/density-picker.mjs 7795 var import_components17 = __toESM(require_components(), 1); 7796 var import_i18n19 = __toESM(require_i18n(), 1); 7797 var import_element40 = __toESM(require_element(), 1); 7798 var import_jsx_runtime60 = __toESM(require_jsx_runtime(), 1); 7799 function DensityPicker() { 7800 const context = (0, import_element40.useContext)(dataviews_context_default); 7801 const view = context.view; 7802 return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)( 7803 import_components17.__experimentalToggleGroupControl, 7804 { 7805 size: "__unstable-large", 7806 label: (0, import_i18n19.__)("Density"), 7807 value: view.layout?.density || "balanced", 7808 onChange: (value) => { 7809 context.onChangeView({ 7810 ...view, 7811 layout: { 7812 ...view.layout, 7813 density: value 7814 } 7815 }); 7816 }, 7817 isBlock: true, 7818 children: [ 7819 /* @__PURE__ */ (0, import_jsx_runtime60.jsx)( 7820 import_components17.__experimentalToggleGroupControlOption, 7821 { 7822 value: "comfortable", 7823 label: (0, import_i18n19._x)( 7824 "Comfortable", 7825 "Density option for DataView layout" 7826 ) 7827 }, 7828 "comfortable" 7829 ), 7830 /* @__PURE__ */ (0, import_jsx_runtime60.jsx)( 7831 import_components17.__experimentalToggleGroupControlOption, 7832 { 7833 value: "balanced", 7834 label: (0, import_i18n19._x)("Balanced", "Density option for DataView layout") 7835 }, 7836 "balanced" 7837 ), 7838 /* @__PURE__ */ (0, import_jsx_runtime60.jsx)( 7839 import_components17.__experimentalToggleGroupControlOption, 7840 { 7841 value: "compact", 7842 label: (0, import_i18n19._x)("Compact", "Density option for DataView layout") 7843 }, 7844 "compact" 7845 ) 7846 ] 7847 } 7848 ); 7849 } 7850 7851 // packages/dataviews/build-module/components/dataviews-layouts/utils/preview-size-picker.mjs 7852 var import_components18 = __toESM(require_components(), 1); 7853 var import_i18n20 = __toESM(require_i18n(), 1); 7854 var import_element41 = __toESM(require_element(), 1); 7855 var import_jsx_runtime61 = __toESM(require_jsx_runtime(), 1); 7856 var imageSizes2 = [ 7857 { 7858 value: 120, 7859 breakpoint: 1 7860 }, 7861 { 7862 value: 170, 7863 breakpoint: 1 7864 }, 7865 { 7866 value: 230, 7867 breakpoint: 1 7868 }, 7869 { 7870 value: 290, 7871 breakpoint: 1112 7872 // at minimum image width, 4 images display at this container size 7873 }, 7874 { 7875 value: 350, 7876 breakpoint: 1636 7877 // at minimum image width, 6 images display at this container size 7878 }, 7879 { 7880 value: 430, 7881 breakpoint: 588 7882 // at minimum image width, 2 images display at this container size 7883 } 7884 ]; 7885 function PreviewSizePicker() { 7886 const context = (0, import_element41.useContext)(dataviews_context_default); 7887 const view = context.view; 7888 const breakValues = imageSizes2.filter((size) => { 7889 return context.containerWidth >= size.breakpoint; 7890 }); 7891 const layoutPreviewSize = view.layout?.previewSize ?? 230; 7892 const previewSizeToUse = breakValues.map((size, index) => ({ ...size, index })).filter((size) => size.value <= layoutPreviewSize).sort((a2, b2) => b2.value - a2.value)[0]?.index ?? 0; 7893 const marks = breakValues.map((size, index) => { 7894 return { 7895 value: index 7896 }; 7897 }); 7898 return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( 7899 import_components18.RangeControl, 7900 { 7901 __next40pxDefaultSize: true, 7902 showTooltip: false, 7903 label: (0, import_i18n20.__)("Preview size"), 7904 value: previewSizeToUse, 7905 min: 0, 7906 max: breakValues.length - 1, 7907 withInputField: false, 7908 onChange: (value = 0) => { 7909 context.onChangeView({ 7910 ...view, 7911 layout: { 7912 ...view.layout, 7913 previewSize: breakValues[value].value 7914 } 7915 }); 7916 }, 7917 step: 1, 7918 marks 7919 } 7920 ); 7921 } 7922 7923 // packages/dataviews/build-module/components/dataviews-layouts/utils/grid-config-options.mjs 7924 var import_jsx_runtime62 = __toESM(require_jsx_runtime(), 1); 7925 function GridConfigOptions() { 7926 return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [ 7927 /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(DensityPicker, {}), 7928 /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PreviewSizePicker, {}) 7929 ] }); 7930 } 7931 7932 // packages/dataviews/build-module/components/dataviews-layouts/index.mjs 7933 var VIEW_LAYOUTS = [ 7934 { 7935 type: LAYOUT_TABLE, 7936 label: (0, import_i18n21.__)("Table"), 7937 component: table_default, 7938 icon: block_table_default, 7939 viewConfigOptions: DensityPicker 7940 }, 7941 { 7942 type: LAYOUT_GRID, 7943 label: (0, import_i18n21.__)("Grid"), 7944 component: grid_default, 7945 icon: category_default, 7946 viewConfigOptions: GridConfigOptions 7947 }, 7948 { 7949 type: LAYOUT_LIST, 7950 label: (0, import_i18n21.__)("List"), 7951 component: ViewList, 7952 icon: (0, import_i18n21.isRTL)() ? format_list_bullets_rtl_default : format_list_bullets_default, 7953 viewConfigOptions: DensityPicker 7954 }, 7955 { 7956 type: LAYOUT_ACTIVITY, 7957 label: (0, import_i18n21.__)("Activity"), 7958 component: ViewActivity, 7959 icon: scheduled_default, 7960 viewConfigOptions: DensityPicker 7961 }, 7962 { 7963 type: LAYOUT_PICKER_GRID, 7964 label: (0, import_i18n21.__)("Grid"), 7965 component: picker_grid_default, 7966 icon: category_default, 7967 viewConfigOptions: GridConfigOptions, 7968 isPicker: true 7969 }, 7970 { 7971 type: LAYOUT_PICKER_TABLE, 7972 label: (0, import_i18n21.__)("Table"), 7973 component: picker_table_default, 7974 icon: block_table_default, 7975 viewConfigOptions: DensityPicker, 7976 isPicker: true 7977 } 7978 ]; 7979 7980 // packages/dataviews/build-module/components/dataviews-filters/filters.mjs 7981 var import_element49 = __toESM(require_element(), 1); 7982 7983 // packages/dataviews/build-module/components/dataviews-filters/filter.mjs 7984 var import_components21 = __toESM(require_components(), 1); 7985 var import_i18n24 = __toESM(require_i18n(), 1); 7986 var import_element46 = __toESM(require_element(), 1); 7987 7988 // node_modules/@ariakit/core/esm/__chunks/XMCVU3LR.js 7989 function noop2(..._) { 7990 } 7991 function applyState(argument, currentValue) { 7992 if (isUpdater(argument)) { 7993 const value = isLazyValue(currentValue) ? currentValue() : currentValue; 7994 return argument(value); 7995 } 7996 return argument; 7997 } 7998 function isUpdater(argument) { 7999 return typeof argument === "function"; 8000 } 8001 function isLazyValue(value) { 8002 return typeof value === "function"; 8003 } 8004 function hasOwnProperty(object, prop) { 8005 if (typeof Object.hasOwn === "function") { 8006 return Object.hasOwn(object, prop); 8007 } 8008 return Object.prototype.hasOwnProperty.call(object, prop); 8009 } 8010 function chain(...fns) { 8011 return (...args) => { 8012 for (const fn of fns) { 8013 if (typeof fn === "function") { 8014 fn(...args); 8015 } 8016 } 8017 }; 8018 } 8019 function normalizeString(str) { 8020 return str.normalize("NFD").replace(/[\u0300-\u036f]/g, ""); 8021 } 8022 function omit(object, keys) { 8023 const result = { ...object }; 8024 for (const key of keys) { 8025 if (hasOwnProperty(result, key)) { 8026 delete result[key]; 8027 } 8028 } 8029 return result; 8030 } 8031 function pick(object, paths) { 8032 const result = {}; 8033 for (const key of paths) { 8034 if (hasOwnProperty(object, key)) { 8035 result[key] = object[key]; 8036 } 8037 } 8038 return result; 8039 } 8040 function identity(value) { 8041 return value; 8042 } 8043 function invariant(condition, message2) { 8044 if (condition) return; 8045 if (typeof message2 !== "string") throw new Error("Invariant failed"); 8046 throw new Error(message2); 8047 } 8048 function getKeys(obj) { 8049 return Object.keys(obj); 8050 } 8051 function isFalsyBooleanCallback(booleanOrCallback, ...args) { 8052 const result = typeof booleanOrCallback === "function" ? booleanOrCallback(...args) : booleanOrCallback; 8053 if (result == null) return false; 8054 return !result; 8055 } 8056 function disabledFromProps(props) { 8057 return props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true"; 8058 } 8059 function removeUndefinedValues(obj) { 8060 const result = {}; 8061 for (const key in obj) { 8062 if (obj[key] !== void 0) { 8063 result[key] = obj[key]; 8064 } 8065 } 8066 return result; 8067 } 8068 function defaultValue(...values) { 8069 for (const value of values) { 8070 if (value !== void 0) return value; 8071 } 8072 return void 0; 8073 } 8074 8075 // node_modules/@ariakit/react-core/esm/__chunks/YXGXYGQX.js 8076 var import_react10 = __toESM(require_react(), 1); 8077 function setRef(ref, value) { 8078 if (typeof ref === "function") { 8079 ref(value); 8080 } else if (ref) { 8081 ref.current = value; 8082 } 8083 } 8084 function isValidElementWithRef(element) { 8085 if (!element) return false; 8086 if (!(0, import_react10.isValidElement)(element)) return false; 8087 if ("ref" in element.props) return true; 8088 if ("ref" in element) return true; 8089 return false; 8090 } 8091 function getRefProperty(element) { 8092 if (!isValidElementWithRef(element)) return null; 8093 const props = { ...element.props }; 8094 return props.ref || element.ref; 8095 } 8096 function mergeProps2(base, overrides) { 8097 const props = { ...base }; 8098 for (const key in overrides) { 8099 if (!hasOwnProperty(overrides, key)) continue; 8100 if (key === "className") { 8101 const prop = "className"; 8102 props[prop] = base[prop] ? `$base[prop]} $overrides[prop]}` : overrides[prop]; 8103 continue; 8104 } 8105 if (key === "style") { 8106 const prop = "style"; 8107 props[prop] = base[prop] ? { ...base[prop], ...overrides[prop] } : overrides[prop]; 8108 continue; 8109 } 8110 const overrideValue = overrides[key]; 8111 if (typeof overrideValue === "function" && key.startsWith("on")) { 8112 const baseValue = base[key]; 8113 if (typeof baseValue === "function") { 8114 props[key] = (...args) => { 8115 overrideValue(...args); 8116 baseValue(...args); 8117 }; 8118 continue; 8119 } 8120 } 8121 props[key] = overrideValue; 8122 } 8123 return props; 8124 } 8125 8126 // node_modules/@ariakit/core/esm/__chunks/3DNM6L6E.js 8127 var canUseDOM = checkIsBrowser(); 8128 function checkIsBrowser() { 8129 var _a; 8130 return typeof window !== "undefined" && !!((_a = window.document) == null ? void 0 : _a.createElement); 8131 } 8132 function getDocument(node) { 8133 if (!node) return document; 8134 if ("self" in node) return node.document; 8135 return node.ownerDocument || document; 8136 } 8137 function getActiveElement(node, activeDescendant = false) { 8138 var _a; 8139 const { activeElement } = getDocument(node); 8140 if (!(activeElement == null ? void 0 : activeElement.nodeName)) { 8141 return null; 8142 } 8143 if (isFrame(activeElement) && ((_a = activeElement.contentDocument) == null ? void 0 : _a.body)) { 8144 return getActiveElement( 8145 activeElement.contentDocument.body, 8146 activeDescendant 8147 ); 8148 } 8149 if (activeDescendant) { 8150 const id = activeElement.getAttribute("aria-activedescendant"); 8151 if (id) { 8152 const element = getDocument(activeElement).getElementById(id); 8153 if (element) { 8154 return element; 8155 } 8156 } 8157 } 8158 return activeElement; 8159 } 8160 function contains(parent, child) { 8161 return parent === child || parent.contains(child); 8162 } 8163 function isFrame(element) { 8164 return element.tagName === "IFRAME"; 8165 } 8166 function isButton(element) { 8167 const tagName = element.tagName.toLowerCase(); 8168 if (tagName === "button") return true; 8169 if (tagName === "input" && element.type) { 8170 return buttonInputTypes.indexOf(element.type) !== -1; 8171 } 8172 return false; 8173 } 8174 var buttonInputTypes = [ 8175 "button", 8176 "color", 8177 "file", 8178 "image", 8179 "reset", 8180 "submit" 8181 ]; 8182 function isVisible(element) { 8183 if (typeof element.checkVisibility === "function") { 8184 return element.checkVisibility(); 8185 } 8186 const htmlElement = element; 8187 return htmlElement.offsetWidth > 0 || htmlElement.offsetHeight > 0 || element.getClientRects().length > 0; 8188 } 8189 function isTextField(element) { 8190 try { 8191 const isTextInput = element instanceof HTMLInputElement && element.selectionStart !== null; 8192 const isTextArea = element.tagName === "TEXTAREA"; 8193 return isTextInput || isTextArea || false; 8194 } catch (_error) { 8195 return false; 8196 } 8197 } 8198 function isTextbox(element) { 8199 return element.isContentEditable || isTextField(element); 8200 } 8201 function getTextboxValue(element) { 8202 if (isTextField(element)) { 8203 return element.value; 8204 } 8205 if (element.isContentEditable) { 8206 const range = getDocument(element).createRange(); 8207 range.selectNodeContents(element); 8208 return range.toString(); 8209 } 8210 return ""; 8211 } 8212 function getTextboxSelection(element) { 8213 let start = 0; 8214 let end = 0; 8215 if (isTextField(element)) { 8216 start = element.selectionStart || 0; 8217 end = element.selectionEnd || 0; 8218 } else if (element.isContentEditable) { 8219 const selection = getDocument(element).getSelection(); 8220 if ((selection == null ? void 0 : selection.rangeCount) && selection.anchorNode && contains(element, selection.anchorNode) && selection.focusNode && contains(element, selection.focusNode)) { 8221 const range = selection.getRangeAt(0); 8222 const nextRange = range.cloneRange(); 8223 nextRange.selectNodeContents(element); 8224 nextRange.setEnd(range.startContainer, range.startOffset); 8225 start = nextRange.toString().length; 8226 nextRange.setEnd(range.endContainer, range.endOffset); 8227 end = nextRange.toString().length; 8228 } 8229 } 8230 return { start, end }; 8231 } 8232 function getPopupRole(element, fallback) { 8233 const allowedPopupRoles = ["dialog", "menu", "listbox", "tree", "grid"]; 8234 const role = element == null ? void 0 : element.getAttribute("role"); 8235 if (role && allowedPopupRoles.indexOf(role) !== -1) { 8236 return role; 8237 } 8238 return fallback; 8239 } 8240 function getScrollingElement(element) { 8241 if (!element) return null; 8242 const isScrollableOverflow = (overflow) => { 8243 if (overflow === "auto") return true; 8244 if (overflow === "scroll") return true; 8245 return false; 8246 }; 8247 if (element.clientHeight && element.scrollHeight > element.clientHeight) { 8248 const { overflowY } = getComputedStyle(element); 8249 if (isScrollableOverflow(overflowY)) return element; 8250 } else if (element.clientWidth && element.scrollWidth > element.clientWidth) { 8251 const { overflowX } = getComputedStyle(element); 8252 if (isScrollableOverflow(overflowX)) return element; 8253 } 8254 return getScrollingElement(element.parentElement) || document.scrollingElement || document.body; 8255 } 8256 function setSelectionRange(element, ...args) { 8257 if (/text|search|password|tel|url/i.test(element.type)) { 8258 element.setSelectionRange(...args); 8259 } 8260 } 8261 function sortBasedOnDOMPosition(items, getElement) { 8262 const pairs = items.map((item, index) => [index, item]); 8263 let isOrderDifferent = false; 8264 pairs.sort(([indexA, a2], [indexB, b2]) => { 8265 const elementA = getElement(a2); 8266 const elementB = getElement(b2); 8267 if (elementA === elementB) return 0; 8268 if (!elementA || !elementB) return 0; 8269 if (isElementPreceding(elementA, elementB)) { 8270 if (indexA > indexB) { 8271 isOrderDifferent = true; 8272 } 8273 return -1; 8274 } 8275 if (indexA < indexB) { 8276 isOrderDifferent = true; 8277 } 8278 return 1; 8279 }); 8280 if (isOrderDifferent) { 8281 return pairs.map(([_, item]) => item); 8282 } 8283 return items; 8284 } 8285 function isElementPreceding(a2, b2) { 8286 return Boolean( 8287 b2.compareDocumentPosition(a2) & Node.DOCUMENT_POSITION_PRECEDING 8288 ); 8289 } 8290 8291 // node_modules/@ariakit/core/esm/__chunks/SNHYQNEZ.js 8292 function isTouchDevice() { 8293 return canUseDOM && !!navigator.maxTouchPoints; 8294 } 8295 function isApple() { 8296 if (!canUseDOM) return false; 8297 return /mac|iphone|ipad|ipod/i.test(navigator.platform); 8298 } 8299 function isSafari() { 8300 return canUseDOM && isApple() && /apple/i.test(navigator.vendor); 8301 } 8302 function isFirefox() { 8303 return canUseDOM && /firefox\//i.test(navigator.userAgent); 8304 } 8305 8306 // node_modules/@ariakit/core/esm/utils/events.js 8307 function isPortalEvent(event) { 8308 return Boolean( 8309 event.currentTarget && !contains(event.currentTarget, event.target) 8310 ); 8311 } 8312 function isSelfTarget(event) { 8313 return event.target === event.currentTarget; 8314 } 8315 function isOpeningInNewTab(event) { 8316 const element = event.currentTarget; 8317 if (!element) return false; 8318 const isAppleDevice = isApple(); 8319 if (isAppleDevice && !event.metaKey) return false; 8320 if (!isAppleDevice && !event.ctrlKey) return false; 8321 const tagName = element.tagName.toLowerCase(); 8322 if (tagName === "a") return true; 8323 if (tagName === "button" && element.type === "submit") return true; 8324 if (tagName === "input" && element.type === "submit") return true; 8325 return false; 8326 } 8327 function isDownloading(event) { 8328 const element = event.currentTarget; 8329 if (!element) return false; 8330 const tagName = element.tagName.toLowerCase(); 8331 if (!event.altKey) return false; 8332 if (tagName === "a") return true; 8333 if (tagName === "button" && element.type === "submit") return true; 8334 if (tagName === "input" && element.type === "submit") return true; 8335 return false; 8336 } 8337 function fireBlurEvent(element, eventInit) { 8338 const event = new FocusEvent("blur", eventInit); 8339 const defaultAllowed = element.dispatchEvent(event); 8340 const bubbleInit = { ...eventInit, bubbles: true }; 8341 element.dispatchEvent(new FocusEvent("focusout", bubbleInit)); 8342 return defaultAllowed; 8343 } 8344 function fireKeyboardEvent(element, type, eventInit) { 8345 const event = new KeyboardEvent(type, eventInit); 8346 return element.dispatchEvent(event); 8347 } 8348 function fireClickEvent(element, eventInit) { 8349 const event = new MouseEvent("click", eventInit); 8350 return element.dispatchEvent(event); 8351 } 8352 function isFocusEventOutside(event, container) { 8353 const containerElement = container || event.currentTarget; 8354 const relatedTarget = event.relatedTarget; 8355 return !relatedTarget || !contains(containerElement, relatedTarget); 8356 } 8357 function queueBeforeEvent(element, type, callback, timeout) { 8358 const createTimer = (callback2) => { 8359 if (timeout) { 8360 const timerId2 = setTimeout(callback2, timeout); 8361 return () => clearTimeout(timerId2); 8362 } 8363 const timerId = requestAnimationFrame(callback2); 8364 return () => cancelAnimationFrame(timerId); 8365 }; 8366 const cancelTimer = createTimer(() => { 8367 element.removeEventListener(type, callSync, true); 8368 callback(); 8369 }); 8370 const callSync = () => { 8371 cancelTimer(); 8372 callback(); 8373 }; 8374 element.addEventListener(type, callSync, { once: true, capture: true }); 8375 return cancelTimer; 8376 } 8377 function addGlobalEventListener(type, listener, options, scope = window) { 8378 const children = []; 8379 try { 8380 scope.document.addEventListener(type, listener, options); 8381 for (const frame of Array.from(scope.frames)) { 8382 children.push(addGlobalEventListener(type, listener, options, frame)); 8383 } 8384 } catch (e2) { 8385 } 8386 const removeEventListener = () => { 8387 try { 8388 scope.document.removeEventListener(type, listener, options); 8389 } catch (e2) { 8390 } 8391 for (const remove of children) { 8392 remove(); 8393 } 8394 }; 8395 return removeEventListener; 8396 } 8397 8398 // node_modules/@ariakit/react-core/esm/__chunks/KPHZR4MB.js 8399 var React23 = __toESM(require_react(), 1); 8400 var import_react11 = __toESM(require_react(), 1); 8401 var _React = { ...React23 }; 8402 var useReactId = _React.useId; 8403 var useReactDeferredValue = _React.useDeferredValue; 8404 var useReactInsertionEffect = _React.useInsertionEffect; 8405 var useSafeLayoutEffect = canUseDOM ? import_react11.useLayoutEffect : import_react11.useEffect; 8406 function useInitialValue(value) { 8407 const [initialValue] = (0, import_react11.useState)(value); 8408 return initialValue; 8409 } 8410 function useLiveRef(value) { 8411 const ref = (0, import_react11.useRef)(value); 8412 useSafeLayoutEffect(() => { 8413 ref.current = value; 8414 }); 8415 return ref; 8416 } 8417 function useEvent(callback) { 8418 const ref = (0, import_react11.useRef)(() => { 8419 throw new Error("Cannot call an event handler while rendering."); 8420 }); 8421 if (useReactInsertionEffect) { 8422 useReactInsertionEffect(() => { 8423 ref.current = callback; 8424 }); 8425 } else { 8426 ref.current = callback; 8427 } 8428 return (0, import_react11.useCallback)((...args) => { 8429 var _a; 8430 return (_a = ref.current) == null ? void 0 : _a.call(ref, ...args); 8431 }, []); 8432 } 8433 function useTransactionState(callback) { 8434 const [state, setState] = (0, import_react11.useState)(null); 8435 useSafeLayoutEffect(() => { 8436 if (state == null) return; 8437 if (!callback) return; 8438 let prevState = null; 8439 callback((prev) => { 8440 prevState = prev; 8441 return state; 8442 }); 8443 return () => { 8444 callback(prevState); 8445 }; 8446 }, [state, callback]); 8447 return [state, setState]; 8448 } 8449 function useMergeRefs(...refs) { 8450 return (0, import_react11.useMemo)(() => { 8451 if (!refs.some(Boolean)) return; 8452 return (value) => { 8453 for (const ref of refs) { 8454 setRef(ref, value); 8455 } 8456 }; 8457 }, refs); 8458 } 8459 function useId5(defaultId) { 8460 if (useReactId) { 8461 const reactId = useReactId(); 8462 if (defaultId) return defaultId; 8463 return reactId; 8464 } 8465 const [id, setId] = (0, import_react11.useState)(defaultId); 8466 useSafeLayoutEffect(() => { 8467 if (defaultId || id) return; 8468 const random = Math.random().toString(36).slice(2, 8); 8469 setId(`id-$random}`); 8470 }, [defaultId, id]); 8471 return defaultId || id; 8472 } 8473 function useTagName(refOrElement, type) { 8474 const stringOrUndefined = (type2) => { 8475 if (typeof type2 !== "string") return; 8476 return type2; 8477 }; 8478 const [tagName, setTagName] = (0, import_react11.useState)(() => stringOrUndefined(type)); 8479 useSafeLayoutEffect(() => { 8480 const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement; 8481 setTagName((element == null ? void 0 : element.tagName.toLowerCase()) || stringOrUndefined(type)); 8482 }, [refOrElement, type]); 8483 return tagName; 8484 } 8485 function useAttribute(refOrElement, attributeName, defaultValue2) { 8486 const initialValue = useInitialValue(defaultValue2); 8487 const [attribute, setAttribute] = (0, import_react11.useState)(initialValue); 8488 (0, import_react11.useEffect)(() => { 8489 const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement; 8490 if (!element) return; 8491 const callback = () => { 8492 const value = element.getAttribute(attributeName); 8493 setAttribute(value == null ? initialValue : value); 8494 }; 8495 const observer = new MutationObserver(callback); 8496 observer.observe(element, { attributeFilter: [attributeName] }); 8497 callback(); 8498 return () => observer.disconnect(); 8499 }, [refOrElement, attributeName, initialValue]); 8500 return attribute; 8501 } 8502 function useUpdateEffect(effect, deps) { 8503 const mounted = (0, import_react11.useRef)(false); 8504 (0, import_react11.useEffect)(() => { 8505 if (mounted.current) { 8506 return effect(); 8507 } 8508 mounted.current = true; 8509 }, deps); 8510 (0, import_react11.useEffect)( 8511 () => () => { 8512 mounted.current = false; 8513 }, 8514 [] 8515 ); 8516 } 8517 function useUpdateLayoutEffect(effect, deps) { 8518 const mounted = (0, import_react11.useRef)(false); 8519 useSafeLayoutEffect(() => { 8520 if (mounted.current) { 8521 return effect(); 8522 } 8523 mounted.current = true; 8524 }, deps); 8525 useSafeLayoutEffect( 8526 () => () => { 8527 mounted.current = false; 8528 }, 8529 [] 8530 ); 8531 } 8532 function useForceUpdate() { 8533 return (0, import_react11.useReducer)(() => [], []); 8534 } 8535 function useBooleanEvent(booleanOrCallback) { 8536 return useEvent( 8537 typeof booleanOrCallback === "function" ? booleanOrCallback : () => booleanOrCallback 8538 ); 8539 } 8540 function useWrapElement(props, callback, deps = []) { 8541 const wrapElement = (0, import_react11.useCallback)( 8542 (element) => { 8543 if (props.wrapElement) { 8544 element = props.wrapElement(element); 8545 } 8546 return callback(element); 8547 }, 8548 [...deps, props.wrapElement] 8549 ); 8550 return { ...props, wrapElement }; 8551 } 8552 function useMetadataProps(props, key, value) { 8553 const parent = props.onLoadedMetadataCapture; 8554 const onLoadedMetadataCapture = (0, import_react11.useMemo)(() => { 8555 return Object.assign(() => { 8556 }, { ...parent, [key]: value }); 8557 }, [parent, key, value]); 8558 return [parent == null ? void 0 : parent[key], { onLoadedMetadataCapture }]; 8559 } 8560 var hasInstalledGlobalEventListeners = false; 8561 function useIsMouseMoving() { 8562 (0, import_react11.useEffect)(() => { 8563 if (hasInstalledGlobalEventListeners) return; 8564 addGlobalEventListener("mousemove", setMouseMoving, true); 8565 addGlobalEventListener("mousedown", resetMouseMoving, true); 8566 addGlobalEventListener("mouseup", resetMouseMoving, true); 8567 addGlobalEventListener("keydown", resetMouseMoving, true); 8568 addGlobalEventListener("scroll", resetMouseMoving, true); 8569 hasInstalledGlobalEventListeners = true; 8570 }, []); 8571 const isMouseMoving = useEvent(() => mouseMoving); 8572 return isMouseMoving; 8573 } 8574 var mouseMoving = false; 8575 var previousScreenX = 0; 8576 var previousScreenY = 0; 8577 function hasMouseMovement(event) { 8578 const movementX = event.movementX || event.screenX - previousScreenX; 8579 const movementY = event.movementY || event.screenY - previousScreenY; 8580 previousScreenX = event.screenX; 8581 previousScreenY = event.screenY; 8582 return movementX || movementY || false; 8583 } 8584 function setMouseMoving(event) { 8585 if (!hasMouseMovement(event)) return; 8586 mouseMoving = true; 8587 } 8588 function resetMouseMoving() { 8589 mouseMoving = false; 8590 } 8591 8592 // node_modules/@ariakit/react-core/esm/__chunks/GWSL6KNJ.js 8593 var React24 = __toESM(require_react(), 1); 8594 var import_jsx_runtime63 = __toESM(require_jsx_runtime(), 1); 8595 function forwardRef26(render4) { 8596 const Role = React24.forwardRef( 8597 // @ts-ignore Incompatible with React 19 types. Ignore for now. 8598 (props, ref) => render4({ ...props, ref }) 8599 ); 8600 Role.displayName = render4.displayName || render4.name; 8601 return Role; 8602 } 8603 function memo22(Component, propsAreEqual) { 8604 return React24.memo(Component, propsAreEqual); 8605 } 8606 function createElement3(Type, props) { 8607 const { wrapElement, render: render4, ...rest } = props; 8608 const mergedRef = useMergeRefs(props.ref, getRefProperty(render4)); 8609 let element; 8610 if (React24.isValidElement(render4)) { 8611 const renderProps = { 8612 // @ts-ignore Incompatible with React 19 types. Ignore for now. 8613 ...render4.props, 8614 ref: mergedRef 8615 }; 8616 element = React24.cloneElement(render4, mergeProps2(rest, renderProps)); 8617 } else if (render4) { 8618 element = render4(rest); 8619 } else { 8620 element = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Type, { ...rest }); 8621 } 8622 if (wrapElement) { 8623 return wrapElement(element); 8624 } 8625 return element; 8626 } 8627 function createHook(useProps) { 8628 const useRole = (props = {}) => { 8629 return useProps(props); 8630 }; 8631 useRole.displayName = useProps.name; 8632 return useRole; 8633 } 8634 function createStoreContext(providers = [], scopedProviders = []) { 8635 const context = React24.createContext(void 0); 8636 const scopedContext = React24.createContext(void 0); 8637 const useContext210 = () => React24.useContext(context); 8638 const useScopedContext = (onlyScoped = false) => { 8639 const scoped = React24.useContext(scopedContext); 8640 const store = useContext210(); 8641 if (onlyScoped) return scoped; 8642 return scoped || store; 8643 }; 8644 const useProviderContext = () => { 8645 const scoped = React24.useContext(scopedContext); 8646 const store = useContext210(); 8647 if (scoped && scoped === store) return; 8648 return store; 8649 }; 8650 const ContextProvider = (props) => { 8651 return providers.reduceRight( 8652 (children, Provider) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Provider, { ...props, children }), 8653 /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(context.Provider, { ...props }) 8654 ); 8655 }; 8656 const ScopedContextProvider = (props) => { 8657 return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ContextProvider, { ...props, children: scopedProviders.reduceRight( 8658 (children, Provider) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Provider, { ...props, children }), 8659 /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(scopedContext.Provider, { ...props }) 8660 ) }); 8661 }; 8662 return { 8663 context, 8664 scopedContext, 8665 useContext: useContext210, 8666 useScopedContext, 8667 useProviderContext, 8668 ContextProvider, 8669 ScopedContextProvider 8670 }; 8671 } 8672 8673 // node_modules/@ariakit/react-core/esm/__chunks/SMPCIMZM.js 8674 var ctx = createStoreContext(); 8675 var useCollectionContext = ctx.useContext; 8676 var useCollectionScopedContext = ctx.useScopedContext; 8677 var useCollectionProviderContext = ctx.useProviderContext; 8678 var CollectionContextProvider = ctx.ContextProvider; 8679 var CollectionScopedContextProvider = ctx.ScopedContextProvider; 8680 8681 // node_modules/@ariakit/react-core/esm/__chunks/AVVXDJMZ.js 8682 var import_react12 = __toESM(require_react(), 1); 8683 var ctx2 = createStoreContext( 8684 [CollectionContextProvider], 8685 [CollectionScopedContextProvider] 8686 ); 8687 var useCompositeContext = ctx2.useContext; 8688 var useCompositeScopedContext = ctx2.useScopedContext; 8689 var useCompositeProviderContext = ctx2.useProviderContext; 8690 var CompositeContextProvider = ctx2.ContextProvider; 8691 var CompositeScopedContextProvider = ctx2.ScopedContextProvider; 8692 var CompositeItemContext = (0, import_react12.createContext)( 8693 void 0 8694 ); 8695 var CompositeRowContext = (0, import_react12.createContext)( 8696 void 0 8697 ); 8698 8699 // node_modules/@ariakit/react-core/esm/__chunks/5VQZOHHZ.js 8700 function findFirstEnabledItem(items, excludeId) { 8701 return items.find((item) => { 8702 if (excludeId) { 8703 return !item.disabled && item.id !== excludeId; 8704 } 8705 return !item.disabled; 8706 }); 8707 } 8708 function getEnabledItem(store, id) { 8709 if (!id) return null; 8710 return store.item(id) || null; 8711 } 8712 function groupItemsByRows(items) { 8713 const rows = []; 8714 for (const item of items) { 8715 const row = rows.find((currentRow) => { 8716 var _a; 8717 return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; 8718 }); 8719 if (row) { 8720 row.push(item); 8721 } else { 8722 rows.push([item]); 8723 } 8724 } 8725 return rows; 8726 } 8727 function selectTextField(element, collapseToEnd = false) { 8728 if (isTextField(element)) { 8729 element.setSelectionRange( 8730 collapseToEnd ? element.value.length : 0, 8731 element.value.length 8732 ); 8733 } else if (element.isContentEditable) { 8734 const selection = getDocument(element).getSelection(); 8735 selection == null ? void 0 : selection.selectAllChildren(element); 8736 if (collapseToEnd) { 8737 selection == null ? void 0 : selection.collapseToEnd(); 8738 } 8739 } 8740 } 8741 var FOCUS_SILENTLY = /* @__PURE__ */ Symbol("FOCUS_SILENTLY"); 8742 function focusSilently(element) { 8743 element[FOCUS_SILENTLY] = true; 8744 element.focus({ preventScroll: true }); 8745 } 8746 function silentlyFocused(element) { 8747 const isSilentlyFocused = element[FOCUS_SILENTLY]; 8748 delete element[FOCUS_SILENTLY]; 8749 return isSilentlyFocused; 8750 } 8751 function isItem(store, element, exclude) { 8752 if (!element) return false; 8753 if (element === exclude) return false; 8754 const item = store.item(element.id); 8755 if (!item) return false; 8756 if (exclude && item.element === exclude) return false; 8757 return true; 8758 } 8759 8760 // node_modules/@ariakit/react-core/esm/__chunks/Z2O3VLAQ.js 8761 var import_react13 = __toESM(require_react(), 1); 8762 var TagName = "div"; 8763 var useCollectionItem = createHook( 8764 function useCollectionItem2({ 8765 store, 8766 shouldRegisterItem = true, 8767 getItem = identity, 8768 // @ts-expect-error This prop may come from a collection renderer. 8769 element, 8770 ...props 8771 }) { 8772 const context = useCollectionContext(); 8773 store = store || context; 8774 const id = useId5(props.id); 8775 const ref = (0, import_react13.useRef)(element); 8776 (0, import_react13.useEffect)(() => { 8777 const element2 = ref.current; 8778 if (!id) return; 8779 if (!element2) return; 8780 if (!shouldRegisterItem) return; 8781 const item = getItem({ id, element: element2 }); 8782 return store == null ? void 0 : store.renderItem(item); 8783 }, [id, shouldRegisterItem, getItem, store]); 8784 props = { 8785 ...props, 8786 ref: useMergeRefs(ref, props.ref) 8787 }; 8788 return removeUndefinedValues(props); 8789 } 8790 ); 8791 var CollectionItem = forwardRef26(function CollectionItem2(props) { 8792 const htmlProps = useCollectionItem(props); 8793 return createElement3(TagName, htmlProps); 8794 }); 8795 8796 // node_modules/@ariakit/react-core/esm/__chunks/SWN3JYXT.js 8797 var import_react14 = __toESM(require_react(), 1); 8798 var FocusableContext = (0, import_react14.createContext)(true); 8799 8800 // node_modules/@ariakit/core/esm/utils/focus.js 8801 var selector = "input:not([type='hidden']):not([disabled]), select:not([disabled]), textarea:not([disabled]), a[href], button:not([disabled]), [tabindex], summary, iframe, object, embed, area[href], audio[controls], video[controls], [contenteditable]:not([contenteditable='false'])"; 8802 function isFocusable(element) { 8803 if (!element.matches(selector)) return false; 8804 if (!isVisible(element)) return false; 8805 if (element.closest("[inert]")) return false; 8806 return true; 8807 } 8808 function getClosestFocusable(element) { 8809 while (element && !isFocusable(element)) { 8810 element = element.closest(selector); 8811 } 8812 return element || null; 8813 } 8814 function hasFocus(element) { 8815 const activeElement = getActiveElement(element); 8816 if (!activeElement) return false; 8817 if (activeElement === element) return true; 8818 const activeDescendant = activeElement.getAttribute("aria-activedescendant"); 8819 if (!activeDescendant) return false; 8820 return activeDescendant === element.id; 8821 } 8822 function hasFocusWithin(element) { 8823 const activeElement = getActiveElement(element); 8824 if (!activeElement) return false; 8825 if (contains(element, activeElement)) return true; 8826 const activeDescendant = activeElement.getAttribute("aria-activedescendant"); 8827 if (!activeDescendant) return false; 8828 if (!("id" in element)) return false; 8829 if (activeDescendant === element.id) return true; 8830 return !!element.querySelector(`#$CSS.escape(activeDescendant)}`); 8831 } 8832 function focusIfNeeded(element) { 8833 if (!hasFocusWithin(element) && isFocusable(element)) { 8834 element.focus(); 8835 } 8836 } 8837 function focusIntoView(element, options) { 8838 if (!("scrollIntoView" in element)) { 8839 element.focus(); 8840 } else { 8841 element.focus({ preventScroll: true }); 8842 element.scrollIntoView({ block: "nearest", inline: "nearest", ...options }); 8843 } 8844 } 8845 8846 // node_modules/@ariakit/react-core/esm/__chunks/U6HHPQDW.js 8847 var import_react15 = __toESM(require_react(), 1); 8848 var TagName2 = "div"; 8849 var isSafariBrowser = isSafari(); 8850 var alwaysFocusVisibleInputTypes = [ 8851 "text", 8852 "search", 8853 "url", 8854 "tel", 8855 "email", 8856 "password", 8857 "number", 8858 "date", 8859 "month", 8860 "week", 8861 "time", 8862 "datetime", 8863 "datetime-local" 8864 ]; 8865 var safariFocusAncestorSymbol = /* @__PURE__ */ Symbol("safariFocusAncestor"); 8866 function markSafariFocusAncestor(element, value) { 8867 if (!element) return; 8868 element[safariFocusAncestorSymbol] = value; 8869 } 8870 function isAlwaysFocusVisible(element) { 8871 const { tagName, readOnly, type } = element; 8872 if (tagName === "TEXTAREA" && !readOnly) return true; 8873 if (tagName === "SELECT" && !readOnly) return true; 8874 if (tagName === "INPUT" && !readOnly) { 8875 return alwaysFocusVisibleInputTypes.includes(type); 8876 } 8877 if (element.isContentEditable) return true; 8878 const role = element.getAttribute("role"); 8879 if (role === "combobox" && element.dataset.name) { 8880 return true; 8881 } 8882 return false; 8883 } 8884 function getLabels(element) { 8885 if ("labels" in element) { 8886 return element.labels; 8887 } 8888 return null; 8889 } 8890 function isNativeCheckboxOrRadio(element) { 8891 const tagName = element.tagName.toLowerCase(); 8892 if (tagName === "input" && element.type) { 8893 return element.type === "radio" || element.type === "checkbox"; 8894 } 8895 return false; 8896 } 8897 function isNativeTabbable(tagName) { 8898 if (!tagName) return true; 8899 return tagName === "button" || tagName === "summary" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a"; 8900 } 8901 function supportsDisabledAttribute(tagName) { 8902 if (!tagName) return true; 8903 return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea"; 8904 } 8905 function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled, tabIndexProp) { 8906 if (!focusable) { 8907 return tabIndexProp; 8908 } 8909 if (trulyDisabled) { 8910 if (nativeTabbable && !supportsDisabled) { 8911 return -1; 8912 } 8913 return; 8914 } 8915 if (nativeTabbable) { 8916 return tabIndexProp; 8917 } 8918 return tabIndexProp || 0; 8919 } 8920 function useDisableEvent(onEvent, disabled2) { 8921 return useEvent((event) => { 8922 onEvent == null ? void 0 : onEvent(event); 8923 if (event.defaultPrevented) return; 8924 if (disabled2) { 8925 event.stopPropagation(); 8926 event.preventDefault(); 8927 } 8928 }); 8929 } 8930 var hasInstalledGlobalEventListeners2 = false; 8931 var isKeyboardModality = true; 8932 function onGlobalMouseDown(event) { 8933 const target = event.target; 8934 if (target && "hasAttribute" in target) { 8935 if (!target.hasAttribute("data-focus-visible")) { 8936 isKeyboardModality = false; 8937 } 8938 } 8939 } 8940 function onGlobalKeyDown(event) { 8941 if (event.metaKey) return; 8942 if (event.ctrlKey) return; 8943 if (event.altKey) return; 8944 isKeyboardModality = true; 8945 } 8946 var useFocusable = createHook( 8947 function useFocusable2({ 8948 focusable = true, 8949 accessibleWhenDisabled, 8950 autoFocus, 8951 onFocusVisible, 8952 ...props 8953 }) { 8954 const ref = (0, import_react15.useRef)(null); 8955 (0, import_react15.useEffect)(() => { 8956 if (!focusable) return; 8957 if (hasInstalledGlobalEventListeners2) return; 8958 addGlobalEventListener("mousedown", onGlobalMouseDown, true); 8959 addGlobalEventListener("keydown", onGlobalKeyDown, true); 8960 hasInstalledGlobalEventListeners2 = true; 8961 }, [focusable]); 8962 if (isSafariBrowser) { 8963 (0, import_react15.useEffect)(() => { 8964 if (!focusable) return; 8965 const element = ref.current; 8966 if (!element) return; 8967 if (!isNativeCheckboxOrRadio(element)) return; 8968 const labels = getLabels(element); 8969 if (!labels) return; 8970 const onMouseUp = () => queueMicrotask(() => element.focus()); 8971 for (const label of labels) { 8972 label.addEventListener("mouseup", onMouseUp); 8973 } 8974 return () => { 8975 for (const label of labels) { 8976 label.removeEventListener("mouseup", onMouseUp); 8977 } 8978 }; 8979 }, [focusable]); 8980 } 8981 const disabled2 = focusable && disabledFromProps(props); 8982 const trulyDisabled = !!disabled2 && !accessibleWhenDisabled; 8983 const [focusVisible, setFocusVisible] = (0, import_react15.useState)(false); 8984 (0, import_react15.useEffect)(() => { 8985 if (!focusable) return; 8986 if (trulyDisabled && focusVisible) { 8987 setFocusVisible(false); 8988 } 8989 }, [focusable, trulyDisabled, focusVisible]); 8990 (0, import_react15.useEffect)(() => { 8991 if (!focusable) return; 8992 if (!focusVisible) return; 8993 const element = ref.current; 8994 if (!element) return; 8995 if (typeof IntersectionObserver === "undefined") return; 8996 const observer = new IntersectionObserver(() => { 8997 if (!isFocusable(element)) { 8998 setFocusVisible(false); 8999 } 9000 }); 9001 observer.observe(element); 9002 return () => observer.disconnect(); 9003 }, [focusable, focusVisible]); 9004 const onKeyPressCapture = useDisableEvent( 9005 props.onKeyPressCapture, 9006 disabled2 9007 ); 9008 const onMouseDownCapture = useDisableEvent( 9009 props.onMouseDownCapture, 9010 disabled2 9011 ); 9012 const onClickCapture = useDisableEvent(props.onClickCapture, disabled2); 9013 const onMouseDownProp = props.onMouseDown; 9014 const onMouseDown = useEvent((event) => { 9015 onMouseDownProp == null ? void 0 : onMouseDownProp(event); 9016 if (event.defaultPrevented) return; 9017 if (!focusable) return; 9018 const element = event.currentTarget; 9019 if (!isSafariBrowser) return; 9020 if (isPortalEvent(event)) return; 9021 if (!isButton(element) && !isNativeCheckboxOrRadio(element)) return; 9022 let receivedFocus = false; 9023 const onFocus = () => { 9024 receivedFocus = true; 9025 }; 9026 const options = { capture: true, once: true }; 9027 element.addEventListener("focusin", onFocus, options); 9028 const focusableContainer = getClosestFocusable(element.parentElement); 9029 markSafariFocusAncestor(focusableContainer, true); 9030 queueBeforeEvent(element, "mouseup", () => { 9031 element.removeEventListener("focusin", onFocus, true); 9032 markSafariFocusAncestor(focusableContainer, false); 9033 if (receivedFocus) return; 9034 focusIfNeeded(element); 9035 }); 9036 }); 9037 const handleFocusVisible = (event, currentTarget) => { 9038 if (currentTarget) { 9039 event.currentTarget = currentTarget; 9040 } 9041 if (!focusable) return; 9042 const element = event.currentTarget; 9043 if (!element) return; 9044 if (!hasFocus(element)) return; 9045 onFocusVisible == null ? void 0 : onFocusVisible(event); 9046 if (event.defaultPrevented) return; 9047 element.dataset.focusVisible = "true"; 9048 setFocusVisible(true); 9049 }; 9050 const onKeyDownCaptureProp = props.onKeyDownCapture; 9051 const onKeyDownCapture = useEvent((event) => { 9052 onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event); 9053 if (event.defaultPrevented) return; 9054 if (!focusable) return; 9055 if (focusVisible) return; 9056 if (event.metaKey) return; 9057 if (event.altKey) return; 9058 if (event.ctrlKey) return; 9059 if (!isSelfTarget(event)) return; 9060 const element = event.currentTarget; 9061 const applyFocusVisible = () => handleFocusVisible(event, element); 9062 queueBeforeEvent(element, "focusout", applyFocusVisible); 9063 }); 9064 const onFocusCaptureProp = props.onFocusCapture; 9065 const onFocusCapture = useEvent((event) => { 9066 onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event); 9067 if (event.defaultPrevented) return; 9068 if (!focusable) return; 9069 if (!isSelfTarget(event)) { 9070 setFocusVisible(false); 9071 return; 9072 } 9073 const element = event.currentTarget; 9074 const applyFocusVisible = () => handleFocusVisible(event, element); 9075 if (isKeyboardModality || isAlwaysFocusVisible(event.target)) { 9076 queueBeforeEvent(event.target, "focusout", applyFocusVisible); 9077 } else { 9078 setFocusVisible(false); 9079 } 9080 }); 9081 const onBlurProp = props.onBlur; 9082 const onBlur = useEvent((event) => { 9083 onBlurProp == null ? void 0 : onBlurProp(event); 9084 if (!focusable) return; 9085 if (!isFocusEventOutside(event)) return; 9086 event.currentTarget.removeAttribute("data-focus-visible"); 9087 setFocusVisible(false); 9088 }); 9089 const autoFocusOnShow = (0, import_react15.useContext)(FocusableContext); 9090 const autoFocusRef = useEvent((element) => { 9091 if (!focusable) return; 9092 if (!autoFocus) return; 9093 if (!element) return; 9094 if (!autoFocusOnShow) return; 9095 queueMicrotask(() => { 9096 if (hasFocus(element)) return; 9097 if (!isFocusable(element)) return; 9098 element.focus(); 9099 }); 9100 }); 9101 const tagName = useTagName(ref); 9102 const nativeTabbable = focusable && isNativeTabbable(tagName); 9103 const supportsDisabled = focusable && supportsDisabledAttribute(tagName); 9104 const styleProp = props.style; 9105 const style = (0, import_react15.useMemo)(() => { 9106 if (trulyDisabled) { 9107 return { pointerEvents: "none", ...styleProp }; 9108 } 9109 return styleProp; 9110 }, [trulyDisabled, styleProp]); 9111 props = { 9112 "data-focus-visible": focusable && focusVisible || void 0, 9113 "data-autofocus": autoFocus || void 0, 9114 "aria-disabled": disabled2 || void 0, 9115 ...props, 9116 ref: useMergeRefs(ref, autoFocusRef, props.ref), 9117 style, 9118 tabIndex: getTabIndex( 9119 focusable, 9120 trulyDisabled, 9121 nativeTabbable, 9122 supportsDisabled, 9123 props.tabIndex 9124 ), 9125 disabled: supportsDisabled && trulyDisabled ? true : void 0, 9126 // TODO: Test Focusable contentEditable. 9127 contentEditable: disabled2 ? void 0 : props.contentEditable, 9128 onKeyPressCapture, 9129 onClickCapture, 9130 onMouseDownCapture, 9131 onMouseDown, 9132 onKeyDownCapture, 9133 onFocusCapture, 9134 onBlur 9135 }; 9136 return removeUndefinedValues(props); 9137 } 9138 ); 9139 var Focusable = forwardRef26(function Focusable2(props) { 9140 const htmlProps = useFocusable(props); 9141 return createElement3(TagName2, htmlProps); 9142 }); 9143 9144 // node_modules/@ariakit/react-core/esm/__chunks/PZ3OL7I2.js 9145 var import_react16 = __toESM(require_react(), 1); 9146 var TagName3 = "button"; 9147 function isNativeClick(event) { 9148 if (!event.isTrusted) return false; 9149 const element = event.currentTarget; 9150 if (event.key === "Enter") { 9151 return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "A"; 9152 } 9153 if (event.key === " ") { 9154 return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "INPUT" || element.tagName === "SELECT"; 9155 } 9156 return false; 9157 } 9158 var symbol = /* @__PURE__ */ Symbol("command"); 9159 var useCommand = createHook( 9160 function useCommand2({ clickOnEnter = true, clickOnSpace = true, ...props }) { 9161 const ref = (0, import_react16.useRef)(null); 9162 const [isNativeButton, setIsNativeButton] = (0, import_react16.useState)(false); 9163 (0, import_react16.useEffect)(() => { 9164 if (!ref.current) return; 9165 setIsNativeButton(isButton(ref.current)); 9166 }, []); 9167 const [active, setActive] = (0, import_react16.useState)(false); 9168 const activeRef = (0, import_react16.useRef)(false); 9169 const disabled2 = disabledFromProps(props); 9170 const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true); 9171 const onKeyDownProp = props.onKeyDown; 9172 const onKeyDown = useEvent((event) => { 9173 onKeyDownProp == null ? void 0 : onKeyDownProp(event); 9174 const element = event.currentTarget; 9175 if (event.defaultPrevented) return; 9176 if (isDuplicate) return; 9177 if (disabled2) return; 9178 if (!isSelfTarget(event)) return; 9179 if (isTextField(element)) return; 9180 if (element.isContentEditable) return; 9181 const isEnter = clickOnEnter && event.key === "Enter"; 9182 const isSpace = clickOnSpace && event.key === " "; 9183 const shouldPreventEnter = event.key === "Enter" && !clickOnEnter; 9184 const shouldPreventSpace = event.key === " " && !clickOnSpace; 9185 if (shouldPreventEnter || shouldPreventSpace) { 9186 event.preventDefault(); 9187 return; 9188 } 9189 if (isEnter || isSpace) { 9190 const nativeClick = isNativeClick(event); 9191 if (isEnter) { 9192 if (!nativeClick) { 9193 event.preventDefault(); 9194 const { view, ...eventInit } = event; 9195 const click = () => fireClickEvent(element, eventInit); 9196 if (isFirefox()) { 9197 queueBeforeEvent(element, "keyup", click); 9198 } else { 9199 queueMicrotask(click); 9200 } 9201 } 9202 } else if (isSpace) { 9203 activeRef.current = true; 9204 if (!nativeClick) { 9205 event.preventDefault(); 9206 setActive(true); 9207 } 9208 } 9209 } 9210 }); 9211 const onKeyUpProp = props.onKeyUp; 9212 const onKeyUp = useEvent((event) => { 9213 onKeyUpProp == null ? void 0 : onKeyUpProp(event); 9214 if (event.defaultPrevented) return; 9215 if (isDuplicate) return; 9216 if (disabled2) return; 9217 if (event.metaKey) return; 9218 const isSpace = clickOnSpace && event.key === " "; 9219 if (activeRef.current && isSpace) { 9220 activeRef.current = false; 9221 if (!isNativeClick(event)) { 9222 event.preventDefault(); 9223 setActive(false); 9224 const element = event.currentTarget; 9225 const { view, ...eventInit } = event; 9226 queueMicrotask(() => fireClickEvent(element, eventInit)); 9227 } 9228 } 9229 }); 9230 props = { 9231 "data-active": active || void 0, 9232 type: isNativeButton ? "button" : void 0, 9233 ...metadataProps, 9234 ...props, 9235 ref: useMergeRefs(ref, props.ref), 9236 onKeyDown, 9237 onKeyUp 9238 }; 9239 props = useFocusable(props); 9240 return props; 9241 } 9242 ); 9243 var Command = forwardRef26(function Command2(props) { 9244 const htmlProps = useCommand(props); 9245 return createElement3(TagName3, htmlProps); 9246 }); 9247 9248 // node_modules/@ariakit/core/esm/__chunks/SXKM4CGU.js 9249 function getInternal(store, key) { 9250 const internals = store.__unstableInternals; 9251 invariant(internals, "Invalid store"); 9252 return internals[key]; 9253 } 9254 function createStore(initialState, ...stores) { 9255 let state = initialState; 9256 let prevStateBatch = state; 9257 let lastUpdate = /* @__PURE__ */ Symbol(); 9258 let destroy = noop2; 9259 const instances = /* @__PURE__ */ new Set(); 9260 const updatedKeys = /* @__PURE__ */ new Set(); 9261 const setups = /* @__PURE__ */ new Set(); 9262 const listeners = /* @__PURE__ */ new Set(); 9263 const batchListeners = /* @__PURE__ */ new Set(); 9264 const disposables = /* @__PURE__ */ new WeakMap(); 9265 const listenerKeys = /* @__PURE__ */ new WeakMap(); 9266 const storeSetup = (callback) => { 9267 setups.add(callback); 9268 return () => setups.delete(callback); 9269 }; 9270 const storeInit = () => { 9271 const initialized = instances.size; 9272 const instance = /* @__PURE__ */ Symbol(); 9273 instances.add(instance); 9274 const maybeDestroy = () => { 9275 instances.delete(instance); 9276 if (instances.size) return; 9277 destroy(); 9278 }; 9279 if (initialized) return maybeDestroy; 9280 const desyncs = getKeys(state).map( 9281 (key) => chain( 9282 ...stores.map((store) => { 9283 var _a; 9284 const storeState = (_a = store == null ? void 0 : store.getState) == null ? void 0 : _a.call(store); 9285 if (!storeState) return; 9286 if (!hasOwnProperty(storeState, key)) return; 9287 return sync(store, [key], (state2) => { 9288 setState( 9289 key, 9290 state2[key], 9291 // @ts-expect-error - Not public API. This is just to prevent 9292 // infinite loops. 9293 true 9294 ); 9295 }); 9296 }) 9297 ) 9298 ); 9299 const teardowns = []; 9300 for (const setup2 of setups) { 9301 teardowns.push(setup2()); 9302 } 9303 const cleanups = stores.map(init); 9304 destroy = chain(...desyncs, ...teardowns, ...cleanups); 9305 return maybeDestroy; 9306 }; 9307 const sub = (keys, listener, set3 = listeners) => { 9308 set3.add(listener); 9309 listenerKeys.set(listener, keys); 9310 return () => { 9311 var _a; 9312 (_a = disposables.get(listener)) == null ? void 0 : _a(); 9313 disposables.delete(listener); 9314 listenerKeys.delete(listener); 9315 set3.delete(listener); 9316 }; 9317 }; 9318 const storeSubscribe = (keys, listener) => sub(keys, listener); 9319 const storeSync = (keys, listener) => { 9320 disposables.set(listener, listener(state, state)); 9321 return sub(keys, listener); 9322 }; 9323 const storeBatch = (keys, listener) => { 9324 disposables.set(listener, listener(state, prevStateBatch)); 9325 return sub(keys, listener, batchListeners); 9326 }; 9327 const storePick = (keys) => createStore(pick(state, keys), finalStore); 9328 const storeOmit = (keys) => createStore(omit(state, keys), finalStore); 9329 const getState = () => state; 9330 const setState = (key, value, fromStores = false) => { 9331 var _a; 9332 if (!hasOwnProperty(state, key)) return; 9333 const nextValue = applyState(value, state[key]); 9334 if (nextValue === state[key]) return; 9335 if (!fromStores) { 9336 for (const store of stores) { 9337 (_a = store == null ? void 0 : store.setState) == null ? void 0 : _a.call(store, key, nextValue); 9338 } 9339 } 9340 const prevState = state; 9341 state = { ...state, [key]: nextValue }; 9342 const thisUpdate = /* @__PURE__ */ Symbol(); 9343 lastUpdate = thisUpdate; 9344 updatedKeys.add(key); 9345 const run = (listener, prev, uKeys) => { 9346 var _a2; 9347 const keys = listenerKeys.get(listener); 9348 const updated = (k) => uKeys ? uKeys.has(k) : k === key; 9349 if (!keys || keys.some(updated)) { 9350 (_a2 = disposables.get(listener)) == null ? void 0 : _a2(); 9351 disposables.set(listener, listener(state, prev)); 9352 } 9353 }; 9354 for (const listener of listeners) { 9355 run(listener, prevState); 9356 } 9357 queueMicrotask(() => { 9358 if (lastUpdate !== thisUpdate) return; 9359 const snapshot = state; 9360 for (const listener of batchListeners) { 9361 run(listener, prevStateBatch, updatedKeys); 9362 } 9363 prevStateBatch = snapshot; 9364 updatedKeys.clear(); 9365 }); 9366 }; 9367 const finalStore = { 9368 getState, 9369 setState, 9370 __unstableInternals: { 9371 setup: storeSetup, 9372 init: storeInit, 9373 subscribe: storeSubscribe, 9374 sync: storeSync, 9375 batch: storeBatch, 9376 pick: storePick, 9377 omit: storeOmit 9378 } 9379 }; 9380 return finalStore; 9381 } 9382 function setup(store, ...args) { 9383 if (!store) return; 9384 return getInternal(store, "setup")(...args); 9385 } 9386 function init(store, ...args) { 9387 if (!store) return; 9388 return getInternal(store, "init")(...args); 9389 } 9390 function subscribe(store, ...args) { 9391 if (!store) return; 9392 return getInternal(store, "subscribe")(...args); 9393 } 9394 function sync(store, ...args) { 9395 if (!store) return; 9396 return getInternal(store, "sync")(...args); 9397 } 9398 function batch(store, ...args) { 9399 if (!store) return; 9400 return getInternal(store, "batch")(...args); 9401 } 9402 function omit2(store, ...args) { 9403 if (!store) return; 9404 return getInternal(store, "omit")(...args); 9405 } 9406 function pick2(store, ...args) { 9407 if (!store) return; 9408 return getInternal(store, "pick")(...args); 9409 } 9410 function mergeStore(...stores) { 9411 var _a; 9412 const initialState = {}; 9413 for (const store2 of stores) { 9414 const nextState = (_a = store2 == null ? void 0 : store2.getState) == null ? void 0 : _a.call(store2); 9415 if (nextState) { 9416 Object.assign(initialState, nextState); 9417 } 9418 } 9419 const store = createStore(initialState, ...stores); 9420 return Object.assign({}, ...stores, store); 9421 } 9422 function throwOnConflictingProps(props, store) { 9423 if (false) return; 9424 if (!store) return; 9425 const defaultKeys = Object.entries(props).filter(([key, value]) => key.startsWith("default") && value !== void 0).map(([key]) => { 9426 var _a; 9427 const stateKey = key.replace("default", ""); 9428 return `${((_a = stateKey[0]) == null ? void 0 : _a.toLowerCase()) || ""}$stateKey.slice(1)}`; 9429 }); 9430 if (!defaultKeys.length) return; 9431 const storeState = store.getState(); 9432 const conflictingProps = defaultKeys.filter( 9433 (key) => hasOwnProperty(storeState, key) 9434 ); 9435 if (!conflictingProps.length) return; 9436 throw new Error( 9437 `Passing a store prop in conjunction with a default state is not supported. 9438 9439 const store = useSelectStore(); 9440 <SelectProvider store={store} defaultValue="Apple" /> 9441 ^ ^ 9442 9443 Instead, pass the default state to the topmost store: 9444 9445 const store = useSelectStore({ defaultValue: "Apple" }); 9446 <SelectProvider store={store} /> 9447 9448 See https://github.com/ariakit/ariakit/pull/2745 for more details. 9449 9450 If there's a particular need for this, please submit a feature request at https://github.com/ariakit/ariakit 9451 ` 9452 ); 9453 } 9454 9455 // node_modules/@ariakit/react-core/esm/__chunks/Q5W46E73.js 9456 var React25 = __toESM(require_react(), 1); 9457 var import_shim = __toESM(require_shim(), 1); 9458 var { useSyncExternalStore } = import_shim.default; 9459 var noopSubscribe = () => () => { 9460 }; 9461 function useStoreState(store, keyOrSelector = identity) { 9462 const storeSubscribe = React25.useCallback( 9463 (callback) => { 9464 if (!store) return noopSubscribe(); 9465 return subscribe(store, null, callback); 9466 }, 9467 [store] 9468 ); 9469 const getSnapshot = () => { 9470 const key = typeof keyOrSelector === "string" ? keyOrSelector : null; 9471 const selector2 = typeof keyOrSelector === "function" ? keyOrSelector : null; 9472 const state = store == null ? void 0 : store.getState(); 9473 if (selector2) return selector2(state); 9474 if (!state) return; 9475 if (!key) return; 9476 if (!hasOwnProperty(state, key)) return; 9477 return state[key]; 9478 }; 9479 return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot); 9480 } 9481 function useStoreStateObject(store, object) { 9482 const objRef = React25.useRef( 9483 {} 9484 ); 9485 const storeSubscribe = React25.useCallback( 9486 (callback) => { 9487 if (!store) return noopSubscribe(); 9488 return subscribe(store, null, callback); 9489 }, 9490 [store] 9491 ); 9492 const getSnapshot = () => { 9493 const state = store == null ? void 0 : store.getState(); 9494 let updated = false; 9495 const obj = objRef.current; 9496 for (const prop in object) { 9497 const keyOrSelector = object[prop]; 9498 if (typeof keyOrSelector === "function") { 9499 const value = keyOrSelector(state); 9500 if (value !== obj[prop]) { 9501 obj[prop] = value; 9502 updated = true; 9503 } 9504 } 9505 if (typeof keyOrSelector === "string") { 9506 if (!state) continue; 9507 if (!hasOwnProperty(state, keyOrSelector)) continue; 9508 const value = state[keyOrSelector]; 9509 if (value !== obj[prop]) { 9510 obj[prop] = value; 9511 updated = true; 9512 } 9513 } 9514 } 9515 if (updated) { 9516 objRef.current = { ...obj }; 9517 } 9518 return objRef.current; 9519 }; 9520 return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot); 9521 } 9522 function useStoreProps(store, props, key, setKey) { 9523 const value = hasOwnProperty(props, key) ? props[key] : void 0; 9524 const setValue = setKey ? props[setKey] : void 0; 9525 const propsRef = useLiveRef({ value, setValue }); 9526 useSafeLayoutEffect(() => { 9527 return sync(store, [key], (state, prev) => { 9528 const { value: value2, setValue: setValue2 } = propsRef.current; 9529 if (!setValue2) return; 9530 if (state[key] === prev[key]) return; 9531 if (state[key] === value2) return; 9532 setValue2(state[key]); 9533 }); 9534 }, [store, key]); 9535 useSafeLayoutEffect(() => { 9536 if (value === void 0) return; 9537 store.setState(key, value); 9538 return batch(store, [key], () => { 9539 if (value === void 0) return; 9540 store.setState(key, value); 9541 }); 9542 }); 9543 } 9544 function useStore(createStore2, props) { 9545 const [store, setStore] = React25.useState(() => createStore2(props)); 9546 useSafeLayoutEffect(() => init(store), [store]); 9547 const useState210 = React25.useCallback( 9548 (keyOrSelector) => useStoreState(store, keyOrSelector), 9549 [store] 9550 ); 9551 const memoizedStore = React25.useMemo( 9552 () => ({ ...store, useState: useState210 }), 9553 [store, useState210] 9554 ); 9555 const updateStore = useEvent(() => { 9556 setStore((store2) => createStore2({ ...props, ...store2.getState() })); 9557 }); 9558 return [memoizedStore, updateStore]; 9559 } 9560 9561 // node_modules/@ariakit/react-core/esm/__chunks/WZWDIE3S.js 9562 var import_react17 = __toESM(require_react(), 1); 9563 var import_jsx_runtime64 = __toESM(require_jsx_runtime(), 1); 9564 var TagName4 = "button"; 9565 function isEditableElement(element) { 9566 if (isTextbox(element)) return true; 9567 return element.tagName === "INPUT" && !isButton(element); 9568 } 9569 function getNextPageOffset(scrollingElement, pageUp = false) { 9570 const height = scrollingElement.clientHeight; 9571 const { top } = scrollingElement.getBoundingClientRect(); 9572 const pageSize = Math.max(height * 0.875, height - 40) * 1.5; 9573 const pageOffset = pageUp ? height - pageSize + top : pageSize + top; 9574 if (scrollingElement.tagName === "HTML") { 9575 return pageOffset + scrollingElement.scrollTop; 9576 } 9577 return pageOffset; 9578 } 9579 function getItemOffset(itemElement, pageUp = false) { 9580 const { top } = itemElement.getBoundingClientRect(); 9581 if (pageUp) { 9582 return top + itemElement.clientHeight; 9583 } 9584 return top; 9585 } 9586 function findNextPageItemId(element, store, next, pageUp = false) { 9587 var _a; 9588 if (!store) return; 9589 if (!next) return; 9590 const { renderedItems } = store.getState(); 9591 const scrollingElement = getScrollingElement(element); 9592 if (!scrollingElement) return; 9593 const nextPageOffset = getNextPageOffset(scrollingElement, pageUp); 9594 let id; 9595 let prevDifference; 9596 for (let i2 = 0; i2 < renderedItems.length; i2 += 1) { 9597 const previousId = id; 9598 id = next(i2); 9599 if (!id) break; 9600 if (id === previousId) continue; 9601 const itemElement = (_a = getEnabledItem(store, id)) == null ? void 0 : _a.element; 9602 if (!itemElement) continue; 9603 const itemOffset = getItemOffset(itemElement, pageUp); 9604 const difference = itemOffset - nextPageOffset; 9605 const absDifference = Math.abs(difference); 9606 if (pageUp && difference <= 0 || !pageUp && difference >= 0) { 9607 if (prevDifference !== void 0 && prevDifference < absDifference) { 9608 id = previousId; 9609 } 9610 break; 9611 } 9612 prevDifference = absDifference; 9613 } 9614 return id; 9615 } 9616 function targetIsAnotherItem(event, store) { 9617 if (isSelfTarget(event)) return false; 9618 return isItem(store, event.target); 9619 } 9620 var useCompositeItem = createHook( 9621 function useCompositeItem2({ 9622 store, 9623 rowId: rowIdProp, 9624 preventScrollOnKeyDown = false, 9625 moveOnKeyPress = true, 9626 tabbable = false, 9627 getItem: getItemProp, 9628 "aria-setsize": ariaSetSizeProp, 9629 "aria-posinset": ariaPosInSetProp, 9630 ...props 9631 }) { 9632 const context = useCompositeContext(); 9633 store = store || context; 9634 const id = useId5(props.id); 9635 const ref = (0, import_react17.useRef)(null); 9636 const row = (0, import_react17.useContext)(CompositeRowContext); 9637 const disabled2 = disabledFromProps(props); 9638 const trulyDisabled = disabled2 && !props.accessibleWhenDisabled; 9639 const { 9640 rowId, 9641 baseElement, 9642 isActiveItem, 9643 ariaSetSize, 9644 ariaPosInSet, 9645 isTabbable 9646 } = useStoreStateObject(store, { 9647 rowId(state) { 9648 if (rowIdProp) return rowIdProp; 9649 if (!state) return; 9650 if (!(row == null ? void 0 : row.baseElement)) return; 9651 if (row.baseElement !== state.baseElement) return; 9652 return row.id; 9653 }, 9654 baseElement(state) { 9655 return (state == null ? void 0 : state.baseElement) || void 0; 9656 }, 9657 isActiveItem(state) { 9658 return !!state && state.activeId === id; 9659 }, 9660 ariaSetSize(state) { 9661 if (ariaSetSizeProp != null) return ariaSetSizeProp; 9662 if (!state) return; 9663 if (!(row == null ? void 0 : row.ariaSetSize)) return; 9664 if (row.baseElement !== state.baseElement) return; 9665 return row.ariaSetSize; 9666 }, 9667 ariaPosInSet(state) { 9668 if (ariaPosInSetProp != null) return ariaPosInSetProp; 9669 if (!state) return; 9670 if (!(row == null ? void 0 : row.ariaPosInSet)) return; 9671 if (row.baseElement !== state.baseElement) return; 9672 const itemsInRow = state.renderedItems.filter( 9673 (item) => item.rowId === rowId 9674 ); 9675 return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id); 9676 }, 9677 isTabbable(state) { 9678 if (!(state == null ? void 0 : state.renderedItems.length)) return true; 9679 if (state.virtualFocus) return false; 9680 if (tabbable) return true; 9681 if (state.activeId === null) return false; 9682 const item = store == null ? void 0 : store.item(state.activeId); 9683 if (item == null ? void 0 : item.disabled) return true; 9684 if (!(item == null ? void 0 : item.element)) return true; 9685 return state.activeId === id; 9686 } 9687 }); 9688 const getItem = (0, import_react17.useCallback)( 9689 (item) => { 9690 var _a; 9691 const nextItem = { 9692 ...item, 9693 id: id || item.id, 9694 rowId, 9695 disabled: !!trulyDisabled, 9696 children: (_a = item.element) == null ? void 0 : _a.textContent 9697 }; 9698 if (getItemProp) { 9699 return getItemProp(nextItem); 9700 } 9701 return nextItem; 9702 }, 9703 [id, rowId, trulyDisabled, getItemProp] 9704 ); 9705 const onFocusProp = props.onFocus; 9706 const hasFocusedComposite = (0, import_react17.useRef)(false); 9707 const onFocus = useEvent((event) => { 9708 onFocusProp == null ? void 0 : onFocusProp(event); 9709 if (event.defaultPrevented) return; 9710 if (isPortalEvent(event)) return; 9711 if (!id) return; 9712 if (!store) return; 9713 if (targetIsAnotherItem(event, store)) return; 9714 const { virtualFocus, baseElement: baseElement2 } = store.getState(); 9715 store.setActiveId(id); 9716 if (isTextbox(event.currentTarget)) { 9717 selectTextField(event.currentTarget); 9718 } 9719 if (!virtualFocus) return; 9720 if (!isSelfTarget(event)) return; 9721 if (isEditableElement(event.currentTarget)) return; 9722 if (!(baseElement2 == null ? void 0 : baseElement2.isConnected)) return; 9723 if (isSafari() && event.currentTarget.hasAttribute("data-autofocus")) { 9724 event.currentTarget.scrollIntoView({ 9725 block: "nearest", 9726 inline: "nearest" 9727 }); 9728 } 9729 hasFocusedComposite.current = true; 9730 const fromComposite = event.relatedTarget === baseElement2 || isItem(store, event.relatedTarget); 9731 if (fromComposite) { 9732 focusSilently(baseElement2); 9733 } else { 9734 baseElement2.focus(); 9735 } 9736 }); 9737 const onBlurCaptureProp = props.onBlurCapture; 9738 const onBlurCapture = useEvent((event) => { 9739 onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event); 9740 if (event.defaultPrevented) return; 9741 const state = store == null ? void 0 : store.getState(); 9742 if ((state == null ? void 0 : state.virtualFocus) && hasFocusedComposite.current) { 9743 hasFocusedComposite.current = false; 9744 event.preventDefault(); 9745 event.stopPropagation(); 9746 } 9747 }); 9748 const onKeyDownProp = props.onKeyDown; 9749 const preventScrollOnKeyDownProp = useBooleanEvent(preventScrollOnKeyDown); 9750 const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); 9751 const onKeyDown = useEvent((event) => { 9752 onKeyDownProp == null ? void 0 : onKeyDownProp(event); 9753 if (event.defaultPrevented) return; 9754 if (!isSelfTarget(event)) return; 9755 if (!store) return; 9756 const { currentTarget } = event; 9757 const state = store.getState(); 9758 const item = store.item(id); 9759 const isGrid2 = !!(item == null ? void 0 : item.rowId); 9760 const isVertical = state.orientation !== "horizontal"; 9761 const isHorizontal = state.orientation !== "vertical"; 9762 const canHomeEnd = () => { 9763 if (isGrid2) return true; 9764 if (isHorizontal) return true; 9765 if (!state.baseElement) return true; 9766 if (!isTextField(state.baseElement)) return true; 9767 return false; 9768 }; 9769 const keyMap = { 9770 ArrowUp: (isGrid2 || isVertical) && store.up, 9771 ArrowRight: (isGrid2 || isHorizontal) && store.next, 9772 ArrowDown: (isGrid2 || isVertical) && store.down, 9773 ArrowLeft: (isGrid2 || isHorizontal) && store.previous, 9774 Home: () => { 9775 if (!canHomeEnd()) return; 9776 if (!isGrid2 || event.ctrlKey) { 9777 return store == null ? void 0 : store.first(); 9778 } 9779 return store == null ? void 0 : store.previous(-1); 9780 }, 9781 End: () => { 9782 if (!canHomeEnd()) return; 9783 if (!isGrid2 || event.ctrlKey) { 9784 return store == null ? void 0 : store.last(); 9785 } 9786 return store == null ? void 0 : store.next(-1); 9787 }, 9788 PageUp: () => { 9789 return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.up, true); 9790 }, 9791 PageDown: () => { 9792 return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.down); 9793 } 9794 }; 9795 const action = keyMap[event.key]; 9796 if (action) { 9797 if (isTextbox(currentTarget)) { 9798 const selection = getTextboxSelection(currentTarget); 9799 const isLeft = isHorizontal && event.key === "ArrowLeft"; 9800 const isRight = isHorizontal && event.key === "ArrowRight"; 9801 const isUp = isVertical && event.key === "ArrowUp"; 9802 const isDown = isVertical && event.key === "ArrowDown"; 9803 if (isRight || isDown) { 9804 const { length: valueLength } = getTextboxValue(currentTarget); 9805 if (selection.end !== valueLength) return; 9806 } else if ((isLeft || isUp) && selection.start !== 0) return; 9807 } 9808 const nextId = action(); 9809 if (preventScrollOnKeyDownProp(event) || nextId !== void 0) { 9810 if (!moveOnKeyPressProp(event)) return; 9811 event.preventDefault(); 9812 store.move(nextId); 9813 } 9814 } 9815 }); 9816 const providerValue = (0, import_react17.useMemo)( 9817 () => ({ id, baseElement }), 9818 [id, baseElement] 9819 ); 9820 props = useWrapElement( 9821 props, 9822 (element) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(CompositeItemContext.Provider, { value: providerValue, children: element }), 9823 [providerValue] 9824 ); 9825 props = { 9826 id, 9827 "data-active-item": isActiveItem || void 0, 9828 ...props, 9829 ref: useMergeRefs(ref, props.ref), 9830 tabIndex: isTabbable ? props.tabIndex : -1, 9831 onFocus, 9832 onBlurCapture, 9833 onKeyDown 9834 }; 9835 props = useCommand(props); 9836 props = useCollectionItem({ 9837 store, 9838 ...props, 9839 getItem, 9840 shouldRegisterItem: id ? props.shouldRegisterItem : false 9841 }); 9842 return removeUndefinedValues({ 9843 ...props, 9844 "aria-setsize": ariaSetSize, 9845 "aria-posinset": ariaPosInSet 9846 }); 9847 } 9848 ); 9849 var CompositeItem = memo22( 9850 forwardRef26(function CompositeItem2(props) { 9851 const htmlProps = useCompositeItem(props); 9852 return createElement3(TagName4, htmlProps); 9853 }) 9854 ); 9855 9856 // node_modules/@ariakit/core/esm/__chunks/7PRQYBBV.js 9857 function toArray(arg) { 9858 if (Array.isArray(arg)) { 9859 return arg; 9860 } 9861 return typeof arg !== "undefined" ? [arg] : []; 9862 } 9863 function flatten2DArray(array) { 9864 const flattened = []; 9865 for (const row of array) { 9866 flattened.push(...row); 9867 } 9868 return flattened; 9869 } 9870 function reverseArray(array) { 9871 return array.slice().reverse(); 9872 } 9873 9874 // node_modules/@ariakit/react-core/esm/__chunks/ZMWF7ASR.js 9875 var import_react18 = __toESM(require_react(), 1); 9876 var import_jsx_runtime65 = __toESM(require_jsx_runtime(), 1); 9877 var TagName5 = "div"; 9878 function isGrid(items) { 9879 return items.some((item) => !!item.rowId); 9880 } 9881 function isPrintableKey(event) { 9882 const target = event.target; 9883 if (target && !isTextField(target)) return false; 9884 return event.key.length === 1 && !event.ctrlKey && !event.metaKey; 9885 } 9886 function isModifierKey(event) { 9887 return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta"; 9888 } 9889 function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) { 9890 return useEvent((event) => { 9891 var _a; 9892 onKeyboardEvent == null ? void 0 : onKeyboardEvent(event); 9893 if (event.defaultPrevented) return; 9894 if (event.isPropagationStopped()) return; 9895 if (!isSelfTarget(event)) return; 9896 if (isModifierKey(event)) return; 9897 if (isPrintableKey(event)) return; 9898 const state = store.getState(); 9899 const activeElement = (_a = getEnabledItem(store, state.activeId)) == null ? void 0 : _a.element; 9900 if (!activeElement) return; 9901 const { view, ...eventInit } = event; 9902 const previousElement = previousElementRef == null ? void 0 : previousElementRef.current; 9903 if (activeElement !== previousElement) { 9904 activeElement.focus(); 9905 } 9906 if (!fireKeyboardEvent(activeElement, event.type, eventInit)) { 9907 event.preventDefault(); 9908 } 9909 if (event.currentTarget.contains(activeElement)) { 9910 event.stopPropagation(); 9911 } 9912 }); 9913 } 9914 function findFirstEnabledItemInTheLastRow(items) { 9915 return findFirstEnabledItem( 9916 flatten2DArray(reverseArray(groupItemsByRows(items))) 9917 ); 9918 } 9919 function useScheduleFocus(store) { 9920 const [scheduled, setScheduled] = (0, import_react18.useState)(false); 9921 const schedule = (0, import_react18.useCallback)(() => setScheduled(true), []); 9922 const activeItem = store.useState( 9923 (state) => getEnabledItem(store, state.activeId) 9924 ); 9925 (0, import_react18.useEffect)(() => { 9926 const activeElement = activeItem == null ? void 0 : activeItem.element; 9927 if (!scheduled) return; 9928 if (!activeElement) return; 9929 setScheduled(false); 9930 activeElement.focus({ preventScroll: true }); 9931 }, [activeItem, scheduled]); 9932 return schedule; 9933 } 9934 var useComposite = createHook( 9935 function useComposite2({ 9936 store, 9937 composite = true, 9938 focusOnMove = composite, 9939 moveOnKeyPress = true, 9940 ...props 9941 }) { 9942 const context = useCompositeProviderContext(); 9943 store = store || context; 9944 invariant( 9945 store, 9946 "Composite must receive a `store` prop or be wrapped in a CompositeProvider component." 9947 ); 9948 const ref = (0, import_react18.useRef)(null); 9949 const previousElementRef = (0, import_react18.useRef)(null); 9950 const scheduleFocus = useScheduleFocus(store); 9951 const moves = store.useState("moves"); 9952 const [, setBaseElement] = useTransactionState( 9953 composite ? store.setBaseElement : null 9954 ); 9955 (0, import_react18.useEffect)(() => { 9956 var _a; 9957 if (!store) return; 9958 if (!moves) return; 9959 if (!composite) return; 9960 if (!focusOnMove) return; 9961 const { activeId: activeId2 } = store.getState(); 9962 const itemElement = (_a = getEnabledItem(store, activeId2)) == null ? void 0 : _a.element; 9963 if (!itemElement) return; 9964 focusIntoView(itemElement); 9965 }, [store, moves, composite, focusOnMove]); 9966 useSafeLayoutEffect(() => { 9967 if (!store) return; 9968 if (!moves) return; 9969 if (!composite) return; 9970 const { baseElement, activeId: activeId2 } = store.getState(); 9971 const isSelfAcive = activeId2 === null; 9972 if (!isSelfAcive) return; 9973 if (!baseElement) return; 9974 const previousElement = previousElementRef.current; 9975 previousElementRef.current = null; 9976 if (previousElement) { 9977 fireBlurEvent(previousElement, { relatedTarget: baseElement }); 9978 } 9979 if (!hasFocus(baseElement)) { 9980 baseElement.focus(); 9981 } 9982 }, [store, moves, composite]); 9983 const activeId = store.useState("activeId"); 9984 const virtualFocus = store.useState("virtualFocus"); 9985 useSafeLayoutEffect(() => { 9986 var _a; 9987 if (!store) return; 9988 if (!composite) return; 9989 if (!virtualFocus) return; 9990 const previousElement = previousElementRef.current; 9991 previousElementRef.current = null; 9992 if (!previousElement) return; 9993 const activeElement = (_a = getEnabledItem(store, activeId)) == null ? void 0 : _a.element; 9994 const relatedTarget = activeElement || getActiveElement(previousElement); 9995 if (relatedTarget === previousElement) return; 9996 fireBlurEvent(previousElement, { relatedTarget }); 9997 }, [store, activeId, virtualFocus, composite]); 9998 const onKeyDownCapture = useKeyboardEventProxy( 9999 store, 10000 props.onKeyDownCapture, 10001 previousElementRef 10002 ); 10003 const onKeyUpCapture = useKeyboardEventProxy( 10004 store, 10005 props.onKeyUpCapture, 10006 previousElementRef 10007 ); 10008 const onFocusCaptureProp = props.onFocusCapture; 10009 const onFocusCapture = useEvent((event) => { 10010 onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event); 10011 if (event.defaultPrevented) return; 10012 if (!store) return; 10013 const { virtualFocus: virtualFocus2 } = store.getState(); 10014 if (!virtualFocus2) return; 10015 const previousActiveElement = event.relatedTarget; 10016 const isSilentlyFocused = silentlyFocused(event.currentTarget); 10017 if (isSelfTarget(event) && isSilentlyFocused) { 10018 event.stopPropagation(); 10019 previousElementRef.current = previousActiveElement; 10020 } 10021 }); 10022 const onFocusProp = props.onFocus; 10023 const onFocus = useEvent((event) => { 10024 onFocusProp == null ? void 0 : onFocusProp(event); 10025 if (event.defaultPrevented) return; 10026 if (!composite) return; 10027 if (!store) return; 10028 const { relatedTarget } = event; 10029 const { virtualFocus: virtualFocus2 } = store.getState(); 10030 if (virtualFocus2) { 10031 if (isSelfTarget(event) && !isItem(store, relatedTarget)) { 10032 queueMicrotask(scheduleFocus); 10033 } 10034 } else if (isSelfTarget(event)) { 10035 store.setActiveId(null); 10036 } 10037 }); 10038 const onBlurCaptureProp = props.onBlurCapture; 10039 const onBlurCapture = useEvent((event) => { 10040 var _a; 10041 onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event); 10042 if (event.defaultPrevented) return; 10043 if (!store) return; 10044 const { virtualFocus: virtualFocus2, activeId: activeId2 } = store.getState(); 10045 if (!virtualFocus2) return; 10046 const activeElement = (_a = getEnabledItem(store, activeId2)) == null ? void 0 : _a.element; 10047 const nextActiveElement = event.relatedTarget; 10048 const nextActiveElementIsItem = isItem(store, nextActiveElement); 10049 const previousElement = previousElementRef.current; 10050 previousElementRef.current = null; 10051 if (isSelfTarget(event) && nextActiveElementIsItem) { 10052 if (nextActiveElement === activeElement) { 10053 if (previousElement && previousElement !== nextActiveElement) { 10054 fireBlurEvent(previousElement, event); 10055 } 10056 } else if (activeElement) { 10057 fireBlurEvent(activeElement, event); 10058 } else if (previousElement) { 10059 fireBlurEvent(previousElement, event); 10060 } 10061 event.stopPropagation(); 10062 } else { 10063 const targetIsItem = isItem(store, event.target); 10064 if (!targetIsItem && activeElement) { 10065 fireBlurEvent(activeElement, event); 10066 } 10067 } 10068 }); 10069 const onKeyDownProp = props.onKeyDown; 10070 const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); 10071 const onKeyDown = useEvent((event) => { 10072 var _a; 10073 onKeyDownProp == null ? void 0 : onKeyDownProp(event); 10074 if (event.nativeEvent.isComposing) return; 10075 if (event.defaultPrevented) return; 10076 if (!store) return; 10077 if (!isSelfTarget(event)) return; 10078 const { orientation, renderedItems, activeId: activeId2 } = store.getState(); 10079 const activeItem = getEnabledItem(store, activeId2); 10080 if ((_a = activeItem == null ? void 0 : activeItem.element) == null ? void 0 : _a.isConnected) return; 10081 const isVertical = orientation !== "horizontal"; 10082 const isHorizontal = orientation !== "vertical"; 10083 const grid = isGrid(renderedItems); 10084 const isHorizontalKey = event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End"; 10085 if (isHorizontalKey && isTextField(event.currentTarget)) return; 10086 const up = () => { 10087 if (grid) { 10088 const item = findFirstEnabledItemInTheLastRow(renderedItems); 10089 return item == null ? void 0 : item.id; 10090 } 10091 return store == null ? void 0 : store.last(); 10092 }; 10093 const keyMap = { 10094 ArrowUp: (grid || isVertical) && up, 10095 ArrowRight: (grid || isHorizontal) && store.first, 10096 ArrowDown: (grid || isVertical) && store.first, 10097 ArrowLeft: (grid || isHorizontal) && store.last, 10098 Home: store.first, 10099 End: store.last, 10100 PageUp: store.first, 10101 PageDown: store.last 10102 }; 10103 const action = keyMap[event.key]; 10104 if (action) { 10105 const id = action(); 10106 if (id !== void 0) { 10107 if (!moveOnKeyPressProp(event)) return; 10108 event.preventDefault(); 10109 store.move(id); 10110 } 10111 } 10112 }); 10113 props = useWrapElement( 10114 props, 10115 (element) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(CompositeContextProvider, { value: store, children: element }), 10116 [store] 10117 ); 10118 const activeDescendant = store.useState((state) => { 10119 var _a; 10120 if (!store) return; 10121 if (!composite) return; 10122 if (!state.virtualFocus) return; 10123 return (_a = getEnabledItem(store, state.activeId)) == null ? void 0 : _a.id; 10124 }); 10125 props = { 10126 "aria-activedescendant": activeDescendant, 10127 ...props, 10128 ref: useMergeRefs(ref, setBaseElement, props.ref), 10129 onKeyDownCapture, 10130 onKeyUpCapture, 10131 onFocusCapture, 10132 onFocus, 10133 onBlurCapture, 10134 onKeyDown 10135 }; 10136 const focusable = store.useState( 10137 (state) => composite && (state.virtualFocus || state.activeId === null) 10138 ); 10139 props = useFocusable({ focusable, ...props }); 10140 return props; 10141 } 10142 ); 10143 var Composite5 = forwardRef26(function Composite22(props) { 10144 const htmlProps = useComposite(props); 10145 return createElement3(TagName5, htmlProps); 10146 }); 10147 10148 // node_modules/@ariakit/react-core/esm/__chunks/LVDQFHCH.js 10149 var ctx3 = createStoreContext(); 10150 var useDisclosureContext = ctx3.useContext; 10151 var useDisclosureScopedContext = ctx3.useScopedContext; 10152 var useDisclosureProviderContext = ctx3.useProviderContext; 10153 var DisclosureContextProvider = ctx3.ContextProvider; 10154 var DisclosureScopedContextProvider = ctx3.ScopedContextProvider; 10155 10156 // node_modules/@ariakit/react-core/esm/__chunks/A62MDFCW.js 10157 var import_react19 = __toESM(require_react(), 1); 10158 var ctx4 = createStoreContext( 10159 [DisclosureContextProvider], 10160 [DisclosureScopedContextProvider] 10161 ); 10162 var useDialogContext = ctx4.useContext; 10163 var useDialogScopedContext = ctx4.useScopedContext; 10164 var useDialogProviderContext = ctx4.useProviderContext; 10165 var DialogContextProvider = ctx4.ContextProvider; 10166 var DialogScopedContextProvider = ctx4.ScopedContextProvider; 10167 var DialogHeadingContext = (0, import_react19.createContext)(void 0); 10168 var DialogDescriptionContext = (0, import_react19.createContext)(void 0); 10169 10170 // node_modules/@ariakit/react-core/esm/__chunks/6B3RXHKP.js 10171 var import_react20 = __toESM(require_react(), 1); 10172 var import_react_dom = __toESM(require_react_dom(), 1); 10173 var import_jsx_runtime66 = __toESM(require_jsx_runtime(), 1); 10174 var TagName6 = "div"; 10175 function afterTimeout(timeoutMs, cb) { 10176 const timeoutId = setTimeout(cb, timeoutMs); 10177 return () => clearTimeout(timeoutId); 10178 } 10179 function afterPaint2(cb) { 10180 let raf = requestAnimationFrame(() => { 10181 raf = requestAnimationFrame(cb); 10182 }); 10183 return () => cancelAnimationFrame(raf); 10184 } 10185 function parseCSSTime(...times) { 10186 return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => { 10187 const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3; 10188 const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier; 10189 if (currentTime > longestTime) return currentTime; 10190 return longestTime; 10191 }, 0); 10192 } 10193 function isHidden(mounted, hidden, alwaysVisible) { 10194 return !alwaysVisible && hidden !== false && (!mounted || !!hidden); 10195 } 10196 var useDisclosureContent = createHook(function useDisclosureContent2({ store, alwaysVisible, ...props }) { 10197 const context = useDisclosureProviderContext(); 10198 store = store || context; 10199 invariant( 10200 store, 10201 "DisclosureContent must receive a `store` prop or be wrapped in a DisclosureProvider component." 10202 ); 10203 const ref = (0, import_react20.useRef)(null); 10204 const id = useId5(props.id); 10205 const [transition, setTransition] = (0, import_react20.useState)(null); 10206 const open = store.useState("open"); 10207 const mounted = store.useState("mounted"); 10208 const animated = store.useState("animated"); 10209 const contentElement = store.useState("contentElement"); 10210 const otherElement = useStoreState(store.disclosure, "contentElement"); 10211 useSafeLayoutEffect(() => { 10212 if (!ref.current) return; 10213 store == null ? void 0 : store.setContentElement(ref.current); 10214 }, [store]); 10215 useSafeLayoutEffect(() => { 10216 let previousAnimated; 10217 store == null ? void 0 : store.setState("animated", (animated2) => { 10218 previousAnimated = animated2; 10219 return true; 10220 }); 10221 return () => { 10222 if (previousAnimated === void 0) return; 10223 store == null ? void 0 : store.setState("animated", previousAnimated); 10224 }; 10225 }, [store]); 10226 useSafeLayoutEffect(() => { 10227 if (!animated) return; 10228 if (!(contentElement == null ? void 0 : contentElement.isConnected)) { 10229 setTransition(null); 10230 return; 10231 } 10232 return afterPaint2(() => { 10233 setTransition(open ? "enter" : mounted ? "leave" : null); 10234 }); 10235 }, [animated, contentElement, open, mounted]); 10236 useSafeLayoutEffect(() => { 10237 if (!store) return; 10238 if (!animated) return; 10239 if (!transition) return; 10240 if (!contentElement) return; 10241 const stopAnimation = () => store == null ? void 0 : store.setState("animating", false); 10242 const stopAnimationSync = () => (0, import_react_dom.flushSync)(stopAnimation); 10243 if (transition === "leave" && open) return; 10244 if (transition === "enter" && !open) return; 10245 if (typeof animated === "number") { 10246 const timeout2 = animated; 10247 return afterTimeout(timeout2, stopAnimationSync); 10248 } 10249 const { 10250 transitionDuration, 10251 animationDuration, 10252 transitionDelay, 10253 animationDelay 10254 } = getComputedStyle(contentElement); 10255 const { 10256 transitionDuration: transitionDuration2 = "0", 10257 animationDuration: animationDuration2 = "0", 10258 transitionDelay: transitionDelay2 = "0", 10259 animationDelay: animationDelay2 = "0" 10260 } = otherElement ? getComputedStyle(otherElement) : {}; 10261 const delay = parseCSSTime( 10262 transitionDelay, 10263 animationDelay, 10264 transitionDelay2, 10265 animationDelay2 10266 ); 10267 const duration = parseCSSTime( 10268 transitionDuration, 10269 animationDuration, 10270 transitionDuration2, 10271 animationDuration2 10272 ); 10273 const timeout = delay + duration; 10274 if (!timeout) { 10275 if (transition === "enter") { 10276 store.setState("animated", false); 10277 } 10278 stopAnimation(); 10279 return; 10280 } 10281 const frameRate = 1e3 / 60; 10282 const maxTimeout = Math.max(timeout - frameRate, 0); 10283 return afterTimeout(maxTimeout, stopAnimationSync); 10284 }, [store, animated, contentElement, otherElement, open, transition]); 10285 props = useWrapElement( 10286 props, 10287 (element) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(DialogScopedContextProvider, { value: store, children: element }), 10288 [store] 10289 ); 10290 const hidden = isHidden(mounted, props.hidden, alwaysVisible); 10291 const styleProp = props.style; 10292 const style = (0, import_react20.useMemo)(() => { 10293 if (hidden) { 10294 return { ...styleProp, display: "none" }; 10295 } 10296 return styleProp; 10297 }, [hidden, styleProp]); 10298 props = { 10299 id, 10300 "data-open": open || void 0, 10301 "data-enter": transition === "enter" || void 0, 10302 "data-leave": transition === "leave" || void 0, 10303 hidden, 10304 ...props, 10305 ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref), 10306 style 10307 }; 10308 return removeUndefinedValues(props); 10309 }); 10310 var DisclosureContentImpl = forwardRef26(function DisclosureContentImpl2(props) { 10311 const htmlProps = useDisclosureContent(props); 10312 return createElement3(TagName6, htmlProps); 10313 }); 10314 var DisclosureContent = forwardRef26(function DisclosureContent2({ 10315 unmountOnHide, 10316 ...props 10317 }) { 10318 const context = useDisclosureProviderContext(); 10319 const store = props.store || context; 10320 const mounted = useStoreState( 10321 store, 10322 (state) => !unmountOnHide || (state == null ? void 0 : state.mounted) 10323 ); 10324 if (mounted === false) return null; 10325 return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(DisclosureContentImpl, { ...props }); 10326 }); 10327 10328 // node_modules/@ariakit/core/esm/__chunks/75BJEVSH.js 10329 function createDisclosureStore(props = {}) { 10330 const store = mergeStore( 10331 props.store, 10332 omit2(props.disclosure, ["contentElement", "disclosureElement"]) 10333 ); 10334 throwOnConflictingProps(props, store); 10335 const syncState = store == null ? void 0 : store.getState(); 10336 const open = defaultValue( 10337 props.open, 10338 syncState == null ? void 0 : syncState.open, 10339 props.defaultOpen, 10340 false 10341 ); 10342 const animated = defaultValue(props.animated, syncState == null ? void 0 : syncState.animated, false); 10343 const initialState = { 10344 open, 10345 animated, 10346 animating: !!animated && open, 10347 mounted: open, 10348 contentElement: defaultValue(syncState == null ? void 0 : syncState.contentElement, null), 10349 disclosureElement: defaultValue(syncState == null ? void 0 : syncState.disclosureElement, null) 10350 }; 10351 const disclosure = createStore(initialState, store); 10352 setup( 10353 disclosure, 10354 () => sync(disclosure, ["animated", "animating"], (state) => { 10355 if (state.animated) return; 10356 disclosure.setState("animating", false); 10357 }) 10358 ); 10359 setup( 10360 disclosure, 10361 () => subscribe(disclosure, ["open"], () => { 10362 if (!disclosure.getState().animated) return; 10363 disclosure.setState("animating", true); 10364 }) 10365 ); 10366 setup( 10367 disclosure, 10368 () => sync(disclosure, ["open", "animating"], (state) => { 10369 disclosure.setState("mounted", state.open || state.animating); 10370 }) 10371 ); 10372 return { 10373 ...disclosure, 10374 disclosure: props.disclosure, 10375 setOpen: (value) => disclosure.setState("open", value), 10376 show: () => disclosure.setState("open", true), 10377 hide: () => disclosure.setState("open", false), 10378 toggle: () => disclosure.setState("open", (open2) => !open2), 10379 stopAnimation: () => disclosure.setState("animating", false), 10380 setContentElement: (value) => disclosure.setState("contentElement", value), 10381 setDisclosureElement: (value) => disclosure.setState("disclosureElement", value) 10382 }; 10383 } 10384 10385 // node_modules/@ariakit/react-core/esm/__chunks/WLZ6H5FH.js 10386 function useDisclosureStoreProps(store, update2, props) { 10387 useUpdateEffect(update2, [props.store, props.disclosure]); 10388 useStoreProps(store, props, "open", "setOpen"); 10389 useStoreProps(store, props, "mounted", "setMounted"); 10390 useStoreProps(store, props, "animated"); 10391 return Object.assign(store, { disclosure: props.disclosure }); 10392 } 10393 10394 // node_modules/@ariakit/react-core/esm/__chunks/JMU4N4M5.js 10395 var ctx5 = createStoreContext( 10396 [DialogContextProvider], 10397 [DialogScopedContextProvider] 10398 ); 10399 var usePopoverContext = ctx5.useContext; 10400 var usePopoverScopedContext = ctx5.useScopedContext; 10401 var usePopoverProviderContext = ctx5.useProviderContext; 10402 var PopoverContextProvider = ctx5.ContextProvider; 10403 var PopoverScopedContextProvider = ctx5.ScopedContextProvider; 10404 10405 // node_modules/@ariakit/core/esm/__chunks/N5XGANPW.js 10406 function getCommonParent(items) { 10407 var _a; 10408 const firstItem = items.find((item) => !!item.element); 10409 const lastItem = [...items].reverse().find((item) => !!item.element); 10410 let parentElement = (_a = firstItem == null ? void 0 : firstItem.element) == null ? void 0 : _a.parentElement; 10411 while (parentElement && (lastItem == null ? void 0 : lastItem.element)) { 10412 const parent = parentElement; 10413 if (lastItem && parent.contains(lastItem.element)) { 10414 return parentElement; 10415 } 10416 parentElement = parentElement.parentElement; 10417 } 10418 return getDocument(parentElement).body; 10419 } 10420 function getPrivateStore(store) { 10421 return store == null ? void 0 : store.__unstablePrivateStore; 10422 } 10423 function createCollectionStore(props = {}) { 10424 var _a; 10425 throwOnConflictingProps(props, props.store); 10426 const syncState = (_a = props.store) == null ? void 0 : _a.getState(); 10427 const items = defaultValue( 10428 props.items, 10429 syncState == null ? void 0 : syncState.items, 10430 props.defaultItems, 10431 [] 10432 ); 10433 const itemsMap = new Map(items.map((item) => [item.id, item])); 10434 const initialState = { 10435 items, 10436 renderedItems: defaultValue(syncState == null ? void 0 : syncState.renderedItems, []) 10437 }; 10438 const syncPrivateStore = getPrivateStore(props.store); 10439 const privateStore = createStore( 10440 { items, renderedItems: initialState.renderedItems }, 10441 syncPrivateStore 10442 ); 10443 const collection = createStore(initialState, props.store); 10444 const sortItems = (renderedItems) => { 10445 const sortedItems = sortBasedOnDOMPosition(renderedItems, (i2) => i2.element); 10446 privateStore.setState("renderedItems", sortedItems); 10447 collection.setState("renderedItems", sortedItems); 10448 }; 10449 setup(collection, () => init(privateStore)); 10450 setup(privateStore, () => { 10451 return batch(privateStore, ["items"], (state) => { 10452 collection.setState("items", state.items); 10453 }); 10454 }); 10455 setup(privateStore, () => { 10456 return batch(privateStore, ["renderedItems"], (state) => { 10457 let firstRun = true; 10458 let raf = requestAnimationFrame(() => { 10459 const { renderedItems } = collection.getState(); 10460 if (state.renderedItems === renderedItems) return; 10461 sortItems(state.renderedItems); 10462 }); 10463 if (typeof IntersectionObserver !== "function") { 10464 return () => cancelAnimationFrame(raf); 10465 } 10466 const ioCallback = () => { 10467 if (firstRun) { 10468 firstRun = false; 10469 return; 10470 } 10471 cancelAnimationFrame(raf); 10472 raf = requestAnimationFrame(() => sortItems(state.renderedItems)); 10473 }; 10474 const root = getCommonParent(state.renderedItems); 10475 const observer = new IntersectionObserver(ioCallback, { root }); 10476 for (const item of state.renderedItems) { 10477 if (!item.element) continue; 10478 observer.observe(item.element); 10479 } 10480 return () => { 10481 cancelAnimationFrame(raf); 10482 observer.disconnect(); 10483 }; 10484 }); 10485 }); 10486 const mergeItem = (item, setItems, canDeleteFromMap = false) => { 10487 let prevItem; 10488 setItems((items2) => { 10489 const index = items2.findIndex(({ id }) => id === item.id); 10490 const nextItems = items2.slice(); 10491 if (index !== -1) { 10492 prevItem = items2[index]; 10493 const nextItem = { ...prevItem, ...item }; 10494 nextItems[index] = nextItem; 10495 itemsMap.set(item.id, nextItem); 10496 } else { 10497 nextItems.push(item); 10498 itemsMap.set(item.id, item); 10499 } 10500 return nextItems; 10501 }); 10502 const unmergeItem = () => { 10503 setItems((items2) => { 10504 if (!prevItem) { 10505 if (canDeleteFromMap) { 10506 itemsMap.delete(item.id); 10507 } 10508 return items2.filter(({ id }) => id !== item.id); 10509 } 10510 const index = items2.findIndex(({ id }) => id === item.id); 10511 if (index === -1) return items2; 10512 const nextItems = items2.slice(); 10513 nextItems[index] = prevItem; 10514 itemsMap.set(item.id, prevItem); 10515 return nextItems; 10516 }); 10517 }; 10518 return unmergeItem; 10519 }; 10520 const registerItem = (item) => mergeItem( 10521 item, 10522 (getItems) => privateStore.setState("items", getItems), 10523 true 10524 ); 10525 return { 10526 ...collection, 10527 registerItem, 10528 renderItem: (item) => chain( 10529 registerItem(item), 10530 mergeItem( 10531 item, 10532 (getItems) => privateStore.setState("renderedItems", getItems) 10533 ) 10534 ), 10535 item: (id) => { 10536 if (!id) return null; 10537 let item = itemsMap.get(id); 10538 if (!item) { 10539 const { items: items2 } = privateStore.getState(); 10540 item = items2.find((item2) => item2.id === id); 10541 if (item) { 10542 itemsMap.set(id, item); 10543 } 10544 } 10545 return item || null; 10546 }, 10547 // @ts-expect-error Internal 10548 __unstablePrivateStore: privateStore 10549 }; 10550 } 10551 10552 // node_modules/@ariakit/react-core/esm/__chunks/GVAFFF2B.js 10553 function useCollectionStoreProps(store, update2, props) { 10554 useUpdateEffect(update2, [props.store]); 10555 useStoreProps(store, props, "items", "setItems"); 10556 return store; 10557 } 10558 10559 // node_modules/@ariakit/core/esm/__chunks/RVTIKFRL.js 10560 var NULL_ITEM = { id: null }; 10561 function findFirstEnabledItem2(items, excludeId) { 10562 return items.find((item) => { 10563 if (excludeId) { 10564 return !item.disabled && item.id !== excludeId; 10565 } 10566 return !item.disabled; 10567 }); 10568 } 10569 function getEnabledItems(items, excludeId) { 10570 return items.filter((item) => { 10571 if (excludeId) { 10572 return !item.disabled && item.id !== excludeId; 10573 } 10574 return !item.disabled; 10575 }); 10576 } 10577 function getItemsInRow(items, rowId) { 10578 return items.filter((item) => item.rowId === rowId); 10579 } 10580 function flipItems(items, activeId, shouldInsertNullItem = false) { 10581 const index = items.findIndex((item) => item.id === activeId); 10582 return [ 10583 ...items.slice(index + 1), 10584 ...shouldInsertNullItem ? [NULL_ITEM] : [], 10585 ...items.slice(0, index) 10586 ]; 10587 } 10588 function groupItemsByRows2(items) { 10589 const rows = []; 10590 for (const item of items) { 10591 const row = rows.find((currentRow) => { 10592 var _a; 10593 return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; 10594 }); 10595 if (row) { 10596 row.push(item); 10597 } else { 10598 rows.push([item]); 10599 } 10600 } 10601 return rows; 10602 } 10603 function getMaxRowLength(array) { 10604 let maxLength = 0; 10605 for (const { length } of array) { 10606 if (length > maxLength) { 10607 maxLength = length; 10608 } 10609 } 10610 return maxLength; 10611 } 10612 function createEmptyItem(rowId) { 10613 return { 10614 id: "__EMPTY_ITEM__", 10615 disabled: true, 10616 rowId 10617 }; 10618 } 10619 function normalizeRows(rows, activeId, focusShift) { 10620 const maxLength = getMaxRowLength(rows); 10621 for (const row of rows) { 10622 for (let i2 = 0; i2 < maxLength; i2 += 1) { 10623 const item = row[i2]; 10624 if (!item || focusShift && item.disabled) { 10625 const isFirst = i2 === 0; 10626 const previousItem = isFirst && focusShift ? findFirstEnabledItem2(row) : row[i2 - 1]; 10627 row[i2] = previousItem && activeId !== previousItem.id && focusShift ? previousItem : createEmptyItem(previousItem == null ? void 0 : previousItem.rowId); 10628 } 10629 } 10630 } 10631 return rows; 10632 } 10633 function verticalizeItems(items) { 10634 const rows = groupItemsByRows2(items); 10635 const maxLength = getMaxRowLength(rows); 10636 const verticalized = []; 10637 for (let i2 = 0; i2 < maxLength; i2 += 1) { 10638 for (const row of rows) { 10639 const item = row[i2]; 10640 if (item) { 10641 verticalized.push({ 10642 ...item, 10643 // If there's no rowId, it means that it's not a grid composite, but 10644 // a single row instead. So, instead of verticalizing it, that is, 10645 // assigning a different rowId based on the column index, we keep it 10646 // undefined so they will be part of the same row. This is useful 10647 // when using up/down on one-dimensional composites. 10648 rowId: item.rowId ? `$i2}` : void 0 10649 }); 10650 } 10651 } 10652 } 10653 return verticalized; 10654 } 10655 function createCompositeStore(props = {}) { 10656 var _a; 10657 const syncState = (_a = props.store) == null ? void 0 : _a.getState(); 10658 const collection = createCollectionStore(props); 10659 const activeId = defaultValue( 10660 props.activeId, 10661 syncState == null ? void 0 : syncState.activeId, 10662 props.defaultActiveId 10663 ); 10664 const initialState = { 10665 ...collection.getState(), 10666 id: defaultValue( 10667 props.id, 10668 syncState == null ? void 0 : syncState.id, 10669 `id-$Math.random().toString(36).slice(2, 8)}` 10670 ), 10671 activeId, 10672 baseElement: defaultValue(syncState == null ? void 0 : syncState.baseElement, null), 10673 includesBaseElement: defaultValue( 10674 props.includesBaseElement, 10675 syncState == null ? void 0 : syncState.includesBaseElement, 10676 activeId === null 10677 ), 10678 moves: defaultValue(syncState == null ? void 0 : syncState.moves, 0), 10679 orientation: defaultValue( 10680 props.orientation, 10681 syncState == null ? void 0 : syncState.orientation, 10682 "both" 10683 ), 10684 rtl: defaultValue(props.rtl, syncState == null ? void 0 : syncState.rtl, false), 10685 virtualFocus: defaultValue( 10686 props.virtualFocus, 10687 syncState == null ? void 0 : syncState.virtualFocus, 10688 false 10689 ), 10690 focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, false), 10691 focusWrap: defaultValue(props.focusWrap, syncState == null ? void 0 : syncState.focusWrap, false), 10692 focusShift: defaultValue(props.focusShift, syncState == null ? void 0 : syncState.focusShift, false) 10693 }; 10694 const composite = createStore(initialState, collection, props.store); 10695 setup( 10696 composite, 10697 () => sync(composite, ["renderedItems", "activeId"], (state) => { 10698 composite.setState("activeId", (activeId2) => { 10699 var _a2; 10700 if (activeId2 !== void 0) return activeId2; 10701 return (_a2 = findFirstEnabledItem2(state.renderedItems)) == null ? void 0 : _a2.id; 10702 }); 10703 }) 10704 ); 10705 const getNextId = (direction = "next", options = {}) => { 10706 var _a2, _b; 10707 const defaultState = composite.getState(); 10708 const { 10709 skip = 0, 10710 activeId: activeId2 = defaultState.activeId, 10711 focusShift = defaultState.focusShift, 10712 focusLoop = defaultState.focusLoop, 10713 focusWrap = defaultState.focusWrap, 10714 includesBaseElement = defaultState.includesBaseElement, 10715 renderedItems = defaultState.renderedItems, 10716 rtl = defaultState.rtl 10717 } = options; 10718 const isVerticalDirection = direction === "up" || direction === "down"; 10719 const isNextDirection = direction === "next" || direction === "down"; 10720 const canReverse = isNextDirection ? rtl && !isVerticalDirection : !rtl || isVerticalDirection; 10721 const canShift = focusShift && !skip; 10722 let items = !isVerticalDirection ? renderedItems : flatten2DArray( 10723 normalizeRows(groupItemsByRows2(renderedItems), activeId2, canShift) 10724 ); 10725 items = canReverse ? reverseArray(items) : items; 10726 items = isVerticalDirection ? verticalizeItems(items) : items; 10727 if (activeId2 == null) { 10728 return (_a2 = findFirstEnabledItem2(items)) == null ? void 0 : _a2.id; 10729 } 10730 const activeItem = items.find((item) => item.id === activeId2); 10731 if (!activeItem) { 10732 return (_b = findFirstEnabledItem2(items)) == null ? void 0 : _b.id; 10733 } 10734 const isGrid2 = items.some((item) => item.rowId); 10735 const activeIndex = items.indexOf(activeItem); 10736 const nextItems = items.slice(activeIndex + 1); 10737 const nextItemsInRow = getItemsInRow(nextItems, activeItem.rowId); 10738 if (skip) { 10739 const nextEnabledItemsInRow = getEnabledItems(nextItemsInRow, activeId2); 10740 const nextItem2 = nextEnabledItemsInRow.slice(skip)[0] || // If we can't find an item, just return the last one. 10741 nextEnabledItemsInRow[nextEnabledItemsInRow.length - 1]; 10742 return nextItem2 == null ? void 0 : nextItem2.id; 10743 } 10744 const canLoop = focusLoop && (isVerticalDirection ? focusLoop !== "horizontal" : focusLoop !== "vertical"); 10745 const canWrap = isGrid2 && focusWrap && (isVerticalDirection ? focusWrap !== "horizontal" : focusWrap !== "vertical"); 10746 const hasNullItem = isNextDirection ? (!isGrid2 || isVerticalDirection) && canLoop && includesBaseElement : isVerticalDirection ? includesBaseElement : false; 10747 if (canLoop) { 10748 const loopItems = canWrap && !hasNullItem ? items : getItemsInRow(items, activeItem.rowId); 10749 const sortedItems = flipItems(loopItems, activeId2, hasNullItem); 10750 const nextItem2 = findFirstEnabledItem2(sortedItems, activeId2); 10751 return nextItem2 == null ? void 0 : nextItem2.id; 10752 } 10753 if (canWrap) { 10754 const nextItem2 = findFirstEnabledItem2( 10755 // We can use nextItems, which contains all the next items, including 10756 // items from other rows, to wrap between rows. However, if there is a 10757 // null item (the composite container), we'll only use the next items in 10758 // the row. So moving next from the last item will focus on the 10759 // composite container. On grid composites, horizontal navigation never 10760 // focuses on the composite container, only vertical. 10761 hasNullItem ? nextItemsInRow : nextItems, 10762 activeId2 10763 ); 10764 const nextId = hasNullItem ? (nextItem2 == null ? void 0 : nextItem2.id) || null : nextItem2 == null ? void 0 : nextItem2.id; 10765 return nextId; 10766 } 10767 const nextItem = findFirstEnabledItem2(nextItemsInRow, activeId2); 10768 if (!nextItem && hasNullItem) { 10769 return null; 10770 } 10771 return nextItem == null ? void 0 : nextItem.id; 10772 }; 10773 return { 10774 ...collection, 10775 ...composite, 10776 setBaseElement: (element) => composite.setState("baseElement", element), 10777 setActiveId: (id) => composite.setState("activeId", id), 10778 move: (id) => { 10779 if (id === void 0) return; 10780 composite.setState("activeId", id); 10781 composite.setState("moves", (moves) => moves + 1); 10782 }, 10783 first: () => { 10784 var _a2; 10785 return (_a2 = findFirstEnabledItem2(composite.getState().renderedItems)) == null ? void 0 : _a2.id; 10786 }, 10787 last: () => { 10788 var _a2; 10789 return (_a2 = findFirstEnabledItem2(reverseArray(composite.getState().renderedItems))) == null ? void 0 : _a2.id; 10790 }, 10791 next: (options) => { 10792 if (options !== void 0 && typeof options === "number") { 10793 options = { skip: options }; 10794 } 10795 return getNextId("next", options); 10796 }, 10797 previous: (options) => { 10798 if (options !== void 0 && typeof options === "number") { 10799 options = { skip: options }; 10800 } 10801 return getNextId("previous", options); 10802 }, 10803 down: (options) => { 10804 if (options !== void 0 && typeof options === "number") { 10805 options = { skip: options }; 10806 } 10807 return getNextId("down", options); 10808 }, 10809 up: (options) => { 10810 if (options !== void 0 && typeof options === "number") { 10811 options = { skip: options }; 10812 } 10813 return getNextId("up", options); 10814 } 10815 }; 10816 } 10817 10818 // node_modules/@ariakit/react-core/esm/__chunks/IQYAUKXT.js 10819 function useCompositeStoreOptions(props) { 10820 const id = useId5(props.id); 10821 return { id, ...props }; 10822 } 10823 function useCompositeStoreProps(store, update2, props) { 10824 store = useCollectionStoreProps(store, update2, props); 10825 useStoreProps(store, props, "activeId", "setActiveId"); 10826 useStoreProps(store, props, "includesBaseElement"); 10827 useStoreProps(store, props, "virtualFocus"); 10828 useStoreProps(store, props, "orientation"); 10829 useStoreProps(store, props, "rtl"); 10830 useStoreProps(store, props, "focusLoop"); 10831 useStoreProps(store, props, "focusWrap"); 10832 useStoreProps(store, props, "focusShift"); 10833 return store; 10834 } 10835 10836 // node_modules/@ariakit/react-core/esm/__chunks/CVCFNOHX.js 10837 var import_react21 = __toESM(require_react(), 1); 10838 var ComboboxListRoleContext = (0, import_react21.createContext)( 10839 void 0 10840 ); 10841 var ctx6 = createStoreContext( 10842 [PopoverContextProvider, CompositeContextProvider], 10843 [PopoverScopedContextProvider, CompositeScopedContextProvider] 10844 ); 10845 var useComboboxContext = ctx6.useContext; 10846 var useComboboxScopedContext = ctx6.useScopedContext; 10847 var useComboboxProviderContext = ctx6.useProviderContext; 10848 var ComboboxContextProvider = ctx6.ContextProvider; 10849 var ComboboxScopedContextProvider = ctx6.ScopedContextProvider; 10850 var ComboboxItemValueContext = (0, import_react21.createContext)( 10851 void 0 10852 ); 10853 var ComboboxItemCheckedContext = (0, import_react21.createContext)(false); 10854 10855 // node_modules/@ariakit/core/esm/__chunks/KMAUV3TY.js 10856 function createDialogStore(props = {}) { 10857 return createDisclosureStore(props); 10858 } 10859 10860 // node_modules/@ariakit/react-core/esm/__chunks/4NYSH4UO.js 10861 function useDialogStoreProps(store, update2, props) { 10862 return useDisclosureStoreProps(store, update2, props); 10863 } 10864 10865 // node_modules/@ariakit/core/esm/__chunks/BFGNM53A.js 10866 function createPopoverStore({ 10867 popover: otherPopover, 10868 ...props 10869 } = {}) { 10870 const store = mergeStore( 10871 props.store, 10872 omit2(otherPopover, [ 10873 "arrowElement", 10874 "anchorElement", 10875 "contentElement", 10876 "popoverElement", 10877 "disclosureElement" 10878 ]) 10879 ); 10880 throwOnConflictingProps(props, store); 10881 const syncState = store == null ? void 0 : store.getState(); 10882 const dialog = createDialogStore({ ...props, store }); 10883 const placement = defaultValue( 10884 props.placement, 10885 syncState == null ? void 0 : syncState.placement, 10886 "bottom" 10887 ); 10888 const initialState = { 10889 ...dialog.getState(), 10890 placement, 10891 currentPlacement: placement, 10892 anchorElement: defaultValue(syncState == null ? void 0 : syncState.anchorElement, null), 10893 popoverElement: defaultValue(syncState == null ? void 0 : syncState.popoverElement, null), 10894 arrowElement: defaultValue(syncState == null ? void 0 : syncState.arrowElement, null), 10895 rendered: /* @__PURE__ */ Symbol("rendered") 10896 }; 10897 const popover = createStore(initialState, dialog, store); 10898 return { 10899 ...dialog, 10900 ...popover, 10901 setAnchorElement: (element) => popover.setState("anchorElement", element), 10902 setPopoverElement: (element) => popover.setState("popoverElement", element), 10903 setArrowElement: (element) => popover.setState("arrowElement", element), 10904 render: () => popover.setState("rendered", /* @__PURE__ */ Symbol("rendered")) 10905 }; 10906 } 10907 10908 // node_modules/@ariakit/react-core/esm/__chunks/B6FLPFJM.js 10909 function usePopoverStoreProps(store, update2, props) { 10910 useUpdateEffect(update2, [props.popover]); 10911 useStoreProps(store, props, "placement"); 10912 return useDialogStoreProps(store, update2, props); 10913 } 10914 10915 // node_modules/@ariakit/react-core/esm/__chunks/4POTBZ2J.js 10916 var TagName7 = "div"; 10917 var usePopoverAnchor = createHook( 10918 function usePopoverAnchor2({ store, ...props }) { 10919 const context = usePopoverProviderContext(); 10920 store = store || context; 10921 props = { 10922 ...props, 10923 ref: useMergeRefs(store == null ? void 0 : store.setAnchorElement, props.ref) 10924 }; 10925 return props; 10926 } 10927 ); 10928 var PopoverAnchor = forwardRef26(function PopoverAnchor2(props) { 10929 const htmlProps = usePopoverAnchor(props); 10930 return createElement3(TagName7, htmlProps); 10931 }); 10932 10933 // node_modules/@ariakit/react-core/esm/__chunks/X6LNAU2F.js 10934 var import_react22 = __toESM(require_react(), 1); 10935 var TagName8 = "div"; 10936 function getMouseDestination(event) { 10937 const relatedTarget = event.relatedTarget; 10938 if ((relatedTarget == null ? void 0 : relatedTarget.nodeType) === Node.ELEMENT_NODE) { 10939 return relatedTarget; 10940 } 10941 return null; 10942 } 10943 function hoveringInside(event) { 10944 const nextElement = getMouseDestination(event); 10945 if (!nextElement) return false; 10946 return contains(event.currentTarget, nextElement); 10947 } 10948 var symbol2 = /* @__PURE__ */ Symbol("composite-hover"); 10949 function movingToAnotherItem(event) { 10950 let dest = getMouseDestination(event); 10951 if (!dest) return false; 10952 do { 10953 if (hasOwnProperty(dest, symbol2) && dest[symbol2]) return true; 10954 dest = dest.parentElement; 10955 } while (dest); 10956 return false; 10957 } 10958 var useCompositeHover = createHook( 10959 function useCompositeHover2({ 10960 store, 10961 focusOnHover = true, 10962 blurOnHoverEnd = !!focusOnHover, 10963 ...props 10964 }) { 10965 const context = useCompositeContext(); 10966 store = store || context; 10967 invariant( 10968 store, 10969 "CompositeHover must be wrapped in a Composite component." 10970 ); 10971 const isMouseMoving = useIsMouseMoving(); 10972 const onMouseMoveProp = props.onMouseMove; 10973 const focusOnHoverProp = useBooleanEvent(focusOnHover); 10974 const onMouseMove = useEvent((event) => { 10975 onMouseMoveProp == null ? void 0 : onMouseMoveProp(event); 10976 if (event.defaultPrevented) return; 10977 if (!isMouseMoving()) return; 10978 if (!focusOnHoverProp(event)) return; 10979 if (!hasFocusWithin(event.currentTarget)) { 10980 const baseElement = store == null ? void 0 : store.getState().baseElement; 10981 if (baseElement && !hasFocus(baseElement)) { 10982 baseElement.focus(); 10983 } 10984 } 10985 store == null ? void 0 : store.setActiveId(event.currentTarget.id); 10986 }); 10987 const onMouseLeaveProp = props.onMouseLeave; 10988 const blurOnHoverEndProp = useBooleanEvent(blurOnHoverEnd); 10989 const onMouseLeave = useEvent((event) => { 10990 var _a; 10991 onMouseLeaveProp == null ? void 0 : onMouseLeaveProp(event); 10992 if (event.defaultPrevented) return; 10993 if (!isMouseMoving()) return; 10994 if (hoveringInside(event)) return; 10995 if (movingToAnotherItem(event)) return; 10996 if (!focusOnHoverProp(event)) return; 10997 if (!blurOnHoverEndProp(event)) return; 10998 store == null ? void 0 : store.setActiveId(null); 10999 (_a = store == null ? void 0 : store.getState().baseElement) == null ? void 0 : _a.focus(); 11000 }); 11001 const ref = (0, import_react22.useCallback)((element) => { 11002 if (!element) return; 11003 element[symbol2] = true; 11004 }, []); 11005 props = { 11006 ...props, 11007 ref: useMergeRefs(ref, props.ref), 11008 onMouseMove, 11009 onMouseLeave 11010 }; 11011 return removeUndefinedValues(props); 11012 } 11013 ); 11014 var CompositeHover = memo22( 11015 forwardRef26(function CompositeHover2(props) { 11016 const htmlProps = useCompositeHover(props); 11017 return createElement3(TagName8, htmlProps); 11018 }) 11019 ); 11020 11021 // node_modules/@ariakit/react-core/esm/combobox/combobox.js 11022 var import_react23 = __toESM(require_react(), 1); 11023 var TagName9 = "input"; 11024 function isFirstItemAutoSelected(items, activeValue, autoSelect) { 11025 if (!autoSelect) return false; 11026 const firstItem = items.find((item) => !item.disabled && item.value); 11027 return (firstItem == null ? void 0 : firstItem.value) === activeValue; 11028 } 11029 function hasCompletionString(value, activeValue) { 11030 if (!activeValue) return false; 11031 if (value == null) return false; 11032 value = normalizeString(value); 11033 return activeValue.length > value.length && activeValue.toLowerCase().indexOf(value.toLowerCase()) === 0; 11034 } 11035 function isInputEvent(event) { 11036 return event.type === "input"; 11037 } 11038 function isAriaAutoCompleteValue(value) { 11039 return value === "inline" || value === "list" || value === "both" || value === "none"; 11040 } 11041 function getDefaultAutoSelectId(items) { 11042 const item = items.find((item2) => { 11043 var _a; 11044 if (item2.disabled) return false; 11045 return ((_a = item2.element) == null ? void 0 : _a.getAttribute("role")) !== "tab"; 11046 }); 11047 return item == null ? void 0 : item.id; 11048 } 11049 var useCombobox = createHook( 11050 function useCombobox2({ 11051 store, 11052 focusable = true, 11053 autoSelect: autoSelectProp = false, 11054 getAutoSelectId, 11055 setValueOnChange, 11056 showMinLength = 0, 11057 showOnChange, 11058 showOnMouseDown, 11059 showOnClick = showOnMouseDown, 11060 showOnKeyDown, 11061 showOnKeyPress = showOnKeyDown, 11062 blurActiveItemOnClick, 11063 setValueOnClick = true, 11064 moveOnKeyPress = true, 11065 autoComplete = "list", 11066 ...props 11067 }) { 11068 const context = useComboboxProviderContext(); 11069 store = store || context; 11070 invariant( 11071 store, 11072 "Combobox must receive a `store` prop or be wrapped in a ComboboxProvider component." 11073 ); 11074 const ref = (0, import_react23.useRef)(null); 11075 const [valueUpdated, forceValueUpdate] = useForceUpdate(); 11076 const canAutoSelectRef = (0, import_react23.useRef)(false); 11077 const composingRef = (0, import_react23.useRef)(false); 11078 const autoSelect = store.useState( 11079 (state) => state.virtualFocus && autoSelectProp 11080 ); 11081 const inline = autoComplete === "inline" || autoComplete === "both"; 11082 const [canInline, setCanInline] = (0, import_react23.useState)(inline); 11083 useUpdateLayoutEffect(() => { 11084 if (!inline) return; 11085 setCanInline(true); 11086 }, [inline]); 11087 const storeValue = store.useState("value"); 11088 const prevSelectedValueRef = (0, import_react23.useRef)(void 0); 11089 (0, import_react23.useEffect)(() => { 11090 return sync(store, ["selectedValue", "activeId"], (_, prev) => { 11091 prevSelectedValueRef.current = prev.selectedValue; 11092 }); 11093 }, []); 11094 const inlineActiveValue = store.useState((state) => { 11095 var _a; 11096 if (!inline) return; 11097 if (!canInline) return; 11098 if (state.activeValue && Array.isArray(state.selectedValue)) { 11099 if (state.selectedValue.includes(state.activeValue)) return; 11100 if ((_a = prevSelectedValueRef.current) == null ? void 0 : _a.includes(state.activeValue)) return; 11101 } 11102 return state.activeValue; 11103 }); 11104 const items = store.useState("renderedItems"); 11105 const open = store.useState("open"); 11106 const contentElement = store.useState("contentElement"); 11107 const value = (0, import_react23.useMemo)(() => { 11108 if (!inline) return storeValue; 11109 if (!canInline) return storeValue; 11110 const firstItemAutoSelected = isFirstItemAutoSelected( 11111 items, 11112 inlineActiveValue, 11113 autoSelect 11114 ); 11115 if (firstItemAutoSelected) { 11116 if (hasCompletionString(storeValue, inlineActiveValue)) { 11117 const slice = (inlineActiveValue == null ? void 0 : inlineActiveValue.slice(storeValue.length)) || ""; 11118 return storeValue + slice; 11119 } 11120 return storeValue; 11121 } 11122 return inlineActiveValue || storeValue; 11123 }, [inline, canInline, items, inlineActiveValue, autoSelect, storeValue]); 11124 (0, import_react23.useEffect)(() => { 11125 const element = ref.current; 11126 if (!element) return; 11127 const onCompositeItemMove = () => setCanInline(true); 11128 element.addEventListener("combobox-item-move", onCompositeItemMove); 11129 return () => { 11130 element.removeEventListener("combobox-item-move", onCompositeItemMove); 11131 }; 11132 }, []); 11133 (0, import_react23.useEffect)(() => { 11134 if (!inline) return; 11135 if (!canInline) return; 11136 if (!inlineActiveValue) return; 11137 const firstItemAutoSelected = isFirstItemAutoSelected( 11138 items, 11139 inlineActiveValue, 11140 autoSelect 11141 ); 11142 if (!firstItemAutoSelected) return; 11143 if (!hasCompletionString(storeValue, inlineActiveValue)) return; 11144 let cleanup = noop2; 11145 queueMicrotask(() => { 11146 const element = ref.current; 11147 if (!element) return; 11148 const { start: prevStart, end: prevEnd } = getTextboxSelection(element); 11149 const nextStart = storeValue.length; 11150 const nextEnd = inlineActiveValue.length; 11151 setSelectionRange(element, nextStart, nextEnd); 11152 cleanup = () => { 11153 if (!hasFocus(element)) return; 11154 const { start, end } = getTextboxSelection(element); 11155 if (start !== nextStart) return; 11156 if (end !== nextEnd) return; 11157 setSelectionRange(element, prevStart, prevEnd); 11158 }; 11159 }); 11160 return () => cleanup(); 11161 }, [ 11162 valueUpdated, 11163 inline, 11164 canInline, 11165 inlineActiveValue, 11166 items, 11167 autoSelect, 11168 storeValue 11169 ]); 11170 const scrollingElementRef = (0, import_react23.useRef)(null); 11171 const getAutoSelectIdProp = useEvent(getAutoSelectId); 11172 const autoSelectIdRef = (0, import_react23.useRef)(null); 11173 (0, import_react23.useEffect)(() => { 11174 if (!open) return; 11175 if (!contentElement) return; 11176 const scrollingElement = getScrollingElement(contentElement); 11177 if (!scrollingElement) return; 11178 scrollingElementRef.current = scrollingElement; 11179 const onUserScroll = () => { 11180 canAutoSelectRef.current = false; 11181 }; 11182 const onScroll = () => { 11183 if (!store) return; 11184 if (!canAutoSelectRef.current) return; 11185 const { activeId } = store.getState(); 11186 if (activeId === null) return; 11187 if (activeId === autoSelectIdRef.current) return; 11188 canAutoSelectRef.current = false; 11189 }; 11190 const options = { passive: true, capture: true }; 11191 scrollingElement.addEventListener("wheel", onUserScroll, options); 11192 scrollingElement.addEventListener("touchmove", onUserScroll, options); 11193 scrollingElement.addEventListener("scroll", onScroll, options); 11194 return () => { 11195 scrollingElement.removeEventListener("wheel", onUserScroll, true); 11196 scrollingElement.removeEventListener("touchmove", onUserScroll, true); 11197 scrollingElement.removeEventListener("scroll", onScroll, true); 11198 }; 11199 }, [open, contentElement, store]); 11200 useSafeLayoutEffect(() => { 11201 if (!storeValue) return; 11202 if (composingRef.current) return; 11203 canAutoSelectRef.current = true; 11204 }, [storeValue]); 11205 useSafeLayoutEffect(() => { 11206 if (autoSelect !== "always" && open) return; 11207 canAutoSelectRef.current = open; 11208 }, [autoSelect, open]); 11209 const resetValueOnSelect = store.useState("resetValueOnSelect"); 11210 useUpdateEffect(() => { 11211 var _a, _b; 11212 const canAutoSelect = canAutoSelectRef.current; 11213 if (!store) return; 11214 if (!open) return; 11215 if (!canAutoSelect && !resetValueOnSelect) return; 11216 const { baseElement, contentElement: contentElement2, activeId } = store.getState(); 11217 if (baseElement && !hasFocus(baseElement)) return; 11218 if (contentElement2 == null ? void 0 : contentElement2.hasAttribute("data-placing")) { 11219 const observer = new MutationObserver(forceValueUpdate); 11220 observer.observe(contentElement2, { attributeFilter: ["data-placing"] }); 11221 return () => observer.disconnect(); 11222 } 11223 if (autoSelect && canAutoSelect) { 11224 const userAutoSelectId = getAutoSelectIdProp(items); 11225 const autoSelectId = userAutoSelectId !== void 0 ? userAutoSelectId : (_a = getDefaultAutoSelectId(items)) != null ? _a : store.first(); 11226 autoSelectIdRef.current = autoSelectId; 11227 store.move(autoSelectId != null ? autoSelectId : null); 11228 } else { 11229 const element = (_b = store.item(activeId || store.first())) == null ? void 0 : _b.element; 11230 if (element && "scrollIntoView" in element) { 11231 element.scrollIntoView({ block: "nearest", inline: "nearest" }); 11232 } 11233 } 11234 return; 11235 }, [ 11236 store, 11237 open, 11238 valueUpdated, 11239 storeValue, 11240 autoSelect, 11241 resetValueOnSelect, 11242 getAutoSelectIdProp, 11243 items 11244 ]); 11245 (0, import_react23.useEffect)(() => { 11246 if (!inline) return; 11247 const combobox = ref.current; 11248 if (!combobox) return; 11249 const elements = [combobox, contentElement].filter( 11250 (value2) => !!value2 11251 ); 11252 const onBlur2 = (event) => { 11253 if (elements.every((el) => isFocusEventOutside(event, el))) { 11254 store == null ? void 0 : store.setValue(value); 11255 } 11256 }; 11257 for (const element of elements) { 11258 element.addEventListener("focusout", onBlur2); 11259 } 11260 return () => { 11261 for (const element of elements) { 11262 element.removeEventListener("focusout", onBlur2); 11263 } 11264 }; 11265 }, [inline, contentElement, store, value]); 11266 const canShow = (event) => { 11267 const currentTarget = event.currentTarget; 11268 return currentTarget.value.length >= showMinLength; 11269 }; 11270 const onChangeProp = props.onChange; 11271 const showOnChangeProp = useBooleanEvent(showOnChange != null ? showOnChange : canShow); 11272 const setValueOnChangeProp = useBooleanEvent( 11273 // If the combobox is combined with tags, the value will be set by the tag 11274 // input component. 11275 setValueOnChange != null ? setValueOnChange : !store.tag 11276 ); 11277 const onChange = useEvent((event) => { 11278 onChangeProp == null ? void 0 : onChangeProp(event); 11279 if (event.defaultPrevented) return; 11280 if (!store) return; 11281 const currentTarget = event.currentTarget; 11282 const { value: value2, selectionStart, selectionEnd } = currentTarget; 11283 const nativeEvent = event.nativeEvent; 11284 canAutoSelectRef.current = true; 11285 if (isInputEvent(nativeEvent)) { 11286 if (nativeEvent.isComposing) { 11287 canAutoSelectRef.current = false; 11288 composingRef.current = true; 11289 } 11290 if (inline) { 11291 const textInserted = nativeEvent.inputType === "insertText" || nativeEvent.inputType === "insertCompositionText"; 11292 const caretAtEnd = selectionStart === value2.length; 11293 setCanInline(textInserted && caretAtEnd); 11294 } 11295 } 11296 if (setValueOnChangeProp(event)) { 11297 const isSameValue = value2 === store.getState().value; 11298 store.setValue(value2); 11299 queueMicrotask(() => { 11300 setSelectionRange(currentTarget, selectionStart, selectionEnd); 11301 }); 11302 if (inline && autoSelect && isSameValue) { 11303 forceValueUpdate(); 11304 } 11305 } 11306 if (showOnChangeProp(event)) { 11307 store.show(); 11308 } 11309 if (!autoSelect || !canAutoSelectRef.current) { 11310 store.setActiveId(null); 11311 } 11312 }); 11313 const onCompositionEndProp = props.onCompositionEnd; 11314 const onCompositionEnd = useEvent((event) => { 11315 canAutoSelectRef.current = true; 11316 composingRef.current = false; 11317 onCompositionEndProp == null ? void 0 : onCompositionEndProp(event); 11318 if (event.defaultPrevented) return; 11319 if (!autoSelect) return; 11320 forceValueUpdate(); 11321 }); 11322 const onMouseDownProp = props.onMouseDown; 11323 const blurActiveItemOnClickProp = useBooleanEvent( 11324 blurActiveItemOnClick != null ? blurActiveItemOnClick : (() => !!(store == null ? void 0 : store.getState().includesBaseElement)) 11325 ); 11326 const setValueOnClickProp = useBooleanEvent(setValueOnClick); 11327 const showOnClickProp = useBooleanEvent(showOnClick != null ? showOnClick : canShow); 11328 const onMouseDown = useEvent((event) => { 11329 onMouseDownProp == null ? void 0 : onMouseDownProp(event); 11330 if (event.defaultPrevented) return; 11331 if (event.button) return; 11332 if (event.ctrlKey) return; 11333 if (!store) return; 11334 if (blurActiveItemOnClickProp(event)) { 11335 store.setActiveId(null); 11336 } 11337 if (setValueOnClickProp(event)) { 11338 store.setValue(value); 11339 } 11340 if (showOnClickProp(event)) { 11341 queueBeforeEvent(event.currentTarget, "mouseup", store.show); 11342 } 11343 }); 11344 const onKeyDownProp = props.onKeyDown; 11345 const showOnKeyPressProp = useBooleanEvent(showOnKeyPress != null ? showOnKeyPress : canShow); 11346 const onKeyDown = useEvent((event) => { 11347 onKeyDownProp == null ? void 0 : onKeyDownProp(event); 11348 if (!event.repeat) { 11349 canAutoSelectRef.current = false; 11350 } 11351 if (event.defaultPrevented) return; 11352 if (event.ctrlKey) return; 11353 if (event.altKey) return; 11354 if (event.shiftKey) return; 11355 if (event.metaKey) return; 11356 if (!store) return; 11357 const { open: open2 } = store.getState(); 11358 if (open2) return; 11359 if (event.key === "ArrowUp" || event.key === "ArrowDown") { 11360 if (showOnKeyPressProp(event)) { 11361 event.preventDefault(); 11362 store.show(); 11363 } 11364 } 11365 }); 11366 const onBlurProp = props.onBlur; 11367 const onBlur = useEvent((event) => { 11368 canAutoSelectRef.current = false; 11369 onBlurProp == null ? void 0 : onBlurProp(event); 11370 if (event.defaultPrevented) return; 11371 }); 11372 const id = useId5(props.id); 11373 const ariaAutoComplete = isAriaAutoCompleteValue(autoComplete) ? autoComplete : void 0; 11374 const isActiveItem = store.useState((state) => state.activeId === null); 11375 props = { 11376 id, 11377 role: "combobox", 11378 "aria-autocomplete": ariaAutoComplete, 11379 "aria-haspopup": getPopupRole(contentElement, "listbox"), 11380 "aria-expanded": open, 11381 "aria-controls": contentElement == null ? void 0 : contentElement.id, 11382 "data-active-item": isActiveItem || void 0, 11383 value, 11384 ...props, 11385 ref: useMergeRefs(ref, props.ref), 11386 onChange, 11387 onCompositionEnd, 11388 onMouseDown, 11389 onKeyDown, 11390 onBlur 11391 }; 11392 props = useComposite({ 11393 store, 11394 focusable, 11395 ...props, 11396 // Enable inline autocomplete when the user moves from the combobox input 11397 // to an item. 11398 moveOnKeyPress: (event) => { 11399 if (isFalsyBooleanCallback(moveOnKeyPress, event)) return false; 11400 if (inline) setCanInline(true); 11401 return true; 11402 } 11403 }); 11404 props = usePopoverAnchor({ store, ...props }); 11405 return { autoComplete: "off", ...props }; 11406 } 11407 ); 11408 var Combobox = forwardRef26(function Combobox2(props) { 11409 const htmlProps = useCombobox(props); 11410 return createElement3(TagName9, htmlProps); 11411 }); 11412 11413 // node_modules/@ariakit/react-core/esm/__chunks/IBXZ2LQC.js 11414 var import_react24 = __toESM(require_react(), 1); 11415 var import_jsx_runtime67 = __toESM(require_jsx_runtime(), 1); 11416 var TagName10 = "div"; 11417 function isSelected(storeValue, itemValue) { 11418 if (itemValue == null) return; 11419 if (storeValue == null) return false; 11420 if (Array.isArray(storeValue)) { 11421 return storeValue.includes(itemValue); 11422 } 11423 return storeValue === itemValue; 11424 } 11425 function getItemRole(popupRole) { 11426 var _a; 11427 const itemRoleByPopupRole = { 11428 menu: "menuitem", 11429 listbox: "option", 11430 tree: "treeitem" 11431 }; 11432 const key = popupRole; 11433 return (_a = itemRoleByPopupRole[key]) != null ? _a : "option"; 11434 } 11435 var useComboboxItem = createHook( 11436 function useComboboxItem2({ 11437 store, 11438 value, 11439 hideOnClick, 11440 setValueOnClick, 11441 selectValueOnClick = true, 11442 resetValueOnSelect, 11443 focusOnHover = false, 11444 moveOnKeyPress = true, 11445 getItem: getItemProp, 11446 ...props 11447 }) { 11448 var _a; 11449 const context = useComboboxScopedContext(); 11450 store = store || context; 11451 invariant( 11452 store, 11453 "ComboboxItem must be wrapped in a ComboboxList or ComboboxPopover component." 11454 ); 11455 const { resetValueOnSelectState, multiSelectable, selected } = useStoreStateObject(store, { 11456 resetValueOnSelectState: "resetValueOnSelect", 11457 multiSelectable(state) { 11458 return Array.isArray(state.selectedValue); 11459 }, 11460 selected(state) { 11461 return isSelected(state.selectedValue, value); 11462 } 11463 }); 11464 const getItem = (0, import_react24.useCallback)( 11465 (item) => { 11466 const nextItem = { ...item, value }; 11467 if (getItemProp) { 11468 return getItemProp(nextItem); 11469 } 11470 return nextItem; 11471 }, 11472 [value, getItemProp] 11473 ); 11474 setValueOnClick = setValueOnClick != null ? setValueOnClick : !multiSelectable; 11475 hideOnClick = hideOnClick != null ? hideOnClick : value != null && !multiSelectable; 11476 const onClickProp = props.onClick; 11477 const setValueOnClickProp = useBooleanEvent(setValueOnClick); 11478 const selectValueOnClickProp = useBooleanEvent(selectValueOnClick); 11479 const resetValueOnSelectProp = useBooleanEvent( 11480 (_a = resetValueOnSelect != null ? resetValueOnSelect : resetValueOnSelectState) != null ? _a : multiSelectable 11481 ); 11482 const hideOnClickProp = useBooleanEvent(hideOnClick); 11483 const onClick = useEvent((event) => { 11484 onClickProp == null ? void 0 : onClickProp(event); 11485 if (event.defaultPrevented) return; 11486 if (isDownloading(event)) return; 11487 if (isOpeningInNewTab(event)) return; 11488 if (value != null) { 11489 if (selectValueOnClickProp(event)) { 11490 if (resetValueOnSelectProp(event)) { 11491 store == null ? void 0 : store.resetValue(); 11492 } 11493 store == null ? void 0 : store.setSelectedValue((prevValue) => { 11494 if (!Array.isArray(prevValue)) return value; 11495 if (prevValue.includes(value)) { 11496 return prevValue.filter((v2) => v2 !== value); 11497 } 11498 return [...prevValue, value]; 11499 }); 11500 } 11501 if (setValueOnClickProp(event)) { 11502 store == null ? void 0 : store.setValue(value); 11503 } 11504 } 11505 if (hideOnClickProp(event)) { 11506 store == null ? void 0 : store.hide(); 11507 } 11508 }); 11509 const onKeyDownProp = props.onKeyDown; 11510 const onKeyDown = useEvent((event) => { 11511 onKeyDownProp == null ? void 0 : onKeyDownProp(event); 11512 if (event.defaultPrevented) return; 11513 const baseElement = store == null ? void 0 : store.getState().baseElement; 11514 if (!baseElement) return; 11515 if (hasFocus(baseElement)) return; 11516 const printable = event.key.length === 1; 11517 if (printable || event.key === "Backspace" || event.key === "Delete") { 11518 queueMicrotask(() => baseElement.focus()); 11519 if (isTextField(baseElement)) { 11520 store == null ? void 0 : store.setValue(baseElement.value); 11521 } 11522 } 11523 }); 11524 if (multiSelectable && selected != null) { 11525 props = { 11526 "aria-selected": selected, 11527 ...props 11528 }; 11529 } 11530 props = useWrapElement( 11531 props, 11532 (element) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ComboboxItemValueContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ComboboxItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }) }), 11533 [value, selected] 11534 ); 11535 const popupRole = (0, import_react24.useContext)(ComboboxListRoleContext); 11536 props = { 11537 role: getItemRole(popupRole), 11538 children: value, 11539 ...props, 11540 onClick, 11541 onKeyDown 11542 }; 11543 const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); 11544 props = useCompositeItem({ 11545 store, 11546 ...props, 11547 getItem, 11548 // Dispatch a custom event on the combobox input when moving to an item 11549 // with the keyboard so the Combobox component can enable inline 11550 // autocompletion. 11551 moveOnKeyPress: (event) => { 11552 if (!moveOnKeyPressProp(event)) return false; 11553 const moveEvent = new Event("combobox-item-move"); 11554 const baseElement = store == null ? void 0 : store.getState().baseElement; 11555 baseElement == null ? void 0 : baseElement.dispatchEvent(moveEvent); 11556 return true; 11557 } 11558 }); 11559 props = useCompositeHover({ store, focusOnHover, ...props }); 11560 return props; 11561 } 11562 ); 11563 var ComboboxItem = memo22( 11564 forwardRef26(function ComboboxItem2(props) { 11565 const htmlProps = useComboboxItem(props); 11566 return createElement3(TagName10, htmlProps); 11567 }) 11568 ); 11569 11570 // node_modules/@ariakit/react-core/esm/combobox/combobox-item-value.js 11571 var import_react25 = __toESM(require_react(), 1); 11572 var import_jsx_runtime68 = __toESM(require_jsx_runtime(), 1); 11573 var TagName11 = "span"; 11574 function normalizeValue(value) { 11575 return normalizeString(value).toLowerCase(); 11576 } 11577 function getOffsets(string, values) { 11578 const offsets = []; 11579 for (const value of values) { 11580 let pos = 0; 11581 const length = value.length; 11582 while (string.indexOf(value, pos) !== -1) { 11583 const index = string.indexOf(value, pos); 11584 if (index !== -1) { 11585 offsets.push([index, length]); 11586 } 11587 pos = index + 1; 11588 } 11589 } 11590 return offsets; 11591 } 11592 function filterOverlappingOffsets(offsets) { 11593 return offsets.filter(([offset, length], i2, arr) => { 11594 return !arr.some( 11595 ([o2, l2], j2) => j2 !== i2 && o2 <= offset && o2 + l2 >= offset + length 11596 ); 11597 }); 11598 } 11599 function sortOffsets(offsets) { 11600 return offsets.sort(([a2], [b2]) => a2 - b2); 11601 } 11602 function splitValue(itemValue, userValue) { 11603 if (!itemValue) return itemValue; 11604 if (!userValue) return itemValue; 11605 const userValues = toArray(userValue).filter(Boolean).map(normalizeValue); 11606 const parts = []; 11607 const span = (value, autocomplete = false) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)( 11608 "span", 11609 { 11610 "data-autocomplete-value": autocomplete ? "" : void 0, 11611 "data-user-value": autocomplete ? void 0 : "", 11612 children: value 11613 }, 11614 parts.length 11615 ); 11616 const offsets = sortOffsets( 11617 filterOverlappingOffsets( 11618 // Convert userValues into a set to avoid duplicates 11619 getOffsets(normalizeValue(itemValue), new Set(userValues)) 11620 ) 11621 ); 11622 if (!offsets.length) { 11623 parts.push(span(itemValue, true)); 11624 return parts; 11625 } 11626 const [firstOffset] = offsets[0]; 11627 const values = [ 11628 itemValue.slice(0, firstOffset), 11629 ...offsets.flatMap(([offset, length], i2) => { 11630 var _a; 11631 const value = itemValue.slice(offset, offset + length); 11632 const nextOffset = (_a = offsets[i2 + 1]) == null ? void 0 : _a[0]; 11633 const nextValue = itemValue.slice(offset + length, nextOffset); 11634 return [value, nextValue]; 11635 }) 11636 ]; 11637 values.forEach((value, i2) => { 11638 if (!value) return; 11639 parts.push(span(value, i2 % 2 === 0)); 11640 }); 11641 return parts; 11642 } 11643 var useComboboxItemValue = createHook(function useComboboxItemValue2({ store, value, userValue, ...props }) { 11644 const context = useComboboxScopedContext(); 11645 store = store || context; 11646 const itemContext = (0, import_react25.useContext)(ComboboxItemValueContext); 11647 const itemValue = value != null ? value : itemContext; 11648 const inputValue = useStoreState(store, (state) => userValue != null ? userValue : state == null ? void 0 : state.value); 11649 const children = (0, import_react25.useMemo)(() => { 11650 if (!itemValue) return; 11651 if (!inputValue) return itemValue; 11652 return splitValue(itemValue, inputValue); 11653 }, [itemValue, inputValue]); 11654 props = { 11655 children, 11656 ...props 11657 }; 11658 return removeUndefinedValues(props); 11659 }); 11660 var ComboboxItemValue = forwardRef26(function ComboboxItemValue2(props) { 11661 const htmlProps = useComboboxItemValue(props); 11662 return createElement3(TagName11, htmlProps); 11663 }); 11664 11665 // node_modules/@ariakit/react-core/esm/combobox/combobox-label.js 11666 var TagName12 = "label"; 11667 var useComboboxLabel = createHook( 11668 function useComboboxLabel2({ store, ...props }) { 11669 const context = useComboboxProviderContext(); 11670 store = store || context; 11671 invariant( 11672 store, 11673 "ComboboxLabel must receive a `store` prop or be wrapped in a ComboboxProvider component." 11674 ); 11675 const comboboxId = store.useState((state) => { 11676 var _a; 11677 return (_a = state.baseElement) == null ? void 0 : _a.id; 11678 }); 11679 props = { 11680 htmlFor: comboboxId, 11681 ...props 11682 }; 11683 return removeUndefinedValues(props); 11684 } 11685 ); 11686 var ComboboxLabel = memo22( 11687 forwardRef26(function ComboboxLabel2(props) { 11688 const htmlProps = useComboboxLabel(props); 11689 return createElement3(TagName12, htmlProps); 11690 }) 11691 ); 11692 11693 // node_modules/@ariakit/react-core/esm/__chunks/2G6YEJT4.js 11694 var import_react26 = __toESM(require_react(), 1); 11695 var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1); 11696 var TagName13 = "div"; 11697 var useComboboxList = createHook( 11698 function useComboboxList2({ store, alwaysVisible, ...props }) { 11699 const scopedContext = useComboboxScopedContext(true); 11700 const context = useComboboxContext(); 11701 store = store || context; 11702 const scopedContextSameStore = !!store && store === scopedContext; 11703 invariant( 11704 store, 11705 "ComboboxList must receive a `store` prop or be wrapped in a ComboboxProvider component." 11706 ); 11707 const ref = (0, import_react26.useRef)(null); 11708 const id = useId5(props.id); 11709 const mounted = store.useState("mounted"); 11710 const hidden = isHidden(mounted, props.hidden, alwaysVisible); 11711 const style = hidden ? { ...props.style, display: "none" } : props.style; 11712 const multiSelectable = store.useState( 11713 (state) => Array.isArray(state.selectedValue) 11714 ); 11715 const role = useAttribute(ref, "role", props.role); 11716 const isCompositeRole = role === "listbox" || role === "tree" || role === "grid"; 11717 const ariaMultiSelectable = isCompositeRole ? multiSelectable || void 0 : void 0; 11718 const [hasListboxInside, setHasListboxInside] = (0, import_react26.useState)(false); 11719 const contentElement = store.useState("contentElement"); 11720 useSafeLayoutEffect(() => { 11721 if (!mounted) return; 11722 const element = ref.current; 11723 if (!element) return; 11724 if (contentElement !== element) return; 11725 const callback = () => { 11726 setHasListboxInside(!!element.querySelector("[role='listbox']")); 11727 }; 11728 const observer = new MutationObserver(callback); 11729 observer.observe(element, { 11730 subtree: true, 11731 childList: true, 11732 attributeFilter: ["role"] 11733 }); 11734 callback(); 11735 return () => observer.disconnect(); 11736 }, [mounted, contentElement]); 11737 if (!hasListboxInside) { 11738 props = { 11739 role: "listbox", 11740 "aria-multiselectable": ariaMultiSelectable, 11741 ...props 11742 }; 11743 } 11744 props = useWrapElement( 11745 props, 11746 (element) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ComboboxScopedContextProvider, { value: store, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ComboboxListRoleContext.Provider, { value: role, children: element }) }), 11747 [store, role] 11748 ); 11749 const setContentElement = id && (!scopedContext || !scopedContextSameStore) ? store.setContentElement : null; 11750 props = { 11751 id, 11752 hidden, 11753 ...props, 11754 ref: useMergeRefs(setContentElement, ref, props.ref), 11755 style 11756 }; 11757 return removeUndefinedValues(props); 11758 } 11759 ); 11760 var ComboboxList = forwardRef26(function ComboboxList2(props) { 11761 const htmlProps = useComboboxList(props); 11762 return createElement3(TagName13, htmlProps); 11763 }); 11764 11765 // node_modules/@ariakit/react-core/esm/__chunks/XSIEPKGA.js 11766 var import_react27 = __toESM(require_react(), 1); 11767 var TagValueContext = (0, import_react27.createContext)(null); 11768 var TagRemoveIdContext = (0, import_react27.createContext)( 11769 null 11770 ); 11771 var ctx7 = createStoreContext( 11772 [CompositeContextProvider], 11773 [CompositeScopedContextProvider] 11774 ); 11775 var useTagContext = ctx7.useContext; 11776 var useTagScopedContext = ctx7.useScopedContext; 11777 var useTagProviderContext = ctx7.useProviderContext; 11778 var TagContextProvider = ctx7.ContextProvider; 11779 var TagScopedContextProvider = ctx7.ScopedContextProvider; 11780 11781 // node_modules/@ariakit/core/esm/combobox/combobox-store.js 11782 var isTouchSafari = isSafari() && isTouchDevice(); 11783 function createComboboxStore({ 11784 tag, 11785 ...props 11786 } = {}) { 11787 const store = mergeStore(props.store, pick2(tag, ["value", "rtl"])); 11788 throwOnConflictingProps(props, store); 11789 const tagState = tag == null ? void 0 : tag.getState(); 11790 const syncState = store == null ? void 0 : store.getState(); 11791 const activeId = defaultValue( 11792 props.activeId, 11793 syncState == null ? void 0 : syncState.activeId, 11794 props.defaultActiveId, 11795 null 11796 ); 11797 const composite = createCompositeStore({ 11798 ...props, 11799 activeId, 11800 includesBaseElement: defaultValue( 11801 props.includesBaseElement, 11802 syncState == null ? void 0 : syncState.includesBaseElement, 11803 true 11804 ), 11805 orientation: defaultValue( 11806 props.orientation, 11807 syncState == null ? void 0 : syncState.orientation, 11808 "vertical" 11809 ), 11810 focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true), 11811 focusWrap: defaultValue(props.focusWrap, syncState == null ? void 0 : syncState.focusWrap, true), 11812 virtualFocus: defaultValue( 11813 props.virtualFocus, 11814 syncState == null ? void 0 : syncState.virtualFocus, 11815 true 11816 ) 11817 }); 11818 const popover = createPopoverStore({ 11819 ...props, 11820 placement: defaultValue( 11821 props.placement, 11822 syncState == null ? void 0 : syncState.placement, 11823 "bottom-start" 11824 ) 11825 }); 11826 const value = defaultValue( 11827 props.value, 11828 syncState == null ? void 0 : syncState.value, 11829 props.defaultValue, 11830 "" 11831 ); 11832 const selectedValue = defaultValue( 11833 props.selectedValue, 11834 syncState == null ? void 0 : syncState.selectedValue, 11835 tagState == null ? void 0 : tagState.values, 11836 props.defaultSelectedValue, 11837 "" 11838 ); 11839 const multiSelectable = Array.isArray(selectedValue); 11840 const initialState = { 11841 ...composite.getState(), 11842 ...popover.getState(), 11843 value, 11844 selectedValue, 11845 resetValueOnSelect: defaultValue( 11846 props.resetValueOnSelect, 11847 syncState == null ? void 0 : syncState.resetValueOnSelect, 11848 multiSelectable 11849 ), 11850 resetValueOnHide: defaultValue( 11851 props.resetValueOnHide, 11852 syncState == null ? void 0 : syncState.resetValueOnHide, 11853 multiSelectable && !tag 11854 ), 11855 activeValue: syncState == null ? void 0 : syncState.activeValue 11856 }; 11857 const combobox = createStore(initialState, composite, popover, store); 11858 if (isTouchSafari) { 11859 setup( 11860 combobox, 11861 () => sync(combobox, ["virtualFocus"], () => { 11862 combobox.setState("virtualFocus", false); 11863 }) 11864 ); 11865 } 11866 setup(combobox, () => { 11867 if (!tag) return; 11868 return chain( 11869 sync(combobox, ["selectedValue"], (state) => { 11870 if (!Array.isArray(state.selectedValue)) return; 11871 tag.setValues(state.selectedValue); 11872 }), 11873 sync(tag, ["values"], (state) => { 11874 combobox.setState("selectedValue", state.values); 11875 }) 11876 ); 11877 }); 11878 setup( 11879 combobox, 11880 () => sync(combobox, ["resetValueOnHide", "mounted"], (state) => { 11881 if (!state.resetValueOnHide) return; 11882 if (state.mounted) return; 11883 combobox.setState("value", value); 11884 }) 11885 ); 11886 setup( 11887 combobox, 11888 () => sync(combobox, ["open"], (state) => { 11889 if (state.open) return; 11890 combobox.setState("activeId", activeId); 11891 combobox.setState("moves", 0); 11892 }) 11893 ); 11894 setup( 11895 combobox, 11896 () => sync(combobox, ["moves", "activeId"], (state, prevState) => { 11897 if (state.moves === prevState.moves) { 11898 combobox.setState("activeValue", void 0); 11899 } 11900 }) 11901 ); 11902 setup( 11903 combobox, 11904 () => batch(combobox, ["moves", "renderedItems"], (state, prev) => { 11905 if (state.moves === prev.moves) return; 11906 const { activeId: activeId2 } = combobox.getState(); 11907 const activeItem = composite.item(activeId2); 11908 combobox.setState("activeValue", activeItem == null ? void 0 : activeItem.value); 11909 }) 11910 ); 11911 return { 11912 ...popover, 11913 ...composite, 11914 ...combobox, 11915 tag, 11916 setValue: (value2) => combobox.setState("value", value2), 11917 resetValue: () => combobox.setState("value", initialState.value), 11918 setSelectedValue: (selectedValue2) => combobox.setState("selectedValue", selectedValue2) 11919 }; 11920 } 11921 11922 // node_modules/@ariakit/react-core/esm/__chunks/SVN33SY6.js 11923 function useComboboxStoreOptions(props) { 11924 const tag = useTagContext(); 11925 props = { 11926 ...props, 11927 tag: props.tag !== void 0 ? props.tag : tag 11928 }; 11929 return useCompositeStoreOptions(props); 11930 } 11931 function useComboboxStoreProps(store, update2, props) { 11932 useUpdateEffect(update2, [props.tag]); 11933 useStoreProps(store, props, "value", "setValue"); 11934 useStoreProps(store, props, "selectedValue", "setSelectedValue"); 11935 useStoreProps(store, props, "resetValueOnHide"); 11936 useStoreProps(store, props, "resetValueOnSelect"); 11937 return Object.assign( 11938 useCompositeStoreProps( 11939 usePopoverStoreProps(store, update2, props), 11940 update2, 11941 props 11942 ), 11943 { tag: props.tag } 11944 ); 11945 } 11946 function useComboboxStore(props = {}) { 11947 props = useComboboxStoreOptions(props); 11948 const [store, update2] = useStore(createComboboxStore, props); 11949 return useComboboxStoreProps(store, update2, props); 11950 } 11951 11952 // node_modules/@ariakit/react-core/esm/combobox/combobox-provider.js 11953 var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1); 11954 function ComboboxProvider(props = {}) { 11955 const store = useComboboxStore(props); 11956 return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ComboboxContextProvider, { value: store, children: props.children }); 11957 } 11958 11959 // packages/dataviews/build-module/components/dataviews-filters/search-widget.mjs 11960 var import_remove_accents = __toESM(require_remove_accents(), 1); 11961 var import_compose7 = __toESM(require_compose(), 1); 11962 var import_i18n22 = __toESM(require_i18n(), 1); 11963 var import_element43 = __toESM(require_element(), 1); 11964 var import_components19 = __toESM(require_components(), 1); 11965 11966 // packages/dataviews/build-module/components/dataviews-filters/utils.mjs 11967 var EMPTY_ARRAY3 = []; 11968 var getCurrentValue = (filterDefinition, currentFilter) => { 11969 if (filterDefinition.singleSelection) { 11970 return currentFilter?.value; 11971 } 11972 if (Array.isArray(currentFilter?.value)) { 11973 return currentFilter.value; 11974 } 11975 if (!Array.isArray(currentFilter?.value) && !!currentFilter?.value) { 11976 return [currentFilter.value]; 11977 } 11978 return EMPTY_ARRAY3; 11979 }; 11980 11981 // packages/dataviews/build-module/hooks/use-elements.mjs 11982 var import_element42 = __toESM(require_element(), 1); 11983 var EMPTY_ARRAY4 = []; 11984 function useElements({ 11985 elements, 11986 getElements 11987 }) { 11988 const staticElements = Array.isArray(elements) && elements.length > 0 ? elements : EMPTY_ARRAY4; 11989 const [records, setRecords] = (0, import_element42.useState)(staticElements); 11990 const [isLoading, setIsLoading] = (0, import_element42.useState)(false); 11991 (0, import_element42.useEffect)(() => { 11992 if (!getElements) { 11993 setRecords(staticElements); 11994 return; 11995 } 11996 let cancelled = false; 11997 setIsLoading(true); 11998 getElements().then((fetchedElements) => { 11999 if (!cancelled) { 12000 const dynamicElements = Array.isArray(fetchedElements) && fetchedElements.length > 0 ? fetchedElements : staticElements; 12001 setRecords(dynamicElements); 12002 } 12003 }).catch(() => { 12004 if (!cancelled) { 12005 setRecords(staticElements); 12006 } 12007 }).finally(() => { 12008 if (!cancelled) { 12009 setIsLoading(false); 12010 } 12011 }); 12012 return () => { 12013 cancelled = true; 12014 }; 12015 }, [getElements, staticElements]); 12016 return { 12017 elements: records, 12018 isLoading 12019 }; 12020 } 12021 12022 // packages/dataviews/build-module/components/dataviews-filters/search-widget.mjs 12023 var import_jsx_runtime71 = __toESM(require_jsx_runtime(), 1); 12024 function normalizeSearchInput(input = "") { 12025 return (0, import_remove_accents.default)(input.trim().toLowerCase()); 12026 } 12027 var getNewValue = (filterDefinition, currentFilter, value) => { 12028 if (filterDefinition.singleSelection) { 12029 return value; 12030 } 12031 if (Array.isArray(currentFilter?.value)) { 12032 return currentFilter.value.includes(value) ? currentFilter.value.filter((v2) => v2 !== value) : [...currentFilter.value, value]; 12033 } 12034 return [value]; 12035 }; 12036 function generateFilterElementCompositeItemId(prefix, filterElementValue) { 12037 return `$prefix}-$filterElementValue}`; 12038 } 12039 var MultiSelectionOption = ({ selected }) => { 12040 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12041 "span", 12042 { 12043 className: clsx_default( 12044 "dataviews-filters__search-widget-listitem-multi-selection", 12045 { "is-selected": selected } 12046 ), 12047 children: selected && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_components19.Icon, { icon: check_default }) 12048 } 12049 ); 12050 }; 12051 var SingleSelectionOption = ({ selected }) => { 12052 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12053 "span", 12054 { 12055 className: clsx_default( 12056 "dataviews-filters__search-widget-listitem-single-selection", 12057 { "is-selected": selected } 12058 ) 12059 } 12060 ); 12061 }; 12062 function ListBox({ view, filter, onChangeView }) { 12063 const baseId = (0, import_compose7.useInstanceId)(ListBox, "dataviews-filter-list-box"); 12064 const [activeCompositeId, setActiveCompositeId] = (0, import_element43.useState)( 12065 // When there are one or less operators, the first item is set as active 12066 // (by setting the initial `activeId` to `undefined`). 12067 // With 2 or more operators, the focus is moved on the operators control 12068 // (by setting the initial `activeId` to `null`), meaning that there won't 12069 // be an active item initially. Focus is then managed via the 12070 // `onFocusVisible` callback. 12071 filter.operators?.length === 1 ? void 0 : null 12072 ); 12073 const currentFilter = view.filters?.find( 12074 (f2) => f2.field === filter.field 12075 ); 12076 const currentValue = getCurrentValue(filter, currentFilter); 12077 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12078 import_components19.Composite, 12079 { 12080 virtualFocus: true, 12081 focusLoop: true, 12082 activeId: activeCompositeId, 12083 setActiveId: setActiveCompositeId, 12084 role: "listbox", 12085 className: "dataviews-filters__search-widget-listbox", 12086 "aria-label": (0, import_i18n22.sprintf)( 12087 /* translators: List of items for a filter. 1: Filter name. e.g.: "List of: Author". */ 12088 (0, import_i18n22.__)("List of: %1$s"), 12089 filter.name 12090 ), 12091 onFocusVisible: () => { 12092 if (!activeCompositeId && filter.elements.length) { 12093 setActiveCompositeId( 12094 generateFilterElementCompositeItemId( 12095 baseId, 12096 filter.elements[0].value 12097 ) 12098 ); 12099 } 12100 }, 12101 render: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_components19.Composite.Typeahead, {}), 12102 children: filter.elements.map((element) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)( 12103 import_components19.Composite.Hover, 12104 { 12105 render: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12106 import_components19.Composite.Item, 12107 { 12108 id: generateFilterElementCompositeItemId( 12109 baseId, 12110 element.value 12111 ), 12112 render: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12113 "div", 12114 { 12115 "aria-label": element.label, 12116 role: "option", 12117 className: "dataviews-filters__search-widget-listitem" 12118 } 12119 ), 12120 onClick: () => { 12121 const newFilters = currentFilter ? [ 12122 ...(view.filters ?? []).map( 12123 (_filter) => { 12124 if (_filter.field === filter.field) { 12125 return { 12126 ..._filter, 12127 operator: currentFilter.operator || filter.operators[0], 12128 value: getNewValue( 12129 filter, 12130 currentFilter, 12131 element.value 12132 ) 12133 }; 12134 } 12135 return _filter; 12136 } 12137 ) 12138 ] : [ 12139 ...view.filters ?? [], 12140 { 12141 field: filter.field, 12142 operator: filter.operators[0], 12143 value: getNewValue( 12144 filter, 12145 currentFilter, 12146 element.value 12147 ) 12148 } 12149 ]; 12150 onChangeView({ 12151 ...view, 12152 page: 1, 12153 filters: newFilters 12154 }); 12155 } 12156 } 12157 ), 12158 children: [ 12159 filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12160 SingleSelectionOption, 12161 { 12162 selected: currentValue === element.value 12163 } 12164 ), 12165 !filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12166 MultiSelectionOption, 12167 { 12168 selected: currentValue.includes(element.value) 12169 } 12170 ), 12171 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12172 "span", 12173 { 12174 className: "dataviews-filters__search-widget-listitem-value", 12175 title: element.label, 12176 children: element.label 12177 } 12178 ) 12179 ] 12180 }, 12181 element.value 12182 )) 12183 } 12184 ); 12185 } 12186 function ComboboxList22({ view, filter, onChangeView }) { 12187 const [searchValue, setSearchValue] = (0, import_element43.useState)(""); 12188 const deferredSearchValue = (0, import_element43.useDeferredValue)(searchValue); 12189 const currentFilter = view.filters?.find( 12190 (_filter) => _filter.field === filter.field 12191 ); 12192 const currentValue = getCurrentValue(filter, currentFilter); 12193 const matches = (0, import_element43.useMemo)(() => { 12194 const normalizedSearch = normalizeSearchInput(deferredSearchValue); 12195 return filter.elements.filter( 12196 (item) => normalizeSearchInput(item.label).includes(normalizedSearch) 12197 ); 12198 }, [filter.elements, deferredSearchValue]); 12199 return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)( 12200 ComboboxProvider, 12201 { 12202 selectedValue: currentValue, 12203 setSelectedValue: (value) => { 12204 const newFilters = currentFilter ? [ 12205 ...(view.filters ?? []).map((_filter) => { 12206 if (_filter.field === filter.field) { 12207 return { 12208 ..._filter, 12209 operator: currentFilter.operator || filter.operators[0], 12210 value 12211 }; 12212 } 12213 return _filter; 12214 }) 12215 ] : [ 12216 ...view.filters ?? [], 12217 { 12218 field: filter.field, 12219 operator: filter.operators[0], 12220 value 12221 } 12222 ]; 12223 onChangeView({ 12224 ...view, 12225 page: 1, 12226 filters: newFilters 12227 }); 12228 }, 12229 setValue: setSearchValue, 12230 children: [ 12231 /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "dataviews-filters__search-widget-filter-combobox__wrapper", children: [ 12232 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(VisuallyHidden, { render: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ComboboxLabel, {}), children: (0, import_i18n22.__)("Search items") }), 12233 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12234 Combobox, 12235 { 12236 autoSelect: "always", 12237 placeholder: (0, import_i18n22.__)("Search"), 12238 className: "dataviews-filters__search-widget-filter-combobox__input" 12239 } 12240 ), 12241 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "dataviews-filters__search-widget-filter-combobox__icon", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_components19.Icon, { icon: search_default }) }) 12242 ] }), 12243 /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)( 12244 ComboboxList, 12245 { 12246 className: "dataviews-filters__search-widget-filter-combobox-list", 12247 alwaysVisible: true, 12248 children: [ 12249 matches.map((element) => { 12250 return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)( 12251 ComboboxItem, 12252 { 12253 resetValueOnSelect: false, 12254 value: element.value, 12255 className: "dataviews-filters__search-widget-listitem", 12256 hideOnClick: false, 12257 setValueOnClick: false, 12258 focusOnHover: true, 12259 children: [ 12260 filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12261 SingleSelectionOption, 12262 { 12263 selected: currentValue === element.value 12264 } 12265 ), 12266 !filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12267 MultiSelectionOption, 12268 { 12269 selected: currentValue.includes( 12270 element.value 12271 ) 12272 } 12273 ), 12274 /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)( 12275 "span", 12276 { 12277 className: "dataviews-filters__search-widget-listitem-value", 12278 title: element.label, 12279 children: [ 12280 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)( 12281 ComboboxItemValue, 12282 { 12283 className: "dataviews-filters__search-widget-filter-combobox-item-value", 12284 value: element.label 12285 } 12286 ), 12287 !!element.description && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "dataviews-filters__search-widget-listitem-description", children: element.description }) 12288 ] 12289 } 12290 ) 12291 ] 12292 }, 12293 element.value 12294 ); 12295 }), 12296 !matches.length && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("p", { children: (0, import_i18n22.__)("No results found") }) 12297 ] 12298 } 12299 ) 12300 ] 12301 } 12302 ); 12303 } 12304 function SearchWidget(props) { 12305 const { elements, isLoading } = useElements({ 12306 elements: props.filter.elements, 12307 getElements: props.filter.getElements 12308 }); 12309 if (isLoading) { 12310 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "dataviews-filters__search-widget-no-elements", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_components19.Spinner, {}) }); 12311 } 12312 if (elements.length === 0) { 12313 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "dataviews-filters__search-widget-no-elements", children: (0, import_i18n22.__)("No elements found") }); 12314 } 12315 const Widget = elements.length > 10 ? ComboboxList22 : ListBox; 12316 return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Widget, { ...props, filter: { ...props.filter, elements } }); 12317 } 12318 12319 // packages/dataviews/build-module/components/dataviews-filters/input-widget.mjs 12320 var import_es6 = __toESM(require_es6(), 1); 12321 var import_compose8 = __toESM(require_compose(), 1); 12322 var import_element44 = __toESM(require_element(), 1); 12323 var import_components20 = __toESM(require_components(), 1); 12324 var import_jsx_runtime72 = __toESM(require_jsx_runtime(), 1); 12325 function InputWidget({ 12326 filter, 12327 view, 12328 onChangeView, 12329 fields 12330 }) { 12331 const currentFilter = view.filters?.find( 12332 (f2) => f2.field === filter.field 12333 ); 12334 const currentValue = getCurrentValue(filter, currentFilter); 12335 const field = (0, import_element44.useMemo)(() => { 12336 const currentField = fields.find((f2) => f2.id === filter.field); 12337 if (currentField) { 12338 return { 12339 ...currentField, 12340 // Deactivate validation for filters. 12341 isValid: {}, 12342 // Filter controls are always enabled. 12343 isDisabled: () => false, 12344 // Filter controls are always visible. 12345 isVisible: () => true, 12346 // Configure getValue/setValue as if Item was a plain object. 12347 getValue: ({ item }) => item[currentField.id], 12348 setValue: ({ value }) => ({ 12349 [currentField.id]: value 12350 }) 12351 }; 12352 } 12353 return currentField; 12354 }, [fields, filter.field]); 12355 const data = (0, import_element44.useMemo)(() => { 12356 return (view.filters ?? []).reduce( 12357 (acc, activeFilter) => { 12358 acc[activeFilter.field] = activeFilter.value; 12359 return acc; 12360 }, 12361 {} 12362 ); 12363 }, [view.filters]); 12364 const handleChange = (0, import_compose8.useEvent)((updatedData) => { 12365 if (!field || !currentFilter) { 12366 return; 12367 } 12368 const nextValue = field.getValue({ item: updatedData }); 12369 if ((0, import_es6.default)(nextValue, currentValue)) { 12370 return; 12371 } 12372 onChangeView({ 12373 ...view, 12374 filters: (view.filters ?? []).map( 12375 (_filter) => _filter.field === filter.field ? { 12376 ..._filter, 12377 operator: currentFilter.operator || filter.operators[0], 12378 // Consider empty strings as undefined: 12379 // 12380 // - undefined as value means the filter is unset: the filter widget displays no value and the search returns all records 12381 // - empty string as value means "search empty string": returns only the records that have an empty string as value 12382 // 12383 // In practice, this means the filter will not be able to find an empty string as the value. 12384 value: nextValue === "" ? void 0 : nextValue 12385 } : _filter 12386 ) 12387 }); 12388 }); 12389 if (!field || !field.Edit || !currentFilter) { 12390 return null; 12391 } 12392 return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)( 12393 import_components20.Flex, 12394 { 12395 className: "dataviews-filters__user-input-widget", 12396 gap: 2.5, 12397 direction: "column", 12398 children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)( 12399 field.Edit, 12400 { 12401 hideLabelFromVision: true, 12402 data, 12403 field, 12404 operator: currentFilter.operator, 12405 onChange: handleChange 12406 } 12407 ) 12408 } 12409 ); 12410 } 12411 12412 // packages/dataviews/node_modules/date-fns/constants.js 12413 var daysInYear = 365.2425; 12414 var maxTime = Math.pow(10, 8) * 24 * 60 * 60 * 1e3; 12415 var minTime = -maxTime; 12416 var millisecondsInWeek = 6048e5; 12417 var millisecondsInDay = 864e5; 12418 var secondsInHour = 3600; 12419 var secondsInDay = secondsInHour * 24; 12420 var secondsInWeek = secondsInDay * 7; 12421 var secondsInYear = secondsInDay * daysInYear; 12422 var secondsInMonth = secondsInYear / 12; 12423 var secondsInQuarter = secondsInMonth * 3; 12424 var constructFromSymbol = /* @__PURE__ */ Symbol.for("constructDateFrom"); 12425 12426 // packages/dataviews/node_modules/date-fns/constructFrom.js 12427 function constructFrom(date, value) { 12428 if (typeof date === "function") return date(value); 12429 if (date && typeof date === "object" && constructFromSymbol in date) 12430 return date[constructFromSymbol](value); 12431 if (date instanceof Date) return new date.constructor(value); 12432 return new Date(value); 12433 } 12434 12435 // packages/dataviews/node_modules/date-fns/toDate.js 12436 function toDate(argument, context) { 12437 return constructFrom(context || argument, argument); 12438 } 12439 12440 // packages/dataviews/node_modules/date-fns/addDays.js 12441 function addDays(date, amount, options) { 12442 const _date = toDate(date, options?.in); 12443 if (isNaN(amount)) return constructFrom(options?.in || date, NaN); 12444 if (!amount) return _date; 12445 _date.setDate(_date.getDate() + amount); 12446 return _date; 12447 } 12448 12449 // packages/dataviews/node_modules/date-fns/addMonths.js 12450 function addMonths(date, amount, options) { 12451 const _date = toDate(date, options?.in); 12452 if (isNaN(amount)) return constructFrom(options?.in || date, NaN); 12453 if (!amount) { 12454 return _date; 12455 } 12456 const dayOfMonth = _date.getDate(); 12457 const endOfDesiredMonth = constructFrom(options?.in || date, _date.getTime()); 12458 endOfDesiredMonth.setMonth(_date.getMonth() + amount + 1, 0); 12459 const daysInMonth = endOfDesiredMonth.getDate(); 12460 if (dayOfMonth >= daysInMonth) { 12461 return endOfDesiredMonth; 12462 } else { 12463 _date.setFullYear( 12464 endOfDesiredMonth.getFullYear(), 12465 endOfDesiredMonth.getMonth(), 12466 dayOfMonth 12467 ); 12468 return _date; 12469 } 12470 } 12471 12472 // packages/dataviews/node_modules/date-fns/_lib/defaultOptions.js 12473 var defaultOptions = {}; 12474 function getDefaultOptions() { 12475 return defaultOptions; 12476 } 12477 12478 // packages/dataviews/node_modules/date-fns/startOfWeek.js 12479 function startOfWeek(date, options) { 12480 const defaultOptions2 = getDefaultOptions(); 12481 const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? defaultOptions2.weekStartsOn ?? defaultOptions2.locale?.options?.weekStartsOn ?? 0; 12482 const _date = toDate(date, options?.in); 12483 const day = _date.getDay(); 12484 const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn; 12485 _date.setDate(_date.getDate() - diff); 12486 _date.setHours(0, 0, 0, 0); 12487 return _date; 12488 } 12489 12490 // packages/dataviews/node_modules/date-fns/startOfISOWeek.js 12491 function startOfISOWeek(date, options) { 12492 return startOfWeek(date, { ...options, weekStartsOn: 1 }); 12493 } 12494 12495 // packages/dataviews/node_modules/date-fns/getISOWeekYear.js 12496 function getISOWeekYear(date, options) { 12497 const _date = toDate(date, options?.in); 12498 const year = _date.getFullYear(); 12499 const fourthOfJanuaryOfNextYear = constructFrom(_date, 0); 12500 fourthOfJanuaryOfNextYear.setFullYear(year + 1, 0, 4); 12501 fourthOfJanuaryOfNextYear.setHours(0, 0, 0, 0); 12502 const startOfNextYear = startOfISOWeek(fourthOfJanuaryOfNextYear); 12503 const fourthOfJanuaryOfThisYear = constructFrom(_date, 0); 12504 fourthOfJanuaryOfThisYear.setFullYear(year, 0, 4); 12505 fourthOfJanuaryOfThisYear.setHours(0, 0, 0, 0); 12506 const startOfThisYear = startOfISOWeek(fourthOfJanuaryOfThisYear); 12507 if (_date.getTime() >= startOfNextYear.getTime()) { 12508 return year + 1; 12509 } else if (_date.getTime() >= startOfThisYear.getTime()) { 12510 return year; 12511 } else { 12512 return year - 1; 12513 } 12514 } 12515 12516 // packages/dataviews/node_modules/date-fns/_lib/getTimezoneOffsetInMilliseconds.js 12517 function getTimezoneOffsetInMilliseconds(date) { 12518 const _date = toDate(date); 12519 const utcDate = new Date( 12520 Date.UTC( 12521 _date.getFullYear(), 12522 _date.getMonth(), 12523 _date.getDate(), 12524 _date.getHours(), 12525 _date.getMinutes(), 12526 _date.getSeconds(), 12527 _date.getMilliseconds() 12528 ) 12529 ); 12530 utcDate.setUTCFullYear(_date.getFullYear()); 12531 return +date - +utcDate; 12532 } 12533 12534 // packages/dataviews/node_modules/date-fns/_lib/normalizeDates.js 12535 function normalizeDates(context, ...dates) { 12536 const normalize = constructFrom.bind( 12537 null, 12538 context || dates.find((date) => typeof date === "object") 12539 ); 12540 return dates.map(normalize); 12541 } 12542 12543 // packages/dataviews/node_modules/date-fns/startOfDay.js 12544 function startOfDay(date, options) { 12545 const _date = toDate(date, options?.in); 12546 _date.setHours(0, 0, 0, 0); 12547 return _date; 12548 } 12549 12550 // packages/dataviews/node_modules/date-fns/differenceInCalendarDays.js 12551 function differenceInCalendarDays(laterDate, earlierDate, options) { 12552 const [laterDate_, earlierDate_] = normalizeDates( 12553 options?.in, 12554 laterDate, 12555 earlierDate 12556 ); 12557 const laterStartOfDay = startOfDay(laterDate_); 12558 const earlierStartOfDay = startOfDay(earlierDate_); 12559 const laterTimestamp = +laterStartOfDay - getTimezoneOffsetInMilliseconds(laterStartOfDay); 12560 const earlierTimestamp = +earlierStartOfDay - getTimezoneOffsetInMilliseconds(earlierStartOfDay); 12561 return Math.round((laterTimestamp - earlierTimestamp) / millisecondsInDay); 12562 } 12563 12564 // packages/dataviews/node_modules/date-fns/startOfISOWeekYear.js 12565 function startOfISOWeekYear(date, options) { 12566 const year = getISOWeekYear(date, options); 12567 const fourthOfJanuary = constructFrom(options?.in || date, 0); 12568 fourthOfJanuary.setFullYear(year, 0, 4); 12569 fourthOfJanuary.setHours(0, 0, 0, 0); 12570 return startOfISOWeek(fourthOfJanuary); 12571 } 12572 12573 // packages/dataviews/node_modules/date-fns/addWeeks.js 12574 function addWeeks(date, amount, options) { 12575 return addDays(date, amount * 7, options); 12576 } 12577 12578 // packages/dataviews/node_modules/date-fns/addYears.js 12579 function addYears(date, amount, options) { 12580 return addMonths(date, amount * 12, options); 12581 } 12582 12583 // packages/dataviews/node_modules/date-fns/isDate.js 12584 function isDate(value) { 12585 return value instanceof Date || typeof value === "object" && Object.prototype.toString.call(value) === "[object Date]"; 12586 } 12587 12588 // packages/dataviews/node_modules/date-fns/isValid.js 12589 function isValid(date) { 12590 return !(!isDate(date) && typeof date !== "number" || isNaN(+toDate(date))); 12591 } 12592 12593 // packages/dataviews/node_modules/date-fns/startOfMonth.js 12594 function startOfMonth(date, options) { 12595 const _date = toDate(date, options?.in); 12596 _date.setDate(1); 12597 _date.setHours(0, 0, 0, 0); 12598 return _date; 12599 } 12600 12601 // packages/dataviews/node_modules/date-fns/startOfYear.js 12602 function startOfYear(date, options) { 12603 const date_ = toDate(date, options?.in); 12604 date_.setFullYear(date_.getFullYear(), 0, 1); 12605 date_.setHours(0, 0, 0, 0); 12606 return date_; 12607 } 12608 12609 // packages/dataviews/node_modules/date-fns/locale/en-US/_lib/formatDistance.js 12610 var formatDistanceLocale = { 12611 lessThanXSeconds: { 12612 one: "less than a second", 12613 other: "less than {{count}} seconds" 12614 }, 12615 xSeconds: { 12616 one: "1 second", 12617 other: "{{count}} seconds" 12618 }, 12619 halfAMinute: "half a minute", 12620 lessThanXMinutes: { 12621 one: "less than a minute", 12622 other: "less than {{count}} minutes" 12623 }, 12624 xMinutes: { 12625 one: "1 minute", 12626 other: "{{count}} minutes" 12627 }, 12628 aboutXHours: { 12629 one: "about 1 hour", 12630 other: "about {{count}} hours" 12631 }, 12632 xHours: { 12633 one: "1 hour", 12634 other: "{{count}} hours" 12635 }, 12636 xDays: { 12637 one: "1 day", 12638 other: "{{count}} days" 12639 }, 12640 aboutXWeeks: { 12641 one: "about 1 week", 12642 other: "about {{count}} weeks" 12643 }, 12644 xWeeks: { 12645 one: "1 week", 12646 other: "{{count}} weeks" 12647 }, 12648 aboutXMonths: { 12649 one: "about 1 month", 12650 other: "about {{count}} months" 12651 }, 12652 xMonths: { 12653 one: "1 month", 12654 other: "{{count}} months" 12655 }, 12656 aboutXYears: { 12657 one: "about 1 year", 12658 other: "about {{count}} years" 12659 }, 12660 xYears: { 12661 one: "1 year", 12662 other: "{{count}} years" 12663 }, 12664 overXYears: { 12665 one: "over 1 year", 12666 other: "over {{count}} years" 12667 }, 12668 almostXYears: { 12669 one: "almost 1 year", 12670 other: "almost {{count}} years" 12671 } 12672 }; 12673 var formatDistance = (token, count, options) => { 12674 let result; 12675 const tokenValue = formatDistanceLocale[token]; 12676 if (typeof tokenValue === "string") { 12677 result = tokenValue; 12678 } else if (count === 1) { 12679 result = tokenValue.one; 12680 } else { 12681 result = tokenValue.other.replace("{{count}}", count.toString()); 12682 } 12683 if (options?.addSuffix) { 12684 if (options.comparison && options.comparison > 0) { 12685 return "in " + result; 12686 } else { 12687 return result + " ago"; 12688 } 12689 } 12690 return result; 12691 }; 12692 12693 // packages/dataviews/node_modules/date-fns/locale/_lib/buildFormatLongFn.js 12694 function buildFormatLongFn(args) { 12695 return (options = {}) => { 12696 const width = options.width ? String(options.width) : args.defaultWidth; 12697 const format6 = args.formats[width] || args.formats[args.defaultWidth]; 12698 return format6; 12699 }; 12700 } 12701 12702 // packages/dataviews/node_modules/date-fns/locale/en-US/_lib/formatLong.js 12703 var dateFormats = { 12704 full: "EEEE, MMMM do, y", 12705 long: "MMMM do, y", 12706 medium: "MMM d, y", 12707 short: "MM/dd/yyyy" 12708 }; 12709 var timeFormats = { 12710 full: "h:mm:ss a zzzz", 12711 long: "h:mm:ss a z", 12712 medium: "h:mm:ss a", 12713 short: "h:mm a" 12714 }; 12715 var dateTimeFormats = { 12716 full: "{{date}} 'at' {{time}}", 12717 long: "{{date}} 'at' {{time}}", 12718 medium: "{{date}}, {{time}}", 12719 short: "{{date}}, {{time}}" 12720 }; 12721 var formatLong = { 12722 date: buildFormatLongFn({ 12723 formats: dateFormats, 12724 defaultWidth: "full" 12725 }), 12726 time: buildFormatLongFn({ 12727 formats: timeFormats, 12728 defaultWidth: "full" 12729 }), 12730 dateTime: buildFormatLongFn({ 12731 formats: dateTimeFormats, 12732 defaultWidth: "full" 12733 }) 12734 }; 12735 12736 // packages/dataviews/node_modules/date-fns/locale/en-US/_lib/formatRelative.js 12737 var formatRelativeLocale = { 12738 lastWeek: "'last' eeee 'at' p", 12739 yesterday: "'yesterday at' p", 12740 today: "'today at' p", 12741 tomorrow: "'tomorrow at' p", 12742 nextWeek: "eeee 'at' p", 12743 other: "P" 12744 }; 12745 var formatRelative = (token, _date, _baseDate, _options) => formatRelativeLocale[token]; 12746 12747 // packages/dataviews/node_modules/date-fns/locale/_lib/buildLocalizeFn.js 12748 function buildLocalizeFn(args) { 12749 return (value, options) => { 12750 const context = options?.context ? String(options.context) : "standalone"; 12751 let valuesArray; 12752 if (context === "formatting" && args.formattingValues) { 12753 const defaultWidth = args.defaultFormattingWidth || args.defaultWidth; 12754 const width = options?.width ? String(options.width) : defaultWidth; 12755 valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth]; 12756 } else { 12757 const defaultWidth = args.defaultWidth; 12758 const width = options?.width ? String(options.width) : args.defaultWidth; 12759 valuesArray = args.values[width] || args.values[defaultWidth]; 12760 } 12761 const index = args.argumentCallback ? args.argumentCallback(value) : value; 12762 return valuesArray[index]; 12763 }; 12764 } 12765 12766 // packages/dataviews/node_modules/date-fns/locale/en-US/_lib/localize.js 12767 var eraValues = { 12768 narrow: ["B", "A"], 12769 abbreviated: ["BC", "AD"], 12770 wide: ["Before Christ", "Anno Domini"] 12771 }; 12772 var quarterValues = { 12773 narrow: ["1", "2", "3", "4"], 12774 abbreviated: ["Q1", "Q2", "Q3", "Q4"], 12775 wide: ["1st quarter", "2nd quarter", "3rd quarter", "4th quarter"] 12776 }; 12777 var monthValues = { 12778 narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"], 12779 abbreviated: [ 12780 "Jan", 12781 "Feb", 12782 "Mar", 12783 "Apr", 12784 "May", 12785 "Jun", 12786 "Jul", 12787 "Aug", 12788 "Sep", 12789 "Oct", 12790 "Nov", 12791 "Dec" 12792 ], 12793 wide: [ 12794 "January", 12795 "February", 12796 "March", 12797 "April", 12798 "May", 12799 "June", 12800 "July", 12801 "August", 12802 "September", 12803 "October", 12804 "November", 12805 "December" 12806 ] 12807 }; 12808 var dayValues = { 12809 narrow: ["S", "M", "T", "W", "T", "F", "S"], 12810 short: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], 12811 abbreviated: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], 12812 wide: [ 12813 "Sunday", 12814 "Monday", 12815 "Tuesday", 12816 "Wednesday", 12817 "Thursday", 12818 "Friday", 12819 "Saturday" 12820 ] 12821 }; 12822 var dayPeriodValues = { 12823 narrow: { 12824 am: "a", 12825 pm: "p", 12826 midnight: "mi", 12827 noon: "n", 12828 morning: "morning", 12829 afternoon: "afternoon", 12830 evening: "evening", 12831 night: "night" 12832 }, 12833 abbreviated: { 12834 am: "AM", 12835 pm: "PM", 12836 midnight: "midnight", 12837 noon: "noon", 12838 morning: "morning", 12839 afternoon: "afternoon", 12840 evening: "evening", 12841 night: "night" 12842 }, 12843 wide: { 12844 am: "a.m.", 12845 pm: "p.m.", 12846 midnight: "midnight", 12847 noon: "noon", 12848 morning: "morning", 12849 afternoon: "afternoon", 12850 evening: "evening", 12851 night: "night" 12852 } 12853 }; 12854 var formattingDayPeriodValues = { 12855 narrow: { 12856 am: "a", 12857 pm: "p", 12858 midnight: "mi", 12859 noon: "n", 12860 morning: "in the morning", 12861 afternoon: "in the afternoon", 12862 evening: "in the evening", 12863 night: "at night" 12864 }, 12865 abbreviated: { 12866 am: "AM", 12867 pm: "PM", 12868 midnight: "midnight", 12869 noon: "noon", 12870 morning: "in the morning", 12871 afternoon: "in the afternoon", 12872 evening: "in the evening", 12873 night: "at night" 12874 }, 12875 wide: { 12876 am: "a.m.", 12877 pm: "p.m.", 12878 midnight: "midnight", 12879 noon: "noon", 12880 morning: "in the morning", 12881 afternoon: "in the afternoon", 12882 evening: "in the evening", 12883 night: "at night" 12884 } 12885 }; 12886 var ordinalNumber = (dirtyNumber, _options) => { 12887 const number = Number(dirtyNumber); 12888 const rem100 = number % 100; 12889 if (rem100 > 20 || rem100 < 10) { 12890 switch (rem100 % 10) { 12891 case 1: 12892 return number + "st"; 12893 case 2: 12894 return number + "nd"; 12895 case 3: 12896 return number + "rd"; 12897 } 12898 } 12899 return number + "th"; 12900 }; 12901 var localize = { 12902 ordinalNumber, 12903 era: buildLocalizeFn({ 12904 values: eraValues, 12905 defaultWidth: "wide" 12906 }), 12907 quarter: buildLocalizeFn({ 12908 values: quarterValues, 12909 defaultWidth: "wide", 12910 argumentCallback: (quarter) => quarter - 1 12911 }), 12912 month: buildLocalizeFn({ 12913 values: monthValues, 12914 defaultWidth: "wide" 12915 }), 12916 day: buildLocalizeFn({ 12917 values: dayValues, 12918 defaultWidth: "wide" 12919 }), 12920 dayPeriod: buildLocalizeFn({ 12921 values: dayPeriodValues, 12922 defaultWidth: "wide", 12923 formattingValues: formattingDayPeriodValues, 12924 defaultFormattingWidth: "wide" 12925 }) 12926 }; 12927 12928 // packages/dataviews/node_modules/date-fns/locale/_lib/buildMatchFn.js 12929 function buildMatchFn(args) { 12930 return (string, options = {}) => { 12931 const width = options.width; 12932 const matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth]; 12933 const matchResult = string.match(matchPattern); 12934 if (!matchResult) { 12935 return null; 12936 } 12937 const matchedString = matchResult[0]; 12938 const parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth]; 12939 const key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, (pattern) => pattern.test(matchedString)) : ( 12940 // [TODO] -- I challenge you to fix the type 12941 findKey(parsePatterns, (pattern) => pattern.test(matchedString)) 12942 ); 12943 let value; 12944 value = args.valueCallback ? args.valueCallback(key) : key; 12945 value = options.valueCallback ? ( 12946 // [TODO] -- I challenge you to fix the type 12947 options.valueCallback(value) 12948 ) : value; 12949 const rest = string.slice(matchedString.length); 12950 return { value, rest }; 12951 }; 12952 } 12953 function findKey(object, predicate) { 12954 for (const key in object) { 12955 if (Object.prototype.hasOwnProperty.call(object, key) && predicate(object[key])) { 12956 return key; 12957 } 12958 } 12959 return void 0; 12960 } 12961 function findIndex(array, predicate) { 12962 for (let key = 0; key < array.length; key++) { 12963 if (predicate(array[key])) { 12964 return key; 12965 } 12966 } 12967 return void 0; 12968 } 12969 12970 // packages/dataviews/node_modules/date-fns/locale/_lib/buildMatchPatternFn.js 12971 function buildMatchPatternFn(args) { 12972 return (string, options = {}) => { 12973 const matchResult = string.match(args.matchPattern); 12974 if (!matchResult) return null; 12975 const matchedString = matchResult[0]; 12976 const parseResult = string.match(args.parsePattern); 12977 if (!parseResult) return null; 12978 let value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0]; 12979 value = options.valueCallback ? options.valueCallback(value) : value; 12980 const rest = string.slice(matchedString.length); 12981 return { value, rest }; 12982 }; 12983 } 12984 12985 // packages/dataviews/node_modules/date-fns/locale/en-US/_lib/match.js 12986 var matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i; 12987 var parseOrdinalNumberPattern = /\d+/i; 12988 var matchEraPatterns = { 12989 narrow: /^(b|a)/i, 12990 abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i, 12991 wide: /^(before christ|before common era|anno domini|common era)/i 12992 }; 12993 var parseEraPatterns = { 12994 any: [/^b/i, /^(a|c)/i] 12995 }; 12996 var matchQuarterPatterns = { 12997 narrow: /^[1234]/i, 12998 abbreviated: /^q[1234]/i, 12999 wide: /^[1234](th|st|nd|rd)? quarter/i 13000 }; 13001 var parseQuarterPatterns = { 13002 any: [/1/i, /2/i, /3/i, /4/i] 13003 }; 13004 var matchMonthPatterns = { 13005 narrow: /^[jfmasond]/i, 13006 abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i, 13007 wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i 13008 }; 13009 var parseMonthPatterns = { 13010 narrow: [ 13011 /^j/i, 13012 /^f/i, 13013 /^m/i, 13014 /^a/i, 13015 /^m/i, 13016 /^j/i, 13017 /^j/i, 13018 /^a/i, 13019 /^s/i, 13020 /^o/i, 13021 /^n/i, 13022 /^d/i 13023 ], 13024 any: [ 13025 /^ja/i, 13026 /^f/i, 13027 /^mar/i, 13028 /^ap/i, 13029 /^may/i, 13030 /^jun/i, 13031 /^jul/i, 13032 /^au/i, 13033 /^s/i, 13034 /^o/i, 13035 /^n/i, 13036 /^d/i 13037 ] 13038 }; 13039 var matchDayPatterns = { 13040 narrow: /^[smtwf]/i, 13041 short: /^(su|mo|tu|we|th|fr|sa)/i, 13042 abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i, 13043 wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i 13044 }; 13045 var parseDayPatterns = { 13046 narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i], 13047 any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i] 13048 }; 13049 var matchDayPeriodPatterns = { 13050 narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i, 13051 any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i 13052 }; 13053 var parseDayPeriodPatterns = { 13054 any: { 13055 am: /^a/i, 13056 pm: /^p/i, 13057 midnight: /^mi/i, 13058 noon: /^no/i, 13059 morning: /morning/i, 13060 afternoon: /afternoon/i, 13061 evening: /evening/i, 13062 night: /night/i 13063 } 13064 }; 13065 var match = { 13066 ordinalNumber: buildMatchPatternFn({ 13067 matchPattern: matchOrdinalNumberPattern, 13068 parsePattern: parseOrdinalNumberPattern, 13069 valueCallback: (value) => parseInt(value, 10) 13070 }), 13071 era: buildMatchFn({ 13072 matchPatterns: matchEraPatterns, 13073 defaultMatchWidth: "wide", 13074 parsePatterns: parseEraPatterns, 13075 defaultParseWidth: "any" 13076 }), 13077 quarter: buildMatchFn({ 13078 matchPatterns: matchQuarterPatterns, 13079 defaultMatchWidth: "wide", 13080 parsePatterns: parseQuarterPatterns, 13081 defaultParseWidth: "any", 13082 valueCallback: (index) => index + 1 13083 }), 13084 month: buildMatchFn({ 13085 matchPatterns: matchMonthPatterns, 13086 defaultMatchWidth: "wide", 13087 parsePatterns: parseMonthPatterns, 13088 defaultParseWidth: "any" 13089 }), 13090 day: buildMatchFn({ 13091 matchPatterns: matchDayPatterns, 13092 defaultMatchWidth: "wide", 13093 parsePatterns: parseDayPatterns, 13094 defaultParseWidth: "any" 13095 }), 13096 dayPeriod: buildMatchFn({ 13097 matchPatterns: matchDayPeriodPatterns, 13098 defaultMatchWidth: "any", 13099 parsePatterns: parseDayPeriodPatterns, 13100 defaultParseWidth: "any" 13101 }) 13102 }; 13103 13104 // packages/dataviews/node_modules/date-fns/locale/en-US.js 13105 var enUS = { 13106 code: "en-US", 13107 formatDistance, 13108 formatLong, 13109 formatRelative, 13110 localize, 13111 match, 13112 options: { 13113 weekStartsOn: 0, 13114 firstWeekContainsDate: 1 13115 } 13116 }; 13117 13118 // packages/dataviews/node_modules/date-fns/getDayOfYear.js 13119 function getDayOfYear(date, options) { 13120 const _date = toDate(date, options?.in); 13121 const diff = differenceInCalendarDays(_date, startOfYear(_date)); 13122 const dayOfYear = diff + 1; 13123 return dayOfYear; 13124 } 13125 13126 // packages/dataviews/node_modules/date-fns/getISOWeek.js 13127 function getISOWeek(date, options) { 13128 const _date = toDate(date, options?.in); 13129 const diff = +startOfISOWeek(_date) - +startOfISOWeekYear(_date); 13130 return Math.round(diff / millisecondsInWeek) + 1; 13131 } 13132 13133 // packages/dataviews/node_modules/date-fns/getWeekYear.js 13134 function getWeekYear(date, options) { 13135 const _date = toDate(date, options?.in); 13136 const year = _date.getFullYear(); 13137 const defaultOptions2 = getDefaultOptions(); 13138 const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; 13139 const firstWeekOfNextYear = constructFrom(options?.in || date, 0); 13140 firstWeekOfNextYear.setFullYear(year + 1, 0, firstWeekContainsDate); 13141 firstWeekOfNextYear.setHours(0, 0, 0, 0); 13142 const startOfNextYear = startOfWeek(firstWeekOfNextYear, options); 13143 const firstWeekOfThisYear = constructFrom(options?.in || date, 0); 13144 firstWeekOfThisYear.setFullYear(year, 0, firstWeekContainsDate); 13145 firstWeekOfThisYear.setHours(0, 0, 0, 0); 13146 const startOfThisYear = startOfWeek(firstWeekOfThisYear, options); 13147 if (+_date >= +startOfNextYear) { 13148 return year + 1; 13149 } else if (+_date >= +startOfThisYear) { 13150 return year; 13151 } else { 13152 return year - 1; 13153 } 13154 } 13155 13156 // packages/dataviews/node_modules/date-fns/startOfWeekYear.js 13157 function startOfWeekYear(date, options) { 13158 const defaultOptions2 = getDefaultOptions(); 13159 const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; 13160 const year = getWeekYear(date, options); 13161 const firstWeek = constructFrom(options?.in || date, 0); 13162 firstWeek.setFullYear(year, 0, firstWeekContainsDate); 13163 firstWeek.setHours(0, 0, 0, 0); 13164 const _date = startOfWeek(firstWeek, options); 13165 return _date; 13166 } 13167 13168 // packages/dataviews/node_modules/date-fns/getWeek.js 13169 function getWeek(date, options) { 13170 const _date = toDate(date, options?.in); 13171 const diff = +startOfWeek(_date, options) - +startOfWeekYear(_date, options); 13172 return Math.round(diff / millisecondsInWeek) + 1; 13173 } 13174 13175 // packages/dataviews/node_modules/date-fns/_lib/addLeadingZeros.js 13176 function addLeadingZeros(number, targetLength) { 13177 const sign = number < 0 ? "-" : ""; 13178 const output = Math.abs(number).toString().padStart(targetLength, "0"); 13179 return sign + output; 13180 } 13181 13182 // packages/dataviews/node_modules/date-fns/_lib/format/lightFormatters.js 13183 var lightFormatters = { 13184 // Year 13185 y(date, token) { 13186 const signedYear = date.getFullYear(); 13187 const year = signedYear > 0 ? signedYear : 1 - signedYear; 13188 return addLeadingZeros(token === "yy" ? year % 100 : year, token.length); 13189 }, 13190 // Month 13191 M(date, token) { 13192 const month = date.getMonth(); 13193 return token === "M" ? String(month + 1) : addLeadingZeros(month + 1, 2); 13194 }, 13195 // Day of the month 13196 d(date, token) { 13197 return addLeadingZeros(date.getDate(), token.length); 13198 }, 13199 // AM or PM 13200 a(date, token) { 13201 const dayPeriodEnumValue = date.getHours() / 12 >= 1 ? "pm" : "am"; 13202 switch (token) { 13203 case "a": 13204 case "aa": 13205 return dayPeriodEnumValue.toUpperCase(); 13206 case "aaa": 13207 return dayPeriodEnumValue; 13208 case "aaaaa": 13209 return dayPeriodEnumValue[0]; 13210 case "aaaa": 13211 default: 13212 return dayPeriodEnumValue === "am" ? "a.m." : "p.m."; 13213 } 13214 }, 13215 // Hour [1-12] 13216 h(date, token) { 13217 return addLeadingZeros(date.getHours() % 12 || 12, token.length); 13218 }, 13219 // Hour [0-23] 13220 H(date, token) { 13221 return addLeadingZeros(date.getHours(), token.length); 13222 }, 13223 // Minute 13224 m(date, token) { 13225 return addLeadingZeros(date.getMinutes(), token.length); 13226 }, 13227 // Second 13228 s(date, token) { 13229 return addLeadingZeros(date.getSeconds(), token.length); 13230 }, 13231 // Fraction of second 13232 S(date, token) { 13233 const numberOfDigits = token.length; 13234 const milliseconds = date.getMilliseconds(); 13235 const fractionalSeconds = Math.trunc( 13236 milliseconds * Math.pow(10, numberOfDigits - 3) 13237 ); 13238 return addLeadingZeros(fractionalSeconds, token.length); 13239 } 13240 }; 13241 13242 // packages/dataviews/node_modules/date-fns/_lib/format/formatters.js 13243 var dayPeriodEnum = { 13244 am: "am", 13245 pm: "pm", 13246 midnight: "midnight", 13247 noon: "noon", 13248 morning: "morning", 13249 afternoon: "afternoon", 13250 evening: "evening", 13251 night: "night" 13252 }; 13253 var formatters = { 13254 // Era 13255 G: function(date, token, localize2) { 13256 const era = date.getFullYear() > 0 ? 1 : 0; 13257 switch (token) { 13258 // AD, BC 13259 case "G": 13260 case "GG": 13261 case "GGG": 13262 return localize2.era(era, { width: "abbreviated" }); 13263 // A, B 13264 case "GGGGG": 13265 return localize2.era(era, { width: "narrow" }); 13266 // Anno Domini, Before Christ 13267 case "GGGG": 13268 default: 13269 return localize2.era(era, { width: "wide" }); 13270 } 13271 }, 13272 // Year 13273 y: function(date, token, localize2) { 13274 if (token === "yo") { 13275 const signedYear = date.getFullYear(); 13276 const year = signedYear > 0 ? signedYear : 1 - signedYear; 13277 return localize2.ordinalNumber(year, { unit: "year" }); 13278 } 13279 return lightFormatters.y(date, token); 13280 }, 13281 // Local week-numbering year 13282 Y: function(date, token, localize2, options) { 13283 const signedWeekYear = getWeekYear(date, options); 13284 const weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear; 13285 if (token === "YY") { 13286 const twoDigitYear = weekYear % 100; 13287 return addLeadingZeros(twoDigitYear, 2); 13288 } 13289 if (token === "Yo") { 13290 return localize2.ordinalNumber(weekYear, { unit: "year" }); 13291 } 13292 return addLeadingZeros(weekYear, token.length); 13293 }, 13294 // ISO week-numbering year 13295 R: function(date, token) { 13296 const isoWeekYear = getISOWeekYear(date); 13297 return addLeadingZeros(isoWeekYear, token.length); 13298 }, 13299 // Extended year. This is a single number designating the year of this calendar system. 13300 // The main difference between `y` and `u` localizers are B.C. years: 13301 // | Year | `y` | `u` | 13302 // |------|-----|-----| 13303 // | AC 1 | 1 | 1 | 13304 // | BC 1 | 1 | 0 | 13305 // | BC 2 | 2 | -1 | 13306 // Also `yy` always returns the last two digits of a year, 13307 // while `uu` pads single digit years to 2 characters and returns other years unchanged. 13308 u: function(date, token) { 13309 const year = date.getFullYear(); 13310 return addLeadingZeros(year, token.length); 13311 }, 13312 // Quarter 13313 Q: function(date, token, localize2) { 13314 const quarter = Math.ceil((date.getMonth() + 1) / 3); 13315 switch (token) { 13316 // 1, 2, 3, 4 13317 case "Q": 13318 return String(quarter); 13319 // 01, 02, 03, 04 13320 case "QQ": 13321 return addLeadingZeros(quarter, 2); 13322 // 1st, 2nd, 3rd, 4th 13323 case "Qo": 13324 return localize2.ordinalNumber(quarter, { unit: "quarter" }); 13325 // Q1, Q2, Q3, Q4 13326 case "QQQ": 13327 return localize2.quarter(quarter, { 13328 width: "abbreviated", 13329 context: "formatting" 13330 }); 13331 // 1, 2, 3, 4 (narrow quarter; could be not numerical) 13332 case "QQQQQ": 13333 return localize2.quarter(quarter, { 13334 width: "narrow", 13335 context: "formatting" 13336 }); 13337 // 1st quarter, 2nd quarter, ... 13338 case "QQQQ": 13339 default: 13340 return localize2.quarter(quarter, { 13341 width: "wide", 13342 context: "formatting" 13343 }); 13344 } 13345 }, 13346 // Stand-alone quarter 13347 q: function(date, token, localize2) { 13348 const quarter = Math.ceil((date.getMonth() + 1) / 3); 13349 switch (token) { 13350 // 1, 2, 3, 4 13351 case "q": 13352 return String(quarter); 13353 // 01, 02, 03, 04 13354 case "qq": 13355 return addLeadingZeros(quarter, 2); 13356 // 1st, 2nd, 3rd, 4th 13357 case "qo": 13358 return localize2.ordinalNumber(quarter, { unit: "quarter" }); 13359 // Q1, Q2, Q3, Q4 13360 case "qqq": 13361 return localize2.quarter(quarter, { 13362 width: "abbreviated", 13363 context: "standalone" 13364 }); 13365 // 1, 2, 3, 4 (narrow quarter; could be not numerical) 13366 case "qqqqq": 13367 return localize2.quarter(quarter, { 13368 width: "narrow", 13369 context: "standalone" 13370 }); 13371 // 1st quarter, 2nd quarter, ... 13372 case "qqqq": 13373 default: 13374 return localize2.quarter(quarter, { 13375 width: "wide", 13376 context: "standalone" 13377 }); 13378 } 13379 }, 13380 // Month 13381 M: function(date, token, localize2) { 13382 const month = date.getMonth(); 13383 switch (token) { 13384 case "M": 13385 case "MM": 13386 return lightFormatters.M(date, token); 13387 // 1st, 2nd, ..., 12th 13388 case "Mo": 13389 return localize2.ordinalNumber(month + 1, { unit: "month" }); 13390 // Jan, Feb, ..., Dec 13391 case "MMM": 13392 return localize2.month(month, { 13393 width: "abbreviated", 13394 context: "formatting" 13395 }); 13396 // J, F, ..., D 13397 case "MMMMM": 13398 return localize2.month(month, { 13399 width: "narrow", 13400 context: "formatting" 13401 }); 13402 // January, February, ..., December 13403 case "MMMM": 13404 default: 13405 return localize2.month(month, { width: "wide", context: "formatting" }); 13406 } 13407 }, 13408 // Stand-alone month 13409 L: function(date, token, localize2) { 13410 const month = date.getMonth(); 13411 switch (token) { 13412 // 1, 2, ..., 12 13413 case "L": 13414 return String(month + 1); 13415 // 01, 02, ..., 12 13416 case "LL": 13417 return addLeadingZeros(month + 1, 2); 13418 // 1st, 2nd, ..., 12th 13419 case "Lo": 13420 return localize2.ordinalNumber(month + 1, { unit: "month" }); 13421 // Jan, Feb, ..., Dec 13422 case "LLL": 13423 return localize2.month(month, { 13424 width: "abbreviated", 13425 context: "standalone" 13426 }); 13427 // J, F, ..., D 13428 case "LLLLL": 13429 return localize2.month(month, { 13430 width: "narrow", 13431 context: "standalone" 13432 }); 13433 // January, February, ..., December 13434 case "LLLL": 13435 default: 13436 return localize2.month(month, { width: "wide", context: "standalone" }); 13437 } 13438 }, 13439 // Local week of year 13440 w: function(date, token, localize2, options) { 13441 const week = getWeek(date, options); 13442 if (token === "wo") { 13443 return localize2.ordinalNumber(week, { unit: "week" }); 13444 } 13445 return addLeadingZeros(week, token.length); 13446 }, 13447 // ISO week of year 13448 I: function(date, token, localize2) { 13449 const isoWeek = getISOWeek(date); 13450 if (token === "Io") { 13451 return localize2.ordinalNumber(isoWeek, { unit: "week" }); 13452 } 13453 return addLeadingZeros(isoWeek, token.length); 13454 }, 13455 // Day of the month 13456 d: function(date, token, localize2) { 13457 if (token === "do") { 13458 return localize2.ordinalNumber(date.getDate(), { unit: "date" }); 13459 } 13460 return lightFormatters.d(date, token); 13461 }, 13462 // Day of year 13463 D: function(date, token, localize2) { 13464 const dayOfYear = getDayOfYear(date); 13465 if (token === "Do") { 13466 return localize2.ordinalNumber(dayOfYear, { unit: "dayOfYear" }); 13467 } 13468 return addLeadingZeros(dayOfYear, token.length); 13469 }, 13470 // Day of week 13471 E: function(date, token, localize2) { 13472 const dayOfWeek = date.getDay(); 13473 switch (token) { 13474 // Tue 13475 case "E": 13476 case "EE": 13477 case "EEE": 13478 return localize2.day(dayOfWeek, { 13479 width: "abbreviated", 13480 context: "formatting" 13481 }); 13482 // T 13483 case "EEEEE": 13484 return localize2.day(dayOfWeek, { 13485 width: "narrow", 13486 context: "formatting" 13487 }); 13488 // Tu 13489 case "EEEEEE": 13490 return localize2.day(dayOfWeek, { 13491 width: "short", 13492 context: "formatting" 13493 }); 13494 // Tuesday 13495 case "EEEE": 13496 default: 13497 return localize2.day(dayOfWeek, { 13498 width: "wide", 13499 context: "formatting" 13500 }); 13501 } 13502 }, 13503 // Local day of week 13504 e: function(date, token, localize2, options) { 13505 const dayOfWeek = date.getDay(); 13506 const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7; 13507 switch (token) { 13508 // Numerical value (Nth day of week with current locale or weekStartsOn) 13509 case "e": 13510 return String(localDayOfWeek); 13511 // Padded numerical value 13512 case "ee": 13513 return addLeadingZeros(localDayOfWeek, 2); 13514 // 1st, 2nd, ..., 7th 13515 case "eo": 13516 return localize2.ordinalNumber(localDayOfWeek, { unit: "day" }); 13517 case "eee": 13518 return localize2.day(dayOfWeek, { 13519 width: "abbreviated", 13520 context: "formatting" 13521 }); 13522 // T 13523 case "eeeee": 13524 return localize2.day(dayOfWeek, { 13525 width: "narrow", 13526 context: "formatting" 13527 }); 13528 // Tu 13529 case "eeeeee": 13530 return localize2.day(dayOfWeek, { 13531 width: "short", 13532 context: "formatting" 13533 }); 13534 // Tuesday 13535 case "eeee": 13536 default: 13537 return localize2.day(dayOfWeek, { 13538 width: "wide", 13539 context: "formatting" 13540 }); 13541 } 13542 }, 13543 // Stand-alone local day of week 13544 c: function(date, token, localize2, options) { 13545 const dayOfWeek = date.getDay(); 13546 const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7; 13547 switch (token) { 13548 // Numerical value (same as in `e`) 13549 case "c": 13550 return String(localDayOfWeek); 13551 // Padded numerical value 13552 case "cc": 13553 return addLeadingZeros(localDayOfWeek, token.length); 13554 // 1st, 2nd, ..., 7th 13555 case "co": 13556 return localize2.ordinalNumber(localDayOfWeek, { unit: "day" }); 13557 case "ccc": 13558 return localize2.day(dayOfWeek, { 13559 width: "abbreviated", 13560 context: "standalone" 13561 }); 13562 // T 13563 case "ccccc": 13564 return localize2.day(dayOfWeek, { 13565 width: "narrow", 13566 context: "standalone" 13567 }); 13568 // Tu 13569 case "cccccc": 13570 return localize2.day(dayOfWeek, { 13571 width: "short", 13572 context: "standalone" 13573 }); 13574 // Tuesday 13575 case "cccc": 13576 default: 13577 return localize2.day(dayOfWeek, { 13578 width: "wide", 13579 context: "standalone" 13580 }); 13581 } 13582 }, 13583 // ISO day of week 13584 i: function(date, token, localize2) { 13585 const dayOfWeek = date.getDay(); 13586 const isoDayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek; 13587 switch (token) { 13588 // 2 13589 case "i": 13590 return String(isoDayOfWeek); 13591 // 02 13592 case "ii": 13593 return addLeadingZeros(isoDayOfWeek, token.length); 13594 // 2nd 13595 case "io": 13596 return localize2.ordinalNumber(isoDayOfWeek, { unit: "day" }); 13597 // Tue 13598 case "iii": 13599 return localize2.day(dayOfWeek, { 13600 width: "abbreviated", 13601 context: "formatting" 13602 }); 13603 // T 13604 case "iiiii": 13605 return localize2.day(dayOfWeek, { 13606 width: "narrow", 13607 context: "formatting" 13608 }); 13609 // Tu 13610 case "iiiiii": 13611 return localize2.day(dayOfWeek, { 13612 width: "short", 13613 context: "formatting" 13614 }); 13615 // Tuesday 13616 case "iiii": 13617 default: 13618 return localize2.day(dayOfWeek, { 13619 width: "wide", 13620 context: "formatting" 13621 }); 13622 } 13623 }, 13624 // AM or PM 13625 a: function(date, token, localize2) { 13626 const hours = date.getHours(); 13627 const dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am"; 13628 switch (token) { 13629 case "a": 13630 case "aa": 13631 return localize2.dayPeriod(dayPeriodEnumValue, { 13632 width: "abbreviated", 13633 context: "formatting" 13634 }); 13635 case "aaa": 13636 return localize2.dayPeriod(dayPeriodEnumValue, { 13637 width: "abbreviated", 13638 context: "formatting" 13639 }).toLowerCase(); 13640 case "aaaaa": 13641 return localize2.dayPeriod(dayPeriodEnumValue, { 13642 width: "narrow", 13643 context: "formatting" 13644 }); 13645 case "aaaa": 13646 default: 13647 return localize2.dayPeriod(dayPeriodEnumValue, { 13648 width: "wide", 13649 context: "formatting" 13650 }); 13651 } 13652 }, 13653 // AM, PM, midnight, noon 13654 b: function(date, token, localize2) { 13655 const hours = date.getHours(); 13656 let dayPeriodEnumValue; 13657 if (hours === 12) { 13658 dayPeriodEnumValue = dayPeriodEnum.noon; 13659 } else if (hours === 0) { 13660 dayPeriodEnumValue = dayPeriodEnum.midnight; 13661 } else { 13662 dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am"; 13663 } 13664 switch (token) { 13665 case "b": 13666 case "bb": 13667 return localize2.dayPeriod(dayPeriodEnumValue, { 13668 width: "abbreviated", 13669 context: "formatting" 13670 }); 13671 case "bbb": 13672 return localize2.dayPeriod(dayPeriodEnumValue, { 13673 width: "abbreviated", 13674 context: "formatting" 13675 }).toLowerCase(); 13676 case "bbbbb": 13677 return localize2.dayPeriod(dayPeriodEnumValue, { 13678 width: "narrow", 13679 context: "formatting" 13680 }); 13681 case "bbbb": 13682 default: 13683 return localize2.dayPeriod(dayPeriodEnumValue, { 13684 width: "wide", 13685 context: "formatting" 13686 }); 13687 } 13688 }, 13689 // in the morning, in the afternoon, in the evening, at night 13690 B: function(date, token, localize2) { 13691 const hours = date.getHours(); 13692 let dayPeriodEnumValue; 13693 if (hours >= 17) { 13694 dayPeriodEnumValue = dayPeriodEnum.evening; 13695 } else if (hours >= 12) { 13696 dayPeriodEnumValue = dayPeriodEnum.afternoon; 13697 } else if (hours >= 4) { 13698 dayPeriodEnumValue = dayPeriodEnum.morning; 13699 } else { 13700 dayPeriodEnumValue = dayPeriodEnum.night; 13701 } 13702 switch (token) { 13703 case "B": 13704 case "BB": 13705 case "BBB": 13706 return localize2.dayPeriod(dayPeriodEnumValue, { 13707 width: "abbreviated", 13708 context: "formatting" 13709 }); 13710 case "BBBBB": 13711 return localize2.dayPeriod(dayPeriodEnumValue, { 13712 width: "narrow", 13713 context: "formatting" 13714 }); 13715 case "BBBB": 13716 default: 13717 return localize2.dayPeriod(dayPeriodEnumValue, { 13718 width: "wide", 13719 context: "formatting" 13720 }); 13721 } 13722 }, 13723 // Hour [1-12] 13724 h: function(date, token, localize2) { 13725 if (token === "ho") { 13726 let hours = date.getHours() % 12; 13727 if (hours === 0) hours = 12; 13728 return localize2.ordinalNumber(hours, { unit: "hour" }); 13729 } 13730 return lightFormatters.h(date, token); 13731 }, 13732 // Hour [0-23] 13733 H: function(date, token, localize2) { 13734 if (token === "Ho") { 13735 return localize2.ordinalNumber(date.getHours(), { unit: "hour" }); 13736 } 13737 return lightFormatters.H(date, token); 13738 }, 13739 // Hour [0-11] 13740 K: function(date, token, localize2) { 13741 const hours = date.getHours() % 12; 13742 if (token === "Ko") { 13743 return localize2.ordinalNumber(hours, { unit: "hour" }); 13744 } 13745 return addLeadingZeros(hours, token.length); 13746 }, 13747 // Hour [1-24] 13748 k: function(date, token, localize2) { 13749 let hours = date.getHours(); 13750 if (hours === 0) hours = 24; 13751 if (token === "ko") { 13752 return localize2.ordinalNumber(hours, { unit: "hour" }); 13753 } 13754 return addLeadingZeros(hours, token.length); 13755 }, 13756 // Minute 13757 m: function(date, token, localize2) { 13758 if (token === "mo") { 13759 return localize2.ordinalNumber(date.getMinutes(), { unit: "minute" }); 13760 } 13761 return lightFormatters.m(date, token); 13762 }, 13763 // Second 13764 s: function(date, token, localize2) { 13765 if (token === "so") { 13766 return localize2.ordinalNumber(date.getSeconds(), { unit: "second" }); 13767 } 13768 return lightFormatters.s(date, token); 13769 }, 13770 // Fraction of second 13771 S: function(date, token) { 13772 return lightFormatters.S(date, token); 13773 }, 13774 // Timezone (ISO-8601. If offset is 0, output is always `'Z'`) 13775 X: function(date, token, _localize) { 13776 const timezoneOffset = date.getTimezoneOffset(); 13777 if (timezoneOffset === 0) { 13778 return "Z"; 13779 } 13780 switch (token) { 13781 // Hours and optional minutes 13782 case "X": 13783 return formatTimezoneWithOptionalMinutes(timezoneOffset); 13784 // Hours, minutes and optional seconds without `:` delimiter 13785 // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets 13786 // so this token always has the same output as `XX` 13787 case "XXXX": 13788 case "XX": 13789 return formatTimezone(timezoneOffset); 13790 // Hours, minutes and optional seconds with `:` delimiter 13791 // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets 13792 // so this token always has the same output as `XXX` 13793 case "XXXXX": 13794 case "XXX": 13795 // Hours and minutes with `:` delimiter 13796 default: 13797 return formatTimezone(timezoneOffset, ":"); 13798 } 13799 }, 13800 // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent) 13801 x: function(date, token, _localize) { 13802 const timezoneOffset = date.getTimezoneOffset(); 13803 switch (token) { 13804 // Hours and optional minutes 13805 case "x": 13806 return formatTimezoneWithOptionalMinutes(timezoneOffset); 13807 // Hours, minutes and optional seconds without `:` delimiter 13808 // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets 13809 // so this token always has the same output as `xx` 13810 case "xxxx": 13811 case "xx": 13812 return formatTimezone(timezoneOffset); 13813 // Hours, minutes and optional seconds with `:` delimiter 13814 // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets 13815 // so this token always has the same output as `xxx` 13816 case "xxxxx": 13817 case "xxx": 13818 // Hours and minutes with `:` delimiter 13819 default: 13820 return formatTimezone(timezoneOffset, ":"); 13821 } 13822 }, 13823 // Timezone (GMT) 13824 O: function(date, token, _localize) { 13825 const timezoneOffset = date.getTimezoneOffset(); 13826 switch (token) { 13827 // Short 13828 case "O": 13829 case "OO": 13830 case "OOO": 13831 return "GMT" + formatTimezoneShort(timezoneOffset, ":"); 13832 // Long 13833 case "OOOO": 13834 default: 13835 return "GMT" + formatTimezone(timezoneOffset, ":"); 13836 } 13837 }, 13838 // Timezone (specific non-location) 13839 z: function(date, token, _localize) { 13840 const timezoneOffset = date.getTimezoneOffset(); 13841 switch (token) { 13842 // Short 13843 case "z": 13844 case "zz": 13845 case "zzz": 13846 return "GMT" + formatTimezoneShort(timezoneOffset, ":"); 13847 // Long 13848 case "zzzz": 13849 default: 13850 return "GMT" + formatTimezone(timezoneOffset, ":"); 13851 } 13852 }, 13853 // Seconds timestamp 13854 t: function(date, token, _localize) { 13855 const timestamp = Math.trunc(+date / 1e3); 13856 return addLeadingZeros(timestamp, token.length); 13857 }, 13858 // Milliseconds timestamp 13859 T: function(date, token, _localize) { 13860 return addLeadingZeros(+date, token.length); 13861 } 13862 }; 13863 function formatTimezoneShort(offset, delimiter = "") { 13864 const sign = offset > 0 ? "-" : "+"; 13865 const absOffset = Math.abs(offset); 13866 const hours = Math.trunc(absOffset / 60); 13867 const minutes = absOffset % 60; 13868 if (minutes === 0) { 13869 return sign + String(hours); 13870 } 13871 return sign + String(hours) + delimiter + addLeadingZeros(minutes, 2); 13872 } 13873 function formatTimezoneWithOptionalMinutes(offset, delimiter) { 13874 if (offset % 60 === 0) { 13875 const sign = offset > 0 ? "-" : "+"; 13876 return sign + addLeadingZeros(Math.abs(offset) / 60, 2); 13877 } 13878 return formatTimezone(offset, delimiter); 13879 } 13880 function formatTimezone(offset, delimiter = "") { 13881 const sign = offset > 0 ? "-" : "+"; 13882 const absOffset = Math.abs(offset); 13883 const hours = addLeadingZeros(Math.trunc(absOffset / 60), 2); 13884 const minutes = addLeadingZeros(absOffset % 60, 2); 13885 return sign + hours + delimiter + minutes; 13886 } 13887 13888 // packages/dataviews/node_modules/date-fns/_lib/format/longFormatters.js 13889 var dateLongFormatter = (pattern, formatLong2) => { 13890 switch (pattern) { 13891 case "P": 13892 return formatLong2.date({ width: "short" }); 13893 case "PP": 13894 return formatLong2.date({ width: "medium" }); 13895 case "PPP": 13896 return formatLong2.date({ width: "long" }); 13897 case "PPPP": 13898 default: 13899 return formatLong2.date({ width: "full" }); 13900 } 13901 }; 13902 var timeLongFormatter = (pattern, formatLong2) => { 13903 switch (pattern) { 13904 case "p": 13905 return formatLong2.time({ width: "short" }); 13906 case "pp": 13907 return formatLong2.time({ width: "medium" }); 13908 case "ppp": 13909 return formatLong2.time({ width: "long" }); 13910 case "pppp": 13911 default: 13912 return formatLong2.time({ width: "full" }); 13913 } 13914 }; 13915 var dateTimeLongFormatter = (pattern, formatLong2) => { 13916 const matchResult = pattern.match(/(P+)(p+)?/) || []; 13917 const datePattern = matchResult[1]; 13918 const timePattern = matchResult[2]; 13919 if (!timePattern) { 13920 return dateLongFormatter(pattern, formatLong2); 13921 } 13922 let dateTimeFormat; 13923 switch (datePattern) { 13924 case "P": 13925 dateTimeFormat = formatLong2.dateTime({ width: "short" }); 13926 break; 13927 case "PP": 13928 dateTimeFormat = formatLong2.dateTime({ width: "medium" }); 13929 break; 13930 case "PPP": 13931 dateTimeFormat = formatLong2.dateTime({ width: "long" }); 13932 break; 13933 case "PPPP": 13934 default: 13935 dateTimeFormat = formatLong2.dateTime({ width: "full" }); 13936 break; 13937 } 13938 return dateTimeFormat.replace("{{date}}", dateLongFormatter(datePattern, formatLong2)).replace("{{time}}", timeLongFormatter(timePattern, formatLong2)); 13939 }; 13940 var longFormatters = { 13941 p: timeLongFormatter, 13942 P: dateTimeLongFormatter 13943 }; 13944 13945 // packages/dataviews/node_modules/date-fns/_lib/protectedTokens.js 13946 var dayOfYearTokenRE = /^D+$/; 13947 var weekYearTokenRE = /^Y+$/; 13948 var throwTokens = ["D", "DD", "YY", "YYYY"]; 13949 function isProtectedDayOfYearToken(token) { 13950 return dayOfYearTokenRE.test(token); 13951 } 13952 function isProtectedWeekYearToken(token) { 13953 return weekYearTokenRE.test(token); 13954 } 13955 function warnOrThrowProtectedError(token, format6, input) { 13956 const _message = message(token, format6, input); 13957 console.warn(_message); 13958 if (throwTokens.includes(token)) throw new RangeError(_message); 13959 } 13960 function message(token, format6, input) { 13961 const subject = token[0] === "Y" ? "years" : "days of the month"; 13962 return `Use \`$token.toLowerCase()}\` instead of \`$token}\` (in \`$format6}\`) for formatting $subject} to the input \`$input}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`; 13963 } 13964 13965 // packages/dataviews/node_modules/date-fns/format.js 13966 var formattingTokensRegExp = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g; 13967 var longFormattingTokensRegExp = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g; 13968 var escapedStringRegExp = /^'([^]*?)'?$/; 13969 var doubleQuoteRegExp = /''/g; 13970 var unescapedLatinCharacterRegExp = /[a-zA-Z]/; 13971 function format(date, formatStr, options) { 13972 const defaultOptions2 = getDefaultOptions(); 13973 const locale = options?.locale ?? defaultOptions2.locale ?? enUS; 13974 const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; 13975 const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? defaultOptions2.weekStartsOn ?? defaultOptions2.locale?.options?.weekStartsOn ?? 0; 13976 const originalDate = toDate(date, options?.in); 13977 if (!isValid(originalDate)) { 13978 throw new RangeError("Invalid time value"); 13979 } 13980 let parts = formatStr.match(longFormattingTokensRegExp).map((substring) => { 13981 const firstCharacter = substring[0]; 13982 if (firstCharacter === "p" || firstCharacter === "P") { 13983 const longFormatter = longFormatters[firstCharacter]; 13984 return longFormatter(substring, locale.formatLong); 13985 } 13986 return substring; 13987 }).join("").match(formattingTokensRegExp).map((substring) => { 13988 if (substring === "''") { 13989 return { isToken: false, value: "'" }; 13990 } 13991 const firstCharacter = substring[0]; 13992 if (firstCharacter === "'") { 13993 return { isToken: false, value: cleanEscapedString(substring) }; 13994 } 13995 if (formatters[firstCharacter]) { 13996 return { isToken: true, value: substring }; 13997 } 13998 if (firstCharacter.match(unescapedLatinCharacterRegExp)) { 13999 throw new RangeError( 14000 "Format string contains an unescaped latin alphabet character `" + firstCharacter + "`" 14001 ); 14002 } 14003 return { isToken: false, value: substring }; 14004 }); 14005 if (locale.localize.preprocessor) { 14006 parts = locale.localize.preprocessor(originalDate, parts); 14007 } 14008 const formatterOptions = { 14009 firstWeekContainsDate, 14010 weekStartsOn, 14011 locale 14012 }; 14013 return parts.map((part) => { 14014 if (!part.isToken) return part.value; 14015 const token = part.value; 14016 if (!options?.useAdditionalWeekYearTokens && isProtectedWeekYearToken(token) || !options?.useAdditionalDayOfYearTokens && isProtectedDayOfYearToken(token)) { 14017 warnOrThrowProtectedError(token, formatStr, String(date)); 14018 } 14019 const formatter = formatters[token[0]]; 14020 return formatter(originalDate, token, locale.localize, formatterOptions); 14021 }).join(""); 14022 } 14023 function cleanEscapedString(input) { 14024 const matched = input.match(escapedStringRegExp); 14025 if (!matched) { 14026 return input; 14027 } 14028 return matched[1].replace(doubleQuoteRegExp, "'"); 14029 } 14030 14031 // packages/dataviews/node_modules/date-fns/subDays.js 14032 function subDays(date, amount, options) { 14033 return addDays(date, -amount, options); 14034 } 14035 14036 // packages/dataviews/node_modules/date-fns/subMonths.js 14037 function subMonths(date, amount, options) { 14038 return addMonths(date, -amount, options); 14039 } 14040 14041 // packages/dataviews/node_modules/date-fns/subWeeks.js 14042 function subWeeks(date, amount, options) { 14043 return addWeeks(date, -amount, options); 14044 } 14045 14046 // packages/dataviews/node_modules/date-fns/subYears.js 14047 function subYears(date, amount, options) { 14048 return addYears(date, -amount, options); 14049 } 14050 14051 // packages/dataviews/build-module/utils/operators.mjs 14052 var import_i18n23 = __toESM(require_i18n(), 1); 14053 var import_element45 = __toESM(require_element(), 1); 14054 var import_date = __toESM(require_date(), 1); 14055 var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1); 14056 var filterTextWrappers = { 14057 Name: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "dataviews-filters__summary-filter-text-name" }), 14058 Value: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "dataviews-filters__summary-filter-text-value" }) 14059 }; 14060 function getRelativeDate(value, unit) { 14061 switch (unit) { 14062 case "days": 14063 return subDays(/* @__PURE__ */ new Date(), value); 14064 case "weeks": 14065 return subWeeks(/* @__PURE__ */ new Date(), value); 14066 case "months": 14067 return subMonths(/* @__PURE__ */ new Date(), value); 14068 case "years": 14069 return subYears(/* @__PURE__ */ new Date(), value); 14070 default: 14071 return /* @__PURE__ */ new Date(); 14072 } 14073 } 14074 var isNoneOperatorDefinition = { 14075 /* translators: DataViews operator name */ 14076 label: (0, import_i18n23.__)("Is none of"), 14077 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14078 (0, import_i18n23.sprintf)( 14079 /* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is none of: Admin, Editor". */ 14080 (0, import_i18n23.__)("<Name>%1$s is none of: </Name><Value>%2$s</Value>"), 14081 filter.name, 14082 activeElements.map((element) => element.label).join(", ") 14083 ), 14084 filterTextWrappers 14085 ), 14086 filter: ((item, field, filterValue) => { 14087 if (!filterValue?.length) { 14088 return true; 14089 } 14090 const fieldValue = field.getValue({ item }); 14091 if (Array.isArray(fieldValue)) { 14092 return !filterValue.some( 14093 (fv) => fieldValue.includes(fv) 14094 ); 14095 } else if (typeof fieldValue === "string") { 14096 return !filterValue.includes(fieldValue); 14097 } 14098 return false; 14099 }), 14100 selection: "multi" 14101 }; 14102 var OPERATORS = [ 14103 { 14104 name: OPERATOR_IS_ANY, 14105 /* translators: DataViews operator name */ 14106 label: (0, import_i18n23.__)("Includes"), 14107 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14108 (0, import_i18n23.sprintf)( 14109 /* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is any: Admin, Editor". */ 14110 (0, import_i18n23.__)("<Name>%1$s includes: </Name><Value>%2$s</Value>"), 14111 filter.name, 14112 activeElements.map((element) => element.label).join(", ") 14113 ), 14114 filterTextWrappers 14115 ), 14116 filter(item, field, filterValue) { 14117 if (!filterValue?.length) { 14118 return true; 14119 } 14120 const fieldValue = field.getValue({ item }); 14121 if (Array.isArray(fieldValue)) { 14122 return filterValue.some( 14123 (fv) => fieldValue.includes(fv) 14124 ); 14125 } else if (typeof fieldValue === "string") { 14126 return filterValue.includes(fieldValue); 14127 } 14128 return false; 14129 }, 14130 selection: "multi" 14131 }, 14132 { 14133 name: OPERATOR_IS_NONE, 14134 ...isNoneOperatorDefinition 14135 }, 14136 { 14137 name: OPERATOR_IS_ALL, 14138 /* translators: DataViews operator name */ 14139 label: (0, import_i18n23.__)("Includes all"), 14140 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14141 (0, import_i18n23.sprintf)( 14142 /* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author includes all: Admin, Editor". */ 14143 (0, import_i18n23.__)("<Name>%1$s includes all: </Name><Value>%2$s</Value>"), 14144 filter.name, 14145 activeElements.map((element) => element.label).join(", ") 14146 ), 14147 filterTextWrappers 14148 ), 14149 filter(item, field, filterValue) { 14150 if (!filterValue?.length) { 14151 return true; 14152 } 14153 return filterValue.every((value) => { 14154 return field.getValue({ item })?.includes(value); 14155 }); 14156 }, 14157 selection: "multi" 14158 }, 14159 { 14160 name: OPERATOR_IS_NOT_ALL, 14161 ...isNoneOperatorDefinition 14162 }, 14163 { 14164 name: OPERATOR_BETWEEN, 14165 /* translators: DataViews operator name */ 14166 label: (0, import_i18n23.__)("Between (inc)"), 14167 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14168 (0, import_i18n23.sprintf)( 14169 /* translators: 1: Filter name (e.g. "Item count"). 2: Filter value min. 3: Filter value max. e.g.: "Item count between (inc): 10 and 180". */ 14170 (0, import_i18n23.__)( 14171 "<Name>%1$s between (inc): </Name><Value>%2$s and %3$s</Value>" 14172 ), 14173 filter.name, 14174 activeElements[0].label[0], 14175 activeElements[0].label[1] 14176 ), 14177 filterTextWrappers 14178 ), 14179 filter(item, field, filterValue) { 14180 if (!Array.isArray(filterValue) || filterValue.length !== 2 || filterValue[0] === void 0 || filterValue[1] === void 0) { 14181 return true; 14182 } 14183 const fieldValue = field.getValue({ item }); 14184 if (typeof fieldValue === "number" || fieldValue instanceof Date || typeof fieldValue === "string") { 14185 return fieldValue >= filterValue[0] && fieldValue <= filterValue[1]; 14186 } 14187 return false; 14188 }, 14189 selection: "custom" 14190 }, 14191 { 14192 name: OPERATOR_IN_THE_PAST, 14193 /* translators: DataViews operator name */ 14194 label: (0, import_i18n23.__)("In the past"), 14195 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14196 (0, import_i18n23.sprintf)( 14197 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "7 days"): "Date is in the past: 7 days". */ 14198 (0, import_i18n23.__)( 14199 "<Name>%1$s is in the past: </Name><Value>%2$s</Value>" 14200 ), 14201 filter.name, 14202 `$activeElements[0].value.value} $activeElements[0].value.unit}` 14203 ), 14204 filterTextWrappers 14205 ), 14206 filter(item, field, filterValue) { 14207 if (filterValue?.value === void 0 || filterValue?.unit === void 0) { 14208 return true; 14209 } 14210 const targetDate = getRelativeDate( 14211 filterValue.value, 14212 filterValue.unit 14213 ); 14214 const fieldValue = (0, import_date.getDate)(field.getValue({ item })); 14215 return fieldValue >= targetDate && fieldValue <= /* @__PURE__ */ new Date(); 14216 }, 14217 selection: "custom" 14218 }, 14219 { 14220 name: OPERATOR_OVER, 14221 /* translators: DataViews operator name */ 14222 label: (0, import_i18n23.__)("Over"), 14223 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14224 (0, import_i18n23.sprintf)( 14225 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "7 days"): "Date is over: 7 days". */ 14226 (0, import_i18n23.__)("<Name>%1$s is over: </Name><Value>%2$s</Value>"), 14227 filter.name, 14228 `$activeElements[0].value.value} $activeElements[0].value.unit}` 14229 ), 14230 filterTextWrappers 14231 ), 14232 filter(item, field, filterValue) { 14233 if (filterValue?.value === void 0 || filterValue?.unit === void 0) { 14234 return true; 14235 } 14236 const targetDate = getRelativeDate( 14237 filterValue.value, 14238 filterValue.unit 14239 ); 14240 const fieldValue = (0, import_date.getDate)(field.getValue({ item })); 14241 return fieldValue < targetDate; 14242 }, 14243 selection: "custom" 14244 }, 14245 { 14246 name: OPERATOR_IS, 14247 /* translators: DataViews operator name */ 14248 label: (0, import_i18n23.__)("Is"), 14249 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14250 (0, import_i18n23.sprintf)( 14251 /* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is: Admin". */ 14252 (0, import_i18n23.__)("<Name>%1$s is: </Name><Value>%2$s</Value>"), 14253 filter.name, 14254 activeElements[0].label 14255 ), 14256 filterTextWrappers 14257 ), 14258 filter(item, field, filterValue) { 14259 return filterValue === field.getValue({ item }) || filterValue === void 0; 14260 }, 14261 selection: "single" 14262 }, 14263 { 14264 name: OPERATOR_IS_NOT, 14265 /* translators: DataViews operator name */ 14266 label: (0, import_i18n23.__)("Is not"), 14267 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14268 (0, import_i18n23.sprintf)( 14269 /* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is not: Admin". */ 14270 (0, import_i18n23.__)("<Name>%1$s is not: </Name><Value>%2$s</Value>"), 14271 filter.name, 14272 activeElements[0].label 14273 ), 14274 filterTextWrappers 14275 ), 14276 filter(item, field, filterValue) { 14277 return filterValue !== field.getValue({ item }); 14278 }, 14279 selection: "single" 14280 }, 14281 { 14282 name: OPERATOR_LESS_THAN, 14283 /* translators: DataViews operator name */ 14284 label: (0, import_i18n23.__)("Less than"), 14285 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14286 (0, import_i18n23.sprintf)( 14287 /* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is less than: 10". */ 14288 (0, import_i18n23.__)("<Name>%1$s is less than: </Name><Value>%2$s</Value>"), 14289 filter.name, 14290 activeElements[0].label 14291 ), 14292 filterTextWrappers 14293 ), 14294 filter(item, field, filterValue) { 14295 if (filterValue === void 0) { 14296 return true; 14297 } 14298 const fieldValue = field.getValue({ item }); 14299 return fieldValue < filterValue; 14300 }, 14301 selection: "single" 14302 }, 14303 { 14304 name: OPERATOR_GREATER_THAN, 14305 /* translators: DataViews operator name */ 14306 label: (0, import_i18n23.__)("Greater than"), 14307 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14308 (0, import_i18n23.sprintf)( 14309 /* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is greater than: 10". */ 14310 (0, import_i18n23.__)( 14311 "<Name>%1$s is greater than: </Name><Value>%2$s</Value>" 14312 ), 14313 filter.name, 14314 activeElements[0].label 14315 ), 14316 filterTextWrappers 14317 ), 14318 filter(item, field, filterValue) { 14319 if (filterValue === void 0) { 14320 return true; 14321 } 14322 const fieldValue = field.getValue({ item }); 14323 return fieldValue > filterValue; 14324 }, 14325 selection: "single" 14326 }, 14327 { 14328 name: OPERATOR_LESS_THAN_OR_EQUAL, 14329 /* translators: DataViews operator name */ 14330 label: (0, import_i18n23.__)("Less than or equal"), 14331 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14332 (0, import_i18n23.sprintf)( 14333 /* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is less than or equal to: 10". */ 14334 (0, import_i18n23.__)( 14335 "<Name>%1$s is less than or equal to: </Name><Value>%2$s</Value>" 14336 ), 14337 filter.name, 14338 activeElements[0].label 14339 ), 14340 filterTextWrappers 14341 ), 14342 filter(item, field, filterValue) { 14343 if (filterValue === void 0) { 14344 return true; 14345 } 14346 const fieldValue = field.getValue({ item }); 14347 return fieldValue <= filterValue; 14348 }, 14349 selection: "single" 14350 }, 14351 { 14352 name: OPERATOR_GREATER_THAN_OR_EQUAL, 14353 /* translators: DataViews operator name */ 14354 label: (0, import_i18n23.__)("Greater than or equal"), 14355 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14356 (0, import_i18n23.sprintf)( 14357 /* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is greater than or equal to: 10". */ 14358 (0, import_i18n23.__)( 14359 "<Name>%1$s is greater than or equal to: </Name><Value>%2$s</Value>" 14360 ), 14361 filter.name, 14362 activeElements[0].label 14363 ), 14364 filterTextWrappers 14365 ), 14366 filter(item, field, filterValue) { 14367 if (filterValue === void 0) { 14368 return true; 14369 } 14370 const fieldValue = field.getValue({ item }); 14371 return fieldValue >= filterValue; 14372 }, 14373 selection: "single" 14374 }, 14375 { 14376 name: OPERATOR_BEFORE, 14377 /* translators: DataViews operator name */ 14378 label: (0, import_i18n23.__)("Before"), 14379 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14380 (0, import_i18n23.sprintf)( 14381 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is before: 2024-01-01". */ 14382 (0, import_i18n23.__)("<Name>%1$s is before: </Name><Value>%2$s</Value>"), 14383 filter.name, 14384 activeElements[0].label 14385 ), 14386 filterTextWrappers 14387 ), 14388 filter(item, field, filterValue) { 14389 if (filterValue === void 0) { 14390 return true; 14391 } 14392 const filterDate = (0, import_date.getDate)(filterValue); 14393 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14394 return fieldDate < filterDate; 14395 }, 14396 selection: "single" 14397 }, 14398 { 14399 name: OPERATOR_AFTER, 14400 /* translators: DataViews operator name */ 14401 label: (0, import_i18n23.__)("After"), 14402 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14403 (0, import_i18n23.sprintf)( 14404 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is after: 2024-01-01". */ 14405 (0, import_i18n23.__)("<Name>%1$s is after: </Name><Value>%2$s</Value>"), 14406 filter.name, 14407 activeElements[0].label 14408 ), 14409 filterTextWrappers 14410 ), 14411 filter(item, field, filterValue) { 14412 if (filterValue === void 0) { 14413 return true; 14414 } 14415 const filterDate = (0, import_date.getDate)(filterValue); 14416 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14417 return fieldDate > filterDate; 14418 }, 14419 selection: "single" 14420 }, 14421 { 14422 name: OPERATOR_BEFORE_INC, 14423 /* translators: DataViews operator name */ 14424 label: (0, import_i18n23.__)("Before (inc)"), 14425 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14426 (0, import_i18n23.sprintf)( 14427 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is on or before: 2024-01-01". */ 14428 (0, import_i18n23.__)( 14429 "<Name>%1$s is on or before: </Name><Value>%2$s</Value>" 14430 ), 14431 filter.name, 14432 activeElements[0].label 14433 ), 14434 filterTextWrappers 14435 ), 14436 filter(item, field, filterValue) { 14437 if (filterValue === void 0) { 14438 return true; 14439 } 14440 const filterDate = (0, import_date.getDate)(filterValue); 14441 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14442 return fieldDate <= filterDate; 14443 }, 14444 selection: "single" 14445 }, 14446 { 14447 name: OPERATOR_AFTER_INC, 14448 /* translators: DataViews operator name */ 14449 label: (0, import_i18n23.__)("After (inc)"), 14450 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14451 (0, import_i18n23.sprintf)( 14452 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is on or after: 2024-01-01". */ 14453 (0, import_i18n23.__)( 14454 "<Name>%1$s is on or after: </Name><Value>%2$s</Value>" 14455 ), 14456 filter.name, 14457 activeElements[0].label 14458 ), 14459 filterTextWrappers 14460 ), 14461 filter(item, field, filterValue) { 14462 if (filterValue === void 0) { 14463 return true; 14464 } 14465 const filterDate = (0, import_date.getDate)(filterValue); 14466 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14467 return fieldDate >= filterDate; 14468 }, 14469 selection: "single" 14470 }, 14471 { 14472 name: OPERATOR_CONTAINS, 14473 /* translators: DataViews operator name */ 14474 label: (0, import_i18n23.__)("Contains"), 14475 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14476 (0, import_i18n23.sprintf)( 14477 /* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title contains: Hello". */ 14478 (0, import_i18n23.__)("<Name>%1$s contains: </Name><Value>%2$s</Value>"), 14479 filter.name, 14480 activeElements[0].label 14481 ), 14482 filterTextWrappers 14483 ), 14484 filter(item, field, filterValue) { 14485 if (filterValue === void 0) { 14486 return true; 14487 } 14488 const fieldValue = field.getValue({ item }); 14489 return typeof fieldValue === "string" && filterValue && fieldValue.toLowerCase().includes(String(filterValue).toLowerCase()); 14490 }, 14491 selection: "single" 14492 }, 14493 { 14494 name: OPERATOR_NOT_CONTAINS, 14495 /* translators: DataViews operator name */ 14496 label: (0, import_i18n23.__)("Doesn't contain"), 14497 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14498 (0, import_i18n23.sprintf)( 14499 /* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title doesn't contain: Hello". */ 14500 (0, import_i18n23.__)( 14501 "<Name>%1$s doesn't contain: </Name><Value>%2$s</Value>" 14502 ), 14503 filter.name, 14504 activeElements[0].label 14505 ), 14506 filterTextWrappers 14507 ), 14508 filter(item, field, filterValue) { 14509 if (filterValue === void 0) { 14510 return true; 14511 } 14512 const fieldValue = field.getValue({ item }); 14513 return typeof fieldValue === "string" && filterValue && !fieldValue.toLowerCase().includes(String(filterValue).toLowerCase()); 14514 }, 14515 selection: "single" 14516 }, 14517 { 14518 name: OPERATOR_STARTS_WITH, 14519 /* translators: DataViews operator name */ 14520 label: (0, import_i18n23.__)("Starts with"), 14521 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14522 (0, import_i18n23.sprintf)( 14523 /* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title starts with: Hello". */ 14524 (0, import_i18n23.__)("<Name>%1$s starts with: </Name><Value>%2$s</Value>"), 14525 filter.name, 14526 activeElements[0].label 14527 ), 14528 filterTextWrappers 14529 ), 14530 filter(item, field, filterValue) { 14531 if (filterValue === void 0) { 14532 return true; 14533 } 14534 const fieldValue = field.getValue({ item }); 14535 return typeof fieldValue === "string" && filterValue && fieldValue.toLowerCase().startsWith(String(filterValue).toLowerCase()); 14536 }, 14537 selection: "single" 14538 }, 14539 { 14540 name: OPERATOR_ON, 14541 /* translators: DataViews operator name */ 14542 label: (0, import_i18n23.__)("On"), 14543 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14544 (0, import_i18n23.sprintf)( 14545 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is: 2024-01-01". */ 14546 (0, import_i18n23.__)("<Name>%1$s is: </Name><Value>%2$s</Value>"), 14547 filter.name, 14548 activeElements[0].label 14549 ), 14550 filterTextWrappers 14551 ), 14552 filter(item, field, filterValue) { 14553 if (filterValue === void 0) { 14554 return true; 14555 } 14556 const filterDate = (0, import_date.getDate)(filterValue); 14557 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14558 return filterDate.getTime() === fieldDate.getTime(); 14559 }, 14560 selection: "single" 14561 }, 14562 { 14563 name: OPERATOR_NOT_ON, 14564 /* translators: DataViews operator name */ 14565 label: (0, import_i18n23.__)("Not on"), 14566 filterText: (filter, activeElements) => (0, import_element45.createInterpolateElement)( 14567 (0, import_i18n23.sprintf)( 14568 /* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is not: 2024-01-01". */ 14569 (0, import_i18n23.__)("<Name>%1$s is not: </Name><Value>%2$s</Value>"), 14570 filter.name, 14571 activeElements[0].label 14572 ), 14573 filterTextWrappers 14574 ), 14575 filter(item, field, filterValue) { 14576 if (filterValue === void 0) { 14577 return true; 14578 } 14579 const filterDate = (0, import_date.getDate)(filterValue); 14580 const fieldDate = (0, import_date.getDate)(field.getValue({ item })); 14581 return filterDate.getTime() !== fieldDate.getTime(); 14582 }, 14583 selection: "single" 14584 } 14585 ]; 14586 var getOperatorByName = (name) => OPERATORS.find((op) => op.name === name); 14587 var getAllOperatorNames = () => OPERATORS.map((op) => op.name); 14588 var isSingleSelectionOperator = (name) => OPERATORS.filter((op) => op.selection === "single").some( 14589 (op) => op.name === name 14590 ); 14591 var isRegisteredOperator = (name) => OPERATORS.some((op) => op.name === name); 14592 14593 // packages/dataviews/build-module/components/dataviews-filters/filter.mjs 14594 var import_jsx_runtime74 = __toESM(require_jsx_runtime(), 1); 14595 var ENTER = "Enter"; 14596 var SPACE = " "; 14597 var FilterText = ({ 14598 activeElements, 14599 filterInView, 14600 filter 14601 }) => { 14602 if (activeElements === void 0 || activeElements.length === 0) { 14603 return filter.name; 14604 } 14605 const operator = getOperatorByName(filterInView?.operator); 14606 if (operator !== void 0) { 14607 return operator.filterText(filter, activeElements); 14608 } 14609 return (0, import_i18n24.sprintf)( 14610 /* translators: 1: Filter name e.g.: "Unknown status for Author". */ 14611 (0, import_i18n24.__)("Unknown status for %1$s"), 14612 filter.name 14613 ); 14614 }; 14615 function OperatorSelector({ 14616 filter, 14617 view, 14618 onChangeView 14619 }) { 14620 const operatorOptions = filter.operators?.map((operator) => ({ 14621 value: operator, 14622 label: getOperatorByName(operator)?.label || operator 14623 })); 14624 const currentFilter = view.filters?.find( 14625 (_filter) => _filter.field === filter.field 14626 ); 14627 const value = currentFilter?.operator || filter.operators[0]; 14628 return operatorOptions.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)( 14629 Stack, 14630 { 14631 direction: "row", 14632 gap: "sm", 14633 justify: "flex-start", 14634 className: "dataviews-filters__summary-operators-container", 14635 align: "center", 14636 children: [ 14637 /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_components21.FlexItem, { className: "dataviews-filters__summary-operators-filter-name", children: filter.name }), 14638 /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14639 import_components21.SelectControl, 14640 { 14641 className: "dataviews-filters__summary-operators-filter-select", 14642 label: (0, import_i18n24.__)("Conditions"), 14643 value, 14644 options: operatorOptions, 14645 onChange: (newValue) => { 14646 const newOperator = newValue; 14647 const currentOperator = currentFilter?.operator; 14648 const newFilters = currentFilter ? [ 14649 ...(view.filters ?? []).map( 14650 (_filter) => { 14651 if (_filter.field === filter.field) { 14652 const currentOpSelectionModel = getOperatorByName( 14653 currentOperator 14654 )?.selection; 14655 const newOpSelectionModel = getOperatorByName( 14656 newOperator 14657 )?.selection; 14658 const shouldResetValue = currentOpSelectionModel !== newOpSelectionModel || [ 14659 currentOpSelectionModel, 14660 newOpSelectionModel 14661 ].includes("custom"); 14662 return { 14663 ..._filter, 14664 value: shouldResetValue ? void 0 : _filter.value, 14665 operator: newOperator 14666 }; 14667 } 14668 return _filter; 14669 } 14670 ) 14671 ] : [ 14672 ...view.filters ?? [], 14673 { 14674 field: filter.field, 14675 operator: newOperator, 14676 value: void 0 14677 } 14678 ]; 14679 onChangeView({ 14680 ...view, 14681 page: 1, 14682 filters: newFilters 14683 }); 14684 }, 14685 size: "small", 14686 variant: "minimal", 14687 hideLabelFromVision: true 14688 } 14689 ) 14690 ] 14691 } 14692 ); 14693 } 14694 function Filter({ 14695 addFilterRef, 14696 openedFilter, 14697 fields, 14698 ...commonProps 14699 }) { 14700 const toggleRef = (0, import_element46.useRef)(null); 14701 const { filter, view, onChangeView } = commonProps; 14702 const filterInView = view.filters?.find( 14703 (f2) => f2.field === filter.field 14704 ); 14705 let activeElements = []; 14706 const field = (0, import_element46.useMemo)(() => { 14707 const currentField = fields.find((f2) => f2.id === filter.field); 14708 if (currentField) { 14709 return { 14710 ...currentField, 14711 // Configure getValue as if Item was a plain object. 14712 // See related input-widget.tsx 14713 getValue: ({ item }) => item[currentField.id] 14714 }; 14715 } 14716 return currentField; 14717 }, [fields, filter.field]); 14718 const { elements } = useElements({ 14719 elements: filter.elements, 14720 getElements: filter.getElements 14721 }); 14722 if (elements.length > 0) { 14723 activeElements = elements.filter((element) => { 14724 if (filter.singleSelection) { 14725 return element.value === filterInView?.value; 14726 } 14727 return filterInView?.value?.includes(element.value); 14728 }); 14729 } else if (Array.isArray(filterInView?.value)) { 14730 const label = filterInView.value.map((v2) => { 14731 const formattedValue = field?.getValueFormatted({ 14732 item: { [field.id]: v2 }, 14733 field 14734 }); 14735 return formattedValue || String(v2); 14736 }); 14737 activeElements = [ 14738 { 14739 value: filterInView.value, 14740 // @ts-ignore 14741 label 14742 } 14743 ]; 14744 } else if (typeof filterInView?.value === "object") { 14745 activeElements = [ 14746 { value: filterInView.value, label: filterInView.value } 14747 ]; 14748 } else if (filterInView?.value !== void 0) { 14749 const label = field !== void 0 ? field.getValueFormatted({ 14750 item: { [field.id]: filterInView.value }, 14751 field 14752 }) : String(filterInView.value); 14753 activeElements = [ 14754 { 14755 value: filterInView.value, 14756 label 14757 } 14758 ]; 14759 } 14760 const isPrimary = filter.isPrimary; 14761 const isLocked = filterInView?.isLocked; 14762 const hasValues = !isLocked && filterInView?.value !== void 0; 14763 const canResetOrRemove = !isLocked && (!isPrimary || hasValues); 14764 return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14765 import_components21.Dropdown, 14766 { 14767 defaultOpen: openedFilter === filter.field, 14768 contentClassName: "dataviews-filters__summary-popover", 14769 popoverProps: { placement: "bottom-start", role: "dialog" }, 14770 onClose: () => { 14771 toggleRef.current?.focus(); 14772 }, 14773 renderToggle: ({ isOpen, onToggle }) => /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "dataviews-filters__summary-chip-container", children: [ 14774 /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14775 import_components21.Tooltip, 14776 { 14777 text: (0, import_i18n24.sprintf)( 14778 /* translators: 1: Filter name. */ 14779 (0, import_i18n24.__)("Filter by: %1$s"), 14780 filter.name.toLowerCase() 14781 ), 14782 placement: "top", 14783 children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14784 "div", 14785 { 14786 className: clsx_default( 14787 "dataviews-filters__summary-chip", 14788 { 14789 "has-reset": canResetOrRemove, 14790 "has-values": hasValues, 14791 "is-not-clickable": isLocked 14792 } 14793 ), 14794 role: "button", 14795 tabIndex: isLocked ? -1 : 0, 14796 onClick: () => { 14797 if (!isLocked) { 14798 onToggle(); 14799 } 14800 }, 14801 onKeyDown: (event) => { 14802 if (!isLocked && [ENTER, SPACE].includes(event.key)) { 14803 onToggle(); 14804 event.preventDefault(); 14805 } 14806 }, 14807 "aria-disabled": isLocked, 14808 "aria-pressed": isOpen, 14809 "aria-expanded": isOpen, 14810 ref: toggleRef, 14811 children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14812 FilterText, 14813 { 14814 activeElements, 14815 filterInView, 14816 filter 14817 } 14818 ) 14819 } 14820 ) 14821 } 14822 ), 14823 canResetOrRemove && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14824 import_components21.Tooltip, 14825 { 14826 text: isPrimary ? (0, import_i18n24.__)("Reset") : (0, import_i18n24.__)("Remove"), 14827 placement: "top", 14828 children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14829 "button", 14830 { 14831 className: clsx_default( 14832 "dataviews-filters__summary-chip-remove", 14833 { "has-values": hasValues } 14834 ), 14835 onClick: () => { 14836 onChangeView({ 14837 ...view, 14838 page: 1, 14839 filters: view.filters?.filter( 14840 (_filter) => _filter.field !== filter.field 14841 ) 14842 }); 14843 if (!isPrimary) { 14844 addFilterRef.current?.focus(); 14845 } else { 14846 toggleRef.current?.focus(); 14847 } 14848 }, 14849 children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_components21.Icon, { icon: close_small_default }) 14850 } 14851 ) 14852 } 14853 ) 14854 ] }), 14855 renderContent: () => { 14856 return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(Stack, { direction: "column", justify: "flex-start", children: [ 14857 /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(OperatorSelector, { ...commonProps }), 14858 commonProps.filter.hasElements ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)( 14859 SearchWidget, 14860 { 14861 ...commonProps, 14862 filter: { 14863 ...commonProps.filter, 14864 elements 14865 } 14866 } 14867 ) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(InputWidget, { ...commonProps, fields }) 14868 ] }); 14869 } 14870 } 14871 ); 14872 } 14873 14874 // packages/dataviews/build-module/components/dataviews-filters/add-filter.mjs 14875 var import_components22 = __toESM(require_components(), 1); 14876 var import_i18n25 = __toESM(require_i18n(), 1); 14877 var import_element47 = __toESM(require_element(), 1); 14878 var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1); 14879 var { Menu: Menu4 } = unlock(import_components22.privateApis); 14880 function AddFilterMenu({ 14881 filters, 14882 view, 14883 onChangeView, 14884 setOpenedFilter, 14885 triggerProps 14886 }) { 14887 const inactiveFilters = filters.filter((filter) => !filter.isVisible); 14888 return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(Menu4, { children: [ 14889 /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Menu4.TriggerButton, { ...triggerProps }), 14890 /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Menu4.Popover, { children: inactiveFilters.map((filter) => { 14891 return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)( 14892 Menu4.Item, 14893 { 14894 onClick: () => { 14895 setOpenedFilter(filter.field); 14896 onChangeView({ 14897 ...view, 14898 page: 1, 14899 filters: [ 14900 ...view.filters || [], 14901 { 14902 field: filter.field, 14903 value: void 0, 14904 operator: filter.operators[0] 14905 } 14906 ] 14907 }); 14908 }, 14909 children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Menu4.ItemLabel, { children: filter.name }) 14910 }, 14911 filter.field 14912 ); 14913 }) }) 14914 ] }); 14915 } 14916 function AddFilter({ filters, view, onChangeView, setOpenedFilter }, ref) { 14917 if (!filters.length || filters.every(({ isPrimary }) => isPrimary)) { 14918 return null; 14919 } 14920 const inactiveFilters = filters.filter((filter) => !filter.isVisible); 14921 return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)( 14922 AddFilterMenu, 14923 { 14924 triggerProps: { 14925 render: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)( 14926 import_components22.Button, 14927 { 14928 accessibleWhenDisabled: true, 14929 size: "compact", 14930 className: "dataviews-filters-button", 14931 variant: "tertiary", 14932 disabled: !inactiveFilters.length, 14933 ref 14934 } 14935 ), 14936 children: (0, import_i18n25.__)("Add filter") 14937 }, 14938 ...{ filters, view, onChangeView, setOpenedFilter } 14939 } 14940 ); 14941 } 14942 var add_filter_default = (0, import_element47.forwardRef)(AddFilter); 14943 14944 // packages/dataviews/build-module/components/dataviews-filters/reset-filters.mjs 14945 var import_components23 = __toESM(require_components(), 1); 14946 var import_i18n26 = __toESM(require_i18n(), 1); 14947 var import_jsx_runtime76 = __toESM(require_jsx_runtime(), 1); 14948 function ResetFilter({ 14949 filters, 14950 view, 14951 onChangeView 14952 }) { 14953 const isPrimary = (field) => filters.some( 14954 (_filter) => _filter.field === field && _filter.isPrimary 14955 ); 14956 const isDisabled = !view.search && !view.filters?.some( 14957 (_filter) => !_filter.isLocked && (_filter.value !== void 0 || !isPrimary(_filter.field)) 14958 ); 14959 return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)( 14960 import_components23.Button, 14961 { 14962 disabled: isDisabled, 14963 accessibleWhenDisabled: true, 14964 size: "compact", 14965 variant: "tertiary", 14966 className: "dataviews-filters__reset-button", 14967 onClick: () => { 14968 onChangeView({ 14969 ...view, 14970 page: 1, 14971 search: "", 14972 filters: view.filters?.filter((f2) => !!f2.isLocked) || [] 14973 }); 14974 }, 14975 children: (0, import_i18n26.__)("Reset") 14976 } 14977 ); 14978 } 14979 14980 // packages/dataviews/build-module/components/dataviews-filters/use-filters.mjs 14981 var import_element48 = __toESM(require_element(), 1); 14982 function useFilters(fields, view) { 14983 return (0, import_element48.useMemo)(() => { 14984 const filters = []; 14985 fields.forEach((field) => { 14986 if (field.filterBy === false || !field.hasElements && !field.Edit) { 14987 return; 14988 } 14989 const operators = field.filterBy.operators; 14990 const isPrimary = !!field.filterBy?.isPrimary; 14991 const isLocked = view.filters?.some( 14992 (f2) => f2.field === field.id && !!f2.isLocked 14993 ) ?? false; 14994 filters.push({ 14995 field: field.id, 14996 name: field.label, 14997 elements: field.elements, 14998 getElements: field.getElements, 14999 hasElements: field.hasElements, 15000 singleSelection: operators.some( 15001 (op) => isSingleSelectionOperator(op) 15002 ), 15003 operators, 15004 isVisible: isLocked || isPrimary || !!view.filters?.some( 15005 (f2) => f2.field === field.id && isRegisteredOperator(f2.operator) 15006 ), 15007 isPrimary, 15008 isLocked 15009 }); 15010 }); 15011 filters.sort((a2, b2) => { 15012 if (a2.isLocked && !b2.isLocked) { 15013 return -1; 15014 } 15015 if (!a2.isLocked && b2.isLocked) { 15016 return 1; 15017 } 15018 if (a2.isPrimary && !b2.isPrimary) { 15019 return -1; 15020 } 15021 if (!a2.isPrimary && b2.isPrimary) { 15022 return 1; 15023 } 15024 return a2.name.localeCompare(b2.name); 15025 }); 15026 return filters; 15027 }, [fields, view]); 15028 } 15029 var use_filters_default = useFilters; 15030 15031 // packages/dataviews/build-module/components/dataviews-filters/filters.mjs 15032 var import_jsx_runtime77 = __toESM(require_jsx_runtime(), 1); 15033 function Filters({ className }) { 15034 const { fields, view, onChangeView, openedFilter, setOpenedFilter } = (0, import_element49.useContext)(dataviews_context_default); 15035 const addFilterRef = (0, import_element49.useRef)(null); 15036 const filters = use_filters_default(fields, view); 15037 const addFilter = /* @__PURE__ */ (0, import_jsx_runtime77.jsx)( 15038 add_filter_default, 15039 { 15040 filters, 15041 view, 15042 onChangeView, 15043 ref: addFilterRef, 15044 setOpenedFilter 15045 }, 15046 "add-filter" 15047 ); 15048 const visibleFilters = filters.filter((filter) => filter.isVisible); 15049 if (visibleFilters.length === 0) { 15050 return null; 15051 } 15052 const filterComponents = [ 15053 ...visibleFilters.map((filter) => { 15054 return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)( 15055 Filter, 15056 { 15057 filter, 15058 view, 15059 fields, 15060 onChangeView, 15061 addFilterRef, 15062 openedFilter 15063 }, 15064 filter.field 15065 ); 15066 }), 15067 addFilter 15068 ]; 15069 filterComponents.push( 15070 /* @__PURE__ */ (0, import_jsx_runtime77.jsx)( 15071 ResetFilter, 15072 { 15073 filters, 15074 view, 15075 onChangeView 15076 }, 15077 "reset-filters" 15078 ) 15079 ); 15080 return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)( 15081 Stack, 15082 { 15083 direction: "row", 15084 justify: "flex-start", 15085 gap: "sm", 15086 style: { width: "fit-content" }, 15087 wrap: "wrap", 15088 className, 15089 children: filterComponents 15090 } 15091 ); 15092 } 15093 var filters_default = (0, import_element49.memo)(Filters); 15094 15095 // packages/dataviews/build-module/components/dataviews-filters/toggle.mjs 15096 var import_element50 = __toESM(require_element(), 1); 15097 var import_components24 = __toESM(require_components(), 1); 15098 var import_i18n27 = __toESM(require_i18n(), 1); 15099 var import_jsx_runtime78 = __toESM(require_jsx_runtime(), 1); 15100 function FiltersToggle() { 15101 const { 15102 filters, 15103 view, 15104 onChangeView, 15105 setOpenedFilter, 15106 isShowingFilter, 15107 setIsShowingFilter 15108 } = (0, import_element50.useContext)(dataviews_context_default); 15109 const buttonRef = (0, import_element50.useRef)(null); 15110 const onChangeViewWithFilterVisibility = (0, import_element50.useCallback)( 15111 (_view) => { 15112 onChangeView(_view); 15113 setIsShowingFilter(true); 15114 }, 15115 [onChangeView, setIsShowingFilter] 15116 ); 15117 if (filters.length === 0) { 15118 return null; 15119 } 15120 const hasVisibleFilters = filters.some((filter) => filter.isVisible); 15121 const addFilterButtonProps = { 15122 label: (0, import_i18n27.__)("Add filter"), 15123 "aria-expanded": false, 15124 isPressed: false 15125 }; 15126 const toggleFiltersButtonProps = { 15127 label: (0, import_i18n27._x)("Filter", "verb"), 15128 "aria-expanded": isShowingFilter, 15129 isPressed: isShowingFilter, 15130 onClick: () => { 15131 if (!isShowingFilter) { 15132 setOpenedFilter(null); 15133 } 15134 setIsShowingFilter(!isShowingFilter); 15135 } 15136 }; 15137 const hasPrimaryOrLockedFilters = filters.some( 15138 (filter) => filter.isPrimary || filter.isLocked 15139 ); 15140 const buttonComponent = /* @__PURE__ */ (0, import_jsx_runtime78.jsx)( 15141 import_components24.Button, 15142 { 15143 ref: buttonRef, 15144 className: "dataviews-filters__visibility-toggle", 15145 size: "compact", 15146 icon: funnel_default, 15147 disabled: hasPrimaryOrLockedFilters, 15148 accessibleWhenDisabled: true, 15149 ...hasVisibleFilters ? toggleFiltersButtonProps : addFilterButtonProps 15150 } 15151 ); 15152 return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "dataviews-filters__container-visibility-toggle", children: !hasVisibleFilters ? /* @__PURE__ */ (0, import_jsx_runtime78.jsx)( 15153 AddFilterMenu, 15154 { 15155 filters, 15156 view, 15157 onChangeView: onChangeViewWithFilterVisibility, 15158 setOpenedFilter, 15159 triggerProps: { render: buttonComponent } 15160 } 15161 ) : /* @__PURE__ */ (0, import_jsx_runtime78.jsx)( 15162 FilterVisibilityToggle, 15163 { 15164 buttonRef, 15165 filtersCount: view.filters?.length, 15166 children: buttonComponent 15167 } 15168 ) }); 15169 } 15170 function FilterVisibilityToggle({ 15171 buttonRef, 15172 filtersCount, 15173 children 15174 }) { 15175 (0, import_element50.useEffect)( 15176 () => () => { 15177 buttonRef.current?.focus(); 15178 }, 15179 [buttonRef] 15180 ); 15181 return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [ 15182 children, 15183 !!filtersCount && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "dataviews-filters-toggle__count", children: filtersCount }) 15184 ] }); 15185 } 15186 var toggle_default = FiltersToggle; 15187 15188 // packages/dataviews/build-module/components/dataviews-filters/filters-toggled.mjs 15189 var import_element51 = __toESM(require_element(), 1); 15190 var import_jsx_runtime79 = __toESM(require_jsx_runtime(), 1); 15191 function FiltersToggled(props) { 15192 const { isShowingFilter } = (0, import_element51.useContext)(dataviews_context_default); 15193 if (!isShowingFilter) { 15194 return null; 15195 } 15196 return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(filters_default, { ...props }); 15197 } 15198 var filters_toggled_default = FiltersToggled; 15199 15200 // packages/dataviews/build-module/components/dataviews-layout/index.mjs 15201 var import_element52 = __toESM(require_element(), 1); 15202 var import_components25 = __toESM(require_components(), 1); 15203 var import_i18n28 = __toESM(require_i18n(), 1); 15204 var import_jsx_runtime80 = __toESM(require_jsx_runtime(), 1); 15205 function DataViewsLayout({ className }) { 15206 const { 15207 actions = [], 15208 data, 15209 fields, 15210 getItemId, 15211 getItemLevel, 15212 hasInitiallyLoaded, 15213 isLoading, 15214 view, 15215 onChangeView, 15216 selection, 15217 onChangeSelection, 15218 setOpenedFilter, 15219 onClickItem, 15220 isItemClickable, 15221 renderItemLink, 15222 defaultLayouts: defaultLayouts2, 15223 containerRef, 15224 empty = /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { children: (0, import_i18n28.__)("No results") }) 15225 } = (0, import_element52.useContext)(dataviews_context_default); 15226 const isDelayedInitialLoading = useDelayedLoading(!hasInitiallyLoaded, { 15227 delay: 200 15228 }); 15229 if (!hasInitiallyLoaded) { 15230 if (!isDelayedInitialLoading) { 15231 return null; 15232 } 15233 return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "dataviews-loading", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_components25.Spinner, {}) }) }); 15234 } 15235 const ViewComponent = VIEW_LAYOUTS.find( 15236 (v2) => v2.type === view.type && defaultLayouts2[v2.type] 15237 )?.component; 15238 return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "dataviews-layout__container", ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)( 15239 ViewComponent, 15240 { 15241 className, 15242 actions, 15243 data, 15244 fields, 15245 getItemId, 15246 getItemLevel, 15247 isLoading, 15248 onChangeView, 15249 onChangeSelection, 15250 selection, 15251 setOpenedFilter, 15252 onClickItem, 15253 renderItemLink, 15254 isItemClickable, 15255 view, 15256 empty 15257 } 15258 ) }); 15259 } 15260 15261 // packages/dataviews/build-module/components/dataviews-footer/index.mjs 15262 var import_element53 = __toESM(require_element(), 1); 15263 var import_jsx_runtime81 = __toESM(require_jsx_runtime(), 1); 15264 var EMPTY_ARRAY5 = []; 15265 function DataViewsFooter() { 15266 const { 15267 view, 15268 paginationInfo: { totalItems = 0, totalPages }, 15269 data, 15270 actions = EMPTY_ARRAY5, 15271 isLoading, 15272 hasInitiallyLoaded 15273 } = (0, import_element53.useContext)(dataviews_context_default); 15274 const isRefreshing = !!isLoading && hasInitiallyLoaded && !!data?.length; 15275 const isDelayedRefreshing = useDelayedLoading(!!isRefreshing); 15276 const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data) && [LAYOUT_TABLE, LAYOUT_GRID].includes(view.type); 15277 if (!isRefreshing && (!totalItems || !totalPages || totalPages <= 1 && !hasBulkActions)) { 15278 return null; 15279 } 15280 return (!!totalItems || isRefreshing) && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)( 15281 "div", 15282 { 15283 className: "dataviews-footer", 15284 inert: isRefreshing ? "true" : void 0, 15285 children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)( 15286 Stack, 15287 { 15288 direction: "row", 15289 justify: "end", 15290 align: "center", 15291 className: clsx_default("dataviews-footer__content", { 15292 "is-refreshing": isDelayedRefreshing 15293 }), 15294 gap: "sm", 15295 children: [ 15296 hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(BulkActionsFooter, {}), 15297 /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(dataviews_pagination_default, {}) 15298 ] 15299 } 15300 ) 15301 } 15302 ); 15303 } 15304 15305 // packages/dataviews/build-module/components/dataviews-search/index.mjs 15306 var import_i18n29 = __toESM(require_i18n(), 1); 15307 var import_element54 = __toESM(require_element(), 1); 15308 var import_components26 = __toESM(require_components(), 1); 15309 var import_compose9 = __toESM(require_compose(), 1); 15310 var import_jsx_runtime82 = __toESM(require_jsx_runtime(), 1); 15311 var DataViewsSearch = (0, import_element54.memo)(function Search({ label }) { 15312 const { view, onChangeView } = (0, import_element54.useContext)(dataviews_context_default); 15313 const [search, setSearch, debouncedSearch] = (0, import_compose9.useDebouncedInput)( 15314 view.search 15315 ); 15316 (0, import_element54.useEffect)(() => { 15317 if (view.search !== debouncedSearch) { 15318 setSearch(view.search ?? ""); 15319 } 15320 }, [view.search, setSearch]); 15321 const onChangeViewRef = (0, import_element54.useRef)(onChangeView); 15322 const viewRef = (0, import_element54.useRef)(view); 15323 (0, import_element54.useEffect)(() => { 15324 onChangeViewRef.current = onChangeView; 15325 viewRef.current = view; 15326 }, [onChangeView, view]); 15327 (0, import_element54.useEffect)(() => { 15328 if (debouncedSearch !== viewRef.current?.search) { 15329 onChangeViewRef.current({ 15330 ...viewRef.current, 15331 page: view.page ? 1 : void 0, 15332 startPosition: view.startPosition ? 1 : void 0, 15333 search: debouncedSearch 15334 }); 15335 } 15336 }, [debouncedSearch]); 15337 const searchLabel = label || (0, import_i18n29.__)("Search"); 15338 return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( 15339 import_components26.SearchControl, 15340 { 15341 className: "dataviews-search", 15342 onChange: setSearch, 15343 value: search, 15344 label: searchLabel, 15345 placeholder: searchLabel, 15346 size: "compact" 15347 } 15348 ); 15349 }); 15350 var dataviews_search_default = DataViewsSearch; 15351 15352 // packages/dataviews/build-module/components/dataviews-view-config/index.mjs 15353 var import_components27 = __toESM(require_components(), 1); 15354 var import_i18n30 = __toESM(require_i18n(), 1); 15355 var import_element55 = __toESM(require_element(), 1); 15356 var import_warning = __toESM(require_warning(), 1); 15357 var import_compose10 = __toESM(require_compose(), 1); 15358 var import_jsx_runtime83 = __toESM(require_jsx_runtime(), 1); 15359 var { Menu: Menu5 } = unlock(import_components27.privateApis); 15360 var DATAVIEWS_CONFIG_POPOVER_PROPS = { 15361 className: "dataviews-config__popover", 15362 placement: "bottom-end", 15363 offset: 9 15364 }; 15365 function ViewTypeMenu() { 15366 const { view, onChangeView, defaultLayouts: defaultLayouts2 } = (0, import_element55.useContext)(dataviews_context_default); 15367 const availableLayouts = Object.keys(defaultLayouts2); 15368 if (availableLayouts.length <= 1) { 15369 return null; 15370 } 15371 const activeView = VIEW_LAYOUTS.find((v2) => view.type === v2.type); 15372 return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(Menu5, { children: [ 15373 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15374 Menu5.TriggerButton, 15375 { 15376 render: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15377 import_components27.Button, 15378 { 15379 size: "compact", 15380 icon: activeView?.icon, 15381 label: (0, import_i18n30.__)("Layout") 15382 } 15383 ) 15384 } 15385 ), 15386 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Menu5.Popover, { children: availableLayouts.map((layout) => { 15387 const config = VIEW_LAYOUTS.find( 15388 (v2) => v2.type === layout 15389 ); 15390 if (!config) { 15391 return null; 15392 } 15393 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15394 Menu5.RadioItem, 15395 { 15396 value: layout, 15397 name: "view-actions-available-view", 15398 checked: layout === view.type, 15399 hideOnClick: true, 15400 onChange: (e2) => { 15401 switch (e2.target.value) { 15402 case "list": 15403 case "grid": 15404 case "table": 15405 case "pickerGrid": 15406 case "pickerTable": 15407 case "activity": 15408 const viewWithoutLayout = { ...view }; 15409 if ("layout" in viewWithoutLayout) { 15410 delete viewWithoutLayout.layout; 15411 } 15412 return onChangeView({ 15413 ...viewWithoutLayout, 15414 type: e2.target.value, 15415 ...defaultLayouts2[e2.target.value] 15416 }); 15417 } 15418 (0, import_warning.default)("Invalid dataview"); 15419 }, 15420 children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Menu5.ItemLabel, { children: config.label }) 15421 }, 15422 layout 15423 ); 15424 }) }) 15425 ] }); 15426 } 15427 function SortFieldControl() { 15428 const { view, fields, onChangeView } = (0, import_element55.useContext)(dataviews_context_default); 15429 const orderOptions = (0, import_element55.useMemo)(() => { 15430 const sortableFields = fields.filter( 15431 (field) => field.enableSorting !== false 15432 ); 15433 return sortableFields.map((field) => { 15434 return { 15435 label: field.label, 15436 value: field.id 15437 }; 15438 }); 15439 }, [fields]); 15440 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15441 import_components27.SelectControl, 15442 { 15443 __next40pxDefaultSize: true, 15444 label: (0, import_i18n30.__)("Sort by"), 15445 value: view.sort?.field, 15446 options: orderOptions, 15447 onChange: (value) => { 15448 onChangeView({ 15449 ...view, 15450 sort: { 15451 direction: view?.sort?.direction || "desc", 15452 field: value 15453 }, 15454 showLevels: false 15455 }); 15456 } 15457 } 15458 ); 15459 } 15460 function SortDirectionControl() { 15461 const { view, fields, onChangeView } = (0, import_element55.useContext)(dataviews_context_default); 15462 const sortableFields = fields.filter( 15463 (field) => field.enableSorting !== false 15464 ); 15465 if (sortableFields.length === 0) { 15466 return null; 15467 } 15468 let value = view.sort?.direction; 15469 if (!value && view.sort?.field) { 15470 value = "desc"; 15471 } 15472 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15473 import_components27.__experimentalToggleGroupControl, 15474 { 15475 className: "dataviews-view-config__sort-direction", 15476 __next40pxDefaultSize: true, 15477 isBlock: true, 15478 label: (0, import_i18n30.__)("Order"), 15479 value, 15480 onChange: (newDirection) => { 15481 if (newDirection === "asc" || newDirection === "desc") { 15482 onChangeView({ 15483 ...view, 15484 sort: { 15485 direction: newDirection, 15486 field: view.sort?.field || // If there is no field assigned as the sorting field assign the first sortable field. 15487 fields.find( 15488 (field) => field.enableSorting !== false 15489 )?.id || "" 15490 }, 15491 showLevels: false 15492 }); 15493 return; 15494 } 15495 (0, import_warning.default)("Invalid direction"); 15496 }, 15497 children: SORTING_DIRECTIONS.map((direction) => { 15498 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15499 import_components27.__experimentalToggleGroupControlOptionIcon, 15500 { 15501 value: direction, 15502 icon: sortIcons[direction], 15503 label: sortLabels[direction] 15504 }, 15505 direction 15506 ); 15507 }) 15508 } 15509 ); 15510 } 15511 function ItemsPerPageControl() { 15512 const { view, config, onChangeView } = (0, import_element55.useContext)(dataviews_context_default); 15513 const { infiniteScrollEnabled } = view; 15514 if (!config || !config.perPageSizes || config.perPageSizes.length < 2 || config.perPageSizes.length > 6 || infiniteScrollEnabled) { 15515 return null; 15516 } 15517 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15518 import_components27.__experimentalToggleGroupControl, 15519 { 15520 __next40pxDefaultSize: true, 15521 isBlock: true, 15522 label: (0, import_i18n30.__)("Items per page"), 15523 value: view.perPage || 10, 15524 disabled: !view?.sort?.field, 15525 onChange: (newItemsPerPage) => { 15526 const newItemsPerPageNumber = typeof newItemsPerPage === "number" || newItemsPerPage === void 0 ? newItemsPerPage : parseInt(newItemsPerPage, 10); 15527 onChangeView({ 15528 ...view, 15529 perPage: newItemsPerPageNumber, 15530 page: 1 15531 }); 15532 }, 15533 children: config.perPageSizes.map((value) => { 15534 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15535 import_components27.__experimentalToggleGroupControlOption, 15536 { 15537 value, 15538 label: value.toString() 15539 }, 15540 value 15541 ); 15542 }) 15543 } 15544 ); 15545 } 15546 function ResetViewButton() { 15547 const { onReset } = (0, import_element55.useContext)(dataviews_context_default); 15548 if (onReset === void 0) { 15549 return null; 15550 } 15551 const isDisabled = onReset === false; 15552 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15553 import_components27.Button, 15554 { 15555 variant: "tertiary", 15556 size: "compact", 15557 disabled: isDisabled, 15558 accessibleWhenDisabled: true, 15559 className: "dataviews-view-config__reset-button", 15560 onClick: () => { 15561 if (typeof onReset === "function") { 15562 onReset(); 15563 } 15564 }, 15565 children: (0, import_i18n30.__)("Reset view") 15566 } 15567 ); 15568 } 15569 function DataviewsViewConfigDropdown() { 15570 const { view, onReset } = (0, import_element55.useContext)(dataviews_context_default); 15571 const popoverId = (0, import_compose10.useInstanceId)( 15572 _DataViewsViewConfig, 15573 "dataviews-view-config-dropdown" 15574 ); 15575 const activeLayout = VIEW_LAYOUTS.find( 15576 (layout) => layout.type === view.type 15577 ); 15578 const isModified = typeof onReset === "function"; 15579 return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15580 import_components27.Dropdown, 15581 { 15582 expandOnMobile: true, 15583 popoverProps: { 15584 ...DATAVIEWS_CONFIG_POPOVER_PROPS, 15585 id: popoverId 15586 }, 15587 renderToggle: ({ onToggle, isOpen }) => { 15588 return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "dataviews-view-config__toggle-wrapper", children: [ 15589 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15590 import_components27.Button, 15591 { 15592 size: "compact", 15593 icon: cog_default, 15594 label: (0, import_i18n30._x)( 15595 "View options", 15596 "View is used as a noun" 15597 ), 15598 onClick: onToggle, 15599 "aria-expanded": isOpen ? "true" : "false", 15600 "aria-controls": popoverId 15601 } 15602 ), 15603 isModified && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "dataviews-view-config__modified-indicator" }) 15604 ] }); 15605 }, 15606 renderContent: () => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15607 import_components27.__experimentalDropdownContentWrapper, 15608 { 15609 paddingSize: "medium", 15610 className: "dataviews-config__popover-content-wrapper", 15611 children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)( 15612 Stack, 15613 { 15614 direction: "column", 15615 className: "dataviews-view-config", 15616 gap: "xl", 15617 children: [ 15618 /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)( 15619 Stack, 15620 { 15621 direction: "row", 15622 justify: "space-between", 15623 align: "center", 15624 className: "dataviews-view-config__header", 15625 children: [ 15626 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( 15627 import_components27.__experimentalHeading, 15628 { 15629 level: 2, 15630 className: "dataviews-settings-section__title", 15631 children: (0, import_i18n30.__)("Appearance") 15632 } 15633 ), 15634 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ResetViewButton, {}) 15635 ] 15636 } 15637 ), 15638 /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(Stack, { direction: "column", gap: "lg", children: [ 15639 /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)( 15640 Stack, 15641 { 15642 direction: "row", 15643 gap: "sm", 15644 className: "dataviews-view-config__sort-controls", 15645 children: [ 15646 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SortFieldControl, {}), 15647 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SortDirectionControl, {}) 15648 ] 15649 } 15650 ), 15651 !!activeLayout?.viewConfigOptions && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(activeLayout.viewConfigOptions, {}), 15652 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ItemsPerPageControl, {}), 15653 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(PropertiesSection, {}) 15654 ] }) 15655 ] 15656 } 15657 ) 15658 } 15659 ) 15660 } 15661 ); 15662 } 15663 function _DataViewsViewConfig() { 15664 return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(import_jsx_runtime83.Fragment, { children: [ 15665 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ViewTypeMenu, {}), 15666 /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(DataviewsViewConfigDropdown, {}) 15667 ] }); 15668 } 15669 var DataViewsViewConfig = (0, import_element55.memo)(_DataViewsViewConfig); 15670 var dataviews_view_config_default = DataViewsViewConfig; 15671 15672 // packages/dataviews/build-module/components/dataform-controls/checkbox.mjs 15673 var import_components28 = __toESM(require_components(), 1); 15674 var import_element56 = __toESM(require_element(), 1); 15675 15676 // packages/dataviews/build-module/components/dataform-controls/utils/get-custom-validity.mjs 15677 function getCustomValidity(isValid2, validity) { 15678 let customValidity; 15679 if (isValid2?.required && validity?.required) { 15680 customValidity = validity?.required?.message ? validity.required : void 0; 15681 } else if (isValid2?.pattern && validity?.pattern) { 15682 customValidity = validity.pattern; 15683 } else if (isValid2?.min && validity?.min) { 15684 customValidity = validity.min; 15685 } else if (isValid2?.max && validity?.max) { 15686 customValidity = validity.max; 15687 } else if (isValid2?.minLength && validity?.minLength) { 15688 customValidity = validity.minLength; 15689 } else if (isValid2?.maxLength && validity?.maxLength) { 15690 customValidity = validity.maxLength; 15691 } else if (isValid2?.elements && validity?.elements) { 15692 customValidity = validity.elements; 15693 } else if (validity?.custom) { 15694 customValidity = validity.custom; 15695 } 15696 return customValidity; 15697 } 15698 15699 // packages/dataviews/build-module/components/dataform-controls/checkbox.mjs 15700 var import_jsx_runtime84 = __toESM(require_jsx_runtime(), 1); 15701 var { ValidatedCheckboxControl } = unlock(import_components28.privateApis); 15702 function Checkbox({ 15703 field, 15704 onChange, 15705 data, 15706 hideLabelFromVision, 15707 markWhenOptional, 15708 validity 15709 }) { 15710 const { getValue, setValue, label, description, isValid: isValid2 } = field; 15711 const disabled2 = field.isDisabled({ item: data, field }); 15712 const onChangeControl = (0, import_element56.useCallback)(() => { 15713 onChange( 15714 setValue({ item: data, value: !getValue({ item: data }) }) 15715 ); 15716 }, [data, getValue, onChange, setValue]); 15717 return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)( 15718 ValidatedCheckboxControl, 15719 { 15720 required: !!field.isValid?.required, 15721 markWhenOptional, 15722 customValidity: getCustomValidity(isValid2, validity), 15723 hidden: hideLabelFromVision, 15724 label, 15725 help: description, 15726 checked: getValue({ item: data }), 15727 onChange: onChangeControl, 15728 disabled: disabled2 15729 } 15730 ); 15731 } 15732 15733 // packages/dataviews/build-module/components/dataform-controls/combobox.mjs 15734 var import_components29 = __toESM(require_components(), 1); 15735 var import_element57 = __toESM(require_element(), 1); 15736 var import_jsx_runtime85 = __toESM(require_jsx_runtime(), 1); 15737 var { ValidatedComboboxControl } = unlock(import_components29.privateApis); 15738 function Combobox3({ 15739 data, 15740 field, 15741 onChange, 15742 hideLabelFromVision, 15743 validity 15744 }) { 15745 const { label, description, placeholder, getValue, setValue, isValid: isValid2 } = field; 15746 const value = getValue({ item: data }) ?? ""; 15747 const onChangeControl = (0, import_element57.useCallback)( 15748 (newValue) => onChange(setValue({ item: data, value: newValue ?? "" })), 15749 [data, onChange, setValue] 15750 ); 15751 const { elements, isLoading } = useElements({ 15752 elements: field.elements, 15753 getElements: field.getElements 15754 }); 15755 if (isLoading) { 15756 return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_components29.Spinner, {}); 15757 } 15758 return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)( 15759 ValidatedComboboxControl, 15760 { 15761 required: !!field.isValid?.required, 15762 customValidity: getCustomValidity(isValid2, validity), 15763 label, 15764 value, 15765 help: description, 15766 placeholder, 15767 options: elements, 15768 onChange: onChangeControl, 15769 hideLabelFromVision, 15770 allowReset: true, 15771 expandOnFocus: true 15772 } 15773 ); 15774 } 15775 15776 // packages/dataviews/build-module/components/dataform-controls/datetime.mjs 15777 var import_components31 = __toESM(require_components(), 1); 15778 var import_element60 = __toESM(require_element(), 1); 15779 var import_i18n32 = __toESM(require_i18n(), 1); 15780 var import_date3 = __toESM(require_date(), 1); 15781 15782 // packages/dataviews/build-module/components/dataform-controls/utils/relative-date-control.mjs 15783 var import_components30 = __toESM(require_components(), 1); 15784 var import_element58 = __toESM(require_element(), 1); 15785 var import_i18n31 = __toESM(require_i18n(), 1); 15786 var import_jsx_runtime86 = __toESM(require_jsx_runtime(), 1); 15787 var TIME_UNITS_OPTIONS = { 15788 [OPERATOR_IN_THE_PAST]: [ 15789 { value: "days", label: (0, import_i18n31.__)("Days") }, 15790 { value: "weeks", label: (0, import_i18n31.__)("Weeks") }, 15791 { value: "months", label: (0, import_i18n31.__)("Months") }, 15792 { value: "years", label: (0, import_i18n31.__)("Years") } 15793 ], 15794 [OPERATOR_OVER]: [ 15795 { value: "days", label: (0, import_i18n31.__)("Days ago") }, 15796 { value: "weeks", label: (0, import_i18n31.__)("Weeks ago") }, 15797 { value: "months", label: (0, import_i18n31.__)("Months ago") }, 15798 { value: "years", label: (0, import_i18n31.__)("Years ago") } 15799 ] 15800 }; 15801 function RelativeDateControl({ 15802 className, 15803 data, 15804 field, 15805 onChange, 15806 hideLabelFromVision, 15807 operator 15808 }) { 15809 const options = TIME_UNITS_OPTIONS[operator === OPERATOR_IN_THE_PAST ? "inThePast" : "over"]; 15810 const { id, label, description, getValue, setValue } = field; 15811 const disabled2 = field.isDisabled({ item: data, field }); 15812 const fieldValue = getValue({ item: data }); 15813 const { value: relValue = "", unit = options[0].value } = fieldValue && typeof fieldValue === "object" ? fieldValue : {}; 15814 const onChangeValue = (0, import_element58.useCallback)( 15815 (newValue) => onChange( 15816 setValue({ 15817 item: data, 15818 value: { value: Number(newValue), unit } 15819 }) 15820 ), 15821 [onChange, setValue, data, unit] 15822 ); 15823 const onChangeUnit = (0, import_element58.useCallback)( 15824 (newUnit) => onChange( 15825 setValue({ 15826 item: data, 15827 value: { value: relValue, unit: newUnit } 15828 }) 15829 ), 15830 [onChange, setValue, data, relValue] 15831 ); 15832 return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( 15833 import_components30.BaseControl, 15834 { 15835 id, 15836 className: clsx_default(className, "dataviews-controls__relative-date"), 15837 label, 15838 hideLabelFromVision, 15839 help: description, 15840 children: /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(Stack, { direction: "row", gap: "sm", children: [ 15841 /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( 15842 import_components30.__experimentalNumberControl, 15843 { 15844 __next40pxDefaultSize: true, 15845 className: "dataviews-controls__relative-date-number", 15846 spinControls: "none", 15847 min: 1, 15848 step: 1, 15849 value: relValue, 15850 onChange: onChangeValue, 15851 disabled: disabled2 15852 } 15853 ), 15854 /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( 15855 import_components30.SelectControl, 15856 { 15857 className: "dataviews-controls__relative-date-unit", 15858 __next40pxDefaultSize: true, 15859 label: (0, import_i18n31.__)("Unit"), 15860 value: unit, 15861 options, 15862 onChange: onChangeUnit, 15863 hideLabelFromVision: true, 15864 disabled: disabled2 15865 } 15866 ) 15867 ] }) 15868 } 15869 ); 15870 } 15871 15872 // packages/dataviews/build-module/components/dataform-controls/utils/use-disabled-date-matchers.mjs 15873 var import_element59 = __toESM(require_element(), 1); 15874 function useDisabledDateMatchers(isValid2, parseDateFn) { 15875 const minConstraint = typeof isValid2.min?.constraint === "string" ? isValid2.min.constraint : void 0; 15876 const maxConstraint = typeof isValid2.max?.constraint === "string" ? isValid2.max.constraint : void 0; 15877 const disabledMatchers = (0, import_element59.useMemo)(() => { 15878 const matchers = []; 15879 if (minConstraint) { 15880 const minDate = parseDateFn(minConstraint); 15881 if (minDate) { 15882 matchers.push({ before: minDate }); 15883 } 15884 } 15885 if (maxConstraint) { 15886 const maxDate = parseDateFn(maxConstraint); 15887 if (maxDate) { 15888 matchers.push({ after: maxDate }); 15889 } 15890 } 15891 return matchers.length > 0 ? matchers : void 0; 15892 }, [minConstraint, maxConstraint, parseDateFn]); 15893 return { minConstraint, maxConstraint, disabledMatchers }; 15894 } 15895 15896 // packages/dataviews/build-module/field-types/utils/parse-date-time.mjs 15897 var import_date2 = __toESM(require_date(), 1); 15898 function parseDateTime(dateTimeString) { 15899 if (!dateTimeString) { 15900 return null; 15901 } 15902 const parsed = (0, import_date2.getDate)(dateTimeString); 15903 return parsed && isValid(parsed) ? parsed : null; 15904 } 15905 15906 // packages/dataviews/build-module/components/dataform-controls/datetime.mjs 15907 var import_jsx_runtime87 = __toESM(require_jsx_runtime(), 1); 15908 var { DateCalendar, ValidatedInputControl } = unlock(import_components31.privateApis); 15909 var formatDateTime = (value) => { 15910 if (!value) { 15911 return ""; 15912 } 15913 return (0, import_date3.dateI18n)("Y-m-d\\TH:i", (0, import_date3.getDate)(value)); 15914 }; 15915 function CalendarDateTimeControl({ 15916 data, 15917 field, 15918 onChange, 15919 hideLabelFromVision, 15920 markWhenOptional, 15921 validity, 15922 config 15923 }) { 15924 const { compact } = config || {}; 15925 const { id, label, description, setValue, getValue, isValid: isValid2 } = field; 15926 const disabled2 = field.isDisabled({ item: data, field }); 15927 const fieldValue = getValue({ item: data }); 15928 const value = typeof fieldValue === "string" ? fieldValue : void 0; 15929 const [calendarMonth, setCalendarMonth] = (0, import_element60.useState)(() => { 15930 const parsedDate = parseDateTime(value); 15931 return parsedDate || /* @__PURE__ */ new Date(); 15932 }); 15933 const inputControlRef = (0, import_element60.useRef)(null); 15934 const validationTimeoutRef = (0, import_element60.useRef)(void 0); 15935 const previousFocusRef = (0, import_element60.useRef)(null); 15936 const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDateTime); 15937 const onChangeCallback = (0, import_element60.useCallback)( 15938 (newValue) => onChange(setValue({ item: data, value: newValue })), 15939 [data, onChange, setValue] 15940 ); 15941 (0, import_element60.useEffect)(() => { 15942 return () => { 15943 if (validationTimeoutRef.current) { 15944 clearTimeout(validationTimeoutRef.current); 15945 } 15946 }; 15947 }, []); 15948 const onSelectDate = (0, import_element60.useCallback)( 15949 (newDate) => { 15950 let dateTimeValue; 15951 if (newDate) { 15952 const wpDate = (0, import_date3.dateI18n)("Y-m-d", newDate); 15953 let wpTime; 15954 if (value) { 15955 wpTime = (0, import_date3.dateI18n)("H:i", (0, import_date3.getDate)(value)); 15956 } else { 15957 wpTime = (0, import_date3.dateI18n)("H:i", newDate); 15958 } 15959 const finalDateTime = (0, import_date3.getDate)(`$wpDate}T$wpTime}`); 15960 dateTimeValue = finalDateTime.toISOString(); 15961 onChangeCallback(dateTimeValue); 15962 if (validationTimeoutRef.current) { 15963 clearTimeout(validationTimeoutRef.current); 15964 } 15965 } else { 15966 onChangeCallback(void 0); 15967 } 15968 previousFocusRef.current = inputControlRef.current && inputControlRef.current.ownerDocument.activeElement; 15969 validationTimeoutRef.current = setTimeout(() => { 15970 if (inputControlRef.current) { 15971 inputControlRef.current.focus(); 15972 inputControlRef.current.blur(); 15973 onChangeCallback(dateTimeValue); 15974 if (previousFocusRef.current && previousFocusRef.current instanceof HTMLElement) { 15975 previousFocusRef.current.focus(); 15976 } 15977 } 15978 }, 0); 15979 }, 15980 [onChangeCallback, value] 15981 ); 15982 const handleManualDateTimeChange = (0, import_element60.useCallback)( 15983 (newValue) => { 15984 if (newValue) { 15985 const dateTime = (0, import_date3.getDate)(newValue); 15986 onChangeCallback(dateTime.toISOString()); 15987 const parsedDate = parseDateTime(dateTime.toISOString()); 15988 if (parsedDate) { 15989 setCalendarMonth(parsedDate); 15990 } 15991 } else { 15992 onChangeCallback(void 0); 15993 } 15994 }, 15995 [onChangeCallback] 15996 ); 15997 const { format: fieldFormat } = field; 15998 const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date3.getSettings)().l10n.startOfWeek; 15999 const { 16000 timezone: { string: timezoneString } 16001 } = (0, import_date3.getSettings)(); 16002 let displayLabel = label; 16003 if (isValid2?.required && !markWhenOptional && !hideLabelFromVision) { 16004 displayLabel = `$label} (${(0, import_i18n32.__)("Required")})`; 16005 } else if (!isValid2?.required && markWhenOptional && !hideLabelFromVision) { 16006 displayLabel = `$label} (${(0, import_i18n32.__)("Optional")})`; 16007 } 16008 return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)( 16009 import_components31.BaseControl, 16010 { 16011 id, 16012 label: displayLabel, 16013 help: description, 16014 hideLabelFromVision, 16015 children: /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(Stack, { direction: "column", gap: "lg", children: [ 16016 /* @__PURE__ */ (0, import_jsx_runtime87.jsx)( 16017 ValidatedInputControl, 16018 { 16019 ref: inputControlRef, 16020 __next40pxDefaultSize: true, 16021 required: !!isValid2?.required, 16022 customValidity: getCustomValidity(isValid2, validity), 16023 type: "datetime-local", 16024 label: (0, import_i18n32.__)("Date time"), 16025 hideLabelFromVision: true, 16026 value: formatDateTime(value), 16027 onChange: handleManualDateTimeChange, 16028 disabled: disabled2, 16029 min: minConstraint ? formatDateTime(minConstraint) : void 0, 16030 max: maxConstraint ? formatDateTime(maxConstraint) : void 0 16031 } 16032 ), 16033 !compact && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)( 16034 DateCalendar, 16035 { 16036 style: { width: "100%" }, 16037 selected: value ? parseDateTime(value) || void 0 : void 0, 16038 onSelect: onSelectDate, 16039 month: calendarMonth, 16040 onMonthChange: setCalendarMonth, 16041 timeZone: timezoneString || void 0, 16042 weekStartsOn, 16043 disabled: disabled2 || disabledMatchers 16044 } 16045 ) 16046 ] }) 16047 } 16048 ); 16049 } 16050 function DateTime({ 16051 data, 16052 field, 16053 onChange, 16054 hideLabelFromVision, 16055 markWhenOptional, 16056 operator, 16057 validity, 16058 config 16059 }) { 16060 if (operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER) { 16061 return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)( 16062 RelativeDateControl, 16063 { 16064 className: "dataviews-controls__datetime", 16065 data, 16066 field, 16067 onChange, 16068 hideLabelFromVision, 16069 operator 16070 } 16071 ); 16072 } 16073 return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)( 16074 CalendarDateTimeControl, 16075 { 16076 data, 16077 field, 16078 onChange, 16079 hideLabelFromVision, 16080 markWhenOptional, 16081 validity, 16082 config 16083 } 16084 ); 16085 } 16086 16087 // packages/dataviews/build-module/components/dataform-controls/date.mjs 16088 var import_components32 = __toESM(require_components(), 1); 16089 var import_element61 = __toESM(require_element(), 1); 16090 var import_i18n33 = __toESM(require_i18n(), 1); 16091 var import_date4 = __toESM(require_date(), 1); 16092 var import_jsx_runtime88 = __toESM(require_jsx_runtime(), 1); 16093 var { DateCalendar: DateCalendar2, DateRangeCalendar } = unlock(import_components32.privateApis); 16094 var DATE_PRESETS = [ 16095 { 16096 id: "today", 16097 label: (0, import_i18n33.__)("Today"), 16098 getValue: () => (0, import_date4.getDate)(null) 16099 }, 16100 { 16101 id: "yesterday", 16102 label: (0, import_i18n33.__)("Yesterday"), 16103 getValue: () => { 16104 const today = (0, import_date4.getDate)(null); 16105 return subDays(today, 1); 16106 } 16107 }, 16108 { 16109 id: "past-week", 16110 label: (0, import_i18n33.__)("Past week"), 16111 getValue: () => { 16112 const today = (0, import_date4.getDate)(null); 16113 return subDays(today, 7); 16114 } 16115 }, 16116 { 16117 id: "past-month", 16118 label: (0, import_i18n33.__)("Past month"), 16119 getValue: () => { 16120 const today = (0, import_date4.getDate)(null); 16121 return subMonths(today, 1); 16122 } 16123 } 16124 ]; 16125 var DATE_RANGE_PRESETS = [ 16126 { 16127 id: "last-7-days", 16128 label: (0, import_i18n33.__)("Last 7 days"), 16129 getValue: () => { 16130 const today = (0, import_date4.getDate)(null); 16131 return [subDays(today, 7), today]; 16132 } 16133 }, 16134 { 16135 id: "last-30-days", 16136 label: (0, import_i18n33.__)("Last 30 days"), 16137 getValue: () => { 16138 const today = (0, import_date4.getDate)(null); 16139 return [subDays(today, 30), today]; 16140 } 16141 }, 16142 { 16143 id: "month-to-date", 16144 label: (0, import_i18n33.__)("Month to date"), 16145 getValue: () => { 16146 const today = (0, import_date4.getDate)(null); 16147 return [startOfMonth(today), today]; 16148 } 16149 }, 16150 { 16151 id: "last-year", 16152 label: (0, import_i18n33.__)("Last year"), 16153 getValue: () => { 16154 const today = (0, import_date4.getDate)(null); 16155 return [subYears(today, 1), today]; 16156 } 16157 }, 16158 { 16159 id: "year-to-date", 16160 label: (0, import_i18n33.__)("Year to date"), 16161 getValue: () => { 16162 const today = (0, import_date4.getDate)(null); 16163 return [startOfYear(today), today]; 16164 } 16165 } 16166 ]; 16167 var parseDate = (dateString) => { 16168 if (!dateString) { 16169 return null; 16170 } 16171 const parsed = (0, import_date4.getDate)(dateString); 16172 return parsed && isValid(parsed) ? parsed : null; 16173 }; 16174 var formatDate = (date) => { 16175 if (!date) { 16176 return ""; 16177 } 16178 return typeof date === "string" ? date : format(date, "yyyy-MM-dd"); 16179 }; 16180 function ValidatedDateControl({ 16181 field, 16182 validity, 16183 inputRefs, 16184 isTouched, 16185 setIsTouched, 16186 children 16187 }) { 16188 const { isValid: isValid2 } = field; 16189 const [customValidity, setCustomValidity] = (0, import_element61.useState)(void 0); 16190 const validateRefs = (0, import_element61.useCallback)(() => { 16191 const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; 16192 for (const ref of refs) { 16193 const input = ref.current; 16194 if (input && !input.validity.valid) { 16195 setCustomValidity({ 16196 type: "invalid", 16197 message: input.validationMessage 16198 }); 16199 return; 16200 } 16201 } 16202 setCustomValidity(void 0); 16203 }, [inputRefs]); 16204 (0, import_element61.useEffect)(() => { 16205 const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; 16206 const result = validity ? getCustomValidity(isValid2, validity) : void 0; 16207 for (const ref of refs) { 16208 const input = ref.current; 16209 if (input) { 16210 input.setCustomValidity( 16211 result?.type === "invalid" && result.message ? result.message : "" 16212 ); 16213 } 16214 } 16215 }, [inputRefs, isValid2, validity]); 16216 (0, import_element61.useEffect)(() => { 16217 const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; 16218 const handleInvalid = (event) => { 16219 event.preventDefault(); 16220 setIsTouched(true); 16221 }; 16222 for (const ref of refs) { 16223 ref.current?.addEventListener("invalid", handleInvalid); 16224 } 16225 return () => { 16226 for (const ref of refs) { 16227 ref.current?.removeEventListener("invalid", handleInvalid); 16228 } 16229 }; 16230 }, [inputRefs, setIsTouched]); 16231 (0, import_element61.useEffect)(() => { 16232 if (!isTouched) { 16233 return; 16234 } 16235 const result = validity ? getCustomValidity(isValid2, validity) : void 0; 16236 if (result) { 16237 setCustomValidity(result); 16238 } else { 16239 validateRefs(); 16240 } 16241 }, [isTouched, isValid2, validity, validateRefs]); 16242 const onBlur = (event) => { 16243 if (isTouched) { 16244 return; 16245 } 16246 if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) { 16247 setIsTouched(true); 16248 } 16249 }; 16250 return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { onBlur, children: [ 16251 children, 16252 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { "aria-live": "polite", children: customValidity && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)( 16253 "p", 16254 { 16255 className: clsx_default( 16256 "components-validated-control__indicator", 16257 customValidity.type === "invalid" ? "is-invalid" : void 0 16258 ), 16259 children: [ 16260 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16261 import_components32.Icon, 16262 { 16263 className: "components-validated-control__indicator-icon", 16264 icon: error_default, 16265 size: 16, 16266 fill: "currentColor" 16267 } 16268 ), 16269 customValidity.message 16270 ] 16271 } 16272 ) }) 16273 ] }); 16274 } 16275 function CalendarDateControl({ 16276 data, 16277 field, 16278 onChange, 16279 hideLabelFromVision, 16280 markWhenOptional, 16281 validity 16282 }) { 16283 const { 16284 id, 16285 label, 16286 description, 16287 setValue, 16288 getValue, 16289 isValid: isValid2, 16290 format: fieldFormat 16291 } = field; 16292 const disabled2 = field.isDisabled({ item: data, field }); 16293 const [selectedPresetId, setSelectedPresetId] = (0, import_element61.useState)( 16294 null 16295 ); 16296 const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date4.getSettings)().l10n.startOfWeek; 16297 const fieldValue = getValue({ item: data }); 16298 const value = typeof fieldValue === "string" ? fieldValue : void 0; 16299 const [calendarMonth, setCalendarMonth] = (0, import_element61.useState)(() => { 16300 const parsedDate = parseDate(value); 16301 return parsedDate || /* @__PURE__ */ new Date(); 16302 }); 16303 const [isTouched, setIsTouched] = (0, import_element61.useState)(false); 16304 const validityTargetRef = (0, import_element61.useRef)(null); 16305 const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDate); 16306 const onChangeCallback = (0, import_element61.useCallback)( 16307 (newValue) => onChange(setValue({ item: data, value: newValue })), 16308 [data, onChange, setValue] 16309 ); 16310 const onSelectDate = (0, import_element61.useCallback)( 16311 (newDate) => { 16312 const dateValue = newDate ? format(newDate, "yyyy-MM-dd") : void 0; 16313 onChangeCallback(dateValue); 16314 setSelectedPresetId(null); 16315 setIsTouched(true); 16316 }, 16317 [onChangeCallback] 16318 ); 16319 const handlePresetClick = (0, import_element61.useCallback)( 16320 (preset) => { 16321 const presetDate = preset.getValue(); 16322 const dateValue = formatDate(presetDate); 16323 setCalendarMonth(presetDate); 16324 onChangeCallback(dateValue); 16325 setSelectedPresetId(preset.id); 16326 setIsTouched(true); 16327 }, 16328 [onChangeCallback] 16329 ); 16330 const handleManualDateChange = (0, import_element61.useCallback)( 16331 (newValue) => { 16332 onChangeCallback(newValue); 16333 if (newValue) { 16334 const parsedDate = parseDate(newValue); 16335 if (parsedDate) { 16336 setCalendarMonth(parsedDate); 16337 } 16338 } 16339 setSelectedPresetId(null); 16340 setIsTouched(true); 16341 }, 16342 [onChangeCallback] 16343 ); 16344 const { 16345 timezone: { string: timezoneString } 16346 } = (0, import_date4.getSettings)(); 16347 let displayLabel = label; 16348 if (isValid2?.required && !markWhenOptional) { 16349 displayLabel = `$label} (${(0, import_i18n33.__)("Required")})`; 16350 } else if (!isValid2?.required && markWhenOptional) { 16351 displayLabel = `$label} (${(0, import_i18n33.__)("Optional")})`; 16352 } 16353 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16354 ValidatedDateControl, 16355 { 16356 field, 16357 validity, 16358 inputRefs: validityTargetRef, 16359 isTouched, 16360 setIsTouched, 16361 children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16362 import_components32.BaseControl, 16363 { 16364 id, 16365 className: "dataviews-controls__date", 16366 label: displayLabel, 16367 help: description, 16368 hideLabelFromVision, 16369 children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Stack, { direction: "column", gap: "lg", children: [ 16370 /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)( 16371 Stack, 16372 { 16373 direction: "row", 16374 gap: "sm", 16375 wrap: "wrap", 16376 justify: "flex-start", 16377 children: [ 16378 DATE_PRESETS.map((preset) => { 16379 const isSelected2 = selectedPresetId === preset.id; 16380 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16381 import_components32.Button, 16382 { 16383 className: "dataviews-controls__date-preset", 16384 variant: "tertiary", 16385 isPressed: isSelected2, 16386 size: "small", 16387 disabled: disabled2, 16388 accessibleWhenDisabled: true, 16389 onClick: () => handlePresetClick(preset), 16390 children: preset.label 16391 }, 16392 preset.id 16393 ); 16394 }), 16395 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16396 import_components32.Button, 16397 { 16398 className: "dataviews-controls__date-preset", 16399 variant: "tertiary", 16400 isPressed: !selectedPresetId, 16401 size: "small", 16402 disabled: !!selectedPresetId || disabled2, 16403 accessibleWhenDisabled: true, 16404 children: (0, import_i18n33.__)("Custom") 16405 } 16406 ) 16407 ] 16408 } 16409 ), 16410 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16411 import_components32.__experimentalInputControl, 16412 { 16413 __next40pxDefaultSize: true, 16414 ref: validityTargetRef, 16415 type: "date", 16416 label: (0, import_i18n33.__)("Date"), 16417 hideLabelFromVision: true, 16418 value, 16419 onChange: handleManualDateChange, 16420 required: !!field.isValid?.required, 16421 disabled: disabled2, 16422 min: minConstraint, 16423 max: maxConstraint 16424 } 16425 ), 16426 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16427 DateCalendar2, 16428 { 16429 style: { width: "100%" }, 16430 selected: value ? parseDate(value) || void 0 : void 0, 16431 onSelect: onSelectDate, 16432 month: calendarMonth, 16433 onMonthChange: setCalendarMonth, 16434 timeZone: timezoneString || void 0, 16435 weekStartsOn, 16436 disabled: disabled2 || disabledMatchers, 16437 disableNavigation: disabled2 16438 } 16439 ) 16440 ] }) 16441 } 16442 ) 16443 } 16444 ); 16445 } 16446 function CalendarDateRangeControl({ 16447 data, 16448 field, 16449 onChange, 16450 hideLabelFromVision, 16451 markWhenOptional, 16452 validity 16453 }) { 16454 const { 16455 id, 16456 label, 16457 description, 16458 getValue, 16459 setValue, 16460 isValid: isValid2, 16461 format: fieldFormat 16462 } = field; 16463 const disabled2 = field.isDisabled({ item: data, field }); 16464 let value; 16465 const fieldValue = getValue({ item: data }); 16466 if (Array.isArray(fieldValue) && fieldValue.length === 2 && fieldValue.every((date) => typeof date === "string")) { 16467 value = fieldValue; 16468 } 16469 const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date4.getSettings)().l10n.startOfWeek; 16470 const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDate); 16471 const onChangeCallback = (0, import_element61.useCallback)( 16472 (newValue) => { 16473 onChange( 16474 setValue({ 16475 item: data, 16476 value: newValue 16477 }) 16478 ); 16479 }, 16480 [data, onChange, setValue] 16481 ); 16482 const [selectedPresetId, setSelectedPresetId] = (0, import_element61.useState)( 16483 null 16484 ); 16485 const selectedRange = (0, import_element61.useMemo)(() => { 16486 if (!value) { 16487 return { from: void 0, to: void 0 }; 16488 } 16489 const [from, to] = value; 16490 return { 16491 from: parseDate(from) || void 0, 16492 to: parseDate(to) || void 0 16493 }; 16494 }, [value]); 16495 const [calendarMonth, setCalendarMonth] = (0, import_element61.useState)(() => { 16496 return selectedRange.from || /* @__PURE__ */ new Date(); 16497 }); 16498 const [isTouched, setIsTouched] = (0, import_element61.useState)(false); 16499 const fromInputRef = (0, import_element61.useRef)(null); 16500 const toInputRef = (0, import_element61.useRef)(null); 16501 const updateDateRange = (0, import_element61.useCallback)( 16502 (fromDate, toDate2) => { 16503 if (fromDate && toDate2) { 16504 onChangeCallback([ 16505 formatDate(fromDate), 16506 formatDate(toDate2) 16507 ]); 16508 } else if (!fromDate && !toDate2) { 16509 onChangeCallback(void 0); 16510 } 16511 }, 16512 [onChangeCallback] 16513 ); 16514 const onSelectCalendarRange = (0, import_element61.useCallback)( 16515 (newRange) => { 16516 updateDateRange(newRange?.from, newRange?.to); 16517 setSelectedPresetId(null); 16518 setIsTouched(true); 16519 }, 16520 [updateDateRange] 16521 ); 16522 const handlePresetClick = (0, import_element61.useCallback)( 16523 (preset) => { 16524 const [startDate, endDate] = preset.getValue(); 16525 setCalendarMonth(startDate); 16526 updateDateRange(startDate, endDate); 16527 setSelectedPresetId(preset.id); 16528 setIsTouched(true); 16529 }, 16530 [updateDateRange] 16531 ); 16532 const handleManualDateChange = (0, import_element61.useCallback)( 16533 (fromOrTo, newValue) => { 16534 const [currentFrom, currentTo] = value || [ 16535 void 0, 16536 void 0 16537 ]; 16538 const updatedFrom = fromOrTo === "from" ? newValue : currentFrom; 16539 const updatedTo = fromOrTo === "to" ? newValue : currentTo; 16540 updateDateRange(updatedFrom, updatedTo); 16541 if (newValue) { 16542 const parsedDate = parseDate(newValue); 16543 if (parsedDate) { 16544 setCalendarMonth(parsedDate); 16545 } 16546 } 16547 setSelectedPresetId(null); 16548 setIsTouched(true); 16549 }, 16550 [value, updateDateRange] 16551 ); 16552 const { timezone } = (0, import_date4.getSettings)(); 16553 let displayLabel = label; 16554 if (field.isValid?.required && !markWhenOptional) { 16555 displayLabel = `$label} (${(0, import_i18n33.__)("Required")})`; 16556 } else if (!field.isValid?.required && markWhenOptional) { 16557 displayLabel = `$label} (${(0, import_i18n33.__)("Optional")})`; 16558 } 16559 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16560 ValidatedDateControl, 16561 { 16562 field, 16563 validity, 16564 inputRefs: [fromInputRef, toInputRef], 16565 isTouched, 16566 setIsTouched, 16567 children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16568 import_components32.BaseControl, 16569 { 16570 id, 16571 className: "dataviews-controls__date", 16572 label: displayLabel, 16573 help: description, 16574 hideLabelFromVision, 16575 children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Stack, { direction: "column", gap: "lg", children: [ 16576 /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)( 16577 Stack, 16578 { 16579 direction: "row", 16580 gap: "sm", 16581 wrap: "wrap", 16582 justify: "flex-start", 16583 children: [ 16584 DATE_RANGE_PRESETS.map((preset) => { 16585 const isSelected2 = selectedPresetId === preset.id; 16586 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16587 import_components32.Button, 16588 { 16589 className: "dataviews-controls__date-preset", 16590 variant: "tertiary", 16591 isPressed: isSelected2, 16592 size: "small", 16593 disabled: disabled2, 16594 accessibleWhenDisabled: true, 16595 onClick: () => handlePresetClick(preset), 16596 children: preset.label 16597 }, 16598 preset.id 16599 ); 16600 }), 16601 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16602 import_components32.Button, 16603 { 16604 className: "dataviews-controls__date-preset", 16605 variant: "tertiary", 16606 isPressed: !selectedPresetId, 16607 size: "small", 16608 accessibleWhenDisabled: true, 16609 disabled: !!selectedPresetId || disabled2, 16610 children: (0, import_i18n33.__)("Custom") 16611 } 16612 ) 16613 ] 16614 } 16615 ), 16616 /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)( 16617 Stack, 16618 { 16619 direction: "row", 16620 gap: "sm", 16621 justify: "space-between", 16622 className: "dataviews-controls__date-range-inputs", 16623 children: [ 16624 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16625 import_components32.__experimentalInputControl, 16626 { 16627 __next40pxDefaultSize: true, 16628 ref: fromInputRef, 16629 type: "date", 16630 label: (0, import_i18n33.__)("From"), 16631 hideLabelFromVision: true, 16632 value: value?.[0], 16633 onChange: (newValue) => handleManualDateChange("from", newValue), 16634 required: !!field.isValid?.required, 16635 disabled: disabled2, 16636 min: minConstraint, 16637 max: maxConstraint 16638 } 16639 ), 16640 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16641 import_components32.__experimentalInputControl, 16642 { 16643 __next40pxDefaultSize: true, 16644 ref: toInputRef, 16645 type: "date", 16646 label: (0, import_i18n33.__)("To"), 16647 hideLabelFromVision: true, 16648 value: value?.[1], 16649 onChange: (newValue) => handleManualDateChange("to", newValue), 16650 required: !!field.isValid?.required, 16651 disabled: disabled2, 16652 min: minConstraint, 16653 max: maxConstraint 16654 } 16655 ) 16656 ] 16657 } 16658 ), 16659 /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16660 DateRangeCalendar, 16661 { 16662 style: { width: "100%" }, 16663 selected: selectedRange, 16664 onSelect: onSelectCalendarRange, 16665 month: calendarMonth, 16666 onMonthChange: setCalendarMonth, 16667 timeZone: timezone.string || void 0, 16668 weekStartsOn, 16669 disabled: disabled2 || disabledMatchers 16670 } 16671 ) 16672 ] }) 16673 } 16674 ) 16675 } 16676 ); 16677 } 16678 function DateControl({ 16679 data, 16680 field, 16681 onChange, 16682 hideLabelFromVision, 16683 markWhenOptional, 16684 operator, 16685 validity 16686 }) { 16687 if (operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER) { 16688 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16689 RelativeDateControl, 16690 { 16691 className: "dataviews-controls__date", 16692 data, 16693 field, 16694 onChange, 16695 hideLabelFromVision, 16696 operator 16697 } 16698 ); 16699 } 16700 if (operator === OPERATOR_BETWEEN) { 16701 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16702 CalendarDateRangeControl, 16703 { 16704 data, 16705 field, 16706 onChange, 16707 hideLabelFromVision, 16708 markWhenOptional, 16709 validity 16710 } 16711 ); 16712 } 16713 return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( 16714 CalendarDateControl, 16715 { 16716 data, 16717 field, 16718 onChange, 16719 hideLabelFromVision, 16720 markWhenOptional, 16721 validity 16722 } 16723 ); 16724 } 16725 16726 // packages/dataviews/build-module/components/dataform-controls/select.mjs 16727 var import_components33 = __toESM(require_components(), 1); 16728 var import_element62 = __toESM(require_element(), 1); 16729 var import_jsx_runtime89 = __toESM(require_jsx_runtime(), 1); 16730 var { ValidatedSelectControl } = unlock(import_components33.privateApis); 16731 function Select({ 16732 data, 16733 field, 16734 onChange, 16735 hideLabelFromVision, 16736 markWhenOptional, 16737 validity 16738 }) { 16739 const { type, label, description, getValue, setValue, isValid: isValid2 } = field; 16740 const disabled2 = field.isDisabled({ item: data, field }); 16741 const isMultiple = type === "array"; 16742 const value = getValue({ item: data }) ?? (isMultiple ? [] : ""); 16743 const onChangeControl = (0, import_element62.useCallback)( 16744 (newValue) => onChange(setValue({ item: data, value: newValue })), 16745 [data, onChange, setValue] 16746 ); 16747 const { elements, isLoading } = useElements({ 16748 elements: field.elements, 16749 getElements: field.getElements 16750 }); 16751 if (isLoading) { 16752 return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_components33.Spinner, {}); 16753 } 16754 return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)( 16755 ValidatedSelectControl, 16756 { 16757 required: !!field.isValid?.required, 16758 markWhenOptional, 16759 customValidity: getCustomValidity(isValid2, validity), 16760 label, 16761 value, 16762 help: description, 16763 options: elements, 16764 onChange: onChangeControl, 16765 __next40pxDefaultSize: true, 16766 hideLabelFromVision, 16767 multiple: isMultiple, 16768 disabled: disabled2 16769 } 16770 ); 16771 } 16772 16773 // packages/dataviews/build-module/components/dataform-controls/adaptive-select.mjs 16774 var import_jsx_runtime90 = __toESM(require_jsx_runtime(), 1); 16775 var ELEMENTS_THRESHOLD = 10; 16776 function AdaptiveSelect(props) { 16777 const { field } = props; 16778 const { elements } = useElements({ 16779 elements: field.elements, 16780 getElements: field.getElements 16781 }); 16782 if (elements.length >= ELEMENTS_THRESHOLD) { 16783 return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Combobox3, { ...props }); 16784 } 16785 return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Select, { ...props }); 16786 } 16787 16788 // packages/dataviews/build-module/components/dataform-controls/email.mjs 16789 var import_components35 = __toESM(require_components(), 1); 16790 16791 // packages/dataviews/build-module/components/dataform-controls/utils/validated-input.mjs 16792 var import_components34 = __toESM(require_components(), 1); 16793 var import_element63 = __toESM(require_element(), 1); 16794 var import_jsx_runtime91 = __toESM(require_jsx_runtime(), 1); 16795 var { ValidatedInputControl: ValidatedInputControl2 } = unlock(import_components34.privateApis); 16796 function ValidatedText({ 16797 data, 16798 field, 16799 onChange, 16800 hideLabelFromVision, 16801 markWhenOptional, 16802 type, 16803 prefix, 16804 suffix, 16805 validity 16806 }) { 16807 const { label, placeholder, description, getValue, setValue, isValid: isValid2 } = field; 16808 const value = getValue({ item: data }); 16809 const disabled2 = field.isDisabled({ item: data, field }); 16810 const onChangeControl = (0, import_element63.useCallback)( 16811 (newValue) => onChange( 16812 setValue({ 16813 item: data, 16814 value: newValue 16815 }) 16816 ), 16817 [data, setValue, onChange] 16818 ); 16819 return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)( 16820 ValidatedInputControl2, 16821 { 16822 required: !!isValid2.required, 16823 markWhenOptional, 16824 customValidity: getCustomValidity(isValid2, validity), 16825 label, 16826 placeholder, 16827 value: value ?? "", 16828 help: description, 16829 onChange: onChangeControl, 16830 hideLabelFromVision, 16831 type, 16832 prefix, 16833 suffix, 16834 disabled: disabled2, 16835 pattern: isValid2.pattern ? isValid2.pattern.constraint : void 0, 16836 minLength: isValid2.minLength ? isValid2.minLength.constraint : void 0, 16837 maxLength: isValid2.maxLength ? isValid2.maxLength.constraint : void 0, 16838 __next40pxDefaultSize: true 16839 } 16840 ); 16841 } 16842 16843 // packages/dataviews/build-module/components/dataform-controls/email.mjs 16844 var import_jsx_runtime92 = __toESM(require_jsx_runtime(), 1); 16845 function Email({ 16846 data, 16847 field, 16848 onChange, 16849 hideLabelFromVision, 16850 markWhenOptional, 16851 validity 16852 }) { 16853 return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)( 16854 ValidatedText, 16855 { 16856 ...{ 16857 data, 16858 field, 16859 onChange, 16860 hideLabelFromVision, 16861 markWhenOptional, 16862 validity, 16863 type: "email", 16864 prefix: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_components35.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_components35.Icon, { icon: envelope_default }) }) 16865 } 16866 } 16867 ); 16868 } 16869 16870 // packages/dataviews/build-module/components/dataform-controls/telephone.mjs 16871 var import_components36 = __toESM(require_components(), 1); 16872 var import_jsx_runtime93 = __toESM(require_jsx_runtime(), 1); 16873 function Telephone({ 16874 data, 16875 field, 16876 onChange, 16877 hideLabelFromVision, 16878 markWhenOptional, 16879 validity 16880 }) { 16881 return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)( 16882 ValidatedText, 16883 { 16884 ...{ 16885 data, 16886 field, 16887 onChange, 16888 hideLabelFromVision, 16889 markWhenOptional, 16890 validity, 16891 type: "tel", 16892 prefix: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_components36.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(import_components36.Icon, { icon: mobile_default }) }) 16893 } 16894 } 16895 ); 16896 } 16897 16898 // packages/dataviews/build-module/components/dataform-controls/url.mjs 16899 var import_components37 = __toESM(require_components(), 1); 16900 var import_jsx_runtime94 = __toESM(require_jsx_runtime(), 1); 16901 function Url({ 16902 data, 16903 field, 16904 onChange, 16905 hideLabelFromVision, 16906 markWhenOptional, 16907 validity 16908 }) { 16909 return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)( 16910 ValidatedText, 16911 { 16912 ...{ 16913 data, 16914 field, 16915 onChange, 16916 hideLabelFromVision, 16917 markWhenOptional, 16918 validity, 16919 type: "url", 16920 prefix: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_components37.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_components37.Icon, { icon: link_default }) }) 16921 } 16922 } 16923 ); 16924 } 16925 16926 // packages/dataviews/build-module/components/dataform-controls/utils/validated-number.mjs 16927 var import_components38 = __toESM(require_components(), 1); 16928 var import_element64 = __toESM(require_element(), 1); 16929 var import_i18n34 = __toESM(require_i18n(), 1); 16930 var import_jsx_runtime95 = __toESM(require_jsx_runtime(), 1); 16931 var { ValidatedNumberControl } = unlock(import_components38.privateApis); 16932 function toNumberOrEmpty(value) { 16933 if (value === "" || value === void 0) { 16934 return ""; 16935 } 16936 const number = Number(value); 16937 return Number.isFinite(number) ? number : ""; 16938 } 16939 function BetweenControls({ 16940 value, 16941 onChange, 16942 hideLabelFromVision, 16943 step 16944 }) { 16945 const [min = "", max = ""] = value; 16946 const onChangeMin = (0, import_element64.useCallback)( 16947 (newValue) => onChange([toNumberOrEmpty(newValue), max]), 16948 [onChange, max] 16949 ); 16950 const onChangeMax = (0, import_element64.useCallback)( 16951 (newValue) => onChange([min, toNumberOrEmpty(newValue)]), 16952 [onChange, min] 16953 ); 16954 return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( 16955 import_components38.BaseControl, 16956 { 16957 help: (0, import_i18n34.__)("The max. value must be greater than the min. value."), 16958 children: /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(import_components38.Flex, { direction: "row", gap: 4, children: [ 16959 /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( 16960 import_components38.__experimentalNumberControl, 16961 { 16962 label: (0, import_i18n34.__)("Min."), 16963 value: min, 16964 max: max ? Number(max) - step : void 0, 16965 onChange: onChangeMin, 16966 __next40pxDefaultSize: true, 16967 hideLabelFromVision, 16968 step 16969 } 16970 ), 16971 /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( 16972 import_components38.__experimentalNumberControl, 16973 { 16974 label: (0, import_i18n34.__)("Max."), 16975 value: max, 16976 min: min ? Number(min) + step : void 0, 16977 onChange: onChangeMax, 16978 __next40pxDefaultSize: true, 16979 hideLabelFromVision, 16980 step 16981 } 16982 ) 16983 ] }) 16984 } 16985 ); 16986 } 16987 function ValidatedNumber({ 16988 data, 16989 field, 16990 onChange, 16991 hideLabelFromVision, 16992 markWhenOptional, 16993 operator, 16994 validity 16995 }) { 16996 const decimals = field.format?.decimals ?? 0; 16997 const step = Math.pow(10, Math.abs(decimals) * -1); 16998 const { label, description, getValue, setValue, isValid: isValid2 } = field; 16999 const value = getValue({ item: data }) ?? ""; 17000 const disabled2 = field.isDisabled({ item: data, field }); 17001 const onChangeControl = (0, import_element64.useCallback)( 17002 (newValue) => { 17003 onChange( 17004 setValue({ 17005 item: data, 17006 // Do not convert an empty string or undefined to a number, 17007 // otherwise there's a mismatch between the UI control (empty) 17008 // and the data relied by onChange (0). 17009 value: ["", void 0].includes(newValue) ? void 0 : Number(newValue) 17010 }) 17011 ); 17012 }, 17013 [data, onChange, setValue] 17014 ); 17015 const onChangeBetweenControls = (0, import_element64.useCallback)( 17016 (newValue) => { 17017 onChange( 17018 setValue({ 17019 item: data, 17020 value: newValue 17021 }) 17022 ); 17023 }, 17024 [data, onChange, setValue] 17025 ); 17026 if (operator === OPERATOR_BETWEEN) { 17027 let valueBetween = ["", ""]; 17028 if (Array.isArray(value) && value.length === 2 && value.every( 17029 (element) => typeof element === "number" || element === "" 17030 )) { 17031 valueBetween = value; 17032 } 17033 return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( 17034 BetweenControls, 17035 { 17036 value: valueBetween, 17037 onChange: onChangeBetweenControls, 17038 hideLabelFromVision, 17039 step 17040 } 17041 ); 17042 } 17043 return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( 17044 ValidatedNumberControl, 17045 { 17046 required: !!isValid2.required, 17047 markWhenOptional, 17048 customValidity: getCustomValidity(isValid2, validity), 17049 label, 17050 help: description, 17051 value, 17052 onChange: onChangeControl, 17053 __next40pxDefaultSize: true, 17054 hideLabelFromVision, 17055 step, 17056 min: isValid2.min ? isValid2.min.constraint : void 0, 17057 max: isValid2.max ? isValid2.max.constraint : void 0, 17058 disabled: disabled2 17059 } 17060 ); 17061 } 17062 17063 // packages/dataviews/build-module/components/dataform-controls/integer.mjs 17064 var import_jsx_runtime96 = __toESM(require_jsx_runtime(), 1); 17065 function Integer(props) { 17066 return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(ValidatedNumber, { ...props }); 17067 } 17068 17069 // packages/dataviews/build-module/components/dataform-controls/number.mjs 17070 var import_jsx_runtime97 = __toESM(require_jsx_runtime(), 1); 17071 function Number2(props) { 17072 return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(ValidatedNumber, { ...props }); 17073 } 17074 17075 // packages/dataviews/build-module/components/dataform-controls/radio.mjs 17076 var import_components39 = __toESM(require_components(), 1); 17077 var import_element65 = __toESM(require_element(), 1); 17078 var import_jsx_runtime98 = __toESM(require_jsx_runtime(), 1); 17079 var { ValidatedRadioControl } = unlock(import_components39.privateApis); 17080 function Radio({ 17081 data, 17082 field, 17083 onChange, 17084 hideLabelFromVision, 17085 markWhenOptional, 17086 validity 17087 }) { 17088 const { label, description, getValue, setValue, isValid: isValid2 } = field; 17089 const disabled2 = field.isDisabled({ item: data, field }); 17090 const { elements, isLoading } = useElements({ 17091 elements: field.elements, 17092 getElements: field.getElements 17093 }); 17094 const value = getValue({ item: data }); 17095 const onChangeControl = (0, import_element65.useCallback)( 17096 (newValue) => onChange(setValue({ item: data, value: newValue })), 17097 [data, onChange, setValue] 17098 ); 17099 if (isLoading) { 17100 return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_components39.Spinner, {}); 17101 } 17102 return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)( 17103 ValidatedRadioControl, 17104 { 17105 required: !!field.isValid?.required, 17106 markWhenOptional, 17107 customValidity: getCustomValidity(isValid2, validity), 17108 label, 17109 help: description, 17110 onChange: onChangeControl, 17111 options: elements, 17112 selected: value, 17113 hideLabelFromVision, 17114 disabled: disabled2 17115 } 17116 ); 17117 } 17118 17119 // packages/dataviews/build-module/components/dataform-controls/text.mjs 17120 var import_element66 = __toESM(require_element(), 1); 17121 var import_jsx_runtime99 = __toESM(require_jsx_runtime(), 1); 17122 function Text3({ 17123 data, 17124 field, 17125 onChange, 17126 hideLabelFromVision, 17127 markWhenOptional, 17128 config, 17129 validity 17130 }) { 17131 const { prefix, suffix } = config || {}; 17132 return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)( 17133 ValidatedText, 17134 { 17135 ...{ 17136 data, 17137 field, 17138 onChange, 17139 hideLabelFromVision, 17140 markWhenOptional, 17141 validity, 17142 prefix: prefix ? (0, import_element66.createElement)(prefix) : void 0, 17143 suffix: suffix ? (0, import_element66.createElement)(suffix) : void 0 17144 } 17145 } 17146 ); 17147 } 17148 17149 // packages/dataviews/build-module/components/dataform-controls/toggle.mjs 17150 var import_components40 = __toESM(require_components(), 1); 17151 var import_element67 = __toESM(require_element(), 1); 17152 var import_jsx_runtime100 = __toESM(require_jsx_runtime(), 1); 17153 var { ValidatedToggleControl } = unlock(import_components40.privateApis); 17154 function Toggle({ 17155 field, 17156 onChange, 17157 data, 17158 hideLabelFromVision, 17159 markWhenOptional, 17160 validity 17161 }) { 17162 const { label, description, getValue, setValue, isValid: isValid2 } = field; 17163 const disabled2 = field.isDisabled({ item: data, field }); 17164 const onChangeControl = (0, import_element67.useCallback)(() => { 17165 onChange( 17166 setValue({ item: data, value: !getValue({ item: data }) }) 17167 ); 17168 }, [onChange, setValue, data, getValue]); 17169 return /* @__PURE__ */ (0, import_jsx_runtime100.jsx)( 17170 ValidatedToggleControl, 17171 { 17172 required: !!isValid2.required, 17173 markWhenOptional, 17174 customValidity: getCustomValidity(isValid2, validity), 17175 hidden: hideLabelFromVision, 17176 label, 17177 help: description, 17178 checked: getValue({ item: data }), 17179 onChange: onChangeControl, 17180 disabled: disabled2 17181 } 17182 ); 17183 } 17184 17185 // packages/dataviews/build-module/components/dataform-controls/textarea.mjs 17186 var import_components41 = __toESM(require_components(), 1); 17187 var import_element68 = __toESM(require_element(), 1); 17188 var import_jsx_runtime101 = __toESM(require_jsx_runtime(), 1); 17189 var { ValidatedTextareaControl } = unlock(import_components41.privateApis); 17190 function Textarea({ 17191 data, 17192 field, 17193 onChange, 17194 hideLabelFromVision, 17195 markWhenOptional, 17196 config, 17197 validity 17198 }) { 17199 const { rows = 4 } = config || {}; 17200 const disabled2 = field.isDisabled({ item: data, field }); 17201 const { label, placeholder, description, setValue, isValid: isValid2 } = field; 17202 const value = field.getValue({ item: data }); 17203 const onChangeControl = (0, import_element68.useCallback)( 17204 (newValue) => onChange(setValue({ item: data, value: newValue })), 17205 [data, onChange, setValue] 17206 ); 17207 return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)( 17208 ValidatedTextareaControl, 17209 { 17210 required: !!isValid2.required, 17211 markWhenOptional, 17212 customValidity: getCustomValidity(isValid2, validity), 17213 label, 17214 placeholder, 17215 value: value ?? "", 17216 help: description, 17217 onChange: onChangeControl, 17218 rows, 17219 disabled: disabled2, 17220 minLength: isValid2.minLength ? isValid2.minLength.constraint : void 0, 17221 maxLength: isValid2.maxLength ? isValid2.maxLength.constraint : void 0, 17222 __next40pxDefaultSize: true, 17223 hideLabelFromVision 17224 } 17225 ); 17226 } 17227 17228 // packages/dataviews/build-module/components/dataform-controls/toggle-group.mjs 17229 var import_components42 = __toESM(require_components(), 1); 17230 var import_element69 = __toESM(require_element(), 1); 17231 var import_jsx_runtime102 = __toESM(require_jsx_runtime(), 1); 17232 var { ValidatedToggleGroupControl } = unlock(import_components42.privateApis); 17233 function ToggleGroup({ 17234 data, 17235 field, 17236 onChange, 17237 hideLabelFromVision, 17238 markWhenOptional, 17239 validity 17240 }) { 17241 const { getValue, setValue, isValid: isValid2 } = field; 17242 const disabled2 = field.isDisabled({ item: data, field }); 17243 const value = getValue({ item: data }); 17244 const onChangeControl = (0, import_element69.useCallback)( 17245 (newValue) => onChange(setValue({ item: data, value: newValue })), 17246 [data, onChange, setValue] 17247 ); 17248 const { elements, isLoading } = useElements({ 17249 elements: field.elements, 17250 getElements: field.getElements 17251 }); 17252 if (isLoading) { 17253 return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_components42.Spinner, {}); 17254 } 17255 if (elements.length === 0) { 17256 return null; 17257 } 17258 const selectedOption = elements.find((el) => el.value === value); 17259 return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)( 17260 ValidatedToggleGroupControl, 17261 { 17262 required: !!field.isValid?.required, 17263 markWhenOptional, 17264 customValidity: getCustomValidity(isValid2, validity), 17265 __next40pxDefaultSize: true, 17266 isBlock: true, 17267 label: field.label, 17268 help: selectedOption?.description || field.description, 17269 onChange: onChangeControl, 17270 value, 17271 hideLabelFromVision, 17272 children: elements.map((el) => /* @__PURE__ */ (0, import_jsx_runtime102.jsx)( 17273 import_components42.__experimentalToggleGroupControlOption, 17274 { 17275 label: el.label, 17276 value: el.value, 17277 disabled: disabled2 17278 }, 17279 el.value 17280 )) 17281 } 17282 ); 17283 } 17284 17285 // packages/dataviews/build-module/components/dataform-controls/array.mjs 17286 var import_components43 = __toESM(require_components(), 1); 17287 var import_element70 = __toESM(require_element(), 1); 17288 var import_jsx_runtime103 = __toESM(require_jsx_runtime(), 1); 17289 var { ValidatedFormTokenField } = unlock(import_components43.privateApis); 17290 function ArrayControl({ 17291 data, 17292 field, 17293 onChange, 17294 hideLabelFromVision, 17295 markWhenOptional, 17296 validity 17297 }) { 17298 const { label, placeholder, description, getValue, setValue, isValid: isValid2 } = field; 17299 const value = getValue({ item: data }); 17300 const disabled2 = field.isDisabled({ item: data, field }); 17301 const { elements, isLoading } = useElements({ 17302 elements: field.elements, 17303 getElements: field.getElements 17304 }); 17305 const arrayValueAsElements = (0, import_element70.useMemo)( 17306 () => Array.isArray(value) ? value.map((token) => { 17307 const element = elements?.find( 17308 (suggestion) => suggestion.value === token 17309 ); 17310 return element || { value: token, label: token }; 17311 }) : [], 17312 [value, elements] 17313 ); 17314 const onChangeControl = (0, import_element70.useCallback)( 17315 (tokens) => { 17316 const valueTokens = tokens.map((token) => { 17317 if (typeof token === "object" && "value" in token) { 17318 return token.value; 17319 } 17320 return token; 17321 }); 17322 onChange(setValue({ item: data, value: valueTokens })); 17323 }, 17324 [onChange, setValue, data] 17325 ); 17326 if (isLoading) { 17327 return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_components43.Spinner, {}); 17328 } 17329 return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)( 17330 ValidatedFormTokenField, 17331 { 17332 required: !!isValid2?.required, 17333 markWhenOptional, 17334 customValidity: getCustomValidity(isValid2, validity), 17335 label: hideLabelFromVision ? void 0 : label, 17336 value: arrayValueAsElements, 17337 onChange: onChangeControl, 17338 placeholder, 17339 suggestions: elements?.map((element) => element.value), 17340 disabled: disabled2, 17341 __experimentalValidateInput: (token) => { 17342 if (field.isValid?.elements && elements) { 17343 return elements.some( 17344 (element) => element.value === token || element.label === token 17345 ); 17346 } 17347 return true; 17348 }, 17349 __experimentalExpandOnFocus: elements && elements.length > 0, 17350 help: description ?? (field.isValid?.elements ? "" : void 0), 17351 displayTransform: (token) => { 17352 if (typeof token === "object" && "label" in token) { 17353 return token.label; 17354 } 17355 if (typeof token === "string" && elements) { 17356 const element = elements.find( 17357 (el) => el.value === token 17358 ); 17359 return element?.label || token; 17360 } 17361 return token; 17362 }, 17363 __experimentalRenderItem: ({ item }) => { 17364 if (typeof item === "string" && elements) { 17365 const element = elements.find( 17366 (el) => el.value === item 17367 ); 17368 return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("span", { children: element?.label || item }); 17369 } 17370 return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("span", { children: item }); 17371 } 17372 } 17373 ); 17374 } 17375 17376 // node_modules/colord/index.mjs 17377 var r2 = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }; 17378 var t = function(r3) { 17379 return "string" == typeof r3 ? r3.length > 0 : "number" == typeof r3; 17380 }; 17381 var n = function(r3, t2, n2) { 17382 return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = Math.pow(10, t2)), Math.round(n2 * r3) / n2 + 0; 17383 }; 17384 var e = function(r3, t2, n2) { 17385 return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = 1), r3 > n2 ? n2 : r3 > t2 ? r3 : t2; 17386 }; 17387 var u = function(r3) { 17388 return (r3 = isFinite(r3) ? r3 % 360 : 0) > 0 ? r3 : r3 + 360; 17389 }; 17390 var a = function(r3) { 17391 return { r: e(r3.r, 0, 255), g: e(r3.g, 0, 255), b: e(r3.b, 0, 255), a: e(r3.a) }; 17392 }; 17393 var o = function(r3) { 17394 return { r: n(r3.r), g: n(r3.g), b: n(r3.b), a: n(r3.a, 3) }; 17395 }; 17396 var i = /^#([0-9a-f]{3,8})$/i; 17397 var s = function(r3) { 17398 var t2 = r3.toString(16); 17399 return t2.length < 2 ? "0" + t2 : t2; 17400 }; 17401 var h = function(r3) { 17402 var t2 = r3.r, n2 = r3.g, e2 = r3.b, u2 = r3.a, a2 = Math.max(t2, n2, e2), o2 = a2 - Math.min(t2, n2, e2), i2 = o2 ? a2 === t2 ? (n2 - e2) / o2 : a2 === n2 ? 2 + (e2 - t2) / o2 : 4 + (t2 - n2) / o2 : 0; 17403 return { h: 60 * (i2 < 0 ? i2 + 6 : i2), s: a2 ? o2 / a2 * 100 : 0, v: a2 / 255 * 100, a: u2 }; 17404 }; 17405 var b = function(r3) { 17406 var t2 = r3.h, n2 = r3.s, e2 = r3.v, u2 = r3.a; 17407 t2 = t2 / 360 * 6, n2 /= 100, e2 /= 100; 17408 var a2 = Math.floor(t2), o2 = e2 * (1 - n2), i2 = e2 * (1 - (t2 - a2) * n2), s2 = e2 * (1 - (1 - t2 + a2) * n2), h2 = a2 % 6; 17409 return { r: 255 * [e2, i2, o2, o2, s2, e2][h2], g: 255 * [s2, e2, e2, i2, o2, o2][h2], b: 255 * [o2, o2, s2, e2, e2, i2][h2], a: u2 }; 17410 }; 17411 var g = function(r3) { 17412 return { h: u(r3.h), s: e(r3.s, 0, 100), l: e(r3.l, 0, 100), a: e(r3.a) }; 17413 }; 17414 var d = function(r3) { 17415 return { h: n(r3.h), s: n(r3.s), l: n(r3.l), a: n(r3.a, 3) }; 17416 }; 17417 var f = function(r3) { 17418 return b((n2 = (t2 = r3).s, { h: t2.h, s: (n2 *= ((e2 = t2.l) < 50 ? e2 : 100 - e2) / 100) > 0 ? 2 * n2 / (e2 + n2) * 100 : 0, v: e2 + n2, a: t2.a })); 17419 var t2, n2, e2; 17420 }; 17421 var c = function(r3) { 17422 return { h: (t2 = h(r3)).h, s: (u2 = (200 - (n2 = t2.s)) * (e2 = t2.v) / 100) > 0 && u2 < 200 ? n2 * e2 / 100 / (u2 <= 100 ? u2 : 200 - u2) * 100 : 0, l: u2 / 2, a: t2.a }; 17423 var t2, n2, e2, u2; 17424 }; 17425 var l = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; 17426 var p = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; 17427 var v = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; 17428 var m = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; 17429 var y = { string: [[function(r3) { 17430 var t2 = i.exec(r3); 17431 return t2 ? (r3 = t2[1]).length <= 4 ? { r: parseInt(r3[0] + r3[0], 16), g: parseInt(r3[1] + r3[1], 16), b: parseInt(r3[2] + r3[2], 16), a: 4 === r3.length ? n(parseInt(r3[3] + r3[3], 16) / 255, 2) : 1 } : 6 === r3.length || 8 === r3.length ? { r: parseInt(r3.substr(0, 2), 16), g: parseInt(r3.substr(2, 2), 16), b: parseInt(r3.substr(4, 2), 16), a: 8 === r3.length ? n(parseInt(r3.substr(6, 2), 16) / 255, 2) : 1 } : null : null; 17432 }, "hex"], [function(r3) { 17433 var t2 = v.exec(r3) || m.exec(r3); 17434 return t2 ? t2[2] !== t2[4] || t2[4] !== t2[6] ? null : a({ r: Number(t2[1]) / (t2[2] ? 100 / 255 : 1), g: Number(t2[3]) / (t2[4] ? 100 / 255 : 1), b: Number(t2[5]) / (t2[6] ? 100 / 255 : 1), a: void 0 === t2[7] ? 1 : Number(t2[7]) / (t2[8] ? 100 : 1) }) : null; 17435 }, "rgb"], [function(t2) { 17436 var n2 = l.exec(t2) || p.exec(t2); 17437 if (!n2) return null; 17438 var e2, u2, a2 = g({ h: (e2 = n2[1], u2 = n2[2], void 0 === u2 && (u2 = "deg"), Number(e2) * (r2[u2] || 1)), s: Number(n2[3]), l: Number(n2[4]), a: void 0 === n2[5] ? 1 : Number(n2[5]) / (n2[6] ? 100 : 1) }); 17439 return f(a2); 17440 }, "hsl"]], object: [[function(r3) { 17441 var n2 = r3.r, e2 = r3.g, u2 = r3.b, o2 = r3.a, i2 = void 0 === o2 ? 1 : o2; 17442 return t(n2) && t(e2) && t(u2) ? a({ r: Number(n2), g: Number(e2), b: Number(u2), a: Number(i2) }) : null; 17443 }, "rgb"], [function(r3) { 17444 var n2 = r3.h, e2 = r3.s, u2 = r3.l, a2 = r3.a, o2 = void 0 === a2 ? 1 : a2; 17445 if (!t(n2) || !t(e2) || !t(u2)) return null; 17446 var i2 = g({ h: Number(n2), s: Number(e2), l: Number(u2), a: Number(o2) }); 17447 return f(i2); 17448 }, "hsl"], [function(r3) { 17449 var n2 = r3.h, a2 = r3.s, o2 = r3.v, i2 = r3.a, s2 = void 0 === i2 ? 1 : i2; 17450 if (!t(n2) || !t(a2) || !t(o2)) return null; 17451 var h2 = (function(r4) { 17452 return { h: u(r4.h), s: e(r4.s, 0, 100), v: e(r4.v, 0, 100), a: e(r4.a) }; 17453 })({ h: Number(n2), s: Number(a2), v: Number(o2), a: Number(s2) }); 17454 return b(h2); 17455 }, "hsv"]] }; 17456 var N = function(r3, t2) { 17457 for (var n2 = 0; n2 < t2.length; n2++) { 17458 var e2 = t2[n2][0](r3); 17459 if (e2) return [e2, t2[n2][1]]; 17460 } 17461 return [null, void 0]; 17462 }; 17463 var x = function(r3) { 17464 return "string" == typeof r3 ? N(r3.trim(), y.string) : "object" == typeof r3 && null !== r3 ? N(r3, y.object) : [null, void 0]; 17465 }; 17466 var M = function(r3, t2) { 17467 var n2 = c(r3); 17468 return { h: n2.h, s: e(n2.s + 100 * t2, 0, 100), l: n2.l, a: n2.a }; 17469 }; 17470 var H = function(r3) { 17471 return (299 * r3.r + 587 * r3.g + 114 * r3.b) / 1e3 / 255; 17472 }; 17473 var $ = function(r3, t2) { 17474 var n2 = c(r3); 17475 return { h: n2.h, s: n2.s, l: e(n2.l + 100 * t2, 0, 100), a: n2.a }; 17476 }; 17477 var j = (function() { 17478 function r3(r4) { 17479 this.parsed = x(r4)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 }; 17480 } 17481 return r3.prototype.isValid = function() { 17482 return null !== this.parsed; 17483 }, r3.prototype.brightness = function() { 17484 return n(H(this.rgba), 2); 17485 }, r3.prototype.isDark = function() { 17486 return H(this.rgba) < 0.5; 17487 }, r3.prototype.isLight = function() { 17488 return H(this.rgba) >= 0.5; 17489 }, r3.prototype.toHex = function() { 17490 return r4 = o(this.rgba), t2 = r4.r, e2 = r4.g, u2 = r4.b, i2 = (a2 = r4.a) < 1 ? s(n(255 * a2)) : "", "#" + s(t2) + s(e2) + s(u2) + i2; 17491 var r4, t2, e2, u2, a2, i2; 17492 }, r3.prototype.toRgb = function() { 17493 return o(this.rgba); 17494 }, r3.prototype.toRgbString = function() { 17495 return r4 = o(this.rgba), t2 = r4.r, n2 = r4.g, e2 = r4.b, (u2 = r4.a) < 1 ? "rgba(" + t2 + ", " + n2 + ", " + e2 + ", " + u2 + ")" : "rgb(" + t2 + ", " + n2 + ", " + e2 + ")"; 17496 var r4, t2, n2, e2, u2; 17497 }, r3.prototype.toHsl = function() { 17498 return d(c(this.rgba)); 17499 }, r3.prototype.toHslString = function() { 17500 return r4 = d(c(this.rgba)), t2 = r4.h, n2 = r4.s, e2 = r4.l, (u2 = r4.a) < 1 ? "hsla(" + t2 + ", " + n2 + "%, " + e2 + "%, " + u2 + ")" : "hsl(" + t2 + ", " + n2 + "%, " + e2 + "%)"; 17501 var r4, t2, n2, e2, u2; 17502 }, r3.prototype.toHsv = function() { 17503 return r4 = h(this.rgba), { h: n(r4.h), s: n(r4.s), v: n(r4.v), a: n(r4.a, 3) }; 17504 var r4; 17505 }, r3.prototype.invert = function() { 17506 return w({ r: 255 - (r4 = this.rgba).r, g: 255 - r4.g, b: 255 - r4.b, a: r4.a }); 17507 var r4; 17508 }, r3.prototype.saturate = function(r4) { 17509 return void 0 === r4 && (r4 = 0.1), w(M(this.rgba, r4)); 17510 }, r3.prototype.desaturate = function(r4) { 17511 return void 0 === r4 && (r4 = 0.1), w(M(this.rgba, -r4)); 17512 }, r3.prototype.grayscale = function() { 17513 return w(M(this.rgba, -1)); 17514 }, r3.prototype.lighten = function(r4) { 17515 return void 0 === r4 && (r4 = 0.1), w($(this.rgba, r4)); 17516 }, r3.prototype.darken = function(r4) { 17517 return void 0 === r4 && (r4 = 0.1), w($(this.rgba, -r4)); 17518 }, r3.prototype.rotate = function(r4) { 17519 return void 0 === r4 && (r4 = 15), this.hue(this.hue() + r4); 17520 }, r3.prototype.alpha = function(r4) { 17521 return "number" == typeof r4 ? w({ r: (t2 = this.rgba).r, g: t2.g, b: t2.b, a: r4 }) : n(this.rgba.a, 3); 17522 var t2; 17523 }, r3.prototype.hue = function(r4) { 17524 var t2 = c(this.rgba); 17525 return "number" == typeof r4 ? w({ h: r4, s: t2.s, l: t2.l, a: t2.a }) : n(t2.h); 17526 }, r3.prototype.isEqual = function(r4) { 17527 return this.toHex() === w(r4).toHex(); 17528 }, r3; 17529 })(); 17530 var w = function(r3) { 17531 return r3 instanceof j ? r3 : new j(r3); 17532 }; 17533 17534 // packages/dataviews/build-module/components/dataform-controls/color.mjs 17535 var import_components44 = __toESM(require_components(), 1); 17536 var import_element71 = __toESM(require_element(), 1); 17537 var import_i18n35 = __toESM(require_i18n(), 1); 17538 var import_jsx_runtime104 = __toESM(require_jsx_runtime(), 1); 17539 var { ValidatedInputControl: ValidatedInputControl3 } = unlock(import_components44.privateApis); 17540 var ColorPickerDropdown = ({ 17541 color, 17542 onColorChange, 17543 disabled: disabled2 17544 }) => { 17545 const validColor = color && w(color).isValid() ? color : "#ffffff"; 17546 return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)( 17547 import_components44.Dropdown, 17548 { 17549 className: "dataviews-controls__color-picker-dropdown", 17550 popoverProps: { resize: false }, 17551 renderToggle: ({ onToggle }) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)( 17552 import_components44.Button, 17553 { 17554 onClick: onToggle, 17555 "aria-label": (0, import_i18n35.__)("Open color picker"), 17556 size: "small", 17557 disabled: disabled2, 17558 accessibleWhenDisabled: true, 17559 icon: () => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_components44.ColorIndicator, { colorValue: validColor }) 17560 } 17561 ), 17562 renderContent: () => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_components44.__experimentalDropdownContentWrapper, { paddingSize: "none", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)( 17563 import_components44.ColorPicker, 17564 { 17565 color: validColor, 17566 onChange: onColorChange, 17567 enableAlpha: true 17568 } 17569 ) }) 17570 } 17571 ); 17572 }; 17573 function Color({ 17574 data, 17575 field, 17576 onChange, 17577 hideLabelFromVision, 17578 markWhenOptional, 17579 validity 17580 }) { 17581 const { label, placeholder, description, setValue, isValid: isValid2 } = field; 17582 const disabled2 = field.isDisabled({ item: data, field }); 17583 const value = field.getValue({ item: data }) || ""; 17584 const handleColorChange = (0, import_element71.useCallback)( 17585 (newColor) => { 17586 onChange(setValue({ item: data, value: newColor })); 17587 }, 17588 [data, onChange, setValue] 17589 ); 17590 const handleInputChange = (0, import_element71.useCallback)( 17591 (newValue) => { 17592 onChange(setValue({ item: data, value: newValue || "" })); 17593 }, 17594 [data, onChange, setValue] 17595 ); 17596 return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)( 17597 ValidatedInputControl3, 17598 { 17599 required: !!field.isValid?.required, 17600 markWhenOptional, 17601 customValidity: getCustomValidity(isValid2, validity), 17602 label, 17603 placeholder, 17604 value, 17605 help: description, 17606 onChange: handleInputChange, 17607 hideLabelFromVision, 17608 type: "text", 17609 disabled: disabled2, 17610 prefix: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_components44.__experimentalInputControlPrefixWrapper, { variant: "control", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)( 17611 ColorPickerDropdown, 17612 { 17613 color: value, 17614 onColorChange: handleColorChange, 17615 disabled: disabled2 17616 } 17617 ) }) 17618 } 17619 ); 17620 } 17621 17622 // packages/dataviews/build-module/components/dataform-controls/password.mjs 17623 var import_components45 = __toESM(require_components(), 1); 17624 var import_element72 = __toESM(require_element(), 1); 17625 var import_i18n36 = __toESM(require_i18n(), 1); 17626 var import_jsx_runtime105 = __toESM(require_jsx_runtime(), 1); 17627 function Password({ 17628 data, 17629 field, 17630 onChange, 17631 hideLabelFromVision, 17632 markWhenOptional, 17633 validity 17634 }) { 17635 const [isVisible2, setIsVisible] = (0, import_element72.useState)(false); 17636 const disabled2 = field.isDisabled({ item: data, field }); 17637 const toggleVisibility = (0, import_element72.useCallback)(() => { 17638 setIsVisible((prev) => !prev); 17639 }, []); 17640 return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)( 17641 ValidatedText, 17642 { 17643 ...{ 17644 data, 17645 field, 17646 onChange, 17647 hideLabelFromVision, 17648 markWhenOptional, 17649 validity, 17650 type: isVisible2 ? "text" : "password", 17651 suffix: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_components45.__experimentalInputControlSuffixWrapper, { variant: "control", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)( 17652 import_components45.Button, 17653 { 17654 icon: isVisible2 ? unseen_default : seen_default, 17655 onClick: toggleVisibility, 17656 size: "small", 17657 label: isVisible2 ? (0, import_i18n36.__)("Hide password") : (0, import_i18n36.__)("Show password"), 17658 disabled: disabled2, 17659 accessibleWhenDisabled: true 17660 } 17661 ) }) 17662 } 17663 } 17664 ); 17665 } 17666 17667 // packages/dataviews/build-module/field-types/utils/has-elements.mjs 17668 function hasElements(field) { 17669 return Array.isArray(field.elements) && field.elements.length > 0 || typeof field.getElements === "function"; 17670 } 17671 17672 // packages/dataviews/build-module/components/dataform-controls/index.mjs 17673 var import_jsx_runtime106 = __toESM(require_jsx_runtime(), 1); 17674 var FORM_CONTROLS = { 17675 adaptiveSelect: AdaptiveSelect, 17676 array: ArrayControl, 17677 checkbox: Checkbox, 17678 color: Color, 17679 combobox: Combobox3, 17680 datetime: DateTime, 17681 date: DateControl, 17682 email: Email, 17683 telephone: Telephone, 17684 url: Url, 17685 integer: Integer, 17686 number: Number2, 17687 password: Password, 17688 radio: Radio, 17689 select: Select, 17690 text: Text3, 17691 toggle: Toggle, 17692 textarea: Textarea, 17693 toggleGroup: ToggleGroup 17694 }; 17695 function isEditConfig(value) { 17696 return value && typeof value === "object" && typeof value.control === "string"; 17697 } 17698 function createConfiguredControl(config) { 17699 const { control, ...controlConfig } = config; 17700 const BaseControlType = getControlByType(control); 17701 if (BaseControlType === null) { 17702 return null; 17703 } 17704 return function ConfiguredControl(props) { 17705 return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(BaseControlType, { ...props, config: controlConfig }); 17706 }; 17707 } 17708 function getControl(field, fallback) { 17709 if (typeof field.Edit === "function") { 17710 return field.Edit; 17711 } 17712 if (typeof field.Edit === "string") { 17713 return getControlByType(field.Edit); 17714 } 17715 if (isEditConfig(field.Edit)) { 17716 return createConfiguredControl(field.Edit); 17717 } 17718 if (hasElements(field) && field.type !== "array") { 17719 return getControlByType("adaptiveSelect"); 17720 } 17721 if (fallback === null) { 17722 return null; 17723 } 17724 return getControlByType(fallback); 17725 } 17726 function getControlByType(type) { 17727 if (Object.keys(FORM_CONTROLS).includes(type)) { 17728 return FORM_CONTROLS[type]; 17729 } 17730 return null; 17731 } 17732 17733 // packages/dataviews/build-module/field-types/utils/get-filter-by.mjs 17734 function getFilterBy(field, defaultOperators, validOperators) { 17735 if (field.filterBy === false) { 17736 return false; 17737 } 17738 const operators = field.filterBy?.operators?.filter( 17739 (op) => validOperators.includes(op) 17740 ) ?? defaultOperators; 17741 if (operators.length === 0) { 17742 return false; 17743 } 17744 return { 17745 isPrimary: !!field.filterBy?.isPrimary, 17746 operators 17747 }; 17748 } 17749 var get_filter_by_default = getFilterBy; 17750 17751 // packages/dataviews/build-module/field-types/utils/get-value-from-id.mjs 17752 var getValueFromId = (id) => ({ item }) => { 17753 const path = id.split("."); 17754 let value = item; 17755 for (const segment of path) { 17756 if (value.hasOwnProperty(segment)) { 17757 value = value[segment]; 17758 } else { 17759 value = void 0; 17760 } 17761 } 17762 return value; 17763 }; 17764 var get_value_from_id_default = getValueFromId; 17765 17766 // packages/dataviews/build-module/field-types/utils/set-value-from-id.mjs 17767 var setValueFromId = (id) => ({ value }) => { 17768 const path = id.split("."); 17769 const result = {}; 17770 let current = result; 17771 for (const segment of path.slice(0, -1)) { 17772 current[segment] = {}; 17773 current = current[segment]; 17774 } 17775 current[path.at(-1)] = value; 17776 return result; 17777 }; 17778 var set_value_from_id_default = setValueFromId; 17779 17780 // packages/dataviews/build-module/field-types/email.mjs 17781 var import_i18n37 = __toESM(require_i18n(), 1); 17782 17783 // packages/dataviews/build-module/field-types/utils/render-from-elements.mjs 17784 function RenderFromElements({ 17785 item, 17786 field 17787 }) { 17788 const { elements, isLoading } = useElements({ 17789 elements: field.elements, 17790 getElements: field.getElements 17791 }); 17792 const value = field.getValue({ item }); 17793 if (isLoading) { 17794 return value; 17795 } 17796 if (elements.length === 0) { 17797 return value; 17798 } 17799 return elements?.find((element) => element.value === value)?.label || field.getValue({ item }); 17800 } 17801 17802 // packages/dataviews/build-module/field-types/utils/render-default.mjs 17803 var import_jsx_runtime107 = __toESM(require_jsx_runtime(), 1); 17804 function render({ 17805 item, 17806 field 17807 }) { 17808 if (field.hasElements) { 17809 return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(RenderFromElements, { item, field }); 17810 } 17811 return field.getValueFormatted({ item, field }); 17812 } 17813 17814 // packages/dataviews/build-module/field-types/utils/sort-text.mjs 17815 var sort_text_default = (a2, b2, direction) => { 17816 return direction === "asc" ? a2.localeCompare(b2) : b2.localeCompare(a2); 17817 }; 17818 17819 // packages/dataviews/build-module/field-types/utils/is-valid-required.mjs 17820 function isValidRequired(item, field) { 17821 const value = field.getValue({ item }); 17822 return ![void 0, "", null].includes(value); 17823 } 17824 17825 // packages/dataviews/build-module/field-types/utils/is-valid-min-length.mjs 17826 function isValidMinLength(item, field) { 17827 if (typeof field.isValid.minLength?.constraint !== "number") { 17828 return false; 17829 } 17830 const value = field.getValue({ item }); 17831 if ([void 0, "", null].includes(value)) { 17832 return true; 17833 } 17834 return String(value).length >= field.isValid.minLength.constraint; 17835 } 17836 17837 // packages/dataviews/build-module/field-types/utils/is-valid-max-length.mjs 17838 function isValidMaxLength(item, field) { 17839 if (typeof field.isValid.maxLength?.constraint !== "number") { 17840 return false; 17841 } 17842 const value = field.getValue({ item }); 17843 if ([void 0, "", null].includes(value)) { 17844 return true; 17845 } 17846 return String(value).length <= field.isValid.maxLength.constraint; 17847 } 17848 17849 // packages/dataviews/build-module/field-types/utils/is-valid-pattern.mjs 17850 function isValidPattern(item, field) { 17851 if (field.isValid.pattern?.constraint === void 0) { 17852 return true; 17853 } 17854 try { 17855 const regexp = new RegExp(field.isValid.pattern.constraint); 17856 const value = field.getValue({ item }); 17857 if ([void 0, "", null].includes(value)) { 17858 return true; 17859 } 17860 return regexp.test(String(value)); 17861 } catch { 17862 return false; 17863 } 17864 } 17865 17866 // packages/dataviews/build-module/field-types/utils/is-valid-elements.mjs 17867 function isValidElements(item, field) { 17868 const elements = field.elements ?? []; 17869 const validValues = elements.map((el) => el.value); 17870 if (validValues.length === 0) { 17871 return true; 17872 } 17873 const value = field.getValue({ item }); 17874 return [].concat(value).every((v2) => validValues.includes(v2)); 17875 } 17876 17877 // packages/dataviews/build-module/field-types/utils/get-value-formatted-default.mjs 17878 function getValueFormatted({ 17879 item, 17880 field 17881 }) { 17882 return field.getValue({ item }); 17883 } 17884 var get_value_formatted_default_default = getValueFormatted; 17885 17886 // packages/dataviews/build-module/field-types/email.mjs 17887 var emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/; 17888 function isValidCustom(item, field) { 17889 const value = field.getValue({ item }); 17890 if (![void 0, "", null].includes(value) && !emailRegex.test(value)) { 17891 return (0, import_i18n37.__)("Value must be a valid email address."); 17892 } 17893 return null; 17894 } 17895 var email_default = { 17896 type: "email", 17897 render, 17898 Edit: "email", 17899 sort: sort_text_default, 17900 enableSorting: true, 17901 enableGlobalSearch: false, 17902 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 17903 validOperators: [ 17904 OPERATOR_IS, 17905 OPERATOR_IS_NOT, 17906 OPERATOR_CONTAINS, 17907 OPERATOR_NOT_CONTAINS, 17908 OPERATOR_STARTS_WITH, 17909 // Multiple selection 17910 OPERATOR_IS_ANY, 17911 OPERATOR_IS_NONE, 17912 OPERATOR_IS_ALL, 17913 OPERATOR_IS_NOT_ALL 17914 ], 17915 format: {}, 17916 getValueFormatted: get_value_formatted_default_default, 17917 validate: { 17918 required: isValidRequired, 17919 pattern: isValidPattern, 17920 minLength: isValidMinLength, 17921 maxLength: isValidMaxLength, 17922 elements: isValidElements, 17923 custom: isValidCustom 17924 } 17925 }; 17926 17927 // packages/dataviews/build-module/field-types/integer.mjs 17928 var import_i18n38 = __toESM(require_i18n(), 1); 17929 17930 // packages/dataviews/build-module/field-types/utils/sort-number.mjs 17931 var sort_number_default = (a2, b2, direction) => { 17932 return direction === "asc" ? a2 - b2 : b2 - a2; 17933 }; 17934 17935 // packages/dataviews/build-module/field-types/utils/is-valid-min.mjs 17936 function isValidMin(item, field) { 17937 if (typeof field.isValid.min?.constraint !== "number") { 17938 return false; 17939 } 17940 const value = field.getValue({ item }); 17941 if ([void 0, "", null].includes(value)) { 17942 return true; 17943 } 17944 return Number(value) >= field.isValid.min.constraint; 17945 } 17946 17947 // packages/dataviews/build-module/field-types/utils/is-valid-max.mjs 17948 function isValidMax(item, field) { 17949 if (typeof field.isValid.max?.constraint !== "number") { 17950 return false; 17951 } 17952 const value = field.getValue({ item }); 17953 if ([void 0, "", null].includes(value)) { 17954 return true; 17955 } 17956 return Number(value) <= field.isValid.max.constraint; 17957 } 17958 17959 // packages/dataviews/build-module/field-types/integer.mjs 17960 var format2 = { 17961 separatorThousand: "," 17962 }; 17963 function getValueFormatted2({ 17964 item, 17965 field 17966 }) { 17967 let value = field.getValue({ item }); 17968 if (value === null || value === void 0) { 17969 return ""; 17970 } 17971 value = Number(value); 17972 if (!Number.isFinite(value)) { 17973 return String(value); 17974 } 17975 let formatInteger; 17976 if (field.type !== "integer") { 17977 formatInteger = format2; 17978 } else { 17979 formatInteger = field.format; 17980 } 17981 const { separatorThousand } = formatInteger; 17982 const integerValue = Math.trunc(value); 17983 if (!separatorThousand) { 17984 return String(integerValue); 17985 } 17986 return String(integerValue).replace( 17987 /\B(?=(\d{3})+(?!\d))/g, 17988 separatorThousand 17989 ); 17990 } 17991 function isValidCustom2(item, field) { 17992 const value = field.getValue({ item }); 17993 if (![void 0, "", null].includes(value) && !Number.isInteger(value)) { 17994 return (0, import_i18n38.__)("Value must be an integer."); 17995 } 17996 return null; 17997 } 17998 var integer_default = { 17999 type: "integer", 18000 render, 18001 Edit: "integer", 18002 sort: sort_number_default, 18003 enableSorting: true, 18004 enableGlobalSearch: false, 18005 defaultOperators: [ 18006 OPERATOR_IS, 18007 OPERATOR_IS_NOT, 18008 OPERATOR_LESS_THAN, 18009 OPERATOR_GREATER_THAN, 18010 OPERATOR_LESS_THAN_OR_EQUAL, 18011 OPERATOR_GREATER_THAN_OR_EQUAL, 18012 OPERATOR_BETWEEN 18013 ], 18014 validOperators: [ 18015 // Single-selection 18016 OPERATOR_IS, 18017 OPERATOR_IS_NOT, 18018 OPERATOR_LESS_THAN, 18019 OPERATOR_GREATER_THAN, 18020 OPERATOR_LESS_THAN_OR_EQUAL, 18021 OPERATOR_GREATER_THAN_OR_EQUAL, 18022 OPERATOR_BETWEEN, 18023 // Multiple-selection 18024 OPERATOR_IS_ANY, 18025 OPERATOR_IS_NONE, 18026 OPERATOR_IS_ALL, 18027 OPERATOR_IS_NOT_ALL 18028 ], 18029 format: format2, 18030 getValueFormatted: getValueFormatted2, 18031 validate: { 18032 required: isValidRequired, 18033 min: isValidMin, 18034 max: isValidMax, 18035 elements: isValidElements, 18036 custom: isValidCustom2 18037 } 18038 }; 18039 18040 // packages/dataviews/build-module/field-types/number.mjs 18041 var import_i18n39 = __toESM(require_i18n(), 1); 18042 var format3 = { 18043 separatorThousand: ",", 18044 separatorDecimal: ".", 18045 decimals: 2 18046 }; 18047 function getValueFormatted3({ 18048 item, 18049 field 18050 }) { 18051 let value = field.getValue({ item }); 18052 if (value === null || value === void 0) { 18053 return ""; 18054 } 18055 value = Number(value); 18056 if (!Number.isFinite(value)) { 18057 return String(value); 18058 } 18059 let formatNumber; 18060 if (field.type !== "number") { 18061 formatNumber = format3; 18062 } else { 18063 formatNumber = field.format; 18064 } 18065 const { separatorThousand, separatorDecimal, decimals } = formatNumber; 18066 const fixedValue = value.toFixed(decimals); 18067 const [integerPart, decimalPart] = fixedValue.split("."); 18068 const formattedInteger = separatorThousand ? integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, separatorThousand) : integerPart; 18069 return decimals === 0 ? formattedInteger : formattedInteger + separatorDecimal + decimalPart; 18070 } 18071 function isEmpty2(value) { 18072 return value === "" || value === void 0 || value === null; 18073 } 18074 function isValidCustom3(item, field) { 18075 const value = field.getValue({ item }); 18076 if (!isEmpty2(value) && !Number.isFinite(value)) { 18077 return (0, import_i18n39.__)("Value must be a number."); 18078 } 18079 return null; 18080 } 18081 var number_default = { 18082 type: "number", 18083 render, 18084 Edit: "number", 18085 sort: sort_number_default, 18086 enableSorting: true, 18087 enableGlobalSearch: false, 18088 defaultOperators: [ 18089 OPERATOR_IS, 18090 OPERATOR_IS_NOT, 18091 OPERATOR_LESS_THAN, 18092 OPERATOR_GREATER_THAN, 18093 OPERATOR_LESS_THAN_OR_EQUAL, 18094 OPERATOR_GREATER_THAN_OR_EQUAL, 18095 OPERATOR_BETWEEN 18096 ], 18097 validOperators: [ 18098 // Single-selection 18099 OPERATOR_IS, 18100 OPERATOR_IS_NOT, 18101 OPERATOR_LESS_THAN, 18102 OPERATOR_GREATER_THAN, 18103 OPERATOR_LESS_THAN_OR_EQUAL, 18104 OPERATOR_GREATER_THAN_OR_EQUAL, 18105 OPERATOR_BETWEEN, 18106 // Multiple-selection 18107 OPERATOR_IS_ANY, 18108 OPERATOR_IS_NONE, 18109 OPERATOR_IS_ALL, 18110 OPERATOR_IS_NOT_ALL 18111 ], 18112 format: format3, 18113 getValueFormatted: getValueFormatted3, 18114 validate: { 18115 required: isValidRequired, 18116 min: isValidMin, 18117 max: isValidMax, 18118 elements: isValidElements, 18119 custom: isValidCustom3 18120 } 18121 }; 18122 18123 // packages/dataviews/build-module/field-types/text.mjs 18124 var text_default = { 18125 type: "text", 18126 render, 18127 Edit: "text", 18128 sort: sort_text_default, 18129 enableSorting: true, 18130 enableGlobalSearch: false, 18131 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 18132 validOperators: [ 18133 // Single selection 18134 OPERATOR_IS, 18135 OPERATOR_IS_NOT, 18136 OPERATOR_CONTAINS, 18137 OPERATOR_NOT_CONTAINS, 18138 OPERATOR_STARTS_WITH, 18139 // Multiple selection 18140 OPERATOR_IS_ANY, 18141 OPERATOR_IS_NONE, 18142 OPERATOR_IS_ALL, 18143 OPERATOR_IS_NOT_ALL 18144 ], 18145 format: {}, 18146 getValueFormatted: get_value_formatted_default_default, 18147 validate: { 18148 required: isValidRequired, 18149 pattern: isValidPattern, 18150 minLength: isValidMinLength, 18151 maxLength: isValidMaxLength, 18152 elements: isValidElements 18153 } 18154 }; 18155 18156 // packages/dataviews/build-module/field-types/datetime.mjs 18157 var import_date7 = __toESM(require_date(), 1); 18158 18159 // packages/dataviews/build-module/field-types/utils/is-valid-date-boundary.mjs 18160 var import_date6 = __toESM(require_date(), 1); 18161 function parseDateLike(value) { 18162 if (!value) { 18163 return null; 18164 } 18165 if (!isValid(new Date(value))) { 18166 return null; 18167 } 18168 const parsed = (0, import_date6.getDate)(value); 18169 return parsed && isValid(parsed) ? parsed : null; 18170 } 18171 function validateDateLikeBoundary(item, field, boundary) { 18172 const constraint = field.isValid[boundary]?.constraint; 18173 if (typeof constraint !== "string") { 18174 return false; 18175 } 18176 const value = field.getValue({ item }); 18177 const boundaryValue = Array.isArray(value) ? value[boundary === "min" ? 0 : value.length - 1] : value; 18178 if (boundaryValue === void 0 || boundaryValue === null || boundaryValue === "") { 18179 return true; 18180 } 18181 const parsedConstraint = parseDateLike(constraint); 18182 const parsedValue = parseDateLike(String(boundaryValue)); 18183 return !!parsedConstraint && !!parsedValue && (boundary === "min" ? parsedValue.getTime() >= parsedConstraint.getTime() : parsedValue.getTime() <= parsedConstraint.getTime()); 18184 } 18185 function isValidMinDate(item, field) { 18186 return validateDateLikeBoundary(item, field, "min"); 18187 } 18188 function isValidMaxDate(item, field) { 18189 return validateDateLikeBoundary(item, field, "max"); 18190 } 18191 18192 // packages/dataviews/build-module/field-types/datetime.mjs 18193 var format4 = { 18194 datetime: (0, import_date7.getSettings)().formats.datetime, 18195 weekStartsOn: (0, import_date7.getSettings)().l10n.startOfWeek 18196 }; 18197 function getValueFormatted4({ 18198 item, 18199 field 18200 }) { 18201 const value = field.getValue({ item }); 18202 if (["", void 0, null].includes(value)) { 18203 return ""; 18204 } 18205 let formatDatetime; 18206 if (field.type !== "datetime") { 18207 formatDatetime = format4; 18208 } else { 18209 formatDatetime = field.format; 18210 } 18211 return (0, import_date7.dateI18n)(formatDatetime.datetime, (0, import_date7.getDate)(value)); 18212 } 18213 var sort = (a2, b2, direction) => { 18214 const timeA = new Date(a2).getTime(); 18215 const timeB = new Date(b2).getTime(); 18216 return direction === "asc" ? timeA - timeB : timeB - timeA; 18217 }; 18218 var datetime_default = { 18219 type: "datetime", 18220 render, 18221 Edit: "datetime", 18222 sort, 18223 enableSorting: true, 18224 enableGlobalSearch: false, 18225 defaultOperators: [ 18226 OPERATOR_ON, 18227 OPERATOR_NOT_ON, 18228 OPERATOR_BEFORE, 18229 OPERATOR_AFTER, 18230 OPERATOR_BEFORE_INC, 18231 OPERATOR_AFTER_INC, 18232 OPERATOR_IN_THE_PAST, 18233 OPERATOR_OVER 18234 ], 18235 validOperators: [ 18236 OPERATOR_ON, 18237 OPERATOR_NOT_ON, 18238 OPERATOR_BEFORE, 18239 OPERATOR_AFTER, 18240 OPERATOR_BEFORE_INC, 18241 OPERATOR_AFTER_INC, 18242 OPERATOR_IN_THE_PAST, 18243 OPERATOR_OVER 18244 ], 18245 format: format4, 18246 getValueFormatted: getValueFormatted4, 18247 validate: { 18248 required: isValidRequired, 18249 elements: isValidElements, 18250 min: isValidMinDate, 18251 max: isValidMaxDate 18252 } 18253 }; 18254 18255 // packages/dataviews/build-module/field-types/date.mjs 18256 var import_date8 = __toESM(require_date(), 1); 18257 var format5 = { 18258 date: (0, import_date8.getSettings)().formats.date, 18259 weekStartsOn: (0, import_date8.getSettings)().l10n.startOfWeek 18260 }; 18261 function getValueFormatted5({ 18262 item, 18263 field 18264 }) { 18265 const value = field.getValue({ item }); 18266 if (["", void 0, null].includes(value)) { 18267 return ""; 18268 } 18269 let formatDate2; 18270 if (field.type !== "date") { 18271 formatDate2 = format5; 18272 } else { 18273 formatDate2 = field.format; 18274 } 18275 return (0, import_date8.dateI18n)(formatDate2.date, (0, import_date8.getDate)(value)); 18276 } 18277 var sort2 = (a2, b2, direction) => { 18278 const timeA = new Date(a2).getTime(); 18279 const timeB = new Date(b2).getTime(); 18280 return direction === "asc" ? timeA - timeB : timeB - timeA; 18281 }; 18282 var date_default = { 18283 type: "date", 18284 render, 18285 Edit: "date", 18286 sort: sort2, 18287 enableSorting: true, 18288 enableGlobalSearch: false, 18289 defaultOperators: [ 18290 OPERATOR_ON, 18291 OPERATOR_NOT_ON, 18292 OPERATOR_BEFORE, 18293 OPERATOR_AFTER, 18294 OPERATOR_BEFORE_INC, 18295 OPERATOR_AFTER_INC, 18296 OPERATOR_IN_THE_PAST, 18297 OPERATOR_OVER, 18298 OPERATOR_BETWEEN 18299 ], 18300 validOperators: [ 18301 OPERATOR_ON, 18302 OPERATOR_NOT_ON, 18303 OPERATOR_BEFORE, 18304 OPERATOR_AFTER, 18305 OPERATOR_BEFORE_INC, 18306 OPERATOR_AFTER_INC, 18307 OPERATOR_IN_THE_PAST, 18308 OPERATOR_OVER, 18309 OPERATOR_BETWEEN 18310 ], 18311 format: format5, 18312 getValueFormatted: getValueFormatted5, 18313 validate: { 18314 required: isValidRequired, 18315 elements: isValidElements, 18316 min: isValidMinDate, 18317 max: isValidMaxDate 18318 } 18319 }; 18320 18321 // packages/dataviews/build-module/field-types/boolean.mjs 18322 var import_i18n40 = __toESM(require_i18n(), 1); 18323 18324 // packages/dataviews/build-module/field-types/utils/is-valid-required-for-bool.mjs 18325 function isValidRequiredForBool(item, field) { 18326 const value = field.getValue({ item }); 18327 return value === true; 18328 } 18329 18330 // packages/dataviews/build-module/field-types/boolean.mjs 18331 function getValueFormatted6({ 18332 item, 18333 field 18334 }) { 18335 const value = field.getValue({ item }); 18336 if (value === true) { 18337 return (0, import_i18n40.__)("True"); 18338 } 18339 if (value === false) { 18340 return (0, import_i18n40.__)("False"); 18341 } 18342 return ""; 18343 } 18344 function isValidCustom4(item, field) { 18345 const value = field.getValue({ item }); 18346 if (![void 0, "", null].includes(value) && ![true, false].includes(value)) { 18347 return (0, import_i18n40.__)("Value must be true, false, or undefined"); 18348 } 18349 return null; 18350 } 18351 var sort3 = (a2, b2, direction) => { 18352 const boolA = Boolean(a2); 18353 const boolB = Boolean(b2); 18354 if (boolA === boolB) { 18355 return 0; 18356 } 18357 if (direction === "asc") { 18358 return boolA ? 1 : -1; 18359 } 18360 return boolA ? -1 : 1; 18361 }; 18362 var boolean_default = { 18363 type: "boolean", 18364 render, 18365 Edit: "checkbox", 18366 sort: sort3, 18367 validate: { 18368 required: isValidRequiredForBool, 18369 elements: isValidElements, 18370 custom: isValidCustom4 18371 }, 18372 enableSorting: true, 18373 enableGlobalSearch: false, 18374 defaultOperators: [OPERATOR_IS, OPERATOR_IS_NOT], 18375 validOperators: [OPERATOR_IS, OPERATOR_IS_NOT], 18376 format: {}, 18377 getValueFormatted: getValueFormatted6 18378 }; 18379 18380 // packages/dataviews/build-module/field-types/media.mjs 18381 var media_default = { 18382 type: "media", 18383 render: () => null, 18384 Edit: null, 18385 sort: () => 0, 18386 enableSorting: false, 18387 enableGlobalSearch: false, 18388 defaultOperators: [], 18389 validOperators: [], 18390 format: {}, 18391 getValueFormatted: get_value_formatted_default_default, 18392 // cannot validate any constraint, so 18393 // the only available validation for the field author 18394 // would be providing a custom validator. 18395 validate: {} 18396 }; 18397 18398 // packages/dataviews/build-module/field-types/array.mjs 18399 var import_i18n41 = __toESM(require_i18n(), 1); 18400 18401 // packages/dataviews/build-module/field-types/utils/is-valid-required-for-array.mjs 18402 function isValidRequiredForArray(item, field) { 18403 const value = field.getValue({ item }); 18404 return Array.isArray(value) && value.length > 0 && value.every( 18405 (element) => ![void 0, "", null].includes(element) 18406 ); 18407 } 18408 18409 // packages/dataviews/build-module/field-types/array.mjs 18410 function getValueFormatted7({ 18411 item, 18412 field 18413 }) { 18414 const value = field.getValue({ item }); 18415 const arr = Array.isArray(value) ? value : []; 18416 return arr.join(", "); 18417 } 18418 function render2({ item, field }) { 18419 return getValueFormatted7({ item, field }); 18420 } 18421 function isValidCustom5(item, field) { 18422 const value = field.getValue({ item }); 18423 if (![void 0, "", null].includes(value) && !Array.isArray(value)) { 18424 return (0, import_i18n41.__)("Value must be an array."); 18425 } 18426 if (!value.every((v2) => typeof v2 === "string")) { 18427 return (0, import_i18n41.__)("Every value must be a string."); 18428 } 18429 return null; 18430 } 18431 var sort4 = (a2, b2, direction) => { 18432 const arrA = Array.isArray(a2) ? a2 : []; 18433 const arrB = Array.isArray(b2) ? b2 : []; 18434 if (arrA.length !== arrB.length) { 18435 return direction === "asc" ? arrA.length - arrB.length : arrB.length - arrA.length; 18436 } 18437 const joinedA = arrA.join(","); 18438 const joinedB = arrB.join(","); 18439 return direction === "asc" ? joinedA.localeCompare(joinedB) : joinedB.localeCompare(joinedA); 18440 }; 18441 var array_default = { 18442 type: "array", 18443 render: render2, 18444 Edit: "array", 18445 sort: sort4, 18446 enableSorting: true, 18447 enableGlobalSearch: false, 18448 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 18449 validOperators: [ 18450 OPERATOR_IS_ANY, 18451 OPERATOR_IS_NONE, 18452 OPERATOR_IS_ALL, 18453 OPERATOR_IS_NOT_ALL 18454 ], 18455 format: {}, 18456 getValueFormatted: getValueFormatted7, 18457 validate: { 18458 required: isValidRequiredForArray, 18459 elements: isValidElements, 18460 custom: isValidCustom5 18461 } 18462 }; 18463 18464 // packages/dataviews/build-module/field-types/password.mjs 18465 function getValueFormatted8({ 18466 item, 18467 field 18468 }) { 18469 return field.getValue({ item }) ? "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" : ""; 18470 } 18471 var password_default = { 18472 type: "password", 18473 render, 18474 Edit: "password", 18475 sort: () => 0, 18476 // Passwords should not be sortable for security reasons 18477 enableSorting: false, 18478 enableGlobalSearch: false, 18479 defaultOperators: [], 18480 validOperators: [], 18481 format: {}, 18482 getValueFormatted: getValueFormatted8, 18483 validate: { 18484 required: isValidRequired, 18485 pattern: isValidPattern, 18486 minLength: isValidMinLength, 18487 maxLength: isValidMaxLength, 18488 elements: isValidElements 18489 } 18490 }; 18491 18492 // packages/dataviews/build-module/field-types/telephone.mjs 18493 var telephone_default = { 18494 type: "telephone", 18495 render, 18496 Edit: "telephone", 18497 sort: sort_text_default, 18498 enableSorting: true, 18499 enableGlobalSearch: false, 18500 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 18501 validOperators: [ 18502 OPERATOR_IS, 18503 OPERATOR_IS_NOT, 18504 OPERATOR_CONTAINS, 18505 OPERATOR_NOT_CONTAINS, 18506 OPERATOR_STARTS_WITH, 18507 // Multiple selection 18508 OPERATOR_IS_ANY, 18509 OPERATOR_IS_NONE, 18510 OPERATOR_IS_ALL, 18511 OPERATOR_IS_NOT_ALL 18512 ], 18513 format: {}, 18514 getValueFormatted: get_value_formatted_default_default, 18515 validate: { 18516 required: isValidRequired, 18517 pattern: isValidPattern, 18518 minLength: isValidMinLength, 18519 maxLength: isValidMaxLength, 18520 elements: isValidElements 18521 } 18522 }; 18523 18524 // packages/dataviews/build-module/field-types/color.mjs 18525 var import_i18n42 = __toESM(require_i18n(), 1); 18526 var import_jsx_runtime108 = __toESM(require_jsx_runtime(), 1); 18527 function render3({ item, field }) { 18528 if (field.hasElements) { 18529 return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(RenderFromElements, { item, field }); 18530 } 18531 const value = get_value_formatted_default_default({ item, field }); 18532 if (!value || !w(value).isValid()) { 18533 return value; 18534 } 18535 return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [ 18536 /* @__PURE__ */ (0, import_jsx_runtime108.jsx)( 18537 "div", 18538 { 18539 style: { 18540 width: "16px", 18541 height: "16px", 18542 borderRadius: "50%", 18543 backgroundColor: value, 18544 border: "1px solid #ddd", 18545 flexShrink: 0 18546 } 18547 } 18548 ), 18549 /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { children: value }) 18550 ] }); 18551 } 18552 function isValidCustom6(item, field) { 18553 const value = field.getValue({ item }); 18554 if (![void 0, "", null].includes(value) && !w(value).isValid()) { 18555 return (0, import_i18n42.__)("Value must be a valid color."); 18556 } 18557 return null; 18558 } 18559 var sort5 = (a2, b2, direction) => { 18560 const colorA = w(a2); 18561 const colorB = w(b2); 18562 if (!colorA.isValid() && !colorB.isValid()) { 18563 return 0; 18564 } 18565 if (!colorA.isValid()) { 18566 return direction === "asc" ? 1 : -1; 18567 } 18568 if (!colorB.isValid()) { 18569 return direction === "asc" ? -1 : 1; 18570 } 18571 const hslA = colorA.toHsl(); 18572 const hslB = colorB.toHsl(); 18573 if (hslA.h !== hslB.h) { 18574 return direction === "asc" ? hslA.h - hslB.h : hslB.h - hslA.h; 18575 } 18576 if (hslA.s !== hslB.s) { 18577 return direction === "asc" ? hslA.s - hslB.s : hslB.s - hslA.s; 18578 } 18579 return direction === "asc" ? hslA.l - hslB.l : hslB.l - hslA.l; 18580 }; 18581 var color_default = { 18582 type: "color", 18583 render: render3, 18584 Edit: "color", 18585 sort: sort5, 18586 enableSorting: true, 18587 enableGlobalSearch: false, 18588 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 18589 validOperators: [ 18590 OPERATOR_IS, 18591 OPERATOR_IS_NOT, 18592 OPERATOR_IS_ANY, 18593 OPERATOR_IS_NONE 18594 ], 18595 format: {}, 18596 getValueFormatted: get_value_formatted_default_default, 18597 validate: { 18598 required: isValidRequired, 18599 elements: isValidElements, 18600 custom: isValidCustom6 18601 } 18602 }; 18603 18604 // packages/dataviews/build-module/field-types/url.mjs 18605 var url_default = { 18606 type: "url", 18607 render, 18608 Edit: "url", 18609 sort: sort_text_default, 18610 enableSorting: true, 18611 enableGlobalSearch: false, 18612 defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], 18613 validOperators: [ 18614 OPERATOR_IS, 18615 OPERATOR_IS_NOT, 18616 OPERATOR_CONTAINS, 18617 OPERATOR_NOT_CONTAINS, 18618 OPERATOR_STARTS_WITH, 18619 // Multiple selection 18620 OPERATOR_IS_ANY, 18621 OPERATOR_IS_NONE, 18622 OPERATOR_IS_ALL, 18623 OPERATOR_IS_NOT_ALL 18624 ], 18625 format: {}, 18626 getValueFormatted: get_value_formatted_default_default, 18627 validate: { 18628 required: isValidRequired, 18629 pattern: isValidPattern, 18630 minLength: isValidMinLength, 18631 maxLength: isValidMaxLength, 18632 elements: isValidElements 18633 } 18634 }; 18635 18636 // packages/dataviews/build-module/field-types/no-type.mjs 18637 var sort6 = (a2, b2, direction) => { 18638 if (typeof a2 === "number" && typeof b2 === "number") { 18639 return sort_number_default(a2, b2, direction); 18640 } 18641 return sort_text_default(a2, b2, direction); 18642 }; 18643 var no_type_default = { 18644 // type: no type for this one 18645 render, 18646 Edit: null, 18647 sort: sort6, 18648 enableSorting: true, 18649 enableGlobalSearch: false, 18650 defaultOperators: [OPERATOR_IS, OPERATOR_IS_NOT], 18651 validOperators: getAllOperatorNames(), 18652 format: {}, 18653 getValueFormatted: get_value_formatted_default_default, 18654 validate: { 18655 required: isValidRequired, 18656 elements: isValidElements 18657 } 18658 }; 18659 18660 // packages/dataviews/build-module/field-types/utils/get-is-valid.mjs 18661 function supportsNumericRangeConstraint(type) { 18662 return type === "integer" || type === "number"; 18663 } 18664 function supportsDateRangeConstraint(type) { 18665 return type === "date" || type === "datetime"; 18666 } 18667 function normalizeRangeRule(value, fieldType, key) { 18668 const validator = fieldType.validate[key]; 18669 if (validator && (typeof value === "number" && supportsNumericRangeConstraint(fieldType.type) || typeof value === "string" && supportsDateRangeConstraint(fieldType.type))) { 18670 return { constraint: value, validate: validator }; 18671 } 18672 return void 0; 18673 } 18674 function getIsValid(field, fieldType) { 18675 const rules = field.isValid; 18676 let required; 18677 if (rules?.required === true && fieldType.validate.required !== void 0) { 18678 required = { 18679 constraint: true, 18680 validate: fieldType.validate.required 18681 }; 18682 } 18683 let elements; 18684 if ((rules?.elements === true || // elements is enabled unless the field opts-out 18685 rules?.elements === void 0 && (!!field.elements || !!field.getElements)) && fieldType.validate.elements !== void 0) { 18686 elements = { 18687 constraint: true, 18688 validate: fieldType.validate.elements 18689 }; 18690 } 18691 const min = normalizeRangeRule(rules?.min, fieldType, "min"); 18692 const max = normalizeRangeRule(rules?.max, fieldType, "max"); 18693 const minLengthValue = rules?.minLength; 18694 let minLength; 18695 if (typeof minLengthValue === "number" && fieldType.validate.minLength !== void 0) { 18696 minLength = { 18697 constraint: minLengthValue, 18698 validate: fieldType.validate.minLength 18699 }; 18700 } 18701 const maxLengthValue = rules?.maxLength; 18702 let maxLength; 18703 if (typeof maxLengthValue === "number" && fieldType.validate.maxLength !== void 0) { 18704 maxLength = { 18705 constraint: maxLengthValue, 18706 validate: fieldType.validate.maxLength 18707 }; 18708 } 18709 const patternValue = rules?.pattern; 18710 let pattern; 18711 if (patternValue !== void 0 && fieldType.validate.pattern !== void 0) { 18712 pattern = { 18713 constraint: patternValue, 18714 validate: fieldType.validate.pattern 18715 }; 18716 } 18717 const custom = rules?.custom ?? fieldType.validate.custom; 18718 return { 18719 required, 18720 elements, 18721 min, 18722 max, 18723 minLength, 18724 maxLength, 18725 pattern, 18726 custom 18727 }; 18728 } 18729 18730 // packages/dataviews/build-module/field-types/utils/get-filter.mjs 18731 function getFilter(fieldType) { 18732 return fieldType.validOperators.reduce((accumulator, operator) => { 18733 const operatorObj = getOperatorByName(operator); 18734 if (operatorObj?.filter) { 18735 accumulator[operator] = operatorObj.filter; 18736 } 18737 return accumulator; 18738 }, {}); 18739 } 18740 18741 // packages/dataviews/build-module/field-types/utils/get-format.mjs 18742 function getFormat(field, fieldType) { 18743 return { 18744 ...fieldType.format, 18745 ...field.format 18746 }; 18747 } 18748 var get_format_default = getFormat; 18749 18750 // packages/dataviews/build-module/field-types/index.mjs 18751 function getFieldTypeByName(type) { 18752 const found = [ 18753 email_default, 18754 integer_default, 18755 number_default, 18756 text_default, 18757 datetime_default, 18758 date_default, 18759 boolean_default, 18760 media_default, 18761 array_default, 18762 password_default, 18763 telephone_default, 18764 color_default, 18765 url_default 18766 ].find((fieldType) => fieldType?.type === type); 18767 if (!!found) { 18768 return found; 18769 } 18770 return no_type_default; 18771 } 18772 function normalizeFields(fields) { 18773 return fields.map((field) => { 18774 const fieldType = getFieldTypeByName(field.type); 18775 const getValue = field.getValue || get_value_from_id_default(field.id); 18776 const sort7 = function(a2, b2, direction) { 18777 const aValue = getValue({ item: a2 }); 18778 const bValue = getValue({ item: b2 }); 18779 return field.sort ? field.sort(aValue, bValue, direction) : fieldType.sort(aValue, bValue, direction); 18780 }; 18781 return { 18782 id: field.id, 18783 label: field.label || field.id, 18784 header: field.header || field.label || field.id, 18785 description: field.description, 18786 placeholder: field.placeholder, 18787 getValue, 18788 setValue: field.setValue || set_value_from_id_default(field.id), 18789 elements: field.elements, 18790 getElements: field.getElements, 18791 hasElements: hasElements(field), 18792 isVisible: field.isVisible, 18793 isDisabled: typeof field.isDisabled === "function" ? field.isDisabled : () => !!field.isDisabled, 18794 enableHiding: field.enableHiding ?? true, 18795 readOnly: field.readOnly ?? false, 18796 // The type provides defaults for the following props 18797 type: fieldType.type, 18798 render: field.render ?? fieldType.render, 18799 Edit: getControl(field, fieldType.Edit), 18800 sort: sort7, 18801 enableSorting: field.enableSorting ?? fieldType.enableSorting, 18802 enableGlobalSearch: field.enableGlobalSearch ?? fieldType.enableGlobalSearch, 18803 isValid: getIsValid(field, fieldType), 18804 filterBy: get_filter_by_default( 18805 field, 18806 fieldType.defaultOperators, 18807 fieldType.validOperators 18808 ), 18809 filter: getFilter(fieldType), 18810 format: get_format_default(field, fieldType), 18811 getValueFormatted: field.getValueFormatted ?? fieldType.getValueFormatted 18812 }; 18813 }); 18814 } 18815 18816 // packages/dataviews/build-module/hooks/use-data.mjs 18817 var import_element73 = __toESM(require_element(), 1); 18818 function useData({ 18819 view, 18820 data: shownData, 18821 getItemId, 18822 isLoading, 18823 paginationInfo, 18824 selection 18825 }) { 18826 const isInfiniteScrollEnabled = view.infiniteScrollEnabled; 18827 const [hasInitiallyLoaded, setHasInitiallyLoaded] = (0, import_element73.useState)( 18828 !isLoading 18829 ); 18830 (0, import_element73.useEffect)(() => { 18831 if (!isLoading) { 18832 setHasInitiallyLoaded(true); 18833 } 18834 }, [isLoading]); 18835 const previousDataRef = (0, import_element73.useRef)(shownData); 18836 const previousPaginationInfoRef = (0, import_element73.useRef)(paginationInfo); 18837 (0, import_element73.useEffect)(() => { 18838 if (!isLoading) { 18839 previousDataRef.current = shownData; 18840 previousPaginationInfoRef.current = paginationInfo; 18841 } 18842 }, [shownData, isLoading, paginationInfo]); 18843 const [visibleEntries, setVisibleEntries] = (0, import_element73.useState)([]); 18844 const positionMapRef = (0, import_element73.useRef)(/* @__PURE__ */ new Map()); 18845 const allLoadedRecordsRef = (0, import_element73.useRef)([]); 18846 const prevViewParamsRef = (0, import_element73.useRef)({ 18847 search: void 0, 18848 filters: void 0, 18849 perPage: void 0 18850 }); 18851 const scrollDirectionRef = (0, import_element73.useRef)(void 0); 18852 const prevStartPositionRef = (0, import_element73.useRef)(void 0); 18853 const hasInitializedRef = (0, import_element73.useRef)(false); 18854 const allLoadedRecords = (0, import_element73.useMemo)(() => { 18855 if (view.startPosition !== void 0 && prevStartPositionRef.current !== void 0) { 18856 if (view.startPosition < prevStartPositionRef.current) { 18857 scrollDirectionRef.current = "up"; 18858 } else if (view.startPosition > prevStartPositionRef.current) { 18859 scrollDirectionRef.current = "down"; 18860 } 18861 } 18862 prevStartPositionRef.current = view.startPosition; 18863 const currentFiltersKey = JSON.stringify(view.filters ?? []); 18864 const prevFiltersKey = prevViewParamsRef.current.filters; 18865 const shouldReset = !hasInitializedRef.current || !view.infiniteScrollEnabled || view.search !== prevViewParamsRef.current.search || currentFiltersKey !== prevFiltersKey || view.perPage !== prevViewParamsRef.current.perPage; 18866 hasInitializedRef.current = true; 18867 prevViewParamsRef.current = { 18868 search: view.search, 18869 filters: currentFiltersKey, 18870 perPage: view.perPage 18871 }; 18872 if (shouldReset) { 18873 positionMapRef.current.clear(); 18874 scrollDirectionRef.current = void 0; 18875 const startPosition = view.search ? 1 : view.startPosition ?? 1; 18876 const records = shownData.map((record, index) => { 18877 const position = startPosition + index; 18878 positionMapRef.current.set(getItemId(record), position); 18879 return { 18880 ...record, 18881 position 18882 }; 18883 }); 18884 allLoadedRecordsRef.current = records; 18885 return records; 18886 } 18887 const prev = allLoadedRecordsRef.current; 18888 const shownDataIds = new Set(shownData.map(getItemId)); 18889 const scrollDirection = scrollDirectionRef.current; 18890 const basePosition = view.search ? 1 : view.startPosition ?? 1; 18891 const newRecords = shownData.map((record, index) => { 18892 const itemId = getItemId(record); 18893 const position = view.infiniteScrollEnabled ? basePosition + index : void 0; 18894 if (position !== void 0) { 18895 positionMapRef.current.set(itemId, position); 18896 } 18897 return { 18898 ...record, 18899 position 18900 }; 18901 }); 18902 if (newRecords.length === 0) { 18903 return prev; 18904 } 18905 const prevWithoutDuplicates = prev.filter( 18906 (record) => !shownDataIds.has(getItemId(record)) 18907 ); 18908 const allRecords = scrollDirection === "up" ? [...newRecords, ...prevWithoutDuplicates] : [...prevWithoutDuplicates, ...newRecords]; 18909 allRecords.sort((a2, b2) => { 18910 const posA = a2.position; 18911 const posB = b2.position; 18912 return posA - posB; 18913 }); 18914 let result = allRecords; 18915 if (visibleEntries.length > 0) { 18916 const visibleMin = Math.min(...visibleEntries); 18917 const visibleMax = Math.max(...visibleEntries); 18918 const buffer = 20; 18919 const recordPositions = allRecords.map( 18920 (r3) => r3.position 18921 ); 18922 const minRecordPos = Math.min(...recordPositions); 18923 const maxRecordPos = Math.max(...recordPositions); 18924 const hasOverlap = !(maxRecordPos < visibleMin - buffer || minRecordPos > visibleMax + buffer); 18925 if (hasOverlap) { 18926 result = allRecords.filter((record) => { 18927 const itemId = getItemId(record); 18928 const isSelected2 = selection?.includes(itemId); 18929 if (isSelected2) { 18930 return true; 18931 } 18932 const itemPosition = record.position; 18933 if (scrollDirection === "up") { 18934 return itemPosition <= visibleMax + buffer; 18935 } else if (scrollDirection === "down") { 18936 return itemPosition >= visibleMin - buffer; 18937 } 18938 return itemPosition >= visibleMin - buffer && itemPosition <= visibleMax + buffer; 18939 }); 18940 } 18941 } 18942 allLoadedRecordsRef.current = result; 18943 return result; 18944 }, [ 18945 shownData, 18946 view.search, 18947 view.filters, 18948 view.perPage, 18949 view.startPosition, 18950 view.infiniteScrollEnabled, 18951 visibleEntries, 18952 selection, 18953 getItemId 18954 ]); 18955 if (!isInfiniteScrollEnabled) { 18956 const dataToReturn = isLoading && previousDataRef.current?.length ? previousDataRef.current : shownData; 18957 return { 18958 data: dataToReturn.map((item) => ({ 18959 ...item, 18960 position: void 0 18961 })), 18962 paginationInfo: isLoading && previousDataRef.current?.length ? previousPaginationInfoRef.current : paginationInfo, 18963 hasInitiallyLoaded, 18964 setVisibleEntries: void 0 18965 }; 18966 } 18967 return { 18968 data: allLoadedRecords, 18969 paginationInfo, 18970 hasInitiallyLoaded, 18971 setVisibleEntries 18972 }; 18973 } 18974 18975 // packages/dataviews/build-module/hooks/use-infinite-scroll.mjs 18976 var import_element74 = __toESM(require_element(), 1); 18977 var import_compose11 = __toESM(require_compose(), 1); 18978 function captureAnchorElement(container, anchorElementRef, direction) { 18979 const containerRect = container.getBoundingClientRect(); 18980 const centerY = containerRect.top + containerRect.height / 2; 18981 const items = Array.from(container.querySelectorAll("[aria-posinset]")); 18982 if (items.length === 0) { 18983 return false; 18984 } 18985 const bestAnchor = items.reduce((best, item) => { 18986 const itemRect = item.getBoundingClientRect(); 18987 const itemCenterY = itemRect.top + itemRect.height / 2; 18988 const distance = Math.abs(itemCenterY - centerY); 18989 const bestRect = best.getBoundingClientRect(); 18990 const bestCenterY = bestRect.top + bestRect.height / 2; 18991 const bestDistance = Math.abs(bestCenterY - centerY); 18992 return distance < bestDistance ? item : best; 18993 }); 18994 const posinset = Number(bestAnchor.getAttribute("aria-posinset")); 18995 const anchorRect = bestAnchor.getBoundingClientRect(); 18996 anchorElementRef.current = { 18997 posinset, 18998 viewportOffset: anchorRect.top - containerRect.top, 18999 direction 19000 }; 19001 return true; 19002 } 19003 function useInfiniteScroll({ 19004 view, 19005 onChangeView, 19006 isLoading, 19007 paginationInfo, 19008 containerRef, 19009 setVisibleEntries 19010 }) { 19011 const anchorElementRef = (0, import_element74.useRef)(null); 19012 const viewRef = (0, import_element74.useRef)(view); 19013 const isLoadingRef = (0, import_element74.useRef)(isLoading); 19014 const onChangeViewRef = (0, import_element74.useRef)(onChangeView); 19015 const totalItemsRef = (0, import_element74.useRef)(paginationInfo.totalItems); 19016 (0, import_element74.useLayoutEffect)(() => { 19017 viewRef.current = view; 19018 isLoadingRef.current = isLoading; 19019 onChangeViewRef.current = onChangeView; 19020 totalItemsRef.current = paginationInfo.totalItems; 19021 }, [view, isLoading, onChangeView, paginationInfo.totalItems]); 19022 const intersectionObserverCallback = (0, import_element74.useCallback)( 19023 (entries) => { 19024 if (!setVisibleEntries) { 19025 return; 19026 } 19027 setVisibleEntries((prev) => { 19028 const newVisibleEntries = new Set(prev); 19029 let hasChanged = false; 19030 entries.forEach((entry) => { 19031 const posInSet = Number( 19032 entry.target?.attributes?.getNamedItem( 19033 "aria-posinset" 19034 )?.value 19035 ); 19036 if (isNaN(posInSet)) { 19037 return; 19038 } 19039 if (entry.isIntersecting) { 19040 if (!newVisibleEntries.has(posInSet)) { 19041 newVisibleEntries.add(posInSet); 19042 hasChanged = true; 19043 } 19044 } else if (newVisibleEntries.has(posInSet)) { 19045 newVisibleEntries.delete(posInSet); 19046 hasChanged = true; 19047 } 19048 }); 19049 return hasChanged ? Array.from(newVisibleEntries).sort() : prev; 19050 }); 19051 }, 19052 [setVisibleEntries] 19053 ); 19054 (0, import_element74.useLayoutEffect)(() => { 19055 const container = containerRef.current; 19056 const anchor = anchorElementRef.current; 19057 if (!container || !view.infiniteScrollEnabled || !anchor || isLoading) { 19058 return; 19059 } 19060 const anchorElement = container.querySelector( 19061 `[aria-posinset="$anchor.posinset}"]` 19062 ); 19063 if (anchorElement) { 19064 const containerRect = container.getBoundingClientRect(); 19065 const anchorRect = anchorElement.getBoundingClientRect(); 19066 const currentOffset = anchorRect.top - containerRect.top; 19067 const scrollAdjustment = currentOffset - anchor.viewportOffset; 19068 if (Math.abs(scrollAdjustment) > 1) { 19069 container.scrollTop += scrollAdjustment; 19070 } 19071 } 19072 anchorElementRef.current = null; 19073 }, [containerRef, isLoading, view.infiniteScrollEnabled]); 19074 const intersectionObserverRef = (0, import_element74.useRef)( 19075 null 19076 ); 19077 (0, import_element74.useEffect)(() => { 19078 if (!view.infiniteScrollEnabled || !intersectionObserverCallback) { 19079 if (intersectionObserverRef.current) { 19080 intersectionObserverRef.current.disconnect(); 19081 intersectionObserverRef.current = null; 19082 } 19083 return; 19084 } 19085 intersectionObserverRef.current = new IntersectionObserver( 19086 intersectionObserverCallback, 19087 { root: null, rootMargin: "0px", threshold: 0.1 } 19088 ); 19089 return () => { 19090 if (intersectionObserverRef.current) { 19091 intersectionObserverRef.current.disconnect(); 19092 intersectionObserverRef.current = null; 19093 } 19094 }; 19095 }, [view.infiniteScrollEnabled, intersectionObserverCallback]); 19096 (0, import_element74.useEffect)(() => { 19097 if (!view.infiniteScrollEnabled || !containerRef.current) { 19098 return; 19099 } 19100 let lastScrollTop = 0; 19101 const BOTTOM_THRESHOLD = 600; 19102 const TOP_THRESHOLD = 800; 19103 const handleScroll = (0, import_compose11.throttle)((event) => { 19104 const currentView = viewRef.current; 19105 const totalItems = totalItemsRef.current; 19106 const target = event.target; 19107 const scrollTop = target.scrollTop; 19108 const scrollHeight = target.scrollHeight; 19109 const clientHeight = target.clientHeight; 19110 const scrollDirection = scrollTop > lastScrollTop ? "down" : "up"; 19111 lastScrollTop = scrollTop; 19112 if (isLoadingRef.current) { 19113 return; 19114 } 19115 const currentStartPosition = currentView.startPosition || 1; 19116 const batchSize = currentView.perPage || 10; 19117 const currentEndPosition = Math.min( 19118 currentStartPosition + batchSize, 19119 totalItems 19120 ); 19121 if (scrollDirection === "down" && scrollTop + clientHeight >= scrollHeight - BOTTOM_THRESHOLD) { 19122 if (currentEndPosition < totalItems) { 19123 const newStartPosition = currentEndPosition; 19124 captureAnchorElement(target, anchorElementRef, "down"); 19125 onChangeViewRef.current({ 19126 ...currentView, 19127 startPosition: newStartPosition 19128 }); 19129 } 19130 } 19131 if (scrollDirection === "up" && scrollTop <= TOP_THRESHOLD) { 19132 if (currentStartPosition > 1) { 19133 const calculatedStartPosition = currentStartPosition - batchSize; 19134 const newStartPosition = calculatedStartPosition < 6 ? 1 : calculatedStartPosition; 19135 captureAnchorElement(target, anchorElementRef, "up"); 19136 onChangeViewRef.current({ 19137 ...currentView, 19138 startPosition: newStartPosition 19139 }); 19140 } 19141 } 19142 }, 50); 19143 const container = containerRef.current; 19144 container.addEventListener("scroll", handleScroll); 19145 return () => { 19146 container.removeEventListener("scroll", handleScroll); 19147 handleScroll.cancel(); 19148 }; 19149 }, [containerRef, view.infiniteScrollEnabled]); 19150 return { 19151 intersectionObserver: intersectionObserverRef.current 19152 }; 19153 } 19154 19155 // packages/dataviews/build-module/dataviews/index.mjs 19156 var import_jsx_runtime109 = __toESM(require_jsx_runtime(), 1); 19157 var defaultGetItemId = (item) => item.id; 19158 var defaultIsItemClickable = () => true; 19159 var EMPTY_ARRAY6 = []; 19160 var DEFAULT_LAYOUTS = { table: {}, grid: {}, list: {} }; 19161 var dataViewsLayouts = VIEW_LAYOUTS.filter( 19162 (viewLayout) => !viewLayout.isPicker 19163 ); 19164 function DefaultUI({ 19165 header, 19166 search = true, 19167 searchLabel = void 0 19168 }) { 19169 const { view } = (0, import_element75.useContext)(dataviews_context_default); 19170 const isInfiniteScroll = view.infiniteScrollEnabled; 19171 return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(import_jsx_runtime109.Fragment, { children: [ 19172 /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)( 19173 Stack, 19174 { 19175 direction: "row", 19176 align: "top", 19177 justify: "space-between", 19178 className: clsx_default("dataviews__view-actions", { 19179 "dataviews__view-actions--infinite-scroll": isInfiniteScroll 19180 }), 19181 gap: "xs", 19182 children: [ 19183 /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)( 19184 Stack, 19185 { 19186 direction: "row", 19187 justify: "start", 19188 gap: "sm", 19189 className: "dataviews__search", 19190 children: [ 19191 search && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(dataviews_search_default, { label: searchLabel }), 19192 /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(toggle_default, {}) 19193 ] 19194 } 19195 ), 19196 /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(Stack, { direction: "row", gap: "xs", style: { flexShrink: 0 }, children: [ 19197 /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(dataviews_view_config_default, {}), 19198 header 19199 ] }) 19200 ] 19201 } 19202 ), 19203 /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(filters_toggled_default, { className: "dataviews-filters__container" }), 19204 /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(DataViewsLayout, {}), 19205 /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(DataViewsFooter, {}) 19206 ] }); 19207 } 19208 function DataViews({ 19209 view, 19210 onChangeView, 19211 fields, 19212 search = true, 19213 searchLabel = void 0, 19214 actions = EMPTY_ARRAY6, 19215 data, 19216 getItemId = defaultGetItemId, 19217 getItemLevel, 19218 isLoading = false, 19219 paginationInfo, 19220 defaultLayouts: defaultLayoutsProperty = DEFAULT_LAYOUTS, 19221 selection: selectionProperty, 19222 onChangeSelection, 19223 onClickItem, 19224 renderItemLink, 19225 isItemClickable = defaultIsItemClickable, 19226 header, 19227 children, 19228 config = { perPageSizes: [10, 20, 50, 100] }, 19229 empty, 19230 onReset 19231 }) { 19232 const [selectionState, setSelectionState] = (0, import_element75.useState)([]); 19233 const isUncontrolled = selectionProperty === void 0 || onChangeSelection === void 0; 19234 const selection = isUncontrolled ? selectionState : selectionProperty; 19235 const { 19236 data: displayData, 19237 paginationInfo: displayPaginationInfo, 19238 hasInitiallyLoaded, 19239 setVisibleEntries 19240 } = useData({ 19241 view, 19242 data, 19243 getItemId, 19244 isLoading, 19245 selection, 19246 paginationInfo 19247 }); 19248 const containerRef = (0, import_element75.useRef)(null); 19249 const [containerWidth, setContainerWidth] = (0, import_element75.useState)(0); 19250 const resizeObserverRef = (0, import_compose12.useResizeObserver)( 19251 (resizeObserverEntries) => { 19252 setContainerWidth( 19253 resizeObserverEntries[0].borderBoxSize[0].inlineSize 19254 ); 19255 }, 19256 { box: "border-box" } 19257 ); 19258 const [openedFilter, setOpenedFilter] = (0, import_element75.useState)(null); 19259 function setSelectionWithChange(value) { 19260 const newValue = typeof value === "function" ? value(selection) : value; 19261 if (isUncontrolled) { 19262 setSelectionState(newValue); 19263 } 19264 if (onChangeSelection) { 19265 onChangeSelection(newValue); 19266 } 19267 } 19268 const _fields = (0, import_element75.useMemo)(() => normalizeFields(fields), [fields]); 19269 const _selection = (0, import_element75.useMemo)(() => { 19270 if (view.infiniteScrollEnabled) { 19271 return selection; 19272 } 19273 return selection.filter( 19274 (id) => data.some((item) => getItemId(item) === id) 19275 ); 19276 }, [selection, data, getItemId, view.infiniteScrollEnabled]); 19277 const filters = use_filters_default(_fields, view); 19278 const hasPrimaryOrLockedFilters = (0, import_element75.useMemo)( 19279 () => (filters || []).some( 19280 (filter) => filter.isPrimary || filter.isLocked 19281 ), 19282 [filters] 19283 ); 19284 const [isShowingFilter, setIsShowingFilter] = (0, import_element75.useState)( 19285 hasPrimaryOrLockedFilters 19286 ); 19287 const { intersectionObserver } = useInfiniteScroll({ 19288 view, 19289 onChangeView, 19290 isLoading, 19291 paginationInfo, 19292 containerRef, 19293 setVisibleEntries 19294 }); 19295 (0, import_element75.useEffect)(() => { 19296 if (hasPrimaryOrLockedFilters && !isShowingFilter) { 19297 setIsShowingFilter(true); 19298 } 19299 }, [hasPrimaryOrLockedFilters, isShowingFilter]); 19300 const defaultLayouts2 = (0, import_element75.useMemo)( 19301 () => Object.fromEntries( 19302 Object.entries(defaultLayoutsProperty).filter(([layoutType]) => { 19303 return dataViewsLayouts.some( 19304 (viewLayout) => viewLayout.type === layoutType 19305 ); 19306 }).map(([key, value]) => [ 19307 key, 19308 value === true ? {} : value 19309 ]) 19310 ), 19311 [defaultLayoutsProperty] 19312 ); 19313 if (!defaultLayouts2[view.type]) { 19314 return null; 19315 } 19316 return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)( 19317 dataviews_context_default.Provider, 19318 { 19319 value: { 19320 view, 19321 onChangeView, 19322 fields: _fields, 19323 actions, 19324 data: displayData, 19325 isLoading, 19326 paginationInfo: displayPaginationInfo, 19327 selection: _selection, 19328 onChangeSelection: setSelectionWithChange, 19329 openedFilter, 19330 setOpenedFilter, 19331 getItemId, 19332 getItemLevel, 19333 isItemClickable, 19334 onClickItem, 19335 renderItemLink, 19336 containerWidth, 19337 containerRef, 19338 resizeObserverRef, 19339 defaultLayouts: defaultLayouts2, 19340 filters, 19341 isShowingFilter, 19342 setIsShowingFilter, 19343 config, 19344 empty, 19345 hasInitiallyLoaded, 19346 onReset, 19347 intersectionObserver 19348 }, 19349 children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "dataviews-wrapper", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)( 19350 DefaultUI, 19351 { 19352 header, 19353 search, 19354 searchLabel 19355 } 19356 ) }) 19357 } 19358 ); 19359 } 19360 var DataViewsSubComponents = DataViews; 19361 DataViewsSubComponents.BulkActionToolbar = BulkActionsFooter; 19362 DataViewsSubComponents.Filters = filters_default; 19363 DataViewsSubComponents.FiltersToggled = filters_toggled_default; 19364 DataViewsSubComponents.FiltersToggle = toggle_default; 19365 DataViewsSubComponents.Layout = DataViewsLayout; 19366 DataViewsSubComponents.LayoutSwitcher = ViewTypeMenu; 19367 DataViewsSubComponents.Pagination = DataViewsPagination; 19368 DataViewsSubComponents.Search = dataviews_search_default; 19369 DataViewsSubComponents.ViewConfig = DataviewsViewConfigDropdown; 19370 DataViewsSubComponents.Footer = DataViewsFooter; 19371 var dataviews_default = DataViewsSubComponents; 19372 19373 // packages/dataviews/build-module/dataform/index.mjs 19374 var import_element87 = __toESM(require_element(), 1); 19375 19376 // packages/dataviews/build-module/components/dataform-context/index.mjs 19377 var import_element76 = __toESM(require_element(), 1); 19378 var import_jsx_runtime110 = __toESM(require_jsx_runtime(), 1); 19379 var DataFormContext = (0, import_element76.createContext)({ 19380 fields: [] 19381 }); 19382 DataFormContext.displayName = "DataFormContext"; 19383 function DataFormProvider({ 19384 fields, 19385 children 19386 }) { 19387 return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(DataFormContext.Provider, { value: { fields }, children }); 19388 } 19389 var dataform_context_default = DataFormContext; 19390 19391 // packages/dataviews/build-module/components/dataform-layouts/data-form-layout.mjs 19392 var import_element86 = __toESM(require_element(), 1); 19393 19394 // packages/dataviews/build-module/components/dataform-layouts/regular/index.mjs 19395 var import_element77 = __toESM(require_element(), 1); 19396 var import_components46 = __toESM(require_components(), 1); 19397 19398 // packages/dataviews/build-module/components/dataform-layouts/normalize-form.mjs 19399 var import_i18n43 = __toESM(require_i18n(), 1); 19400 var DEFAULT_LAYOUT = { 19401 type: "regular", 19402 labelPosition: "top" 19403 }; 19404 var normalizeCardSummaryField = (sum) => { 19405 if (typeof sum === "string") { 19406 return [{ id: sum, visibility: "when-collapsed" }]; 19407 } 19408 return sum.map((item) => { 19409 if (typeof item === "string") { 19410 return { id: item, visibility: "when-collapsed" }; 19411 } 19412 return { id: item.id, visibility: item.visibility }; 19413 }); 19414 }; 19415 function normalizeLayout(layout) { 19416 let normalizedLayout = DEFAULT_LAYOUT; 19417 if (layout?.type === "regular") { 19418 normalizedLayout = { 19419 type: "regular", 19420 labelPosition: layout?.labelPosition ?? "top" 19421 }; 19422 } else if (layout?.type === "panel") { 19423 const summary = layout.summary ?? []; 19424 const normalizedSummary = Array.isArray(summary) ? summary : [summary]; 19425 const openAs = layout?.openAs; 19426 let normalizedOpenAs; 19427 if (typeof openAs === "object" && openAs.type === "modal") { 19428 normalizedOpenAs = { 19429 type: "modal", 19430 applyLabel: openAs.applyLabel?.trim() || (0, import_i18n43.__)("Apply"), 19431 cancelLabel: openAs.cancelLabel?.trim() || (0, import_i18n43.__)("Cancel") 19432 }; 19433 } else if (openAs === "modal") { 19434 normalizedOpenAs = { 19435 type: "modal", 19436 applyLabel: (0, import_i18n43.__)("Apply"), 19437 cancelLabel: (0, import_i18n43.__)("Cancel") 19438 }; 19439 } else { 19440 normalizedOpenAs = { type: "dropdown" }; 19441 } 19442 normalizedLayout = { 19443 type: "panel", 19444 labelPosition: layout?.labelPosition ?? "side", 19445 openAs: normalizedOpenAs, 19446 summary: normalizedSummary, 19447 editVisibility: layout?.editVisibility ?? "on-hover" 19448 }; 19449 } else if (layout?.type === "card") { 19450 if (layout.withHeader === false) { 19451 normalizedLayout = { 19452 type: "card", 19453 withHeader: false, 19454 isOpened: true, 19455 summary: [], 19456 isCollapsible: false 19457 }; 19458 } else { 19459 const summary = layout.summary ?? []; 19460 normalizedLayout = { 19461 type: "card", 19462 withHeader: true, 19463 isOpened: typeof layout.isOpened === "boolean" ? layout.isOpened : true, 19464 summary: normalizeCardSummaryField(summary), 19465 isCollapsible: layout.isCollapsible === void 0 ? true : layout.isCollapsible 19466 }; 19467 } 19468 } else if (layout?.type === "row") { 19469 normalizedLayout = { 19470 type: "row", 19471 alignment: layout?.alignment ?? "center", 19472 styles: layout?.styles ?? {} 19473 }; 19474 } else if (layout?.type === "details") { 19475 normalizedLayout = { 19476 type: "details", 19477 summary: layout?.summary ?? "" 19478 }; 19479 } 19480 return normalizedLayout; 19481 } 19482 function normalizeForm(form) { 19483 const normalizedFormLayout = normalizeLayout(form?.layout); 19484 const normalizedFields = (form.fields ?? []).map( 19485 (field) => { 19486 if (typeof field === "string") { 19487 return { 19488 id: field, 19489 layout: normalizedFormLayout 19490 }; 19491 } 19492 const fieldLayout = field.layout ? normalizeLayout(field.layout) : normalizedFormLayout; 19493 return { 19494 id: field.id, 19495 layout: fieldLayout, 19496 ...!!field.label && { label: field.label }, 19497 ...!!field.description && { 19498 description: field.description 19499 }, 19500 ..."children" in field && Array.isArray(field.children) && { 19501 children: normalizeForm({ 19502 fields: field.children, 19503 layout: DEFAULT_LAYOUT 19504 }).fields 19505 } 19506 }; 19507 } 19508 ); 19509 return { 19510 layout: normalizedFormLayout, 19511 fields: normalizedFields 19512 }; 19513 } 19514 var normalize_form_default = normalizeForm; 19515 19516 // packages/dataviews/build-module/components/dataform-layouts/regular/index.mjs 19517 var import_jsx_runtime111 = __toESM(require_jsx_runtime(), 1); 19518 function Header4({ title }) { 19519 return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19520 Stack, 19521 { 19522 direction: "column", 19523 className: "dataforms-layouts-regular__header", 19524 gap: "lg", 19525 children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(Stack, { direction: "row", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components46.__experimentalHeading, { level: 2, size: 13, children: title }) }) 19526 } 19527 ); 19528 } 19529 function FormRegularField({ 19530 data, 19531 field, 19532 onChange, 19533 hideLabelFromVision, 19534 markWhenOptional, 19535 validity 19536 }) { 19537 const { fields } = (0, import_element77.useContext)(dataform_context_default); 19538 const layout = field.layout; 19539 const form = (0, import_element77.useMemo)( 19540 () => ({ 19541 layout: DEFAULT_LAYOUT, 19542 fields: !!field.children ? field.children : [] 19543 }), 19544 [field] 19545 ); 19546 if (!!field.children) { 19547 return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_jsx_runtime111.Fragment, { children: [ 19548 !hideLabelFromVision && field.label && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(Header4, { title: field.label }), 19549 /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19550 DataFormLayout, 19551 { 19552 data, 19553 form, 19554 onChange, 19555 validity: validity?.children 19556 } 19557 ) 19558 ] }); 19559 } 19560 const labelPosition = layout.labelPosition; 19561 const fieldDefinition = fields.find( 19562 (fieldDef) => fieldDef.id === field.id 19563 ); 19564 if (!fieldDefinition || !fieldDefinition.Edit) { 19565 return null; 19566 } 19567 if (labelPosition === "side") { 19568 return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)( 19569 Stack, 19570 { 19571 direction: "row", 19572 className: "dataforms-layouts-regular__field", 19573 gap: "sm", 19574 children: [ 19575 /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19576 "div", 19577 { 19578 className: clsx_default( 19579 "dataforms-layouts-regular__field-label", 19580 `dataforms-layouts-regular__field-label--label-position-$labelPosition}` 19581 ), 19582 children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components46.BaseControl.VisualLabel, { children: fieldDefinition.label }) 19583 } 19584 ), 19585 /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "dataforms-layouts-regular__field-control", children: fieldDefinition.readOnly === true ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19586 fieldDefinition.render, 19587 { 19588 item: data, 19589 field: fieldDefinition 19590 } 19591 ) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19592 fieldDefinition.Edit, 19593 { 19594 data, 19595 field: fieldDefinition, 19596 onChange, 19597 hideLabelFromVision: true, 19598 markWhenOptional, 19599 validity 19600 }, 19601 fieldDefinition.id 19602 ) }) 19603 ] 19604 } 19605 ); 19606 } 19607 return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "dataforms-layouts-regular__field", children: fieldDefinition.readOnly === true ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_jsx_runtime111.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_jsx_runtime111.Fragment, { children: [ 19608 !hideLabelFromVision && labelPosition !== "none" && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components46.BaseControl.VisualLabel, { children: fieldDefinition.label }), 19609 /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19610 fieldDefinition.render, 19611 { 19612 item: data, 19613 field: fieldDefinition 19614 } 19615 ) 19616 ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( 19617 fieldDefinition.Edit, 19618 { 19619 data, 19620 field: fieldDefinition, 19621 onChange, 19622 hideLabelFromVision: labelPosition === "none" ? true : hideLabelFromVision, 19623 markWhenOptional, 19624 validity 19625 } 19626 ) }); 19627 } 19628 19629 // packages/dataviews/build-module/components/dataform-layouts/panel/modal.mjs 19630 var import_deepmerge2 = __toESM(require_cjs(), 1); 19631 var import_components49 = __toESM(require_components(), 1); 19632 var import_element82 = __toESM(require_element(), 1); 19633 var import_compose14 = __toESM(require_compose(), 1); 19634 19635 // packages/dataviews/build-module/components/dataform-layouts/panel/summary-button.mjs 19636 var import_components48 = __toESM(require_components(), 1); 19637 var import_i18n44 = __toESM(require_i18n(), 1); 19638 var import_compose13 = __toESM(require_compose(), 1); 19639 var import_element78 = __toESM(require_element(), 1); 19640 19641 // packages/dataviews/build-module/components/dataform-layouts/panel/utils/get-label-classname.mjs 19642 function getLabelClassName(labelPosition, showError) { 19643 return clsx_default( 19644 "dataforms-layouts-panel__field-label", 19645 `dataforms-layouts-panel__field-label--label-position-$labelPosition}`, 19646 { "has-error": showError } 19647 ); 19648 } 19649 var get_label_classname_default = getLabelClassName; 19650 19651 // packages/dataviews/build-module/components/dataform-layouts/panel/utils/get-label-content.mjs 19652 var import_components47 = __toESM(require_components(), 1); 19653 var import_jsx_runtime112 = __toESM(require_jsx_runtime(), 1); 19654 function getLabelContent(showError, errorMessage, fieldLabel) { 19655 return showError ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_components47.Tooltip, { text: errorMessage, placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("span", { className: "dataforms-layouts-panel__field-label-error-content", children: [ 19656 /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_components47.Icon, { icon: error_default, size: 16 }), 19657 fieldLabel 19658 ] }) }) : fieldLabel; 19659 } 19660 var get_label_content_default = getLabelContent; 19661 19662 // packages/dataviews/build-module/components/dataform-layouts/panel/utils/get-first-validation-error.mjs 19663 function getFirstValidationError(validity) { 19664 if (!validity) { 19665 return void 0; 19666 } 19667 const validityRules = Object.keys(validity).filter( 19668 (key) => key !== "children" 19669 ); 19670 for (const key of validityRules) { 19671 const rule = validity[key]; 19672 if (rule === void 0) { 19673 continue; 19674 } 19675 if (rule.type === "invalid") { 19676 if (rule.message) { 19677 return rule.message; 19678 } 19679 if (key === "required") { 19680 return "A required field is empty"; 19681 } 19682 return "Unidentified validation error"; 19683 } 19684 } 19685 if (validity.children) { 19686 for (const childValidity of Object.values(validity.children)) { 19687 const childError = getFirstValidationError(childValidity); 19688 if (childError) { 19689 return childError; 19690 } 19691 } 19692 } 19693 return void 0; 19694 } 19695 var get_first_validation_error_default = getFirstValidationError; 19696 19697 // packages/dataviews/build-module/components/dataform-layouts/panel/summary-button.mjs 19698 var import_jsx_runtime113 = __toESM(require_jsx_runtime(), 1); 19699 function SummaryButton({ 19700 data, 19701 field, 19702 fieldLabel, 19703 summaryFields, 19704 validity, 19705 touched, 19706 disabled: disabled2, 19707 onClick, 19708 "aria-expanded": ariaExpanded 19709 }) { 19710 const { labelPosition, editVisibility } = field.layout; 19711 const errorMessage = get_first_validation_error_default(validity); 19712 const showError = touched && !!errorMessage; 19713 const labelClassName = get_label_classname_default(labelPosition, showError); 19714 const labelContent = get_label_content_default(showError, errorMessage, fieldLabel); 19715 const className = clsx_default( 19716 "dataforms-layouts-panel__field-trigger", 19717 `dataforms-layouts-panel__field-trigger--label-$labelPosition}`, 19718 { 19719 "is-disabled": disabled2, 19720 "dataforms-layouts-panel__field-trigger--edit-always": editVisibility === "always" 19721 } 19722 ); 19723 const controlId = (0, import_compose13.useInstanceId)( 19724 SummaryButton, 19725 "dataforms-layouts-panel__field-control" 19726 ); 19727 const ariaLabel = showError ? (0, import_i18n44.sprintf)( 19728 // translators: %s: Field name. 19729 (0, import_i18n44._x)("Edit %s (has errors)", "field"), 19730 fieldLabel || "" 19731 ) : (0, import_i18n44.sprintf)( 19732 // translators: %s: Field name. 19733 (0, import_i18n44._x)("Edit %s", "field"), 19734 fieldLabel || "" 19735 ); 19736 const rowRef = (0, import_element78.useRef)(null); 19737 const handleRowClick = () => { 19738 const selection = rowRef.current?.ownerDocument.defaultView?.getSelection(); 19739 if (selection && selection.toString().length > 0) { 19740 return; 19741 } 19742 onClick(); 19743 }; 19744 const handleKeyDown = (event) => { 19745 if (event.target === event.currentTarget && (event.key === "Enter" || event.key === " ")) { 19746 event.preventDefault(); 19747 onClick(); 19748 } 19749 }; 19750 return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)( 19751 "div", 19752 { 19753 ref: rowRef, 19754 className, 19755 onClick: !disabled2 ? handleRowClick : void 0, 19756 onKeyDown: !disabled2 ? handleKeyDown : void 0, 19757 children: [ 19758 labelPosition !== "none" && /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("span", { className: labelClassName, children: labelContent }), 19759 labelPosition === "none" && showError && /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_components48.Tooltip, { text: errorMessage, placement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("span", { className: "dataforms-layouts-panel__field-label-error-content", children: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_components48.Icon, { icon: error_default, size: 16 }) }) }), 19760 /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19761 "span", 19762 { 19763 id: `$controlId}`, 19764 className: "dataforms-layouts-panel__field-control", 19765 children: summaryFields.length > 1 ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19766 "span", 19767 { 19768 style: { 19769 display: "flex", 19770 flexDirection: "column", 19771 alignItems: "flex-start", 19772 width: "100%", 19773 gap: "2px" 19774 }, 19775 children: summaryFields.map((summaryField) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19776 "span", 19777 { 19778 style: { width: "100%" }, 19779 children: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19780 summaryField.render, 19781 { 19782 item: data, 19783 field: summaryField 19784 } 19785 ) 19786 }, 19787 summaryField.id 19788 )) 19789 } 19790 ) : summaryFields.map((summaryField) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19791 summaryField.render, 19792 { 19793 item: data, 19794 field: summaryField 19795 }, 19796 summaryField.id 19797 )) 19798 } 19799 ), 19800 !disabled2 && /* @__PURE__ */ (0, import_jsx_runtime113.jsx)( 19801 import_components48.Button, 19802 { 19803 className: "dataforms-layouts-panel__field-trigger-icon", 19804 label: ariaLabel, 19805 icon: pencil_default, 19806 size: "small", 19807 "aria-expanded": ariaExpanded, 19808 "aria-haspopup": "dialog", 19809 "aria-describedby": `$controlId}` 19810 } 19811 ) 19812 ] 19813 } 19814 ); 19815 } 19816 19817 // packages/dataviews/build-module/hooks/use-form-validity.mjs 19818 var import_deepmerge = __toESM(require_cjs(), 1); 19819 var import_es62 = __toESM(require_es6(), 1); 19820 var import_element79 = __toESM(require_element(), 1); 19821 var import_i18n45 = __toESM(require_i18n(), 1); 19822 function isFormValid(formValidity) { 19823 if (!formValidity) { 19824 return true; 19825 } 19826 return Object.values(formValidity).every((fieldValidation) => { 19827 return Object.entries(fieldValidation).every( 19828 ([key, validation]) => { 19829 if (key === "children" && validation && typeof validation === "object") { 19830 return isFormValid(validation); 19831 } 19832 return validation.type !== "invalid" && validation.type !== "validating"; 19833 } 19834 ); 19835 }); 19836 } 19837 function getFormFieldsToValidate(form, fields) { 19838 const normalizedForm = normalize_form_default(form); 19839 if (normalizedForm.fields.length === 0) { 19840 return []; 19841 } 19842 const fieldsMap = /* @__PURE__ */ new Map(); 19843 fields.forEach((field) => { 19844 fieldsMap.set(field.id, field); 19845 }); 19846 function processFormField(formField) { 19847 if ("children" in formField && Array.isArray(formField.children)) { 19848 const processedChildren = formField.children.map(processFormField).filter((child) => child !== null); 19849 if (processedChildren.length === 0) { 19850 return null; 19851 } 19852 const fieldDef2 = fieldsMap.get(formField.id); 19853 if (fieldDef2) { 19854 const [normalizedField2] = normalizeFields([ 19855 fieldDef2 19856 ]); 19857 return { 19858 id: formField.id, 19859 children: processedChildren, 19860 field: normalizedField2 19861 }; 19862 } 19863 return { 19864 id: formField.id, 19865 children: processedChildren 19866 }; 19867 } 19868 const fieldDef = fieldsMap.get(formField.id); 19869 if (!fieldDef) { 19870 return null; 19871 } 19872 const [normalizedField] = normalizeFields([fieldDef]); 19873 return { 19874 id: formField.id, 19875 children: [], 19876 field: normalizedField 19877 }; 19878 } 19879 const toValidate = normalizedForm.fields.map(processFormField).filter((field) => field !== null); 19880 return toValidate; 19881 } 19882 function setValidityAtPath(formValidity, fieldValidity, path) { 19883 if (!formValidity) { 19884 formValidity = {}; 19885 } 19886 if (path.length === 0) { 19887 return formValidity; 19888 } 19889 const result = { ...formValidity }; 19890 let current = result; 19891 for (let i2 = 0; i2 < path.length - 1; i2++) { 19892 const segment = path[i2]; 19893 if (!current[segment]) { 19894 current[segment] = {}; 19895 } 19896 current[segment] = { ...current[segment] }; 19897 current = current[segment]; 19898 } 19899 const finalKey = path[path.length - 1]; 19900 current[finalKey] = { 19901 ...current[finalKey] || {}, 19902 ...fieldValidity 19903 }; 19904 return result; 19905 } 19906 function removeValidationProperty(formValidity, path, property) { 19907 if (!formValidity || path.length === 0) { 19908 return formValidity; 19909 } 19910 const result = { ...formValidity }; 19911 let current = result; 19912 for (let i2 = 0; i2 < path.length - 1; i2++) { 19913 const segment = path[i2]; 19914 if (!current[segment]) { 19915 return formValidity; 19916 } 19917 current[segment] = { ...current[segment] }; 19918 current = current[segment]; 19919 } 19920 const finalKey = path[path.length - 1]; 19921 if (!current[finalKey]) { 19922 return formValidity; 19923 } 19924 const fieldValidity = { ...current[finalKey] }; 19925 delete fieldValidity[property]; 19926 if (Object.keys(fieldValidity).length === 0) { 19927 delete current[finalKey]; 19928 } else { 19929 current[finalKey] = fieldValidity; 19930 } 19931 if (Object.keys(result).length === 0) { 19932 return void 0; 19933 } 19934 return result; 19935 } 19936 function handleElementsValidationAsync(promise, formField, promiseHandler) { 19937 const { elementsCounterRef, setFormValidity, path, item } = promiseHandler; 19938 const currentToken = (elementsCounterRef.current[formField.id] || 0) + 1; 19939 elementsCounterRef.current[formField.id] = currentToken; 19940 promise.then((result) => { 19941 if (currentToken !== elementsCounterRef.current[formField.id]) { 19942 return; 19943 } 19944 if (!Array.isArray(result)) { 19945 setFormValidity((prev) => { 19946 const newFormValidity = setValidityAtPath( 19947 prev, 19948 { 19949 elements: { 19950 type: "invalid", 19951 message: (0, import_i18n45.__)("Could not validate elements.") 19952 } 19953 }, 19954 [...path, formField.id] 19955 ); 19956 return newFormValidity; 19957 }); 19958 return; 19959 } 19960 if (formField.field?.isValid.elements && !formField.field.isValid.elements.validate(item, { 19961 ...formField.field, 19962 elements: result 19963 })) { 19964 setFormValidity((prev) => { 19965 const newFormValidity = setValidityAtPath( 19966 prev, 19967 { 19968 elements: { 19969 type: "invalid", 19970 message: (0, import_i18n45.__)( 19971 "Value must be one of the elements." 19972 ) 19973 } 19974 }, 19975 [...path, formField.id] 19976 ); 19977 return newFormValidity; 19978 }); 19979 } else { 19980 setFormValidity((prev) => { 19981 return removeValidationProperty( 19982 prev, 19983 [...path, formField.id], 19984 "elements" 19985 ); 19986 }); 19987 } 19988 }).catch((error2) => { 19989 if (currentToken !== elementsCounterRef.current[formField.id]) { 19990 return; 19991 } 19992 let errorMessage; 19993 if (error2 instanceof Error) { 19994 errorMessage = error2.message; 19995 } else { 19996 errorMessage = String(error2) || (0, import_i18n45.__)( 19997 "Unknown error when running elements validation asynchronously." 19998 ); 19999 } 20000 setFormValidity((prev) => { 20001 const newFormValidity = setValidityAtPath( 20002 prev, 20003 { 20004 elements: { 20005 type: "invalid", 20006 message: errorMessage 20007 } 20008 }, 20009 [...path, formField.id] 20010 ); 20011 return newFormValidity; 20012 }); 20013 }); 20014 } 20015 function handleCustomValidationAsync(promise, formField, promiseHandler) { 20016 const { customCounterRef, setFormValidity, path } = promiseHandler; 20017 const currentToken = (customCounterRef.current[formField.id] || 0) + 1; 20018 customCounterRef.current[formField.id] = currentToken; 20019 promise.then((result) => { 20020 if (currentToken !== customCounterRef.current[formField.id]) { 20021 return; 20022 } 20023 if (result === null) { 20024 setFormValidity((prev) => { 20025 return removeValidationProperty( 20026 prev, 20027 [...path, formField.id], 20028 "custom" 20029 ); 20030 }); 20031 return; 20032 } 20033 if (typeof result === "string") { 20034 setFormValidity((prev) => { 20035 const newFormValidity = setValidityAtPath( 20036 prev, 20037 { 20038 custom: { 20039 type: "invalid", 20040 message: result 20041 } 20042 }, 20043 [...path, formField.id] 20044 ); 20045 return newFormValidity; 20046 }); 20047 return; 20048 } 20049 setFormValidity((prev) => { 20050 const newFormValidity = setValidityAtPath( 20051 prev, 20052 { 20053 custom: { 20054 type: "invalid", 20055 message: (0, import_i18n45.__)("Validation could not be processed.") 20056 } 20057 }, 20058 [...path, formField.id] 20059 ); 20060 return newFormValidity; 20061 }); 20062 }).catch((error2) => { 20063 if (currentToken !== customCounterRef.current[formField.id]) { 20064 return; 20065 } 20066 let errorMessage; 20067 if (error2 instanceof Error) { 20068 errorMessage = error2.message; 20069 } else { 20070 errorMessage = String(error2) || (0, import_i18n45.__)( 20071 "Unknown error when running custom validation asynchronously." 20072 ); 20073 } 20074 setFormValidity((prev) => { 20075 const newFormValidity = setValidityAtPath( 20076 prev, 20077 { 20078 custom: { 20079 type: "invalid", 20080 message: errorMessage 20081 } 20082 }, 20083 [...path, formField.id] 20084 ); 20085 return newFormValidity; 20086 }); 20087 }); 20088 } 20089 function validateFormField(item, formField, promiseHandler) { 20090 if (formField.field?.isValid.required && !formField.field.isValid.required.validate(item, formField.field)) { 20091 return { 20092 required: { type: "invalid" } 20093 }; 20094 } 20095 if (formField.field?.isValid.pattern && !formField.field.isValid.pattern.validate(item, formField.field)) { 20096 return { 20097 pattern: { 20098 type: "invalid", 20099 message: (0, import_i18n45.__)("Value does not match the required pattern.") 20100 } 20101 }; 20102 } 20103 if (formField.field?.isValid.min && !formField.field.isValid.min.validate(item, formField.field)) { 20104 return { 20105 min: { 20106 type: "invalid", 20107 message: (0, import_i18n45.__)("Value is below the minimum.") 20108 } 20109 }; 20110 } 20111 if (formField.field?.isValid.max && !formField.field.isValid.max.validate(item, formField.field)) { 20112 return { 20113 max: { 20114 type: "invalid", 20115 message: (0, import_i18n45.__)("Value is above the maximum.") 20116 } 20117 }; 20118 } 20119 if (formField.field?.isValid.minLength && !formField.field.isValid.minLength.validate(item, formField.field)) { 20120 return { 20121 minLength: { 20122 type: "invalid", 20123 message: (0, import_i18n45.__)("Value is too short.") 20124 } 20125 }; 20126 } 20127 if (formField.field?.isValid.maxLength && !formField.field.isValid.maxLength.validate(item, formField.field)) { 20128 return { 20129 maxLength: { 20130 type: "invalid", 20131 message: (0, import_i18n45.__)("Value is too long.") 20132 } 20133 }; 20134 } 20135 if (formField.field?.isValid.elements && formField.field.hasElements && !formField.field.getElements && Array.isArray(formField.field.elements) && !formField.field.isValid.elements.validate(item, formField.field)) { 20136 return { 20137 elements: { 20138 type: "invalid", 20139 message: (0, import_i18n45.__)("Value must be one of the elements.") 20140 } 20141 }; 20142 } 20143 let customError; 20144 if (!!formField.field && formField.field.isValid.custom) { 20145 try { 20146 const value = formField.field.getValue({ item }); 20147 customError = formField.field.isValid.custom( 20148 (0, import_deepmerge.default)( 20149 item, 20150 formField.field.setValue({ 20151 item, 20152 value 20153 }) 20154 ), 20155 formField.field 20156 ); 20157 } catch (error2) { 20158 let errorMessage; 20159 if (error2 instanceof Error) { 20160 errorMessage = error2.message; 20161 } else { 20162 errorMessage = String(error2) || (0, import_i18n45.__)("Unknown error when running custom validation."); 20163 } 20164 return { 20165 custom: { 20166 type: "invalid", 20167 message: errorMessage 20168 } 20169 }; 20170 } 20171 } 20172 if (typeof customError === "string") { 20173 return { 20174 custom: { 20175 type: "invalid", 20176 message: customError 20177 } 20178 }; 20179 } 20180 const fieldValidity = {}; 20181 if (!!formField.field && formField.field.isValid.elements && formField.field.hasElements && typeof formField.field.getElements === "function") { 20182 handleElementsValidationAsync( 20183 formField.field.getElements(), 20184 formField, 20185 promiseHandler 20186 ); 20187 fieldValidity.elements = { 20188 type: "validating", 20189 message: (0, import_i18n45.__)("Validating\u2026") 20190 }; 20191 } 20192 if (customError instanceof Promise) { 20193 handleCustomValidationAsync(customError, formField, promiseHandler); 20194 fieldValidity.custom = { 20195 type: "validating", 20196 message: (0, import_i18n45.__)("Validating\u2026") 20197 }; 20198 } 20199 if (Object.keys(fieldValidity).length > 0) { 20200 return fieldValidity; 20201 } 20202 if (formField.children.length > 0) { 20203 const result = {}; 20204 formField.children.forEach((child) => { 20205 result[child.id] = validateFormField(item, child, { 20206 ...promiseHandler, 20207 path: [...promiseHandler.path, formField.id, "children"] 20208 }); 20209 }); 20210 const filteredResult = {}; 20211 Object.entries(result).forEach(([key, value]) => { 20212 if (value !== void 0) { 20213 filteredResult[key] = value; 20214 } 20215 }); 20216 if (Object.keys(filteredResult).length === 0) { 20217 return void 0; 20218 } 20219 return { 20220 children: filteredResult 20221 }; 20222 } 20223 return void 0; 20224 } 20225 function getFormFieldValue(formField, item) { 20226 const fieldValue = formField?.field?.getValue({ item }); 20227 if (formField.children.length === 0) { 20228 return fieldValue; 20229 } 20230 const childrenValues = formField.children.map( 20231 (child) => getFormFieldValue(child, item) 20232 ); 20233 if (!childrenValues) { 20234 return fieldValue; 20235 } 20236 return { 20237 value: fieldValue, 20238 children: childrenValues 20239 }; 20240 } 20241 function useFormValidity(item, fields, form) { 20242 const [formValidity, setFormValidity] = (0, import_element79.useState)(); 20243 const customCounterRef = (0, import_element79.useRef)({}); 20244 const elementsCounterRef = (0, import_element79.useRef)({}); 20245 const previousValuesRef = (0, import_element79.useRef)({}); 20246 const validate = (0, import_element79.useCallback)(() => { 20247 const promiseHandler = { 20248 customCounterRef, 20249 elementsCounterRef, 20250 setFormValidity, 20251 path: [], 20252 item 20253 }; 20254 const formFieldsToValidate = getFormFieldsToValidate(form, fields); 20255 if (formFieldsToValidate.length === 0) { 20256 setFormValidity(void 0); 20257 return; 20258 } 20259 const newFormValidity = {}; 20260 const untouchedFields = []; 20261 formFieldsToValidate.forEach((formField) => { 20262 const value = getFormFieldValue(formField, item); 20263 if (previousValuesRef.current.hasOwnProperty(formField.id) && (0, import_es62.default)( 20264 previousValuesRef.current[formField.id], 20265 value 20266 )) { 20267 untouchedFields.push(formField.id); 20268 return; 20269 } 20270 previousValuesRef.current[formField.id] = value; 20271 const fieldValidity = validateFormField( 20272 item, 20273 formField, 20274 promiseHandler 20275 ); 20276 if (fieldValidity !== void 0) { 20277 newFormValidity[formField.id] = fieldValidity; 20278 } 20279 }); 20280 setFormValidity((existingFormValidity) => { 20281 let validity = { 20282 ...existingFormValidity, 20283 ...newFormValidity 20284 }; 20285 const fieldsToKeep = [ 20286 ...untouchedFields, 20287 ...Object.keys(newFormValidity) 20288 ]; 20289 Object.keys(validity).forEach((key) => { 20290 if (validity && !fieldsToKeep.includes(key)) { 20291 delete validity[key]; 20292 } 20293 }); 20294 if (Object.keys(validity).length === 0) { 20295 validity = void 0; 20296 } 20297 const areEqual = (0, import_es62.default)(existingFormValidity, validity); 20298 if (areEqual) { 20299 return existingFormValidity; 20300 } 20301 return validity; 20302 }); 20303 }, [item, fields, form]); 20304 (0, import_element79.useEffect)(() => { 20305 validate(); 20306 }, [validate]); 20307 return { 20308 validity: formValidity, 20309 isValid: isFormValid(formValidity) 20310 }; 20311 } 20312 var use_form_validity_default = useFormValidity; 20313 20314 // packages/dataviews/build-module/hooks/use-report-validity.mjs 20315 var import_element80 = __toESM(require_element(), 1); 20316 function useReportValidity(ref, shouldReport) { 20317 (0, import_element80.useEffect)(() => { 20318 if (shouldReport && ref.current) { 20319 const inputs = ref.current.querySelectorAll( 20320 "input, textarea, select" 20321 ); 20322 inputs.forEach((input) => { 20323 input.reportValidity(); 20324 }); 20325 } 20326 }, [shouldReport, ref]); 20327 } 20328 20329 // packages/dataviews/build-module/components/dataform-layouts/panel/utils/use-field-from-form-field.mjs 20330 var import_element81 = __toESM(require_element(), 1); 20331 20332 // packages/dataviews/build-module/components/dataform-layouts/get-summary-fields.mjs 20333 function extractSummaryIds(summary) { 20334 if (Array.isArray(summary)) { 20335 return summary.map( 20336 (item) => typeof item === "string" ? item : item.id 20337 ); 20338 } 20339 return []; 20340 } 20341 var getSummaryFields = (summaryField, fields) => { 20342 if (Array.isArray(summaryField) && summaryField.length > 0) { 20343 const summaryIds = extractSummaryIds(summaryField); 20344 return summaryIds.map( 20345 (summaryId) => fields.find((_field) => _field.id === summaryId) 20346 ).filter((_field) => _field !== void 0); 20347 } 20348 return []; 20349 }; 20350 20351 // packages/dataviews/build-module/components/dataform-layouts/panel/utils/use-field-from-form-field.mjs 20352 var getFieldDefinition = (field, fields) => { 20353 const fieldDefinition = fields.find((_field) => _field.id === field.id); 20354 if (!fieldDefinition) { 20355 return fields.find((_field) => { 20356 if (!!field.children) { 20357 const simpleChildren = field.children.filter( 20358 (child) => !child.children 20359 ); 20360 if (simpleChildren.length === 0) { 20361 return false; 20362 } 20363 return _field.id === simpleChildren[0].id; 20364 } 20365 return _field.id === field.id; 20366 }); 20367 } 20368 return fieldDefinition; 20369 }; 20370 function useFieldFromFormField(field) { 20371 const { fields } = (0, import_element81.useContext)(dataform_context_default); 20372 const layout = field.layout; 20373 const summaryFields = getSummaryFields(layout.summary, fields); 20374 const fieldDefinition = getFieldDefinition(field, fields); 20375 const fieldLabel = !!field.children ? field.label : fieldDefinition?.label; 20376 if (summaryFields.length === 0) { 20377 return { 20378 summaryFields: fieldDefinition ? [fieldDefinition] : [], 20379 fieldDefinition, 20380 fieldLabel 20381 }; 20382 } 20383 return { 20384 summaryFields, 20385 fieldDefinition, 20386 fieldLabel 20387 }; 20388 } 20389 var use_field_from_form_field_default = useFieldFromFormField; 20390 20391 // packages/dataviews/build-module/components/dataform-layouts/panel/modal.mjs 20392 var import_jsx_runtime114 = __toESM(require_jsx_runtime(), 1); 20393 function ModalContent({ 20394 data, 20395 field, 20396 onChange, 20397 fieldLabel, 20398 onClose, 20399 touched 20400 }) { 20401 const { openAs } = field.layout; 20402 const { applyLabel, cancelLabel } = openAs; 20403 const { fields } = (0, import_element82.useContext)(dataform_context_default); 20404 const [changes, setChanges] = (0, import_element82.useState)({}); 20405 const modalData = (0, import_element82.useMemo)(() => { 20406 return (0, import_deepmerge2.default)(data, changes, { 20407 arrayMerge: (target, source) => source 20408 }); 20409 }, [data, changes]); 20410 const form = (0, import_element82.useMemo)( 20411 () => ({ 20412 layout: DEFAULT_LAYOUT, 20413 fields: !!field.children ? field.children : ( 20414 // If not explicit children return the field id itself. 20415 [{ id: field.id, layout: DEFAULT_LAYOUT }] 20416 ) 20417 }), 20418 [field] 20419 ); 20420 const fieldsAsFieldType = fields.map((f2) => ({ 20421 ...f2, 20422 Edit: f2.Edit === null ? void 0 : f2.Edit, 20423 isValid: { 20424 required: f2.isValid.required?.constraint, 20425 elements: f2.isValid.elements?.constraint, 20426 min: f2.isValid.min?.constraint, 20427 max: f2.isValid.max?.constraint, 20428 pattern: f2.isValid.pattern?.constraint, 20429 minLength: f2.isValid.minLength?.constraint, 20430 maxLength: f2.isValid.maxLength?.constraint 20431 } 20432 })); 20433 const { validity } = use_form_validity_default(modalData, fieldsAsFieldType, form); 20434 const onApply = () => { 20435 onChange(changes); 20436 onClose(); 20437 }; 20438 const handleOnChange = (newValue) => { 20439 setChanges( 20440 (prev) => (0, import_deepmerge2.default)(prev, newValue, { 20441 arrayMerge: (target, source) => source 20442 }) 20443 ); 20444 }; 20445 const focusOnMountRef = (0, import_compose14.useFocusOnMount)("firstInputElement"); 20446 const contentRef = (0, import_element82.useRef)(null); 20447 const mergedRef = (0, import_compose14.useMergeRefs)([focusOnMountRef, contentRef]); 20448 useReportValidity(contentRef, touched); 20449 return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)( 20450 import_components49.Modal, 20451 { 20452 className: "dataforms-layouts-panel__modal", 20453 onRequestClose: onClose, 20454 isFullScreen: false, 20455 title: fieldLabel, 20456 size: "medium", 20457 children: [ 20458 /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { ref: mergedRef, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20459 DataFormLayout, 20460 { 20461 data: modalData, 20462 form, 20463 onChange: handleOnChange, 20464 validity, 20465 children: (FieldLayout, childField, childFieldValidity, markWhenOptional) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20466 FieldLayout, 20467 { 20468 data: modalData, 20469 field: childField, 20470 onChange: handleOnChange, 20471 hideLabelFromVision: form.fields.length < 2, 20472 markWhenOptional, 20473 validity: childFieldValidity 20474 }, 20475 childField.id 20476 ) 20477 } 20478 ) }), 20479 /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)( 20480 Stack, 20481 { 20482 direction: "row", 20483 className: "dataforms-layouts-panel__modal-footer", 20484 gap: "md", 20485 children: [ 20486 /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_components49.__experimentalSpacer, { style: { flex: 1 } }), 20487 /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20488 import_components49.Button, 20489 { 20490 variant: "tertiary", 20491 onClick: onClose, 20492 __next40pxDefaultSize: true, 20493 children: cancelLabel 20494 } 20495 ), 20496 /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20497 import_components49.Button, 20498 { 20499 variant: "primary", 20500 onClick: onApply, 20501 __next40pxDefaultSize: true, 20502 children: applyLabel 20503 } 20504 ) 20505 ] 20506 } 20507 ) 20508 ] 20509 } 20510 ); 20511 } 20512 function PanelModal({ 20513 data, 20514 field, 20515 onChange, 20516 validity 20517 }) { 20518 const [touched, setTouched] = (0, import_element82.useState)(false); 20519 const [isOpen, setIsOpen] = (0, import_element82.useState)(false); 20520 const { fieldDefinition, fieldLabel, summaryFields } = use_field_from_form_field_default(field); 20521 if (!fieldDefinition) { 20522 return null; 20523 } 20524 const handleClose = () => { 20525 setIsOpen(false); 20526 setTouched(true); 20527 }; 20528 return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(import_jsx_runtime114.Fragment, { children: [ 20529 /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20530 SummaryButton, 20531 { 20532 data, 20533 field, 20534 fieldLabel, 20535 summaryFields, 20536 validity, 20537 touched, 20538 disabled: fieldDefinition.readOnly === true, 20539 onClick: () => setIsOpen(true), 20540 "aria-expanded": isOpen 20541 } 20542 ), 20543 isOpen && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)( 20544 ModalContent, 20545 { 20546 data, 20547 field, 20548 onChange, 20549 fieldLabel: fieldLabel ?? "", 20550 onClose: handleClose, 20551 touched 20552 } 20553 ) 20554 ] }); 20555 } 20556 var modal_default = PanelModal; 20557 20558 // packages/dataviews/build-module/components/dataform-layouts/panel/dropdown.mjs 20559 var import_components50 = __toESM(require_components(), 1); 20560 var import_i18n46 = __toESM(require_i18n(), 1); 20561 var import_element83 = __toESM(require_element(), 1); 20562 var import_compose15 = __toESM(require_compose(), 1); 20563 var import_jsx_runtime115 = __toESM(require_jsx_runtime(), 1); 20564 function DropdownHeader({ 20565 title, 20566 onClose 20567 }) { 20568 return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20569 Stack, 20570 { 20571 direction: "column", 20572 className: "dataforms-layouts-panel__dropdown-header", 20573 gap: "lg", 20574 children: /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(Stack, { direction: "row", gap: "sm", align: "center", children: [ 20575 title && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_components50.__experimentalHeading, { level: 2, size: 13, children: title }), 20576 /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_components50.__experimentalSpacer, { style: { flex: 1 } }), 20577 onClose && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20578 import_components50.Button, 20579 { 20580 label: (0, import_i18n46.__)("Close"), 20581 icon: close_small_default, 20582 onClick: onClose, 20583 size: "small" 20584 } 20585 ) 20586 ] }) 20587 } 20588 ); 20589 } 20590 function DropdownContentWithValidation({ 20591 touched, 20592 children 20593 }) { 20594 const ref = (0, import_element83.useRef)(null); 20595 useReportValidity(ref, touched); 20596 return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { ref, children }); 20597 } 20598 function PanelDropdown({ 20599 data, 20600 field, 20601 onChange, 20602 validity 20603 }) { 20604 const [touched, setTouched] = (0, import_element83.useState)(false); 20605 const [popoverAnchor, setPopoverAnchor] = (0, import_element83.useState)( 20606 null 20607 ); 20608 const popoverProps = (0, import_element83.useMemo)( 20609 () => ({ 20610 // Anchor the popover to the middle of the entire row so that it doesn't 20611 // move around when the label changes. 20612 anchor: popoverAnchor, 20613 placement: "left-start", 20614 offset: 36, 20615 shift: true 20616 }), 20617 [popoverAnchor] 20618 ); 20619 const [dialogRef, dialogProps] = (0, import_compose15.__experimentalUseDialog)({ 20620 focusOnMount: "firstInputElement" 20621 }); 20622 const form = (0, import_element83.useMemo)( 20623 () => ({ 20624 layout: DEFAULT_LAYOUT, 20625 fields: !!field.children ? field.children : ( 20626 // If not explicit children return the field id itself. 20627 [{ id: field.id, layout: DEFAULT_LAYOUT }] 20628 ) 20629 }), 20630 [field] 20631 ); 20632 const formValidity = (0, import_element83.useMemo)(() => { 20633 if (validity === void 0) { 20634 return void 0; 20635 } 20636 if (!!field.children) { 20637 return validity?.children; 20638 } 20639 return { [field.id]: validity }; 20640 }, [validity, field]); 20641 const { fieldDefinition, fieldLabel, summaryFields } = use_field_from_form_field_default(field); 20642 if (!fieldDefinition) { 20643 return null; 20644 } 20645 return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20646 "div", 20647 { 20648 ref: setPopoverAnchor, 20649 className: "dataforms-layouts-panel__field-dropdown-anchor", 20650 children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20651 import_components50.Dropdown, 20652 { 20653 contentClassName: "dataforms-layouts-panel__field-dropdown", 20654 popoverProps, 20655 focusOnMount: false, 20656 onToggle: (willOpen) => { 20657 if (!willOpen) { 20658 setTouched(true); 20659 } 20660 }, 20661 renderToggle: ({ isOpen, onToggle }) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20662 SummaryButton, 20663 { 20664 data, 20665 field, 20666 fieldLabel, 20667 summaryFields, 20668 validity, 20669 touched, 20670 disabled: fieldDefinition.readOnly === true, 20671 onClick: onToggle, 20672 "aria-expanded": isOpen 20673 } 20674 ), 20675 renderContent: ({ onClose }) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(DropdownContentWithValidation, { touched, children: /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { ref: dialogRef, ...dialogProps, children: [ 20676 /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20677 DropdownHeader, 20678 { 20679 title: fieldLabel, 20680 onClose 20681 } 20682 ), 20683 /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20684 DataFormLayout, 20685 { 20686 data, 20687 form, 20688 onChange, 20689 validity: formValidity, 20690 children: (FieldLayout, childField, childFieldValidity, markWhenOptional) => /* @__PURE__ */ (0, import_jsx_runtime115.jsx)( 20691 FieldLayout, 20692 { 20693 data, 20694 field: childField, 20695 onChange, 20696 hideLabelFromVision: (form?.fields ?? []).length < 2, 20697 markWhenOptional, 20698 validity: childFieldValidity 20699 }, 20700 childField.id 20701 ) 20702 } 20703 ) 20704 ] }) }) 20705 } 20706 ) 20707 } 20708 ); 20709 } 20710 var dropdown_default = PanelDropdown; 20711 20712 // packages/dataviews/build-module/components/dataform-layouts/panel/index.mjs 20713 var import_jsx_runtime116 = __toESM(require_jsx_runtime(), 1); 20714 function FormPanelField({ 20715 data, 20716 field, 20717 onChange, 20718 validity 20719 }) { 20720 const layout = field.layout; 20721 if (layout.openAs.type === "modal") { 20722 return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)( 20723 modal_default, 20724 { 20725 data, 20726 field, 20727 onChange, 20728 validity 20729 } 20730 ); 20731 } 20732 return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)( 20733 dropdown_default, 20734 { 20735 data, 20736 field, 20737 onChange, 20738 validity 20739 } 20740 ); 20741 } 20742 20743 // packages/dataviews/build-module/components/dataform-layouts/card/index.mjs 20744 var import_element84 = __toESM(require_element(), 1); 20745 20746 // packages/dataviews/build-module/components/dataform-layouts/validation-badge.mjs 20747 var import_i18n47 = __toESM(require_i18n(), 1); 20748 var import_jsx_runtime117 = __toESM(require_jsx_runtime(), 1); 20749 function countInvalidFields(validity) { 20750 if (!validity) { 20751 return 0; 20752 } 20753 let count = 0; 20754 const validityRules = Object.keys(validity).filter( 20755 (key) => key !== "children" 20756 ); 20757 for (const key of validityRules) { 20758 const rule = validity[key]; 20759 if (rule?.type === "invalid") { 20760 count++; 20761 } 20762 } 20763 if (validity.children) { 20764 for (const childValidity of Object.values(validity.children)) { 20765 count += countInvalidFields(childValidity); 20766 } 20767 } 20768 return count; 20769 } 20770 function ValidationBadge({ 20771 validity 20772 }) { 20773 const invalidCount = countInvalidFields(validity); 20774 if (invalidCount === 0) { 20775 return null; 20776 } 20777 return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Badge, { intent: "high", children: (0, import_i18n47.sprintf)( 20778 /* translators: %d: Number of fields that need attention */ 20779 (0, import_i18n47._n)( 20780 "%d field needs attention", 20781 "%d fields need attention", 20782 invalidCount 20783 ), 20784 invalidCount 20785 ) }); 20786 } 20787 20788 // packages/dataviews/build-module/components/dataform-layouts/card/index.mjs 20789 var import_jsx_runtime118 = __toESM(require_jsx_runtime(), 1); 20790 function isSummaryFieldVisible(summaryField, summaryConfig, isOpen) { 20791 if (!summaryConfig || Array.isArray(summaryConfig) && summaryConfig.length === 0) { 20792 return false; 20793 } 20794 const summaryConfigArray = Array.isArray(summaryConfig) ? summaryConfig : [summaryConfig]; 20795 const fieldConfig = summaryConfigArray.find((config) => { 20796 if (typeof config === "string") { 20797 return config === summaryField.id; 20798 } 20799 if (typeof config === "object" && "id" in config) { 20800 return config.id === summaryField.id; 20801 } 20802 return false; 20803 }); 20804 if (!fieldConfig) { 20805 return false; 20806 } 20807 if (typeof fieldConfig === "string") { 20808 return true; 20809 } 20810 if (typeof fieldConfig === "object" && "visibility" in fieldConfig) { 20811 return fieldConfig.visibility === "always" || fieldConfig.visibility === "when-collapsed" && !isOpen; 20812 } 20813 return true; 20814 } 20815 function HeaderContent({ 20816 data, 20817 fields, 20818 label, 20819 layout, 20820 isOpen, 20821 touched, 20822 validity 20823 }) { 20824 const summaryFields = getSummaryFields(layout.summary, fields); 20825 const visibleSummaryFields = summaryFields.filter( 20826 (summaryField) => isSummaryFieldVisible(summaryField, layout.summary, isOpen) 20827 ); 20828 const hasBadge = touched && layout.isCollapsible; 20829 const hasSummary = visibleSummaryFields.length > 0 && layout.withHeader; 20830 return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)( 20831 Stack, 20832 { 20833 align: "center", 20834 justify: "space-between", 20835 className: "dataforms-layouts-card__field-header-content", 20836 children: [ 20837 /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(card_exports.Title, { children: label }), 20838 (hasBadge || hasSummary) && /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(collapsible_card_exports.HeaderDescription, { className: "dataforms-layouts-card__field-header-content-description", children: [ 20839 hasBadge && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(ValidationBadge, { validity }), 20840 hasSummary && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "dataforms-layouts-card__field-summary", children: visibleSummaryFields.map((summaryField) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20841 summaryField.render, 20842 { 20843 item: data, 20844 field: summaryField 20845 }, 20846 summaryField.id 20847 )) }) 20848 ] }) 20849 ] 20850 } 20851 ); 20852 } 20853 function BodyContent({ 20854 data, 20855 field, 20856 form, 20857 onChange, 20858 hideLabelFromVision, 20859 markWhenOptional, 20860 validity, 20861 withHeader 20862 }) { 20863 if (field.children) { 20864 return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(import_jsx_runtime118.Fragment, { children: [ 20865 field.description && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "dataforms-layouts-card__field-description", children: field.description }), 20866 /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20867 DataFormLayout, 20868 { 20869 data, 20870 form, 20871 onChange, 20872 validity: validity?.children 20873 } 20874 ) 20875 ] }); 20876 } 20877 const SingleFieldLayout = getFormFieldLayout("regular")?.component; 20878 if (!SingleFieldLayout) { 20879 return null; 20880 } 20881 return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20882 SingleFieldLayout, 20883 { 20884 data, 20885 field, 20886 onChange, 20887 hideLabelFromVision: hideLabelFromVision || withHeader, 20888 markWhenOptional, 20889 validity 20890 } 20891 ); 20892 } 20893 function FormCardField({ 20894 data, 20895 field, 20896 onChange, 20897 hideLabelFromVision, 20898 markWhenOptional, 20899 validity 20900 }) { 20901 const { fields } = (0, import_element84.useContext)(dataform_context_default); 20902 const layout = field.layout; 20903 const contentRef = (0, import_element84.useRef)(null); 20904 const form = (0, import_element84.useMemo)( 20905 () => ({ 20906 layout: DEFAULT_LAYOUT, 20907 fields: field.children ?? [] 20908 }), 20909 [field] 20910 ); 20911 const { isOpened, isCollapsible } = layout; 20912 const [isOpen, setIsOpen] = (0, import_element84.useState)(isOpened); 20913 const [touched, setTouched] = (0, import_element84.useState)(false); 20914 (0, import_element84.useEffect)(() => { 20915 setIsOpen(isOpened); 20916 }, [isOpened]); 20917 const handleOpenChange = (0, import_element84.useCallback)((open) => { 20918 if (!open) { 20919 setTouched(true); 20920 } 20921 setIsOpen(open); 20922 }, []); 20923 const handleBlur = (0, import_element84.useCallback)(() => { 20924 setTouched(true); 20925 }, []); 20926 useReportValidity( 20927 contentRef, 20928 (isCollapsible ? isOpen : true) && touched 20929 ); 20930 let label = field.label; 20931 let withHeader; 20932 if (field.children) { 20933 withHeader = !!label && layout.withHeader; 20934 } else { 20935 const fieldDefinition = fields.find( 20936 (fieldDef) => fieldDef.id === field.id 20937 ); 20938 if (!fieldDefinition || !fieldDefinition.Edit) { 20939 return null; 20940 } 20941 label = fieldDefinition.label; 20942 withHeader = !!label && layout.withHeader; 20943 } 20944 const bodyContent = /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20945 BodyContent, 20946 { 20947 data, 20948 field, 20949 form, 20950 onChange, 20951 hideLabelFromVision, 20952 markWhenOptional, 20953 validity, 20954 withHeader 20955 } 20956 ); 20957 const headerContent = /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20958 HeaderContent, 20959 { 20960 data, 20961 fields, 20962 label, 20963 layout, 20964 isOpen: isCollapsible ? !!isOpen : true, 20965 touched, 20966 validity 20967 } 20968 ); 20969 if (withHeader && isCollapsible) { 20970 return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)( 20971 collapsible_card_exports.Root, 20972 { 20973 className: "dataforms-layouts-card__field", 20974 open: isOpen, 20975 onOpenChange: handleOpenChange, 20976 children: [ 20977 /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(collapsible_card_exports.Header, { children: headerContent }), 20978 /* @__PURE__ */ (0, import_jsx_runtime118.jsx)( 20979 collapsible_card_exports.Content, 20980 { 20981 ref: contentRef, 20982 onBlur: handleBlur, 20983 children: bodyContent 20984 } 20985 ) 20986 ] 20987 } 20988 ); 20989 } 20990 return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(card_exports.Root, { className: "dataforms-layouts-card__field", children: [ 20991 withHeader && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(card_exports.Header, { children: headerContent }), 20992 /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(card_exports.Content, { ref: contentRef, onBlur: handleBlur, children: bodyContent }) 20993 ] }); 20994 } 20995 20996 // packages/dataviews/build-module/components/dataform-layouts/row/index.mjs 20997 var import_components51 = __toESM(require_components(), 1); 20998 var import_jsx_runtime119 = __toESM(require_jsx_runtime(), 1); 20999 function Header5({ title }) { 21000 return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( 21001 Stack, 21002 { 21003 direction: "column", 21004 className: "dataforms-layouts-row__header", 21005 gap: "lg", 21006 children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Stack, { direction: "row", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_components51.__experimentalHeading, { level: 2, size: 13, children: title }) }) 21007 } 21008 ); 21009 } 21010 var EMPTY_WRAPPER = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_jsx_runtime119.Fragment, { children }); 21011 function FormRowField({ 21012 data, 21013 field, 21014 onChange, 21015 hideLabelFromVision, 21016 markWhenOptional, 21017 validity 21018 }) { 21019 const layout = field.layout; 21020 if (!!field.children) { 21021 const form = { 21022 layout: DEFAULT_LAYOUT, 21023 fields: field.children 21024 }; 21025 return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)("div", { className: "dataforms-layouts-row__field", children: [ 21026 !hideLabelFromVision && field.label && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Header5, { title: field.label }), 21027 /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Stack, { direction: "row", align: layout.alignment, gap: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( 21028 DataFormLayout, 21029 { 21030 data, 21031 form, 21032 onChange, 21033 validity: validity?.children, 21034 as: EMPTY_WRAPPER, 21035 children: (FieldLayout, childField, childFieldValidity) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( 21036 "div", 21037 { 21038 className: "dataforms-layouts-row__field-control", 21039 style: layout.styles[childField.id], 21040 children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( 21041 FieldLayout, 21042 { 21043 data, 21044 field: childField, 21045 onChange, 21046 hideLabelFromVision, 21047 markWhenOptional, 21048 validity: childFieldValidity 21049 } 21050 ) 21051 }, 21052 childField.id 21053 ) 21054 } 21055 ) }) 21056 ] }); 21057 } 21058 const RegularLayout = getFormFieldLayout("regular")?.component; 21059 if (!RegularLayout) { 21060 return null; 21061 } 21062 return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_jsx_runtime119.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { className: "dataforms-layouts-row__field-control", children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( 21063 RegularLayout, 21064 { 21065 data, 21066 field, 21067 onChange, 21068 markWhenOptional, 21069 validity 21070 } 21071 ) }) }); 21072 } 21073 21074 // packages/dataviews/build-module/components/dataform-layouts/details/index.mjs 21075 var import_element85 = __toESM(require_element(), 1); 21076 var import_i18n48 = __toESM(require_i18n(), 1); 21077 var import_jsx_runtime120 = __toESM(require_jsx_runtime(), 1); 21078 function FormDetailsField({ 21079 data, 21080 field, 21081 onChange, 21082 validity 21083 }) { 21084 const { fields } = (0, import_element85.useContext)(dataform_context_default); 21085 const detailsRef = (0, import_element85.useRef)(null); 21086 const contentRef = (0, import_element85.useRef)(null); 21087 const [touched, setTouched] = (0, import_element85.useState)(false); 21088 const [isOpen, setIsOpen] = (0, import_element85.useState)(false); 21089 const form = (0, import_element85.useMemo)( 21090 () => ({ 21091 layout: DEFAULT_LAYOUT, 21092 fields: field.children ?? [] 21093 }), 21094 [field] 21095 ); 21096 (0, import_element85.useEffect)(() => { 21097 const details = detailsRef.current; 21098 if (!details) { 21099 return; 21100 } 21101 const handleToggle = () => { 21102 const nowOpen = details.open; 21103 if (!nowOpen) { 21104 setTouched(true); 21105 } 21106 setIsOpen(nowOpen); 21107 }; 21108 details.addEventListener("toggle", handleToggle); 21109 return () => { 21110 details.removeEventListener("toggle", handleToggle); 21111 }; 21112 }, []); 21113 useReportValidity(contentRef, isOpen && touched); 21114 const handleBlur = (0, import_element85.useCallback)(() => { 21115 setTouched(true); 21116 }, []); 21117 if (!field.children) { 21118 return null; 21119 } 21120 const summaryFieldId = field.layout.summary ?? ""; 21121 const summaryField = summaryFieldId ? fields.find((fieldDef) => fieldDef.id === summaryFieldId) : void 0; 21122 let summaryContent; 21123 if (summaryField && summaryField.render) { 21124 summaryContent = /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(summaryField.render, { item: data, field: summaryField }); 21125 } else { 21126 summaryContent = field.label || (0, import_i18n48.__)("More details"); 21127 } 21128 return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)( 21129 "details", 21130 { 21131 ref: detailsRef, 21132 className: "dataforms-layouts-details__details", 21133 children: [ 21134 /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("summary", { className: "dataforms-layouts-details__summary", children: /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)( 21135 Stack, 21136 { 21137 direction: "row", 21138 align: "center", 21139 gap: "md", 21140 className: "dataforms-layouts-details__summary-content", 21141 children: [ 21142 summaryContent, 21143 touched && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(ValidationBadge, { validity }) 21144 ] 21145 } 21146 ) }), 21147 /* @__PURE__ */ (0, import_jsx_runtime120.jsx)( 21148 "div", 21149 { 21150 ref: contentRef, 21151 className: "dataforms-layouts-details__content", 21152 onBlur: handleBlur, 21153 children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)( 21154 DataFormLayout, 21155 { 21156 data, 21157 form, 21158 onChange, 21159 validity: validity?.children 21160 } 21161 ) 21162 } 21163 ) 21164 ] 21165 } 21166 ); 21167 } 21168 21169 // packages/dataviews/build-module/components/dataform-layouts/index.mjs 21170 var import_jsx_runtime121 = __toESM(require_jsx_runtime(), 1); 21171 var FORM_FIELD_LAYOUTS = [ 21172 { 21173 type: "regular", 21174 component: FormRegularField, 21175 wrapper: ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( 21176 Stack, 21177 { 21178 direction: "column", 21179 className: "dataforms-layouts__wrapper", 21180 gap: "lg", 21181 children 21182 } 21183 ) 21184 }, 21185 { 21186 type: "panel", 21187 component: FormPanelField, 21188 wrapper: ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( 21189 Stack, 21190 { 21191 direction: "column", 21192 className: "dataforms-layouts__wrapper", 21193 gap: "md", 21194 children 21195 } 21196 ) 21197 }, 21198 { 21199 type: "card", 21200 component: FormCardField, 21201 wrapper: ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( 21202 Stack, 21203 { 21204 direction: "column", 21205 className: "dataforms-layouts__wrapper", 21206 gap: "xl", 21207 children 21208 } 21209 ) 21210 }, 21211 { 21212 type: "row", 21213 component: FormRowField, 21214 wrapper: ({ 21215 children, 21216 layout 21217 }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( 21218 Stack, 21219 { 21220 direction: "column", 21221 className: "dataforms-layouts__wrapper", 21222 gap: "lg", 21223 children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "dataforms-layouts-row__field", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( 21224 Stack, 21225 { 21226 direction: "row", 21227 gap: "lg", 21228 align: layout.alignment, 21229 children 21230 } 21231 ) }) 21232 } 21233 ) 21234 }, 21235 { 21236 type: "details", 21237 component: FormDetailsField 21238 } 21239 ]; 21240 function getFormFieldLayout(type) { 21241 return FORM_FIELD_LAYOUTS.find((layout) => layout.type === type); 21242 } 21243 21244 // packages/dataviews/build-module/components/dataform-layouts/data-form-layout.mjs 21245 var import_jsx_runtime122 = __toESM(require_jsx_runtime(), 1); 21246 var DEFAULT_WRAPPER = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(Stack, { direction: "column", className: "dataforms-layouts__wrapper", gap: "lg", children }); 21247 function DataFormLayout({ 21248 data, 21249 form, 21250 onChange, 21251 validity, 21252 children, 21253 as 21254 }) { 21255 const { fields: fieldDefinitions } = (0, import_element86.useContext)(dataform_context_default); 21256 const markWhenOptional = (0, import_element86.useMemo)(() => { 21257 const requiredCount = fieldDefinitions.filter( 21258 (f2) => !!f2.isValid?.required 21259 ).length; 21260 const optionalCount = fieldDefinitions.length - requiredCount; 21261 return requiredCount > optionalCount; 21262 }, [fieldDefinitions]); 21263 function getFieldDefinition2(field) { 21264 return fieldDefinitions.find( 21265 (fieldDefinition) => fieldDefinition.id === field.id 21266 ); 21267 } 21268 const Wrapper = as ?? getFormFieldLayout(form.layout.type)?.wrapper ?? DEFAULT_WRAPPER; 21269 return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(Wrapper, { layout: form.layout, children: form.fields.map((formField) => { 21270 const FieldLayout = getFormFieldLayout(formField.layout.type)?.component; 21271 if (!FieldLayout) { 21272 return null; 21273 } 21274 const fieldDefinition = !formField.children ? getFieldDefinition2(formField) : void 0; 21275 if (fieldDefinition && fieldDefinition.isVisible && !fieldDefinition.isVisible(data)) { 21276 return null; 21277 } 21278 if (children) { 21279 return children( 21280 FieldLayout, 21281 formField, 21282 validity?.[formField.id], 21283 markWhenOptional 21284 ); 21285 } 21286 return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)( 21287 FieldLayout, 21288 { 21289 data, 21290 field: formField, 21291 onChange, 21292 markWhenOptional, 21293 validity: validity?.[formField.id] 21294 }, 21295 formField.id 21296 ); 21297 }) }); 21298 } 21299 21300 // packages/dataviews/build-module/dataform/index.mjs 21301 var import_jsx_runtime123 = __toESM(require_jsx_runtime(), 1); 21302 function DataForm({ 21303 data, 21304 form, 21305 fields, 21306 onChange, 21307 validity 21308 }) { 21309 const normalizedForm = (0, import_element87.useMemo)(() => normalize_form_default(form), [form]); 21310 const normalizedFields = (0, import_element87.useMemo)( 21311 () => normalizeFields(fields), 21312 [fields] 21313 ); 21314 if (!form.fields) { 21315 return null; 21316 } 21317 return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(DataFormProvider, { fields: normalizedFields, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)( 21318 DataFormLayout, 21319 { 21320 data, 21321 form: normalizedForm, 21322 onChange, 21323 validity 21324 } 21325 ) }); 21326 } 21327 21328 // routes/taxonomies/stage.tsx 21329 var import_core_data2 = __toESM(require_core_data()); 21330 var import_element90 = __toESM(require_element()); 21331 var import_i18n51 = __toESM(require_i18n()); 21332 import { useNavigate as useNavigate2 } from "@wordpress/route"; 21333 import { 21334 hierarchicalField as hierarchicalField2, 21335 publicField as publicField2, 21336 statusField as statusField2, 21337 titleField, 21338 toFormData, 21339 useObjectTypeField as useObjectTypeField2, 21340 useSlugField as useSlugField2, 21341 activateAction, 21342 deactivateAction, 21343 deleteTaxonomyAction 21344 } from "@wordpress/user-taxonomies"; 21345 21346 // routes/taxonomies/actions/edit.tsx 21347 var import_element88 = __toESM(require_element()); 21348 var import_i18n49 = __toESM(require_i18n()); 21349 import { useNavigate } from "@wordpress/route"; 21350 function useEditTaxonomyAction() { 21351 const navigate = useNavigate(); 21352 return (0, import_element88.useMemo)( 21353 () => ({ 21354 id: "edit-taxonomy", 21355 label: (0, import_i18n49.__)("Edit"), 21356 callback: (items) => { 21357 const item = items[0]; 21358 if (item?.id === void 0) { 21359 return; 21360 } 21361 navigate({ 21362 to: `/edit/$item.id}` 21363 }); 21364 } 21365 }), 21366 [navigate] 21367 ); 21368 } 21369 21370 // routes/taxonomies/actions/quick-edit.tsx 21371 var import_components52 = __toESM(require_components()); 21372 var import_core_data = __toESM(require_core_data()); 21373 var import_data6 = __toESM(require_data()); 21374 var import_element89 = __toESM(require_element()); 21375 var import_i18n50 = __toESM(require_i18n()); 21376 var import_notices = __toESM(require_notices()); 21377 import { 21378 defaultForm, 21379 hierarchicalField, 21380 pluralLabelField, 21381 publicField, 21382 serializeForSave, 21383 singularLabelField, 21384 statusField, 21385 useObjectTypeField, 21386 useSlugField 21387 } from "@wordpress/user-taxonomies"; 21388 21389 // routes/taxonomies/style.scss 21390 if (typeof document !== "undefined" && true && !document.head.querySelector("style[data-wp-hash='60a8b6c94c']")) { 21391 const style = document.createElement("style"); 21392 style.setAttribute("data-wp-hash", "60a8b6c94c"); 21393 style.appendChild(document.createTextNode(".boot-layout__stage:has(.taxonomies-page){height:calc(100vh - 46px)}@media (min-width:782px){.boot-layout__stage:has(.taxonomies-page){height:calc(100vh - 32px)}}.dataviews-action-modal__quick-edit-taxonomy{align-items:stretch;justify-content:flex-end}.dataviews-action-modal__quick-edit-taxonomy .components-modal__frame{animation-name:none;border-radius:8px;height:calc(100% - 32px);margin:16px 16px 16px 0;max-height:calc(100% - 32px);max-width:400px;position:relative}@media (prefers-reduced-motion:no-preference){.dataviews-action-modal__quick-edit-taxonomy .components-modal__frame{animation-duration:.2s;animation-name:quick-edit-taxonomy-slide-in-right;animation-timing-function:ease-out}}.dataviews-action-modal__quick-edit-taxonomy.is-animating-out .components-modal__frame{animation-name:none}@media (prefers-reduced-motion:no-preference){.dataviews-action-modal__quick-edit-taxonomy.is-animating-out .components-modal__frame{animation-duration:.2s;animation-name:quick-edit-taxonomy-slide-out-right;animation-timing-function:ease-out}}.dataviews-action-modal__quick-edit-taxonomy .components-modal__content{overflow-y:auto;padding:0}.dataviews-action-modal__quick-edit-taxonomy .dataviews-action-modal__quick-edit-taxonomy-header{background:#fff;padding:16px 24px;position:sticky;top:0;z-index:1}.dataviews-action-modal__quick-edit-taxonomy .dataviews-action-modal__quick-edit-taxonomy-content{padding:0 24px}.dataviews-action-modal__quick-edit-taxonomy .dataviews-action-modal__quick-edit-taxonomy-footer{background:#fff;bottom:0;padding:16px 24px;position:sticky;z-index:1}.dataviews-action-modal__quick-edit-taxonomy .dataviews-action-modal__quick-edit-taxonomy-footer .components-button{flex:1;justify-content:center}@keyframes quick-edit-taxonomy-slide-in-right{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes quick-edit-taxonomy-slide-out-right{0%{transform:translateX(0)}to{transform:translateX(100%)}}")); 21394 document.head.appendChild(style); 21395 } 21396 21397 // routes/taxonomies/actions/quick-edit.tsx 21398 function QuickEditTaxonomyModal({ 21399 items, 21400 closeModal 21401 }) { 21402 const item = items[0]; 21403 const [data, setData] = (0, import_element89.useState)(item); 21404 const [isSaving, setIsSaving] = (0, import_element89.useState)(false); 21405 const slugField = useSlugField(item.slug, data.slug); 21406 const objectTypeField = useObjectTypeField(); 21407 const fields = (0, import_element89.useMemo)( 21408 () => [ 21409 pluralLabelField, 21410 singularLabelField, 21411 slugField, 21412 objectTypeField, 21413 publicField, 21414 hierarchicalField, 21415 statusField 21416 ], 21417 [slugField, objectTypeField] 21418 ); 21419 const { validity, isValid: isValid2 } = use_form_validity_default(data, fields, defaultForm); 21420 const { saveEntityRecord } = (0, import_data6.useDispatch)(import_core_data.store); 21421 const { createSuccessNotice, createErrorNotice } = (0, import_data6.useDispatch)(import_notices.store); 21422 async function onSave() { 21423 if (isSaving || !isValid2) { 21424 return; 21425 } 21426 setIsSaving(true); 21427 try { 21428 await saveEntityRecord( 21429 "postType", 21430 "wp_user_taxonomy", 21431 serializeForSave({ ...data, id: item.id }), 21432 { throwOnError: true } 21433 ); 21434 createSuccessNotice( 21435 (0, import_i18n50.sprintf)( 21436 /* translators: %s: taxonomy plural label. */ 21437 (0, import_i18n50.__)('"%s" taxonomy updated.'), 21438 data.title.raw 21439 ), 21440 { type: "snackbar" } 21441 ); 21442 closeModal?.(); 21443 } catch (error2) { 21444 createErrorNotice( 21445 error2?.message && error2?.code !== "unknown_error" ? error2.message : (0, import_i18n50.__)("Failed to update taxonomy."), 21446 { type: "snackbar" } 21447 ); 21448 } finally { 21449 setIsSaving(false); 21450 } 21451 } 21452 return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement( 21453 Stack, 21454 { 21455 className: "dataviews-action-modal__quick-edit-taxonomy-header", 21456 direction: "row", 21457 justify: "space-between", 21458 align: "center" 21459 }, 21460 /* @__PURE__ */ React.createElement(Text, { variant: "heading-sm", render: /* @__PURE__ */ React.createElement("h2", null) }, (0, import_i18n50.__)("Quick edit taxonomy")), 21461 /* @__PURE__ */ React.createElement( 21462 import_components52.Button, 21463 { 21464 size: "small", 21465 icon: close_small_default, 21466 label: (0, import_i18n50.__)("Close"), 21467 onClick: closeModal 21468 } 21469 ) 21470 ), /* @__PURE__ */ React.createElement("div", { className: "dataviews-action-modal__quick-edit-taxonomy-content" }, /* @__PURE__ */ React.createElement( 21471 DataForm, 21472 { 21473 data, 21474 fields, 21475 form: defaultForm, 21476 validity, 21477 onChange: (edits) => setData( 21478 (prev) => ({ ...prev, ...edits }) 21479 ) 21480 } 21481 )), /* @__PURE__ */ React.createElement( 21482 Stack, 21483 { 21484 className: "dataviews-action-modal__quick-edit-taxonomy-footer", 21485 direction: "row", 21486 gap: "sm" 21487 }, 21488 /* @__PURE__ */ React.createElement( 21489 import_components52.Button, 21490 { 21491 __next40pxDefaultSize: true, 21492 variant: "secondary", 21493 onClick: closeModal 21494 }, 21495 (0, import_i18n50.__)("Cancel") 21496 ), 21497 /* @__PURE__ */ React.createElement( 21498 import_components52.Button, 21499 { 21500 __next40pxDefaultSize: true, 21501 variant: "primary", 21502 isBusy: isSaving, 21503 disabled: isSaving, 21504 accessibleWhenDisabled: true, 21505 onClick: onSave 21506 }, 21507 (0, import_i18n50.__)("Done") 21508 ) 21509 )); 21510 } 21511 var quickEditTaxonomyAction = { 21512 id: "quick-edit-taxonomy", 21513 label: (0, import_i18n50.__)("Quick edit"), 21514 icon: pencil_default, 21515 isPrimary: true, 21516 hideModalHeader: true, 21517 RenderModal: QuickEditTaxonomyModal 21518 }; 21519 var quick_edit_default = quickEditTaxonomyAction; 21520 21521 // routes/taxonomies/stage.tsx 21522 var defaultLayouts = { 21523 table: {} 21524 }; 21525 var DEFAULT_VIEW = { 21526 type: "table", 21527 perPage: 20, 21528 page: 1, 21529 fields: ["object_type", "status", "public"], 21530 titleField: "title", 21531 layout: {} 21532 }; 21533 function TaxonomiesPage() { 21534 const navigate = useNavigate2(); 21535 const [view, setView] = (0, import_element90.useState)(DEFAULT_VIEW); 21536 const editAction = useEditTaxonomyAction(); 21537 const taxonomyActions = (0, import_element90.useMemo)( 21538 () => [ 21539 editAction, 21540 quick_edit_default, 21541 activateAction, 21542 deactivateAction, 21543 deleteTaxonomyAction 21544 ], 21545 [editAction] 21546 ); 21547 const slugField = useSlugField2(); 21548 const objectTypeField = useObjectTypeField2(); 21549 const fields = (0, import_element90.useMemo)( 21550 () => [ 21551 titleField, 21552 objectTypeField, 21553 statusField2, 21554 publicField2, 21555 slugField, 21556 hierarchicalField2 21557 ], 21558 [slugField, objectTypeField] 21559 ); 21560 const queryArgs = (0, import_element90.useMemo)(() => { 21561 const statusFilter = view.filters?.find( 21562 (filter) => filter.field === "status" 21563 ); 21564 const objectTypeFilter = view.filters?.find( 21565 (filter) => filter.field === "object_type" 21566 ); 21567 return { 21568 per_page: view.perPage, 21569 page: view.page, 21570 context: "edit", 21571 order: view.sort?.direction, 21572 orderby: view.sort?.field, 21573 search: view.search, 21574 status: statusFilter?.value ?? ["publish", "draft"], 21575 object_type: objectTypeFilter?.value 21576 }; 21577 }, [view]); 21578 const { records, isResolving, hasResolved, totalItems, totalPages } = (0, import_core_data2.useEntityRecords)( 21579 "postType", 21580 "wp_user_taxonomy", 21581 queryArgs 21582 ); 21583 const data = (0, import_element90.useMemo)( 21584 () => (records ?? []).map(toFormData), 21585 [records] 21586 ); 21587 const paginationInfo = (0, import_element90.useMemo)( 21588 () => ({ 21589 totalItems: totalItems ?? 0, 21590 totalPages: totalPages ?? 0 21591 }), 21592 [totalItems, totalPages] 21593 ); 21594 return /* @__PURE__ */ React.createElement( 21595 page_default, 21596 { 21597 title: (0, import_i18n51.__)("Taxonomies"), 21598 className: "taxonomies-page", 21599 hasPadding: false, 21600 actions: /* @__PURE__ */ React.createElement( 21601 import_components53.Button, 21602 { 21603 variant: "primary", 21604 size: "compact", 21605 __next40pxDefaultSize: true, 21606 onClick: () => navigate({ to: "/edit/new" }) 21607 }, 21608 (0, import_i18n51.__)("Add taxonomy") 21609 ) 21610 }, 21611 /* @__PURE__ */ React.createElement( 21612 dataviews_default, 21613 { 21614 data, 21615 fields, 21616 actions: taxonomyActions, 21617 view, 21618 onChangeView: setView, 21619 isLoading: isResolving || !hasResolved, 21620 paginationInfo, 21621 defaultLayouts, 21622 getItemId: (item) => String(item.id), 21623 isItemClickable: () => true, 21624 onClickItem: (item) => navigate({ to: `/edit/$item.id}` }) 21625 } 21626 ) 21627 ); 21628 } 21629 var stage = TaxonomiesPage; 21630 export { 21631 stage 21632 }; 21633 /*! Bundled license information: 21634 21635 use-sync-external-store/cjs/use-sync-external-store-shim.development.js: 21636 (** 21637 * @license React 21638 * use-sync-external-store-shim.development.js 21639 * 21640 * Copyright (c) Meta Platforms, Inc. and affiliates. 21641 * 21642 * This source code is licensed under the MIT license found in the 21643 * LICENSE file in the root directory of this source tree. 21644 *) 21645 */
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
| Generated : Tue Jun 30 08:20:12 2026 | Cross-referenced by PHPXref |