| 1 |
"use strict"; |
| 2 |
var wp; |
| 3 |
(wp ||= {}).mediaUtils = (() => { |
| 4 |
var __create = Object.create; |
| 5 |
var __defProp = Object.defineProperty; |
| 6 |
var __getOwnPropDesc = Object.getOwnPropertyDescriptor; |
| 7 |
var __getOwnPropNames = Object.getOwnPropertyNames; |
| 8 |
var __getProtoOf = Object.getPrototypeOf; |
| 9 |
var __hasOwnProp = Object.prototype.hasOwnProperty; |
| 10 |
var __commonJS = (cb, mod) => function __require() { |
| 11 |
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; |
| 12 |
}; |
| 13 |
var __export = (target, all) => { |
| 14 |
for (var name in all) |
| 15 |
__defProp(target, name, { get: all[name], enumerable: true }); |
| 16 |
}; |
| 17 |
var __copyProps = (to, from, except, desc) => { |
| 18 |
if (from && typeof from === "object" || typeof from === "function") { |
| 19 |
for (let key of __getOwnPropNames(from)) |
| 20 |
if (!__hasOwnProp.call(to, key) && key !== except) |
| 21 |
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); |
| 22 |
} |
| 23 |
return to; |
| 24 |
}; |
| 25 |
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( |
| 26 |
// If the importer is in node compatibility mode or this is not an ESM |
| 27 |
// file that has been converted to a CommonJS file using a Babel- |
| 28 |
// compatible transform (i.e. "__esModule" has not been set), then set |
| 29 |
// "default" to the CommonJS "module.exports" for node compatibility. |
| 30 |
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, |
| 31 |
mod |
| 32 |
)); |
| 33 |
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); |
| 34 |
|
| 35 |
// package-external:@wordpress/element |
| 36 |
var require_element = __commonJS({ |
| 37 |
"package-external:@wordpress/element"(exports, module) { |
| 38 |
module.exports = window.wp.element; |
| 39 |
} |
| 40 |
}); |
| 41 |
|
| 42 |
// package-external:@wordpress/i18n |
| 43 |
var require_i18n = __commonJS({ |
| 44 |
"package-external:@wordpress/i18n"(exports, module) { |
| 45 |
module.exports = window.wp.i18n; |
| 46 |
} |
| 47 |
}); |
| 48 |
|
| 49 |
// package-external:@wordpress/blob |
| 50 |
var require_blob = __commonJS({ |
| 51 |
"package-external:@wordpress/blob"(exports, module) { |
| 52 |
module.exports = window.wp.blob; |
| 53 |
} |
| 54 |
}); |
| 55 |
|
| 56 |
// package-external:@wordpress/api-fetch |
| 57 |
var require_api_fetch = __commonJS({ |
| 58 |
"package-external:@wordpress/api-fetch"(exports, module) { |
| 59 |
module.exports = window.wp.apiFetch; |
| 60 |
} |
| 61 |
}); |
| 62 |
|
| 63 |
// package-external:@wordpress/core-data |
| 64 |
var require_core_data = __commonJS({ |
| 65 |
"package-external:@wordpress/core-data"(exports, module) { |
| 66 |
module.exports = window.wp.coreData; |
| 67 |
} |
| 68 |
}); |
| 69 |
|
| 70 |
// package-external:@wordpress/data |
| 71 |
var require_data = __commonJS({ |
| 72 |
"package-external:@wordpress/data"(exports, module) { |
| 73 |
module.exports = window.wp.data; |
| 74 |
} |
| 75 |
}); |
| 76 |
|
| 77 |
// package-external:@wordpress/components |
| 78 |
var require_components = __commonJS({ |
| 79 |
"package-external:@wordpress/components"(exports, module) { |
| 80 |
module.exports = window.wp.components; |
| 81 |
} |
| 82 |
}); |
| 83 |
|
| 84 |
// package-external:@wordpress/primitives |
| 85 |
var require_primitives = __commonJS({ |
| 86 |
"package-external:@wordpress/primitives"(exports, module) { |
| 87 |
module.exports = window.wp.primitives; |
| 88 |
} |
| 89 |
}); |
| 90 |
|
| 91 |
// vendor-external:react/jsx-runtime |
| 92 |
var require_jsx_runtime = __commonJS({ |
| 93 |
"vendor-external:react/jsx-runtime"(exports, module) { |
| 94 |
module.exports = window.ReactJSXRuntime; |
| 95 |
} |
| 96 |
}); |
| 97 |
|
| 98 |
// package-external:@wordpress/compose |
| 99 |
var require_compose = __commonJS({ |
| 100 |
"package-external:@wordpress/compose"(exports, module) { |
| 101 |
module.exports = window.wp.compose; |
| 102 |
} |
| 103 |
}); |
| 104 |
|
| 105 |
// vendor-external:react |
| 106 |
var require_react = __commonJS({ |
| 107 |
"vendor-external:react"(exports, module) { |
| 108 |
module.exports = window.React; |
| 109 |
} |
| 110 |
}); |
| 111 |
|
| 112 |
// vendor-external:react-dom |
| 113 |
var require_react_dom = __commonJS({ |
| 114 |
"vendor-external:react-dom"(exports, module) { |
| 115 |
module.exports = window.ReactDOM; |
| 116 |
} |
| 117 |
}); |
| 118 |
|
| 119 |
// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js |
| 120 |
var require_use_sync_external_store_shim_development = __commonJS({ |
| 121 |
"node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) { |
| 122 |
"use strict"; |
| 123 |
(function() { |
| 124 |
function is(x2, y2) { |
| 125 |
return x2 === y2 && (0 !== x2 || 1 / x2 === 1 / y2) || x2 !== x2 && y2 !== y2; |
| 126 |
} |
| 127 |
function useSyncExternalStore$2(subscribe2, getSnapshot) { |
| 128 |
didWarnOld18Alpha || void 0 === React49.startTransition || (didWarnOld18Alpha = true, console.error( |
| 129 |
"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." |
| 130 |
)); |
| 131 |
var value = getSnapshot(); |
| 132 |
if (!didWarnUncachedGetSnapshot) { |
| 133 |
var cachedValue = getSnapshot(); |
| 134 |
objectIs(value, cachedValue) || (console.error( |
| 135 |
"The result of getSnapshot should be cached to avoid an infinite loop" |
| 136 |
), didWarnUncachedGetSnapshot = true); |
| 137 |
} |
| 138 |
cachedValue = useState42({ |
| 139 |
inst: { value, getSnapshot } |
| 140 |
}); |
| 141 |
var inst = cachedValue[0].inst, forceUpdate = cachedValue[1]; |
| 142 |
useLayoutEffect6( |
| 143 |
function() { |
| 144 |
inst.value = value; |
| 145 |
inst.getSnapshot = getSnapshot; |
| 146 |
checkIfSnapshotChanged(inst) && forceUpdate({ inst }); |
| 147 |
}, |
| 148 |
[subscribe2, value, getSnapshot] |
| 149 |
); |
| 150 |
useEffect35( |
| 151 |
function() { |
| 152 |
checkIfSnapshotChanged(inst) && forceUpdate({ inst }); |
| 153 |
return subscribe2(function() { |
| 154 |
checkIfSnapshotChanged(inst) && forceUpdate({ inst }); |
| 155 |
}); |
| 156 |
}, |
| 157 |
[subscribe2] |
| 158 |
); |
| 159 |
useDebugValue2(value); |
| 160 |
return value; |
| 161 |
} |
| 162 |
function checkIfSnapshotChanged(inst) { |
| 163 |
var latestGetSnapshot = inst.getSnapshot; |
| 164 |
inst = inst.value; |
| 165 |
try { |
| 166 |
var nextValue = latestGetSnapshot(); |
| 167 |
return !objectIs(inst, nextValue); |
| 168 |
} catch (error) { |
| 169 |
return true; |
| 170 |
} |
| 171 |
} |
| 172 |
function useSyncExternalStore$1(subscribe2, getSnapshot) { |
| 173 |
return getSnapshot(); |
| 174 |
} |
| 175 |
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error()); |
| 176 |
var React49 = require_react(), objectIs = "function" === typeof Object.is ? Object.is : is, useState42 = React49.useState, useEffect35 = React49.useEffect, useLayoutEffect6 = React49.useLayoutEffect, useDebugValue2 = React49.useDebugValue, didWarnOld18Alpha = false, didWarnUncachedGetSnapshot = false, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2; |
| 177 |
exports.useSyncExternalStore = void 0 !== React49.useSyncExternalStore ? React49.useSyncExternalStore : shim; |
| 178 |
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error()); |
| 179 |
})(); |
| 180 |
} |
| 181 |
}); |
| 182 |
|
| 183 |
// node_modules/use-sync-external-store/shim/index.js |
| 184 |
var require_shim = __commonJS({ |
| 185 |
"node_modules/use-sync-external-store/shim/index.js"(exports, module) { |
| 186 |
"use strict"; |
| 187 |
if (false) { |
| 188 |
module.exports = null; |
| 189 |
} else { |
| 190 |
module.exports = require_use_sync_external_store_shim_development(); |
| 191 |
} |
| 192 |
} |
| 193 |
}); |
| 194 |
|
| 195 |
// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js |
| 196 |
var require_with_selector_development = __commonJS({ |
| 197 |
"node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js"(exports) { |
| 198 |
"use strict"; |
| 199 |
(function() { |
| 200 |
function is(x2, y2) { |
| 201 |
return x2 === y2 && (0 !== x2 || 1 / x2 === 1 / y2) || x2 !== x2 && y2 !== y2; |
| 202 |
} |
| 203 |
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error()); |
| 204 |
var React49 = require_react(), shim = require_shim(), objectIs = "function" === typeof Object.is ? Object.is : is, useSyncExternalStore3 = shim.useSyncExternalStore, useRef49 = React49.useRef, useEffect35 = React49.useEffect, useMemo42 = React49.useMemo, useDebugValue2 = React49.useDebugValue; |
| 205 |
exports.useSyncExternalStoreWithSelector = function(subscribe2, getSnapshot, getServerSnapshot, selector2, isEqual) { |
| 206 |
var instRef = useRef49(null); |
| 207 |
if (null === instRef.current) { |
| 208 |
var inst = { hasValue: false, value: null }; |
| 209 |
instRef.current = inst; |
| 210 |
} else inst = instRef.current; |
| 211 |
instRef = useMemo42( |
| 212 |
function() { |
| 213 |
function memoizedSelector(nextSnapshot) { |
| 214 |
if (!hasMemo) { |
| 215 |
hasMemo = true; |
| 216 |
memoizedSnapshot = nextSnapshot; |
| 217 |
nextSnapshot = selector2(nextSnapshot); |
| 218 |
if (void 0 !== isEqual && inst.hasValue) { |
| 219 |
var currentSelection = inst.value; |
| 220 |
if (isEqual(currentSelection, nextSnapshot)) |
| 221 |
return memoizedSelection = currentSelection; |
| 222 |
} |
| 223 |
return memoizedSelection = nextSnapshot; |
| 224 |
} |
| 225 |
currentSelection = memoizedSelection; |
| 226 |
if (objectIs(memoizedSnapshot, nextSnapshot)) |
| 227 |
return currentSelection; |
| 228 |
var nextSelection = selector2(nextSnapshot); |
| 229 |
if (void 0 !== isEqual && isEqual(currentSelection, nextSelection)) |
| 230 |
return memoizedSnapshot = nextSnapshot, currentSelection; |
| 231 |
memoizedSnapshot = nextSnapshot; |
| 232 |
return memoizedSelection = nextSelection; |
| 233 |
} |
| 234 |
var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot; |
| 235 |
return [ |
| 236 |
function() { |
| 237 |
return memoizedSelector(getSnapshot()); |
| 238 |
}, |
| 239 |
null === maybeGetServerSnapshot ? void 0 : function() { |
| 240 |
return memoizedSelector(maybeGetServerSnapshot()); |
| 241 |
} |
| 242 |
]; |
| 243 |
}, |
| 244 |
[getSnapshot, getServerSnapshot, selector2, isEqual] |
| 245 |
); |
| 246 |
var value = useSyncExternalStore3(subscribe2, instRef[0], instRef[1]); |
| 247 |
useEffect35( |
| 248 |
function() { |
| 249 |
inst.hasValue = true; |
| 250 |
inst.value = value; |
| 251 |
}, |
| 252 |
[value] |
| 253 |
); |
| 254 |
useDebugValue2(value); |
| 255 |
return value; |
| 256 |
}; |
| 257 |
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error()); |
| 258 |
})(); |
| 259 |
} |
| 260 |
}); |
| 261 |
|
| 262 |
// node_modules/use-sync-external-store/shim/with-selector.js |
| 263 |
var require_with_selector = __commonJS({ |
| 264 |
"node_modules/use-sync-external-store/shim/with-selector.js"(exports, module) { |
| 265 |
"use strict"; |
| 266 |
if (false) { |
| 267 |
module.exports = null; |
| 268 |
} else { |
| 269 |
module.exports = require_with_selector_development(); |
| 270 |
} |
| 271 |
} |
| 272 |
}); |
| 273 |
|
| 274 |
// package-external:@wordpress/theme |
| 275 |
var require_theme = __commonJS({ |
| 276 |
"package-external:@wordpress/theme"(exports, module) { |
| 277 |
module.exports = window.wp.theme; |
| 278 |
} |
| 279 |
}); |
| 280 |
|
| 281 |
// package-external:@wordpress/private-apis |
| 282 |
var require_private_apis = __commonJS({ |
| 283 |
"package-external:@wordpress/private-apis"(exports, module) { |
| 284 |
module.exports = window.wp.privateApis; |
| 285 |
} |
| 286 |
}); |
| 287 |
|
| 288 |
// package-external:@wordpress/keycodes |
| 289 |
var require_keycodes = __commonJS({ |
| 290 |
"package-external:@wordpress/keycodes"(exports, module) { |
| 291 |
module.exports = window.wp.keycodes; |
| 292 |
} |
| 293 |
}); |
| 294 |
|
| 295 |
// node_modules/remove-accents/index.js |
| 296 |
var require_remove_accents = __commonJS({ |
| 297 |
"node_modules/remove-accents/index.js"(exports, module) { |
| 298 |
var characterMap = { |
| 299 |
"\xC0": "A", |
| 300 |
"\xC1": "A", |
| 301 |
"\xC2": "A", |
| 302 |
"\xC3": "A", |
| 303 |
"\xC4": "A", |
| 304 |
"\xC5": "A", |
| 305 |
"\u1EA4": "A", |
| 306 |
"\u1EAE": "A", |
| 307 |
"\u1EB2": "A", |
| 308 |
"\u1EB4": "A", |
| 309 |
"\u1EB6": "A", |
| 310 |
"\xC6": "AE", |
| 311 |
"\u1EA6": "A", |
| 312 |
"\u1EB0": "A", |
| 313 |
"\u0202": "A", |
| 314 |
"\u1EA2": "A", |
| 315 |
"\u1EA0": "A", |
| 316 |
"\u1EA8": "A", |
| 317 |
"\u1EAA": "A", |
| 318 |
"\u1EAC": "A", |
| 319 |
"\xC7": "C", |
| 320 |
"\u1E08": "C", |
| 321 |
"\xC8": "E", |
| 322 |
"\xC9": "E", |
| 323 |
"\xCA": "E", |
| 324 |
"\xCB": "E", |
| 325 |
"\u1EBE": "E", |
| 326 |
"\u1E16": "E", |
| 327 |
"\u1EC0": "E", |
| 328 |
"\u1E14": "E", |
| 329 |
"\u1E1C": "E", |
| 330 |
"\u0206": "E", |
| 331 |
"\u1EBA": "E", |
| 332 |
"\u1EBC": "E", |
| 333 |
"\u1EB8": "E", |
| 334 |
"\u1EC2": "E", |
| 335 |
"\u1EC4": "E", |
| 336 |
"\u1EC6": "E", |
| 337 |
"\xCC": "I", |
| 338 |
"\xCD": "I", |
| 339 |
"\xCE": "I", |
| 340 |
"\xCF": "I", |
| 341 |
"\u1E2E": "I", |
| 342 |
"\u020A": "I", |
| 343 |
"\u1EC8": "I", |
| 344 |
"\u1ECA": "I", |
| 345 |
"\xD0": "D", |
| 346 |
"\xD1": "N", |
| 347 |
"\xD2": "O", |
| 348 |
"\xD3": "O", |
| 349 |
"\xD4": "O", |
| 350 |
"\xD5": "O", |
| 351 |
"\xD6": "O", |
| 352 |
"\xD8": "O", |
| 353 |
"\u1ED0": "O", |
| 354 |
"\u1E4C": "O", |
| 355 |
"\u1E52": "O", |
| 356 |
"\u020E": "O", |
| 357 |
"\u1ECE": "O", |
| 358 |
"\u1ECC": "O", |
| 359 |
"\u1ED4": "O", |
| 360 |
"\u1ED6": "O", |
| 361 |
"\u1ED8": "O", |
| 362 |
"\u1EDC": "O", |
| 363 |
"\u1EDE": "O", |
| 364 |
"\u1EE0": "O", |
| 365 |
"\u1EDA": "O", |
| 366 |
"\u1EE2": "O", |
| 367 |
"\xD9": "U", |
| 368 |
"\xDA": "U", |
| 369 |
"\xDB": "U", |
| 370 |
"\xDC": "U", |
| 371 |
"\u1EE6": "U", |
| 372 |
"\u1EE4": "U", |
| 373 |
"\u1EEC": "U", |
| 374 |
"\u1EEE": "U", |
| 375 |
"\u1EF0": "U", |
| 376 |
"\xDD": "Y", |
| 377 |
"\xE0": "a", |
| 378 |
"\xE1": "a", |
| 379 |
"\xE2": "a", |
| 380 |
"\xE3": "a", |
| 381 |
"\xE4": "a", |
| 382 |
"\xE5": "a", |
| 383 |
"\u1EA5": "a", |
| 384 |
"\u1EAF": "a", |
| 385 |
"\u1EB3": "a", |
| 386 |
"\u1EB5": "a", |
| 387 |
"\u1EB7": "a", |
| 388 |
"\xE6": "ae", |
| 389 |
"\u1EA7": "a", |
| 390 |
"\u1EB1": "a", |
| 391 |
"\u0203": "a", |
| 392 |
"\u1EA3": "a", |
| 393 |
"\u1EA1": "a", |
| 394 |
"\u1EA9": "a", |
| 395 |
"\u1EAB": "a", |
| 396 |
"\u1EAD": "a", |
| 397 |
"\xE7": "c", |
| 398 |
"\u1E09": "c", |
| 399 |
"\xE8": "e", |
| 400 |
"\xE9": "e", |
| 401 |
"\xEA": "e", |
| 402 |
"\xEB": "e", |
| 403 |
"\u1EBF": "e", |
| 404 |
"\u1E17": "e", |
| 405 |
"\u1EC1": "e", |
| 406 |
"\u1E15": "e", |
| 407 |
"\u1E1D": "e", |
| 408 |
"\u0207": "e", |
| 409 |
"\u1EBB": "e", |
| 410 |
"\u1EBD": "e", |
| 411 |
"\u1EB9": "e", |
| 412 |
"\u1EC3": "e", |
| 413 |
"\u1EC5": "e", |
| 414 |
"\u1EC7": "e", |
| 415 |
"\xEC": "i", |
| 416 |
"\xED": "i", |
| 417 |
"\xEE": "i", |
| 418 |
"\xEF": "i", |
| 419 |
"\u1E2F": "i", |
| 420 |
"\u020B": "i", |
| 421 |
"\u1EC9": "i", |
| 422 |
"\u1ECB": "i", |
| 423 |
"\xF0": "d", |
| 424 |
"\xF1": "n", |
| 425 |
"\xF2": "o", |
| 426 |
"\xF3": "o", |
| 427 |
"\xF4": "o", |
| 428 |
"\xF5": "o", |
| 429 |
"\xF6": "o", |
| 430 |
"\xF8": "o", |
| 431 |
"\u1ED1": "o", |
| 432 |
"\u1E4D": "o", |
| 433 |
"\u1E53": "o", |
| 434 |
"\u020F": "o", |
| 435 |
"\u1ECF": "o", |
| 436 |
"\u1ECD": "o", |
| 437 |
"\u1ED5": "o", |
| 438 |
"\u1ED7": "o", |
| 439 |
"\u1ED9": "o", |
| 440 |
"\u1EDD": "o", |
| 441 |
"\u1EDF": "o", |
| 442 |
"\u1EE1": "o", |
| 443 |
"\u1EDB": "o", |
| 444 |
"\u1EE3": "o", |
| 445 |
"\xF9": "u", |
| 446 |
"\xFA": "u", |
| 447 |
"\xFB": "u", |
| 448 |
"\xFC": "u", |
| 449 |
"\u1EE7": "u", |
| 450 |
"\u1EE5": "u", |
| 451 |
"\u1EED": "u", |
| 452 |
"\u1EEF": "u", |
| 453 |
"\u1EF1": "u", |
| 454 |
"\xFD": "y", |
| 455 |
"\xFF": "y", |
| 456 |
"\u0100": "A", |
| 457 |
"\u0101": "a", |
| 458 |
"\u0102": "A", |
| 459 |
"\u0103": "a", |
| 460 |
"\u0104": "A", |
| 461 |
"\u0105": "a", |
| 462 |
"\u0106": "C", |
| 463 |
"\u0107": "c", |
| 464 |
"\u0108": "C", |
| 465 |
"\u0109": "c", |
| 466 |
"\u010A": "C", |
| 467 |
"\u010B": "c", |
| 468 |
"\u010C": "C", |
| 469 |
"\u010D": "c", |
| 470 |
"C\u0306": "C", |
| 471 |
"c\u0306": "c", |
| 472 |
"\u010E": "D", |
| 473 |
"\u010F": "d", |
| 474 |
"\u0110": "D", |
| 475 |
"\u0111": "d", |
| 476 |
"\u0112": "E", |
| 477 |
"\u0113": "e", |
| 478 |
"\u0114": "E", |
| 479 |
"\u0115": "e", |
| 480 |
"\u0116": "E", |
| 481 |
"\u0117": "e", |
| 482 |
"\u0118": "E", |
| 483 |
"\u0119": "e", |
| 484 |
"\u011A": "E", |
| 485 |
"\u011B": "e", |
| 486 |
"\u011C": "G", |
| 487 |
"\u01F4": "G", |
| 488 |
"\u011D": "g", |
| 489 |
"\u01F5": "g", |
| 490 |
"\u011E": "G", |
| 491 |
"\u011F": "g", |
| 492 |
"\u0120": "G", |
| 493 |
"\u0121": "g", |
| 494 |
"\u0122": "G", |
| 495 |
"\u0123": "g", |
| 496 |
"\u0124": "H", |
| 497 |
"\u0125": "h", |
| 498 |
"\u0126": "H", |
| 499 |
"\u0127": "h", |
| 500 |
"\u1E2A": "H", |
| 501 |
"\u1E2B": "h", |
| 502 |
"\u0128": "I", |
| 503 |
"\u0129": "i", |
| 504 |
"\u012A": "I", |
| 505 |
"\u012B": "i", |
| 506 |
"\u012C": "I", |
| 507 |
"\u012D": "i", |
| 508 |
"\u012E": "I", |
| 509 |
"\u012F": "i", |
| 510 |
"\u0130": "I", |
| 511 |
"\u0131": "i", |
| 512 |
"\u0132": "IJ", |
| 513 |
"\u0133": "ij", |
| 514 |
"\u0134": "J", |
| 515 |
"\u0135": "j", |
| 516 |
"\u0136": "K", |
| 517 |
"\u0137": "k", |
| 518 |
"\u1E30": "K", |
| 519 |
"\u1E31": "k", |
| 520 |
"K\u0306": "K", |
| 521 |
"k\u0306": "k", |
| 522 |
"\u0139": "L", |
| 523 |
"\u013A": "l", |
| 524 |
"\u013B": "L", |
| 525 |
"\u013C": "l", |
| 526 |
"\u013D": "L", |
| 527 |
"\u013E": "l", |
| 528 |
"\u013F": "L", |
| 529 |
"\u0140": "l", |
| 530 |
"\u0141": "l", |
| 531 |
"\u0142": "l", |
| 532 |
"\u1E3E": "M", |
| 533 |
"\u1E3F": "m", |
| 534 |
"M\u0306": "M", |
| 535 |
"m\u0306": "m", |
| 536 |
"\u0143": "N", |
| 537 |
"\u0144": "n", |
| 538 |
"\u0145": "N", |
| 539 |
"\u0146": "n", |
| 540 |
"\u0147": "N", |
| 541 |
"\u0148": "n", |
| 542 |
"\u0149": "n", |
| 543 |
"N\u0306": "N", |
| 544 |
"n\u0306": "n", |
| 545 |
"\u014C": "O", |
| 546 |
"\u014D": "o", |
| 547 |
"\u014E": "O", |
| 548 |
"\u014F": "o", |
| 549 |
"\u0150": "O", |
| 550 |
"\u0151": "o", |
| 551 |
"\u0152": "OE", |
| 552 |
"\u0153": "oe", |
| 553 |
"P\u0306": "P", |
| 554 |
"p\u0306": "p", |
| 555 |
"\u0154": "R", |
| 556 |
"\u0155": "r", |
| 557 |
"\u0156": "R", |
| 558 |
"\u0157": "r", |
| 559 |
"\u0158": "R", |
| 560 |
"\u0159": "r", |
| 561 |
"R\u0306": "R", |
| 562 |
"r\u0306": "r", |
| 563 |
"\u0212": "R", |
| 564 |
"\u0213": "r", |
| 565 |
"\u015A": "S", |
| 566 |
"\u015B": "s", |
| 567 |
"\u015C": "S", |
| 568 |
"\u015D": "s", |
| 569 |
"\u015E": "S", |
| 570 |
"\u0218": "S", |
| 571 |
"\u0219": "s", |
| 572 |
"\u015F": "s", |
| 573 |
"\u0160": "S", |
| 574 |
"\u0161": "s", |
| 575 |
"\u0162": "T", |
| 576 |
"\u0163": "t", |
| 577 |
"\u021B": "t", |
| 578 |
"\u021A": "T", |
| 579 |
"\u0164": "T", |
| 580 |
"\u0165": "t", |
| 581 |
"\u0166": "T", |
| 582 |
"\u0167": "t", |
| 583 |
"T\u0306": "T", |
| 584 |
"t\u0306": "t", |
| 585 |
"\u0168": "U", |
| 586 |
"\u0169": "u", |
| 587 |
"\u016A": "U", |
| 588 |
"\u016B": "u", |
| 589 |
"\u016C": "U", |
| 590 |
"\u016D": "u", |
| 591 |
"\u016E": "U", |
| 592 |
"\u016F": "u", |
| 593 |
"\u0170": "U", |
| 594 |
"\u0171": "u", |
| 595 |
"\u0172": "U", |
| 596 |
"\u0173": "u", |
| 597 |
"\u0216": "U", |
| 598 |
"\u0217": "u", |
| 599 |
"V\u0306": "V", |
| 600 |
"v\u0306": "v", |
| 601 |
"\u0174": "W", |
| 602 |
"\u0175": "w", |
| 603 |
"\u1E82": "W", |
| 604 |
"\u1E83": "w", |
| 605 |
"X\u0306": "X", |
| 606 |
"x\u0306": "x", |
| 607 |
"\u0176": "Y", |
| 608 |
"\u0177": "y", |
| 609 |
"\u0178": "Y", |
| 610 |
"Y\u0306": "Y", |
| 611 |
"y\u0306": "y", |
| 612 |
"\u0179": "Z", |
| 613 |
"\u017A": "z", |
| 614 |
"\u017B": "Z", |
| 615 |
"\u017C": "z", |
| 616 |
"\u017D": "Z", |
| 617 |
"\u017E": "z", |
| 618 |
"\u017F": "s", |
| 619 |
"\u0192": "f", |
| 620 |
"\u01A0": "O", |
| 621 |
"\u01A1": "o", |
| 622 |
"\u01AF": "U", |
| 623 |
"\u01B0": "u", |
| 624 |
"\u01CD": "A", |
| 625 |
"\u01CE": "a", |
| 626 |
"\u01CF": "I", |
| 627 |
"\u01D0": "i", |
| 628 |
"\u01D1": "O", |
| 629 |
"\u01D2": "o", |
| 630 |
"\u01D3": "U", |
| 631 |
"\u01D4": "u", |
| 632 |
"\u01D5": "U", |
| 633 |
"\u01D6": "u", |
| 634 |
"\u01D7": "U", |
| 635 |
"\u01D8": "u", |
| 636 |
"\u01D9": "U", |
| 637 |
"\u01DA": "u", |
| 638 |
"\u01DB": "U", |
| 639 |
"\u01DC": "u", |
| 640 |
"\u1EE8": "U", |
| 641 |
"\u1EE9": "u", |
| 642 |
"\u1E78": "U", |
| 643 |
"\u1E79": "u", |
| 644 |
"\u01FA": "A", |
| 645 |
"\u01FB": "a", |
| 646 |
"\u01FC": "AE", |
| 647 |
"\u01FD": "ae", |
| 648 |
"\u01FE": "O", |
| 649 |
"\u01FF": "o", |
| 650 |
"\xDE": "TH", |
| 651 |
"\xFE": "th", |
| 652 |
"\u1E54": "P", |
| 653 |
"\u1E55": "p", |
| 654 |
"\u1E64": "S", |
| 655 |
"\u1E65": "s", |
| 656 |
"X\u0301": "X", |
| 657 |
"x\u0301": "x", |
| 658 |
"\u0403": "\u0413", |
| 659 |
"\u0453": "\u0433", |
| 660 |
"\u040C": "\u041A", |
| 661 |
"\u045C": "\u043A", |
| 662 |
"A\u030B": "A", |
| 663 |
"a\u030B": "a", |
| 664 |
"E\u030B": "E", |
| 665 |
"e\u030B": "e", |
| 666 |
"I\u030B": "I", |
| 667 |
"i\u030B": "i", |
| 668 |
"\u01F8": "N", |
| 669 |
"\u01F9": "n", |
| 670 |
"\u1ED2": "O", |
| 671 |
"\u1ED3": "o", |
| 672 |
"\u1E50": "O", |
| 673 |
"\u1E51": "o", |
| 674 |
"\u1EEA": "U", |
| 675 |
"\u1EEB": "u", |
| 676 |
"\u1E80": "W", |
| 677 |
"\u1E81": "w", |
| 678 |
"\u1EF2": "Y", |
| 679 |
"\u1EF3": "y", |
| 680 |
"\u0200": "A", |
| 681 |
"\u0201": "a", |
| 682 |
"\u0204": "E", |
| 683 |
"\u0205": "e", |
| 684 |
"\u0208": "I", |
| 685 |
"\u0209": "i", |
| 686 |
"\u020C": "O", |
| 687 |
"\u020D": "o", |
| 688 |
"\u0210": "R", |
| 689 |
"\u0211": "r", |
| 690 |
"\u0214": "U", |
| 691 |
"\u0215": "u", |
| 692 |
"B\u030C": "B", |
| 693 |
"b\u030C": "b", |
| 694 |
"\u010C\u0323": "C", |
| 695 |
"\u010D\u0323": "c", |
| 696 |
"\xCA\u030C": "E", |
| 697 |
"\xEA\u030C": "e", |
| 698 |
"F\u030C": "F", |
| 699 |
"f\u030C": "f", |
| 700 |
"\u01E6": "G", |
| 701 |
"\u01E7": "g", |
| 702 |
"\u021E": "H", |
| 703 |
"\u021F": "h", |
| 704 |
"J\u030C": "J", |
| 705 |
"\u01F0": "j", |
| 706 |
"\u01E8": "K", |
| 707 |
"\u01E9": "k", |
| 708 |
"M\u030C": "M", |
| 709 |
"m\u030C": "m", |
| 710 |
"P\u030C": "P", |
| 711 |
"p\u030C": "p", |
| 712 |
"Q\u030C": "Q", |
| 713 |
"q\u030C": "q", |
| 714 |
"\u0158\u0329": "R", |
| 715 |
"\u0159\u0329": "r", |
| 716 |
"\u1E66": "S", |
| 717 |
"\u1E67": "s", |
| 718 |
"V\u030C": "V", |
| 719 |
"v\u030C": "v", |
| 720 |
"W\u030C": "W", |
| 721 |
"w\u030C": "w", |
| 722 |
"X\u030C": "X", |
| 723 |
"x\u030C": "x", |
| 724 |
"Y\u030C": "Y", |
| 725 |
"y\u030C": "y", |
| 726 |
"A\u0327": "A", |
| 727 |
"a\u0327": "a", |
| 728 |
"B\u0327": "B", |
| 729 |
"b\u0327": "b", |
| 730 |
"\u1E10": "D", |
| 731 |
"\u1E11": "d", |
| 732 |
"\u0228": "E", |
| 733 |
"\u0229": "e", |
| 734 |
"\u0190\u0327": "E", |
| 735 |
"\u025B\u0327": "e", |
| 736 |
"\u1E28": "H", |
| 737 |
"\u1E29": "h", |
| 738 |
"I\u0327": "I", |
| 739 |
"i\u0327": "i", |
| 740 |
"\u0197\u0327": "I", |
| 741 |
"\u0268\u0327": "i", |
| 742 |
"M\u0327": "M", |
| 743 |
"m\u0327": "m", |
| 744 |
"O\u0327": "O", |
| 745 |
"o\u0327": "o", |
| 746 |
"Q\u0327": "Q", |
| 747 |
"q\u0327": "q", |
| 748 |
"U\u0327": "U", |
| 749 |
"u\u0327": "u", |
| 750 |
"X\u0327": "X", |
| 751 |
"x\u0327": "x", |
| 752 |
"Z\u0327": "Z", |
| 753 |
"z\u0327": "z", |
| 754 |
"\u0439": "\u0438", |
| 755 |
"\u0419": "\u0418", |
| 756 |
"\u0451": "\u0435", |
| 757 |
"\u0401": "\u0415" |
| 758 |
}; |
| 759 |
var chars = Object.keys(characterMap).join("|"); |
| 760 |
var allAccents = new RegExp(chars, "g"); |
| 761 |
var firstAccent = new RegExp(chars, ""); |
| 762 |
function matcher(match2) { |
| 763 |
return characterMap[match2]; |
| 764 |
} |
| 765 |
var removeAccents2 = function(string) { |
| 766 |
return string.replace(allAccents, matcher); |
| 767 |
}; |
| 768 |
var hasAccents = function(string) { |
| 769 |
return !!string.match(firstAccent); |
| 770 |
}; |
| 771 |
module.exports = removeAccents2; |
| 772 |
module.exports.has = hasAccents; |
| 773 |
module.exports.remove = removeAccents2; |
| 774 |
} |
| 775 |
}); |
| 776 |
|
| 777 |
// node_modules/fast-deep-equal/es6/index.js |
| 778 |
var require_es6 = __commonJS({ |
| 779 |
"node_modules/fast-deep-equal/es6/index.js"(exports, module) { |
| 780 |
"use strict"; |
| 781 |
module.exports = function equal(a2, b2) { |
| 782 |
if (a2 === b2) return true; |
| 783 |
if (a2 && b2 && typeof a2 == "object" && typeof b2 == "object") { |
| 784 |
if (a2.constructor !== b2.constructor) return false; |
| 785 |
var length, i2, keys; |
| 786 |
if (Array.isArray(a2)) { |
| 787 |
length = a2.length; |
| 788 |
if (length != b2.length) return false; |
| 789 |
for (i2 = length; i2-- !== 0; ) |
| 790 |
if (!equal(a2[i2], b2[i2])) return false; |
| 791 |
return true; |
| 792 |
} |
| 793 |
if (a2 instanceof Map && b2 instanceof Map) { |
| 794 |
if (a2.size !== b2.size) return false; |
| 795 |
for (i2 of a2.entries()) |
| 796 |
if (!b2.has(i2[0])) return false; |
| 797 |
for (i2 of a2.entries()) |
| 798 |
if (!equal(i2[1], b2.get(i2[0]))) return false; |
| 799 |
return true; |
| 800 |
} |
| 801 |
if (a2 instanceof Set && b2 instanceof Set) { |
| 802 |
if (a2.size !== b2.size) return false; |
| 803 |
for (i2 of a2.entries()) |
| 804 |
if (!b2.has(i2[0])) return false; |
| 805 |
return true; |
| 806 |
} |
| 807 |
if (ArrayBuffer.isView(a2) && ArrayBuffer.isView(b2)) { |
| 808 |
length = a2.length; |
| 809 |
if (length != b2.length) return false; |
| 810 |
for (i2 = length; i2-- !== 0; ) |
| 811 |
if (a2[i2] !== b2[i2]) return false; |
| 812 |
return true; |
| 813 |
} |
| 814 |
if (a2.constructor === RegExp) return a2.source === b2.source && a2.flags === b2.flags; |
| 815 |
if (a2.valueOf !== Object.prototype.valueOf) return a2.valueOf() === b2.valueOf(); |
| 816 |
if (a2.toString !== Object.prototype.toString) return a2.toString() === b2.toString(); |
| 817 |
keys = Object.keys(a2); |
| 818 |
length = keys.length; |
| 819 |
if (length !== Object.keys(b2).length) return false; |
| 820 |
for (i2 = length; i2-- !== 0; ) |
| 821 |
if (!Object.prototype.hasOwnProperty.call(b2, keys[i2])) return false; |
| 822 |
for (i2 = length; i2-- !== 0; ) { |
| 823 |
var key = keys[i2]; |
| 824 |
if (!equal(a2[key], b2[key])) return false; |
| 825 |
} |
| 826 |
return true; |
| 827 |
} |
| 828 |
return a2 !== a2 && b2 !== b2; |
| 829 |
}; |
| 830 |
} |
| 831 |
}); |
| 832 |
|
| 833 |
// package-external:@wordpress/date |
| 834 |
var require_date = __commonJS({ |
| 835 |
"package-external:@wordpress/date"(exports, module) { |
| 836 |
module.exports = window.wp.date; |
| 837 |
} |
| 838 |
}); |
| 839 |
|
| 840 |
// package-external:@wordpress/warning |
| 841 |
var require_warning = __commonJS({ |
| 842 |
"package-external:@wordpress/warning"(exports, module) { |
| 843 |
module.exports = window.wp.warning; |
| 844 |
} |
| 845 |
}); |
| 846 |
|
| 847 |
// package-external:@wordpress/preferences |
| 848 |
var require_preferences = __commonJS({ |
| 849 |
"package-external:@wordpress/preferences"(exports, module) { |
| 850 |
module.exports = window.wp.preferences; |
| 851 |
} |
| 852 |
}); |
| 853 |
|
| 854 |
// package-external:@wordpress/url |
| 855 |
var require_url = __commonJS({ |
| 856 |
"package-external:@wordpress/url"(exports, module) { |
| 857 |
module.exports = window.wp.url; |
| 858 |
} |
| 859 |
}); |
| 860 |
|
| 861 |
// package-external:@wordpress/notices |
| 862 |
var require_notices = __commonJS({ |
| 863 |
"package-external:@wordpress/notices"(exports, module) { |
| 864 |
module.exports = window.wp.notices; |
| 865 |
} |
| 866 |
}); |
| 867 |
|
| 868 |
// packages/media-utils/build-module/index.mjs |
| 869 |
var index_exports = {}; |
| 870 |
__export(index_exports, { |
| 871 |
MediaUpload: () => media_upload_default, |
| 872 |
privateApis: () => privateApis12, |
| 873 |
transformAttachment: () => transformAttachment, |
| 874 |
uploadMedia: () => uploadMedia, |
| 875 |
validateFileSize: () => validateFileSize, |
| 876 |
validateMimeType: () => validateMimeType, |
| 877 |
validateMimeTypeForUser: () => validateMimeTypeForUser |
| 878 |
}); |
| 879 |
|
| 880 |
// packages/media-utils/build-module/components/media-upload/index.mjs |
| 881 |
var import_element = __toESM(require_element(), 1); |
| 882 |
var import_i18n = __toESM(require_i18n(), 1); |
| 883 |
var DEFAULT_EMPTY_GALLERY = []; |
| 884 |
var getFeaturedImageMediaFrame = () => { |
| 885 |
const { wp } = window; |
| 886 |
return wp.media.view.MediaFrame.Select.extend({ |
| 887 |
/** |
| 888 |
* Enables the Set Featured Image Button. |
| 889 |
* |
| 890 |
* @param {Object} toolbar toolbar for featured image state |
| 891 |
* @return {void} |
| 892 |
*/ |
| 893 |
featuredImageToolbar(toolbar) { |
| 894 |
this.createSelectToolbar(toolbar, { |
| 895 |
text: wp.media.view.l10n.setFeaturedImage, |
| 896 |
state: this.options.state |
| 897 |
}); |
| 898 |
}, |
| 899 |
/** |
| 900 |
* Handle the edit state requirements of selected media item. |
| 901 |
* |
| 902 |
* @return {void} |
| 903 |
*/ |
| 904 |
editState() { |
| 905 |
const selection = this.state("featured-image").get("selection"); |
| 906 |
const view = new wp.media.view.EditImage({ |
| 907 |
model: selection.single(), |
| 908 |
controller: this |
| 909 |
}).render(); |
| 910 |
this.content.set(view); |
| 911 |
view.loadEditor(); |
| 912 |
}, |
| 913 |
/** |
| 914 |
* Create the default states. |
| 915 |
* |
| 916 |
* @return {void} |
| 917 |
*/ |
| 918 |
createStates: function createStates() { |
| 919 |
this.on( |
| 920 |
"toolbar:create:featured-image", |
| 921 |
this.featuredImageToolbar, |
| 922 |
this |
| 923 |
); |
| 924 |
this.on("content:render:edit-image", this.editState, this); |
| 925 |
this.states.add([ |
| 926 |
new wp.media.controller.FeaturedImage(), |
| 927 |
new wp.media.controller.EditImage({ |
| 928 |
model: this.options.editImage |
| 929 |
}) |
| 930 |
]); |
| 931 |
} |
| 932 |
}); |
| 933 |
}; |
| 934 |
var getSingleMediaFrame = () => { |
| 935 |
const { wp } = window; |
| 936 |
return wp.media.view.MediaFrame.Select.extend({ |
| 937 |
/** |
| 938 |
* Create the default states on the frame. |
| 939 |
*/ |
| 940 |
createStates() { |
| 941 |
const options = this.options; |
| 942 |
if (this.options.states) { |
| 943 |
return; |
| 944 |
} |
| 945 |
this.states.add([ |
| 946 |
// Main states. |
| 947 |
new wp.media.controller.Library({ |
| 948 |
library: wp.media.query(options.library), |
| 949 |
multiple: options.multiple, |
| 950 |
title: options.title, |
| 951 |
priority: 20, |
| 952 |
filterable: "uploaded" |
| 953 |
// Allow filtering by uploaded images. |
| 954 |
}), |
| 955 |
new wp.media.controller.EditImage({ |
| 956 |
model: options.editImage |
| 957 |
}) |
| 958 |
]); |
| 959 |
} |
| 960 |
}); |
| 961 |
}; |
| 962 |
var getGalleryDetailsMediaFrame = () => { |
| 963 |
const { wp } = window; |
| 964 |
return wp.media.view.MediaFrame.Post.extend({ |
| 965 |
/** |
| 966 |
* Set up gallery toolbar. |
| 967 |
* |
| 968 |
* @return {void} |
| 969 |
*/ |
| 970 |
galleryToolbar() { |
| 971 |
const editing = this.state().get("editing"); |
| 972 |
this.toolbar.set( |
| 973 |
new wp.media.view.Toolbar({ |
| 974 |
controller: this, |
| 975 |
items: { |
| 976 |
insert: { |
| 977 |
style: "primary", |
| 978 |
text: editing ? wp.media.view.l10n.updateGallery : wp.media.view.l10n.insertGallery, |
| 979 |
priority: 80, |
| 980 |
requires: { library: true }, |
| 981 |
/** |
| 982 |
* @fires wp.media.controller.State#update |
| 983 |
*/ |
| 984 |
click() { |
| 985 |
const controller = this.controller, state = controller.state(); |
| 986 |
controller.close(); |
| 987 |
state.trigger( |
| 988 |
"update", |
| 989 |
state.get("library") |
| 990 |
); |
| 991 |
controller.setState(controller.options.state); |
| 992 |
controller.reset(); |
| 993 |
} |
| 994 |
} |
| 995 |
} |
| 996 |
}) |
| 997 |
); |
| 998 |
}, |
| 999 |
/** |
| 1000 |
* Handle the edit state requirements of selected media item. |
| 1001 |
* |
| 1002 |
* @return {void} |
| 1003 |
*/ |
| 1004 |
editState() { |
| 1005 |
const selection = this.state("gallery").get("selection"); |
| 1006 |
const view = new wp.media.view.EditImage({ |
| 1007 |
model: selection.single(), |
| 1008 |
controller: this |
| 1009 |
}).render(); |
| 1010 |
this.content.set(view); |
| 1011 |
view.loadEditor(); |
| 1012 |
}, |
| 1013 |
/** |
| 1014 |
* Create the default states. |
| 1015 |
* |
| 1016 |
* @return {void} |
| 1017 |
*/ |
| 1018 |
createStates: function createStates() { |
| 1019 |
this.on("toolbar:create:main-gallery", this.galleryToolbar, this); |
| 1020 |
this.on("content:render:edit-image", this.editState, this); |
| 1021 |
this.states.add([ |
| 1022 |
new wp.media.controller.Library({ |
| 1023 |
id: "gallery", |
| 1024 |
title: wp.media.view.l10n.createGalleryTitle, |
| 1025 |
priority: 40, |
| 1026 |
toolbar: "main-gallery", |
| 1027 |
filterable: "uploaded", |
| 1028 |
multiple: "add", |
| 1029 |
editable: false, |
| 1030 |
library: wp.media.query({ |
| 1031 |
type: "image", |
| 1032 |
...this.options.library |
| 1033 |
}) |
| 1034 |
}), |
| 1035 |
new wp.media.controller.EditImage({ |
| 1036 |
model: this.options.editImage |
| 1037 |
}), |
| 1038 |
new wp.media.controller.GalleryEdit({ |
| 1039 |
library: this.options.selection, |
| 1040 |
editing: this.options.editing, |
| 1041 |
menu: "gallery", |
| 1042 |
displaySettings: false, |
| 1043 |
multiple: true |
| 1044 |
}), |
| 1045 |
new wp.media.controller.GalleryAdd() |
| 1046 |
]); |
| 1047 |
} |
| 1048 |
}); |
| 1049 |
}; |
| 1050 |
var slimImageObject = (img) => { |
| 1051 |
const attrSet = [ |
| 1052 |
"sizes", |
| 1053 |
"mime", |
| 1054 |
"type", |
| 1055 |
"subtype", |
| 1056 |
"id", |
| 1057 |
"url", |
| 1058 |
"alt", |
| 1059 |
"link", |
| 1060 |
"caption" |
| 1061 |
]; |
| 1062 |
return attrSet.reduce((result, key) => { |
| 1063 |
if (img?.hasOwnProperty(key)) { |
| 1064 |
result[key] = img[key]; |
| 1065 |
} |
| 1066 |
return result; |
| 1067 |
}, {}); |
| 1068 |
}; |
| 1069 |
var getAttachmentsCollection = (ids) => { |
| 1070 |
const { wp } = window; |
| 1071 |
return wp.media.query({ |
| 1072 |
order: "ASC", |
| 1073 |
orderby: "post__in", |
| 1074 |
post__in: ids, |
| 1075 |
posts_per_page: -1, |
| 1076 |
query: true, |
| 1077 |
type: "image" |
| 1078 |
}); |
| 1079 |
}; |
| 1080 |
var MediaUpload = class extends import_element.Component { |
| 1081 |
constructor() { |
| 1082 |
super(...arguments); |
| 1083 |
this.openModal = this.openModal.bind(this); |
| 1084 |
this.onOpen = this.onOpen.bind(this); |
| 1085 |
this.onSelect = this.onSelect.bind(this); |
| 1086 |
this.onUpdate = this.onUpdate.bind(this); |
| 1087 |
this.onClose = this.onClose.bind(this); |
| 1088 |
} |
| 1089 |
initializeListeners() { |
| 1090 |
this.frame.on("select", this.onSelect); |
| 1091 |
this.frame.on("update", this.onUpdate); |
| 1092 |
this.frame.on("open", this.onOpen); |
| 1093 |
this.frame.on("close", this.onClose); |
| 1094 |
} |
| 1095 |
/** |
| 1096 |
* Sets the Gallery frame and initializes listeners. |
| 1097 |
* |
| 1098 |
* @return {void} |
| 1099 |
*/ |
| 1100 |
buildAndSetGalleryFrame() { |
| 1101 |
const { |
| 1102 |
addToGallery = false, |
| 1103 |
allowedTypes, |
| 1104 |
multiple = false, |
| 1105 |
value = DEFAULT_EMPTY_GALLERY |
| 1106 |
} = this.props; |
| 1107 |
if (value === this.lastGalleryValue) { |
| 1108 |
return; |
| 1109 |
} |
| 1110 |
const { wp } = window; |
| 1111 |
this.lastGalleryValue = value; |
| 1112 |
if (this.frame) { |
| 1113 |
this.frame.remove(); |
| 1114 |
} |
| 1115 |
let currentState; |
| 1116 |
if (addToGallery) { |
| 1117 |
currentState = "gallery-library"; |
| 1118 |
} else { |
| 1119 |
currentState = value && value.length ? "gallery-edit" : "gallery"; |
| 1120 |
} |
| 1121 |
if (!this.GalleryDetailsMediaFrame) { |
| 1122 |
this.GalleryDetailsMediaFrame = getGalleryDetailsMediaFrame(); |
| 1123 |
} |
| 1124 |
const attachments = getAttachmentsCollection(value); |
| 1125 |
const selection = new wp.media.model.Selection(attachments.models, { |
| 1126 |
props: attachments.props.toJSON(), |
| 1127 |
multiple |
| 1128 |
}); |
| 1129 |
this.frame = new this.GalleryDetailsMediaFrame({ |
| 1130 |
mimeType: allowedTypes, |
| 1131 |
state: currentState, |
| 1132 |
multiple, |
| 1133 |
selection, |
| 1134 |
editing: !!value?.length |
| 1135 |
}); |
| 1136 |
wp.media.frame = this.frame; |
| 1137 |
this.initializeListeners(); |
| 1138 |
} |
| 1139 |
/** |
| 1140 |
* Initializes the Media Library requirements for the featured image flow. |
| 1141 |
* |
| 1142 |
* @return {void} |
| 1143 |
*/ |
| 1144 |
buildAndSetFeatureImageFrame() { |
| 1145 |
const { wp } = window; |
| 1146 |
const { value: featuredImageId, multiple, allowedTypes } = this.props; |
| 1147 |
const featuredImageFrame = getFeaturedImageMediaFrame(); |
| 1148 |
const attachments = getAttachmentsCollection(featuredImageId); |
| 1149 |
const selection = new wp.media.model.Selection(attachments.models, { |
| 1150 |
props: attachments.props.toJSON() |
| 1151 |
}); |
| 1152 |
this.frame = new featuredImageFrame({ |
| 1153 |
mimeType: allowedTypes, |
| 1154 |
state: "featured-image", |
| 1155 |
multiple, |
| 1156 |
selection, |
| 1157 |
editing: featuredImageId |
| 1158 |
}); |
| 1159 |
wp.media.frame = this.frame; |
| 1160 |
wp.media.view.settings.post = { |
| 1161 |
...wp.media.view.settings.post, |
| 1162 |
featuredImageId: featuredImageId || -1 |
| 1163 |
}; |
| 1164 |
} |
| 1165 |
/** |
| 1166 |
* Initializes the Media Library requirements for the single image flow. |
| 1167 |
* |
| 1168 |
* @return {void} |
| 1169 |
*/ |
| 1170 |
buildAndSetSingleMediaFrame() { |
| 1171 |
const { wp } = window; |
| 1172 |
const { |
| 1173 |
allowedTypes, |
| 1174 |
multiple = false, |
| 1175 |
title = (0, import_i18n.__)("Select or Upload Media"), |
| 1176 |
value |
| 1177 |
} = this.props; |
| 1178 |
const frameConfig = { |
| 1179 |
title, |
| 1180 |
multiple |
| 1181 |
}; |
| 1182 |
if (!!allowedTypes) { |
| 1183 |
frameConfig.library = { type: allowedTypes }; |
| 1184 |
} |
| 1185 |
if (this.frame) { |
| 1186 |
this.frame.remove(); |
| 1187 |
} |
| 1188 |
const singleImageFrame = getSingleMediaFrame(); |
| 1189 |
const attachments = getAttachmentsCollection(value); |
| 1190 |
const selection = new wp.media.model.Selection(attachments.models, { |
| 1191 |
props: attachments.props.toJSON() |
| 1192 |
}); |
| 1193 |
this.frame = new singleImageFrame({ |
| 1194 |
mimeType: allowedTypes, |
| 1195 |
multiple, |
| 1196 |
selection, |
| 1197 |
...frameConfig |
| 1198 |
}); |
| 1199 |
wp.media.frame = this.frame; |
| 1200 |
} |
| 1201 |
componentWillUnmount() { |
| 1202 |
this.frame?.remove(); |
| 1203 |
} |
| 1204 |
onUpdate(selections) { |
| 1205 |
const { onSelect, multiple = false } = this.props; |
| 1206 |
const state = this.frame.state(); |
| 1207 |
const selectedImages = selections || state.get("selection"); |
| 1208 |
if (!selectedImages || !selectedImages.models.length) { |
| 1209 |
return; |
| 1210 |
} |
| 1211 |
if (multiple) { |
| 1212 |
onSelect( |
| 1213 |
selectedImages.models.map( |
| 1214 |
(model) => slimImageObject(model.toJSON()) |
| 1215 |
) |
| 1216 |
); |
| 1217 |
} else { |
| 1218 |
onSelect(slimImageObject(selectedImages.models[0].toJSON())); |
| 1219 |
} |
| 1220 |
} |
| 1221 |
onSelect() { |
| 1222 |
const { onSelect, multiple = false } = this.props; |
| 1223 |
const attachment = this.frame.state().get("selection").toJSON(); |
| 1224 |
onSelect(multiple ? attachment : attachment[0]); |
| 1225 |
} |
| 1226 |
onOpen() { |
| 1227 |
const { wp } = window; |
| 1228 |
const { value } = this.props; |
| 1229 |
this.updateCollection(); |
| 1230 |
if (this.props.mode) { |
| 1231 |
this.frame.content.mode(this.props.mode); |
| 1232 |
} |
| 1233 |
const hasMedia = Array.isArray(value) ? !!value?.length : !!value; |
| 1234 |
if (!hasMedia) { |
| 1235 |
return; |
| 1236 |
} |
| 1237 |
const isGallery = this.props.gallery; |
| 1238 |
const selection = this.frame.state().get("selection"); |
| 1239 |
const valueArray = Array.isArray(value) ? value : [value]; |
| 1240 |
if (!isGallery) { |
| 1241 |
valueArray.forEach((id) => { |
| 1242 |
selection.add(wp.media.attachment(id)); |
| 1243 |
}); |
| 1244 |
} |
| 1245 |
const attachments = getAttachmentsCollection(valueArray); |
| 1246 |
attachments.more().done(function() { |
| 1247 |
if (isGallery && attachments?.models?.length) { |
| 1248 |
selection.add(attachments.models); |
| 1249 |
} |
| 1250 |
}); |
| 1251 |
} |
| 1252 |
onClose() { |
| 1253 |
const { onClose } = this.props; |
| 1254 |
if (onClose) { |
| 1255 |
onClose(); |
| 1256 |
} |
| 1257 |
this.frame.detach(); |
| 1258 |
} |
| 1259 |
updateCollection() { |
| 1260 |
const frameContent = this.frame.content.get(); |
| 1261 |
if (frameContent && frameContent.collection) { |
| 1262 |
const collection = frameContent.collection; |
| 1263 |
collection.toArray().forEach((model) => model.trigger("destroy", model)); |
| 1264 |
collection.mirroring._hasMore = true; |
| 1265 |
collection.more(); |
| 1266 |
} |
| 1267 |
} |
| 1268 |
openModal() { |
| 1269 |
const { |
| 1270 |
gallery = false, |
| 1271 |
unstableFeaturedImageFlow = false, |
| 1272 |
modalClass |
| 1273 |
} = this.props; |
| 1274 |
if (gallery) { |
| 1275 |
this.buildAndSetGalleryFrame(); |
| 1276 |
} else { |
| 1277 |
this.buildAndSetSingleMediaFrame(); |
| 1278 |
} |
| 1279 |
if (modalClass) { |
| 1280 |
this.frame.$el.addClass(modalClass); |
| 1281 |
} |
| 1282 |
if (unstableFeaturedImageFlow) { |
| 1283 |
this.buildAndSetFeatureImageFrame(); |
| 1284 |
} |
| 1285 |
this.initializeListeners(); |
| 1286 |
this.frame.open(); |
| 1287 |
} |
| 1288 |
render() { |
| 1289 |
return this.props.render({ open: this.openModal }); |
| 1290 |
} |
| 1291 |
}; |
| 1292 |
var media_upload_default = MediaUpload; |
| 1293 |
|
| 1294 |
// packages/media-utils/build-module/utils/upload-media.mjs |
| 1295 |
var import_i18n5 = __toESM(require_i18n(), 1); |
| 1296 |
var import_blob = __toESM(require_blob(), 1); |
| 1297 |
|
| 1298 |
// packages/media-utils/build-module/utils/upload-to-server.mjs |
| 1299 |
var import_api_fetch = __toESM(require_api_fetch(), 1); |
| 1300 |
|
| 1301 |
// packages/media-utils/build-module/utils/flatten-form-data.mjs |
| 1302 |
function isPlainObject(data) { |
| 1303 |
return data !== null && typeof data === "object" && Object.getPrototypeOf(data) === Object.prototype; |
| 1304 |
} |
| 1305 |
function flattenFormData(formData, key, data) { |
| 1306 |
if (isPlainObject(data)) { |
| 1307 |
for (const [name, value] of Object.entries(data)) { |
| 1308 |
flattenFormData(formData, `${key}[${name}]`, value); |
| 1309 |
} |
| 1310 |
} else if (data !== void 0) { |
| 1311 |
formData.append(key, String(data)); |
| 1312 |
} |
| 1313 |
} |
| 1314 |
|
| 1315 |
// packages/media-utils/build-module/utils/transform-attachment.mjs |
| 1316 |
function transformAttachment(attachment) { |
| 1317 |
const { alt_text, source_url, ...savedMediaProps } = attachment; |
| 1318 |
return { |
| 1319 |
...savedMediaProps, |
| 1320 |
alt: attachment.alt_text, |
| 1321 |
caption: attachment.caption?.raw ?? "", |
| 1322 |
title: attachment.title.raw, |
| 1323 |
url: attachment.source_url, |
| 1324 |
poster: attachment._embedded?.["wp:featuredmedia"]?.[0]?.source_url || void 0 |
| 1325 |
}; |
| 1326 |
} |
| 1327 |
|
| 1328 |
// packages/media-utils/build-module/utils/upload-to-server.mjs |
| 1329 |
async function uploadToServer(file, additionalData = {}, signal) { |
| 1330 |
const data = new FormData(); |
| 1331 |
data.append("file", file, file.name || file.type.replace("/", ".")); |
| 1332 |
for (const [key, value] of Object.entries(additionalData)) { |
| 1333 |
flattenFormData( |
| 1334 |
data, |
| 1335 |
key, |
| 1336 |
value |
| 1337 |
); |
| 1338 |
} |
| 1339 |
return transformAttachment( |
| 1340 |
await (0, import_api_fetch.default)({ |
| 1341 |
// This allows the video block to directly get a video's poster image. |
| 1342 |
path: "/wp/v2/media?_embed=wp:featuredmedia", |
| 1343 |
body: data, |
| 1344 |
method: "POST", |
| 1345 |
signal |
| 1346 |
}) |
| 1347 |
); |
| 1348 |
} |
| 1349 |
|
| 1350 |
// packages/media-utils/build-module/utils/validate-mime-type.mjs |
| 1351 |
var import_i18n2 = __toESM(require_i18n(), 1); |
| 1352 |
|
| 1353 |
// packages/media-utils/build-module/utils/upload-error.mjs |
| 1354 |
var UploadError = class extends Error { |
| 1355 |
code; |
| 1356 |
file; |
| 1357 |
constructor({ code, message: message2, file, cause }) { |
| 1358 |
super(message2, { cause }); |
| 1359 |
Object.setPrototypeOf(this, new.target.prototype); |
| 1360 |
this.code = code; |
| 1361 |
this.file = file; |
| 1362 |
} |
| 1363 |
}; |
| 1364 |
|
| 1365 |
// packages/media-utils/build-module/utils/validate-mime-type.mjs |
| 1366 |
function validateMimeType(file, allowedTypes) { |
| 1367 |
if (!allowedTypes || allowedTypes.includes("*")) { |
| 1368 |
return; |
| 1369 |
} |
| 1370 |
const isAllowedType = allowedTypes.some((allowedType) => { |
| 1371 |
if (allowedType.includes("/")) { |
| 1372 |
return allowedType === file.type; |
| 1373 |
} |
| 1374 |
return file.type.startsWith(`${allowedType}/`); |
| 1375 |
}); |
| 1376 |
if (file.type && !isAllowedType) { |
| 1377 |
throw new UploadError({ |
| 1378 |
code: "MIME_TYPE_NOT_SUPPORTED", |
| 1379 |
message: (0, import_i18n2.sprintf)( |
| 1380 |
// translators: %s: file name. |
| 1381 |
(0, import_i18n2.__)("%s: Sorry, this file type is not supported here."), |
| 1382 |
file.name |
| 1383 |
), |
| 1384 |
file |
| 1385 |
}); |
| 1386 |
} |
| 1387 |
} |
| 1388 |
|
| 1389 |
// packages/media-utils/build-module/utils/validate-mime-type-for-user.mjs |
| 1390 |
var import_i18n3 = __toESM(require_i18n(), 1); |
| 1391 |
|
| 1392 |
// packages/media-utils/build-module/utils/get-mime-types-array.mjs |
| 1393 |
function getMimeTypesArray(wpMimeTypesObject) { |
| 1394 |
if (!wpMimeTypesObject) { |
| 1395 |
return null; |
| 1396 |
} |
| 1397 |
return Object.entries(wpMimeTypesObject).flatMap( |
| 1398 |
([extensionsString, mime]) => { |
| 1399 |
const [type] = mime.split("/"); |
| 1400 |
const extensions = extensionsString.split("|"); |
| 1401 |
return [ |
| 1402 |
mime, |
| 1403 |
...extensions.map( |
| 1404 |
(extension) => `${type}/${extension}` |
| 1405 |
) |
| 1406 |
]; |
| 1407 |
} |
| 1408 |
); |
| 1409 |
} |
| 1410 |
|
| 1411 |
// packages/media-utils/build-module/utils/validate-mime-type-for-user.mjs |
| 1412 |
function validateMimeTypeForUser(file, wpAllowedMimeTypes) { |
| 1413 |
const allowedMimeTypesForUser = getMimeTypesArray(wpAllowedMimeTypes); |
| 1414 |
if (!allowedMimeTypesForUser) { |
| 1415 |
return; |
| 1416 |
} |
| 1417 |
const isAllowedMimeTypeForUser = allowedMimeTypesForUser.includes( |
| 1418 |
file.type |
| 1419 |
); |
| 1420 |
if (file.type && !isAllowedMimeTypeForUser) { |
| 1421 |
throw new UploadError({ |
| 1422 |
code: "MIME_TYPE_NOT_ALLOWED_FOR_USER", |
| 1423 |
message: (0, import_i18n3.sprintf)( |
| 1424 |
// translators: %s: file name. |
| 1425 |
(0, import_i18n3.__)( |
| 1426 |
"%s: Sorry, you are not allowed to upload this file type." |
| 1427 |
), |
| 1428 |
file.name |
| 1429 |
), |
| 1430 |
file |
| 1431 |
}); |
| 1432 |
} |
| 1433 |
} |
| 1434 |
|
| 1435 |
// packages/media-utils/build-module/utils/validate-file-size.mjs |
| 1436 |
var import_i18n4 = __toESM(require_i18n(), 1); |
| 1437 |
function validateFileSize(file, maxUploadFileSize) { |
| 1438 |
if (file.size <= 0) { |
| 1439 |
throw new UploadError({ |
| 1440 |
code: "EMPTY_FILE", |
| 1441 |
message: (0, import_i18n4.sprintf)( |
| 1442 |
// translators: %s: file name. |
| 1443 |
(0, import_i18n4.__)("%s: This file is empty."), |
| 1444 |
file.name |
| 1445 |
), |
| 1446 |
file |
| 1447 |
}); |
| 1448 |
} |
| 1449 |
if (maxUploadFileSize && file.size > maxUploadFileSize) { |
| 1450 |
throw new UploadError({ |
| 1451 |
code: "SIZE_ABOVE_LIMIT", |
| 1452 |
message: (0, import_i18n4.sprintf)( |
| 1453 |
// translators: %s: file name. |
| 1454 |
(0, import_i18n4.__)( |
| 1455 |
"%s: This file exceeds the maximum upload size for this site." |
| 1456 |
), |
| 1457 |
file.name |
| 1458 |
), |
| 1459 |
file |
| 1460 |
}); |
| 1461 |
} |
| 1462 |
} |
| 1463 |
|
| 1464 |
// packages/media-utils/build-module/utils/upload-media.mjs |
| 1465 |
function uploadMedia({ |
| 1466 |
wpAllowedMimeTypes, |
| 1467 |
allowedTypes, |
| 1468 |
additionalData = {}, |
| 1469 |
filesList, |
| 1470 |
maxUploadFileSize, |
| 1471 |
onError, |
| 1472 |
onFileChange, |
| 1473 |
signal, |
| 1474 |
multiple = true |
| 1475 |
}) { |
| 1476 |
if (!multiple && filesList.length > 1) { |
| 1477 |
onError?.(new Error((0, import_i18n5.__)("Only one file can be used here."))); |
| 1478 |
return; |
| 1479 |
} |
| 1480 |
const validFiles = []; |
| 1481 |
const filesSet = []; |
| 1482 |
const setAndUpdateFiles = (index2, value) => { |
| 1483 |
if (!window.__clientSideMediaProcessing) { |
| 1484 |
if (filesSet[index2]?.url) { |
| 1485 |
(0, import_blob.revokeBlobURL)(filesSet[index2].url); |
| 1486 |
} |
| 1487 |
} |
| 1488 |
filesSet[index2] = value; |
| 1489 |
onFileChange?.( |
| 1490 |
filesSet.filter((attachment) => attachment !== null) |
| 1491 |
); |
| 1492 |
}; |
| 1493 |
for (const mediaFile of filesList) { |
| 1494 |
try { |
| 1495 |
validateMimeTypeForUser(mediaFile, wpAllowedMimeTypes); |
| 1496 |
} catch (error) { |
| 1497 |
onError?.(error); |
| 1498 |
continue; |
| 1499 |
} |
| 1500 |
try { |
| 1501 |
validateMimeType(mediaFile, allowedTypes); |
| 1502 |
} catch (error) { |
| 1503 |
onError?.(error); |
| 1504 |
continue; |
| 1505 |
} |
| 1506 |
try { |
| 1507 |
validateFileSize(mediaFile, maxUploadFileSize); |
| 1508 |
} catch (error) { |
| 1509 |
onError?.(error); |
| 1510 |
continue; |
| 1511 |
} |
| 1512 |
validFiles.push(mediaFile); |
| 1513 |
if (!window.__clientSideMediaProcessing) { |
| 1514 |
filesSet.push({ url: (0, import_blob.createBlobURL)(mediaFile) }); |
| 1515 |
onFileChange?.(filesSet); |
| 1516 |
} |
| 1517 |
} |
| 1518 |
validFiles.map(async (file, index2) => { |
| 1519 |
try { |
| 1520 |
const attachment = await uploadToServer( |
| 1521 |
file, |
| 1522 |
additionalData, |
| 1523 |
signal |
| 1524 |
); |
| 1525 |
setAndUpdateFiles(index2, attachment); |
| 1526 |
} catch (error) { |
| 1527 |
setAndUpdateFiles(index2, null); |
| 1528 |
let message2; |
| 1529 |
if (typeof error === "object" && error !== null && "message" in error) { |
| 1530 |
message2 = typeof error.message === "string" ? error.message : String(error.message); |
| 1531 |
} else { |
| 1532 |
message2 = (0, import_i18n5.sprintf)( |
| 1533 |
// translators: %s: file name |
| 1534 |
(0, import_i18n5.__)("Error while uploading file %s to the media library."), |
| 1535 |
file.name |
| 1536 |
); |
| 1537 |
} |
| 1538 |
onError?.( |
| 1539 |
new UploadError({ |
| 1540 |
code: "GENERAL", |
| 1541 |
message: message2, |
| 1542 |
file, |
| 1543 |
cause: error instanceof Error ? error : void 0 |
| 1544 |
}) |
| 1545 |
); |
| 1546 |
} |
| 1547 |
}); |
| 1548 |
} |
| 1549 |
|
| 1550 |
// packages/media-utils/build-module/utils/sideload-media.mjs |
| 1551 |
var import_i18n6 = __toESM(require_i18n(), 1); |
| 1552 |
|
| 1553 |
// packages/media-utils/build-module/utils/sideload-to-server.mjs |
| 1554 |
var import_api_fetch2 = __toESM(require_api_fetch(), 1); |
| 1555 |
async function sideloadToServer(file, attachmentId, additionalData = {}, signal) { |
| 1556 |
const data = new FormData(); |
| 1557 |
data.append("file", file, file.name || file.type.replace("/", ".")); |
| 1558 |
for (const [key, value] of Object.entries(additionalData)) { |
| 1559 |
flattenFormData( |
| 1560 |
data, |
| 1561 |
key, |
| 1562 |
value |
| 1563 |
); |
| 1564 |
} |
| 1565 |
return (0, import_api_fetch2.default)({ |
| 1566 |
path: `/wp/v2/media/${attachmentId}/sideload`, |
| 1567 |
body: data, |
| 1568 |
method: "POST", |
| 1569 |
signal |
| 1570 |
}); |
| 1571 |
} |
| 1572 |
|
| 1573 |
// packages/media-utils/build-module/utils/sideload-media.mjs |
| 1574 |
var noop = () => { |
| 1575 |
}; |
| 1576 |
async function sideloadMedia({ |
| 1577 |
file, |
| 1578 |
attachmentId, |
| 1579 |
additionalData = {}, |
| 1580 |
signal, |
| 1581 |
onSuccess, |
| 1582 |
onError = noop |
| 1583 |
}) { |
| 1584 |
try { |
| 1585 |
const subSizeData = await sideloadToServer( |
| 1586 |
file, |
| 1587 |
attachmentId, |
| 1588 |
additionalData, |
| 1589 |
signal |
| 1590 |
); |
| 1591 |
onSuccess?.(subSizeData); |
| 1592 |
} catch (error) { |
| 1593 |
let message2; |
| 1594 |
if (error instanceof Error) { |
| 1595 |
message2 = error.message; |
| 1596 |
} else { |
| 1597 |
message2 = (0, import_i18n6.sprintf)( |
| 1598 |
// translators: %s: file name |
| 1599 |
(0, import_i18n6.__)("Error while sideloading file %s to the server."), |
| 1600 |
file.name |
| 1601 |
); |
| 1602 |
} |
| 1603 |
onError( |
| 1604 |
new UploadError({ |
| 1605 |
code: "GENERAL", |
| 1606 |
message: message2, |
| 1607 |
file, |
| 1608 |
cause: error instanceof Error ? error : void 0 |
| 1609 |
}) |
| 1610 |
); |
| 1611 |
} |
| 1612 |
} |
| 1613 |
|
| 1614 |
// node_modules/clsx/dist/clsx.mjs |
| 1615 |
function r(e2) { |
| 1616 |
var t2, f2, n2 = ""; |
| 1617 |
if ("string" == typeof e2 || "number" == typeof e2) n2 += e2; |
| 1618 |
else if ("object" == typeof e2) if (Array.isArray(e2)) { |
| 1619 |
var o2 = e2.length; |
| 1620 |
for (t2 = 0; t2 < o2; t2++) e2[t2] && (f2 = r(e2[t2])) && (n2 && (n2 += " "), n2 += f2); |
| 1621 |
} else for (f2 in e2) e2[f2] && (n2 && (n2 += " "), n2 += f2); |
| 1622 |
return n2; |
| 1623 |
} |
| 1624 |
function clsx() { |
| 1625 |
for (var e2, t2, f2 = 0, n2 = "", o2 = arguments.length; f2 < o2; f2++) (e2 = arguments[f2]) && (t2 = r(e2)) && (n2 && (n2 += " "), n2 += t2); |
| 1626 |
return n2; |
| 1627 |
} |
| 1628 |
var clsx_default = clsx; |
| 1629 |
|
| 1630 |
// packages/media-utils/build-module/components/media-upload-modal/index.mjs |
| 1631 |
var import_element83 = __toESM(require_element(), 1); |
| 1632 |
var import_i18n67 = __toESM(require_i18n(), 1); |
| 1633 |
var import_core_data6 = __toESM(require_core_data(), 1); |
| 1634 |
var import_data13 = __toESM(require_data(), 1); |
| 1635 |
var import_components53 = __toESM(require_components(), 1); |
| 1636 |
|
| 1637 |
// packages/icons/build-module/library/arrow-down.mjs |
| 1638 |
var import_primitives = __toESM(require_primitives(), 1); |
| 1639 |
var import_jsx_runtime = __toESM(require_jsx_runtime(), 1); |
| 1640 |
var arrow_down_default = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_primitives.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_primitives.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" }) }); |
| 1641 |
|
| 1642 |
// packages/icons/build-module/library/arrow-left.mjs |
| 1643 |
var import_primitives2 = __toESM(require_primitives(), 1); |
| 1644 |
var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1); |
| 1645 |
var arrow_left_default = /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_primitives2.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_primitives2.Path, { d: "M20 11.2H6.8l3.7-3.7-1-1L3.9 12l5.6 5.5 1-1-3.7-3.7H20z" }) }); |
| 1646 |
|
| 1647 |
// packages/icons/build-module/library/arrow-right.mjs |
| 1648 |
var import_primitives3 = __toESM(require_primitives(), 1); |
| 1649 |
var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1); |
| 1650 |
var arrow_right_default = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_primitives3.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_primitives3.Path, { d: "m14.5 6.5-1 1 3.7 3.7H4v1.6h13.2l-3.7 3.7 1 1 5.6-5.5z" }) }); |
| 1651 |
|
| 1652 |
// packages/icons/build-module/library/arrow-up.mjs |
| 1653 |
var import_primitives4 = __toESM(require_primitives(), 1); |
| 1654 |
var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1); |
| 1655 |
var arrow_up_default = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_primitives4.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_primitives4.Path, { d: "M12 3.9 6.5 9.5l1 1 3.8-3.7V20h1.5V6.8l3.7 3.7 1-1z" }) }); |
| 1656 |
|
| 1657 |
// packages/icons/build-module/library/audio.mjs |
| 1658 |
var import_primitives5 = __toESM(require_primitives(), 1); |
| 1659 |
var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1); |
| 1660 |
var audio_default = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_primitives5.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_primitives5.Path, { d: "M17.7 4.3c-1.2 0-2.8 0-3.8 1-.6.6-.9 1.5-.9 2.6V14c-.6-.6-1.5-1-2.5-1C8.6 13 7 14.6 7 16.5S8.6 20 10.5 20c1.5 0 2.8-1 3.3-2.3.5-.8.7-1.8.7-2.5V7.9c0-.7.2-1.2.5-1.6.6-.6 1.8-.6 2.8-.6h.3V4.3h-.4z" }) }); |
| 1661 |
|
| 1662 |
// packages/icons/build-module/library/block-table.mjs |
| 1663 |
var import_primitives6 = __toESM(require_primitives(), 1); |
| 1664 |
var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1); |
| 1665 |
var block_table_default = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_primitives6.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime6.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" }) }); |
| 1666 |
|
| 1667 |
// packages/icons/build-module/library/category.mjs |
| 1668 |
var import_primitives7 = __toESM(require_primitives(), 1); |
| 1669 |
var import_jsx_runtime7 = __toESM(require_jsx_runtime(), 1); |
| 1670 |
var category_default = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_primitives7.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime7.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" }) }); |
| 1671 |
|
| 1672 |
// packages/icons/build-module/library/check.mjs |
| 1673 |
var import_primitives8 = __toESM(require_primitives(), 1); |
| 1674 |
var import_jsx_runtime8 = __toESM(require_jsx_runtime(), 1); |
| 1675 |
var check_default = /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_primitives8.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime8.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" }) }); |
| 1676 |
|
| 1677 |
// packages/icons/build-module/library/chevron-down.mjs |
| 1678 |
var import_primitives9 = __toESM(require_primitives(), 1); |
| 1679 |
var import_jsx_runtime9 = __toESM(require_jsx_runtime(), 1); |
| 1680 |
var chevron_down_default = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_primitives9.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_primitives9.Path, { d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z" }) }); |
| 1681 |
|
| 1682 |
// packages/icons/build-module/library/close-small.mjs |
| 1683 |
var import_primitives10 = __toESM(require_primitives(), 1); |
| 1684 |
var import_jsx_runtime10 = __toESM(require_jsx_runtime(), 1); |
| 1685 |
var close_small_default = /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_primitives10.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime10.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" }) }); |
| 1686 |
|
| 1687 |
// packages/icons/build-module/library/cog.mjs |
| 1688 |
var import_primitives11 = __toESM(require_primitives(), 1); |
| 1689 |
var import_jsx_runtime11 = __toESM(require_jsx_runtime(), 1); |
| 1690 |
var cog_default = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_primitives11.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime11.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" }) }); |
| 1691 |
|
| 1692 |
// packages/icons/build-module/library/comment-author-avatar.mjs |
| 1693 |
var import_primitives12 = __toESM(require_primitives(), 1); |
| 1694 |
var import_jsx_runtime12 = __toESM(require_jsx_runtime(), 1); |
| 1695 |
var comment_author_avatar_default = /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_primitives12.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_primitives12.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M7.25 16.437a6.5 6.5 0 1 1 9.5 0V16A2.75 2.75 0 0 0 14 13.25h-4A2.75 2.75 0 0 0 7.25 16v.437Zm1.5 1.193a6.47 6.47 0 0 0 3.25.87 6.47 6.47 0 0 0 3.25-.87V16c0-.69-.56-1.25-1.25-1.25h-4c-.69 0-1.25.56-1.25 1.25v1.63ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm10-2a2 2 0 1 1-4 0 2 2 0 0 1 4 0Z" }) }); |
| 1696 |
|
| 1697 |
// packages/icons/build-module/library/envelope.mjs |
| 1698 |
var import_primitives13 = __toESM(require_primitives(), 1); |
| 1699 |
var import_jsx_runtime13 = __toESM(require_jsx_runtime(), 1); |
| 1700 |
var envelope_default = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_primitives13.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_primitives13.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" }) }); |
| 1701 |
|
| 1702 |
// packages/icons/build-module/library/error.mjs |
| 1703 |
var import_primitives14 = __toESM(require_primitives(), 1); |
| 1704 |
var import_jsx_runtime14 = __toESM(require_jsx_runtime(), 1); |
| 1705 |
var error_default = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_primitives14.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_primitives14.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" }) }); |
| 1706 |
|
| 1707 |
// packages/icons/build-module/library/file.mjs |
| 1708 |
var import_primitives15 = __toESM(require_primitives(), 1); |
| 1709 |
var import_jsx_runtime15 = __toESM(require_jsx_runtime(), 1); |
| 1710 |
var file_default = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_primitives15.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_primitives15.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M12.848 8a1 1 0 0 1-.914-.594l-.723-1.63a.5.5 0 0 0-.447-.276H5a.5.5 0 0 0-.5.5v11.5a.5.5 0 0 0 .5.5h14a.5.5 0 0 0 .5-.5v-9A.5.5 0 0 0 19 8h-6.152Zm.612-1.5a.5.5 0 0 1-.462-.31l-.445-1.084A2 2 0 0 0 10.763 4H5a2 2 0 0 0-2 2v11.5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2h-5.54Z" }) }); |
| 1711 |
|
| 1712 |
// packages/icons/build-module/library/format-list-bullets-rtl.mjs |
| 1713 |
var import_primitives16 = __toESM(require_primitives(), 1); |
| 1714 |
var import_jsx_runtime16 = __toESM(require_jsx_runtime(), 1); |
| 1715 |
var format_list_bullets_rtl_default = /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_primitives16.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_primitives16.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" }) }); |
| 1716 |
|
| 1717 |
// packages/icons/build-module/library/format-list-bullets.mjs |
| 1718 |
var import_primitives17 = __toESM(require_primitives(), 1); |
| 1719 |
var import_jsx_runtime17 = __toESM(require_jsx_runtime(), 1); |
| 1720 |
var format_list_bullets_default = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_primitives17.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_primitives17.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" }) }); |
| 1721 |
|
| 1722 |
// packages/icons/build-module/library/funnel.mjs |
| 1723 |
var import_primitives18 = __toESM(require_primitives(), 1); |
| 1724 |
var import_jsx_runtime18 = __toESM(require_jsx_runtime(), 1); |
| 1725 |
var funnel_default = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_primitives18.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_primitives18.Path, { d: "M10 17.5H14V16H10V17.5ZM6 6V7.5H18V6H6ZM8 12.5H16V11H8V12.5Z" }) }); |
| 1726 |
|
| 1727 |
// packages/icons/build-module/library/image.mjs |
| 1728 |
var import_primitives19 = __toESM(require_primitives(), 1); |
| 1729 |
var import_jsx_runtime19 = __toESM(require_jsx_runtime(), 1); |
| 1730 |
var image_default = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_primitives19.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_primitives19.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.5v8.4l-3-2.9c-.3-.3-.8-.3-1 0L11.9 14 9 12c-.3-.2-.6-.2-.8 0l-3.6 2.6V5c-.1-.3.1-.5.4-.5zm14 15H5c-.3 0-.5-.2-.5-.5v-2.4l4.1-3 3 1.9c.3.2.7.2.9-.1L16 12l3.5 3.4V19c0 .3-.2.5-.5.5z" }) }); |
| 1731 |
|
| 1732 |
// packages/icons/build-module/library/link.mjs |
| 1733 |
var import_primitives20 = __toESM(require_primitives(), 1); |
| 1734 |
var import_jsx_runtime20 = __toESM(require_jsx_runtime(), 1); |
| 1735 |
var link_default = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_primitives20.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_primitives20.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" }) }); |
| 1736 |
|
| 1737 |
// packages/icons/build-module/library/mobile.mjs |
| 1738 |
var import_primitives21 = __toESM(require_primitives(), 1); |
| 1739 |
var import_jsx_runtime21 = __toESM(require_jsx_runtime(), 1); |
| 1740 |
var mobile_default = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_primitives21.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_primitives21.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" }) }); |
| 1741 |
|
| 1742 |
// packages/icons/build-module/library/more-vertical.mjs |
| 1743 |
var import_primitives22 = __toESM(require_primitives(), 1); |
| 1744 |
var import_jsx_runtime22 = __toESM(require_jsx_runtime(), 1); |
| 1745 |
var more_vertical_default = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_primitives22.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_primitives22.Path, { d: "M13 19h-2v-2h2v2zm0-6h-2v-2h2v2zm0-6h-2V5h2v2z" }) }); |
| 1746 |
|
| 1747 |
// packages/icons/build-module/library/next.mjs |
| 1748 |
var import_primitives23 = __toESM(require_primitives(), 1); |
| 1749 |
var import_jsx_runtime23 = __toESM(require_jsx_runtime(), 1); |
| 1750 |
var next_default = /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_primitives23.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_primitives23.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" }) }); |
| 1751 |
|
| 1752 |
// packages/icons/build-module/library/previous.mjs |
| 1753 |
var import_primitives24 = __toESM(require_primitives(), 1); |
| 1754 |
var import_jsx_runtime24 = __toESM(require_jsx_runtime(), 1); |
| 1755 |
var previous_default = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_primitives24.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_primitives24.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" }) }); |
| 1756 |
|
| 1757 |
// packages/icons/build-module/library/scheduled.mjs |
| 1758 |
var import_primitives25 = __toESM(require_primitives(), 1); |
| 1759 |
var import_jsx_runtime25 = __toESM(require_jsx_runtime(), 1); |
| 1760 |
var scheduled_default = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_primitives25.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_primitives25.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" }) }); |
| 1761 |
|
| 1762 |
// packages/icons/build-module/library/search.mjs |
| 1763 |
var import_primitives26 = __toESM(require_primitives(), 1); |
| 1764 |
var import_jsx_runtime26 = __toESM(require_jsx_runtime(), 1); |
| 1765 |
var search_default = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_primitives26.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_primitives26.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" }) }); |
| 1766 |
|
| 1767 |
// packages/icons/build-module/library/seen.mjs |
| 1768 |
var import_primitives27 = __toESM(require_primitives(), 1); |
| 1769 |
var import_jsx_runtime27 = __toESM(require_jsx_runtime(), 1); |
| 1770 |
var seen_default = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_primitives27.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_primitives27.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" }) }); |
| 1771 |
|
| 1772 |
// packages/icons/build-module/library/unseen.mjs |
| 1773 |
var import_primitives28 = __toESM(require_primitives(), 1); |
| 1774 |
var import_jsx_runtime28 = __toESM(require_jsx_runtime(), 1); |
| 1775 |
var unseen_default = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_primitives28.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_primitives28.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" }) }); |
| 1776 |
|
| 1777 |
// packages/icons/build-module/library/upload.mjs |
| 1778 |
var import_primitives29 = __toESM(require_primitives(), 1); |
| 1779 |
var import_jsx_runtime29 = __toESM(require_jsx_runtime(), 1); |
| 1780 |
var upload_default = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_primitives29.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_primitives29.Path, { d: "M18.5 15v3.5H13V6.7l4.5 4.1 1-1.1-6.2-5.8-5.8 5.8 1 1.1 4-4v11.7h-6V15H4v5h16v-5z" }) }); |
| 1781 |
|
| 1782 |
// packages/icons/build-module/library/video.mjs |
| 1783 |
var import_primitives30 = __toESM(require_primitives(), 1); |
| 1784 |
var import_jsx_runtime30 = __toESM(require_jsx_runtime(), 1); |
| 1785 |
var video_default = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_primitives30.SVG, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_primitives30.Path, { d: "M18.7 3H5.3C4 3 3 4 3 5.3v13.4C3 20 4 21 5.3 21h13.4c1.3 0 2.3-1 2.3-2.3V5.3C21 4 20 3 18.7 3zm.8 15.7c0 .4-.4.8-.8.8H5.3c-.4 0-.8-.4-.8-.8V5.3c0-.4.4-.8.8-.8h13.4c.4 0 .8.4.8.8v13.4zM10 15l5-3-5-3v6z" }) }); |
| 1786 |
|
| 1787 |
// node_modules/@base-ui/utils/esm/safeReact.js |
| 1788 |
var React = __toESM(require_react(), 1); |
| 1789 |
var SafeReact = { |
| 1790 |
...React |
| 1791 |
}; |
| 1792 |
|
| 1793 |
// node_modules/@base-ui/utils/esm/useRefWithInit.js |
| 1794 |
var React2 = __toESM(require_react(), 1); |
| 1795 |
var UNINITIALIZED = {}; |
| 1796 |
function useRefWithInit(init2, initArg) { |
| 1797 |
const ref = React2.useRef(UNINITIALIZED); |
| 1798 |
if (ref.current === UNINITIALIZED) { |
| 1799 |
ref.current = init2(initArg); |
| 1800 |
} |
| 1801 |
return ref; |
| 1802 |
} |
| 1803 |
|
| 1804 |
// node_modules/@base-ui/utils/esm/useStableCallback.js |
| 1805 |
var useInsertionEffect = SafeReact.useInsertionEffect; |
| 1806 |
var useSafeInsertionEffect = ( |
| 1807 |
// React 17 doesn't have useInsertionEffect. |
| 1808 |
useInsertionEffect && // Preact replaces useInsertionEffect with useLayoutEffect and fires too late. |
| 1809 |
useInsertionEffect !== SafeReact.useLayoutEffect ? useInsertionEffect : (fn) => fn() |
| 1810 |
); |
| 1811 |
function useStableCallback(callback) { |
| 1812 |
const stable = useRefWithInit(createStableCallback).current; |
| 1813 |
stable.next = callback; |
| 1814 |
useSafeInsertionEffect(stable.effect); |
| 1815 |
return stable.trampoline; |
| 1816 |
} |
| 1817 |
function createStableCallback() { |
| 1818 |
const stable = { |
| 1819 |
next: void 0, |
| 1820 |
callback: assertNotCalled, |
| 1821 |
trampoline: (...args) => stable.callback?.(...args), |
| 1822 |
effect: () => { |
| 1823 |
stable.callback = stable.next; |
| 1824 |
} |
| 1825 |
}; |
| 1826 |
return stable; |
| 1827 |
} |
| 1828 |
function assertNotCalled() { |
| 1829 |
if (true) { |
| 1830 |
throw ( |
| 1831 |
/* minify-error-disabled */ |
| 1832 |
new Error("Base UI: Cannot call an event handler while rendering.") |
| 1833 |
); |
| 1834 |
} |
| 1835 |
} |
| 1836 |
|
| 1837 |
// node_modules/@base-ui/utils/esm/useIsoLayoutEffect.js |
| 1838 |
var React3 = __toESM(require_react(), 1); |
| 1839 |
var noop2 = () => { |
| 1840 |
}; |
| 1841 |
var useIsoLayoutEffect = typeof document !== "undefined" ? React3.useLayoutEffect : noop2; |
| 1842 |
|
| 1843 |
// node_modules/@base-ui/utils/esm/warn.js |
| 1844 |
var set; |
| 1845 |
if (true) { |
| 1846 |
set = /* @__PURE__ */ new Set(); |
| 1847 |
} |
| 1848 |
function warn(...messages) { |
| 1849 |
if (true) { |
| 1850 |
const messageKey = messages.join(" "); |
| 1851 |
if (!set.has(messageKey)) { |
| 1852 |
set.add(messageKey); |
| 1853 |
console.warn(`Base UI: ${messageKey}`); |
| 1854 |
} |
| 1855 |
} |
| 1856 |
} |
| 1857 |
|
| 1858 |
// node_modules/@base-ui/react/esm/internals/direction-context/DirectionContext.js |
| 1859 |
var React4 = __toESM(require_react(), 1); |
| 1860 |
var DirectionContext = /* @__PURE__ */ React4.createContext(void 0); |
| 1861 |
if (true) DirectionContext.displayName = "DirectionContext"; |
| 1862 |
function useDirection() { |
| 1863 |
const context = React4.useContext(DirectionContext); |
| 1864 |
return context?.direction ?? "ltr"; |
| 1865 |
} |
| 1866 |
|
| 1867 |
// node_modules/@base-ui/react/esm/internals/useRenderElement.js |
| 1868 |
var React7 = __toESM(require_react(), 1); |
| 1869 |
|
| 1870 |
// node_modules/@base-ui/utils/esm/useMergedRefs.js |
| 1871 |
function useMergedRefs(a2, b2, c2, d2) { |
| 1872 |
const forkRef = useRefWithInit(createForkRef).current; |
| 1873 |
if (didChange(forkRef, a2, b2, c2, d2)) { |
| 1874 |
update(forkRef, [a2, b2, c2, d2]); |
| 1875 |
} |
| 1876 |
return forkRef.callback; |
| 1877 |
} |
| 1878 |
function useMergedRefsN(refs) { |
| 1879 |
const forkRef = useRefWithInit(createForkRef).current; |
| 1880 |
if (didChangeN(forkRef, refs)) { |
| 1881 |
update(forkRef, refs); |
| 1882 |
} |
| 1883 |
return forkRef.callback; |
| 1884 |
} |
| 1885 |
function createForkRef() { |
| 1886 |
return { |
| 1887 |
callback: null, |
| 1888 |
cleanup: null, |
| 1889 |
refs: [] |
| 1890 |
}; |
| 1891 |
} |
| 1892 |
function didChange(forkRef, a2, b2, c2, d2) { |
| 1893 |
return forkRef.refs[0] !== a2 || forkRef.refs[1] !== b2 || forkRef.refs[2] !== c2 || forkRef.refs[3] !== d2; |
| 1894 |
} |
| 1895 |
function didChangeN(forkRef, newRefs) { |
| 1896 |
return forkRef.refs.length !== newRefs.length || forkRef.refs.some((ref, index2) => ref !== newRefs[index2]); |
| 1897 |
} |
| 1898 |
function update(forkRef, refs) { |
| 1899 |
forkRef.refs = refs; |
| 1900 |
if (refs.every((ref) => ref == null)) { |
| 1901 |
forkRef.callback = null; |
| 1902 |
return; |
| 1903 |
} |
| 1904 |
forkRef.callback = (instance) => { |
| 1905 |
if (forkRef.cleanup) { |
| 1906 |
forkRef.cleanup(); |
| 1907 |
forkRef.cleanup = null; |
| 1908 |
} |
| 1909 |
if (instance != null) { |
| 1910 |
const cleanupCallbacks = Array(refs.length).fill(null); |
| 1911 |
for (let i2 = 0; i2 < refs.length; i2 += 1) { |
| 1912 |
const ref = refs[i2]; |
| 1913 |
if (ref == null) { |
| 1914 |
continue; |
| 1915 |
} |
| 1916 |
switch (typeof ref) { |
| 1917 |
case "function": { |
| 1918 |
const refCleanup = ref(instance); |
| 1919 |
if (typeof refCleanup === "function") { |
| 1920 |
cleanupCallbacks[i2] = refCleanup; |
| 1921 |
} |
| 1922 |
break; |
| 1923 |
} |
| 1924 |
case "object": { |
| 1925 |
ref.current = instance; |
| 1926 |
break; |
| 1927 |
} |
| 1928 |
default: |
| 1929 |
} |
| 1930 |
} |
| 1931 |
forkRef.cleanup = () => { |
| 1932 |
for (let i2 = 0; i2 < refs.length; i2 += 1) { |
| 1933 |
const ref = refs[i2]; |
| 1934 |
if (ref == null) { |
| 1935 |
continue; |
| 1936 |
} |
| 1937 |
switch (typeof ref) { |
| 1938 |
case "function": { |
| 1939 |
const cleanupCallback = cleanupCallbacks[i2]; |
| 1940 |
if (typeof cleanupCallback === "function") { |
| 1941 |
cleanupCallback(); |
| 1942 |
} else { |
| 1943 |
ref(null); |
| 1944 |
} |
| 1945 |
break; |
| 1946 |
} |
| 1947 |
case "object": { |
| 1948 |
ref.current = null; |
| 1949 |
break; |
| 1950 |
} |
| 1951 |
default: |
| 1952 |
} |
| 1953 |
} |
| 1954 |
}; |
| 1955 |
} |
| 1956 |
}; |
| 1957 |
} |
| 1958 |
|
| 1959 |
// node_modules/@base-ui/utils/esm/getReactElementRef.js |
| 1960 |
var React6 = __toESM(require_react(), 1); |
| 1961 |
|
| 1962 |
// node_modules/@base-ui/utils/esm/reactVersion.js |
| 1963 |
var React5 = __toESM(require_react(), 1); |
| 1964 |
var majorVersion = parseInt(React5.version, 10); |
| 1965 |
function isReactVersionAtLeast(reactVersionToCheck) { |
| 1966 |
return majorVersion >= reactVersionToCheck; |
| 1967 |
} |
| 1968 |
|
| 1969 |
// node_modules/@base-ui/utils/esm/getReactElementRef.js |
| 1970 |
function getReactElementRef(element) { |
| 1971 |
if (!/* @__PURE__ */ React6.isValidElement(element)) { |
| 1972 |
return null; |
| 1973 |
} |
| 1974 |
const reactElement = element; |
| 1975 |
const propsWithRef = reactElement.props; |
| 1976 |
return (isReactVersionAtLeast(19) ? propsWithRef?.ref : reactElement.ref) ?? null; |
| 1977 |
} |
| 1978 |
|
| 1979 |
// node_modules/@base-ui/utils/esm/mergeObjects.js |
| 1980 |
function mergeObjects(a2, b2) { |
| 1981 |
if (a2 && !b2) { |
| 1982 |
return a2; |
| 1983 |
} |
| 1984 |
if (!a2 && b2) { |
| 1985 |
return b2; |
| 1986 |
} |
| 1987 |
if (a2 || b2) { |
| 1988 |
return { |
| 1989 |
...a2, |
| 1990 |
...b2 |
| 1991 |
}; |
| 1992 |
} |
| 1993 |
return void 0; |
| 1994 |
} |
| 1995 |
|
| 1996 |
// node_modules/@base-ui/utils/esm/empty.js |
| 1997 |
function NOOP() { |
| 1998 |
} |
| 1999 |
var EMPTY_ARRAY = Object.freeze([]); |
| 2000 |
var EMPTY_OBJECT = Object.freeze({}); |
| 2001 |
|
| 2002 |
// node_modules/@base-ui/react/esm/internals/getStateAttributesProps.js |
| 2003 |
function getStateAttributesProps(state, customMapping) { |
| 2004 |
const props = {}; |
| 2005 |
for (const key in state) { |
| 2006 |
const value = state[key]; |
| 2007 |
if (customMapping?.hasOwnProperty(key)) { |
| 2008 |
const customProps = customMapping[key](value); |
| 2009 |
if (customProps != null) { |
| 2010 |
Object.assign(props, customProps); |
| 2011 |
} |
| 2012 |
continue; |
| 2013 |
} |
| 2014 |
if (value === true) { |
| 2015 |
props[`data-${key.toLowerCase()}`] = ""; |
| 2016 |
} else if (value) { |
| 2017 |
props[`data-${key.toLowerCase()}`] = value.toString(); |
| 2018 |
} |
| 2019 |
} |
| 2020 |
return props; |
| 2021 |
} |
| 2022 |
|
| 2023 |
// node_modules/@base-ui/react/esm/utils/resolveClassName.js |
| 2024 |
function resolveClassName(className, state) { |
| 2025 |
return typeof className === "function" ? className(state) : className; |
| 2026 |
} |
| 2027 |
|
| 2028 |
// node_modules/@base-ui/react/esm/utils/resolveStyle.js |
| 2029 |
function resolveStyle(style, state) { |
| 2030 |
return typeof style === "function" ? style(state) : style; |
| 2031 |
} |
| 2032 |
|
| 2033 |
// node_modules/@base-ui/react/esm/merge-props/mergeProps.js |
| 2034 |
var EMPTY_PROPS = {}; |
| 2035 |
function mergeProps(a2, b2, c2, d2, e2) { |
| 2036 |
if (!c2 && !d2 && !e2 && !a2) { |
| 2037 |
return createInitialMergedProps(b2); |
| 2038 |
} |
| 2039 |
let merged = createInitialMergedProps(a2); |
| 2040 |
if (b2) { |
| 2041 |
merged = mergeInto(merged, b2); |
| 2042 |
} |
| 2043 |
if (c2) { |
| 2044 |
merged = mergeInto(merged, c2); |
| 2045 |
} |
| 2046 |
if (d2) { |
| 2047 |
merged = mergeInto(merged, d2); |
| 2048 |
} |
| 2049 |
if (e2) { |
| 2050 |
merged = mergeInto(merged, e2); |
| 2051 |
} |
| 2052 |
return merged; |
| 2053 |
} |
| 2054 |
function mergePropsN(props) { |
| 2055 |
if (props.length === 0) { |
| 2056 |
return EMPTY_PROPS; |
| 2057 |
} |
| 2058 |
if (props.length === 1) { |
| 2059 |
return createInitialMergedProps(props[0]); |
| 2060 |
} |
| 2061 |
let merged = createInitialMergedProps(props[0]); |
| 2062 |
for (let i2 = 1; i2 < props.length; i2 += 1) { |
| 2063 |
merged = mergeInto(merged, props[i2]); |
| 2064 |
} |
| 2065 |
return merged; |
| 2066 |
} |
| 2067 |
function createInitialMergedProps(inputProps) { |
| 2068 |
if (isPropsGetter(inputProps)) { |
| 2069 |
return { |
| 2070 |
...resolvePropsGetter(inputProps, EMPTY_PROPS) |
| 2071 |
}; |
| 2072 |
} |
| 2073 |
return copyInitialProps(inputProps); |
| 2074 |
} |
| 2075 |
function mergeInto(merged, inputProps) { |
| 2076 |
if (isPropsGetter(inputProps)) { |
| 2077 |
return resolvePropsGetter(inputProps, merged); |
| 2078 |
} |
| 2079 |
return mutablyMergeInto(merged, inputProps); |
| 2080 |
} |
| 2081 |
function copyInitialProps(inputProps) { |
| 2082 |
const copiedProps = { |
| 2083 |
...inputProps |
| 2084 |
}; |
| 2085 |
for (const propName in copiedProps) { |
| 2086 |
const propValue = copiedProps[propName]; |
| 2087 |
if (isEventHandler(propName, propValue)) { |
| 2088 |
copiedProps[propName] = wrapEventHandler(propValue); |
| 2089 |
} |
| 2090 |
} |
| 2091 |
return copiedProps; |
| 2092 |
} |
| 2093 |
function mutablyMergeInto(mergedProps, externalProps) { |
| 2094 |
if (!externalProps) { |
| 2095 |
return mergedProps; |
| 2096 |
} |
| 2097 |
for (const propName in externalProps) { |
| 2098 |
const externalPropValue = externalProps[propName]; |
| 2099 |
switch (propName) { |
| 2100 |
case "style": { |
| 2101 |
mergedProps[propName] = mergeObjects(mergedProps.style, externalPropValue); |
| 2102 |
break; |
| 2103 |
} |
| 2104 |
case "className": { |
| 2105 |
mergedProps[propName] = mergeClassNames(mergedProps.className, externalPropValue); |
| 2106 |
break; |
| 2107 |
} |
| 2108 |
default: { |
| 2109 |
if (isEventHandler(propName, externalPropValue)) { |
| 2110 |
mergedProps[propName] = mergeEventHandlers(mergedProps[propName], externalPropValue); |
| 2111 |
} else { |
| 2112 |
mergedProps[propName] = externalPropValue; |
| 2113 |
} |
| 2114 |
} |
| 2115 |
} |
| 2116 |
} |
| 2117 |
return mergedProps; |
| 2118 |
} |
| 2119 |
function isEventHandler(key, value) { |
| 2120 |
const code0 = key.charCodeAt(0); |
| 2121 |
const code1 = key.charCodeAt(1); |
| 2122 |
const code2 = key.charCodeAt(2); |
| 2123 |
return code0 === 111 && code1 === 110 && code2 >= 65 && code2 <= 90 && (typeof value === "function" || typeof value === "undefined"); |
| 2124 |
} |
| 2125 |
function isPropsGetter(inputProps) { |
| 2126 |
return typeof inputProps === "function"; |
| 2127 |
} |
| 2128 |
function resolvePropsGetter(inputProps, previousProps) { |
| 2129 |
if (isPropsGetter(inputProps)) { |
| 2130 |
return inputProps(previousProps); |
| 2131 |
} |
| 2132 |
return inputProps ?? EMPTY_PROPS; |
| 2133 |
} |
| 2134 |
function mergeEventHandlers(ourHandler, theirHandler) { |
| 2135 |
if (!theirHandler) { |
| 2136 |
return ourHandler; |
| 2137 |
} |
| 2138 |
if (!ourHandler) { |
| 2139 |
return wrapEventHandler(theirHandler); |
| 2140 |
} |
| 2141 |
return (...args) => { |
| 2142 |
const event = args[0]; |
| 2143 |
if (isSyntheticEvent(event)) { |
| 2144 |
const baseUIEvent = event; |
| 2145 |
makeEventPreventable(baseUIEvent); |
| 2146 |
const result2 = theirHandler(...args); |
| 2147 |
if (!baseUIEvent.baseUIHandlerPrevented) { |
| 2148 |
ourHandler?.(...args); |
| 2149 |
} |
| 2150 |
return result2; |
| 2151 |
} |
| 2152 |
const result = theirHandler(...args); |
| 2153 |
ourHandler?.(...args); |
| 2154 |
return result; |
| 2155 |
}; |
| 2156 |
} |
| 2157 |
function wrapEventHandler(handler) { |
| 2158 |
if (!handler) { |
| 2159 |
return handler; |
| 2160 |
} |
| 2161 |
return (...args) => { |
| 2162 |
const event = args[0]; |
| 2163 |
if (isSyntheticEvent(event)) { |
| 2164 |
makeEventPreventable(event); |
| 2165 |
} |
| 2166 |
return handler(...args); |
| 2167 |
}; |
| 2168 |
} |
| 2169 |
function makeEventPreventable(event) { |
| 2170 |
event.preventBaseUIHandler = () => { |
| 2171 |
event.baseUIHandlerPrevented = true; |
| 2172 |
}; |
| 2173 |
return event; |
| 2174 |
} |
| 2175 |
function mergeClassNames(ourClassName, theirClassName) { |
| 2176 |
if (theirClassName) { |
| 2177 |
if (ourClassName) { |
| 2178 |
return theirClassName + " " + ourClassName; |
| 2179 |
} |
| 2180 |
return theirClassName; |
| 2181 |
} |
| 2182 |
return ourClassName; |
| 2183 |
} |
| 2184 |
function isSyntheticEvent(event) { |
| 2185 |
return event != null && typeof event === "object" && "nativeEvent" in event; |
| 2186 |
} |
| 2187 |
|
| 2188 |
// node_modules/@base-ui/react/esm/internals/useRenderElement.js |
| 2189 |
var import_react = __toESM(require_react(), 1); |
| 2190 |
function useRenderElement(element, componentProps, params = {}) { |
| 2191 |
const renderProp = componentProps.render; |
| 2192 |
const outProps = useRenderElementProps(componentProps, params); |
| 2193 |
if (params.enabled === false) { |
| 2194 |
return null; |
| 2195 |
} |
| 2196 |
const state = params.state ?? EMPTY_OBJECT; |
| 2197 |
return evaluateRenderProp(element, renderProp, outProps, state); |
| 2198 |
} |
| 2199 |
function useRenderElementProps(componentProps, params = {}) { |
| 2200 |
const { |
| 2201 |
className: classNameProp, |
| 2202 |
style: styleProp, |
| 2203 |
render: renderProp |
| 2204 |
} = componentProps; |
| 2205 |
const { |
| 2206 |
state = EMPTY_OBJECT, |
| 2207 |
ref, |
| 2208 |
props, |
| 2209 |
stateAttributesMapping: stateAttributesMapping3, |
| 2210 |
enabled = true |
| 2211 |
} = params; |
| 2212 |
const className = enabled ? resolveClassName(classNameProp, state) : void 0; |
| 2213 |
const style = enabled ? resolveStyle(styleProp, state) : void 0; |
| 2214 |
const stateProps = enabled ? getStateAttributesProps(state, stateAttributesMapping3) : EMPTY_OBJECT; |
| 2215 |
const resolvedProps = enabled && props ? resolveRenderFunctionProps(props) : void 0; |
| 2216 |
const outProps = enabled ? mergeObjects(stateProps, resolvedProps) ?? {} : EMPTY_OBJECT; |
| 2217 |
if (typeof document !== "undefined") { |
| 2218 |
if (!enabled) { |
| 2219 |
useMergedRefs(null, null); |
| 2220 |
} else if (Array.isArray(ref)) { |
| 2221 |
outProps.ref = useMergedRefsN([outProps.ref, getReactElementRef(renderProp), ...ref]); |
| 2222 |
} else { |
| 2223 |
outProps.ref = useMergedRefs(outProps.ref, getReactElementRef(renderProp), ref); |
| 2224 |
} |
| 2225 |
} |
| 2226 |
if (!enabled) { |
| 2227 |
return EMPTY_OBJECT; |
| 2228 |
} |
| 2229 |
if (className !== void 0) { |
| 2230 |
outProps.className = mergeClassNames(outProps.className, className); |
| 2231 |
} |
| 2232 |
if (style !== void 0) { |
| 2233 |
outProps.style = mergeObjects(outProps.style, style); |
| 2234 |
} |
| 2235 |
return outProps; |
| 2236 |
} |
| 2237 |
function resolveRenderFunctionProps(props) { |
| 2238 |
if (Array.isArray(props)) { |
| 2239 |
return mergePropsN(props); |
| 2240 |
} |
| 2241 |
return mergeProps(void 0, props); |
| 2242 |
} |
| 2243 |
var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy"); |
| 2244 |
var COMPONENT_IDENTIFIER_PATTERN = /^[A-Z][A-Za-z0-9$]*$/; |
| 2245 |
var LOWERCASE_CHARACTER_PATTERN = /[a-z]/; |
| 2246 |
function evaluateRenderProp(element, render4, props, state) { |
| 2247 |
if (render4) { |
| 2248 |
if (typeof render4 === "function") { |
| 2249 |
if (true) { |
| 2250 |
warnIfRenderPropLooksLikeComponent(render4); |
| 2251 |
} |
| 2252 |
return render4(props, state); |
| 2253 |
} |
| 2254 |
const mergedProps = mergeProps(props, render4.props); |
| 2255 |
mergedProps.ref = props.ref; |
| 2256 |
let newElement = render4; |
| 2257 |
if (newElement?.$$typeof === REACT_LAZY_TYPE) { |
| 2258 |
const children = React7.Children.toArray(render4); |
| 2259 |
newElement = children[0]; |
| 2260 |
} |
| 2261 |
if (true) { |
| 2262 |
if (!/* @__PURE__ */ React7.isValidElement(newElement)) { |
| 2263 |
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")); |
| 2264 |
} |
| 2265 |
} |
| 2266 |
return /* @__PURE__ */ React7.cloneElement(newElement, mergedProps); |
| 2267 |
} |
| 2268 |
if (element) { |
| 2269 |
if (typeof element === "string") { |
| 2270 |
return renderTag(element, props); |
| 2271 |
} |
| 2272 |
} |
| 2273 |
throw new Error(true ? "Base UI: Render element or function are not defined." : formatErrorMessage_default(8)); |
| 2274 |
} |
| 2275 |
function warnIfRenderPropLooksLikeComponent(renderFn) { |
| 2276 |
const functionName = renderFn.name; |
| 2277 |
if (functionName.length === 0) { |
| 2278 |
return; |
| 2279 |
} |
| 2280 |
if (!COMPONENT_IDENTIFIER_PATTERN.test(functionName)) { |
| 2281 |
return; |
| 2282 |
} |
| 2283 |
if (!LOWERCASE_CHARACTER_PATTERN.test(functionName)) { |
| 2284 |
return; |
| 2285 |
} |
| 2286 |
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"); |
| 2287 |
} |
| 2288 |
function renderTag(Tag, props) { |
| 2289 |
if (Tag === "button") { |
| 2290 |
return /* @__PURE__ */ (0, import_react.createElement)("button", { |
| 2291 |
type: "button", |
| 2292 |
...props, |
| 2293 |
key: props.key |
| 2294 |
}); |
| 2295 |
} |
| 2296 |
if (Tag === "img") { |
| 2297 |
return /* @__PURE__ */ (0, import_react.createElement)("img", { |
| 2298 |
alt: "", |
| 2299 |
...props, |
| 2300 |
key: props.key |
| 2301 |
}); |
| 2302 |
} |
| 2303 |
return /* @__PURE__ */ React7.createElement(Tag, props); |
| 2304 |
} |
| 2305 |
|
| 2306 |
// node_modules/@base-ui/react/esm/internals/reason-parts.js |
| 2307 |
var reason_parts_exports = {}; |
| 2308 |
__export(reason_parts_exports, { |
| 2309 |
cancelOpen: () => cancelOpen, |
| 2310 |
chipRemovePress: () => chipRemovePress, |
| 2311 |
clearPress: () => clearPress, |
| 2312 |
closePress: () => closePress, |
| 2313 |
closeWatcher: () => closeWatcher, |
| 2314 |
decrementPress: () => decrementPress, |
| 2315 |
disabled: () => disabled, |
| 2316 |
drag: () => drag, |
| 2317 |
escapeKey: () => escapeKey, |
| 2318 |
focusOut: () => focusOut, |
| 2319 |
imperativeAction: () => imperativeAction, |
| 2320 |
incrementPress: () => incrementPress, |
| 2321 |
initial: () => initial, |
| 2322 |
inputBlur: () => inputBlur, |
| 2323 |
inputChange: () => inputChange, |
| 2324 |
inputClear: () => inputClear, |
| 2325 |
inputPaste: () => inputPaste, |
| 2326 |
inputPress: () => inputPress, |
| 2327 |
itemPress: () => itemPress, |
| 2328 |
keyboard: () => keyboard, |
| 2329 |
linkPress: () => linkPress, |
| 2330 |
listNavigation: () => listNavigation, |
| 2331 |
missing: () => missing, |
| 2332 |
none: () => none, |
| 2333 |
outsidePress: () => outsidePress, |
| 2334 |
pointer: () => pointer, |
| 2335 |
scrub: () => scrub, |
| 2336 |
siblingOpen: () => siblingOpen, |
| 2337 |
swipe: () => swipe, |
| 2338 |
trackPress: () => trackPress, |
| 2339 |
triggerFocus: () => triggerFocus, |
| 2340 |
triggerHover: () => triggerHover, |
| 2341 |
triggerPress: () => triggerPress, |
| 2342 |
wheel: () => wheel, |
| 2343 |
windowResize: () => windowResize |
| 2344 |
}); |
| 2345 |
var none = "none"; |
| 2346 |
var triggerPress = "trigger-press"; |
| 2347 |
var triggerHover = "trigger-hover"; |
| 2348 |
var triggerFocus = "trigger-focus"; |
| 2349 |
var outsidePress = "outside-press"; |
| 2350 |
var itemPress = "item-press"; |
| 2351 |
var closePress = "close-press"; |
| 2352 |
var linkPress = "link-press"; |
| 2353 |
var clearPress = "clear-press"; |
| 2354 |
var chipRemovePress = "chip-remove-press"; |
| 2355 |
var trackPress = "track-press"; |
| 2356 |
var incrementPress = "increment-press"; |
| 2357 |
var decrementPress = "decrement-press"; |
| 2358 |
var inputChange = "input-change"; |
| 2359 |
var inputClear = "input-clear"; |
| 2360 |
var inputBlur = "input-blur"; |
| 2361 |
var inputPaste = "input-paste"; |
| 2362 |
var inputPress = "input-press"; |
| 2363 |
var focusOut = "focus-out"; |
| 2364 |
var escapeKey = "escape-key"; |
| 2365 |
var closeWatcher = "close-watcher"; |
| 2366 |
var listNavigation = "list-navigation"; |
| 2367 |
var keyboard = "keyboard"; |
| 2368 |
var pointer = "pointer"; |
| 2369 |
var drag = "drag"; |
| 2370 |
var wheel = "wheel"; |
| 2371 |
var scrub = "scrub"; |
| 2372 |
var cancelOpen = "cancel-open"; |
| 2373 |
var siblingOpen = "sibling-open"; |
| 2374 |
var disabled = "disabled"; |
| 2375 |
var missing = "missing"; |
| 2376 |
var initial = "initial"; |
| 2377 |
var imperativeAction = "imperative-action"; |
| 2378 |
var swipe = "swipe"; |
| 2379 |
var windowResize = "window-resize"; |
| 2380 |
|
| 2381 |
// node_modules/@base-ui/react/esm/internals/createBaseUIEventDetails.js |
| 2382 |
function createChangeEventDetails(reason, event, trigger, customProperties) { |
| 2383 |
let canceled = false; |
| 2384 |
let allowPropagation = false; |
| 2385 |
const custom = customProperties ?? EMPTY_OBJECT; |
| 2386 |
const details = { |
| 2387 |
reason, |
| 2388 |
event: event ?? new Event("base-ui"), |
| 2389 |
cancel() { |
| 2390 |
canceled = true; |
| 2391 |
}, |
| 2392 |
allowPropagation() { |
| 2393 |
allowPropagation = true; |
| 2394 |
}, |
| 2395 |
get isCanceled() { |
| 2396 |
return canceled; |
| 2397 |
}, |
| 2398 |
get isPropagationAllowed() { |
| 2399 |
return allowPropagation; |
| 2400 |
}, |
| 2401 |
trigger, |
| 2402 |
...custom |
| 2403 |
}; |
| 2404 |
return details; |
| 2405 |
} |
| 2406 |
|
| 2407 |
// node_modules/@base-ui/utils/esm/useId.js |
| 2408 |
var React8 = __toESM(require_react(), 1); |
| 2409 |
var globalId = 0; |
| 2410 |
function useGlobalId(idOverride, prefix = "mui") { |
| 2411 |
const [defaultId, setDefaultId] = React8.useState(idOverride); |
| 2412 |
const id = idOverride || defaultId; |
| 2413 |
React8.useEffect(() => { |
| 2414 |
if (defaultId == null) { |
| 2415 |
globalId += 1; |
| 2416 |
setDefaultId(`${prefix}-${globalId}`); |
| 2417 |
} |
| 2418 |
}, [defaultId, prefix]); |
| 2419 |
return id; |
| 2420 |
} |
| 2421 |
var maybeReactUseId = SafeReact.useId; |
| 2422 |
function useId(idOverride, prefix) { |
| 2423 |
if (maybeReactUseId !== void 0) { |
| 2424 |
const reactId = maybeReactUseId(); |
| 2425 |
return idOverride ?? (prefix ? `${prefix}-${reactId}` : reactId); |
| 2426 |
} |
| 2427 |
return useGlobalId(idOverride, prefix); |
| 2428 |
} |
| 2429 |
|
| 2430 |
// node_modules/@base-ui/react/esm/internals/useBaseUiId.js |
| 2431 |
function useBaseUiId(idOverride) { |
| 2432 |
return useId(idOverride, "base-ui"); |
| 2433 |
} |
| 2434 |
|
| 2435 |
// node_modules/@base-ui/react/esm/internals/useTransitionStatus.js |
| 2436 |
var React10 = __toESM(require_react(), 1); |
| 2437 |
|
| 2438 |
// node_modules/@base-ui/utils/esm/useOnMount.js |
| 2439 |
var React9 = __toESM(require_react(), 1); |
| 2440 |
var EMPTY = []; |
| 2441 |
function useOnMount(fn) { |
| 2442 |
React9.useEffect(fn, EMPTY); |
| 2443 |
} |
| 2444 |
|
| 2445 |
// node_modules/@base-ui/utils/esm/useAnimationFrame.js |
| 2446 |
var EMPTY2 = null; |
| 2447 |
var LAST_RAF = globalThis.requestAnimationFrame; |
| 2448 |
var Scheduler = class { |
| 2449 |
/* This implementation uses an array as a backing data-structure for frame callbacks. |
| 2450 |
* It allows `O(1)` callback cancelling by inserting a `null` in the array, though it |
| 2451 |
* never calls the native `cancelAnimationFrame` if there are no frames left. This can |
| 2452 |
* be much more efficient if there is a call pattern that alterns as |
| 2453 |
* "request-cancel-request-cancel-…". |
| 2454 |
* But in the case of "request-request-…-cancel-cancel-…", it leaves the final animation |
| 2455 |
* frame to run anyway. We turn that frame into a `O(1)` no-op via `callbacksCount`. */ |
| 2456 |
callbacks = []; |
| 2457 |
callbacksCount = 0; |
| 2458 |
nextId = 1; |
| 2459 |
startId = 1; |
| 2460 |
isScheduled = false; |
| 2461 |
tick = (timestamp) => { |
| 2462 |
this.isScheduled = false; |
| 2463 |
const currentCallbacks = this.callbacks; |
| 2464 |
const currentCallbacksCount = this.callbacksCount; |
| 2465 |
this.callbacks = []; |
| 2466 |
this.callbacksCount = 0; |
| 2467 |
this.startId = this.nextId; |
| 2468 |
if (currentCallbacksCount > 0) { |
| 2469 |
for (let i2 = 0; i2 < currentCallbacks.length; i2 += 1) { |
| 2470 |
currentCallbacks[i2]?.(timestamp); |
| 2471 |
} |
| 2472 |
} |
| 2473 |
}; |
| 2474 |
request(fn) { |
| 2475 |
const id = this.nextId; |
| 2476 |
this.nextId += 1; |
| 2477 |
this.callbacks.push(fn); |
| 2478 |
this.callbacksCount += 1; |
| 2479 |
const didRAFChange = LAST_RAF !== requestAnimationFrame && (LAST_RAF = requestAnimationFrame, true); |
| 2480 |
if (!this.isScheduled || didRAFChange) { |
| 2481 |
requestAnimationFrame(this.tick); |
| 2482 |
this.isScheduled = true; |
| 2483 |
} |
| 2484 |
return id; |
| 2485 |
} |
| 2486 |
cancel(id) { |
| 2487 |
const index2 = id - this.startId; |
| 2488 |
if (index2 < 0 || index2 >= this.callbacks.length) { |
| 2489 |
return; |
| 2490 |
} |
| 2491 |
this.callbacks[index2] = null; |
| 2492 |
this.callbacksCount -= 1; |
| 2493 |
} |
| 2494 |
}; |
| 2495 |
var scheduler = new Scheduler(); |
| 2496 |
var AnimationFrame = class _AnimationFrame { |
| 2497 |
static create() { |
| 2498 |
return new _AnimationFrame(); |
| 2499 |
} |
| 2500 |
static request(fn) { |
| 2501 |
return scheduler.request(fn); |
| 2502 |
} |
| 2503 |
static cancel(id) { |
| 2504 |
return scheduler.cancel(id); |
| 2505 |
} |
| 2506 |
currentId = EMPTY2; |
| 2507 |
/** |
| 2508 |
* Executes `fn` after `delay`, clearing any previously scheduled call. |
| 2509 |
*/ |
| 2510 |
request(fn) { |
| 2511 |
this.cancel(); |
| 2512 |
this.currentId = scheduler.request(() => { |
| 2513 |
this.currentId = EMPTY2; |
| 2514 |
fn(); |
| 2515 |
}); |
| 2516 |
} |
| 2517 |
cancel = () => { |
| 2518 |
if (this.currentId !== EMPTY2) { |
| 2519 |
scheduler.cancel(this.currentId); |
| 2520 |
this.currentId = EMPTY2; |
| 2521 |
} |
| 2522 |
}; |
| 2523 |
disposeEffect = () => { |
| 2524 |
return this.cancel; |
| 2525 |
}; |
| 2526 |
}; |
| 2527 |
function useAnimationFrame() { |
| 2528 |
const timeout = useRefWithInit(AnimationFrame.create).current; |
| 2529 |
useOnMount(timeout.disposeEffect); |
| 2530 |
return timeout; |
| 2531 |
} |
| 2532 |
|
| 2533 |
// node_modules/@base-ui/react/esm/internals/useTransitionStatus.js |
| 2534 |
function useTransitionStatus(open, enableIdleState = false, deferEndingState = false) { |
| 2535 |
const [transitionStatus, setTransitionStatus] = React10.useState(open && enableIdleState ? "idle" : void 0); |
| 2536 |
const [mounted, setMounted] = React10.useState(open); |
| 2537 |
if (open && !mounted) { |
| 2538 |
setMounted(true); |
| 2539 |
setTransitionStatus("starting"); |
| 2540 |
} |
| 2541 |
if (!open && mounted && transitionStatus !== "ending" && !deferEndingState) { |
| 2542 |
setTransitionStatus("ending"); |
| 2543 |
} |
| 2544 |
if (!open && !mounted && transitionStatus === "ending") { |
| 2545 |
setTransitionStatus(void 0); |
| 2546 |
} |
| 2547 |
useIsoLayoutEffect(() => { |
| 2548 |
if (!open && mounted && transitionStatus !== "ending" && deferEndingState) { |
| 2549 |
const frame = AnimationFrame.request(() => { |
| 2550 |
setTransitionStatus("ending"); |
| 2551 |
}); |
| 2552 |
return () => { |
| 2553 |
AnimationFrame.cancel(frame); |
| 2554 |
}; |
| 2555 |
} |
| 2556 |
return void 0; |
| 2557 |
}, [open, mounted, transitionStatus, deferEndingState]); |
| 2558 |
useIsoLayoutEffect(() => { |
| 2559 |
if (!open || enableIdleState) { |
| 2560 |
return void 0; |
| 2561 |
} |
| 2562 |
const frame = AnimationFrame.request(() => { |
| 2563 |
setTransitionStatus(void 0); |
| 2564 |
}); |
| 2565 |
return () => { |
| 2566 |
AnimationFrame.cancel(frame); |
| 2567 |
}; |
| 2568 |
}, [enableIdleState, open]); |
| 2569 |
useIsoLayoutEffect(() => { |
| 2570 |
if (!open || !enableIdleState) { |
| 2571 |
return void 0; |
| 2572 |
} |
| 2573 |
if (open && mounted && transitionStatus !== "idle") { |
| 2574 |
setTransitionStatus("starting"); |
| 2575 |
} |
| 2576 |
const frame = AnimationFrame.request(() => { |
| 2577 |
setTransitionStatus("idle"); |
| 2578 |
}); |
| 2579 |
return () => { |
| 2580 |
AnimationFrame.cancel(frame); |
| 2581 |
}; |
| 2582 |
}, [enableIdleState, open, mounted, transitionStatus]); |
| 2583 |
return { |
| 2584 |
mounted, |
| 2585 |
setMounted, |
| 2586 |
transitionStatus |
| 2587 |
}; |
| 2588 |
} |
| 2589 |
|
| 2590 |
// node_modules/@base-ui/react/esm/internals/stateAttributesMapping.js |
| 2591 |
var TransitionStatusDataAttributes = /* @__PURE__ */ (function(TransitionStatusDataAttributes2) { |
| 2592 |
TransitionStatusDataAttributes2["startingStyle"] = "data-starting-style"; |
| 2593 |
TransitionStatusDataAttributes2["endingStyle"] = "data-ending-style"; |
| 2594 |
return TransitionStatusDataAttributes2; |
| 2595 |
})({}); |
| 2596 |
var STARTING_HOOK = { |
| 2597 |
[TransitionStatusDataAttributes.startingStyle]: "" |
| 2598 |
}; |
| 2599 |
var ENDING_HOOK = { |
| 2600 |
[TransitionStatusDataAttributes.endingStyle]: "" |
| 2601 |
}; |
| 2602 |
var transitionStatusMapping = { |
| 2603 |
transitionStatus(value) { |
| 2604 |
if (value === "starting") { |
| 2605 |
return STARTING_HOOK; |
| 2606 |
} |
| 2607 |
if (value === "ending") { |
| 2608 |
return ENDING_HOOK; |
| 2609 |
} |
| 2610 |
return null; |
| 2611 |
} |
| 2612 |
}; |
| 2613 |
|
| 2614 |
// node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs |
| 2615 |
function hasWindow() { |
| 2616 |
return typeof window !== "undefined"; |
| 2617 |
} |
| 2618 |
function getNodeName(node) { |
| 2619 |
if (isNode(node)) { |
| 2620 |
return (node.nodeName || "").toLowerCase(); |
| 2621 |
} |
| 2622 |
return "#document"; |
| 2623 |
} |
| 2624 |
function getWindow(node) { |
| 2625 |
var _node$ownerDocument; |
| 2626 |
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window; |
| 2627 |
} |
| 2628 |
function getDocumentElement(node) { |
| 2629 |
var _ref; |
| 2630 |
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement; |
| 2631 |
} |
| 2632 |
function isNode(value) { |
| 2633 |
if (!hasWindow()) { |
| 2634 |
return false; |
| 2635 |
} |
| 2636 |
return value instanceof Node || value instanceof getWindow(value).Node; |
| 2637 |
} |
| 2638 |
function isElement(value) { |
| 2639 |
if (!hasWindow()) { |
| 2640 |
return false; |
| 2641 |
} |
| 2642 |
return value instanceof Element || value instanceof getWindow(value).Element; |
| 2643 |
} |
| 2644 |
function isHTMLElement(value) { |
| 2645 |
if (!hasWindow()) { |
| 2646 |
return false; |
| 2647 |
} |
| 2648 |
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement; |
| 2649 |
} |
| 2650 |
function isShadowRoot(value) { |
| 2651 |
if (!hasWindow() || typeof ShadowRoot === "undefined") { |
| 2652 |
return false; |
| 2653 |
} |
| 2654 |
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot; |
| 2655 |
} |
| 2656 |
function isOverflowElement(element) { |
| 2657 |
const { |
| 2658 |
overflow, |
| 2659 |
overflowX, |
| 2660 |
overflowY, |
| 2661 |
display |
| 2662 |
} = getComputedStyle2(element); |
| 2663 |
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== "inline" && display !== "contents"; |
| 2664 |
} |
| 2665 |
function isTableElement(element) { |
| 2666 |
return /^(table|td|th)$/.test(getNodeName(element)); |
| 2667 |
} |
| 2668 |
function isTopLayer(element) { |
| 2669 |
try { |
| 2670 |
if (element.matches(":popover-open")) { |
| 2671 |
return true; |
| 2672 |
} |
| 2673 |
} catch (_e) { |
| 2674 |
} |
| 2675 |
try { |
| 2676 |
return element.matches(":modal"); |
| 2677 |
} catch (_e) { |
| 2678 |
return false; |
| 2679 |
} |
| 2680 |
} |
| 2681 |
var willChangeRe = /transform|translate|scale|rotate|perspective|filter/; |
| 2682 |
var containRe = /paint|layout|strict|content/; |
| 2683 |
var isNotNone = (value) => !!value && value !== "none"; |
| 2684 |
var isWebKitValue; |
| 2685 |
function isContainingBlock(elementOrCss) { |
| 2686 |
const css = isElement(elementOrCss) ? getComputedStyle2(elementOrCss) : elementOrCss; |
| 2687 |
return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || "") || containRe.test(css.contain || ""); |
| 2688 |
} |
| 2689 |
function getContainingBlock(element) { |
| 2690 |
let currentNode = getParentNode(element); |
| 2691 |
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) { |
| 2692 |
if (isContainingBlock(currentNode)) { |
| 2693 |
return currentNode; |
| 2694 |
} else if (isTopLayer(currentNode)) { |
| 2695 |
return null; |
| 2696 |
} |
| 2697 |
currentNode = getParentNode(currentNode); |
| 2698 |
} |
| 2699 |
return null; |
| 2700 |
} |
| 2701 |
function isWebKit() { |
| 2702 |
if (isWebKitValue == null) { |
| 2703 |
isWebKitValue = typeof CSS !== "undefined" && CSS.supports && CSS.supports("-webkit-backdrop-filter", "none"); |
| 2704 |
} |
| 2705 |
return isWebKitValue; |
| 2706 |
} |
| 2707 |
function isLastTraversableNode(node) { |
| 2708 |
return /^(html|body|#document)$/.test(getNodeName(node)); |
| 2709 |
} |
| 2710 |
function getComputedStyle2(element) { |
| 2711 |
return getWindow(element).getComputedStyle(element); |
| 2712 |
} |
| 2713 |
function getNodeScroll(element) { |
| 2714 |
if (isElement(element)) { |
| 2715 |
return { |
| 2716 |
scrollLeft: element.scrollLeft, |
| 2717 |
scrollTop: element.scrollTop |
| 2718 |
}; |
| 2719 |
} |
| 2720 |
return { |
| 2721 |
scrollLeft: element.scrollX, |
| 2722 |
scrollTop: element.scrollY |
| 2723 |
}; |
| 2724 |
} |
| 2725 |
function getParentNode(node) { |
| 2726 |
if (getNodeName(node) === "html") { |
| 2727 |
return node; |
| 2728 |
} |
| 2729 |
const result = ( |
| 2730 |
// Step into the shadow DOM of the parent of a slotted node. |
| 2731 |
node.assignedSlot || // DOM Element detected. |
| 2732 |
node.parentNode || // ShadowRoot detected. |
| 2733 |
isShadowRoot(node) && node.host || // Fallback. |
| 2734 |
getDocumentElement(node) |
| 2735 |
); |
| 2736 |
return isShadowRoot(result) ? result.host : result; |
| 2737 |
} |
| 2738 |
function getNearestOverflowAncestor(node) { |
| 2739 |
const parentNode = getParentNode(node); |
| 2740 |
if (isLastTraversableNode(parentNode)) { |
| 2741 |
return node.ownerDocument ? node.ownerDocument.body : node.body; |
| 2742 |
} |
| 2743 |
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) { |
| 2744 |
return parentNode; |
| 2745 |
} |
| 2746 |
return getNearestOverflowAncestor(parentNode); |
| 2747 |
} |
| 2748 |
function getOverflowAncestors(node, list, traverseIframes) { |
| 2749 |
var _node$ownerDocument2; |
| 2750 |
if (list === void 0) { |
| 2751 |
list = []; |
| 2752 |
} |
| 2753 |
if (traverseIframes === void 0) { |
| 2754 |
traverseIframes = true; |
| 2755 |
} |
| 2756 |
const scrollableAncestor = getNearestOverflowAncestor(node); |
| 2757 |
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body); |
| 2758 |
const win = getWindow(scrollableAncestor); |
| 2759 |
if (isBody) { |
| 2760 |
const frameElement = getFrameElement(win); |
| 2761 |
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []); |
| 2762 |
} else { |
| 2763 |
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes)); |
| 2764 |
} |
| 2765 |
} |
| 2766 |
function getFrameElement(win) { |
| 2767 |
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null; |
| 2768 |
} |
| 2769 |
|
| 2770 |
// node_modules/@base-ui/utils/esm/detectBrowser.js |
| 2771 |
var hasNavigator = typeof navigator !== "undefined"; |
| 2772 |
var nav = getNavigatorData(); |
| 2773 |
var platform = getPlatform(); |
| 2774 |
var userAgent = getUserAgent(); |
| 2775 |
var isWebKit2 = typeof CSS === "undefined" || !CSS.supports ? false : CSS.supports("-webkit-backdrop-filter:none"); |
| 2776 |
var isIOS = ( |
| 2777 |
// iPads can claim to be MacIntel |
| 2778 |
nav.platform === "MacIntel" && nav.maxTouchPoints > 1 ? true : /iP(hone|ad|od)|iOS/.test(nav.platform) |
| 2779 |
); |
| 2780 |
var isFirefox = hasNavigator && /firefox/i.test(userAgent); |
| 2781 |
var isSafari = hasNavigator && /apple/i.test(navigator.vendor); |
| 2782 |
var isEdge = hasNavigator && /Edg/i.test(userAgent); |
| 2783 |
var isAndroid = hasNavigator && /android/i.test(platform) || /android/i.test(userAgent); |
| 2784 |
var isMac = hasNavigator && platform.toLowerCase().startsWith("mac") && !navigator.maxTouchPoints; |
| 2785 |
var isJSDOM = userAgent.includes("jsdom/"); |
| 2786 |
function getNavigatorData() { |
| 2787 |
if (!hasNavigator) { |
| 2788 |
return { |
| 2789 |
platform: "", |
| 2790 |
maxTouchPoints: -1 |
| 2791 |
}; |
| 2792 |
} |
| 2793 |
const uaData = navigator.userAgentData; |
| 2794 |
if (uaData?.platform) { |
| 2795 |
return { |
| 2796 |
platform: uaData.platform, |
| 2797 |
maxTouchPoints: navigator.maxTouchPoints |
| 2798 |
}; |
| 2799 |
} |
| 2800 |
return { |
| 2801 |
platform: navigator.platform ?? "", |
| 2802 |
maxTouchPoints: navigator.maxTouchPoints ?? -1 |
| 2803 |
}; |
| 2804 |
} |
| 2805 |
function getUserAgent() { |
| 2806 |
if (!hasNavigator) { |
| 2807 |
return ""; |
| 2808 |
} |
| 2809 |
const uaData = navigator.userAgentData; |
| 2810 |
if (uaData && Array.isArray(uaData.brands)) { |
| 2811 |
return uaData.brands.map(({ |
| 2812 |
brand, |
| 2813 |
version: version2 |
| 2814 |
}) => `${brand}/${version2}`).join(" "); |
| 2815 |
} |
| 2816 |
return navigator.userAgent; |
| 2817 |
} |
| 2818 |
function getPlatform() { |
| 2819 |
if (!hasNavigator) { |
| 2820 |
return ""; |
| 2821 |
} |
| 2822 |
const uaData = navigator.userAgentData; |
| 2823 |
if (uaData?.platform) { |
| 2824 |
return uaData.platform; |
| 2825 |
} |
| 2826 |
return navigator.platform ?? ""; |
| 2827 |
} |
| 2828 |
|
| 2829 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/constants.js |
| 2830 |
var FOCUSABLE_ATTRIBUTE = "data-base-ui-focusable"; |
| 2831 |
var TYPEABLE_SELECTOR = "input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])"; |
| 2832 |
|
| 2833 |
// node_modules/@base-ui/react/esm/internals/shadowDom.js |
| 2834 |
function activeElement(doc) { |
| 2835 |
let element = doc.activeElement; |
| 2836 |
while (element?.shadowRoot?.activeElement != null) { |
| 2837 |
element = element.shadowRoot.activeElement; |
| 2838 |
} |
| 2839 |
return element; |
| 2840 |
} |
| 2841 |
function contains(parent, child) { |
| 2842 |
if (!parent || !child) { |
| 2843 |
return false; |
| 2844 |
} |
| 2845 |
const rootNode = child.getRootNode?.(); |
| 2846 |
if (parent.contains(child)) { |
| 2847 |
return true; |
| 2848 |
} |
| 2849 |
if (rootNode && isShadowRoot(rootNode)) { |
| 2850 |
let next = child; |
| 2851 |
while (next) { |
| 2852 |
if (parent === next) { |
| 2853 |
return true; |
| 2854 |
} |
| 2855 |
next = next.parentNode || next.host; |
| 2856 |
} |
| 2857 |
} |
| 2858 |
return false; |
| 2859 |
} |
| 2860 |
function getTarget(event) { |
| 2861 |
if ("composedPath" in event) { |
| 2862 |
return event.composedPath()[0]; |
| 2863 |
} |
| 2864 |
return event.target; |
| 2865 |
} |
| 2866 |
|
| 2867 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/element.js |
| 2868 |
function isTargetInsideEnabledTrigger(target, triggerElements) { |
| 2869 |
if (!isElement(target)) { |
| 2870 |
return false; |
| 2871 |
} |
| 2872 |
const targetElement = target; |
| 2873 |
if (triggerElements.hasElement(targetElement)) { |
| 2874 |
return !targetElement.hasAttribute("data-trigger-disabled"); |
| 2875 |
} |
| 2876 |
for (const [, trigger] of triggerElements.entries()) { |
| 2877 |
if (contains(trigger, targetElement)) { |
| 2878 |
return !trigger.hasAttribute("data-trigger-disabled"); |
| 2879 |
} |
| 2880 |
} |
| 2881 |
return false; |
| 2882 |
} |
| 2883 |
function isEventTargetWithin(event, node) { |
| 2884 |
if (node == null) { |
| 2885 |
return false; |
| 2886 |
} |
| 2887 |
if ("composedPath" in event) { |
| 2888 |
return event.composedPath().includes(node); |
| 2889 |
} |
| 2890 |
const eventAgain = event; |
| 2891 |
return eventAgain.target != null && node.contains(eventAgain.target); |
| 2892 |
} |
| 2893 |
function isRootElement(element) { |
| 2894 |
return element.matches("html,body"); |
| 2895 |
} |
| 2896 |
function isTypeableElement(element) { |
| 2897 |
return isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR); |
| 2898 |
} |
| 2899 |
function isInteractiveElement(element) { |
| 2900 |
return element?.closest(`button,a[href],[role="button"],select,[tabindex]:not([tabindex="-1"]),${TYPEABLE_SELECTOR}`) != null; |
| 2901 |
} |
| 2902 |
function matchesFocusVisible(element) { |
| 2903 |
if (!element || isJSDOM) { |
| 2904 |
return true; |
| 2905 |
} |
| 2906 |
try { |
| 2907 |
return element.matches(":focus-visible"); |
| 2908 |
} catch (_e) { |
| 2909 |
return true; |
| 2910 |
} |
| 2911 |
} |
| 2912 |
|
| 2913 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/nodes.js |
| 2914 |
function getNodeChildren(nodes, id, onlyOpenChildren = true) { |
| 2915 |
const directChildren = nodes.filter((node) => node.parentId === id); |
| 2916 |
return directChildren.flatMap((child) => [...!onlyOpenChildren || child.context?.open ? [child] : [], ...getNodeChildren(nodes, child.id, onlyOpenChildren)]); |
| 2917 |
} |
| 2918 |
|
| 2919 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/event.js |
| 2920 |
function isReactEvent(event) { |
| 2921 |
return "nativeEvent" in event; |
| 2922 |
} |
| 2923 |
function isMouseLikePointerType(pointerType, strict) { |
| 2924 |
const values = ["mouse", "pen"]; |
| 2925 |
if (!strict) { |
| 2926 |
values.push("", void 0); |
| 2927 |
} |
| 2928 |
return values.includes(pointerType); |
| 2929 |
} |
| 2930 |
function isClickLikeEvent(event) { |
| 2931 |
const type = event.type; |
| 2932 |
return type === "click" || type === "mousedown" || type === "keydown" || type === "keyup"; |
| 2933 |
} |
| 2934 |
|
| 2935 |
// node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs |
| 2936 |
var sides = ["top", "right", "bottom", "left"]; |
| 2937 |
var min = Math.min; |
| 2938 |
var max = Math.max; |
| 2939 |
var round = Math.round; |
| 2940 |
var floor = Math.floor; |
| 2941 |
var createCoords = (v2) => ({ |
| 2942 |
x: v2, |
| 2943 |
y: v2 |
| 2944 |
}); |
| 2945 |
var oppositeSideMap = { |
| 2946 |
left: "right", |
| 2947 |
right: "left", |
| 2948 |
bottom: "top", |
| 2949 |
top: "bottom" |
| 2950 |
}; |
| 2951 |
function clamp(start, value, end) { |
| 2952 |
return max(start, min(value, end)); |
| 2953 |
} |
| 2954 |
function evaluate(value, param) { |
| 2955 |
return typeof value === "function" ? value(param) : value; |
| 2956 |
} |
| 2957 |
function getSide(placement) { |
| 2958 |
return placement.split("-")[0]; |
| 2959 |
} |
| 2960 |
function getAlignment(placement) { |
| 2961 |
return placement.split("-")[1]; |
| 2962 |
} |
| 2963 |
function getOppositeAxis(axis) { |
| 2964 |
return axis === "x" ? "y" : "x"; |
| 2965 |
} |
| 2966 |
function getAxisLength(axis) { |
| 2967 |
return axis === "y" ? "height" : "width"; |
| 2968 |
} |
| 2969 |
function getSideAxis(placement) { |
| 2970 |
const firstChar = placement[0]; |
| 2971 |
return firstChar === "t" || firstChar === "b" ? "y" : "x"; |
| 2972 |
} |
| 2973 |
function getAlignmentAxis(placement) { |
| 2974 |
return getOppositeAxis(getSideAxis(placement)); |
| 2975 |
} |
| 2976 |
function getAlignmentSides(placement, rects, rtl) { |
| 2977 |
if (rtl === void 0) { |
| 2978 |
rtl = false; |
| 2979 |
} |
| 2980 |
const alignment = getAlignment(placement); |
| 2981 |
const alignmentAxis = getAlignmentAxis(placement); |
| 2982 |
const length = getAxisLength(alignmentAxis); |
| 2983 |
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top"; |
| 2984 |
if (rects.reference[length] > rects.floating[length]) { |
| 2985 |
mainAlignmentSide = getOppositePlacement(mainAlignmentSide); |
| 2986 |
} |
| 2987 |
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)]; |
| 2988 |
} |
| 2989 |
function getExpandedPlacements(placement) { |
| 2990 |
const oppositePlacement = getOppositePlacement(placement); |
| 2991 |
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)]; |
| 2992 |
} |
| 2993 |
function getOppositeAlignmentPlacement(placement) { |
| 2994 |
return placement.includes("start") ? placement.replace("start", "end") : placement.replace("end", "start"); |
| 2995 |
} |
| 2996 |
var lrPlacement = ["left", "right"]; |
| 2997 |
var rlPlacement = ["right", "left"]; |
| 2998 |
var tbPlacement = ["top", "bottom"]; |
| 2999 |
var btPlacement = ["bottom", "top"]; |
| 3000 |
function getSideList(side, isStart, rtl) { |
| 3001 |
switch (side) { |
| 3002 |
case "top": |
| 3003 |
case "bottom": |
| 3004 |
if (rtl) return isStart ? rlPlacement : lrPlacement; |
| 3005 |
return isStart ? lrPlacement : rlPlacement; |
| 3006 |
case "left": |
| 3007 |
case "right": |
| 3008 |
return isStart ? tbPlacement : btPlacement; |
| 3009 |
default: |
| 3010 |
return []; |
| 3011 |
} |
| 3012 |
} |
| 3013 |
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) { |
| 3014 |
const alignment = getAlignment(placement); |
| 3015 |
let list = getSideList(getSide(placement), direction === "start", rtl); |
| 3016 |
if (alignment) { |
| 3017 |
list = list.map((side) => side + "-" + alignment); |
| 3018 |
if (flipAlignment) { |
| 3019 |
list = list.concat(list.map(getOppositeAlignmentPlacement)); |
| 3020 |
} |
| 3021 |
} |
| 3022 |
return list; |
| 3023 |
} |
| 3024 |
function getOppositePlacement(placement) { |
| 3025 |
const side = getSide(placement); |
| 3026 |
return oppositeSideMap[side] + placement.slice(side.length); |
| 3027 |
} |
| 3028 |
function expandPaddingObject(padding) { |
| 3029 |
return { |
| 3030 |
top: 0, |
| 3031 |
right: 0, |
| 3032 |
bottom: 0, |
| 3033 |
left: 0, |
| 3034 |
...padding |
| 3035 |
}; |
| 3036 |
} |
| 3037 |
function getPaddingObject(padding) { |
| 3038 |
return typeof padding !== "number" ? expandPaddingObject(padding) : { |
| 3039 |
top: padding, |
| 3040 |
right: padding, |
| 3041 |
bottom: padding, |
| 3042 |
left: padding |
| 3043 |
}; |
| 3044 |
} |
| 3045 |
function rectToClientRect(rect) { |
| 3046 |
const { |
| 3047 |
x: x2, |
| 3048 |
y: y2, |
| 3049 |
width, |
| 3050 |
height |
| 3051 |
} = rect; |
| 3052 |
return { |
| 3053 |
width, |
| 3054 |
height, |
| 3055 |
top: y2, |
| 3056 |
left: x2, |
| 3057 |
right: x2 + width, |
| 3058 |
bottom: y2 + height, |
| 3059 |
x: x2, |
| 3060 |
y: y2 |
| 3061 |
}; |
| 3062 |
} |
| 3063 |
|
| 3064 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/composite.js |
| 3065 |
function isHiddenByStyles(styles) { |
| 3066 |
return styles.visibility === "hidden" || styles.visibility === "collapse"; |
| 3067 |
} |
| 3068 |
function isElementVisible(element, styles = element ? getComputedStyle2(element) : null) { |
| 3069 |
if (!element || !element.isConnected || !styles || isHiddenByStyles(styles)) { |
| 3070 |
return false; |
| 3071 |
} |
| 3072 |
if (typeof element.checkVisibility === "function") { |
| 3073 |
return element.checkVisibility(); |
| 3074 |
} |
| 3075 |
return styles.display !== "none" && styles.display !== "contents"; |
| 3076 |
} |
| 3077 |
|
| 3078 |
// node_modules/@base-ui/utils/esm/owner.js |
| 3079 |
function ownerDocument(node) { |
| 3080 |
return node?.ownerDocument || document; |
| 3081 |
} |
| 3082 |
|
| 3083 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/tabbable.js |
| 3084 |
var CANDIDATE_SELECTOR = 'a[href],button,input,select,textarea,summary,details,iframe,object,embed,[tabindex],[contenteditable]:not([contenteditable="false"]),audio[controls],video[controls]'; |
| 3085 |
function getParentElement(element) { |
| 3086 |
const assignedSlot = element.assignedSlot; |
| 3087 |
if (assignedSlot) { |
| 3088 |
return assignedSlot; |
| 3089 |
} |
| 3090 |
if (element.parentElement) { |
| 3091 |
return element.parentElement; |
| 3092 |
} |
| 3093 |
const rootNode = element.getRootNode(); |
| 3094 |
return isShadowRoot(rootNode) ? rootNode.host : null; |
| 3095 |
} |
| 3096 |
function getDetailsSummary(details) { |
| 3097 |
for (const child of Array.from(details.children)) { |
| 3098 |
if (getNodeName(child) === "summary") { |
| 3099 |
return child; |
| 3100 |
} |
| 3101 |
} |
| 3102 |
return null; |
| 3103 |
} |
| 3104 |
function isWithinOpenDetailsSummary(element, details) { |
| 3105 |
const summary = getDetailsSummary(details); |
| 3106 |
return !!summary && (element === summary || contains(summary, element)); |
| 3107 |
} |
| 3108 |
function isFocusableCandidate(element) { |
| 3109 |
const nodeName = element ? getNodeName(element) : ""; |
| 3110 |
return element != null && element.matches(CANDIDATE_SELECTOR) && (nodeName !== "summary" || element.parentElement != null && getNodeName(element.parentElement) === "details" && getDetailsSummary(element.parentElement) === element) && (nodeName !== "details" || getDetailsSummary(element) == null) && (nodeName !== "input" || element.type !== "hidden"); |
| 3111 |
} |
| 3112 |
function isFocusableElement(element) { |
| 3113 |
if (!isFocusableCandidate(element) || !element.isConnected || element.matches(":disabled")) { |
| 3114 |
return false; |
| 3115 |
} |
| 3116 |
for (let current = element; current; current = getParentElement(current)) { |
| 3117 |
const isAncestor = current !== element; |
| 3118 |
const isSlot = getNodeName(current) === "slot"; |
| 3119 |
if (current.hasAttribute("inert")) { |
| 3120 |
return false; |
| 3121 |
} |
| 3122 |
if (isAncestor && getNodeName(current) === "details" && !current.open && !isWithinOpenDetailsSummary(element, current) || current.hasAttribute("hidden") || !isSlot && !isVisibleInTabbableTree(current, isAncestor)) { |
| 3123 |
return false; |
| 3124 |
} |
| 3125 |
} |
| 3126 |
return true; |
| 3127 |
} |
| 3128 |
function isVisibleInTabbableTree(element, isAncestor) { |
| 3129 |
const styles = getComputedStyle2(element); |
| 3130 |
if (!isAncestor) { |
| 3131 |
return isElementVisible(element, styles); |
| 3132 |
} |
| 3133 |
return styles.display !== "none"; |
| 3134 |
} |
| 3135 |
function getTabIndex(element) { |
| 3136 |
const tabIndex = element.tabIndex; |
| 3137 |
if (tabIndex < 0) { |
| 3138 |
const nodeName = getNodeName(element); |
| 3139 |
if (nodeName === "details" || nodeName === "audio" || nodeName === "video" || isHTMLElement(element) && element.isContentEditable) { |
| 3140 |
return 0; |
| 3141 |
} |
| 3142 |
} |
| 3143 |
return tabIndex; |
| 3144 |
} |
| 3145 |
function getNamedRadioInput(element) { |
| 3146 |
if (getNodeName(element) !== "input") { |
| 3147 |
return null; |
| 3148 |
} |
| 3149 |
const input = element; |
| 3150 |
return input.type === "radio" && input.name !== "" ? input : null; |
| 3151 |
} |
| 3152 |
function isTabbableRadio(element, candidates) { |
| 3153 |
const input = getNamedRadioInput(element); |
| 3154 |
if (!input) { |
| 3155 |
return true; |
| 3156 |
} |
| 3157 |
const checkedRadio = candidates.find((candidate) => { |
| 3158 |
const radio = getNamedRadioInput(candidate); |
| 3159 |
return radio?.name === input.name && radio.form === input.form && radio.checked; |
| 3160 |
}); |
| 3161 |
if (checkedRadio) { |
| 3162 |
return checkedRadio === input; |
| 3163 |
} |
| 3164 |
return candidates.find((candidate) => { |
| 3165 |
const radio = getNamedRadioInput(candidate); |
| 3166 |
return radio?.name === input.name && radio.form === input.form; |
| 3167 |
}) === input; |
| 3168 |
} |
| 3169 |
function getComposedChildren(container) { |
| 3170 |
if (isHTMLElement(container) && getNodeName(container) === "slot") { |
| 3171 |
const assignedElements = container.assignedElements({ |
| 3172 |
flatten: true |
| 3173 |
}); |
| 3174 |
if (assignedElements.length > 0) { |
| 3175 |
return assignedElements; |
| 3176 |
} |
| 3177 |
} |
| 3178 |
if (isHTMLElement(container) && container.shadowRoot) { |
| 3179 |
return Array.from(container.shadowRoot.children); |
| 3180 |
} |
| 3181 |
return Array.from(container.children); |
| 3182 |
} |
| 3183 |
function appendCandidates(container, list) { |
| 3184 |
getComposedChildren(container).forEach((child) => { |
| 3185 |
if (isFocusableCandidate(child)) { |
| 3186 |
list.push(child); |
| 3187 |
} |
| 3188 |
appendCandidates(child, list); |
| 3189 |
}); |
| 3190 |
} |
| 3191 |
function appendMatchingElements(container, selector2, list) { |
| 3192 |
getComposedChildren(container).forEach((child) => { |
| 3193 |
if (isHTMLElement(child) && child.matches(selector2)) { |
| 3194 |
list.push(child); |
| 3195 |
} |
| 3196 |
appendMatchingElements(child, selector2, list); |
| 3197 |
}); |
| 3198 |
} |
| 3199 |
function focusable(container) { |
| 3200 |
const candidates = []; |
| 3201 |
appendCandidates(container, candidates); |
| 3202 |
return candidates.filter(isFocusableElement); |
| 3203 |
} |
| 3204 |
function tabbable(container) { |
| 3205 |
const candidates = focusable(container); |
| 3206 |
return candidates.filter((element) => getTabIndex(element) >= 0 && isTabbableRadio(element, candidates)); |
| 3207 |
} |
| 3208 |
function getTabbableIn(container, dir) { |
| 3209 |
const list = tabbable(container); |
| 3210 |
const len = list.length; |
| 3211 |
if (len === 0) { |
| 3212 |
return void 0; |
| 3213 |
} |
| 3214 |
const active = activeElement(ownerDocument(container)); |
| 3215 |
const index2 = list.indexOf(active); |
| 3216 |
const nextIndex = index2 === -1 ? dir === 1 ? 0 : len - 1 : index2 + dir; |
| 3217 |
return list[nextIndex]; |
| 3218 |
} |
| 3219 |
function getNextTabbable(referenceElement) { |
| 3220 |
return getTabbableIn(ownerDocument(referenceElement).body, 1) || referenceElement; |
| 3221 |
} |
| 3222 |
function getPreviousTabbable(referenceElement) { |
| 3223 |
return getTabbableIn(ownerDocument(referenceElement).body, -1) || referenceElement; |
| 3224 |
} |
| 3225 |
function isOutsideEvent(event, container) { |
| 3226 |
const containerElement = container || event.currentTarget; |
| 3227 |
const relatedTarget = event.relatedTarget; |
| 3228 |
return !relatedTarget || !contains(containerElement, relatedTarget); |
| 3229 |
} |
| 3230 |
function disableFocusInside(container) { |
| 3231 |
const tabbableElements = tabbable(container); |
| 3232 |
tabbableElements.forEach((element) => { |
| 3233 |
element.dataset.tabindex = element.getAttribute("tabindex") || ""; |
| 3234 |
element.setAttribute("tabindex", "-1"); |
| 3235 |
}); |
| 3236 |
} |
| 3237 |
function enableFocusInside(container) { |
| 3238 |
const elements = []; |
| 3239 |
appendMatchingElements(container, "[data-tabindex]", elements); |
| 3240 |
elements.forEach((element) => { |
| 3241 |
const tabindex = element.dataset.tabindex; |
| 3242 |
delete element.dataset.tabindex; |
| 3243 |
if (tabindex) { |
| 3244 |
element.setAttribute("tabindex", tabindex); |
| 3245 |
} else { |
| 3246 |
element.removeAttribute("tabindex"); |
| 3247 |
} |
| 3248 |
}); |
| 3249 |
} |
| 3250 |
|
| 3251 |
// node_modules/@base-ui/utils/esm/addEventListener.js |
| 3252 |
function addEventListener(target, type, listener, options) { |
| 3253 |
target.addEventListener(type, listener, options); |
| 3254 |
return () => { |
| 3255 |
target.removeEventListener(type, listener, options); |
| 3256 |
}; |
| 3257 |
} |
| 3258 |
|
| 3259 |
// node_modules/@base-ui/utils/esm/useValueAsRef.js |
| 3260 |
function useValueAsRef(value) { |
| 3261 |
const latest = useRefWithInit(createLatestRef, value).current; |
| 3262 |
latest.next = value; |
| 3263 |
useIsoLayoutEffect(latest.effect); |
| 3264 |
return latest; |
| 3265 |
} |
| 3266 |
function createLatestRef(value) { |
| 3267 |
const latest = { |
| 3268 |
current: value, |
| 3269 |
next: value, |
| 3270 |
effect: () => { |
| 3271 |
latest.current = latest.next; |
| 3272 |
} |
| 3273 |
}; |
| 3274 |
return latest; |
| 3275 |
} |
| 3276 |
|
| 3277 |
// node_modules/@base-ui/react/esm/internals/useOpenChangeComplete.js |
| 3278 |
var React11 = __toESM(require_react(), 1); |
| 3279 |
|
| 3280 |
// node_modules/@base-ui/react/esm/internals/useAnimationsFinished.js |
| 3281 |
var ReactDOM = __toESM(require_react_dom(), 1); |
| 3282 |
|
| 3283 |
// node_modules/@base-ui/react/esm/utils/resolveRef.js |
| 3284 |
function resolveRef(maybeRef) { |
| 3285 |
if (maybeRef == null) { |
| 3286 |
return maybeRef; |
| 3287 |
} |
| 3288 |
return "current" in maybeRef ? maybeRef.current : maybeRef; |
| 3289 |
} |
| 3290 |
|
| 3291 |
// node_modules/@base-ui/react/esm/internals/useAnimationsFinished.js |
| 3292 |
function useAnimationsFinished(elementOrRef, waitForStartingStyleRemoved = false, treatAbortedAsFinished = true) { |
| 3293 |
const frame = useAnimationFrame(); |
| 3294 |
return useStableCallback((fnToExecute, signal = null) => { |
| 3295 |
frame.cancel(); |
| 3296 |
const element = resolveRef(elementOrRef); |
| 3297 |
if (element == null) { |
| 3298 |
return; |
| 3299 |
} |
| 3300 |
const resolvedElement = element; |
| 3301 |
const done = () => { |
| 3302 |
ReactDOM.flushSync(fnToExecute); |
| 3303 |
}; |
| 3304 |
if (typeof resolvedElement.getAnimations !== "function" || globalThis.BASE_UI_ANIMATIONS_DISABLED) { |
| 3305 |
fnToExecute(); |
| 3306 |
return; |
| 3307 |
} |
| 3308 |
function exec() { |
| 3309 |
Promise.all(resolvedElement.getAnimations().map((animation) => animation.finished)).then(() => { |
| 3310 |
if (!signal?.aborted) { |
| 3311 |
done(); |
| 3312 |
} |
| 3313 |
}).catch(() => { |
| 3314 |
if (treatAbortedAsFinished) { |
| 3315 |
if (!signal?.aborted) { |
| 3316 |
done(); |
| 3317 |
} |
| 3318 |
return; |
| 3319 |
} |
| 3320 |
const currentAnimations = resolvedElement.getAnimations(); |
| 3321 |
if (!signal?.aborted && currentAnimations.length > 0 && currentAnimations.some((animation) => animation.pending || animation.playState !== "finished")) { |
| 3322 |
exec(); |
| 3323 |
} |
| 3324 |
}); |
| 3325 |
} |
| 3326 |
if (waitForStartingStyleRemoved) { |
| 3327 |
const startingStyleAttribute = TransitionStatusDataAttributes.startingStyle; |
| 3328 |
if (!resolvedElement.hasAttribute(startingStyleAttribute)) { |
| 3329 |
frame.request(exec); |
| 3330 |
return; |
| 3331 |
} |
| 3332 |
const attributeObserver = new MutationObserver(() => { |
| 3333 |
if (!resolvedElement.hasAttribute(startingStyleAttribute)) { |
| 3334 |
attributeObserver.disconnect(); |
| 3335 |
exec(); |
| 3336 |
} |
| 3337 |
}); |
| 3338 |
attributeObserver.observe(resolvedElement, { |
| 3339 |
attributes: true, |
| 3340 |
attributeFilter: [startingStyleAttribute] |
| 3341 |
}); |
| 3342 |
signal?.addEventListener("abort", () => attributeObserver.disconnect(), { |
| 3343 |
once: true |
| 3344 |
}); |
| 3345 |
return; |
| 3346 |
} |
| 3347 |
frame.request(exec); |
| 3348 |
}); |
| 3349 |
} |
| 3350 |
|
| 3351 |
// node_modules/@base-ui/react/esm/internals/useOpenChangeComplete.js |
| 3352 |
function useOpenChangeComplete(parameters) { |
| 3353 |
const { |
| 3354 |
enabled = true, |
| 3355 |
open, |
| 3356 |
ref, |
| 3357 |
onComplete: onCompleteParam |
| 3358 |
} = parameters; |
| 3359 |
const onComplete = useStableCallback(onCompleteParam); |
| 3360 |
const runOnceAnimationsFinish = useAnimationsFinished(ref, open, false); |
| 3361 |
React11.useEffect(() => { |
| 3362 |
if (!enabled) { |
| 3363 |
return void 0; |
| 3364 |
} |
| 3365 |
const abortController = new AbortController(); |
| 3366 |
runOnceAnimationsFinish(onComplete, abortController.signal); |
| 3367 |
return () => { |
| 3368 |
abortController.abort(); |
| 3369 |
}; |
| 3370 |
}, [enabled, open, onComplete, runOnceAnimationsFinish]); |
| 3371 |
} |
| 3372 |
|
| 3373 |
// node_modules/@base-ui/utils/esm/useOnFirstRender.js |
| 3374 |
var React12 = __toESM(require_react(), 1); |
| 3375 |
function useOnFirstRender(fn) { |
| 3376 |
const ref = React12.useRef(true); |
| 3377 |
if (ref.current) { |
| 3378 |
ref.current = false; |
| 3379 |
fn(); |
| 3380 |
} |
| 3381 |
} |
| 3382 |
|
| 3383 |
// node_modules/@base-ui/utils/esm/useTimeout.js |
| 3384 |
var EMPTY3 = 0; |
| 3385 |
var Timeout = class _Timeout { |
| 3386 |
static create() { |
| 3387 |
return new _Timeout(); |
| 3388 |
} |
| 3389 |
currentId = EMPTY3; |
| 3390 |
/** |
| 3391 |
* Executes `fn` after `delay`, clearing any previously scheduled call. |
| 3392 |
*/ |
| 3393 |
start(delay, fn) { |
| 3394 |
this.clear(); |
| 3395 |
this.currentId = setTimeout(() => { |
| 3396 |
this.currentId = EMPTY3; |
| 3397 |
fn(); |
| 3398 |
}, delay); |
| 3399 |
} |
| 3400 |
isStarted() { |
| 3401 |
return this.currentId !== EMPTY3; |
| 3402 |
} |
| 3403 |
clear = () => { |
| 3404 |
if (this.currentId !== EMPTY3) { |
| 3405 |
clearTimeout(this.currentId); |
| 3406 |
this.currentId = EMPTY3; |
| 3407 |
} |
| 3408 |
}; |
| 3409 |
disposeEffect = () => { |
| 3410 |
return this.clear; |
| 3411 |
}; |
| 3412 |
}; |
| 3413 |
function useTimeout() { |
| 3414 |
const timeout = useRefWithInit(Timeout.create).current; |
| 3415 |
useOnMount(timeout.disposeEffect); |
| 3416 |
return timeout; |
| 3417 |
} |
| 3418 |
|
| 3419 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingDelayGroup.js |
| 3420 |
var React13 = __toESM(require_react(), 1); |
| 3421 |
|
| 3422 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useHoverShared.js |
| 3423 |
function resolveValue(value, pointerType) { |
| 3424 |
if (pointerType != null && !isMouseLikePointerType(pointerType)) { |
| 3425 |
return 0; |
| 3426 |
} |
| 3427 |
if (typeof value === "function") { |
| 3428 |
return value(); |
| 3429 |
} |
| 3430 |
return value; |
| 3431 |
} |
| 3432 |
function getDelay(value, prop, pointerType) { |
| 3433 |
const result = resolveValue(value, pointerType); |
| 3434 |
if (typeof result === "number") { |
| 3435 |
return result; |
| 3436 |
} |
| 3437 |
return result?.[prop]; |
| 3438 |
} |
| 3439 |
function getRestMs(value) { |
| 3440 |
if (typeof value === "function") { |
| 3441 |
return value(); |
| 3442 |
} |
| 3443 |
return value; |
| 3444 |
} |
| 3445 |
function isClickLikeOpenEvent(openEventType, interactedInside) { |
| 3446 |
return interactedInside || openEventType === "click" || openEventType === "mousedown"; |
| 3447 |
} |
| 3448 |
function isHoverOpenEvent(openEventType) { |
| 3449 |
return openEventType?.includes("mouse") && openEventType !== "mousedown"; |
| 3450 |
} |
| 3451 |
|
| 3452 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingDelayGroup.js |
| 3453 |
var import_jsx_runtime31 = __toESM(require_jsx_runtime(), 1); |
| 3454 |
var FloatingDelayGroupContext = /* @__PURE__ */ React13.createContext({ |
| 3455 |
hasProvider: false, |
| 3456 |
timeoutMs: 0, |
| 3457 |
delayRef: { |
| 3458 |
current: 0 |
| 3459 |
}, |
| 3460 |
initialDelayRef: { |
| 3461 |
current: 0 |
| 3462 |
}, |
| 3463 |
timeout: new Timeout(), |
| 3464 |
currentIdRef: { |
| 3465 |
current: null |
| 3466 |
}, |
| 3467 |
currentContextRef: { |
| 3468 |
current: null |
| 3469 |
} |
| 3470 |
}); |
| 3471 |
if (true) FloatingDelayGroupContext.displayName = "FloatingDelayGroupContext"; |
| 3472 |
function FloatingDelayGroup(props) { |
| 3473 |
const { |
| 3474 |
children, |
| 3475 |
delay, |
| 3476 |
timeoutMs = 0 |
| 3477 |
} = props; |
| 3478 |
const delayRef = React13.useRef(delay); |
| 3479 |
const initialDelayRef = React13.useRef(delay); |
| 3480 |
const currentIdRef = React13.useRef(null); |
| 3481 |
const currentContextRef = React13.useRef(null); |
| 3482 |
const timeout = useTimeout(); |
| 3483 |
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FloatingDelayGroupContext.Provider, { |
| 3484 |
value: React13.useMemo(() => ({ |
| 3485 |
hasProvider: true, |
| 3486 |
delayRef, |
| 3487 |
initialDelayRef, |
| 3488 |
currentIdRef, |
| 3489 |
timeoutMs, |
| 3490 |
currentContextRef, |
| 3491 |
timeout |
| 3492 |
}), [timeoutMs, timeout]), |
| 3493 |
children |
| 3494 |
}); |
| 3495 |
} |
| 3496 |
function useDelayGroup(context, options = { |
| 3497 |
open: false |
| 3498 |
}) { |
| 3499 |
const { |
| 3500 |
open |
| 3501 |
} = options; |
| 3502 |
const store = "rootStore" in context ? context.rootStore : context; |
| 3503 |
const floatingId = store.useState("floatingId"); |
| 3504 |
const groupContext = React13.useContext(FloatingDelayGroupContext); |
| 3505 |
const { |
| 3506 |
currentIdRef, |
| 3507 |
delayRef, |
| 3508 |
timeoutMs, |
| 3509 |
initialDelayRef, |
| 3510 |
currentContextRef, |
| 3511 |
hasProvider, |
| 3512 |
timeout |
| 3513 |
} = groupContext; |
| 3514 |
const [isInstantPhase, setIsInstantPhase] = React13.useState(false); |
| 3515 |
useIsoLayoutEffect(() => { |
| 3516 |
function unset() { |
| 3517 |
setIsInstantPhase(false); |
| 3518 |
currentContextRef.current?.setIsInstantPhase(false); |
| 3519 |
currentIdRef.current = null; |
| 3520 |
currentContextRef.current = null; |
| 3521 |
delayRef.current = initialDelayRef.current; |
| 3522 |
} |
| 3523 |
if (!currentIdRef.current) { |
| 3524 |
return void 0; |
| 3525 |
} |
| 3526 |
if (!open && currentIdRef.current === floatingId) { |
| 3527 |
setIsInstantPhase(false); |
| 3528 |
if (timeoutMs) { |
| 3529 |
const closingId = floatingId; |
| 3530 |
timeout.start(timeoutMs, () => { |
| 3531 |
if (store.select("open") || currentIdRef.current && currentIdRef.current !== closingId) { |
| 3532 |
return; |
| 3533 |
} |
| 3534 |
unset(); |
| 3535 |
}); |
| 3536 |
return () => { |
| 3537 |
timeout.clear(); |
| 3538 |
}; |
| 3539 |
} |
| 3540 |
unset(); |
| 3541 |
} |
| 3542 |
return void 0; |
| 3543 |
}, [open, floatingId, currentIdRef, delayRef, timeoutMs, initialDelayRef, currentContextRef, timeout, store]); |
| 3544 |
useIsoLayoutEffect(() => { |
| 3545 |
if (!open) { |
| 3546 |
return; |
| 3547 |
} |
| 3548 |
const prevContext = currentContextRef.current; |
| 3549 |
const prevId = currentIdRef.current; |
| 3550 |
timeout.clear(); |
| 3551 |
currentContextRef.current = { |
| 3552 |
onOpenChange: store.setOpen, |
| 3553 |
setIsInstantPhase |
| 3554 |
}; |
| 3555 |
currentIdRef.current = floatingId; |
| 3556 |
delayRef.current = { |
| 3557 |
open: 0, |
| 3558 |
close: getDelay(initialDelayRef.current, "close") |
| 3559 |
}; |
| 3560 |
if (prevId !== null && prevId !== floatingId) { |
| 3561 |
setIsInstantPhase(true); |
| 3562 |
prevContext?.setIsInstantPhase(true); |
| 3563 |
prevContext?.onOpenChange(false, createChangeEventDetails(reason_parts_exports.none)); |
| 3564 |
} else { |
| 3565 |
setIsInstantPhase(false); |
| 3566 |
prevContext?.setIsInstantPhase(false); |
| 3567 |
} |
| 3568 |
}, [open, floatingId, store, currentIdRef, delayRef, initialDelayRef, currentContextRef, timeout]); |
| 3569 |
useIsoLayoutEffect(() => { |
| 3570 |
return () => { |
| 3571 |
currentContextRef.current = null; |
| 3572 |
}; |
| 3573 |
}, [currentContextRef]); |
| 3574 |
return React13.useMemo(() => ({ |
| 3575 |
hasProvider, |
| 3576 |
delayRef, |
| 3577 |
isInstantPhase |
| 3578 |
}), [hasProvider, delayRef, isInstantPhase]); |
| 3579 |
} |
| 3580 |
|
| 3581 |
// node_modules/@base-ui/utils/esm/mergeCleanups.js |
| 3582 |
function mergeCleanups(...cleanups) { |
| 3583 |
return () => { |
| 3584 |
for (let i2 = 0; i2 < cleanups.length; i2 += 1) { |
| 3585 |
const cleanup = cleanups[i2]; |
| 3586 |
if (cleanup) { |
| 3587 |
cleanup(); |
| 3588 |
} |
| 3589 |
} |
| 3590 |
}; |
| 3591 |
} |
| 3592 |
|
| 3593 |
// node_modules/@base-ui/react/esm/utils/FocusGuard.js |
| 3594 |
var React14 = __toESM(require_react(), 1); |
| 3595 |
|
| 3596 |
// node_modules/@base-ui/utils/esm/visuallyHidden.js |
| 3597 |
var visuallyHiddenBase = { |
| 3598 |
clipPath: "inset(50%)", |
| 3599 |
overflow: "hidden", |
| 3600 |
whiteSpace: "nowrap", |
| 3601 |
border: 0, |
| 3602 |
padding: 0, |
| 3603 |
width: 1, |
| 3604 |
height: 1, |
| 3605 |
margin: -1 |
| 3606 |
}; |
| 3607 |
var visuallyHidden = { |
| 3608 |
...visuallyHiddenBase, |
| 3609 |
position: "fixed", |
| 3610 |
top: 0, |
| 3611 |
left: 0 |
| 3612 |
}; |
| 3613 |
var visuallyHiddenInput = { |
| 3614 |
...visuallyHiddenBase, |
| 3615 |
position: "absolute" |
| 3616 |
}; |
| 3617 |
|
| 3618 |
// node_modules/@base-ui/react/esm/utils/FocusGuard.js |
| 3619 |
var import_jsx_runtime32 = __toESM(require_jsx_runtime(), 1); |
| 3620 |
var FocusGuard = /* @__PURE__ */ React14.forwardRef(function FocusGuard2(props, ref) { |
| 3621 |
const [role, setRole] = React14.useState(); |
| 3622 |
useIsoLayoutEffect(() => { |
| 3623 |
if (isSafari) { |
| 3624 |
setRole("button"); |
| 3625 |
} |
| 3626 |
}, []); |
| 3627 |
const restProps = { |
| 3628 |
tabIndex: 0, |
| 3629 |
// Role is only for VoiceOver |
| 3630 |
role |
| 3631 |
}; |
| 3632 |
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { |
| 3633 |
...props, |
| 3634 |
ref, |
| 3635 |
style: visuallyHidden, |
| 3636 |
"aria-hidden": role ? void 0 : true, |
| 3637 |
...restProps, |
| 3638 |
"data-base-ui-focus-guard": "" |
| 3639 |
}); |
| 3640 |
}); |
| 3641 |
if (true) FocusGuard.displayName = "FocusGuard"; |
| 3642 |
|
| 3643 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/createAttribute.js |
| 3644 |
function createAttribute(name) { |
| 3645 |
return `data-base-ui-${name}`; |
| 3646 |
} |
| 3647 |
|
| 3648 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingPortal.js |
| 3649 |
var React15 = __toESM(require_react(), 1); |
| 3650 |
var ReactDOM2 = __toESM(require_react_dom(), 1); |
| 3651 |
|
| 3652 |
// node_modules/@base-ui/react/esm/internals/constants.js |
| 3653 |
var DISABLED_TRANSITIONS_STYLE = { |
| 3654 |
style: { |
| 3655 |
transition: "none" |
| 3656 |
} |
| 3657 |
}; |
| 3658 |
var BASE_UI_SWIPE_IGNORE_ATTRIBUTE = "data-base-ui-swipe-ignore"; |
| 3659 |
var LEGACY_SWIPE_IGNORE_ATTRIBUTE = "data-swipe-ignore"; |
| 3660 |
var BASE_UI_SWIPE_IGNORE_SELECTOR = `[${BASE_UI_SWIPE_IGNORE_ATTRIBUTE}]`; |
| 3661 |
var LEGACY_SWIPE_IGNORE_SELECTOR = `[${LEGACY_SWIPE_IGNORE_ATTRIBUTE}]`; |
| 3662 |
var POPUP_COLLISION_AVOIDANCE = { |
| 3663 |
fallbackAxisSide: "end" |
| 3664 |
}; |
| 3665 |
var ownerVisuallyHidden = { |
| 3666 |
clipPath: "inset(50%)", |
| 3667 |
position: "fixed", |
| 3668 |
top: 0, |
| 3669 |
left: 0 |
| 3670 |
}; |
| 3671 |
|
| 3672 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingPortal.js |
| 3673 |
var import_jsx_runtime33 = __toESM(require_jsx_runtime(), 1); |
| 3674 |
var PortalContext = /* @__PURE__ */ React15.createContext(null); |
| 3675 |
if (true) PortalContext.displayName = "PortalContext"; |
| 3676 |
var usePortalContext = () => React15.useContext(PortalContext); |
| 3677 |
var attr = createAttribute("portal"); |
| 3678 |
function useFloatingPortalNode(props = {}) { |
| 3679 |
const { |
| 3680 |
ref, |
| 3681 |
container: containerProp, |
| 3682 |
componentProps = EMPTY_OBJECT, |
| 3683 |
elementProps |
| 3684 |
} = props; |
| 3685 |
const uniqueId = useId(); |
| 3686 |
const portalContext = usePortalContext(); |
| 3687 |
const parentPortalNode = portalContext?.portalNode; |
| 3688 |
const [containerElement, setContainerElement] = React15.useState(null); |
| 3689 |
const [portalNode, setPortalNode] = React15.useState(null); |
| 3690 |
const setPortalNodeRef = useStableCallback((node) => { |
| 3691 |
if (node !== null) { |
| 3692 |
setPortalNode(node); |
| 3693 |
} |
| 3694 |
}); |
| 3695 |
const containerRef = React15.useRef(null); |
| 3696 |
useIsoLayoutEffect(() => { |
| 3697 |
if (containerProp === null) { |
| 3698 |
if (containerRef.current) { |
| 3699 |
containerRef.current = null; |
| 3700 |
setPortalNode(null); |
| 3701 |
setContainerElement(null); |
| 3702 |
} |
| 3703 |
return; |
| 3704 |
} |
| 3705 |
if (uniqueId == null) { |
| 3706 |
return; |
| 3707 |
} |
| 3708 |
const resolvedContainer = (containerProp && (isNode(containerProp) ? containerProp : containerProp.current)) ?? parentPortalNode ?? document.body; |
| 3709 |
if (resolvedContainer == null) { |
| 3710 |
if (containerRef.current) { |
| 3711 |
containerRef.current = null; |
| 3712 |
setPortalNode(null); |
| 3713 |
setContainerElement(null); |
| 3714 |
} |
| 3715 |
return; |
| 3716 |
} |
| 3717 |
if (containerRef.current !== resolvedContainer) { |
| 3718 |
containerRef.current = resolvedContainer; |
| 3719 |
setPortalNode(null); |
| 3720 |
setContainerElement(resolvedContainer); |
| 3721 |
} |
| 3722 |
}, [containerProp, parentPortalNode, uniqueId]); |
| 3723 |
const portalElement = useRenderElement("div", componentProps, { |
| 3724 |
ref: [ref, setPortalNodeRef], |
| 3725 |
props: [{ |
| 3726 |
id: uniqueId, |
| 3727 |
[attr]: "" |
| 3728 |
}, elementProps] |
| 3729 |
}); |
| 3730 |
const portalSubtree = containerElement && portalElement ? /* @__PURE__ */ ReactDOM2.createPortal(portalElement, containerElement) : null; |
| 3731 |
return { |
| 3732 |
portalNode, |
| 3733 |
portalSubtree |
| 3734 |
}; |
| 3735 |
} |
| 3736 |
var FloatingPortal = /* @__PURE__ */ React15.forwardRef(function FloatingPortal2(componentProps, forwardedRef) { |
| 3737 |
const { |
| 3738 |
render: render4, |
| 3739 |
className, |
| 3740 |
style, |
| 3741 |
children, |
| 3742 |
container, |
| 3743 |
renderGuards, |
| 3744 |
...elementProps |
| 3745 |
} = componentProps; |
| 3746 |
const { |
| 3747 |
portalNode, |
| 3748 |
portalSubtree |
| 3749 |
} = useFloatingPortalNode({ |
| 3750 |
container, |
| 3751 |
ref: forwardedRef, |
| 3752 |
componentProps, |
| 3753 |
elementProps |
| 3754 |
}); |
| 3755 |
const beforeOutsideRef = React15.useRef(null); |
| 3756 |
const afterOutsideRef = React15.useRef(null); |
| 3757 |
const beforeInsideRef = React15.useRef(null); |
| 3758 |
const afterInsideRef = React15.useRef(null); |
| 3759 |
const [focusManagerState, setFocusManagerState] = React15.useState(null); |
| 3760 |
const focusInsideDisabledRef = React15.useRef(false); |
| 3761 |
const modal = focusManagerState?.modal; |
| 3762 |
const open = focusManagerState?.open; |
| 3763 |
const shouldRenderGuards = typeof renderGuards === "boolean" ? renderGuards : !!focusManagerState && !focusManagerState.modal && focusManagerState.open && !!portalNode; |
| 3764 |
React15.useEffect(() => { |
| 3765 |
if (!portalNode || modal) { |
| 3766 |
return void 0; |
| 3767 |
} |
| 3768 |
function onFocus(event) { |
| 3769 |
if (portalNode && event.relatedTarget && isOutsideEvent(event)) { |
| 3770 |
if (event.type === "focusin") { |
| 3771 |
if (focusInsideDisabledRef.current) { |
| 3772 |
enableFocusInside(portalNode); |
| 3773 |
focusInsideDisabledRef.current = false; |
| 3774 |
} |
| 3775 |
} else { |
| 3776 |
disableFocusInside(portalNode); |
| 3777 |
focusInsideDisabledRef.current = true; |
| 3778 |
} |
| 3779 |
} |
| 3780 |
} |
| 3781 |
return mergeCleanups(addEventListener(portalNode, "focusin", onFocus, true), addEventListener(portalNode, "focusout", onFocus, true)); |
| 3782 |
}, [portalNode, modal]); |
| 3783 |
React15.useEffect(() => { |
| 3784 |
if (!portalNode || open !== false) { |
| 3785 |
return; |
| 3786 |
} |
| 3787 |
enableFocusInside(portalNode); |
| 3788 |
focusInsideDisabledRef.current = false; |
| 3789 |
}, [open, portalNode]); |
| 3790 |
const portalContextValue = React15.useMemo(() => ({ |
| 3791 |
beforeOutsideRef, |
| 3792 |
afterOutsideRef, |
| 3793 |
beforeInsideRef, |
| 3794 |
afterInsideRef, |
| 3795 |
portalNode, |
| 3796 |
setFocusManagerState |
| 3797 |
}), [portalNode]); |
| 3798 |
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(React15.Fragment, { |
| 3799 |
children: [portalSubtree, /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(PortalContext.Provider, { |
| 3800 |
value: portalContextValue, |
| 3801 |
children: [shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(FocusGuard, { |
| 3802 |
"data-type": "outside", |
| 3803 |
ref: beforeOutsideRef, |
| 3804 |
onFocus: (event) => { |
| 3805 |
if (isOutsideEvent(event, portalNode)) { |
| 3806 |
beforeInsideRef.current?.focus(); |
| 3807 |
} else { |
| 3808 |
const domReference = focusManagerState ? focusManagerState.domReference : null; |
| 3809 |
const prevTabbable = getPreviousTabbable(domReference); |
| 3810 |
prevTabbable?.focus(); |
| 3811 |
} |
| 3812 |
} |
| 3813 |
}), shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { |
| 3814 |
"aria-owns": portalNode.id, |
| 3815 |
style: ownerVisuallyHidden |
| 3816 |
}), portalNode && /* @__PURE__ */ ReactDOM2.createPortal(children, portalNode), shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(FocusGuard, { |
| 3817 |
"data-type": "outside", |
| 3818 |
ref: afterOutsideRef, |
| 3819 |
onFocus: (event) => { |
| 3820 |
if (isOutsideEvent(event, portalNode)) { |
| 3821 |
afterInsideRef.current?.focus(); |
| 3822 |
} else { |
| 3823 |
const domReference = focusManagerState ? focusManagerState.domReference : null; |
| 3824 |
const nextTabbable = getNextTabbable(domReference); |
| 3825 |
nextTabbable?.focus(); |
| 3826 |
if (focusManagerState?.closeOnFocusOut) { |
| 3827 |
focusManagerState?.onOpenChange(false, createChangeEventDetails(reason_parts_exports.focusOut, event.nativeEvent)); |
| 3828 |
} |
| 3829 |
} |
| 3830 |
} |
| 3831 |
})] |
| 3832 |
})] |
| 3833 |
}); |
| 3834 |
}); |
| 3835 |
if (true) FloatingPortal.displayName = "FloatingPortal"; |
| 3836 |
|
| 3837 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingTree.js |
| 3838 |
var React16 = __toESM(require_react(), 1); |
| 3839 |
|
| 3840 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/createEventEmitter.js |
| 3841 |
function createEventEmitter() { |
| 3842 |
const map = /* @__PURE__ */ new Map(); |
| 3843 |
return { |
| 3844 |
emit(event, data) { |
| 3845 |
map.get(event)?.forEach((listener) => listener(data)); |
| 3846 |
}, |
| 3847 |
on(event, listener) { |
| 3848 |
if (!map.has(event)) { |
| 3849 |
map.set(event, /* @__PURE__ */ new Set()); |
| 3850 |
} |
| 3851 |
map.get(event).add(listener); |
| 3852 |
}, |
| 3853 |
off(event, listener) { |
| 3854 |
map.get(event)?.delete(listener); |
| 3855 |
} |
| 3856 |
}; |
| 3857 |
} |
| 3858 |
|
| 3859 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingTree.js |
| 3860 |
var import_jsx_runtime34 = __toESM(require_jsx_runtime(), 1); |
| 3861 |
var FloatingNodeContext = /* @__PURE__ */ React16.createContext(null); |
| 3862 |
if (true) FloatingNodeContext.displayName = "FloatingNodeContext"; |
| 3863 |
var FloatingTreeContext = /* @__PURE__ */ React16.createContext(null); |
| 3864 |
if (true) FloatingTreeContext.displayName = "FloatingTreeContext"; |
| 3865 |
var useFloatingParentNodeId = () => React16.useContext(FloatingNodeContext)?.id || null; |
| 3866 |
var useFloatingTree = (externalTree) => { |
| 3867 |
const contextTree = React16.useContext(FloatingTreeContext); |
| 3868 |
return externalTree ?? contextTree; |
| 3869 |
}; |
| 3870 |
|
| 3871 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useClientPoint.js |
| 3872 |
var React17 = __toESM(require_react(), 1); |
| 3873 |
function createVirtualElement(domElement, data) { |
| 3874 |
let offsetX = null; |
| 3875 |
let offsetY = null; |
| 3876 |
let isAutoUpdateEvent = false; |
| 3877 |
return { |
| 3878 |
contextElement: domElement || void 0, |
| 3879 |
getBoundingClientRect() { |
| 3880 |
const domRect = domElement?.getBoundingClientRect() || { |
| 3881 |
width: 0, |
| 3882 |
height: 0, |
| 3883 |
x: 0, |
| 3884 |
y: 0 |
| 3885 |
}; |
| 3886 |
const isXAxis = data.axis === "x" || data.axis === "both"; |
| 3887 |
const isYAxis = data.axis === "y" || data.axis === "both"; |
| 3888 |
const canTrackCursorOnAutoUpdate = ["mouseenter", "mousemove"].includes(data.dataRef.current.openEvent?.type || "") && data.pointerType !== "touch"; |
| 3889 |
let width = domRect.width; |
| 3890 |
let height = domRect.height; |
| 3891 |
let x2 = domRect.x; |
| 3892 |
let y2 = domRect.y; |
| 3893 |
if (offsetX == null && data.x && isXAxis) { |
| 3894 |
offsetX = domRect.x - data.x; |
| 3895 |
} |
| 3896 |
if (offsetY == null && data.y && isYAxis) { |
| 3897 |
offsetY = domRect.y - data.y; |
| 3898 |
} |
| 3899 |
x2 -= offsetX || 0; |
| 3900 |
y2 -= offsetY || 0; |
| 3901 |
width = 0; |
| 3902 |
height = 0; |
| 3903 |
if (!isAutoUpdateEvent || canTrackCursorOnAutoUpdate) { |
| 3904 |
width = data.axis === "y" ? domRect.width : 0; |
| 3905 |
height = data.axis === "x" ? domRect.height : 0; |
| 3906 |
x2 = isXAxis && data.x != null ? data.x : x2; |
| 3907 |
y2 = isYAxis && data.y != null ? data.y : y2; |
| 3908 |
} else if (isAutoUpdateEvent && !canTrackCursorOnAutoUpdate) { |
| 3909 |
height = data.axis === "x" ? domRect.height : height; |
| 3910 |
width = data.axis === "y" ? domRect.width : width; |
| 3911 |
} |
| 3912 |
isAutoUpdateEvent = true; |
| 3913 |
return { |
| 3914 |
width, |
| 3915 |
height, |
| 3916 |
x: x2, |
| 3917 |
y: y2, |
| 3918 |
top: y2, |
| 3919 |
right: x2 + width, |
| 3920 |
bottom: y2 + height, |
| 3921 |
left: x2 |
| 3922 |
}; |
| 3923 |
} |
| 3924 |
}; |
| 3925 |
} |
| 3926 |
function isMouseBasedEvent(event) { |
| 3927 |
return event != null && event.clientX != null; |
| 3928 |
} |
| 3929 |
function useClientPoint(context, props = {}) { |
| 3930 |
const { |
| 3931 |
enabled = true, |
| 3932 |
axis = "both" |
| 3933 |
} = props; |
| 3934 |
const store = "rootStore" in context ? context.rootStore : context; |
| 3935 |
const open = store.useState("open"); |
| 3936 |
const floating = store.useState("floatingElement"); |
| 3937 |
const domReference = store.useState("domReferenceElement"); |
| 3938 |
const dataRef = store.context.dataRef; |
| 3939 |
const initialRef = React17.useRef(false); |
| 3940 |
const cleanupListenerRef = React17.useRef(null); |
| 3941 |
const [pointerType, setPointerType] = React17.useState(); |
| 3942 |
const [reactive, setReactive] = React17.useState([]); |
| 3943 |
const resetReference = useStableCallback((reference2) => { |
| 3944 |
store.set("positionReference", reference2); |
| 3945 |
}); |
| 3946 |
const setReference = useStableCallback((newX, newY, referenceElement) => { |
| 3947 |
if (initialRef.current) { |
| 3948 |
return; |
| 3949 |
} |
| 3950 |
if (dataRef.current.openEvent && !isMouseBasedEvent(dataRef.current.openEvent)) { |
| 3951 |
return; |
| 3952 |
} |
| 3953 |
store.set("positionReference", createVirtualElement(referenceElement ?? domReference, { |
| 3954 |
x: newX, |
| 3955 |
y: newY, |
| 3956 |
axis, |
| 3957 |
dataRef, |
| 3958 |
pointerType |
| 3959 |
})); |
| 3960 |
}); |
| 3961 |
const handleReferenceEnterOrMove = useStableCallback((event) => { |
| 3962 |
if (!open) { |
| 3963 |
setReference(event.clientX, event.clientY, event.currentTarget); |
| 3964 |
} else if (!cleanupListenerRef.current) { |
| 3965 |
setReference(event.clientX, event.clientY, event.currentTarget); |
| 3966 |
setReactive([]); |
| 3967 |
} |
| 3968 |
}); |
| 3969 |
const openCheck = isMouseLikePointerType(pointerType) ? floating : open; |
| 3970 |
React17.useEffect(() => { |
| 3971 |
if (!enabled) { |
| 3972 |
resetReference(domReference); |
| 3973 |
return void 0; |
| 3974 |
} |
| 3975 |
if (!openCheck) { |
| 3976 |
return void 0; |
| 3977 |
} |
| 3978 |
function cleanupListener() { |
| 3979 |
cleanupListenerRef.current?.(); |
| 3980 |
cleanupListenerRef.current = null; |
| 3981 |
} |
| 3982 |
const win = getWindow(floating); |
| 3983 |
function handleMouseMove(event) { |
| 3984 |
const target = getTarget(event); |
| 3985 |
if (!contains(floating, target)) { |
| 3986 |
setReference(event.clientX, event.clientY); |
| 3987 |
} else { |
| 3988 |
cleanupListener(); |
| 3989 |
} |
| 3990 |
} |
| 3991 |
if (!dataRef.current.openEvent || isMouseBasedEvent(dataRef.current.openEvent)) { |
| 3992 |
cleanupListenerRef.current = addEventListener(win, "mousemove", handleMouseMove); |
| 3993 |
} else { |
| 3994 |
resetReference(domReference); |
| 3995 |
} |
| 3996 |
return cleanupListener; |
| 3997 |
}, [openCheck, enabled, floating, dataRef, domReference, store, setReference, resetReference, reactive]); |
| 3998 |
React17.useEffect(() => () => { |
| 3999 |
store.set("positionReference", null); |
| 4000 |
}, [store]); |
| 4001 |
React17.useEffect(() => { |
| 4002 |
if (enabled && !floating) { |
| 4003 |
initialRef.current = false; |
| 4004 |
} |
| 4005 |
}, [enabled, floating]); |
| 4006 |
React17.useEffect(() => { |
| 4007 |
if (!enabled && open) { |
| 4008 |
initialRef.current = true; |
| 4009 |
} |
| 4010 |
}, [enabled, open]); |
| 4011 |
const reference = React17.useMemo(() => { |
| 4012 |
function setPointerTypeRef(event) { |
| 4013 |
setPointerType(event.pointerType); |
| 4014 |
} |
| 4015 |
return { |
| 4016 |
onPointerDown: setPointerTypeRef, |
| 4017 |
onPointerEnter: setPointerTypeRef, |
| 4018 |
onMouseMove: handleReferenceEnterOrMove, |
| 4019 |
onMouseEnter: handleReferenceEnterOrMove |
| 4020 |
}; |
| 4021 |
}, [handleReferenceEnterOrMove]); |
| 4022 |
return React17.useMemo(() => enabled ? { |
| 4023 |
reference, |
| 4024 |
trigger: reference |
| 4025 |
} : {}, [enabled, reference]); |
| 4026 |
} |
| 4027 |
|
| 4028 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useDismiss.js |
| 4029 |
var React18 = __toESM(require_react(), 1); |
| 4030 |
var bubbleHandlerKeys = { |
| 4031 |
intentional: "onClick", |
| 4032 |
sloppy: "onPointerDown" |
| 4033 |
}; |
| 4034 |
function alwaysFalse() { |
| 4035 |
return false; |
| 4036 |
} |
| 4037 |
function normalizeProp(normalizable) { |
| 4038 |
return { |
| 4039 |
escapeKey: typeof normalizable === "boolean" ? normalizable : normalizable?.escapeKey ?? false, |
| 4040 |
outsidePress: typeof normalizable === "boolean" ? normalizable : normalizable?.outsidePress ?? true |
| 4041 |
}; |
| 4042 |
} |
| 4043 |
function useDismiss(context, props = {}) { |
| 4044 |
const { |
| 4045 |
enabled = true, |
| 4046 |
escapeKey: escapeKey2 = true, |
| 4047 |
outsidePress: outsidePressProp = true, |
| 4048 |
outsidePressEvent = "sloppy", |
| 4049 |
referencePress = alwaysFalse, |
| 4050 |
referencePressEvent = "sloppy", |
| 4051 |
bubbles, |
| 4052 |
externalTree |
| 4053 |
} = props; |
| 4054 |
const store = "rootStore" in context ? context.rootStore : context; |
| 4055 |
const open = store.useState("open"); |
| 4056 |
const floatingElement = store.useState("floatingElement"); |
| 4057 |
const { |
| 4058 |
dataRef |
| 4059 |
} = store.context; |
| 4060 |
const tree = useFloatingTree(externalTree); |
| 4061 |
const outsidePressFn = useStableCallback(typeof outsidePressProp === "function" ? outsidePressProp : () => false); |
| 4062 |
const outsidePress2 = typeof outsidePressProp === "function" ? outsidePressFn : outsidePressProp; |
| 4063 |
const outsidePressEnabled = outsidePress2 !== false; |
| 4064 |
const getOutsidePressEventProp = useStableCallback(() => outsidePressEvent); |
| 4065 |
const { |
| 4066 |
escapeKey: escapeKeyBubbles, |
| 4067 |
outsidePress: outsidePressBubbles |
| 4068 |
} = normalizeProp(bubbles); |
| 4069 |
const pressStartedInsideRef = React18.useRef(false); |
| 4070 |
const pressStartPreventedRef = React18.useRef(false); |
| 4071 |
const suppressNextOutsideClickRef = React18.useRef(false); |
| 4072 |
const isComposingRef = React18.useRef(false); |
| 4073 |
const currentPointerTypeRef = React18.useRef(""); |
| 4074 |
const touchStateRef = React18.useRef(null); |
| 4075 |
const cancelDismissOnEndTimeout = useTimeout(); |
| 4076 |
const clearInsideReactTreeTimeout = useTimeout(); |
| 4077 |
const clearInsideReactTree = useStableCallback(() => { |
| 4078 |
clearInsideReactTreeTimeout.clear(); |
| 4079 |
dataRef.current.insideReactTree = false; |
| 4080 |
}); |
| 4081 |
const hasBlockingChild = useStableCallback((bubbleKey) => { |
| 4082 |
const nodeId = dataRef.current.floatingContext?.nodeId; |
| 4083 |
const children = tree ? getNodeChildren(tree.nodesRef.current, nodeId) : []; |
| 4084 |
return children.some((child) => child.context?.open && !child.context.dataRef.current[bubbleKey]); |
| 4085 |
}); |
| 4086 |
const isEventWithinOwnElements = useStableCallback((event) => { |
| 4087 |
return isEventTargetWithin(event, store.select("floatingElement")) || isEventTargetWithin(event, store.select("domReferenceElement")); |
| 4088 |
}); |
| 4089 |
const closeOnReferencePress = useStableCallback((event) => { |
| 4090 |
if (!referencePress()) { |
| 4091 |
return; |
| 4092 |
} |
| 4093 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerPress, event.nativeEvent)); |
| 4094 |
}); |
| 4095 |
const closeOnEscapeKeyDown = useStableCallback((event) => { |
| 4096 |
if (!open || !enabled || !escapeKey2 || event.key !== "Escape") { |
| 4097 |
return; |
| 4098 |
} |
| 4099 |
if (isComposingRef.current) { |
| 4100 |
return; |
| 4101 |
} |
| 4102 |
if (!escapeKeyBubbles && hasBlockingChild("__escapeKeyBubbles")) { |
| 4103 |
return; |
| 4104 |
} |
| 4105 |
const native = isReactEvent(event) ? event.nativeEvent : event; |
| 4106 |
const eventDetails = createChangeEventDetails(reason_parts_exports.escapeKey, native); |
| 4107 |
store.setOpen(false, eventDetails); |
| 4108 |
if (!eventDetails.isCanceled) { |
| 4109 |
event.preventDefault(); |
| 4110 |
} |
| 4111 |
if (!escapeKeyBubbles && !eventDetails.isPropagationAllowed) { |
| 4112 |
event.stopPropagation(); |
| 4113 |
} |
| 4114 |
}); |
| 4115 |
const markInsideReactTree = useStableCallback(() => { |
| 4116 |
dataRef.current.insideReactTree = true; |
| 4117 |
clearInsideReactTreeTimeout.start(0, clearInsideReactTree); |
| 4118 |
}); |
| 4119 |
const markPressStartedInsideReactTree = useStableCallback((event) => { |
| 4120 |
if (!open || !enabled || event.button !== 0) { |
| 4121 |
return; |
| 4122 |
} |
| 4123 |
const target = getTarget(event.nativeEvent); |
| 4124 |
if (!contains(store.select("floatingElement"), target)) { |
| 4125 |
return; |
| 4126 |
} |
| 4127 |
if (!pressStartedInsideRef.current) { |
| 4128 |
pressStartedInsideRef.current = true; |
| 4129 |
pressStartPreventedRef.current = false; |
| 4130 |
} |
| 4131 |
}); |
| 4132 |
const markInsidePressStartPrevented = useStableCallback((event) => { |
| 4133 |
if (!open || !enabled) { |
| 4134 |
return; |
| 4135 |
} |
| 4136 |
if (!(event.defaultPrevented || event.nativeEvent.defaultPrevented)) { |
| 4137 |
return; |
| 4138 |
} |
| 4139 |
if (pressStartedInsideRef.current) { |
| 4140 |
pressStartPreventedRef.current = true; |
| 4141 |
} |
| 4142 |
}); |
| 4143 |
React18.useEffect(() => { |
| 4144 |
if (!open || !enabled) { |
| 4145 |
return void 0; |
| 4146 |
} |
| 4147 |
dataRef.current.__escapeKeyBubbles = escapeKeyBubbles; |
| 4148 |
dataRef.current.__outsidePressBubbles = outsidePressBubbles; |
| 4149 |
const compositionTimeout = new Timeout(); |
| 4150 |
const preventedPressSuppressionTimeout = new Timeout(); |
| 4151 |
function handleCompositionStart() { |
| 4152 |
compositionTimeout.clear(); |
| 4153 |
isComposingRef.current = true; |
| 4154 |
} |
| 4155 |
function handleCompositionEnd() { |
| 4156 |
compositionTimeout.start( |
| 4157 |
// 0ms or 1ms don't work in Safari. 5ms appears to consistently work. |
| 4158 |
// Only apply to WebKit for the test to remain 0ms. |
| 4159 |
isWebKit() ? 5 : 0, |
| 4160 |
() => { |
| 4161 |
isComposingRef.current = false; |
| 4162 |
} |
| 4163 |
); |
| 4164 |
} |
| 4165 |
function suppressImmediateOutsideClickAfterPreventedStart() { |
| 4166 |
suppressNextOutsideClickRef.current = true; |
| 4167 |
preventedPressSuppressionTimeout.start(0, () => { |
| 4168 |
suppressNextOutsideClickRef.current = false; |
| 4169 |
}); |
| 4170 |
} |
| 4171 |
function resetPressStartState() { |
| 4172 |
pressStartedInsideRef.current = false; |
| 4173 |
pressStartPreventedRef.current = false; |
| 4174 |
} |
| 4175 |
function getOutsidePressEvent() { |
| 4176 |
const type = currentPointerTypeRef.current; |
| 4177 |
const computedType = type === "pen" || !type ? "mouse" : type; |
| 4178 |
const outsidePressEventValue = getOutsidePressEventProp(); |
| 4179 |
const resolved = typeof outsidePressEventValue === "function" ? outsidePressEventValue() : outsidePressEventValue; |
| 4180 |
if (typeof resolved === "string") { |
| 4181 |
return resolved; |
| 4182 |
} |
| 4183 |
return resolved[computedType]; |
| 4184 |
} |
| 4185 |
function shouldIgnoreEvent(event) { |
| 4186 |
const computedOutsidePressEvent = getOutsidePressEvent(); |
| 4187 |
return computedOutsidePressEvent === "intentional" && event.type !== "click" || computedOutsidePressEvent === "sloppy" && event.type === "click"; |
| 4188 |
} |
| 4189 |
function isEventWithinFloatingTree(event) { |
| 4190 |
const nodeId = dataRef.current.floatingContext?.nodeId; |
| 4191 |
const targetIsInsideChildren = tree && getNodeChildren(tree.nodesRef.current, nodeId).some((node) => isEventTargetWithin(event, node.context?.elements.floating)); |
| 4192 |
return isEventWithinOwnElements(event) || targetIsInsideChildren; |
| 4193 |
} |
| 4194 |
function closeOnPressOutside(event) { |
| 4195 |
if (shouldIgnoreEvent(event)) { |
| 4196 |
if (event.type !== "click" && !isEventWithinOwnElements(event)) { |
| 4197 |
preventedPressSuppressionTimeout.clear(); |
| 4198 |
suppressNextOutsideClickRef.current = false; |
| 4199 |
} |
| 4200 |
clearInsideReactTree(); |
| 4201 |
return; |
| 4202 |
} |
| 4203 |
if (dataRef.current.insideReactTree) { |
| 4204 |
clearInsideReactTree(); |
| 4205 |
return; |
| 4206 |
} |
| 4207 |
const target = getTarget(event); |
| 4208 |
const inertSelector = `[${createAttribute("inert")}]`; |
| 4209 |
const targetRoot = isElement(target) ? target.getRootNode() : null; |
| 4210 |
const markers = Array.from((isShadowRoot(targetRoot) ? targetRoot : ownerDocument(store.select("floatingElement"))).querySelectorAll(inertSelector)); |
| 4211 |
const triggers = store.context.triggerElements; |
| 4212 |
if (target && (triggers.hasElement(target) || triggers.hasMatchingElement((trigger) => contains(trigger, target)))) { |
| 4213 |
return; |
| 4214 |
} |
| 4215 |
let targetRootAncestor = isElement(target) ? target : null; |
| 4216 |
while (targetRootAncestor && !isLastTraversableNode(targetRootAncestor)) { |
| 4217 |
const nextParent = getParentNode(targetRootAncestor); |
| 4218 |
if (isLastTraversableNode(nextParent) || !isElement(nextParent)) { |
| 4219 |
break; |
| 4220 |
} |
| 4221 |
targetRootAncestor = nextParent; |
| 4222 |
} |
| 4223 |
if (markers.length && isElement(target) && !isRootElement(target) && // Clicked on a direct ancestor (e.g. FloatingOverlay). |
| 4224 |
!contains(target, store.select("floatingElement")) && // If the target root element contains none of the markers, then the |
| 4225 |
// element was injected after the floating element rendered. |
| 4226 |
markers.every((marker) => !contains(targetRootAncestor, marker))) { |
| 4227 |
return; |
| 4228 |
} |
| 4229 |
if (isHTMLElement(target) && !("touches" in event)) { |
| 4230 |
const lastTraversableNode = isLastTraversableNode(target); |
| 4231 |
const style = getComputedStyle2(target); |
| 4232 |
const scrollRe = /auto|scroll/; |
| 4233 |
const isScrollableX = lastTraversableNode || scrollRe.test(style.overflowX); |
| 4234 |
const isScrollableY = lastTraversableNode || scrollRe.test(style.overflowY); |
| 4235 |
const canScrollX = isScrollableX && target.clientWidth > 0 && target.scrollWidth > target.clientWidth; |
| 4236 |
const canScrollY = isScrollableY && target.clientHeight > 0 && target.scrollHeight > target.clientHeight; |
| 4237 |
const isRTL7 = style.direction === "rtl"; |
| 4238 |
const pressedVerticalScrollbar = canScrollY && (isRTL7 ? event.offsetX <= target.offsetWidth - target.clientWidth : event.offsetX > target.clientWidth); |
| 4239 |
const pressedHorizontalScrollbar = canScrollX && event.offsetY > target.clientHeight; |
| 4240 |
if (pressedVerticalScrollbar || pressedHorizontalScrollbar) { |
| 4241 |
return; |
| 4242 |
} |
| 4243 |
} |
| 4244 |
if (isEventWithinFloatingTree(event)) { |
| 4245 |
return; |
| 4246 |
} |
| 4247 |
if (getOutsidePressEvent() === "intentional" && suppressNextOutsideClickRef.current) { |
| 4248 |
preventedPressSuppressionTimeout.clear(); |
| 4249 |
suppressNextOutsideClickRef.current = false; |
| 4250 |
return; |
| 4251 |
} |
| 4252 |
if (typeof outsidePress2 === "function" && !outsidePress2(event)) { |
| 4253 |
return; |
| 4254 |
} |
| 4255 |
if (hasBlockingChild("__outsidePressBubbles")) { |
| 4256 |
return; |
| 4257 |
} |
| 4258 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.outsidePress, event)); |
| 4259 |
clearInsideReactTree(); |
| 4260 |
} |
| 4261 |
function handlePointerDown(event) { |
| 4262 |
if (getOutsidePressEvent() !== "sloppy" || event.pointerType === "touch" || !store.select("open") || !enabled || isEventWithinOwnElements(event)) { |
| 4263 |
return; |
| 4264 |
} |
| 4265 |
closeOnPressOutside(event); |
| 4266 |
} |
| 4267 |
function handleTouchStart(event) { |
| 4268 |
if (getOutsidePressEvent() !== "sloppy" || !store.select("open") || !enabled || isEventWithinOwnElements(event)) { |
| 4269 |
return; |
| 4270 |
} |
| 4271 |
const touch = event.touches[0]; |
| 4272 |
if (touch) { |
| 4273 |
touchStateRef.current = { |
| 4274 |
startTime: Date.now(), |
| 4275 |
startX: touch.clientX, |
| 4276 |
startY: touch.clientY, |
| 4277 |
dismissOnTouchEnd: false, |
| 4278 |
dismissOnMouseDown: true |
| 4279 |
}; |
| 4280 |
cancelDismissOnEndTimeout.start(1e3, () => { |
| 4281 |
if (touchStateRef.current) { |
| 4282 |
touchStateRef.current.dismissOnTouchEnd = false; |
| 4283 |
touchStateRef.current.dismissOnMouseDown = false; |
| 4284 |
} |
| 4285 |
}); |
| 4286 |
} |
| 4287 |
} |
| 4288 |
function addTargetEventListenerOnce(event, listener) { |
| 4289 |
const target = getTarget(event); |
| 4290 |
if (!target) { |
| 4291 |
return; |
| 4292 |
} |
| 4293 |
const unsubscribe2 = addEventListener(target, event.type, () => { |
| 4294 |
listener(event); |
| 4295 |
unsubscribe2(); |
| 4296 |
}); |
| 4297 |
} |
| 4298 |
function handleTouchStartCapture(event) { |
| 4299 |
currentPointerTypeRef.current = "touch"; |
| 4300 |
addTargetEventListenerOnce(event, handleTouchStart); |
| 4301 |
} |
| 4302 |
function closeOnPressOutsideCapture(event) { |
| 4303 |
cancelDismissOnEndTimeout.clear(); |
| 4304 |
if (event.type === "pointerdown") { |
| 4305 |
currentPointerTypeRef.current = event.pointerType; |
| 4306 |
} |
| 4307 |
if (event.type === "mousedown" && touchStateRef.current && !touchStateRef.current.dismissOnMouseDown) { |
| 4308 |
return; |
| 4309 |
} |
| 4310 |
addTargetEventListenerOnce(event, (targetEvent) => { |
| 4311 |
if (targetEvent.type === "pointerdown") { |
| 4312 |
handlePointerDown(targetEvent); |
| 4313 |
} else { |
| 4314 |
closeOnPressOutside(targetEvent); |
| 4315 |
} |
| 4316 |
}); |
| 4317 |
} |
| 4318 |
function handlePressEndCapture(event) { |
| 4319 |
if (!pressStartedInsideRef.current) { |
| 4320 |
return; |
| 4321 |
} |
| 4322 |
const pressStartedInsideDefaultPrevented = pressStartPreventedRef.current; |
| 4323 |
resetPressStartState(); |
| 4324 |
if (getOutsidePressEvent() !== "intentional") { |
| 4325 |
return; |
| 4326 |
} |
| 4327 |
if (event.type === "pointercancel") { |
| 4328 |
if (pressStartedInsideDefaultPrevented) { |
| 4329 |
suppressImmediateOutsideClickAfterPreventedStart(); |
| 4330 |
} |
| 4331 |
return; |
| 4332 |
} |
| 4333 |
if (isEventWithinFloatingTree(event)) { |
| 4334 |
return; |
| 4335 |
} |
| 4336 |
if (pressStartedInsideDefaultPrevented) { |
| 4337 |
suppressImmediateOutsideClickAfterPreventedStart(); |
| 4338 |
return; |
| 4339 |
} |
| 4340 |
if (typeof outsidePress2 === "function" && !outsidePress2(event)) { |
| 4341 |
return; |
| 4342 |
} |
| 4343 |
preventedPressSuppressionTimeout.clear(); |
| 4344 |
suppressNextOutsideClickRef.current = true; |
| 4345 |
clearInsideReactTree(); |
| 4346 |
} |
| 4347 |
function handleTouchMove(event) { |
| 4348 |
if (getOutsidePressEvent() !== "sloppy" || !touchStateRef.current || isEventWithinOwnElements(event)) { |
| 4349 |
return; |
| 4350 |
} |
| 4351 |
const touch = event.touches[0]; |
| 4352 |
if (!touch) { |
| 4353 |
return; |
| 4354 |
} |
| 4355 |
const deltaX = Math.abs(touch.clientX - touchStateRef.current.startX); |
| 4356 |
const deltaY = Math.abs(touch.clientY - touchStateRef.current.startY); |
| 4357 |
const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY); |
| 4358 |
if (distance > 5) { |
| 4359 |
touchStateRef.current.dismissOnTouchEnd = true; |
| 4360 |
} |
| 4361 |
if (distance > 10) { |
| 4362 |
closeOnPressOutside(event); |
| 4363 |
cancelDismissOnEndTimeout.clear(); |
| 4364 |
touchStateRef.current = null; |
| 4365 |
} |
| 4366 |
} |
| 4367 |
function handleTouchMoveCapture(event) { |
| 4368 |
addTargetEventListenerOnce(event, handleTouchMove); |
| 4369 |
} |
| 4370 |
function handleTouchEnd(event) { |
| 4371 |
if (getOutsidePressEvent() !== "sloppy" || !touchStateRef.current || isEventWithinOwnElements(event)) { |
| 4372 |
return; |
| 4373 |
} |
| 4374 |
if (touchStateRef.current.dismissOnTouchEnd) { |
| 4375 |
closeOnPressOutside(event); |
| 4376 |
} |
| 4377 |
cancelDismissOnEndTimeout.clear(); |
| 4378 |
touchStateRef.current = null; |
| 4379 |
} |
| 4380 |
function handleTouchEndCapture(event) { |
| 4381 |
addTargetEventListenerOnce(event, handleTouchEnd); |
| 4382 |
} |
| 4383 |
const doc = ownerDocument(floatingElement); |
| 4384 |
const unsubscribe = mergeCleanups(escapeKey2 && mergeCleanups(addEventListener(doc, "keydown", closeOnEscapeKeyDown), addEventListener(doc, "compositionstart", handleCompositionStart), addEventListener(doc, "compositionend", handleCompositionEnd)), outsidePressEnabled && mergeCleanups(addEventListener(doc, "click", closeOnPressOutsideCapture, true), addEventListener(doc, "pointerdown", closeOnPressOutsideCapture, true), addEventListener(doc, "pointerup", handlePressEndCapture, true), addEventListener(doc, "pointercancel", handlePressEndCapture, true), addEventListener(doc, "mousedown", closeOnPressOutsideCapture, true), addEventListener(doc, "mouseup", handlePressEndCapture, true), addEventListener(doc, "touchstart", handleTouchStartCapture, true), addEventListener(doc, "touchmove", handleTouchMoveCapture, true), addEventListener(doc, "touchend", handleTouchEndCapture, true))); |
| 4385 |
return () => { |
| 4386 |
unsubscribe(); |
| 4387 |
compositionTimeout.clear(); |
| 4388 |
preventedPressSuppressionTimeout.clear(); |
| 4389 |
resetPressStartState(); |
| 4390 |
suppressNextOutsideClickRef.current = false; |
| 4391 |
}; |
| 4392 |
}, [dataRef, floatingElement, escapeKey2, outsidePressEnabled, outsidePress2, open, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, clearInsideReactTree, getOutsidePressEventProp, hasBlockingChild, isEventWithinOwnElements, tree, store, cancelDismissOnEndTimeout]); |
| 4393 |
React18.useEffect(clearInsideReactTree, [outsidePress2, clearInsideReactTree]); |
| 4394 |
const reference = React18.useMemo(() => ({ |
| 4395 |
onKeyDown: closeOnEscapeKeyDown, |
| 4396 |
[bubbleHandlerKeys[referencePressEvent]]: closeOnReferencePress, |
| 4397 |
...referencePressEvent !== "intentional" && { |
| 4398 |
onClick: closeOnReferencePress |
| 4399 |
} |
| 4400 |
}), [closeOnEscapeKeyDown, closeOnReferencePress, referencePressEvent]); |
| 4401 |
const floating = React18.useMemo(() => ({ |
| 4402 |
onKeyDown: closeOnEscapeKeyDown, |
| 4403 |
// `onMouseDown` may be blocked if `event.preventDefault()` is called in |
| 4404 |
// `onPointerDown`, such as with <NumberField.ScrubArea>. |
| 4405 |
// See https://github.com/mui/base-ui/pull/3379 |
| 4406 |
onPointerDown: markInsidePressStartPrevented, |
| 4407 |
onMouseDown: markInsidePressStartPrevented, |
| 4408 |
onClickCapture: markInsideReactTree, |
| 4409 |
onMouseDownCapture(event) { |
| 4410 |
markInsideReactTree(); |
| 4411 |
markPressStartedInsideReactTree(event); |
| 4412 |
}, |
| 4413 |
onPointerDownCapture(event) { |
| 4414 |
markInsideReactTree(); |
| 4415 |
markPressStartedInsideReactTree(event); |
| 4416 |
}, |
| 4417 |
onMouseUpCapture: markInsideReactTree, |
| 4418 |
onTouchEndCapture: markInsideReactTree, |
| 4419 |
onTouchMoveCapture: markInsideReactTree |
| 4420 |
}), [closeOnEscapeKeyDown, markInsideReactTree, markPressStartedInsideReactTree, markInsidePressStartPrevented]); |
| 4421 |
return React18.useMemo(() => enabled ? { |
| 4422 |
reference, |
| 4423 |
floating, |
| 4424 |
trigger: reference |
| 4425 |
} : {}, [enabled, reference, floating]); |
| 4426 |
} |
| 4427 |
|
| 4428 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useFloating.js |
| 4429 |
var React25 = __toESM(require_react(), 1); |
| 4430 |
|
| 4431 |
// node_modules/@floating-ui/core/dist/floating-ui.core.mjs |
| 4432 |
function computeCoordsFromPlacement(_ref, placement, rtl) { |
| 4433 |
let { |
| 4434 |
reference, |
| 4435 |
floating |
| 4436 |
} = _ref; |
| 4437 |
const sideAxis = getSideAxis(placement); |
| 4438 |
const alignmentAxis = getAlignmentAxis(placement); |
| 4439 |
const alignLength = getAxisLength(alignmentAxis); |
| 4440 |
const side = getSide(placement); |
| 4441 |
const isVertical = sideAxis === "y"; |
| 4442 |
const commonX = reference.x + reference.width / 2 - floating.width / 2; |
| 4443 |
const commonY = reference.y + reference.height / 2 - floating.height / 2; |
| 4444 |
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2; |
| 4445 |
let coords; |
| 4446 |
switch (side) { |
| 4447 |
case "top": |
| 4448 |
coords = { |
| 4449 |
x: commonX, |
| 4450 |
y: reference.y - floating.height |
| 4451 |
}; |
| 4452 |
break; |
| 4453 |
case "bottom": |
| 4454 |
coords = { |
| 4455 |
x: commonX, |
| 4456 |
y: reference.y + reference.height |
| 4457 |
}; |
| 4458 |
break; |
| 4459 |
case "right": |
| 4460 |
coords = { |
| 4461 |
x: reference.x + reference.width, |
| 4462 |
y: commonY |
| 4463 |
}; |
| 4464 |
break; |
| 4465 |
case "left": |
| 4466 |
coords = { |
| 4467 |
x: reference.x - floating.width, |
| 4468 |
y: commonY |
| 4469 |
}; |
| 4470 |
break; |
| 4471 |
default: |
| 4472 |
coords = { |
| 4473 |
x: reference.x, |
| 4474 |
y: reference.y |
| 4475 |
}; |
| 4476 |
} |
| 4477 |
switch (getAlignment(placement)) { |
| 4478 |
case "start": |
| 4479 |
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1); |
| 4480 |
break; |
| 4481 |
case "end": |
| 4482 |
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1); |
| 4483 |
break; |
| 4484 |
} |
| 4485 |
return coords; |
| 4486 |
} |
| 4487 |
async function detectOverflow(state, options) { |
| 4488 |
var _await$platform$isEle; |
| 4489 |
if (options === void 0) { |
| 4490 |
options = {}; |
| 4491 |
} |
| 4492 |
const { |
| 4493 |
x: x2, |
| 4494 |
y: y2, |
| 4495 |
platform: platform3, |
| 4496 |
rects, |
| 4497 |
elements, |
| 4498 |
strategy |
| 4499 |
} = state; |
| 4500 |
const { |
| 4501 |
boundary = "clippingAncestors", |
| 4502 |
rootBoundary = "viewport", |
| 4503 |
elementContext = "floating", |
| 4504 |
altBoundary = false, |
| 4505 |
padding = 0 |
| 4506 |
} = evaluate(options, state); |
| 4507 |
const paddingObject = getPaddingObject(padding); |
| 4508 |
const altContext = elementContext === "floating" ? "reference" : "floating"; |
| 4509 |
const element = elements[altBoundary ? altContext : elementContext]; |
| 4510 |
const clippingClientRect = rectToClientRect(await platform3.getClippingRect({ |
| 4511 |
element: ((_await$platform$isEle = await (platform3.isElement == null ? void 0 : platform3.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform3.getDocumentElement == null ? void 0 : platform3.getDocumentElement(elements.floating)), |
| 4512 |
boundary, |
| 4513 |
rootBoundary, |
| 4514 |
strategy |
| 4515 |
})); |
| 4516 |
const rect = elementContext === "floating" ? { |
| 4517 |
x: x2, |
| 4518 |
y: y2, |
| 4519 |
width: rects.floating.width, |
| 4520 |
height: rects.floating.height |
| 4521 |
} : rects.reference; |
| 4522 |
const offsetParent = await (platform3.getOffsetParent == null ? void 0 : platform3.getOffsetParent(elements.floating)); |
| 4523 |
const offsetScale = await (platform3.isElement == null ? void 0 : platform3.isElement(offsetParent)) ? await (platform3.getScale == null ? void 0 : platform3.getScale(offsetParent)) || { |
| 4524 |
x: 1, |
| 4525 |
y: 1 |
| 4526 |
} : { |
| 4527 |
x: 1, |
| 4528 |
y: 1 |
| 4529 |
}; |
| 4530 |
const elementClientRect = rectToClientRect(platform3.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform3.convertOffsetParentRelativeRectToViewportRelativeRect({ |
| 4531 |
elements, |
| 4532 |
rect, |
| 4533 |
offsetParent, |
| 4534 |
strategy |
| 4535 |
}) : rect); |
| 4536 |
return { |
| 4537 |
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y, |
| 4538 |
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y, |
| 4539 |
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x, |
| 4540 |
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x |
| 4541 |
}; |
| 4542 |
} |
| 4543 |
var MAX_RESET_COUNT = 50; |
| 4544 |
var computePosition = async (reference, floating, config) => { |
| 4545 |
const { |
| 4546 |
placement = "bottom", |
| 4547 |
strategy = "absolute", |
| 4548 |
middleware = [], |
| 4549 |
platform: platform3 |
| 4550 |
} = config; |
| 4551 |
const platformWithDetectOverflow = platform3.detectOverflow ? platform3 : { |
| 4552 |
...platform3, |
| 4553 |
detectOverflow |
| 4554 |
}; |
| 4555 |
const rtl = await (platform3.isRTL == null ? void 0 : platform3.isRTL(floating)); |
| 4556 |
let rects = await platform3.getElementRects({ |
| 4557 |
reference, |
| 4558 |
floating, |
| 4559 |
strategy |
| 4560 |
}); |
| 4561 |
let { |
| 4562 |
x: x2, |
| 4563 |
y: y2 |
| 4564 |
} = computeCoordsFromPlacement(rects, placement, rtl); |
| 4565 |
let statefulPlacement = placement; |
| 4566 |
let resetCount = 0; |
| 4567 |
const middlewareData = {}; |
| 4568 |
for (let i2 = 0; i2 < middleware.length; i2++) { |
| 4569 |
const currentMiddleware = middleware[i2]; |
| 4570 |
if (!currentMiddleware) { |
| 4571 |
continue; |
| 4572 |
} |
| 4573 |
const { |
| 4574 |
name, |
| 4575 |
fn |
| 4576 |
} = currentMiddleware; |
| 4577 |
const { |
| 4578 |
x: nextX, |
| 4579 |
y: nextY, |
| 4580 |
data, |
| 4581 |
reset |
| 4582 |
} = await fn({ |
| 4583 |
x: x2, |
| 4584 |
y: y2, |
| 4585 |
initialPlacement: placement, |
| 4586 |
placement: statefulPlacement, |
| 4587 |
strategy, |
| 4588 |
middlewareData, |
| 4589 |
rects, |
| 4590 |
platform: platformWithDetectOverflow, |
| 4591 |
elements: { |
| 4592 |
reference, |
| 4593 |
floating |
| 4594 |
} |
| 4595 |
}); |
| 4596 |
x2 = nextX != null ? nextX : x2; |
| 4597 |
y2 = nextY != null ? nextY : y2; |
| 4598 |
middlewareData[name] = { |
| 4599 |
...middlewareData[name], |
| 4600 |
...data |
| 4601 |
}; |
| 4602 |
if (reset && resetCount < MAX_RESET_COUNT) { |
| 4603 |
resetCount++; |
| 4604 |
if (typeof reset === "object") { |
| 4605 |
if (reset.placement) { |
| 4606 |
statefulPlacement = reset.placement; |
| 4607 |
} |
| 4608 |
if (reset.rects) { |
| 4609 |
rects = reset.rects === true ? await platform3.getElementRects({ |
| 4610 |
reference, |
| 4611 |
floating, |
| 4612 |
strategy |
| 4613 |
}) : reset.rects; |
| 4614 |
} |
| 4615 |
({ |
| 4616 |
x: x2, |
| 4617 |
y: y2 |
| 4618 |
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl)); |
| 4619 |
} |
| 4620 |
i2 = -1; |
| 4621 |
} |
| 4622 |
} |
| 4623 |
return { |
| 4624 |
x: x2, |
| 4625 |
y: y2, |
| 4626 |
placement: statefulPlacement, |
| 4627 |
strategy, |
| 4628 |
middlewareData |
| 4629 |
}; |
| 4630 |
}; |
| 4631 |
var flip = function(options) { |
| 4632 |
if (options === void 0) { |
| 4633 |
options = {}; |
| 4634 |
} |
| 4635 |
return { |
| 4636 |
name: "flip", |
| 4637 |
options, |
| 4638 |
async fn(state) { |
| 4639 |
var _middlewareData$arrow, _middlewareData$flip; |
| 4640 |
const { |
| 4641 |
placement, |
| 4642 |
middlewareData, |
| 4643 |
rects, |
| 4644 |
initialPlacement, |
| 4645 |
platform: platform3, |
| 4646 |
elements |
| 4647 |
} = state; |
| 4648 |
const { |
| 4649 |
mainAxis: checkMainAxis = true, |
| 4650 |
crossAxis: checkCrossAxis = true, |
| 4651 |
fallbackPlacements: specifiedFallbackPlacements, |
| 4652 |
fallbackStrategy = "bestFit", |
| 4653 |
fallbackAxisSideDirection = "none", |
| 4654 |
flipAlignment = true, |
| 4655 |
...detectOverflowOptions |
| 4656 |
} = evaluate(options, state); |
| 4657 |
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) { |
| 4658 |
return {}; |
| 4659 |
} |
| 4660 |
const side = getSide(placement); |
| 4661 |
const initialSideAxis = getSideAxis(initialPlacement); |
| 4662 |
const isBasePlacement = getSide(initialPlacement) === initialPlacement; |
| 4663 |
const rtl = await (platform3.isRTL == null ? void 0 : platform3.isRTL(elements.floating)); |
| 4664 |
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement)); |
| 4665 |
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none"; |
| 4666 |
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) { |
| 4667 |
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl)); |
| 4668 |
} |
| 4669 |
const placements2 = [initialPlacement, ...fallbackPlacements]; |
| 4670 |
const overflow = await platform3.detectOverflow(state, detectOverflowOptions); |
| 4671 |
const overflows = []; |
| 4672 |
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || []; |
| 4673 |
if (checkMainAxis) { |
| 4674 |
overflows.push(overflow[side]); |
| 4675 |
} |
| 4676 |
if (checkCrossAxis) { |
| 4677 |
const sides2 = getAlignmentSides(placement, rects, rtl); |
| 4678 |
overflows.push(overflow[sides2[0]], overflow[sides2[1]]); |
| 4679 |
} |
| 4680 |
overflowsData = [...overflowsData, { |
| 4681 |
placement, |
| 4682 |
overflows |
| 4683 |
}]; |
| 4684 |
if (!overflows.every((side2) => side2 <= 0)) { |
| 4685 |
var _middlewareData$flip2, _overflowsData$filter; |
| 4686 |
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1; |
| 4687 |
const nextPlacement = placements2[nextIndex]; |
| 4688 |
if (nextPlacement) { |
| 4689 |
const ignoreCrossAxisOverflow = checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false; |
| 4690 |
if (!ignoreCrossAxisOverflow || // We leave the current main axis only if every placement on that axis |
| 4691 |
// overflows the main axis. |
| 4692 |
overflowsData.every((d2) => getSideAxis(d2.placement) === initialSideAxis ? d2.overflows[0] > 0 : true)) { |
| 4693 |
return { |
| 4694 |
data: { |
| 4695 |
index: nextIndex, |
| 4696 |
overflows: overflowsData |
| 4697 |
}, |
| 4698 |
reset: { |
| 4699 |
placement: nextPlacement |
| 4700 |
} |
| 4701 |
}; |
| 4702 |
} |
| 4703 |
} |
| 4704 |
let resetPlacement = (_overflowsData$filter = overflowsData.filter((d2) => d2.overflows[0] <= 0).sort((a2, b2) => a2.overflows[1] - b2.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement; |
| 4705 |
if (!resetPlacement) { |
| 4706 |
switch (fallbackStrategy) { |
| 4707 |
case "bestFit": { |
| 4708 |
var _overflowsData$filter2; |
| 4709 |
const placement2 = (_overflowsData$filter2 = overflowsData.filter((d2) => { |
| 4710 |
if (hasFallbackAxisSideDirection) { |
| 4711 |
const currentSideAxis = getSideAxis(d2.placement); |
| 4712 |
return currentSideAxis === initialSideAxis || // Create a bias to the `y` side axis due to horizontal |
| 4713 |
// reading directions favoring greater width. |
| 4714 |
currentSideAxis === "y"; |
| 4715 |
} |
| 4716 |
return true; |
| 4717 |
}).map((d2) => [d2.placement, d2.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0)]).sort((a2, b2) => a2[1] - b2[1])[0]) == null ? void 0 : _overflowsData$filter2[0]; |
| 4718 |
if (placement2) { |
| 4719 |
resetPlacement = placement2; |
| 4720 |
} |
| 4721 |
break; |
| 4722 |
} |
| 4723 |
case "initialPlacement": |
| 4724 |
resetPlacement = initialPlacement; |
| 4725 |
break; |
| 4726 |
} |
| 4727 |
} |
| 4728 |
if (placement !== resetPlacement) { |
| 4729 |
return { |
| 4730 |
reset: { |
| 4731 |
placement: resetPlacement |
| 4732 |
} |
| 4733 |
}; |
| 4734 |
} |
| 4735 |
} |
| 4736 |
return {}; |
| 4737 |
} |
| 4738 |
}; |
| 4739 |
}; |
| 4740 |
function getSideOffsets(overflow, rect) { |
| 4741 |
return { |
| 4742 |
top: overflow.top - rect.height, |
| 4743 |
right: overflow.right - rect.width, |
| 4744 |
bottom: overflow.bottom - rect.height, |
| 4745 |
left: overflow.left - rect.width |
| 4746 |
}; |
| 4747 |
} |
| 4748 |
function isAnySideFullyClipped(overflow) { |
| 4749 |
return sides.some((side) => overflow[side] >= 0); |
| 4750 |
} |
| 4751 |
var hide = function(options) { |
| 4752 |
if (options === void 0) { |
| 4753 |
options = {}; |
| 4754 |
} |
| 4755 |
return { |
| 4756 |
name: "hide", |
| 4757 |
options, |
| 4758 |
async fn(state) { |
| 4759 |
const { |
| 4760 |
rects, |
| 4761 |
platform: platform3 |
| 4762 |
} = state; |
| 4763 |
const { |
| 4764 |
strategy = "referenceHidden", |
| 4765 |
...detectOverflowOptions |
| 4766 |
} = evaluate(options, state); |
| 4767 |
switch (strategy) { |
| 4768 |
case "referenceHidden": { |
| 4769 |
const overflow = await platform3.detectOverflow(state, { |
| 4770 |
...detectOverflowOptions, |
| 4771 |
elementContext: "reference" |
| 4772 |
}); |
| 4773 |
const offsets = getSideOffsets(overflow, rects.reference); |
| 4774 |
return { |
| 4775 |
data: { |
| 4776 |
referenceHiddenOffsets: offsets, |
| 4777 |
referenceHidden: isAnySideFullyClipped(offsets) |
| 4778 |
} |
| 4779 |
}; |
| 4780 |
} |
| 4781 |
case "escaped": { |
| 4782 |
const overflow = await platform3.detectOverflow(state, { |
| 4783 |
...detectOverflowOptions, |
| 4784 |
altBoundary: true |
| 4785 |
}); |
| 4786 |
const offsets = getSideOffsets(overflow, rects.floating); |
| 4787 |
return { |
| 4788 |
data: { |
| 4789 |
escapedOffsets: offsets, |
| 4790 |
escaped: isAnySideFullyClipped(offsets) |
| 4791 |
} |
| 4792 |
}; |
| 4793 |
} |
| 4794 |
default: { |
| 4795 |
return {}; |
| 4796 |
} |
| 4797 |
} |
| 4798 |
} |
| 4799 |
}; |
| 4800 |
}; |
| 4801 |
var originSides = /* @__PURE__ */ new Set(["left", "top"]); |
| 4802 |
async function convertValueToCoords(state, options) { |
| 4803 |
const { |
| 4804 |
placement, |
| 4805 |
platform: platform3, |
| 4806 |
elements |
| 4807 |
} = state; |
| 4808 |
const rtl = await (platform3.isRTL == null ? void 0 : platform3.isRTL(elements.floating)); |
| 4809 |
const side = getSide(placement); |
| 4810 |
const alignment = getAlignment(placement); |
| 4811 |
const isVertical = getSideAxis(placement) === "y"; |
| 4812 |
const mainAxisMulti = originSides.has(side) ? -1 : 1; |
| 4813 |
const crossAxisMulti = rtl && isVertical ? -1 : 1; |
| 4814 |
const rawValue = evaluate(options, state); |
| 4815 |
let { |
| 4816 |
mainAxis, |
| 4817 |
crossAxis, |
| 4818 |
alignmentAxis |
| 4819 |
} = typeof rawValue === "number" ? { |
| 4820 |
mainAxis: rawValue, |
| 4821 |
crossAxis: 0, |
| 4822 |
alignmentAxis: null |
| 4823 |
} : { |
| 4824 |
mainAxis: rawValue.mainAxis || 0, |
| 4825 |
crossAxis: rawValue.crossAxis || 0, |
| 4826 |
alignmentAxis: rawValue.alignmentAxis |
| 4827 |
}; |
| 4828 |
if (alignment && typeof alignmentAxis === "number") { |
| 4829 |
crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis; |
| 4830 |
} |
| 4831 |
return isVertical ? { |
| 4832 |
x: crossAxis * crossAxisMulti, |
| 4833 |
y: mainAxis * mainAxisMulti |
| 4834 |
} : { |
| 4835 |
x: mainAxis * mainAxisMulti, |
| 4836 |
y: crossAxis * crossAxisMulti |
| 4837 |
}; |
| 4838 |
} |
| 4839 |
var offset = function(options) { |
| 4840 |
if (options === void 0) { |
| 4841 |
options = 0; |
| 4842 |
} |
| 4843 |
return { |
| 4844 |
name: "offset", |
| 4845 |
options, |
| 4846 |
async fn(state) { |
| 4847 |
var _middlewareData$offse, _middlewareData$arrow; |
| 4848 |
const { |
| 4849 |
x: x2, |
| 4850 |
y: y2, |
| 4851 |
placement, |
| 4852 |
middlewareData |
| 4853 |
} = state; |
| 4854 |
const diffCoords = await convertValueToCoords(state, options); |
| 4855 |
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) { |
| 4856 |
return {}; |
| 4857 |
} |
| 4858 |
return { |
| 4859 |
x: x2 + diffCoords.x, |
| 4860 |
y: y2 + diffCoords.y, |
| 4861 |
data: { |
| 4862 |
...diffCoords, |
| 4863 |
placement |
| 4864 |
} |
| 4865 |
}; |
| 4866 |
} |
| 4867 |
}; |
| 4868 |
}; |
| 4869 |
var shift = function(options) { |
| 4870 |
if (options === void 0) { |
| 4871 |
options = {}; |
| 4872 |
} |
| 4873 |
return { |
| 4874 |
name: "shift", |
| 4875 |
options, |
| 4876 |
async fn(state) { |
| 4877 |
const { |
| 4878 |
x: x2, |
| 4879 |
y: y2, |
| 4880 |
placement, |
| 4881 |
platform: platform3 |
| 4882 |
} = state; |
| 4883 |
const { |
| 4884 |
mainAxis: checkMainAxis = true, |
| 4885 |
crossAxis: checkCrossAxis = false, |
| 4886 |
limiter = { |
| 4887 |
fn: (_ref) => { |
| 4888 |
let { |
| 4889 |
x: x3, |
| 4890 |
y: y3 |
| 4891 |
} = _ref; |
| 4892 |
return { |
| 4893 |
x: x3, |
| 4894 |
y: y3 |
| 4895 |
}; |
| 4896 |
} |
| 4897 |
}, |
| 4898 |
...detectOverflowOptions |
| 4899 |
} = evaluate(options, state); |
| 4900 |
const coords = { |
| 4901 |
x: x2, |
| 4902 |
y: y2 |
| 4903 |
}; |
| 4904 |
const overflow = await platform3.detectOverflow(state, detectOverflowOptions); |
| 4905 |
const crossAxis = getSideAxis(getSide(placement)); |
| 4906 |
const mainAxis = getOppositeAxis(crossAxis); |
| 4907 |
let mainAxisCoord = coords[mainAxis]; |
| 4908 |
let crossAxisCoord = coords[crossAxis]; |
| 4909 |
if (checkMainAxis) { |
| 4910 |
const minSide = mainAxis === "y" ? "top" : "left"; |
| 4911 |
const maxSide = mainAxis === "y" ? "bottom" : "right"; |
| 4912 |
const min2 = mainAxisCoord + overflow[minSide]; |
| 4913 |
const max2 = mainAxisCoord - overflow[maxSide]; |
| 4914 |
mainAxisCoord = clamp(min2, mainAxisCoord, max2); |
| 4915 |
} |
| 4916 |
if (checkCrossAxis) { |
| 4917 |
const minSide = crossAxis === "y" ? "top" : "left"; |
| 4918 |
const maxSide = crossAxis === "y" ? "bottom" : "right"; |
| 4919 |
const min2 = crossAxisCoord + overflow[minSide]; |
| 4920 |
const max2 = crossAxisCoord - overflow[maxSide]; |
| 4921 |
crossAxisCoord = clamp(min2, crossAxisCoord, max2); |
| 4922 |
} |
| 4923 |
const limitedCoords = limiter.fn({ |
| 4924 |
...state, |
| 4925 |
[mainAxis]: mainAxisCoord, |
| 4926 |
[crossAxis]: crossAxisCoord |
| 4927 |
}); |
| 4928 |
return { |
| 4929 |
...limitedCoords, |
| 4930 |
data: { |
| 4931 |
x: limitedCoords.x - x2, |
| 4932 |
y: limitedCoords.y - y2, |
| 4933 |
enabled: { |
| 4934 |
[mainAxis]: checkMainAxis, |
| 4935 |
[crossAxis]: checkCrossAxis |
| 4936 |
} |
| 4937 |
} |
| 4938 |
}; |
| 4939 |
} |
| 4940 |
}; |
| 4941 |
}; |
| 4942 |
var limitShift = function(options) { |
| 4943 |
if (options === void 0) { |
| 4944 |
options = {}; |
| 4945 |
} |
| 4946 |
return { |
| 4947 |
options, |
| 4948 |
fn(state) { |
| 4949 |
const { |
| 4950 |
x: x2, |
| 4951 |
y: y2, |
| 4952 |
placement, |
| 4953 |
rects, |
| 4954 |
middlewareData |
| 4955 |
} = state; |
| 4956 |
const { |
| 4957 |
offset: offset4 = 0, |
| 4958 |
mainAxis: checkMainAxis = true, |
| 4959 |
crossAxis: checkCrossAxis = true |
| 4960 |
} = evaluate(options, state); |
| 4961 |
const coords = { |
| 4962 |
x: x2, |
| 4963 |
y: y2 |
| 4964 |
}; |
| 4965 |
const crossAxis = getSideAxis(placement); |
| 4966 |
const mainAxis = getOppositeAxis(crossAxis); |
| 4967 |
let mainAxisCoord = coords[mainAxis]; |
| 4968 |
let crossAxisCoord = coords[crossAxis]; |
| 4969 |
const rawOffset = evaluate(offset4, state); |
| 4970 |
const computedOffset = typeof rawOffset === "number" ? { |
| 4971 |
mainAxis: rawOffset, |
| 4972 |
crossAxis: 0 |
| 4973 |
} : { |
| 4974 |
mainAxis: 0, |
| 4975 |
crossAxis: 0, |
| 4976 |
...rawOffset |
| 4977 |
}; |
| 4978 |
if (checkMainAxis) { |
| 4979 |
const len = mainAxis === "y" ? "height" : "width"; |
| 4980 |
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis; |
| 4981 |
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis; |
| 4982 |
if (mainAxisCoord < limitMin) { |
| 4983 |
mainAxisCoord = limitMin; |
| 4984 |
} else if (mainAxisCoord > limitMax) { |
| 4985 |
mainAxisCoord = limitMax; |
| 4986 |
} |
| 4987 |
} |
| 4988 |
if (checkCrossAxis) { |
| 4989 |
var _middlewareData$offse, _middlewareData$offse2; |
| 4990 |
const len = mainAxis === "y" ? "width" : "height"; |
| 4991 |
const isOriginSide = originSides.has(getSide(placement)); |
| 4992 |
const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis); |
| 4993 |
const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0); |
| 4994 |
if (crossAxisCoord < limitMin) { |
| 4995 |
crossAxisCoord = limitMin; |
| 4996 |
} else if (crossAxisCoord > limitMax) { |
| 4997 |
crossAxisCoord = limitMax; |
| 4998 |
} |
| 4999 |
} |
| 5000 |
return { |
| 5001 |
[mainAxis]: mainAxisCoord, |
| 5002 |
[crossAxis]: crossAxisCoord |
| 5003 |
}; |
| 5004 |
} |
| 5005 |
}; |
| 5006 |
}; |
| 5007 |
var size = function(options) { |
| 5008 |
if (options === void 0) { |
| 5009 |
options = {}; |
| 5010 |
} |
| 5011 |
return { |
| 5012 |
name: "size", |
| 5013 |
options, |
| 5014 |
async fn(state) { |
| 5015 |
var _state$middlewareData, _state$middlewareData2; |
| 5016 |
const { |
| 5017 |
placement, |
| 5018 |
rects, |
| 5019 |
platform: platform3, |
| 5020 |
elements |
| 5021 |
} = state; |
| 5022 |
const { |
| 5023 |
apply = () => { |
| 5024 |
}, |
| 5025 |
...detectOverflowOptions |
| 5026 |
} = evaluate(options, state); |
| 5027 |
const overflow = await platform3.detectOverflow(state, detectOverflowOptions); |
| 5028 |
const side = getSide(placement); |
| 5029 |
const alignment = getAlignment(placement); |
| 5030 |
const isYAxis = getSideAxis(placement) === "y"; |
| 5031 |
const { |
| 5032 |
width, |
| 5033 |
height |
| 5034 |
} = rects.floating; |
| 5035 |
let heightSide; |
| 5036 |
let widthSide; |
| 5037 |
if (side === "top" || side === "bottom") { |
| 5038 |
heightSide = side; |
| 5039 |
widthSide = alignment === (await (platform3.isRTL == null ? void 0 : platform3.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right"; |
| 5040 |
} else { |
| 5041 |
widthSide = side; |
| 5042 |
heightSide = alignment === "end" ? "top" : "bottom"; |
| 5043 |
} |
| 5044 |
const maximumClippingHeight = height - overflow.top - overflow.bottom; |
| 5045 |
const maximumClippingWidth = width - overflow.left - overflow.right; |
| 5046 |
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight); |
| 5047 |
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth); |
| 5048 |
const noShift = !state.middlewareData.shift; |
| 5049 |
let availableHeight = overflowAvailableHeight; |
| 5050 |
let availableWidth = overflowAvailableWidth; |
| 5051 |
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) { |
| 5052 |
availableWidth = maximumClippingWidth; |
| 5053 |
} |
| 5054 |
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) { |
| 5055 |
availableHeight = maximumClippingHeight; |
| 5056 |
} |
| 5057 |
if (noShift && !alignment) { |
| 5058 |
const xMin = max(overflow.left, 0); |
| 5059 |
const xMax = max(overflow.right, 0); |
| 5060 |
const yMin = max(overflow.top, 0); |
| 5061 |
const yMax = max(overflow.bottom, 0); |
| 5062 |
if (isYAxis) { |
| 5063 |
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right)); |
| 5064 |
} else { |
| 5065 |
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom)); |
| 5066 |
} |
| 5067 |
} |
| 5068 |
await apply({ |
| 5069 |
...state, |
| 5070 |
availableWidth, |
| 5071 |
availableHeight |
| 5072 |
}); |
| 5073 |
const nextDimensions = await platform3.getDimensions(elements.floating); |
| 5074 |
if (width !== nextDimensions.width || height !== nextDimensions.height) { |
| 5075 |
return { |
| 5076 |
reset: { |
| 5077 |
rects: true |
| 5078 |
} |
| 5079 |
}; |
| 5080 |
} |
| 5081 |
return {}; |
| 5082 |
} |
| 5083 |
}; |
| 5084 |
}; |
| 5085 |
|
| 5086 |
// node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs |
| 5087 |
function getCssDimensions(element) { |
| 5088 |
const css = getComputedStyle2(element); |
| 5089 |
let width = parseFloat(css.width) || 0; |
| 5090 |
let height = parseFloat(css.height) || 0; |
| 5091 |
const hasOffset = isHTMLElement(element); |
| 5092 |
const offsetWidth = hasOffset ? element.offsetWidth : width; |
| 5093 |
const offsetHeight = hasOffset ? element.offsetHeight : height; |
| 5094 |
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight; |
| 5095 |
if (shouldFallback) { |
| 5096 |
width = offsetWidth; |
| 5097 |
height = offsetHeight; |
| 5098 |
} |
| 5099 |
return { |
| 5100 |
width, |
| 5101 |
height, |
| 5102 |
$: shouldFallback |
| 5103 |
}; |
| 5104 |
} |
| 5105 |
function unwrapElement(element) { |
| 5106 |
return !isElement(element) ? element.contextElement : element; |
| 5107 |
} |
| 5108 |
function getScale(element) { |
| 5109 |
const domElement = unwrapElement(element); |
| 5110 |
if (!isHTMLElement(domElement)) { |
| 5111 |
return createCoords(1); |
| 5112 |
} |
| 5113 |
const rect = domElement.getBoundingClientRect(); |
| 5114 |
const { |
| 5115 |
width, |
| 5116 |
height, |
| 5117 |
$: $2 |
| 5118 |
} = getCssDimensions(domElement); |
| 5119 |
let x2 = ($2 ? round(rect.width) : rect.width) / width; |
| 5120 |
let y2 = ($2 ? round(rect.height) : rect.height) / height; |
| 5121 |
if (!x2 || !Number.isFinite(x2)) { |
| 5122 |
x2 = 1; |
| 5123 |
} |
| 5124 |
if (!y2 || !Number.isFinite(y2)) { |
| 5125 |
y2 = 1; |
| 5126 |
} |
| 5127 |
return { |
| 5128 |
x: x2, |
| 5129 |
y: y2 |
| 5130 |
}; |
| 5131 |
} |
| 5132 |
var noOffsets = /* @__PURE__ */ createCoords(0); |
| 5133 |
function getVisualOffsets(element) { |
| 5134 |
const win = getWindow(element); |
| 5135 |
if (!isWebKit() || !win.visualViewport) { |
| 5136 |
return noOffsets; |
| 5137 |
} |
| 5138 |
return { |
| 5139 |
x: win.visualViewport.offsetLeft, |
| 5140 |
y: win.visualViewport.offsetTop |
| 5141 |
}; |
| 5142 |
} |
| 5143 |
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) { |
| 5144 |
if (isFixed === void 0) { |
| 5145 |
isFixed = false; |
| 5146 |
} |
| 5147 |
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) { |
| 5148 |
return false; |
| 5149 |
} |
| 5150 |
return isFixed; |
| 5151 |
} |
| 5152 |
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) { |
| 5153 |
if (includeScale === void 0) { |
| 5154 |
includeScale = false; |
| 5155 |
} |
| 5156 |
if (isFixedStrategy === void 0) { |
| 5157 |
isFixedStrategy = false; |
| 5158 |
} |
| 5159 |
const clientRect = element.getBoundingClientRect(); |
| 5160 |
const domElement = unwrapElement(element); |
| 5161 |
let scale = createCoords(1); |
| 5162 |
if (includeScale) { |
| 5163 |
if (offsetParent) { |
| 5164 |
if (isElement(offsetParent)) { |
| 5165 |
scale = getScale(offsetParent); |
| 5166 |
} |
| 5167 |
} else { |
| 5168 |
scale = getScale(element); |
| 5169 |
} |
| 5170 |
} |
| 5171 |
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0); |
| 5172 |
let x2 = (clientRect.left + visualOffsets.x) / scale.x; |
| 5173 |
let y2 = (clientRect.top + visualOffsets.y) / scale.y; |
| 5174 |
let width = clientRect.width / scale.x; |
| 5175 |
let height = clientRect.height / scale.y; |
| 5176 |
if (domElement) { |
| 5177 |
const win = getWindow(domElement); |
| 5178 |
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent; |
| 5179 |
let currentWin = win; |
| 5180 |
let currentIFrame = getFrameElement(currentWin); |
| 5181 |
while (currentIFrame && offsetParent && offsetWin !== currentWin) { |
| 5182 |
const iframeScale = getScale(currentIFrame); |
| 5183 |
const iframeRect = currentIFrame.getBoundingClientRect(); |
| 5184 |
const css = getComputedStyle2(currentIFrame); |
| 5185 |
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; |
| 5186 |
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; |
| 5187 |
x2 *= iframeScale.x; |
| 5188 |
y2 *= iframeScale.y; |
| 5189 |
width *= iframeScale.x; |
| 5190 |
height *= iframeScale.y; |
| 5191 |
x2 += left; |
| 5192 |
y2 += top; |
| 5193 |
currentWin = getWindow(currentIFrame); |
| 5194 |
currentIFrame = getFrameElement(currentWin); |
| 5195 |
} |
| 5196 |
} |
| 5197 |
return rectToClientRect({ |
| 5198 |
width, |
| 5199 |
height, |
| 5200 |
x: x2, |
| 5201 |
y: y2 |
| 5202 |
}); |
| 5203 |
} |
| 5204 |
function getWindowScrollBarX(element, rect) { |
| 5205 |
const leftScroll = getNodeScroll(element).scrollLeft; |
| 5206 |
if (!rect) { |
| 5207 |
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll; |
| 5208 |
} |
| 5209 |
return rect.left + leftScroll; |
| 5210 |
} |
| 5211 |
function getHTMLOffset(documentElement, scroll) { |
| 5212 |
const htmlRect = documentElement.getBoundingClientRect(); |
| 5213 |
const x2 = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect); |
| 5214 |
const y2 = htmlRect.top + scroll.scrollTop; |
| 5215 |
return { |
| 5216 |
x: x2, |
| 5217 |
y: y2 |
| 5218 |
}; |
| 5219 |
} |
| 5220 |
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) { |
| 5221 |
let { |
| 5222 |
elements, |
| 5223 |
rect, |
| 5224 |
offsetParent, |
| 5225 |
strategy |
| 5226 |
} = _ref; |
| 5227 |
const isFixed = strategy === "fixed"; |
| 5228 |
const documentElement = getDocumentElement(offsetParent); |
| 5229 |
const topLayer = elements ? isTopLayer(elements.floating) : false; |
| 5230 |
if (offsetParent === documentElement || topLayer && isFixed) { |
| 5231 |
return rect; |
| 5232 |
} |
| 5233 |
let scroll = { |
| 5234 |
scrollLeft: 0, |
| 5235 |
scrollTop: 0 |
| 5236 |
}; |
| 5237 |
let scale = createCoords(1); |
| 5238 |
const offsets = createCoords(0); |
| 5239 |
const isOffsetParentAnElement = isHTMLElement(offsetParent); |
| 5240 |
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) { |
| 5241 |
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) { |
| 5242 |
scroll = getNodeScroll(offsetParent); |
| 5243 |
} |
| 5244 |
if (isOffsetParentAnElement) { |
| 5245 |
const offsetRect = getBoundingClientRect(offsetParent); |
| 5246 |
scale = getScale(offsetParent); |
| 5247 |
offsets.x = offsetRect.x + offsetParent.clientLeft; |
| 5248 |
offsets.y = offsetRect.y + offsetParent.clientTop; |
| 5249 |
} |
| 5250 |
} |
| 5251 |
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0); |
| 5252 |
return { |
| 5253 |
width: rect.width * scale.x, |
| 5254 |
height: rect.height * scale.y, |
| 5255 |
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x, |
| 5256 |
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y |
| 5257 |
}; |
| 5258 |
} |
| 5259 |
function getClientRects(element) { |
| 5260 |
return Array.from(element.getClientRects()); |
| 5261 |
} |
| 5262 |
function getDocumentRect(element) { |
| 5263 |
const html = getDocumentElement(element); |
| 5264 |
const scroll = getNodeScroll(element); |
| 5265 |
const body = element.ownerDocument.body; |
| 5266 |
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth); |
| 5267 |
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight); |
| 5268 |
let x2 = -scroll.scrollLeft + getWindowScrollBarX(element); |
| 5269 |
const y2 = -scroll.scrollTop; |
| 5270 |
if (getComputedStyle2(body).direction === "rtl") { |
| 5271 |
x2 += max(html.clientWidth, body.clientWidth) - width; |
| 5272 |
} |
| 5273 |
return { |
| 5274 |
width, |
| 5275 |
height, |
| 5276 |
x: x2, |
| 5277 |
y: y2 |
| 5278 |
}; |
| 5279 |
} |
| 5280 |
var SCROLLBAR_MAX = 25; |
| 5281 |
function getViewportRect(element, strategy) { |
| 5282 |
const win = getWindow(element); |
| 5283 |
const html = getDocumentElement(element); |
| 5284 |
const visualViewport = win.visualViewport; |
| 5285 |
let width = html.clientWidth; |
| 5286 |
let height = html.clientHeight; |
| 5287 |
let x2 = 0; |
| 5288 |
let y2 = 0; |
| 5289 |
if (visualViewport) { |
| 5290 |
width = visualViewport.width; |
| 5291 |
height = visualViewport.height; |
| 5292 |
const visualViewportBased = isWebKit(); |
| 5293 |
if (!visualViewportBased || visualViewportBased && strategy === "fixed") { |
| 5294 |
x2 = visualViewport.offsetLeft; |
| 5295 |
y2 = visualViewport.offsetTop; |
| 5296 |
} |
| 5297 |
} |
| 5298 |
const windowScrollbarX = getWindowScrollBarX(html); |
| 5299 |
if (windowScrollbarX <= 0) { |
| 5300 |
const doc = html.ownerDocument; |
| 5301 |
const body = doc.body; |
| 5302 |
const bodyStyles = getComputedStyle(body); |
| 5303 |
const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0; |
| 5304 |
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline); |
| 5305 |
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) { |
| 5306 |
width -= clippingStableScrollbarWidth; |
| 5307 |
} |
| 5308 |
} else if (windowScrollbarX <= SCROLLBAR_MAX) { |
| 5309 |
width += windowScrollbarX; |
| 5310 |
} |
| 5311 |
return { |
| 5312 |
width, |
| 5313 |
height, |
| 5314 |
x: x2, |
| 5315 |
y: y2 |
| 5316 |
}; |
| 5317 |
} |
| 5318 |
function getInnerBoundingClientRect(element, strategy) { |
| 5319 |
const clientRect = getBoundingClientRect(element, true, strategy === "fixed"); |
| 5320 |
const top = clientRect.top + element.clientTop; |
| 5321 |
const left = clientRect.left + element.clientLeft; |
| 5322 |
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1); |
| 5323 |
const width = element.clientWidth * scale.x; |
| 5324 |
const height = element.clientHeight * scale.y; |
| 5325 |
const x2 = left * scale.x; |
| 5326 |
const y2 = top * scale.y; |
| 5327 |
return { |
| 5328 |
width, |
| 5329 |
height, |
| 5330 |
x: x2, |
| 5331 |
y: y2 |
| 5332 |
}; |
| 5333 |
} |
| 5334 |
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) { |
| 5335 |
let rect; |
| 5336 |
if (clippingAncestor === "viewport") { |
| 5337 |
rect = getViewportRect(element, strategy); |
| 5338 |
} else if (clippingAncestor === "document") { |
| 5339 |
rect = getDocumentRect(getDocumentElement(element)); |
| 5340 |
} else if (isElement(clippingAncestor)) { |
| 5341 |
rect = getInnerBoundingClientRect(clippingAncestor, strategy); |
| 5342 |
} else { |
| 5343 |
const visualOffsets = getVisualOffsets(element); |
| 5344 |
rect = { |
| 5345 |
x: clippingAncestor.x - visualOffsets.x, |
| 5346 |
y: clippingAncestor.y - visualOffsets.y, |
| 5347 |
width: clippingAncestor.width, |
| 5348 |
height: clippingAncestor.height |
| 5349 |
}; |
| 5350 |
} |
| 5351 |
return rectToClientRect(rect); |
| 5352 |
} |
| 5353 |
function hasFixedPositionAncestor(element, stopNode) { |
| 5354 |
const parentNode = getParentNode(element); |
| 5355 |
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) { |
| 5356 |
return false; |
| 5357 |
} |
| 5358 |
return getComputedStyle2(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode); |
| 5359 |
} |
| 5360 |
function getClippingElementAncestors(element, cache) { |
| 5361 |
const cachedResult = cache.get(element); |
| 5362 |
if (cachedResult) { |
| 5363 |
return cachedResult; |
| 5364 |
} |
| 5365 |
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body"); |
| 5366 |
let currentContainingBlockComputedStyle = null; |
| 5367 |
const elementIsFixed = getComputedStyle2(element).position === "fixed"; |
| 5368 |
let currentNode = elementIsFixed ? getParentNode(element) : element; |
| 5369 |
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) { |
| 5370 |
const computedStyle = getComputedStyle2(currentNode); |
| 5371 |
const currentNodeIsContaining = isContainingBlock(currentNode); |
| 5372 |
if (!currentNodeIsContaining && computedStyle.position === "fixed") { |
| 5373 |
currentContainingBlockComputedStyle = null; |
| 5374 |
} |
| 5375 |
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === "absolute" || currentContainingBlockComputedStyle.position === "fixed") || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode); |
| 5376 |
if (shouldDropCurrentNode) { |
| 5377 |
result = result.filter((ancestor) => ancestor !== currentNode); |
| 5378 |
} else { |
| 5379 |
currentContainingBlockComputedStyle = computedStyle; |
| 5380 |
} |
| 5381 |
currentNode = getParentNode(currentNode); |
| 5382 |
} |
| 5383 |
cache.set(element, result); |
| 5384 |
return result; |
| 5385 |
} |
| 5386 |
function getClippingRect(_ref) { |
| 5387 |
let { |
| 5388 |
element, |
| 5389 |
boundary, |
| 5390 |
rootBoundary, |
| 5391 |
strategy |
| 5392 |
} = _ref; |
| 5393 |
const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary); |
| 5394 |
const clippingAncestors = [...elementClippingAncestors, rootBoundary]; |
| 5395 |
const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy); |
| 5396 |
let top = firstRect.top; |
| 5397 |
let right = firstRect.right; |
| 5398 |
let bottom = firstRect.bottom; |
| 5399 |
let left = firstRect.left; |
| 5400 |
for (let i2 = 1; i2 < clippingAncestors.length; i2++) { |
| 5401 |
const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i2], strategy); |
| 5402 |
top = max(rect.top, top); |
| 5403 |
right = min(rect.right, right); |
| 5404 |
bottom = min(rect.bottom, bottom); |
| 5405 |
left = max(rect.left, left); |
| 5406 |
} |
| 5407 |
return { |
| 5408 |
width: right - left, |
| 5409 |
height: bottom - top, |
| 5410 |
x: left, |
| 5411 |
y: top |
| 5412 |
}; |
| 5413 |
} |
| 5414 |
function getDimensions(element) { |
| 5415 |
const { |
| 5416 |
width, |
| 5417 |
height |
| 5418 |
} = getCssDimensions(element); |
| 5419 |
return { |
| 5420 |
width, |
| 5421 |
height |
| 5422 |
}; |
| 5423 |
} |
| 5424 |
function getRectRelativeToOffsetParent(element, offsetParent, strategy) { |
| 5425 |
const isOffsetParentAnElement = isHTMLElement(offsetParent); |
| 5426 |
const documentElement = getDocumentElement(offsetParent); |
| 5427 |
const isFixed = strategy === "fixed"; |
| 5428 |
const rect = getBoundingClientRect(element, true, isFixed, offsetParent); |
| 5429 |
let scroll = { |
| 5430 |
scrollLeft: 0, |
| 5431 |
scrollTop: 0 |
| 5432 |
}; |
| 5433 |
const offsets = createCoords(0); |
| 5434 |
function setLeftRTLScrollbarOffset() { |
| 5435 |
offsets.x = getWindowScrollBarX(documentElement); |
| 5436 |
} |
| 5437 |
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) { |
| 5438 |
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) { |
| 5439 |
scroll = getNodeScroll(offsetParent); |
| 5440 |
} |
| 5441 |
if (isOffsetParentAnElement) { |
| 5442 |
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent); |
| 5443 |
offsets.x = offsetRect.x + offsetParent.clientLeft; |
| 5444 |
offsets.y = offsetRect.y + offsetParent.clientTop; |
| 5445 |
} else if (documentElement) { |
| 5446 |
setLeftRTLScrollbarOffset(); |
| 5447 |
} |
| 5448 |
} |
| 5449 |
if (isFixed && !isOffsetParentAnElement && documentElement) { |
| 5450 |
setLeftRTLScrollbarOffset(); |
| 5451 |
} |
| 5452 |
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0); |
| 5453 |
const x2 = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x; |
| 5454 |
const y2 = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y; |
| 5455 |
return { |
| 5456 |
x: x2, |
| 5457 |
y: y2, |
| 5458 |
width: rect.width, |
| 5459 |
height: rect.height |
| 5460 |
}; |
| 5461 |
} |
| 5462 |
function isStaticPositioned(element) { |
| 5463 |
return getComputedStyle2(element).position === "static"; |
| 5464 |
} |
| 5465 |
function getTrueOffsetParent(element, polyfill) { |
| 5466 |
if (!isHTMLElement(element) || getComputedStyle2(element).position === "fixed") { |
| 5467 |
return null; |
| 5468 |
} |
| 5469 |
if (polyfill) { |
| 5470 |
return polyfill(element); |
| 5471 |
} |
| 5472 |
let rawOffsetParent = element.offsetParent; |
| 5473 |
if (getDocumentElement(element) === rawOffsetParent) { |
| 5474 |
rawOffsetParent = rawOffsetParent.ownerDocument.body; |
| 5475 |
} |
| 5476 |
return rawOffsetParent; |
| 5477 |
} |
| 5478 |
function getOffsetParent(element, polyfill) { |
| 5479 |
const win = getWindow(element); |
| 5480 |
if (isTopLayer(element)) { |
| 5481 |
return win; |
| 5482 |
} |
| 5483 |
if (!isHTMLElement(element)) { |
| 5484 |
let svgOffsetParent = getParentNode(element); |
| 5485 |
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) { |
| 5486 |
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) { |
| 5487 |
return svgOffsetParent; |
| 5488 |
} |
| 5489 |
svgOffsetParent = getParentNode(svgOffsetParent); |
| 5490 |
} |
| 5491 |
return win; |
| 5492 |
} |
| 5493 |
let offsetParent = getTrueOffsetParent(element, polyfill); |
| 5494 |
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) { |
| 5495 |
offsetParent = getTrueOffsetParent(offsetParent, polyfill); |
| 5496 |
} |
| 5497 |
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) { |
| 5498 |
return win; |
| 5499 |
} |
| 5500 |
return offsetParent || getContainingBlock(element) || win; |
| 5501 |
} |
| 5502 |
var getElementRects = async function(data) { |
| 5503 |
const getOffsetParentFn = this.getOffsetParent || getOffsetParent; |
| 5504 |
const getDimensionsFn = this.getDimensions; |
| 5505 |
const floatingDimensions = await getDimensionsFn(data.floating); |
| 5506 |
return { |
| 5507 |
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy), |
| 5508 |
floating: { |
| 5509 |
x: 0, |
| 5510 |
y: 0, |
| 5511 |
width: floatingDimensions.width, |
| 5512 |
height: floatingDimensions.height |
| 5513 |
} |
| 5514 |
}; |
| 5515 |
}; |
| 5516 |
function isRTL(element) { |
| 5517 |
return getComputedStyle2(element).direction === "rtl"; |
| 5518 |
} |
| 5519 |
var platform2 = { |
| 5520 |
convertOffsetParentRelativeRectToViewportRelativeRect, |
| 5521 |
getDocumentElement, |
| 5522 |
getClippingRect, |
| 5523 |
getOffsetParent, |
| 5524 |
getElementRects, |
| 5525 |
getClientRects, |
| 5526 |
getDimensions, |
| 5527 |
getScale, |
| 5528 |
isElement, |
| 5529 |
isRTL |
| 5530 |
}; |
| 5531 |
function rectsAreEqual(a2, b2) { |
| 5532 |
return a2.x === b2.x && a2.y === b2.y && a2.width === b2.width && a2.height === b2.height; |
| 5533 |
} |
| 5534 |
function observeMove(element, onMove) { |
| 5535 |
let io = null; |
| 5536 |
let timeoutId; |
| 5537 |
const root = getDocumentElement(element); |
| 5538 |
function cleanup() { |
| 5539 |
var _io; |
| 5540 |
clearTimeout(timeoutId); |
| 5541 |
(_io = io) == null || _io.disconnect(); |
| 5542 |
io = null; |
| 5543 |
} |
| 5544 |
function refresh(skip, threshold) { |
| 5545 |
if (skip === void 0) { |
| 5546 |
skip = false; |
| 5547 |
} |
| 5548 |
if (threshold === void 0) { |
| 5549 |
threshold = 1; |
| 5550 |
} |
| 5551 |
cleanup(); |
| 5552 |
const elementRectForRootMargin = element.getBoundingClientRect(); |
| 5553 |
const { |
| 5554 |
left, |
| 5555 |
top, |
| 5556 |
width, |
| 5557 |
height |
| 5558 |
} = elementRectForRootMargin; |
| 5559 |
if (!skip) { |
| 5560 |
onMove(); |
| 5561 |
} |
| 5562 |
if (!width || !height) { |
| 5563 |
return; |
| 5564 |
} |
| 5565 |
const insetTop = floor(top); |
| 5566 |
const insetRight = floor(root.clientWidth - (left + width)); |
| 5567 |
const insetBottom = floor(root.clientHeight - (top + height)); |
| 5568 |
const insetLeft = floor(left); |
| 5569 |
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px"; |
| 5570 |
const options = { |
| 5571 |
rootMargin, |
| 5572 |
threshold: max(0, min(1, threshold)) || 1 |
| 5573 |
}; |
| 5574 |
let isFirstUpdate = true; |
| 5575 |
function handleObserve(entries) { |
| 5576 |
const ratio = entries[0].intersectionRatio; |
| 5577 |
if (ratio !== threshold) { |
| 5578 |
if (!isFirstUpdate) { |
| 5579 |
return refresh(); |
| 5580 |
} |
| 5581 |
if (!ratio) { |
| 5582 |
timeoutId = setTimeout(() => { |
| 5583 |
refresh(false, 1e-7); |
| 5584 |
}, 1e3); |
| 5585 |
} else { |
| 5586 |
refresh(false, ratio); |
| 5587 |
} |
| 5588 |
} |
| 5589 |
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) { |
| 5590 |
refresh(); |
| 5591 |
} |
| 5592 |
isFirstUpdate = false; |
| 5593 |
} |
| 5594 |
try { |
| 5595 |
io = new IntersectionObserver(handleObserve, { |
| 5596 |
...options, |
| 5597 |
// Handle <iframe>s |
| 5598 |
root: root.ownerDocument |
| 5599 |
}); |
| 5600 |
} catch (_e) { |
| 5601 |
io = new IntersectionObserver(handleObserve, options); |
| 5602 |
} |
| 5603 |
io.observe(element); |
| 5604 |
} |
| 5605 |
refresh(true); |
| 5606 |
return cleanup; |
| 5607 |
} |
| 5608 |
function autoUpdate(reference, floating, update2, options) { |
| 5609 |
if (options === void 0) { |
| 5610 |
options = {}; |
| 5611 |
} |
| 5612 |
const { |
| 5613 |
ancestorScroll = true, |
| 5614 |
ancestorResize = true, |
| 5615 |
elementResize = typeof ResizeObserver === "function", |
| 5616 |
layoutShift = typeof IntersectionObserver === "function", |
| 5617 |
animationFrame = false |
| 5618 |
} = options; |
| 5619 |
const referenceEl = unwrapElement(reference); |
| 5620 |
const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...floating ? getOverflowAncestors(floating) : []] : []; |
| 5621 |
ancestors.forEach((ancestor) => { |
| 5622 |
ancestorScroll && ancestor.addEventListener("scroll", update2, { |
| 5623 |
passive: true |
| 5624 |
}); |
| 5625 |
ancestorResize && ancestor.addEventListener("resize", update2); |
| 5626 |
}); |
| 5627 |
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update2) : null; |
| 5628 |
let reobserveFrame = -1; |
| 5629 |
let resizeObserver = null; |
| 5630 |
if (elementResize) { |
| 5631 |
resizeObserver = new ResizeObserver((_ref) => { |
| 5632 |
let [firstEntry] = _ref; |
| 5633 |
if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) { |
| 5634 |
resizeObserver.unobserve(floating); |
| 5635 |
cancelAnimationFrame(reobserveFrame); |
| 5636 |
reobserveFrame = requestAnimationFrame(() => { |
| 5637 |
var _resizeObserver; |
| 5638 |
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating); |
| 5639 |
}); |
| 5640 |
} |
| 5641 |
update2(); |
| 5642 |
}); |
| 5643 |
if (referenceEl && !animationFrame) { |
| 5644 |
resizeObserver.observe(referenceEl); |
| 5645 |
} |
| 5646 |
if (floating) { |
| 5647 |
resizeObserver.observe(floating); |
| 5648 |
} |
| 5649 |
} |
| 5650 |
let frameId; |
| 5651 |
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null; |
| 5652 |
if (animationFrame) { |
| 5653 |
frameLoop(); |
| 5654 |
} |
| 5655 |
function frameLoop() { |
| 5656 |
const nextRefRect = getBoundingClientRect(reference); |
| 5657 |
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) { |
| 5658 |
update2(); |
| 5659 |
} |
| 5660 |
prevRefRect = nextRefRect; |
| 5661 |
frameId = requestAnimationFrame(frameLoop); |
| 5662 |
} |
| 5663 |
update2(); |
| 5664 |
return () => { |
| 5665 |
var _resizeObserver2; |
| 5666 |
ancestors.forEach((ancestor) => { |
| 5667 |
ancestorScroll && ancestor.removeEventListener("scroll", update2); |
| 5668 |
ancestorResize && ancestor.removeEventListener("resize", update2); |
| 5669 |
}); |
| 5670 |
cleanupIo == null || cleanupIo(); |
| 5671 |
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect(); |
| 5672 |
resizeObserver = null; |
| 5673 |
if (animationFrame) { |
| 5674 |
cancelAnimationFrame(frameId); |
| 5675 |
} |
| 5676 |
}; |
| 5677 |
} |
| 5678 |
var offset2 = offset; |
| 5679 |
var shift2 = shift; |
| 5680 |
var flip2 = flip; |
| 5681 |
var size2 = size; |
| 5682 |
var hide2 = hide; |
| 5683 |
var limitShift2 = limitShift; |
| 5684 |
var computePosition2 = (reference, floating, options) => { |
| 5685 |
const cache = /* @__PURE__ */ new Map(); |
| 5686 |
const mergedOptions = { |
| 5687 |
platform: platform2, |
| 5688 |
...options |
| 5689 |
}; |
| 5690 |
const platformWithCache = { |
| 5691 |
...mergedOptions.platform, |
| 5692 |
_c: cache |
| 5693 |
}; |
| 5694 |
return computePosition(reference, floating, { |
| 5695 |
...mergedOptions, |
| 5696 |
platform: platformWithCache |
| 5697 |
}); |
| 5698 |
}; |
| 5699 |
|
| 5700 |
// node_modules/@base-ui/react/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs |
| 5701 |
var React19 = __toESM(require_react(), 1); |
| 5702 |
var import_react2 = __toESM(require_react(), 1); |
| 5703 |
var ReactDOM3 = __toESM(require_react_dom(), 1); |
| 5704 |
var isClient = typeof document !== "undefined"; |
| 5705 |
var noop3 = function noop4() { |
| 5706 |
}; |
| 5707 |
var index = isClient ? import_react2.useLayoutEffect : noop3; |
| 5708 |
function deepEqual(a2, b2) { |
| 5709 |
if (a2 === b2) { |
| 5710 |
return true; |
| 5711 |
} |
| 5712 |
if (typeof a2 !== typeof b2) { |
| 5713 |
return false; |
| 5714 |
} |
| 5715 |
if (typeof a2 === "function" && a2.toString() === b2.toString()) { |
| 5716 |
return true; |
| 5717 |
} |
| 5718 |
let length; |
| 5719 |
let i2; |
| 5720 |
let keys; |
| 5721 |
if (a2 && b2 && typeof a2 === "object") { |
| 5722 |
if (Array.isArray(a2)) { |
| 5723 |
length = a2.length; |
| 5724 |
if (length !== b2.length) return false; |
| 5725 |
for (i2 = length; i2-- !== 0; ) { |
| 5726 |
if (!deepEqual(a2[i2], b2[i2])) { |
| 5727 |
return false; |
| 5728 |
} |
| 5729 |
} |
| 5730 |
return true; |
| 5731 |
} |
| 5732 |
keys = Object.keys(a2); |
| 5733 |
length = keys.length; |
| 5734 |
if (length !== Object.keys(b2).length) { |
| 5735 |
return false; |
| 5736 |
} |
| 5737 |
for (i2 = length; i2-- !== 0; ) { |
| 5738 |
if (!{}.hasOwnProperty.call(b2, keys[i2])) { |
| 5739 |
return false; |
| 5740 |
} |
| 5741 |
} |
| 5742 |
for (i2 = length; i2-- !== 0; ) { |
| 5743 |
const key = keys[i2]; |
| 5744 |
if (key === "_owner" && a2.$$typeof) { |
| 5745 |
continue; |
| 5746 |
} |
| 5747 |
if (!deepEqual(a2[key], b2[key])) { |
| 5748 |
return false; |
| 5749 |
} |
| 5750 |
} |
| 5751 |
return true; |
| 5752 |
} |
| 5753 |
return a2 !== a2 && b2 !== b2; |
| 5754 |
} |
| 5755 |
function getDPR(element) { |
| 5756 |
if (typeof window === "undefined") { |
| 5757 |
return 1; |
| 5758 |
} |
| 5759 |
const win = element.ownerDocument.defaultView || window; |
| 5760 |
return win.devicePixelRatio || 1; |
| 5761 |
} |
| 5762 |
function roundByDPR(element, value) { |
| 5763 |
const dpr = getDPR(element); |
| 5764 |
return Math.round(value * dpr) / dpr; |
| 5765 |
} |
| 5766 |
function useLatestRef(value) { |
| 5767 |
const ref = React19.useRef(value); |
| 5768 |
index(() => { |
| 5769 |
ref.current = value; |
| 5770 |
}); |
| 5771 |
return ref; |
| 5772 |
} |
| 5773 |
function useFloating(options) { |
| 5774 |
if (options === void 0) { |
| 5775 |
options = {}; |
| 5776 |
} |
| 5777 |
const { |
| 5778 |
placement = "bottom", |
| 5779 |
strategy = "absolute", |
| 5780 |
middleware = [], |
| 5781 |
platform: platform3, |
| 5782 |
elements: { |
| 5783 |
reference: externalReference, |
| 5784 |
floating: externalFloating |
| 5785 |
} = {}, |
| 5786 |
transform = true, |
| 5787 |
whileElementsMounted, |
| 5788 |
open |
| 5789 |
} = options; |
| 5790 |
const [data, setData] = React19.useState({ |
| 5791 |
x: 0, |
| 5792 |
y: 0, |
| 5793 |
strategy, |
| 5794 |
placement, |
| 5795 |
middlewareData: {}, |
| 5796 |
isPositioned: false |
| 5797 |
}); |
| 5798 |
const [latestMiddleware, setLatestMiddleware] = React19.useState(middleware); |
| 5799 |
if (!deepEqual(latestMiddleware, middleware)) { |
| 5800 |
setLatestMiddleware(middleware); |
| 5801 |
} |
| 5802 |
const [_reference, _setReference] = React19.useState(null); |
| 5803 |
const [_floating, _setFloating] = React19.useState(null); |
| 5804 |
const setReference = React19.useCallback((node) => { |
| 5805 |
if (node !== referenceRef.current) { |
| 5806 |
referenceRef.current = node; |
| 5807 |
_setReference(node); |
| 5808 |
} |
| 5809 |
}, []); |
| 5810 |
const setFloating = React19.useCallback((node) => { |
| 5811 |
if (node !== floatingRef.current) { |
| 5812 |
floatingRef.current = node; |
| 5813 |
_setFloating(node); |
| 5814 |
} |
| 5815 |
}, []); |
| 5816 |
const referenceEl = externalReference || _reference; |
| 5817 |
const floatingEl = externalFloating || _floating; |
| 5818 |
const referenceRef = React19.useRef(null); |
| 5819 |
const floatingRef = React19.useRef(null); |
| 5820 |
const dataRef = React19.useRef(data); |
| 5821 |
const hasWhileElementsMounted = whileElementsMounted != null; |
| 5822 |
const whileElementsMountedRef = useLatestRef(whileElementsMounted); |
| 5823 |
const platformRef = useLatestRef(platform3); |
| 5824 |
const openRef = useLatestRef(open); |
| 5825 |
const update2 = React19.useCallback(() => { |
| 5826 |
if (!referenceRef.current || !floatingRef.current) { |
| 5827 |
return; |
| 5828 |
} |
| 5829 |
const config = { |
| 5830 |
placement, |
| 5831 |
strategy, |
| 5832 |
middleware: latestMiddleware |
| 5833 |
}; |
| 5834 |
if (platformRef.current) { |
| 5835 |
config.platform = platformRef.current; |
| 5836 |
} |
| 5837 |
computePosition2(referenceRef.current, floatingRef.current, config).then((data2) => { |
| 5838 |
const fullData = { |
| 5839 |
...data2, |
| 5840 |
// The floating element's position may be recomputed while it's closed |
| 5841 |
// but still mounted (such as when transitioning out). To ensure |
| 5842 |
// `isPositioned` will be `false` initially on the next open, avoid |
| 5843 |
// setting it to `true` when `open === false` (must be specified). |
| 5844 |
isPositioned: openRef.current !== false |
| 5845 |
}; |
| 5846 |
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) { |
| 5847 |
dataRef.current = fullData; |
| 5848 |
ReactDOM3.flushSync(() => { |
| 5849 |
setData(fullData); |
| 5850 |
}); |
| 5851 |
} |
| 5852 |
}); |
| 5853 |
}, [latestMiddleware, placement, strategy, platformRef, openRef]); |
| 5854 |
index(() => { |
| 5855 |
if (open === false && dataRef.current.isPositioned) { |
| 5856 |
dataRef.current.isPositioned = false; |
| 5857 |
setData((data2) => ({ |
| 5858 |
...data2, |
| 5859 |
isPositioned: false |
| 5860 |
})); |
| 5861 |
} |
| 5862 |
}, [open]); |
| 5863 |
const isMountedRef = React19.useRef(false); |
| 5864 |
index(() => { |
| 5865 |
isMountedRef.current = true; |
| 5866 |
return () => { |
| 5867 |
isMountedRef.current = false; |
| 5868 |
}; |
| 5869 |
}, []); |
| 5870 |
index(() => { |
| 5871 |
if (referenceEl) referenceRef.current = referenceEl; |
| 5872 |
if (floatingEl) floatingRef.current = floatingEl; |
| 5873 |
if (referenceEl && floatingEl) { |
| 5874 |
if (whileElementsMountedRef.current) { |
| 5875 |
return whileElementsMountedRef.current(referenceEl, floatingEl, update2); |
| 5876 |
} |
| 5877 |
update2(); |
| 5878 |
} |
| 5879 |
}, [referenceEl, floatingEl, update2, whileElementsMountedRef, hasWhileElementsMounted]); |
| 5880 |
const refs = React19.useMemo(() => ({ |
| 5881 |
reference: referenceRef, |
| 5882 |
floating: floatingRef, |
| 5883 |
setReference, |
| 5884 |
setFloating |
| 5885 |
}), [setReference, setFloating]); |
| 5886 |
const elements = React19.useMemo(() => ({ |
| 5887 |
reference: referenceEl, |
| 5888 |
floating: floatingEl |
| 5889 |
}), [referenceEl, floatingEl]); |
| 5890 |
const floatingStyles = React19.useMemo(() => { |
| 5891 |
const initialStyles = { |
| 5892 |
position: strategy, |
| 5893 |
left: 0, |
| 5894 |
top: 0 |
| 5895 |
}; |
| 5896 |
if (!elements.floating) { |
| 5897 |
return initialStyles; |
| 5898 |
} |
| 5899 |
const x2 = roundByDPR(elements.floating, data.x); |
| 5900 |
const y2 = roundByDPR(elements.floating, data.y); |
| 5901 |
if (transform) { |
| 5902 |
return { |
| 5903 |
...initialStyles, |
| 5904 |
transform: "translate(" + x2 + "px, " + y2 + "px)", |
| 5905 |
...getDPR(elements.floating) >= 1.5 && { |
| 5906 |
willChange: "transform" |
| 5907 |
} |
| 5908 |
}; |
| 5909 |
} |
| 5910 |
return { |
| 5911 |
position: strategy, |
| 5912 |
left: x2, |
| 5913 |
top: y2 |
| 5914 |
}; |
| 5915 |
}, [strategy, transform, elements.floating, data.x, data.y]); |
| 5916 |
return React19.useMemo(() => ({ |
| 5917 |
...data, |
| 5918 |
update: update2, |
| 5919 |
refs, |
| 5920 |
elements, |
| 5921 |
floatingStyles |
| 5922 |
}), [data, update2, refs, elements, floatingStyles]); |
| 5923 |
} |
| 5924 |
var offset3 = (options, deps) => { |
| 5925 |
const result = offset2(options); |
| 5926 |
return { |
| 5927 |
name: result.name, |
| 5928 |
fn: result.fn, |
| 5929 |
options: [options, deps] |
| 5930 |
}; |
| 5931 |
}; |
| 5932 |
var shift3 = (options, deps) => { |
| 5933 |
const result = shift2(options); |
| 5934 |
return { |
| 5935 |
name: result.name, |
| 5936 |
fn: result.fn, |
| 5937 |
options: [options, deps] |
| 5938 |
}; |
| 5939 |
}; |
| 5940 |
var limitShift3 = (options, deps) => { |
| 5941 |
const result = limitShift2(options); |
| 5942 |
return { |
| 5943 |
fn: result.fn, |
| 5944 |
options: [options, deps] |
| 5945 |
}; |
| 5946 |
}; |
| 5947 |
var flip3 = (options, deps) => { |
| 5948 |
const result = flip2(options); |
| 5949 |
return { |
| 5950 |
name: result.name, |
| 5951 |
fn: result.fn, |
| 5952 |
options: [options, deps] |
| 5953 |
}; |
| 5954 |
}; |
| 5955 |
var size3 = (options, deps) => { |
| 5956 |
const result = size2(options); |
| 5957 |
return { |
| 5958 |
name: result.name, |
| 5959 |
fn: result.fn, |
| 5960 |
options: [options, deps] |
| 5961 |
}; |
| 5962 |
}; |
| 5963 |
var hide3 = (options, deps) => { |
| 5964 |
const result = hide2(options); |
| 5965 |
return { |
| 5966 |
name: result.name, |
| 5967 |
fn: result.fn, |
| 5968 |
options: [options, deps] |
| 5969 |
}; |
| 5970 |
}; |
| 5971 |
|
| 5972 |
// node_modules/@base-ui/react/esm/utils/popups/popupStoreUtils.js |
| 5973 |
var React24 = __toESM(require_react(), 1); |
| 5974 |
|
| 5975 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useSyncedFloatingRootContext.js |
| 5976 |
var React23 = __toESM(require_react(), 1); |
| 5977 |
|
| 5978 |
// node_modules/@base-ui/utils/esm/store/createSelector.js |
| 5979 |
var createSelector = (a2, b2, c2, d2, e2, f2, ...other) => { |
| 5980 |
if (other.length > 0) { |
| 5981 |
throw new Error(true ? "Unsupported number of selectors" : formatErrorMessage_default(1)); |
| 5982 |
} |
| 5983 |
let selector2; |
| 5984 |
if (a2 && b2 && c2 && d2 && e2 && f2) { |
| 5985 |
selector2 = (state, a1, a22, a3) => { |
| 5986 |
const va = a2(state, a1, a22, a3); |
| 5987 |
const vb = b2(state, a1, a22, a3); |
| 5988 |
const vc = c2(state, a1, a22, a3); |
| 5989 |
const vd = d2(state, a1, a22, a3); |
| 5990 |
const ve = e2(state, a1, a22, a3); |
| 5991 |
return f2(va, vb, vc, vd, ve, a1, a22, a3); |
| 5992 |
}; |
| 5993 |
} else if (a2 && b2 && c2 && d2 && e2) { |
| 5994 |
selector2 = (state, a1, a22, a3) => { |
| 5995 |
const va = a2(state, a1, a22, a3); |
| 5996 |
const vb = b2(state, a1, a22, a3); |
| 5997 |
const vc = c2(state, a1, a22, a3); |
| 5998 |
const vd = d2(state, a1, a22, a3); |
| 5999 |
return e2(va, vb, vc, vd, a1, a22, a3); |
| 6000 |
}; |
| 6001 |
} else if (a2 && b2 && c2 && d2) { |
| 6002 |
selector2 = (state, a1, a22, a3) => { |
| 6003 |
const va = a2(state, a1, a22, a3); |
| 6004 |
const vb = b2(state, a1, a22, a3); |
| 6005 |
const vc = c2(state, a1, a22, a3); |
| 6006 |
return d2(va, vb, vc, a1, a22, a3); |
| 6007 |
}; |
| 6008 |
} else if (a2 && b2 && c2) { |
| 6009 |
selector2 = (state, a1, a22, a3) => { |
| 6010 |
const va = a2(state, a1, a22, a3); |
| 6011 |
const vb = b2(state, a1, a22, a3); |
| 6012 |
return c2(va, vb, a1, a22, a3); |
| 6013 |
}; |
| 6014 |
} else if (a2 && b2) { |
| 6015 |
selector2 = (state, a1, a22, a3) => { |
| 6016 |
const va = a2(state, a1, a22, a3); |
| 6017 |
return b2(va, a1, a22, a3); |
| 6018 |
}; |
| 6019 |
} else if (a2) { |
| 6020 |
selector2 = a2; |
| 6021 |
} else { |
| 6022 |
throw ( |
| 6023 |
/* minify-error-disabled */ |
| 6024 |
new Error("Missing arguments") |
| 6025 |
); |
| 6026 |
} |
| 6027 |
return selector2; |
| 6028 |
}; |
| 6029 |
|
| 6030 |
// node_modules/@base-ui/utils/esm/store/useStore.js |
| 6031 |
var React21 = __toESM(require_react(), 1); |
| 6032 |
var import_shim = __toESM(require_shim(), 1); |
| 6033 |
var import_with_selector = __toESM(require_with_selector(), 1); |
| 6034 |
|
| 6035 |
// node_modules/@base-ui/utils/esm/fastHooks.js |
| 6036 |
var React20 = __toESM(require_react(), 1); |
| 6037 |
var hooks = []; |
| 6038 |
var currentInstance = void 0; |
| 6039 |
function getInstance() { |
| 6040 |
return currentInstance; |
| 6041 |
} |
| 6042 |
function register(hook) { |
| 6043 |
hooks.push(hook); |
| 6044 |
} |
| 6045 |
function fastComponent(fn) { |
| 6046 |
const FastComponent = (props, forwardedRef) => { |
| 6047 |
const instance = useRefWithInit(createInstance).current; |
| 6048 |
let result; |
| 6049 |
try { |
| 6050 |
currentInstance = instance; |
| 6051 |
for (const hook of hooks) { |
| 6052 |
hook.before(instance); |
| 6053 |
} |
| 6054 |
result = fn(props, forwardedRef); |
| 6055 |
for (const hook of hooks) { |
| 6056 |
hook.after(instance); |
| 6057 |
} |
| 6058 |
instance.didInitialize = true; |
| 6059 |
} finally { |
| 6060 |
currentInstance = void 0; |
| 6061 |
} |
| 6062 |
return result; |
| 6063 |
}; |
| 6064 |
FastComponent.displayName = fn.displayName || fn.name; |
| 6065 |
return FastComponent; |
| 6066 |
} |
| 6067 |
function fastComponentRef(fn) { |
| 6068 |
return /* @__PURE__ */ React20.forwardRef(fastComponent(fn)); |
| 6069 |
} |
| 6070 |
function createInstance() { |
| 6071 |
return { |
| 6072 |
didInitialize: false |
| 6073 |
}; |
| 6074 |
} |
| 6075 |
|
| 6076 |
// node_modules/@base-ui/utils/esm/store/useStore.js |
| 6077 |
var canUseRawUseSyncExternalStore = isReactVersionAtLeast(19); |
| 6078 |
var useStoreImplementation = canUseRawUseSyncExternalStore ? useStoreFast : useStoreLegacy; |
| 6079 |
function useStore(store, selector2, a1, a2, a3) { |
| 6080 |
return useStoreImplementation(store, selector2, a1, a2, a3); |
| 6081 |
} |
| 6082 |
function useStoreR19(store, selector2, a1, a2, a3) { |
| 6083 |
const getSelection = React21.useCallback(() => selector2(store.getSnapshot(), a1, a2, a3), [store, selector2, a1, a2, a3]); |
| 6084 |
return (0, import_shim.useSyncExternalStore)(store.subscribe, getSelection, getSelection); |
| 6085 |
} |
| 6086 |
register({ |
| 6087 |
before(instance) { |
| 6088 |
instance.syncIndex = 0; |
| 6089 |
if (!instance.didInitialize) { |
| 6090 |
instance.syncTick = 1; |
| 6091 |
instance.syncHooks = []; |
| 6092 |
instance.didChangeStore = true; |
| 6093 |
instance.getSnapshot = () => { |
| 6094 |
let didChange2 = false; |
| 6095 |
for (let i2 = 0; i2 < instance.syncHooks.length; i2 += 1) { |
| 6096 |
const hook = instance.syncHooks[i2]; |
| 6097 |
const value = hook.selector(hook.store.state, hook.a1, hook.a2, hook.a3); |
| 6098 |
if (hook.didChange || !Object.is(hook.value, value)) { |
| 6099 |
didChange2 = true; |
| 6100 |
hook.value = value; |
| 6101 |
hook.didChange = false; |
| 6102 |
} |
| 6103 |
} |
| 6104 |
if (didChange2) { |
| 6105 |
instance.syncTick += 1; |
| 6106 |
} |
| 6107 |
return instance.syncTick; |
| 6108 |
}; |
| 6109 |
} |
| 6110 |
}, |
| 6111 |
after(instance) { |
| 6112 |
if (instance.syncHooks.length > 0) { |
| 6113 |
if (instance.didChangeStore) { |
| 6114 |
instance.didChangeStore = false; |
| 6115 |
instance.subscribe = (onStoreChange) => { |
| 6116 |
const stores = /* @__PURE__ */ new Set(); |
| 6117 |
for (const hook of instance.syncHooks) { |
| 6118 |
stores.add(hook.store); |
| 6119 |
} |
| 6120 |
const unsubscribes = []; |
| 6121 |
for (const store of stores) { |
| 6122 |
unsubscribes.push(store.subscribe(onStoreChange)); |
| 6123 |
} |
| 6124 |
return () => { |
| 6125 |
for (const unsubscribe of unsubscribes) { |
| 6126 |
unsubscribe(); |
| 6127 |
} |
| 6128 |
}; |
| 6129 |
}; |
| 6130 |
} |
| 6131 |
(0, import_shim.useSyncExternalStore)(instance.subscribe, instance.getSnapshot, instance.getSnapshot); |
| 6132 |
} |
| 6133 |
} |
| 6134 |
}); |
| 6135 |
function useStoreFast(store, selector2, a1, a2, a3) { |
| 6136 |
const instance = getInstance(); |
| 6137 |
if (!instance) { |
| 6138 |
return useStoreR19(store, selector2, a1, a2, a3); |
| 6139 |
} |
| 6140 |
const index2 = instance.syncIndex; |
| 6141 |
instance.syncIndex += 1; |
| 6142 |
let hook; |
| 6143 |
if (!instance.didInitialize) { |
| 6144 |
hook = { |
| 6145 |
store, |
| 6146 |
selector: selector2, |
| 6147 |
a1, |
| 6148 |
a2, |
| 6149 |
a3, |
| 6150 |
value: selector2(store.getSnapshot(), a1, a2, a3), |
| 6151 |
didChange: false |
| 6152 |
}; |
| 6153 |
instance.syncHooks.push(hook); |
| 6154 |
} else { |
| 6155 |
hook = instance.syncHooks[index2]; |
| 6156 |
if (hook.store !== store || hook.selector !== selector2 || !Object.is(hook.a1, a1) || !Object.is(hook.a2, a2) || !Object.is(hook.a3, a3)) { |
| 6157 |
if (hook.store !== store) { |
| 6158 |
instance.didChangeStore = true; |
| 6159 |
} |
| 6160 |
hook.store = store; |
| 6161 |
hook.selector = selector2; |
| 6162 |
hook.a1 = a1; |
| 6163 |
hook.a2 = a2; |
| 6164 |
hook.a3 = a3; |
| 6165 |
hook.didChange = true; |
| 6166 |
} |
| 6167 |
} |
| 6168 |
return hook.value; |
| 6169 |
} |
| 6170 |
function useStoreLegacy(store, selector2, a1, a2, a3) { |
| 6171 |
return (0, import_with_selector.useSyncExternalStoreWithSelector)(store.subscribe, store.getSnapshot, store.getSnapshot, (state) => selector2(state, a1, a2, a3)); |
| 6172 |
} |
| 6173 |
|
| 6174 |
// node_modules/@base-ui/utils/esm/store/Store.js |
| 6175 |
var Store = class { |
| 6176 |
/** |
| 6177 |
* The current state of the store. |
| 6178 |
* This property is updated immediately when the state changes as a result of calling {@link setState}, {@link update}, or {@link set}. |
| 6179 |
* To subscribe to state changes, use the {@link useState} method. The value returned by {@link useState} is updated after the component renders (similarly to React's useState). |
| 6180 |
* The values can be used directly (to avoid subscribing to the store) in effects or event handlers. |
| 6181 |
* |
| 6182 |
* Do not modify properties in state directly. Instead, use the provided methods to ensure proper state management and listener notification. |
| 6183 |
*/ |
| 6184 |
// Internal state to handle recursive `setState()` calls |
| 6185 |
constructor(state) { |
| 6186 |
this.state = state; |
| 6187 |
this.listeners = /* @__PURE__ */ new Set(); |
| 6188 |
this.updateTick = 0; |
| 6189 |
} |
| 6190 |
/** |
| 6191 |
* Registers a listener that will be called whenever the store's state changes. |
| 6192 |
* |
| 6193 |
* @param fn The listener function to be called on state changes. |
| 6194 |
* @returns A function to unsubscribe the listener. |
| 6195 |
*/ |
| 6196 |
subscribe = (fn) => { |
| 6197 |
this.listeners.add(fn); |
| 6198 |
return () => { |
| 6199 |
this.listeners.delete(fn); |
| 6200 |
}; |
| 6201 |
}; |
| 6202 |
/** |
| 6203 |
* Returns the current state of the store. |
| 6204 |
*/ |
| 6205 |
getSnapshot = () => { |
| 6206 |
return this.state; |
| 6207 |
}; |
| 6208 |
/** |
| 6209 |
* Updates the entire store's state and notifies all registered listeners. |
| 6210 |
* |
| 6211 |
* @param newState The new state to set for the store. |
| 6212 |
*/ |
| 6213 |
setState(newState) { |
| 6214 |
if (this.state === newState) { |
| 6215 |
return; |
| 6216 |
} |
| 6217 |
this.state = newState; |
| 6218 |
this.updateTick += 1; |
| 6219 |
const currentTick = this.updateTick; |
| 6220 |
for (const listener of this.listeners) { |
| 6221 |
if (currentTick !== this.updateTick) { |
| 6222 |
return; |
| 6223 |
} |
| 6224 |
listener(newState); |
| 6225 |
} |
| 6226 |
} |
| 6227 |
/** |
| 6228 |
* Merges the provided changes into the current state and notifies listeners if there are changes. |
| 6229 |
* |
| 6230 |
* @param changes An object containing the changes to apply to the current state. |
| 6231 |
*/ |
| 6232 |
update(changes) { |
| 6233 |
for (const key in changes) { |
| 6234 |
if (!Object.is(this.state[key], changes[key])) { |
| 6235 |
this.setState({ |
| 6236 |
...this.state, |
| 6237 |
...changes |
| 6238 |
}); |
| 6239 |
return; |
| 6240 |
} |
| 6241 |
} |
| 6242 |
} |
| 6243 |
/** |
| 6244 |
* Sets a specific key in the store's state to a new value and notifies listeners if the value has changed. |
| 6245 |
* |
| 6246 |
* @param key The key in the store's state to update. |
| 6247 |
* @param value The new value to set for the specified key. |
| 6248 |
*/ |
| 6249 |
set(key, value) { |
| 6250 |
if (!Object.is(this.state[key], value)) { |
| 6251 |
this.setState({ |
| 6252 |
...this.state, |
| 6253 |
[key]: value |
| 6254 |
}); |
| 6255 |
} |
| 6256 |
} |
| 6257 |
/** |
| 6258 |
* Gives the state a new reference and updates all registered listeners. |
| 6259 |
*/ |
| 6260 |
notifyAll() { |
| 6261 |
const newState = { |
| 6262 |
...this.state |
| 6263 |
}; |
| 6264 |
this.setState(newState); |
| 6265 |
} |
| 6266 |
use(selector2, a1, a2, a3) { |
| 6267 |
return useStore(this, selector2, a1, a2, a3); |
| 6268 |
} |
| 6269 |
}; |
| 6270 |
|
| 6271 |
// node_modules/@base-ui/utils/esm/store/ReactStore.js |
| 6272 |
var React22 = __toESM(require_react(), 1); |
| 6273 |
var ReactStore = class extends Store { |
| 6274 |
/** |
| 6275 |
* Creates a new ReactStore instance. |
| 6276 |
* |
| 6277 |
* @param state Initial state of the store. |
| 6278 |
* @param context Non-reactive context values. |
| 6279 |
* @param selectors Optional selectors for use with `useState`. |
| 6280 |
*/ |
| 6281 |
constructor(state, context = {}, selectors3) { |
| 6282 |
super(state); |
| 6283 |
this.context = context; |
| 6284 |
this.selectors = selectors3; |
| 6285 |
} |
| 6286 |
/** |
| 6287 |
* Non-reactive values such as refs, callbacks, etc. |
| 6288 |
*/ |
| 6289 |
/** |
| 6290 |
* Synchronizes a single external value into the store. |
| 6291 |
* |
| 6292 |
* Note that the while the value in `state` is updated immediately, the value returned |
| 6293 |
* by `useState` is updated before the next render (similarly to React's `useState`). |
| 6294 |
*/ |
| 6295 |
useSyncedValue(key, value) { |
| 6296 |
React22.useDebugValue(key); |
| 6297 |
const store = this; |
| 6298 |
useIsoLayoutEffect(() => { |
| 6299 |
if (store.state[key] !== value) { |
| 6300 |
store.set(key, value); |
| 6301 |
} |
| 6302 |
}, [store, key, value]); |
| 6303 |
} |
| 6304 |
/** |
| 6305 |
* Synchronizes a single external value into the store and |
| 6306 |
* cleans it up (sets to `undefined`) on unmount. |
| 6307 |
* |
| 6308 |
* Note that the while the value in `state` is updated immediately, the value returned |
| 6309 |
* by `useState` is updated before the next render (similarly to React's `useState`). |
| 6310 |
*/ |
| 6311 |
useSyncedValueWithCleanup(key, value) { |
| 6312 |
const store = this; |
| 6313 |
useIsoLayoutEffect(() => { |
| 6314 |
if (store.state[key] !== value) { |
| 6315 |
store.set(key, value); |
| 6316 |
} |
| 6317 |
return () => { |
| 6318 |
store.set(key, void 0); |
| 6319 |
}; |
| 6320 |
}, [store, key, value]); |
| 6321 |
} |
| 6322 |
/** |
| 6323 |
* Synchronizes multiple external values into the store. |
| 6324 |
* |
| 6325 |
* Note that the while the values in `state` are updated immediately, the values returned |
| 6326 |
* by `useState` are updated before the next render (similarly to React's `useState`). |
| 6327 |
*/ |
| 6328 |
useSyncedValues(statePart) { |
| 6329 |
const store = this; |
| 6330 |
if (true) { |
| 6331 |
React22.useDebugValue(statePart, (p2) => Object.keys(p2)); |
| 6332 |
const keys = React22.useRef(Object.keys(statePart)).current; |
| 6333 |
const nextKeys = Object.keys(statePart); |
| 6334 |
if (keys.length !== nextKeys.length || keys.some((key, index2) => key !== nextKeys[index2])) { |
| 6335 |
console.error("ReactStore.useSyncedValues expects the same prop keys on every render. Keys should be stable."); |
| 6336 |
} |
| 6337 |
} |
| 6338 |
const dependencies = Object.values(statePart); |
| 6339 |
useIsoLayoutEffect(() => { |
| 6340 |
store.update(statePart); |
| 6341 |
}, [store, ...dependencies]); |
| 6342 |
} |
| 6343 |
/** |
| 6344 |
* Registers a controllable prop pair (`controlled`, `defaultValue`) for a specific key. If `controlled` |
| 6345 |
* is non-undefined, the store's state at `key` is updated to match `controlled`. |
| 6346 |
*/ |
| 6347 |
useControlledProp(key, controlled) { |
| 6348 |
React22.useDebugValue(key); |
| 6349 |
const store = this; |
| 6350 |
const isControlled = controlled !== void 0; |
| 6351 |
useIsoLayoutEffect(() => { |
| 6352 |
if (isControlled && !Object.is(store.state[key], controlled)) { |
| 6353 |
store.setState({ |
| 6354 |
...store.state, |
| 6355 |
[key]: controlled |
| 6356 |
}); |
| 6357 |
} |
| 6358 |
}, [store, key, controlled, isControlled]); |
| 6359 |
if (true) { |
| 6360 |
const cache = this.controlledValues ??= /* @__PURE__ */ new Map(); |
| 6361 |
if (!cache.has(key)) { |
| 6362 |
cache.set(key, isControlled); |
| 6363 |
} |
| 6364 |
const previouslyControlled = cache.get(key); |
| 6365 |
if (previouslyControlled !== void 0 && previouslyControlled !== isControlled) { |
| 6366 |
console.error(`A component is changing the ${isControlled ? "" : "un"}controlled state of ${key.toString()} to be ${isControlled ? "un" : ""}controlled. Elements should not switch from uncontrolled to controlled (or vice versa).`); |
| 6367 |
} |
| 6368 |
} |
| 6369 |
} |
| 6370 |
/** Gets the current value from the store using a selector with the provided key. |
| 6371 |
* |
| 6372 |
* @param key Key of the selector to use. |
| 6373 |
*/ |
| 6374 |
select(key, a1, a2, a3) { |
| 6375 |
const selector2 = this.selectors[key]; |
| 6376 |
return selector2(this.state, a1, a2, a3); |
| 6377 |
} |
| 6378 |
/** |
| 6379 |
* Returns a value from the store's state using a selector function. |
| 6380 |
* Used to subscribe to specific parts of the state. |
| 6381 |
* This methods causes a rerender whenever the selected state changes. |
| 6382 |
* |
| 6383 |
* @param key Key of the selector to use. |
| 6384 |
*/ |
| 6385 |
useState(key, a1, a2, a3) { |
| 6386 |
React22.useDebugValue(key); |
| 6387 |
return useStore(this, this.selectors[key], a1, a2, a3); |
| 6388 |
} |
| 6389 |
/** |
| 6390 |
* Wraps a function with `useStableCallback` to ensure it has a stable reference |
| 6391 |
* and assigns it to the context. |
| 6392 |
* |
| 6393 |
* @param key Key of the event callback. Must be a function in the context. |
| 6394 |
* @param fn Function to assign. |
| 6395 |
*/ |
| 6396 |
useContextCallback(key, fn) { |
| 6397 |
React22.useDebugValue(key); |
| 6398 |
const stableFunction = useStableCallback(fn ?? NOOP); |
| 6399 |
this.context[key] = stableFunction; |
| 6400 |
} |
| 6401 |
/** |
| 6402 |
* Returns a stable setter function for a specific key in the store's state. |
| 6403 |
* It's commonly used to pass as a ref callback to React elements. |
| 6404 |
* |
| 6405 |
* @param key Key of the state to set. |
| 6406 |
*/ |
| 6407 |
useStateSetter(key) { |
| 6408 |
const ref = React22.useRef(void 0); |
| 6409 |
if (ref.current === void 0) { |
| 6410 |
ref.current = (value) => { |
| 6411 |
this.set(key, value); |
| 6412 |
}; |
| 6413 |
} |
| 6414 |
return ref.current; |
| 6415 |
} |
| 6416 |
/** |
| 6417 |
* Observes changes derived from the store's selectors and calls the listener when the selected value changes. |
| 6418 |
* |
| 6419 |
* @param key Key of the selector to observe. |
| 6420 |
* @param listener Listener function called when the selector result changes. |
| 6421 |
*/ |
| 6422 |
observe(selector2, listener) { |
| 6423 |
let selectFn; |
| 6424 |
if (typeof selector2 === "function") { |
| 6425 |
selectFn = selector2; |
| 6426 |
} else { |
| 6427 |
selectFn = this.selectors[selector2]; |
| 6428 |
} |
| 6429 |
let prevValue = selectFn(this.state); |
| 6430 |
listener(prevValue, prevValue, this); |
| 6431 |
return this.subscribe((nextState) => { |
| 6432 |
const nextValue = selectFn(nextState); |
| 6433 |
if (!Object.is(prevValue, nextValue)) { |
| 6434 |
const oldValue = prevValue; |
| 6435 |
prevValue = nextValue; |
| 6436 |
listener(nextValue, oldValue, this); |
| 6437 |
} |
| 6438 |
}); |
| 6439 |
} |
| 6440 |
}; |
| 6441 |
|
| 6442 |
// node_modules/@base-ui/react/esm/floating-ui-react/components/FloatingRootStore.js |
| 6443 |
var selectors = { |
| 6444 |
open: createSelector((state) => state.open), |
| 6445 |
transitionStatus: createSelector((state) => state.transitionStatus), |
| 6446 |
domReferenceElement: createSelector((state) => state.domReferenceElement), |
| 6447 |
referenceElement: createSelector((state) => state.positionReference ?? state.referenceElement), |
| 6448 |
floatingElement: createSelector((state) => state.floatingElement), |
| 6449 |
floatingId: createSelector((state) => state.floatingId) |
| 6450 |
}; |
| 6451 |
var FloatingRootStore = class extends ReactStore { |
| 6452 |
constructor(options) { |
| 6453 |
const { |
| 6454 |
syncOnly, |
| 6455 |
nested, |
| 6456 |
onOpenChange, |
| 6457 |
triggerElements, |
| 6458 |
...initialState |
| 6459 |
} = options; |
| 6460 |
super({ |
| 6461 |
...initialState, |
| 6462 |
positionReference: initialState.referenceElement, |
| 6463 |
domReferenceElement: initialState.referenceElement |
| 6464 |
}, { |
| 6465 |
onOpenChange, |
| 6466 |
dataRef: { |
| 6467 |
current: {} |
| 6468 |
}, |
| 6469 |
events: createEventEmitter(), |
| 6470 |
nested, |
| 6471 |
triggerElements |
| 6472 |
}, selectors); |
| 6473 |
this.syncOnly = syncOnly; |
| 6474 |
} |
| 6475 |
/** |
| 6476 |
* Syncs the event used by hover logic to distinguish hover-open from click-like interaction. |
| 6477 |
*/ |
| 6478 |
syncOpenEvent = (newOpen, event) => { |
| 6479 |
if (!newOpen || !this.state.open || // Prevent a pending hover-open from overwriting a click-open event, while allowing |
| 6480 |
// click events to upgrade a hover-open. |
| 6481 |
event != null && isClickLikeEvent(event)) { |
| 6482 |
this.context.dataRef.current.openEvent = newOpen ? event : void 0; |
| 6483 |
} |
| 6484 |
}; |
| 6485 |
/** |
| 6486 |
* Runs the root-owned side effects for an open state change. |
| 6487 |
*/ |
| 6488 |
dispatchOpenChange = (newOpen, eventDetails) => { |
| 6489 |
this.syncOpenEvent(newOpen, eventDetails.event); |
| 6490 |
const details = { |
| 6491 |
open: newOpen, |
| 6492 |
reason: eventDetails.reason, |
| 6493 |
nativeEvent: eventDetails.event, |
| 6494 |
nested: this.context.nested, |
| 6495 |
triggerElement: eventDetails.trigger |
| 6496 |
}; |
| 6497 |
this.context.events.emit("openchange", details); |
| 6498 |
}; |
| 6499 |
/** |
| 6500 |
* Emits the `openchange` event through the internal event emitter and calls the `onOpenChange` handler with the provided arguments. |
| 6501 |
* |
| 6502 |
* @param newOpen The new open state. |
| 6503 |
* @param eventDetails Details about the event that triggered the open state change. |
| 6504 |
*/ |
| 6505 |
setOpen = (newOpen, eventDetails) => { |
| 6506 |
if (this.syncOnly) { |
| 6507 |
this.context.onOpenChange?.(newOpen, eventDetails); |
| 6508 |
return; |
| 6509 |
} |
| 6510 |
this.dispatchOpenChange(newOpen, eventDetails); |
| 6511 |
this.context.onOpenChange?.(newOpen, eventDetails); |
| 6512 |
}; |
| 6513 |
}; |
| 6514 |
|
| 6515 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useSyncedFloatingRootContext.js |
| 6516 |
function useSyncedFloatingRootContext(options) { |
| 6517 |
const { |
| 6518 |
popupStore, |
| 6519 |
treatPopupAsFloatingElement = false, |
| 6520 |
floatingRootContext: floatingRootContextProp, |
| 6521 |
floatingId, |
| 6522 |
nested, |
| 6523 |
onOpenChange |
| 6524 |
} = options; |
| 6525 |
const open = popupStore.useState("open"); |
| 6526 |
const referenceElement = popupStore.useState("activeTriggerElement"); |
| 6527 |
const floatingElement = popupStore.useState(treatPopupAsFloatingElement ? "popupElement" : "positionerElement"); |
| 6528 |
const triggerElements = popupStore.context.triggerElements; |
| 6529 |
const handleOpenChange = onOpenChange; |
| 6530 |
const internalStoreRef = React23.useRef(null); |
| 6531 |
if (floatingRootContextProp === void 0 && internalStoreRef.current === null) { |
| 6532 |
internalStoreRef.current = new FloatingRootStore({ |
| 6533 |
open, |
| 6534 |
transitionStatus: void 0, |
| 6535 |
referenceElement, |
| 6536 |
floatingElement, |
| 6537 |
triggerElements, |
| 6538 |
onOpenChange: handleOpenChange, |
| 6539 |
floatingId, |
| 6540 |
syncOnly: true, |
| 6541 |
nested |
| 6542 |
}); |
| 6543 |
} |
| 6544 |
const store = floatingRootContextProp ?? internalStoreRef.current; |
| 6545 |
popupStore.useSyncedValue("floatingId", floatingId); |
| 6546 |
useIsoLayoutEffect(() => { |
| 6547 |
const valuesToSync = { |
| 6548 |
open, |
| 6549 |
floatingId, |
| 6550 |
referenceElement, |
| 6551 |
floatingElement |
| 6552 |
}; |
| 6553 |
if (isElement(referenceElement)) { |
| 6554 |
valuesToSync.domReferenceElement = referenceElement; |
| 6555 |
} |
| 6556 |
if (store.state.positionReference === store.state.referenceElement) { |
| 6557 |
valuesToSync.positionReference = referenceElement; |
| 6558 |
} |
| 6559 |
store.update(valuesToSync); |
| 6560 |
}, [open, floatingId, referenceElement, floatingElement, store]); |
| 6561 |
store.context.onOpenChange = handleOpenChange; |
| 6562 |
store.context.nested = nested; |
| 6563 |
return store; |
| 6564 |
} |
| 6565 |
|
| 6566 |
// node_modules/@base-ui/react/esm/utils/popups/popupStoreUtils.js |
| 6567 |
var FOCUSABLE_POPUP_PROPS = { |
| 6568 |
tabIndex: -1, |
| 6569 |
[FOCUSABLE_ATTRIBUTE]: "" |
| 6570 |
}; |
| 6571 |
function usePopupStore(externalStore, createStore2, treatPopupAsFloatingElement = false) { |
| 6572 |
const floatingId = useId(); |
| 6573 |
const nested = useFloatingParentNodeId() != null; |
| 6574 |
const internalStoreRef = React24.useRef(null); |
| 6575 |
if (externalStore === void 0 && internalStoreRef.current === null) { |
| 6576 |
internalStoreRef.current = createStore2(floatingId, nested); |
| 6577 |
} |
| 6578 |
const store = externalStore ?? internalStoreRef.current; |
| 6579 |
useSyncedFloatingRootContext({ |
| 6580 |
popupStore: store, |
| 6581 |
treatPopupAsFloatingElement, |
| 6582 |
floatingRootContext: store.state.floatingRootContext, |
| 6583 |
floatingId, |
| 6584 |
nested, |
| 6585 |
onOpenChange: store.setOpen |
| 6586 |
}); |
| 6587 |
return { |
| 6588 |
store, |
| 6589 |
internalStore: internalStoreRef.current |
| 6590 |
}; |
| 6591 |
} |
| 6592 |
function useTriggerRegistration(id, store) { |
| 6593 |
const registeredElementIdRef = React24.useRef(null); |
| 6594 |
const registeredElementRef = React24.useRef(null); |
| 6595 |
return React24.useCallback((element) => { |
| 6596 |
if (id === void 0) { |
| 6597 |
return; |
| 6598 |
} |
| 6599 |
let shouldSyncTriggerCount = false; |
| 6600 |
if (registeredElementIdRef.current !== null) { |
| 6601 |
const registeredId = registeredElementIdRef.current; |
| 6602 |
const registeredElement = registeredElementRef.current; |
| 6603 |
const currentElement = store.context.triggerElements.getById(registeredId); |
| 6604 |
if (registeredElement && currentElement === registeredElement) { |
| 6605 |
store.context.triggerElements.delete(registeredId); |
| 6606 |
shouldSyncTriggerCount = true; |
| 6607 |
} |
| 6608 |
registeredElementIdRef.current = null; |
| 6609 |
registeredElementRef.current = null; |
| 6610 |
} |
| 6611 |
if (element !== null) { |
| 6612 |
registeredElementIdRef.current = id; |
| 6613 |
registeredElementRef.current = element; |
| 6614 |
store.context.triggerElements.add(id, element); |
| 6615 |
shouldSyncTriggerCount = true; |
| 6616 |
} |
| 6617 |
if (shouldSyncTriggerCount) { |
| 6618 |
const triggerCount = store.context.triggerElements.size; |
| 6619 |
if (store.select("open") && store.state.triggerCount !== triggerCount) { |
| 6620 |
store.set("triggerCount", triggerCount); |
| 6621 |
} |
| 6622 |
} |
| 6623 |
}, [store, id]); |
| 6624 |
} |
| 6625 |
function setOpenTriggerState(state, open, trigger) { |
| 6626 |
const triggerId = trigger?.id ?? null; |
| 6627 |
if (triggerId || open) { |
| 6628 |
state.activeTriggerId = triggerId; |
| 6629 |
state.activeTriggerElement = trigger ?? null; |
| 6630 |
} |
| 6631 |
} |
| 6632 |
function useTriggerDataForwarding(triggerId, triggerElementRef, store, stateUpdates) { |
| 6633 |
const isMountedByThisTrigger = store.useState("isMountedByTrigger", triggerId); |
| 6634 |
const baseRegisterTrigger = useTriggerRegistration(triggerId, store); |
| 6635 |
const registerTrigger = useStableCallback((element) => { |
| 6636 |
baseRegisterTrigger(element); |
| 6637 |
if (!element) { |
| 6638 |
return; |
| 6639 |
} |
| 6640 |
const open = store.select("open"); |
| 6641 |
const activeTriggerId = store.select("activeTriggerId"); |
| 6642 |
if (activeTriggerId === triggerId) { |
| 6643 |
store.update({ |
| 6644 |
activeTriggerElement: element, |
| 6645 |
...open ? stateUpdates : null |
| 6646 |
}); |
| 6647 |
return; |
| 6648 |
} |
| 6649 |
if (activeTriggerId == null && open) { |
| 6650 |
store.update({ |
| 6651 |
activeTriggerId: triggerId, |
| 6652 |
activeTriggerElement: element, |
| 6653 |
...stateUpdates |
| 6654 |
}); |
| 6655 |
} |
| 6656 |
}); |
| 6657 |
useIsoLayoutEffect(() => { |
| 6658 |
if (isMountedByThisTrigger) { |
| 6659 |
store.update({ |
| 6660 |
activeTriggerElement: triggerElementRef.current, |
| 6661 |
...stateUpdates |
| 6662 |
}); |
| 6663 |
} |
| 6664 |
}, [isMountedByThisTrigger, store, triggerElementRef, ...Object.values(stateUpdates)]); |
| 6665 |
return { |
| 6666 |
registerTrigger, |
| 6667 |
isMountedByThisTrigger |
| 6668 |
}; |
| 6669 |
} |
| 6670 |
function useImplicitActiveTrigger(store) { |
| 6671 |
const open = store.useState("open"); |
| 6672 |
const reactiveTriggerCount = store.useState("triggerCount"); |
| 6673 |
useIsoLayoutEffect(() => { |
| 6674 |
if (!open) { |
| 6675 |
if (store.state.triggerCount !== 0) { |
| 6676 |
store.set("triggerCount", 0); |
| 6677 |
} |
| 6678 |
return; |
| 6679 |
} |
| 6680 |
const triggerCount = store.context.triggerElements.size; |
| 6681 |
const stateUpdates = {}; |
| 6682 |
if (store.state.triggerCount !== triggerCount) { |
| 6683 |
stateUpdates.triggerCount = triggerCount; |
| 6684 |
} |
| 6685 |
if (!store.select("activeTriggerId") && triggerCount === 1) { |
| 6686 |
const iteratorResult = store.context.triggerElements.entries().next(); |
| 6687 |
if (!iteratorResult.done) { |
| 6688 |
const [implicitTriggerId, implicitTriggerElement] = iteratorResult.value; |
| 6689 |
stateUpdates.activeTriggerId = implicitTriggerId; |
| 6690 |
stateUpdates.activeTriggerElement = implicitTriggerElement; |
| 6691 |
} |
| 6692 |
} |
| 6693 |
if (stateUpdates.triggerCount !== void 0 || stateUpdates.activeTriggerId !== void 0) { |
| 6694 |
store.update(stateUpdates); |
| 6695 |
} |
| 6696 |
}, [open, store, reactiveTriggerCount]); |
| 6697 |
} |
| 6698 |
function useOpenStateTransitions(open, store, onUnmount) { |
| 6699 |
const { |
| 6700 |
mounted, |
| 6701 |
setMounted, |
| 6702 |
transitionStatus |
| 6703 |
} = useTransitionStatus(open); |
| 6704 |
store.useSyncedValues({ |
| 6705 |
mounted, |
| 6706 |
transitionStatus |
| 6707 |
}); |
| 6708 |
const forceUnmount = useStableCallback(() => { |
| 6709 |
setMounted(false); |
| 6710 |
store.update({ |
| 6711 |
activeTriggerId: null, |
| 6712 |
activeTriggerElement: null, |
| 6713 |
mounted: false, |
| 6714 |
preventUnmountingOnClose: false |
| 6715 |
}); |
| 6716 |
onUnmount?.(); |
| 6717 |
store.context.onOpenChangeComplete?.(false); |
| 6718 |
}); |
| 6719 |
const preventUnmountingOnClose = store.useState("preventUnmountingOnClose"); |
| 6720 |
useOpenChangeComplete({ |
| 6721 |
enabled: mounted && !open && !preventUnmountingOnClose, |
| 6722 |
open, |
| 6723 |
ref: store.context.popupRef, |
| 6724 |
onComplete() { |
| 6725 |
if (!open) { |
| 6726 |
forceUnmount(); |
| 6727 |
} |
| 6728 |
} |
| 6729 |
}); |
| 6730 |
return { |
| 6731 |
forceUnmount, |
| 6732 |
transitionStatus |
| 6733 |
}; |
| 6734 |
} |
| 6735 |
function usePopupInteractionProps(store, statePart) { |
| 6736 |
store.useSyncedValues(statePart); |
| 6737 |
useIsoLayoutEffect(() => () => { |
| 6738 |
store.update({ |
| 6739 |
activeTriggerProps: EMPTY_OBJECT, |
| 6740 |
inactiveTriggerProps: EMPTY_OBJECT, |
| 6741 |
popupProps: EMPTY_OBJECT |
| 6742 |
}); |
| 6743 |
}, [store]); |
| 6744 |
} |
| 6745 |
|
| 6746 |
// node_modules/@base-ui/react/esm/utils/popups/popupTriggerMap.js |
| 6747 |
var PopupTriggerMap = class { |
| 6748 |
constructor() { |
| 6749 |
this.elementsSet = /* @__PURE__ */ new Set(); |
| 6750 |
this.idMap = /* @__PURE__ */ new Map(); |
| 6751 |
} |
| 6752 |
/** |
| 6753 |
* Adds a trigger element with the given ID. |
| 6754 |
* |
| 6755 |
* Note: The provided element is assumed to not be registered under multiple IDs. |
| 6756 |
*/ |
| 6757 |
add(id, element) { |
| 6758 |
const existingElement = this.idMap.get(id); |
| 6759 |
if (existingElement === element) { |
| 6760 |
return; |
| 6761 |
} |
| 6762 |
if (existingElement !== void 0) { |
| 6763 |
this.elementsSet.delete(existingElement); |
| 6764 |
} |
| 6765 |
this.elementsSet.add(element); |
| 6766 |
this.idMap.set(id, element); |
| 6767 |
if (true) { |
| 6768 |
if (this.elementsSet.size !== this.idMap.size) { |
| 6769 |
throw new Error("Base UI: A trigger element cannot be registered under multiple IDs in PopupTriggerMap."); |
| 6770 |
} |
| 6771 |
} |
| 6772 |
} |
| 6773 |
/** |
| 6774 |
* Removes the trigger element with the given ID. |
| 6775 |
*/ |
| 6776 |
delete(id) { |
| 6777 |
const element = this.idMap.get(id); |
| 6778 |
if (element) { |
| 6779 |
this.elementsSet.delete(element); |
| 6780 |
this.idMap.delete(id); |
| 6781 |
} |
| 6782 |
} |
| 6783 |
/** |
| 6784 |
* Whether the given element is registered as a trigger. |
| 6785 |
*/ |
| 6786 |
hasElement(element) { |
| 6787 |
return this.elementsSet.has(element); |
| 6788 |
} |
| 6789 |
/** |
| 6790 |
* Whether there is a registered trigger element matching the given predicate. |
| 6791 |
*/ |
| 6792 |
hasMatchingElement(predicate) { |
| 6793 |
for (const element of this.elementsSet) { |
| 6794 |
if (predicate(element)) { |
| 6795 |
return true; |
| 6796 |
} |
| 6797 |
} |
| 6798 |
return false; |
| 6799 |
} |
| 6800 |
/** |
| 6801 |
* Returns the trigger element associated with the given ID, or undefined if no such element exists. |
| 6802 |
*/ |
| 6803 |
getById(id) { |
| 6804 |
return this.idMap.get(id); |
| 6805 |
} |
| 6806 |
/** |
| 6807 |
* Returns an iterable of all registered trigger entries, where each entry is a tuple of [id, element]. |
| 6808 |
*/ |
| 6809 |
entries() { |
| 6810 |
return this.idMap.entries(); |
| 6811 |
} |
| 6812 |
/** |
| 6813 |
* Returns an iterable of all registered trigger elements. |
| 6814 |
*/ |
| 6815 |
elements() { |
| 6816 |
return this.elementsSet.values(); |
| 6817 |
} |
| 6818 |
/** |
| 6819 |
* Returns the number of registered trigger elements. |
| 6820 |
*/ |
| 6821 |
get size() { |
| 6822 |
return this.idMap.size; |
| 6823 |
} |
| 6824 |
}; |
| 6825 |
|
| 6826 |
// node_modules/@base-ui/react/esm/floating-ui-react/utils/getEmptyRootContext.js |
| 6827 |
function getEmptyRootContext() { |
| 6828 |
return new FloatingRootStore({ |
| 6829 |
open: false, |
| 6830 |
transitionStatus: void 0, |
| 6831 |
floatingElement: null, |
| 6832 |
referenceElement: null, |
| 6833 |
triggerElements: new PopupTriggerMap(), |
| 6834 |
floatingId: void 0, |
| 6835 |
syncOnly: false, |
| 6836 |
nested: false, |
| 6837 |
onOpenChange: void 0 |
| 6838 |
}); |
| 6839 |
} |
| 6840 |
|
| 6841 |
// node_modules/@base-ui/react/esm/utils/popups/store.js |
| 6842 |
function createInitialPopupStoreState() { |
| 6843 |
return { |
| 6844 |
open: false, |
| 6845 |
openProp: void 0, |
| 6846 |
mounted: false, |
| 6847 |
transitionStatus: void 0, |
| 6848 |
floatingRootContext: getEmptyRootContext(), |
| 6849 |
floatingId: void 0, |
| 6850 |
triggerCount: 0, |
| 6851 |
preventUnmountingOnClose: false, |
| 6852 |
payload: void 0, |
| 6853 |
activeTriggerId: null, |
| 6854 |
activeTriggerElement: null, |
| 6855 |
triggerIdProp: void 0, |
| 6856 |
popupElement: null, |
| 6857 |
positionerElement: null, |
| 6858 |
activeTriggerProps: EMPTY_OBJECT, |
| 6859 |
inactiveTriggerProps: EMPTY_OBJECT, |
| 6860 |
popupProps: EMPTY_OBJECT |
| 6861 |
}; |
| 6862 |
} |
| 6863 |
function createPopupFloatingRootContext(triggerElements, floatingId, nested = false) { |
| 6864 |
return new FloatingRootStore({ |
| 6865 |
open: false, |
| 6866 |
transitionStatus: void 0, |
| 6867 |
floatingElement: null, |
| 6868 |
referenceElement: null, |
| 6869 |
triggerElements, |
| 6870 |
floatingId, |
| 6871 |
syncOnly: true, |
| 6872 |
nested, |
| 6873 |
onOpenChange: void 0 |
| 6874 |
}); |
| 6875 |
} |
| 6876 |
var activeTriggerIdSelector = createSelector((state) => state.triggerIdProp ?? state.activeTriggerId); |
| 6877 |
var openSelector = createSelector((state) => state.openProp ?? state.open); |
| 6878 |
var popupIdSelector = createSelector((state) => { |
| 6879 |
const popupId = state.popupElement?.id ?? state.floatingId; |
| 6880 |
return popupId || void 0; |
| 6881 |
}); |
| 6882 |
function triggerOwnsOpenPopup(state, triggerId) { |
| 6883 |
return triggerId !== void 0 && openSelector(state) && activeTriggerIdSelector(state) === triggerId; |
| 6884 |
} |
| 6885 |
function triggerOwnsOpenPopupOrIsOnlyTrigger(state, triggerId) { |
| 6886 |
if (triggerOwnsOpenPopup(state, triggerId)) { |
| 6887 |
return true; |
| 6888 |
} |
| 6889 |
return triggerId !== void 0 && openSelector(state) && activeTriggerIdSelector(state) == null && state.triggerCount === 1; |
| 6890 |
} |
| 6891 |
var popupStoreSelectors = { |
| 6892 |
open: openSelector, |
| 6893 |
mounted: createSelector((state) => state.mounted), |
| 6894 |
transitionStatus: createSelector((state) => state.transitionStatus), |
| 6895 |
floatingRootContext: createSelector((state) => state.floatingRootContext), |
| 6896 |
triggerCount: createSelector((state) => state.triggerCount), |
| 6897 |
preventUnmountingOnClose: createSelector((state) => state.preventUnmountingOnClose), |
| 6898 |
payload: createSelector((state) => state.payload), |
| 6899 |
activeTriggerId: activeTriggerIdSelector, |
| 6900 |
activeTriggerElement: createSelector((state) => state.mounted ? state.activeTriggerElement : null), |
| 6901 |
popupId: popupIdSelector, |
| 6902 |
/** |
| 6903 |
* Whether the trigger with the given ID was used to open the popup. |
| 6904 |
*/ |
| 6905 |
isTriggerActive: createSelector((state, triggerId) => triggerId !== void 0 && activeTriggerIdSelector(state) === triggerId), |
| 6906 |
/** |
| 6907 |
* Whether the popup is open and was activated by a trigger with the given ID. |
| 6908 |
*/ |
| 6909 |
isOpenedByTrigger: createSelector((state, triggerId) => triggerOwnsOpenPopup(state, triggerId)), |
| 6910 |
/** |
| 6911 |
* Whether the popup is mounted and was activated by a trigger with the given ID. |
| 6912 |
*/ |
| 6913 |
isMountedByTrigger: createSelector((state, triggerId) => triggerId !== void 0 && activeTriggerIdSelector(state) === triggerId && state.mounted), |
| 6914 |
triggerProps: createSelector((state, isActive) => isActive ? state.activeTriggerProps : state.inactiveTriggerProps), |
| 6915 |
/** |
| 6916 |
* Popup id for the trigger that currently owns the open popup. |
| 6917 |
*/ |
| 6918 |
triggerPopupId: createSelector((state, triggerId) => triggerOwnsOpenPopupOrIsOnlyTrigger(state, triggerId) ? popupIdSelector(state) : void 0), |
| 6919 |
popupProps: createSelector((state) => state.popupProps), |
| 6920 |
popupElement: createSelector((state) => state.popupElement), |
| 6921 |
positionerElement: createSelector((state) => state.positionerElement) |
| 6922 |
}; |
| 6923 |
|
| 6924 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useFloatingRootContext.js |
| 6925 |
function useFloatingRootContext(options) { |
| 6926 |
const { |
| 6927 |
open = false, |
| 6928 |
onOpenChange, |
| 6929 |
elements = {} |
| 6930 |
} = options; |
| 6931 |
const floatingId = useId(); |
| 6932 |
const nested = useFloatingParentNodeId() != null; |
| 6933 |
if (true) { |
| 6934 |
const optionDomReference = elements.reference; |
| 6935 |
if (optionDomReference && !isElement(optionDomReference)) { |
| 6936 |
console.error("Cannot pass a virtual element to the `elements.reference` option,", "as it must be a real DOM element. Use `context.setPositionReference()`", "instead."); |
| 6937 |
} |
| 6938 |
} |
| 6939 |
const store = useRefWithInit(() => new FloatingRootStore({ |
| 6940 |
open, |
| 6941 |
transitionStatus: void 0, |
| 6942 |
onOpenChange, |
| 6943 |
referenceElement: elements.reference ?? null, |
| 6944 |
floatingElement: elements.floating ?? null, |
| 6945 |
triggerElements: new PopupTriggerMap(), |
| 6946 |
floatingId, |
| 6947 |
syncOnly: false, |
| 6948 |
nested |
| 6949 |
})).current; |
| 6950 |
useIsoLayoutEffect(() => { |
| 6951 |
const valuesToSync = { |
| 6952 |
open, |
| 6953 |
floatingId |
| 6954 |
}; |
| 6955 |
if (elements.reference !== void 0) { |
| 6956 |
valuesToSync.referenceElement = elements.reference; |
| 6957 |
valuesToSync.domReferenceElement = isElement(elements.reference) ? elements.reference : null; |
| 6958 |
} |
| 6959 |
if (elements.floating !== void 0) { |
| 6960 |
valuesToSync.floatingElement = elements.floating; |
| 6961 |
} |
| 6962 |
store.update(valuesToSync); |
| 6963 |
}, [open, floatingId, elements.reference, elements.floating, store]); |
| 6964 |
store.context.onOpenChange = onOpenChange; |
| 6965 |
store.context.nested = nested; |
| 6966 |
return store; |
| 6967 |
} |
| 6968 |
|
| 6969 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useFloating.js |
| 6970 |
function useFloating2(options = {}) { |
| 6971 |
const { |
| 6972 |
nodeId, |
| 6973 |
externalTree |
| 6974 |
} = options; |
| 6975 |
const internalStore = useFloatingRootContext(options); |
| 6976 |
const store = options.rootContext || internalStore; |
| 6977 |
const referenceElement = store.useState("referenceElement"); |
| 6978 |
const floatingElement = store.useState("floatingElement"); |
| 6979 |
const domReferenceElement = store.useState("domReferenceElement"); |
| 6980 |
const open = store.useState("open"); |
| 6981 |
const floatingId = store.useState("floatingId"); |
| 6982 |
const [positionReference, setPositionReferenceRaw] = React25.useState(null); |
| 6983 |
const [localDomReference, setLocalDomReference] = React25.useState(void 0); |
| 6984 |
const [localFloatingElement, setLocalFloatingElement] = React25.useState(void 0); |
| 6985 |
const domReferenceRef = React25.useRef(null); |
| 6986 |
const tree = useFloatingTree(externalTree); |
| 6987 |
const storeElements = React25.useMemo(() => ({ |
| 6988 |
reference: referenceElement, |
| 6989 |
floating: floatingElement, |
| 6990 |
domReference: domReferenceElement |
| 6991 |
}), [referenceElement, floatingElement, domReferenceElement]); |
| 6992 |
const position = useFloating({ |
| 6993 |
...options, |
| 6994 |
elements: { |
| 6995 |
...storeElements, |
| 6996 |
...positionReference && { |
| 6997 |
reference: positionReference |
| 6998 |
} |
| 6999 |
} |
| 7000 |
}); |
| 7001 |
const localDomReferenceElement = isElement(localDomReference) ? localDomReference : null; |
| 7002 |
const syncedFloatingElement = localFloatingElement === void 0 ? store.state.floatingElement : localFloatingElement; |
| 7003 |
store.useSyncedValue("referenceElement", localDomReference ?? null); |
| 7004 |
store.useSyncedValue("domReferenceElement", localDomReference === void 0 ? domReferenceElement : localDomReferenceElement); |
| 7005 |
store.useSyncedValue("floatingElement", syncedFloatingElement); |
| 7006 |
const setPositionReference = React25.useCallback((node) => { |
| 7007 |
const computedPositionReference = isElement(node) ? { |
| 7008 |
getBoundingClientRect: () => node.getBoundingClientRect(), |
| 7009 |
getClientRects: () => node.getClientRects(), |
| 7010 |
contextElement: node |
| 7011 |
} : node; |
| 7012 |
setPositionReferenceRaw(computedPositionReference); |
| 7013 |
position.refs.setReference(computedPositionReference); |
| 7014 |
}, [position.refs]); |
| 7015 |
const setReference = React25.useCallback((node) => { |
| 7016 |
if (isElement(node) || node === null) { |
| 7017 |
domReferenceRef.current = node; |
| 7018 |
setLocalDomReference(node); |
| 7019 |
} |
| 7020 |
if (isElement(position.refs.reference.current) || position.refs.reference.current === null || // Don't allow setting virtual elements using the old technique back to |
| 7021 |
// `null` to support `positionReference` + an unstable `reference` |
| 7022 |
// callback ref. |
| 7023 |
node !== null && !isElement(node)) { |
| 7024 |
position.refs.setReference(node); |
| 7025 |
} |
| 7026 |
}, [position.refs, setLocalDomReference]); |
| 7027 |
const setFloating = React25.useCallback((node) => { |
| 7028 |
setLocalFloatingElement(node); |
| 7029 |
position.refs.setFloating(node); |
| 7030 |
}, [position.refs]); |
| 7031 |
const refs = React25.useMemo(() => ({ |
| 7032 |
...position.refs, |
| 7033 |
setReference, |
| 7034 |
setFloating, |
| 7035 |
setPositionReference, |
| 7036 |
domReference: domReferenceRef |
| 7037 |
}), [position.refs, setReference, setFloating, setPositionReference]); |
| 7038 |
const elements = React25.useMemo(() => ({ |
| 7039 |
...position.elements, |
| 7040 |
domReference: domReferenceElement |
| 7041 |
}), [position.elements, domReferenceElement]); |
| 7042 |
const context = React25.useMemo(() => ({ |
| 7043 |
...position, |
| 7044 |
dataRef: store.context.dataRef, |
| 7045 |
open, |
| 7046 |
onOpenChange: store.setOpen, |
| 7047 |
events: store.context.events, |
| 7048 |
floatingId, |
| 7049 |
refs, |
| 7050 |
elements, |
| 7051 |
nodeId, |
| 7052 |
rootStore: store |
| 7053 |
}), [position, refs, elements, nodeId, store, open, floatingId]); |
| 7054 |
useIsoLayoutEffect(() => { |
| 7055 |
if (domReferenceElement) { |
| 7056 |
domReferenceRef.current = domReferenceElement; |
| 7057 |
} |
| 7058 |
}, [domReferenceElement]); |
| 7059 |
useIsoLayoutEffect(() => { |
| 7060 |
store.context.dataRef.current.floatingContext = context; |
| 7061 |
const node = tree?.nodesRef.current.find((n2) => n2.id === nodeId); |
| 7062 |
if (node) { |
| 7063 |
node.context = context; |
| 7064 |
} |
| 7065 |
}); |
| 7066 |
return React25.useMemo(() => ({ |
| 7067 |
...position, |
| 7068 |
context, |
| 7069 |
refs, |
| 7070 |
elements, |
| 7071 |
rootStore: store |
| 7072 |
}), [position, refs, elements, context, store]); |
| 7073 |
} |
| 7074 |
|
| 7075 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useFocus.js |
| 7076 |
var React26 = __toESM(require_react(), 1); |
| 7077 |
var isMacSafari = isMac && isSafari; |
| 7078 |
function useFocus(context, props = {}) { |
| 7079 |
const { |
| 7080 |
enabled = true, |
| 7081 |
delay |
| 7082 |
} = props; |
| 7083 |
const store = "rootStore" in context ? context.rootStore : context; |
| 7084 |
const { |
| 7085 |
events, |
| 7086 |
dataRef |
| 7087 |
} = store.context; |
| 7088 |
const blockFocusRef = React26.useRef(false); |
| 7089 |
const blockedReferenceRef = React26.useRef(null); |
| 7090 |
const keyboardModalityRef = React26.useRef(true); |
| 7091 |
const timeout = useTimeout(); |
| 7092 |
React26.useEffect(() => { |
| 7093 |
const domReference = store.select("domReferenceElement"); |
| 7094 |
if (!enabled) { |
| 7095 |
return void 0; |
| 7096 |
} |
| 7097 |
const win = getWindow(domReference); |
| 7098 |
function onBlur() { |
| 7099 |
const currentDomReference = store.select("domReferenceElement"); |
| 7100 |
if (!store.select("open") && isHTMLElement(currentDomReference) && currentDomReference === activeElement(ownerDocument(currentDomReference))) { |
| 7101 |
blockFocusRef.current = true; |
| 7102 |
} |
| 7103 |
} |
| 7104 |
function onKeyDown() { |
| 7105 |
keyboardModalityRef.current = true; |
| 7106 |
} |
| 7107 |
function onPointerDown() { |
| 7108 |
keyboardModalityRef.current = false; |
| 7109 |
} |
| 7110 |
return mergeCleanups(addEventListener(win, "blur", onBlur), isMacSafari && addEventListener(win, "keydown", onKeyDown, true), isMacSafari && addEventListener(win, "pointerdown", onPointerDown, true)); |
| 7111 |
}, [store, enabled]); |
| 7112 |
React26.useEffect(() => { |
| 7113 |
if (!enabled) { |
| 7114 |
return void 0; |
| 7115 |
} |
| 7116 |
function onOpenChangeLocal(details) { |
| 7117 |
if (details.reason === reason_parts_exports.triggerPress || details.reason === reason_parts_exports.escapeKey) { |
| 7118 |
const referenceElement = store.select("domReferenceElement"); |
| 7119 |
if (isElement(referenceElement)) { |
| 7120 |
blockedReferenceRef.current = referenceElement; |
| 7121 |
blockFocusRef.current = true; |
| 7122 |
} |
| 7123 |
} |
| 7124 |
} |
| 7125 |
events.on("openchange", onOpenChangeLocal); |
| 7126 |
return () => { |
| 7127 |
events.off("openchange", onOpenChangeLocal); |
| 7128 |
}; |
| 7129 |
}, [events, enabled, store]); |
| 7130 |
const reference = React26.useMemo(() => { |
| 7131 |
function resetBlockedFocus() { |
| 7132 |
blockFocusRef.current = false; |
| 7133 |
blockedReferenceRef.current = null; |
| 7134 |
} |
| 7135 |
return { |
| 7136 |
onMouseLeave() { |
| 7137 |
resetBlockedFocus(); |
| 7138 |
}, |
| 7139 |
onFocus(event) { |
| 7140 |
const focusTarget = event.currentTarget; |
| 7141 |
if (blockFocusRef.current) { |
| 7142 |
if (blockedReferenceRef.current === focusTarget) { |
| 7143 |
return; |
| 7144 |
} |
| 7145 |
resetBlockedFocus(); |
| 7146 |
} |
| 7147 |
const target = getTarget(event.nativeEvent); |
| 7148 |
if (isElement(target)) { |
| 7149 |
if (isMacSafari && !event.relatedTarget) { |
| 7150 |
if (!keyboardModalityRef.current && !isTypeableElement(target)) { |
| 7151 |
return; |
| 7152 |
} |
| 7153 |
} else if (!matchesFocusVisible(target)) { |
| 7154 |
return; |
| 7155 |
} |
| 7156 |
} |
| 7157 |
const movedFromOtherEnabledTrigger = isTargetInsideEnabledTrigger(event.relatedTarget, store.context.triggerElements); |
| 7158 |
const { |
| 7159 |
nativeEvent, |
| 7160 |
currentTarget |
| 7161 |
} = event; |
| 7162 |
const delayValue = typeof delay === "function" ? delay() : delay; |
| 7163 |
if (store.select("open") && movedFromOtherEnabledTrigger || delayValue === 0 || delayValue === void 0) { |
| 7164 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerFocus, nativeEvent, currentTarget)); |
| 7165 |
return; |
| 7166 |
} |
| 7167 |
timeout.start(delayValue, () => { |
| 7168 |
if (blockFocusRef.current) { |
| 7169 |
return; |
| 7170 |
} |
| 7171 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerFocus, nativeEvent, currentTarget)); |
| 7172 |
}); |
| 7173 |
}, |
| 7174 |
onBlur(event) { |
| 7175 |
resetBlockedFocus(); |
| 7176 |
const relatedTarget = event.relatedTarget; |
| 7177 |
const nativeEvent = event.nativeEvent; |
| 7178 |
const movedToFocusGuard = isElement(relatedTarget) && relatedTarget.hasAttribute(createAttribute("focus-guard")) && relatedTarget.getAttribute("data-type") === "outside"; |
| 7179 |
timeout.start(0, () => { |
| 7180 |
const domReference = store.select("domReferenceElement"); |
| 7181 |
const activeEl = activeElement(ownerDocument(domReference)); |
| 7182 |
if (!relatedTarget && activeEl === domReference) { |
| 7183 |
return; |
| 7184 |
} |
| 7185 |
if (contains(dataRef.current.floatingContext?.refs.floating.current, activeEl) || contains(domReference, activeEl) || movedToFocusGuard) { |
| 7186 |
return; |
| 7187 |
} |
| 7188 |
const nextFocusedElement = relatedTarget ?? activeEl; |
| 7189 |
if (isTargetInsideEnabledTrigger(nextFocusedElement, store.context.triggerElements)) { |
| 7190 |
return; |
| 7191 |
} |
| 7192 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerFocus, nativeEvent)); |
| 7193 |
}); |
| 7194 |
} |
| 7195 |
}; |
| 7196 |
}, [dataRef, delay, store, timeout]); |
| 7197 |
return React26.useMemo(() => enabled ? { |
| 7198 |
reference, |
| 7199 |
trigger: reference |
| 7200 |
} : {}, [enabled, reference]); |
| 7201 |
} |
| 7202 |
|
| 7203 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useHoverFloatingInteraction.js |
| 7204 |
var React27 = __toESM(require_react(), 1); |
| 7205 |
|
| 7206 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useHoverInteractionSharedState.js |
| 7207 |
var HoverInteraction = class _HoverInteraction { |
| 7208 |
constructor() { |
| 7209 |
this.pointerType = void 0; |
| 7210 |
this.interactedInside = false; |
| 7211 |
this.handler = void 0; |
| 7212 |
this.blockMouseMove = true; |
| 7213 |
this.performedPointerEventsMutation = false; |
| 7214 |
this.pointerEventsScopeElement = null; |
| 7215 |
this.pointerEventsReferenceElement = null; |
| 7216 |
this.pointerEventsFloatingElement = null; |
| 7217 |
this.restTimeoutPending = false; |
| 7218 |
this.openChangeTimeout = new Timeout(); |
| 7219 |
this.restTimeout = new Timeout(); |
| 7220 |
this.handleCloseOptions = void 0; |
| 7221 |
} |
| 7222 |
static create() { |
| 7223 |
return new _HoverInteraction(); |
| 7224 |
} |
| 7225 |
dispose = () => { |
| 7226 |
this.openChangeTimeout.clear(); |
| 7227 |
this.restTimeout.clear(); |
| 7228 |
}; |
| 7229 |
disposeEffect = () => { |
| 7230 |
return this.dispose; |
| 7231 |
}; |
| 7232 |
}; |
| 7233 |
var pointerEventsMutationOwnerByScopeElement = /* @__PURE__ */ new WeakMap(); |
| 7234 |
function clearSafePolygonPointerEventsMutation(instance) { |
| 7235 |
if (!instance.performedPointerEventsMutation) { |
| 7236 |
return; |
| 7237 |
} |
| 7238 |
const scopeElement = instance.pointerEventsScopeElement; |
| 7239 |
if (scopeElement && pointerEventsMutationOwnerByScopeElement.get(scopeElement) === instance) { |
| 7240 |
instance.pointerEventsScopeElement?.style.removeProperty("pointer-events"); |
| 7241 |
instance.pointerEventsReferenceElement?.style.removeProperty("pointer-events"); |
| 7242 |
instance.pointerEventsFloatingElement?.style.removeProperty("pointer-events"); |
| 7243 |
pointerEventsMutationOwnerByScopeElement.delete(scopeElement); |
| 7244 |
} |
| 7245 |
instance.performedPointerEventsMutation = false; |
| 7246 |
instance.pointerEventsScopeElement = null; |
| 7247 |
instance.pointerEventsReferenceElement = null; |
| 7248 |
instance.pointerEventsFloatingElement = null; |
| 7249 |
} |
| 7250 |
function applySafePolygonPointerEventsMutation(instance, options) { |
| 7251 |
const { |
| 7252 |
scopeElement, |
| 7253 |
referenceElement, |
| 7254 |
floatingElement |
| 7255 |
} = options; |
| 7256 |
const existingOwner = pointerEventsMutationOwnerByScopeElement.get(scopeElement); |
| 7257 |
if (existingOwner && existingOwner !== instance) { |
| 7258 |
clearSafePolygonPointerEventsMutation(existingOwner); |
| 7259 |
} |
| 7260 |
clearSafePolygonPointerEventsMutation(instance); |
| 7261 |
instance.performedPointerEventsMutation = true; |
| 7262 |
instance.pointerEventsScopeElement = scopeElement; |
| 7263 |
instance.pointerEventsReferenceElement = referenceElement; |
| 7264 |
instance.pointerEventsFloatingElement = floatingElement; |
| 7265 |
pointerEventsMutationOwnerByScopeElement.set(scopeElement, instance); |
| 7266 |
scopeElement.style.pointerEvents = "none"; |
| 7267 |
referenceElement.style.pointerEvents = "auto"; |
| 7268 |
floatingElement.style.pointerEvents = "auto"; |
| 7269 |
} |
| 7270 |
function useHoverInteractionSharedState(store) { |
| 7271 |
const data = store.context.dataRef.current; |
| 7272 |
const instance = useRefWithInit(() => data.hoverInteractionState ?? HoverInteraction.create()).current; |
| 7273 |
if (!data.hoverInteractionState) { |
| 7274 |
data.hoverInteractionState = instance; |
| 7275 |
} |
| 7276 |
useOnMount(data.hoverInteractionState.disposeEffect); |
| 7277 |
return data.hoverInteractionState; |
| 7278 |
} |
| 7279 |
|
| 7280 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useHoverFloatingInteraction.js |
| 7281 |
function useHoverFloatingInteraction(context, parameters = {}) { |
| 7282 |
const { |
| 7283 |
enabled = true, |
| 7284 |
closeDelay: closeDelayProp = 0, |
| 7285 |
nodeId: nodeIdProp |
| 7286 |
} = parameters; |
| 7287 |
const store = "rootStore" in context ? context.rootStore : context; |
| 7288 |
const open = store.useState("open"); |
| 7289 |
const floatingElement = store.useState("floatingElement"); |
| 7290 |
const domReferenceElement = store.useState("domReferenceElement"); |
| 7291 |
const { |
| 7292 |
dataRef |
| 7293 |
} = store.context; |
| 7294 |
const tree = useFloatingTree(); |
| 7295 |
const parentId = useFloatingParentNodeId(); |
| 7296 |
const instance = useHoverInteractionSharedState(store); |
| 7297 |
const childClosedTimeout = useTimeout(); |
| 7298 |
const isClickLikeOpenEvent2 = useStableCallback(() => { |
| 7299 |
return isClickLikeOpenEvent(dataRef.current.openEvent?.type, instance.interactedInside); |
| 7300 |
}); |
| 7301 |
const isHoverOpen = useStableCallback(() => { |
| 7302 |
return isHoverOpenEvent(dataRef.current.openEvent?.type); |
| 7303 |
}); |
| 7304 |
const clearPointerEvents = useStableCallback(() => { |
| 7305 |
clearSafePolygonPointerEventsMutation(instance); |
| 7306 |
}); |
| 7307 |
useIsoLayoutEffect(() => { |
| 7308 |
if (!open) { |
| 7309 |
instance.pointerType = void 0; |
| 7310 |
instance.restTimeoutPending = false; |
| 7311 |
instance.interactedInside = false; |
| 7312 |
clearPointerEvents(); |
| 7313 |
} |
| 7314 |
}, [open, instance, clearPointerEvents]); |
| 7315 |
React27.useEffect(() => { |
| 7316 |
return clearPointerEvents; |
| 7317 |
}, [clearPointerEvents]); |
| 7318 |
useIsoLayoutEffect(() => { |
| 7319 |
if (!enabled) { |
| 7320 |
return void 0; |
| 7321 |
} |
| 7322 |
if (open && instance.handleCloseOptions?.blockPointerEvents && isHoverOpen() && isElement(domReferenceElement) && floatingElement) { |
| 7323 |
const ref = domReferenceElement; |
| 7324 |
const floatingEl = floatingElement; |
| 7325 |
const doc = ownerDocument(floatingElement); |
| 7326 |
const parentFloating = tree?.nodesRef.current.find((node) => node.id === parentId)?.context?.elements.floating; |
| 7327 |
if (parentFloating) { |
| 7328 |
parentFloating.style.pointerEvents = ""; |
| 7329 |
} |
| 7330 |
const cachedScopeElement = instance.pointerEventsScopeElement !== floatingEl ? instance.pointerEventsScopeElement : null; |
| 7331 |
const parentScopeElement = parentFloating !== floatingEl ? parentFloating : null; |
| 7332 |
const scopeElement = instance.handleCloseOptions?.getScope?.() ?? cachedScopeElement ?? parentScopeElement ?? ref.closest("[data-rootownerid]") ?? doc.body; |
| 7333 |
applySafePolygonPointerEventsMutation(instance, { |
| 7334 |
scopeElement, |
| 7335 |
referenceElement: ref, |
| 7336 |
floatingElement: floatingEl |
| 7337 |
}); |
| 7338 |
return () => { |
| 7339 |
clearPointerEvents(); |
| 7340 |
}; |
| 7341 |
} |
| 7342 |
return void 0; |
| 7343 |
}, [enabled, open, domReferenceElement, floatingElement, instance, isHoverOpen, tree, parentId, clearPointerEvents]); |
| 7344 |
React27.useEffect(() => { |
| 7345 |
if (!enabled) { |
| 7346 |
return void 0; |
| 7347 |
} |
| 7348 |
function hasParentChildren() { |
| 7349 |
return !!(tree && parentId && getNodeChildren(tree.nodesRef.current, parentId).length > 0); |
| 7350 |
} |
| 7351 |
function closeWithDelay(event) { |
| 7352 |
const closeDelay = getDelay(closeDelayProp, "close", instance.pointerType); |
| 7353 |
const close = () => { |
| 7354 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerHover, event)); |
| 7355 |
tree?.events.emit("floating.closed", event); |
| 7356 |
}; |
| 7357 |
if (closeDelay) { |
| 7358 |
instance.openChangeTimeout.start(closeDelay, close); |
| 7359 |
} else { |
| 7360 |
instance.openChangeTimeout.clear(); |
| 7361 |
close(); |
| 7362 |
} |
| 7363 |
} |
| 7364 |
function handleInteractInside(event) { |
| 7365 |
const target = getTarget(event); |
| 7366 |
if (!isInteractiveElement(target)) { |
| 7367 |
instance.interactedInside = false; |
| 7368 |
return; |
| 7369 |
} |
| 7370 |
instance.interactedInside = target?.closest("[aria-haspopup]") != null; |
| 7371 |
} |
| 7372 |
function onFloatingMouseEnter() { |
| 7373 |
instance.openChangeTimeout.clear(); |
| 7374 |
childClosedTimeout.clear(); |
| 7375 |
tree?.events.off("floating.closed", onNodeClosed); |
| 7376 |
clearPointerEvents(); |
| 7377 |
} |
| 7378 |
function onFloatingMouseLeave(event) { |
| 7379 |
if (hasParentChildren() && tree) { |
| 7380 |
tree.events.on("floating.closed", onNodeClosed); |
| 7381 |
return; |
| 7382 |
} |
| 7383 |
if (isTargetInsideEnabledTrigger(event.relatedTarget, store.context.triggerElements)) { |
| 7384 |
return; |
| 7385 |
} |
| 7386 |
const currentNodeId = dataRef.current.floatingContext?.nodeId ?? nodeIdProp; |
| 7387 |
const relatedTarget = event.relatedTarget; |
| 7388 |
const isMovingIntoDescendantFloating = tree && currentNodeId && isElement(relatedTarget) && getNodeChildren(tree.nodesRef.current, currentNodeId, false).some((node) => contains(node.context?.elements.floating, relatedTarget)); |
| 7389 |
if (isMovingIntoDescendantFloating) { |
| 7390 |
return; |
| 7391 |
} |
| 7392 |
if (instance.handler) { |
| 7393 |
instance.handler(event); |
| 7394 |
return; |
| 7395 |
} |
| 7396 |
clearPointerEvents(); |
| 7397 |
if (!isClickLikeOpenEvent2()) { |
| 7398 |
closeWithDelay(event); |
| 7399 |
} |
| 7400 |
} |
| 7401 |
function onNodeClosed(event) { |
| 7402 |
if (!tree || !parentId || hasParentChildren()) { |
| 7403 |
return; |
| 7404 |
} |
| 7405 |
childClosedTimeout.start(0, () => { |
| 7406 |
tree.events.off("floating.closed", onNodeClosed); |
| 7407 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerHover, event)); |
| 7408 |
tree.events.emit("floating.closed", event); |
| 7409 |
}); |
| 7410 |
} |
| 7411 |
const floating = floatingElement; |
| 7412 |
return mergeCleanups(floating && addEventListener(floating, "mouseenter", onFloatingMouseEnter), floating && addEventListener(floating, "mouseleave", onFloatingMouseLeave), floating && addEventListener(floating, "pointerdown", handleInteractInside, true), () => { |
| 7413 |
tree?.events.off("floating.closed", onNodeClosed); |
| 7414 |
}); |
| 7415 |
}, [enabled, floatingElement, store, dataRef, closeDelayProp, nodeIdProp, isClickLikeOpenEvent2, clearPointerEvents, instance, tree, parentId, childClosedTimeout]); |
| 7416 |
} |
| 7417 |
|
| 7418 |
// node_modules/@base-ui/react/esm/floating-ui-react/hooks/useHoverReferenceInteraction.js |
| 7419 |
var React28 = __toESM(require_react(), 1); |
| 7420 |
var ReactDOM4 = __toESM(require_react_dom(), 1); |
| 7421 |
var EMPTY_REF = { |
| 7422 |
current: null |
| 7423 |
}; |
| 7424 |
function useHoverReferenceInteraction(context, props = {}) { |
| 7425 |
const { |
| 7426 |
enabled = true, |
| 7427 |
delay = 0, |
| 7428 |
handleClose = null, |
| 7429 |
mouseOnly = false, |
| 7430 |
restMs = 0, |
| 7431 |
move = true, |
| 7432 |
triggerElementRef = EMPTY_REF, |
| 7433 |
externalTree, |
| 7434 |
isActiveTrigger = true, |
| 7435 |
getHandleCloseContext, |
| 7436 |
isClosing, |
| 7437 |
shouldOpen: shouldOpenProp |
| 7438 |
} = props; |
| 7439 |
const store = "rootStore" in context ? context.rootStore : context; |
| 7440 |
const { |
| 7441 |
dataRef, |
| 7442 |
events |
| 7443 |
} = store.context; |
| 7444 |
const tree = useFloatingTree(externalTree); |
| 7445 |
const instance = useHoverInteractionSharedState(store); |
| 7446 |
const isHoverCloseActiveRef = React28.useRef(false); |
| 7447 |
const handleCloseRef = useValueAsRef(handleClose); |
| 7448 |
const delayRef = useValueAsRef(delay); |
| 7449 |
const restMsRef = useValueAsRef(restMs); |
| 7450 |
const enabledRef = useValueAsRef(enabled); |
| 7451 |
const shouldOpenRef = useValueAsRef(shouldOpenProp); |
| 7452 |
const isClosingRef = useValueAsRef(isClosing); |
| 7453 |
const isClickLikeOpenEvent2 = useStableCallback(() => { |
| 7454 |
return isClickLikeOpenEvent(dataRef.current.openEvent?.type, instance.interactedInside); |
| 7455 |
}); |
| 7456 |
const checkShouldOpen = useStableCallback(() => { |
| 7457 |
return shouldOpenRef.current?.() !== false; |
| 7458 |
}); |
| 7459 |
const isOverInactiveTrigger = useStableCallback((currentDomReference, currentTarget, target) => { |
| 7460 |
const allTriggers = store.context.triggerElements; |
| 7461 |
if (allTriggers.hasElement(currentTarget)) { |
| 7462 |
return !currentDomReference || !contains(currentDomReference, currentTarget); |
| 7463 |
} |
| 7464 |
if (!isElement(target)) { |
| 7465 |
return false; |
| 7466 |
} |
| 7467 |
const targetElement = target; |
| 7468 |
return allTriggers.hasMatchingElement((trigger) => contains(trigger, targetElement)) && (!currentDomReference || !contains(currentDomReference, targetElement)); |
| 7469 |
}); |
| 7470 |
const cleanupMouseMoveHandler = useStableCallback(() => { |
| 7471 |
if (!instance.handler) { |
| 7472 |
return; |
| 7473 |
} |
| 7474 |
const doc = ownerDocument(store.select("domReferenceElement")); |
| 7475 |
doc.removeEventListener("mousemove", instance.handler); |
| 7476 |
instance.handler = void 0; |
| 7477 |
}); |
| 7478 |
const clearPointerEvents = useStableCallback(() => { |
| 7479 |
clearSafePolygonPointerEventsMutation(instance); |
| 7480 |
}); |
| 7481 |
if (isActiveTrigger) { |
| 7482 |
instance.handleCloseOptions = handleCloseRef.current?.__options; |
| 7483 |
} |
| 7484 |
React28.useEffect(() => cleanupMouseMoveHandler, [cleanupMouseMoveHandler]); |
| 7485 |
React28.useEffect(() => { |
| 7486 |
if (!enabled) { |
| 7487 |
return void 0; |
| 7488 |
} |
| 7489 |
function onOpenChangeLocal(details) { |
| 7490 |
if (!details.open) { |
| 7491 |
isHoverCloseActiveRef.current = details.reason === reason_parts_exports.triggerHover; |
| 7492 |
cleanupMouseMoveHandler(); |
| 7493 |
instance.openChangeTimeout.clear(); |
| 7494 |
instance.restTimeout.clear(); |
| 7495 |
instance.blockMouseMove = true; |
| 7496 |
instance.restTimeoutPending = false; |
| 7497 |
} else { |
| 7498 |
isHoverCloseActiveRef.current = false; |
| 7499 |
} |
| 7500 |
} |
| 7501 |
events.on("openchange", onOpenChangeLocal); |
| 7502 |
return () => { |
| 7503 |
events.off("openchange", onOpenChangeLocal); |
| 7504 |
}; |
| 7505 |
}, [enabled, events, instance, cleanupMouseMoveHandler]); |
| 7506 |
React28.useEffect(() => { |
| 7507 |
if (!enabled) { |
| 7508 |
return void 0; |
| 7509 |
} |
| 7510 |
function closeWithDelay(event, runElseBranch = true) { |
| 7511 |
const closeDelay = getDelay(delayRef.current, "close", instance.pointerType); |
| 7512 |
if (closeDelay) { |
| 7513 |
instance.openChangeTimeout.start(closeDelay, () => { |
| 7514 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerHover, event)); |
| 7515 |
tree?.events.emit("floating.closed", event); |
| 7516 |
}); |
| 7517 |
} else if (runElseBranch) { |
| 7518 |
instance.openChangeTimeout.clear(); |
| 7519 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerHover, event)); |
| 7520 |
tree?.events.emit("floating.closed", event); |
| 7521 |
} |
| 7522 |
} |
| 7523 |
const trigger = triggerElementRef.current ?? (isActiveTrigger ? store.select("domReferenceElement") : null); |
| 7524 |
if (!isElement(trigger)) { |
| 7525 |
return void 0; |
| 7526 |
} |
| 7527 |
function onMouseEnter(event) { |
| 7528 |
instance.openChangeTimeout.clear(); |
| 7529 |
instance.blockMouseMove = false; |
| 7530 |
if (mouseOnly && !isMouseLikePointerType(instance.pointerType)) { |
| 7531 |
return; |
| 7532 |
} |
| 7533 |
const restMsValue = getRestMs(restMsRef.current); |
| 7534 |
const openDelay = getDelay(delayRef.current, "open", instance.pointerType); |
| 7535 |
const eventTarget = getTarget(event); |
| 7536 |
const currentTarget = event.currentTarget ?? null; |
| 7537 |
const currentDomReference = store.select("domReferenceElement"); |
| 7538 |
let triggerNode = currentTarget; |
| 7539 |
if (isElement(eventTarget) && !store.context.triggerElements.hasElement(eventTarget)) { |
| 7540 |
for (const triggerElement of store.context.triggerElements.elements()) { |
| 7541 |
if (contains(triggerElement, eventTarget)) { |
| 7542 |
triggerNode = triggerElement; |
| 7543 |
break; |
| 7544 |
} |
| 7545 |
} |
| 7546 |
} |
| 7547 |
if (isElement(currentTarget) && isElement(currentDomReference) && !store.context.triggerElements.hasElement(currentTarget) && contains(currentTarget, currentDomReference)) { |
| 7548 |
triggerNode = currentDomReference; |
| 7549 |
} |
| 7550 |
const isOverInactive = triggerNode == null ? false : isOverInactiveTrigger(currentDomReference, triggerNode, eventTarget); |
| 7551 |
const isOpen = store.select("open"); |
| 7552 |
const isInClosingTransition = isClosingRef.current?.() ?? store.select("transitionStatus") === "ending"; |
| 7553 |
const isHoverCloseTransition = !isOpen && isInClosingTransition && isHoverCloseActiveRef.current; |
| 7554 |
const isReenteringSameTriggerDuringCloseTransition = !isOverInactive && isElement(triggerNode) && isElement(currentDomReference) && contains(currentDomReference, triggerNode) && isHoverCloseTransition; |
| 7555 |
const isRestOnlyDelay = restMsValue > 0 && !openDelay; |
| 7556 |
const shouldOpenImmediately = isOverInactive && (isOpen || isHoverCloseTransition) || isReenteringSameTriggerDuringCloseTransition; |
| 7557 |
const shouldOpen = !isOpen || isOverInactive; |
| 7558 |
if (shouldOpenImmediately) { |
| 7559 |
if (checkShouldOpen()) { |
| 7560 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerHover, event, triggerNode)); |
| 7561 |
} |
| 7562 |
return; |
| 7563 |
} |
| 7564 |
if (isRestOnlyDelay) { |
| 7565 |
return; |
| 7566 |
} |
| 7567 |
if (openDelay) { |
| 7568 |
instance.openChangeTimeout.start(openDelay, () => { |
| 7569 |
if (shouldOpen && checkShouldOpen()) { |
| 7570 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerHover, event, triggerNode)); |
| 7571 |
} |
| 7572 |
}); |
| 7573 |
} else if (shouldOpen) { |
| 7574 |
if (checkShouldOpen()) { |
| 7575 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerHover, event, triggerNode)); |
| 7576 |
} |
| 7577 |
} |
| 7578 |
} |
| 7579 |
function onMouseLeave(event) { |
| 7580 |
if (isClickLikeOpenEvent2()) { |
| 7581 |
clearPointerEvents(); |
| 7582 |
return; |
| 7583 |
} |
| 7584 |
cleanupMouseMoveHandler(); |
| 7585 |
const domReferenceElement = store.select("domReferenceElement"); |
| 7586 |
const doc = ownerDocument(domReferenceElement); |
| 7587 |
instance.restTimeout.clear(); |
| 7588 |
instance.restTimeoutPending = false; |
| 7589 |
const handleCloseContextBase = dataRef.current.floatingContext ?? getHandleCloseContext?.(); |
| 7590 |
if (isTargetInsideEnabledTrigger(event.relatedTarget, store.context.triggerElements)) { |
| 7591 |
return; |
| 7592 |
} |
| 7593 |
if (handleCloseRef.current && handleCloseContextBase) { |
| 7594 |
if (!store.select("open")) { |
| 7595 |
instance.openChangeTimeout.clear(); |
| 7596 |
} |
| 7597 |
const currentTrigger = triggerElementRef.current; |
| 7598 |
instance.handler = handleCloseRef.current({ |
| 7599 |
...handleCloseContextBase, |
| 7600 |
tree, |
| 7601 |
x: event.clientX, |
| 7602 |
y: event.clientY, |
| 7603 |
onClose() { |
| 7604 |
clearPointerEvents(); |
| 7605 |
cleanupMouseMoveHandler(); |
| 7606 |
if (enabledRef.current && !isClickLikeOpenEvent2() && currentTrigger === store.select("domReferenceElement")) { |
| 7607 |
closeWithDelay(event, true); |
| 7608 |
} |
| 7609 |
} |
| 7610 |
}); |
| 7611 |
doc.addEventListener("mousemove", instance.handler); |
| 7612 |
instance.handler(event); |
| 7613 |
return; |
| 7614 |
} |
| 7615 |
const shouldClose = instance.pointerType === "touch" ? !contains(store.select("floatingElement"), event.relatedTarget) : true; |
| 7616 |
if (shouldClose) { |
| 7617 |
closeWithDelay(event); |
| 7618 |
} |
| 7619 |
} |
| 7620 |
if (move) { |
| 7621 |
return mergeCleanups(addEventListener(trigger, "mousemove", onMouseEnter, { |
| 7622 |
once: true |
| 7623 |
}), addEventListener(trigger, "mouseenter", onMouseEnter), addEventListener(trigger, "mouseleave", onMouseLeave)); |
| 7624 |
} |
| 7625 |
return mergeCleanups(addEventListener(trigger, "mouseenter", onMouseEnter), addEventListener(trigger, "mouseleave", onMouseLeave)); |
| 7626 |
}, [cleanupMouseMoveHandler, clearPointerEvents, dataRef, delayRef, store, enabled, handleCloseRef, instance, isActiveTrigger, isOverInactiveTrigger, isClickLikeOpenEvent2, mouseOnly, move, restMsRef, triggerElementRef, tree, enabledRef, getHandleCloseContext, isClosingRef, checkShouldOpen]); |
| 7627 |
return React28.useMemo(() => { |
| 7628 |
if (!enabled) { |
| 7629 |
return void 0; |
| 7630 |
} |
| 7631 |
function setPointerRef(event) { |
| 7632 |
instance.pointerType = event.pointerType; |
| 7633 |
} |
| 7634 |
return { |
| 7635 |
onPointerDown: setPointerRef, |
| 7636 |
onPointerEnter: setPointerRef, |
| 7637 |
onMouseMove(event) { |
| 7638 |
const { |
| 7639 |
nativeEvent |
| 7640 |
} = event; |
| 7641 |
const trigger = event.currentTarget; |
| 7642 |
const currentDomReference = store.select("domReferenceElement"); |
| 7643 |
const currentOpen = store.select("open"); |
| 7644 |
const isOverInactive = isOverInactiveTrigger(currentDomReference, trigger, event.target); |
| 7645 |
if (mouseOnly && !isMouseLikePointerType(instance.pointerType)) { |
| 7646 |
return; |
| 7647 |
} |
| 7648 |
if (currentOpen && isOverInactive && instance.handleCloseOptions?.blockPointerEvents) { |
| 7649 |
const floatingElement = store.select("floatingElement"); |
| 7650 |
if (floatingElement) { |
| 7651 |
const scopeElement = instance.handleCloseOptions?.getScope?.() ?? trigger.ownerDocument.body; |
| 7652 |
applySafePolygonPointerEventsMutation(instance, { |
| 7653 |
scopeElement, |
| 7654 |
referenceElement: trigger, |
| 7655 |
floatingElement |
| 7656 |
}); |
| 7657 |
} |
| 7658 |
} |
| 7659 |
const restMsValue = getRestMs(restMsRef.current); |
| 7660 |
if (currentOpen && !isOverInactive || restMsValue === 0) { |
| 7661 |
return; |
| 7662 |
} |
| 7663 |
if (!isOverInactive && instance.restTimeoutPending && event.movementX ** 2 + event.movementY ** 2 < 2) { |
| 7664 |
return; |
| 7665 |
} |
| 7666 |
instance.restTimeout.clear(); |
| 7667 |
function handleMouseMove() { |
| 7668 |
instance.restTimeoutPending = false; |
| 7669 |
if (isClickLikeOpenEvent2()) { |
| 7670 |
return; |
| 7671 |
} |
| 7672 |
const latestOpen = store.select("open"); |
| 7673 |
if (!instance.blockMouseMove && (!latestOpen || isOverInactive) && checkShouldOpen()) { |
| 7674 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerHover, nativeEvent, trigger)); |
| 7675 |
} |
| 7676 |
} |
| 7677 |
if (instance.pointerType === "touch") { |
| 7678 |
ReactDOM4.flushSync(() => { |
| 7679 |
handleMouseMove(); |
| 7680 |
}); |
| 7681 |
} else if (isOverInactive && currentOpen) { |
| 7682 |
handleMouseMove(); |
| 7683 |
} else { |
| 7684 |
instance.restTimeoutPending = true; |
| 7685 |
instance.restTimeout.start(restMsValue, handleMouseMove); |
| 7686 |
} |
| 7687 |
} |
| 7688 |
}; |
| 7689 |
}, [enabled, instance, isClickLikeOpenEvent2, isOverInactiveTrigger, mouseOnly, store, restMsRef, checkShouldOpen]); |
| 7690 |
} |
| 7691 |
|
| 7692 |
// node_modules/@base-ui/react/esm/floating-ui-react/safePolygon.js |
| 7693 |
var CURSOR_SPEED_THRESHOLD = 0.1; |
| 7694 |
var CURSOR_SPEED_THRESHOLD_SQUARED = CURSOR_SPEED_THRESHOLD * CURSOR_SPEED_THRESHOLD; |
| 7695 |
var POLYGON_BUFFER = 0.5; |
| 7696 |
function hasIntersectingEdge(pointX, pointY, xi, yi, xj, yj) { |
| 7697 |
return yi >= pointY !== yj >= pointY && pointX <= (xj - xi) * (pointY - yi) / (yj - yi) + xi; |
| 7698 |
} |
| 7699 |
function isPointInQuadrilateral(pointX, pointY, x1, y1, x2, y2, x3, y3, x4, y4) { |
| 7700 |
let isInsideValue = false; |
| 7701 |
if (hasIntersectingEdge(pointX, pointY, x1, y1, x2, y2)) { |
| 7702 |
isInsideValue = !isInsideValue; |
| 7703 |
} |
| 7704 |
if (hasIntersectingEdge(pointX, pointY, x2, y2, x3, y3)) { |
| 7705 |
isInsideValue = !isInsideValue; |
| 7706 |
} |
| 7707 |
if (hasIntersectingEdge(pointX, pointY, x3, y3, x4, y4)) { |
| 7708 |
isInsideValue = !isInsideValue; |
| 7709 |
} |
| 7710 |
if (hasIntersectingEdge(pointX, pointY, x4, y4, x1, y1)) { |
| 7711 |
isInsideValue = !isInsideValue; |
| 7712 |
} |
| 7713 |
return isInsideValue; |
| 7714 |
} |
| 7715 |
function isInsideRect(pointX, pointY, rect) { |
| 7716 |
return pointX >= rect.x && pointX <= rect.x + rect.width && pointY >= rect.y && pointY <= rect.y + rect.height; |
| 7717 |
} |
| 7718 |
function isInsideAxisAlignedRect(pointX, pointY, x1, y1, x2, y2) { |
| 7719 |
const minX = Math.min(x1, x2); |
| 7720 |
const maxX = Math.max(x1, x2); |
| 7721 |
const minY = Math.min(y1, y2); |
| 7722 |
const maxY = Math.max(y1, y2); |
| 7723 |
return pointX >= minX && pointX <= maxX && pointY >= minY && pointY <= maxY; |
| 7724 |
} |
| 7725 |
function safePolygon(options = {}) { |
| 7726 |
const { |
| 7727 |
blockPointerEvents = false |
| 7728 |
} = options; |
| 7729 |
const timeout = new Timeout(); |
| 7730 |
const fn = ({ |
| 7731 |
x: x2, |
| 7732 |
y: y2, |
| 7733 |
placement, |
| 7734 |
elements, |
| 7735 |
onClose, |
| 7736 |
nodeId, |
| 7737 |
tree |
| 7738 |
}) => { |
| 7739 |
const side = placement?.split("-")[0]; |
| 7740 |
let hasLanded = false; |
| 7741 |
let lastX = null; |
| 7742 |
let lastY = null; |
| 7743 |
let lastCursorTime = typeof performance !== "undefined" ? performance.now() : 0; |
| 7744 |
function isCursorMovingSlowly(nextX, nextY) { |
| 7745 |
const currentTime = performance.now(); |
| 7746 |
const elapsedTime = currentTime - lastCursorTime; |
| 7747 |
if (lastX === null || lastY === null || elapsedTime === 0) { |
| 7748 |
lastX = nextX; |
| 7749 |
lastY = nextY; |
| 7750 |
lastCursorTime = currentTime; |
| 7751 |
return false; |
| 7752 |
} |
| 7753 |
const deltaX = nextX - lastX; |
| 7754 |
const deltaY = nextY - lastY; |
| 7755 |
const distanceSquared = deltaX * deltaX + deltaY * deltaY; |
| 7756 |
const thresholdSquared = elapsedTime * elapsedTime * CURSOR_SPEED_THRESHOLD_SQUARED; |
| 7757 |
lastX = nextX; |
| 7758 |
lastY = nextY; |
| 7759 |
lastCursorTime = currentTime; |
| 7760 |
return distanceSquared < thresholdSquared; |
| 7761 |
} |
| 7762 |
function close() { |
| 7763 |
timeout.clear(); |
| 7764 |
onClose(); |
| 7765 |
} |
| 7766 |
return function onMouseMove(event) { |
| 7767 |
timeout.clear(); |
| 7768 |
const domReference = elements.domReference; |
| 7769 |
const floating = elements.floating; |
| 7770 |
if (!domReference || !floating || side == null || x2 == null || y2 == null) { |
| 7771 |
return void 0; |
| 7772 |
} |
| 7773 |
const { |
| 7774 |
clientX, |
| 7775 |
clientY |
| 7776 |
} = event; |
| 7777 |
const target = getTarget(event); |
| 7778 |
const isLeave = event.type === "mouseleave"; |
| 7779 |
const isOverFloatingEl = contains(floating, target); |
| 7780 |
const isOverReferenceEl = contains(domReference, target); |
| 7781 |
if (isOverFloatingEl) { |
| 7782 |
hasLanded = true; |
| 7783 |
if (!isLeave) { |
| 7784 |
return void 0; |
| 7785 |
} |
| 7786 |
} |
| 7787 |
if (isOverReferenceEl) { |
| 7788 |
hasLanded = false; |
| 7789 |
if (!isLeave) { |
| 7790 |
hasLanded = true; |
| 7791 |
return void 0; |
| 7792 |
} |
| 7793 |
} |
| 7794 |
if (isLeave && isElement(event.relatedTarget) && contains(floating, event.relatedTarget)) { |
| 7795 |
return void 0; |
| 7796 |
} |
| 7797 |
function hasOpenChildNode() { |
| 7798 |
return Boolean(tree && getNodeChildren(tree.nodesRef.current, nodeId).length > 0); |
| 7799 |
} |
| 7800 |
function closeIfNoOpenChild() { |
| 7801 |
if (!hasOpenChildNode()) { |
| 7802 |
close(); |
| 7803 |
} |
| 7804 |
} |
| 7805 |
if (hasOpenChildNode()) { |
| 7806 |
return void 0; |
| 7807 |
} |
| 7808 |
const refRect = domReference.getBoundingClientRect(); |
| 7809 |
const rect = floating.getBoundingClientRect(); |
| 7810 |
const cursorLeaveFromRight = x2 > rect.right - rect.width / 2; |
| 7811 |
const cursorLeaveFromBottom = y2 > rect.bottom - rect.height / 2; |
| 7812 |
const isFloatingWider = rect.width > refRect.width; |
| 7813 |
const isFloatingTaller = rect.height > refRect.height; |
| 7814 |
const left = (isFloatingWider ? refRect : rect).left; |
| 7815 |
const right = (isFloatingWider ? refRect : rect).right; |
| 7816 |
const top = (isFloatingTaller ? refRect : rect).top; |
| 7817 |
const bottom = (isFloatingTaller ? refRect : rect).bottom; |
| 7818 |
if (side === "top" && y2 >= refRect.bottom - 1 || side === "bottom" && y2 <= refRect.top + 1 || side === "left" && x2 >= refRect.right - 1 || side === "right" && x2 <= refRect.left + 1) { |
| 7819 |
closeIfNoOpenChild(); |
| 7820 |
return void 0; |
| 7821 |
} |
| 7822 |
let isInsideTroughRect = false; |
| 7823 |
switch (side) { |
| 7824 |
case "top": |
| 7825 |
isInsideTroughRect = isInsideAxisAlignedRect(clientX, clientY, left, refRect.top + 1, right, rect.bottom - 1); |
| 7826 |
break; |
| 7827 |
case "bottom": |
| 7828 |
isInsideTroughRect = isInsideAxisAlignedRect(clientX, clientY, left, rect.top + 1, right, refRect.bottom - 1); |
| 7829 |
break; |
| 7830 |
case "left": |
| 7831 |
isInsideTroughRect = isInsideAxisAlignedRect(clientX, clientY, rect.right - 1, bottom, refRect.left + 1, top); |
| 7832 |
break; |
| 7833 |
case "right": |
| 7834 |
isInsideTroughRect = isInsideAxisAlignedRect(clientX, clientY, refRect.right - 1, bottom, rect.left + 1, top); |
| 7835 |
break; |
| 7836 |
default: |
| 7837 |
} |
| 7838 |
if (isInsideTroughRect) { |
| 7839 |
return void 0; |
| 7840 |
} |
| 7841 |
if (hasLanded && !isInsideRect(clientX, clientY, refRect)) { |
| 7842 |
closeIfNoOpenChild(); |
| 7843 |
return void 0; |
| 7844 |
} |
| 7845 |
if (!isLeave && isCursorMovingSlowly(clientX, clientY)) { |
| 7846 |
closeIfNoOpenChild(); |
| 7847 |
return void 0; |
| 7848 |
} |
| 7849 |
let isInsidePolygon = false; |
| 7850 |
switch (side) { |
| 7851 |
case "top": { |
| 7852 |
const cursorXOffset = isFloatingWider ? POLYGON_BUFFER / 2 : POLYGON_BUFFER * 4; |
| 7853 |
const cursorPointOneX = isFloatingWider ? x2 + cursorXOffset : cursorLeaveFromRight ? x2 + cursorXOffset : x2 - cursorXOffset; |
| 7854 |
const cursorPointTwoX = isFloatingWider ? x2 - cursorXOffset : cursorLeaveFromRight ? x2 + cursorXOffset : x2 - cursorXOffset; |
| 7855 |
const cursorPointY = y2 + POLYGON_BUFFER + 1; |
| 7856 |
const commonYLeft = cursorLeaveFromRight ? rect.bottom - POLYGON_BUFFER : isFloatingWider ? rect.bottom - POLYGON_BUFFER : rect.top; |
| 7857 |
const commonYRight = cursorLeaveFromRight ? isFloatingWider ? rect.bottom - POLYGON_BUFFER : rect.top : rect.bottom - POLYGON_BUFFER; |
| 7858 |
isInsidePolygon = isPointInQuadrilateral(clientX, clientY, cursorPointOneX, cursorPointY, cursorPointTwoX, cursorPointY, rect.left, commonYLeft, rect.right, commonYRight); |
| 7859 |
break; |
| 7860 |
} |
| 7861 |
case "bottom": { |
| 7862 |
const cursorXOffset = isFloatingWider ? POLYGON_BUFFER / 2 : POLYGON_BUFFER * 4; |
| 7863 |
const cursorPointOneX = isFloatingWider ? x2 + cursorXOffset : cursorLeaveFromRight ? x2 + cursorXOffset : x2 - cursorXOffset; |
| 7864 |
const cursorPointTwoX = isFloatingWider ? x2 - cursorXOffset : cursorLeaveFromRight ? x2 + cursorXOffset : x2 - cursorXOffset; |
| 7865 |
const cursorPointY = y2 - POLYGON_BUFFER; |
| 7866 |
const commonYLeft = cursorLeaveFromRight ? rect.top + POLYGON_BUFFER : isFloatingWider ? rect.top + POLYGON_BUFFER : rect.bottom; |
| 7867 |
const commonYRight = cursorLeaveFromRight ? isFloatingWider ? rect.top + POLYGON_BUFFER : rect.bottom : rect.top + POLYGON_BUFFER; |
| 7868 |
isInsidePolygon = isPointInQuadrilateral(clientX, clientY, cursorPointOneX, cursorPointY, cursorPointTwoX, cursorPointY, rect.left, commonYLeft, rect.right, commonYRight); |
| 7869 |
break; |
| 7870 |
} |
| 7871 |
case "left": { |
| 7872 |
const cursorYOffset = isFloatingTaller ? POLYGON_BUFFER / 2 : POLYGON_BUFFER * 4; |
| 7873 |
const cursorPointOneY = isFloatingTaller ? y2 + cursorYOffset : cursorLeaveFromBottom ? y2 + cursorYOffset : y2 - cursorYOffset; |
| 7874 |
const cursorPointTwoY = isFloatingTaller ? y2 - cursorYOffset : cursorLeaveFromBottom ? y2 + cursorYOffset : y2 - cursorYOffset; |
| 7875 |
const cursorPointX = x2 + POLYGON_BUFFER + 1; |
| 7876 |
const commonXTop = cursorLeaveFromBottom ? rect.right - POLYGON_BUFFER : isFloatingTaller ? rect.right - POLYGON_BUFFER : rect.left; |
| 7877 |
const commonXBottom = cursorLeaveFromBottom ? isFloatingTaller ? rect.right - POLYGON_BUFFER : rect.left : rect.right - POLYGON_BUFFER; |
| 7878 |
isInsidePolygon = isPointInQuadrilateral(clientX, clientY, commonXTop, rect.top, commonXBottom, rect.bottom, cursorPointX, cursorPointOneY, cursorPointX, cursorPointTwoY); |
| 7879 |
break; |
| 7880 |
} |
| 7881 |
case "right": { |
| 7882 |
const cursorYOffset = isFloatingTaller ? POLYGON_BUFFER / 2 : POLYGON_BUFFER * 4; |
| 7883 |
const cursorPointOneY = isFloatingTaller ? y2 + cursorYOffset : cursorLeaveFromBottom ? y2 + cursorYOffset : y2 - cursorYOffset; |
| 7884 |
const cursorPointTwoY = isFloatingTaller ? y2 - cursorYOffset : cursorLeaveFromBottom ? y2 + cursorYOffset : y2 - cursorYOffset; |
| 7885 |
const cursorPointX = x2 - POLYGON_BUFFER; |
| 7886 |
const commonXTop = cursorLeaveFromBottom ? rect.left + POLYGON_BUFFER : isFloatingTaller ? rect.left + POLYGON_BUFFER : rect.right; |
| 7887 |
const commonXBottom = cursorLeaveFromBottom ? isFloatingTaller ? rect.left + POLYGON_BUFFER : rect.right : rect.left + POLYGON_BUFFER; |
| 7888 |
isInsidePolygon = isPointInQuadrilateral(clientX, clientY, cursorPointX, cursorPointOneY, cursorPointX, cursorPointTwoY, commonXTop, rect.top, commonXBottom, rect.bottom); |
| 7889 |
break; |
| 7890 |
} |
| 7891 |
default: |
| 7892 |
} |
| 7893 |
if (!isInsidePolygon) { |
| 7894 |
closeIfNoOpenChild(); |
| 7895 |
} else if (!hasLanded) { |
| 7896 |
timeout.start(40, closeIfNoOpenChild); |
| 7897 |
} |
| 7898 |
return void 0; |
| 7899 |
}; |
| 7900 |
}; |
| 7901 |
fn.__options = { |
| 7902 |
...options, |
| 7903 |
blockPointerEvents |
| 7904 |
}; |
| 7905 |
return fn; |
| 7906 |
} |
| 7907 |
|
| 7908 |
// node_modules/@base-ui/react/esm/utils/popupStateMapping.js |
| 7909 |
var CommonPopupDataAttributes = (function(CommonPopupDataAttributes2) { |
| 7910 |
CommonPopupDataAttributes2["open"] = "data-open"; |
| 7911 |
CommonPopupDataAttributes2["closed"] = "data-closed"; |
| 7912 |
CommonPopupDataAttributes2[CommonPopupDataAttributes2["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle"; |
| 7913 |
CommonPopupDataAttributes2[CommonPopupDataAttributes2["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle"; |
| 7914 |
CommonPopupDataAttributes2["anchorHidden"] = "data-anchor-hidden"; |
| 7915 |
CommonPopupDataAttributes2["side"] = "data-side"; |
| 7916 |
CommonPopupDataAttributes2["align"] = "data-align"; |
| 7917 |
return CommonPopupDataAttributes2; |
| 7918 |
})({}); |
| 7919 |
var CommonTriggerDataAttributes = /* @__PURE__ */ (function(CommonTriggerDataAttributes2) { |
| 7920 |
CommonTriggerDataAttributes2["popupOpen"] = "data-popup-open"; |
| 7921 |
CommonTriggerDataAttributes2["pressed"] = "data-pressed"; |
| 7922 |
return CommonTriggerDataAttributes2; |
| 7923 |
})({}); |
| 7924 |
var TRIGGER_HOOK = { |
| 7925 |
[CommonTriggerDataAttributes.popupOpen]: "" |
| 7926 |
}; |
| 7927 |
var PRESSABLE_TRIGGER_HOOK = { |
| 7928 |
[CommonTriggerDataAttributes.popupOpen]: "", |
| 7929 |
[CommonTriggerDataAttributes.pressed]: "" |
| 7930 |
}; |
| 7931 |
var POPUP_OPEN_HOOK = { |
| 7932 |
[CommonPopupDataAttributes.open]: "" |
| 7933 |
}; |
| 7934 |
var POPUP_CLOSED_HOOK = { |
| 7935 |
[CommonPopupDataAttributes.closed]: "" |
| 7936 |
}; |
| 7937 |
var ANCHOR_HIDDEN_HOOK = { |
| 7938 |
[CommonPopupDataAttributes.anchorHidden]: "" |
| 7939 |
}; |
| 7940 |
var triggerOpenStateMapping = { |
| 7941 |
open(value) { |
| 7942 |
if (value) { |
| 7943 |
return TRIGGER_HOOK; |
| 7944 |
} |
| 7945 |
return null; |
| 7946 |
} |
| 7947 |
}; |
| 7948 |
var popupStateMapping = { |
| 7949 |
open(value) { |
| 7950 |
if (value) { |
| 7951 |
return POPUP_OPEN_HOOK; |
| 7952 |
} |
| 7953 |
return POPUP_CLOSED_HOOK; |
| 7954 |
}, |
| 7955 |
anchorHidden(value) { |
| 7956 |
if (value) { |
| 7957 |
return ANCHOR_HIDDEN_HOOK; |
| 7958 |
} |
| 7959 |
return null; |
| 7960 |
} |
| 7961 |
}; |
| 7962 |
|
| 7963 |
// node_modules/@base-ui/utils/esm/inertValue.js |
| 7964 |
function inertValue(value) { |
| 7965 |
if (isReactVersionAtLeast(19)) { |
| 7966 |
return value; |
| 7967 |
} |
| 7968 |
return value ? "true" : void 0; |
| 7969 |
} |
| 7970 |
|
| 7971 |
// node_modules/@base-ui/react/esm/utils/useAnchorPositioning.js |
| 7972 |
var React29 = __toESM(require_react(), 1); |
| 7973 |
|
| 7974 |
// node_modules/@base-ui/react/esm/floating-ui-react/middleware/arrow.js |
| 7975 |
var baseArrow = (options) => ({ |
| 7976 |
name: "arrow", |
| 7977 |
options, |
| 7978 |
async fn(state) { |
| 7979 |
const { |
| 7980 |
x: x2, |
| 7981 |
y: y2, |
| 7982 |
placement, |
| 7983 |
rects, |
| 7984 |
platform: platform3, |
| 7985 |
elements, |
| 7986 |
middlewareData |
| 7987 |
} = state; |
| 7988 |
const { |
| 7989 |
element, |
| 7990 |
padding = 0, |
| 7991 |
offsetParent = "real" |
| 7992 |
} = evaluate(options, state) || {}; |
| 7993 |
if (element == null) { |
| 7994 |
return {}; |
| 7995 |
} |
| 7996 |
const paddingObject = getPaddingObject(padding); |
| 7997 |
const coords = { |
| 7998 |
x: x2, |
| 7999 |
y: y2 |
| 8000 |
}; |
| 8001 |
const axis = getAlignmentAxis(placement); |
| 8002 |
const length = getAxisLength(axis); |
| 8003 |
const arrowDimensions = await platform3.getDimensions(element); |
| 8004 |
const isYAxis = axis === "y"; |
| 8005 |
const minProp = isYAxis ? "top" : "left"; |
| 8006 |
const maxProp = isYAxis ? "bottom" : "right"; |
| 8007 |
const clientProp = isYAxis ? "clientHeight" : "clientWidth"; |
| 8008 |
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length]; |
| 8009 |
const startDiff = coords[axis] - rects.reference[axis]; |
| 8010 |
const arrowOffsetParent = offsetParent === "real" ? await platform3.getOffsetParent?.(element) : elements.floating; |
| 8011 |
let clientSize = elements.floating[clientProp] || rects.floating[length]; |
| 8012 |
if (!clientSize || !await platform3.isElement?.(arrowOffsetParent)) { |
| 8013 |
clientSize = elements.floating[clientProp] || rects.floating[length]; |
| 8014 |
} |
| 8015 |
const centerToReference = endDiff / 2 - startDiff / 2; |
| 8016 |
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1; |
| 8017 |
const minPadding = Math.min(paddingObject[minProp], largestPossiblePadding); |
| 8018 |
const maxPadding = Math.min(paddingObject[maxProp], largestPossiblePadding); |
| 8019 |
const min2 = minPadding; |
| 8020 |
const max2 = clientSize - arrowDimensions[length] - maxPadding; |
| 8021 |
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference; |
| 8022 |
const offset4 = clamp(min2, center, max2); |
| 8023 |
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset4 && rects.reference[length] / 2 - (center < min2 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0; |
| 8024 |
const alignmentOffset = shouldAddOffset ? center < min2 ? center - min2 : center - max2 : 0; |
| 8025 |
return { |
| 8026 |
[axis]: coords[axis] + alignmentOffset, |
| 8027 |
data: { |
| 8028 |
[axis]: offset4, |
| 8029 |
centerOffset: center - offset4 - alignmentOffset, |
| 8030 |
...shouldAddOffset && { |
| 8031 |
alignmentOffset |
| 8032 |
} |
| 8033 |
}, |
| 8034 |
reset: shouldAddOffset |
| 8035 |
}; |
| 8036 |
} |
| 8037 |
}); |
| 8038 |
var arrow4 = (options, deps) => ({ |
| 8039 |
...baseArrow(options), |
| 8040 |
options: [options, deps] |
| 8041 |
}); |
| 8042 |
|
| 8043 |
// node_modules/@base-ui/react/esm/utils/hideMiddleware.js |
| 8044 |
var hide4 = { |
| 8045 |
name: "hide", |
| 8046 |
async fn(state) { |
| 8047 |
const { |
| 8048 |
width, |
| 8049 |
height, |
| 8050 |
x: x2, |
| 8051 |
y: y2 |
| 8052 |
} = state.rects.reference; |
| 8053 |
const anchorHidden = width === 0 && height === 0 && x2 === 0 && y2 === 0; |
| 8054 |
const nativeHideResult = await hide3().fn(state); |
| 8055 |
return { |
| 8056 |
data: { |
| 8057 |
referenceHidden: nativeHideResult.data?.referenceHidden || anchorHidden |
| 8058 |
} |
| 8059 |
}; |
| 8060 |
} |
| 8061 |
}; |
| 8062 |
|
| 8063 |
// node_modules/@base-ui/react/esm/utils/adaptiveOriginMiddleware.js |
| 8064 |
var DEFAULT_SIDES = { |
| 8065 |
sideX: "left", |
| 8066 |
sideY: "top" |
| 8067 |
}; |
| 8068 |
var adaptiveOrigin = { |
| 8069 |
name: "adaptiveOrigin", |
| 8070 |
async fn(state) { |
| 8071 |
const { |
| 8072 |
x: rawX, |
| 8073 |
y: rawY, |
| 8074 |
rects: { |
| 8075 |
floating: floatRect |
| 8076 |
}, |
| 8077 |
elements: { |
| 8078 |
floating |
| 8079 |
}, |
| 8080 |
platform: platform3, |
| 8081 |
strategy, |
| 8082 |
placement |
| 8083 |
} = state; |
| 8084 |
const win = getWindow(floating); |
| 8085 |
const styles = win.getComputedStyle(floating); |
| 8086 |
const hasTransition = styles.transitionDuration !== "0s" && styles.transitionDuration !== ""; |
| 8087 |
if (!hasTransition) { |
| 8088 |
return { |
| 8089 |
x: rawX, |
| 8090 |
y: rawY, |
| 8091 |
data: DEFAULT_SIDES |
| 8092 |
}; |
| 8093 |
} |
| 8094 |
const offsetParent = await platform3.getOffsetParent?.(floating); |
| 8095 |
let offsetDimensions = { |
| 8096 |
width: 0, |
| 8097 |
height: 0 |
| 8098 |
}; |
| 8099 |
if (strategy === "fixed" && win?.visualViewport) { |
| 8100 |
offsetDimensions = { |
| 8101 |
width: win.visualViewport.width, |
| 8102 |
height: win.visualViewport.height |
| 8103 |
}; |
| 8104 |
} else if (offsetParent === win) { |
| 8105 |
const doc = ownerDocument(floating); |
| 8106 |
offsetDimensions = { |
| 8107 |
width: doc.documentElement.clientWidth, |
| 8108 |
height: doc.documentElement.clientHeight |
| 8109 |
}; |
| 8110 |
} else if (await platform3.isElement?.(offsetParent)) { |
| 8111 |
offsetDimensions = await platform3.getDimensions(offsetParent); |
| 8112 |
} |
| 8113 |
const currentSide = getSide(placement); |
| 8114 |
let x2 = rawX; |
| 8115 |
let y2 = rawY; |
| 8116 |
if (currentSide === "left") { |
| 8117 |
x2 = offsetDimensions.width - (rawX + floatRect.width); |
| 8118 |
} |
| 8119 |
if (currentSide === "top") { |
| 8120 |
y2 = offsetDimensions.height - (rawY + floatRect.height); |
| 8121 |
} |
| 8122 |
const sideX = currentSide === "left" ? "right" : DEFAULT_SIDES.sideX; |
| 8123 |
const sideY = currentSide === "top" ? "bottom" : DEFAULT_SIDES.sideY; |
| 8124 |
return { |
| 8125 |
x: x2, |
| 8126 |
y: y2, |
| 8127 |
data: { |
| 8128 |
sideX, |
| 8129 |
sideY |
| 8130 |
} |
| 8131 |
}; |
| 8132 |
} |
| 8133 |
}; |
| 8134 |
|
| 8135 |
// node_modules/@base-ui/react/esm/utils/useAnchorPositioning.js |
| 8136 |
function getLogicalSide(sideParam, renderedSide, isRtl) { |
| 8137 |
const isLogicalSideParam = sideParam === "inline-start" || sideParam === "inline-end"; |
| 8138 |
const logicalRight = isRtl ? "inline-start" : "inline-end"; |
| 8139 |
const logicalLeft = isRtl ? "inline-end" : "inline-start"; |
| 8140 |
return { |
| 8141 |
top: "top", |
| 8142 |
right: isLogicalSideParam ? logicalRight : "right", |
| 8143 |
bottom: "bottom", |
| 8144 |
left: isLogicalSideParam ? logicalLeft : "left" |
| 8145 |
}[renderedSide]; |
| 8146 |
} |
| 8147 |
function getOffsetData(state, sideParam, isRtl) { |
| 8148 |
const { |
| 8149 |
rects, |
| 8150 |
placement |
| 8151 |
} = state; |
| 8152 |
const data = { |
| 8153 |
side: getLogicalSide(sideParam, getSide(placement), isRtl), |
| 8154 |
align: getAlignment(placement) || "center", |
| 8155 |
anchor: { |
| 8156 |
width: rects.reference.width, |
| 8157 |
height: rects.reference.height |
| 8158 |
}, |
| 8159 |
positioner: { |
| 8160 |
width: rects.floating.width, |
| 8161 |
height: rects.floating.height |
| 8162 |
} |
| 8163 |
}; |
| 8164 |
return data; |
| 8165 |
} |
| 8166 |
function useAnchorPositioning(params) { |
| 8167 |
const { |
| 8168 |
// Public parameters |
| 8169 |
anchor, |
| 8170 |
positionMethod = "absolute", |
| 8171 |
side: sideParam = "bottom", |
| 8172 |
sideOffset = 0, |
| 8173 |
align = "center", |
| 8174 |
alignOffset = 0, |
| 8175 |
collisionBoundary, |
| 8176 |
collisionPadding: collisionPaddingParam = 5, |
| 8177 |
sticky = false, |
| 8178 |
arrowPadding = 5, |
| 8179 |
disableAnchorTracking = false, |
| 8180 |
inline: inlineMiddleware, |
| 8181 |
// Private parameters |
| 8182 |
keepMounted = false, |
| 8183 |
floatingRootContext, |
| 8184 |
mounted, |
| 8185 |
collisionAvoidance, |
| 8186 |
shiftCrossAxis = false, |
| 8187 |
nodeId, |
| 8188 |
adaptiveOrigin: adaptiveOrigin2, |
| 8189 |
lazyFlip = false, |
| 8190 |
externalTree |
| 8191 |
} = params; |
| 8192 |
const [mountSide, setMountSide] = React29.useState(null); |
| 8193 |
if (!mounted && mountSide !== null) { |
| 8194 |
setMountSide(null); |
| 8195 |
} |
| 8196 |
const collisionAvoidanceSide = collisionAvoidance.side || "flip"; |
| 8197 |
const collisionAvoidanceAlign = collisionAvoidance.align || "flip"; |
| 8198 |
const collisionAvoidanceFallbackAxisSide = collisionAvoidance.fallbackAxisSide || "end"; |
| 8199 |
const anchorFn = typeof anchor === "function" ? anchor : void 0; |
| 8200 |
const anchorFnCallback = useStableCallback(anchorFn); |
| 8201 |
const anchorDep = anchorFn ? anchorFnCallback : anchor; |
| 8202 |
const anchorValueRef = useValueAsRef(anchor); |
| 8203 |
const mountedRef = useValueAsRef(mounted); |
| 8204 |
const direction = useDirection(); |
| 8205 |
const isRtl = direction === "rtl"; |
| 8206 |
const side = mountSide || { |
| 8207 |
top: "top", |
| 8208 |
right: "right", |
| 8209 |
bottom: "bottom", |
| 8210 |
left: "left", |
| 8211 |
"inline-end": isRtl ? "left" : "right", |
| 8212 |
"inline-start": isRtl ? "right" : "left" |
| 8213 |
}[sideParam]; |
| 8214 |
const placement = align === "center" ? side : `${side}-${align}`; |
| 8215 |
let collisionPadding = collisionPaddingParam; |
| 8216 |
const bias = 1; |
| 8217 |
const biasTop = sideParam === "bottom" ? bias : 0; |
| 8218 |
const biasBottom = sideParam === "top" ? bias : 0; |
| 8219 |
const biasLeft = sideParam === "right" ? bias : 0; |
| 8220 |
const biasRight = sideParam === "left" ? bias : 0; |
| 8221 |
if (typeof collisionPadding === "number") { |
| 8222 |
collisionPadding = { |
| 8223 |
top: collisionPadding + biasTop, |
| 8224 |
right: collisionPadding + biasRight, |
| 8225 |
bottom: collisionPadding + biasBottom, |
| 8226 |
left: collisionPadding + biasLeft |
| 8227 |
}; |
| 8228 |
} else if (collisionPadding) { |
| 8229 |
collisionPadding = { |
| 8230 |
top: (collisionPadding.top || 0) + biasTop, |
| 8231 |
right: (collisionPadding.right || 0) + biasRight, |
| 8232 |
bottom: (collisionPadding.bottom || 0) + biasBottom, |
| 8233 |
left: (collisionPadding.left || 0) + biasLeft |
| 8234 |
}; |
| 8235 |
} |
| 8236 |
const commonCollisionProps = { |
| 8237 |
boundary: collisionBoundary === "clipping-ancestors" ? "clippingAncestors" : collisionBoundary, |
| 8238 |
padding: collisionPadding |
| 8239 |
}; |
| 8240 |
const arrowRef = React29.useRef(null); |
| 8241 |
const sideOffsetRef = useValueAsRef(sideOffset); |
| 8242 |
const alignOffsetRef = useValueAsRef(alignOffset); |
| 8243 |
const sideOffsetDep = typeof sideOffset !== "function" ? sideOffset : 0; |
| 8244 |
const alignOffsetDep = typeof alignOffset !== "function" ? alignOffset : 0; |
| 8245 |
const middleware = []; |
| 8246 |
if (inlineMiddleware) { |
| 8247 |
middleware.push(inlineMiddleware); |
| 8248 |
} |
| 8249 |
middleware.push(offset3((state) => { |
| 8250 |
const data = getOffsetData(state, sideParam, isRtl); |
| 8251 |
const sideAxis = typeof sideOffsetRef.current === "function" ? sideOffsetRef.current(data) : sideOffsetRef.current; |
| 8252 |
const alignAxis = typeof alignOffsetRef.current === "function" ? alignOffsetRef.current(data) : alignOffsetRef.current; |
| 8253 |
return { |
| 8254 |
mainAxis: sideAxis, |
| 8255 |
crossAxis: alignAxis, |
| 8256 |
alignmentAxis: alignAxis |
| 8257 |
}; |
| 8258 |
}, [sideOffsetDep, alignOffsetDep, isRtl, sideParam])); |
| 8259 |
const shiftDisabled = collisionAvoidanceAlign === "none" && collisionAvoidanceSide !== "shift"; |
| 8260 |
const crossAxisShiftEnabled = !shiftDisabled && (sticky || shiftCrossAxis || collisionAvoidanceSide === "shift"); |
| 8261 |
const flipMiddleware = collisionAvoidanceSide === "none" ? null : flip3({ |
| 8262 |
...commonCollisionProps, |
| 8263 |
// Ensure the popup flips if it's been limited by its --available-height and it resizes. |
| 8264 |
// Since the size() padding is smaller than the flip() padding, flip() will take precedence. |
| 8265 |
padding: { |
| 8266 |
top: collisionPadding.top + bias, |
| 8267 |
right: collisionPadding.right + bias, |
| 8268 |
bottom: collisionPadding.bottom + bias, |
| 8269 |
left: collisionPadding.left + bias |
| 8270 |
}, |
| 8271 |
mainAxis: !shiftCrossAxis && collisionAvoidanceSide === "flip", |
| 8272 |
crossAxis: collisionAvoidanceAlign === "flip" ? "alignment" : false, |
| 8273 |
fallbackAxisSideDirection: collisionAvoidanceFallbackAxisSide |
| 8274 |
}); |
| 8275 |
const shiftMiddleware = shiftDisabled ? null : shift3((data) => { |
| 8276 |
const html = ownerDocument(data.elements.floating).documentElement; |
| 8277 |
return { |
| 8278 |
...commonCollisionProps, |
| 8279 |
// Use the Layout Viewport to avoid shifting around when pinch-zooming |
| 8280 |
// for context menus. |
| 8281 |
rootBoundary: shiftCrossAxis ? { |
| 8282 |
x: 0, |
| 8283 |
y: 0, |
| 8284 |
width: html.clientWidth, |
| 8285 |
height: html.clientHeight |
| 8286 |
} : void 0, |
| 8287 |
mainAxis: collisionAvoidanceAlign !== "none", |
| 8288 |
crossAxis: crossAxisShiftEnabled, |
| 8289 |
limiter: sticky || shiftCrossAxis ? void 0 : limitShift3((limitData) => { |
| 8290 |
if (!arrowRef.current) { |
| 8291 |
return {}; |
| 8292 |
} |
| 8293 |
const { |
| 8294 |
width, |
| 8295 |
height |
| 8296 |
} = arrowRef.current.getBoundingClientRect(); |
| 8297 |
const sideAxis = getSideAxis(getSide(limitData.placement)); |
| 8298 |
const arrowSize = sideAxis === "y" ? width : height; |
| 8299 |
const offsetAmount = sideAxis === "y" ? collisionPadding.left + collisionPadding.right : collisionPadding.top + collisionPadding.bottom; |
| 8300 |
return { |
| 8301 |
offset: arrowSize / 2 + offsetAmount / 2 |
| 8302 |
}; |
| 8303 |
}) |
| 8304 |
}; |
| 8305 |
}, [commonCollisionProps, sticky, shiftCrossAxis, collisionPadding, collisionAvoidanceAlign]); |
| 8306 |
if (collisionAvoidanceSide === "shift" || collisionAvoidanceAlign === "shift" || align === "center") { |
| 8307 |
middleware.push(shiftMiddleware, flipMiddleware); |
| 8308 |
} else { |
| 8309 |
middleware.push(flipMiddleware, shiftMiddleware); |
| 8310 |
} |
| 8311 |
middleware.push(size3({ |
| 8312 |
...commonCollisionProps, |
| 8313 |
apply({ |
| 8314 |
elements: { |
| 8315 |
floating |
| 8316 |
}, |
| 8317 |
availableWidth, |
| 8318 |
availableHeight, |
| 8319 |
rects |
| 8320 |
}) { |
| 8321 |
if (!mountedRef.current) { |
| 8322 |
return; |
| 8323 |
} |
| 8324 |
const floatingStyle = floating.style; |
| 8325 |
floatingStyle.setProperty("--available-width", `${availableWidth}px`); |
| 8326 |
floatingStyle.setProperty("--available-height", `${availableHeight}px`); |
| 8327 |
const dpr = getWindow(floating).devicePixelRatio || 1; |
| 8328 |
const { |
| 8329 |
x: x3, |
| 8330 |
y: y3, |
| 8331 |
width, |
| 8332 |
height |
| 8333 |
} = rects.reference; |
| 8334 |
const anchorWidth = (Math.round((x3 + width) * dpr) - Math.round(x3 * dpr)) / dpr; |
| 8335 |
const anchorHeight = (Math.round((y3 + height) * dpr) - Math.round(y3 * dpr)) / dpr; |
| 8336 |
floatingStyle.setProperty("--anchor-width", `${anchorWidth}px`); |
| 8337 |
floatingStyle.setProperty("--anchor-height", `${anchorHeight}px`); |
| 8338 |
} |
| 8339 |
}), arrow4((state) => ({ |
| 8340 |
// `transform-origin` calculations rely on an element existing. If the arrow hasn't been set, |
| 8341 |
// we'll create a fake element. |
| 8342 |
element: arrowRef.current || ownerDocument(state.elements.floating).createElement("div"), |
| 8343 |
padding: arrowPadding, |
| 8344 |
offsetParent: "floating" |
| 8345 |
}), [arrowPadding]), { |
| 8346 |
name: "transformOrigin", |
| 8347 |
fn(state) { |
| 8348 |
const { |
| 8349 |
elements: elements2, |
| 8350 |
middlewareData: middlewareData2, |
| 8351 |
placement: renderedPlacement2, |
| 8352 |
rects, |
| 8353 |
y: y3 |
| 8354 |
} = state; |
| 8355 |
const currentRenderedSide = getSide(renderedPlacement2); |
| 8356 |
const currentRenderedAxis = getSideAxis(currentRenderedSide); |
| 8357 |
const arrowEl = arrowRef.current; |
| 8358 |
const arrowX = middlewareData2.arrow?.x || 0; |
| 8359 |
const arrowY = middlewareData2.arrow?.y || 0; |
| 8360 |
const arrowWidth = arrowEl?.clientWidth || 0; |
| 8361 |
const arrowHeight = arrowEl?.clientHeight || 0; |
| 8362 |
const transformX = arrowX + arrowWidth / 2; |
| 8363 |
const transformY = arrowY + arrowHeight / 2; |
| 8364 |
const shiftY = Math.abs(middlewareData2.shift?.y || 0); |
| 8365 |
const halfAnchorHeight = rects.reference.height / 2; |
| 8366 |
const sideOffsetValue = typeof sideOffset === "function" ? sideOffset(getOffsetData(state, sideParam, isRtl)) : sideOffset; |
| 8367 |
const isOverlappingAnchor = shiftY > sideOffsetValue; |
| 8368 |
const adjacentTransformOrigin = { |
| 8369 |
top: `${transformX}px calc(100% + ${sideOffsetValue}px)`, |
| 8370 |
bottom: `${transformX}px ${-sideOffsetValue}px`, |
| 8371 |
left: `calc(100% + ${sideOffsetValue}px) ${transformY}px`, |
| 8372 |
right: `${-sideOffsetValue}px ${transformY}px` |
| 8373 |
}[currentRenderedSide]; |
| 8374 |
const overlapTransformOrigin = `${transformX}px ${rects.reference.y + halfAnchorHeight - y3}px`; |
| 8375 |
elements2.floating.style.setProperty("--transform-origin", crossAxisShiftEnabled && currentRenderedAxis === "y" && isOverlappingAnchor ? overlapTransformOrigin : adjacentTransformOrigin); |
| 8376 |
return {}; |
| 8377 |
} |
| 8378 |
}, hide4, adaptiveOrigin2); |
| 8379 |
useIsoLayoutEffect(() => { |
| 8380 |
if (!mounted && floatingRootContext) { |
| 8381 |
floatingRootContext.update({ |
| 8382 |
referenceElement: null, |
| 8383 |
floatingElement: null, |
| 8384 |
domReferenceElement: null, |
| 8385 |
positionReference: null |
| 8386 |
}); |
| 8387 |
} |
| 8388 |
}, [mounted, floatingRootContext]); |
| 8389 |
const autoUpdateOptions = React29.useMemo(() => ({ |
| 8390 |
elementResize: !disableAnchorTracking && typeof ResizeObserver !== "undefined", |
| 8391 |
layoutShift: !disableAnchorTracking && typeof IntersectionObserver !== "undefined" |
| 8392 |
}), [disableAnchorTracking]); |
| 8393 |
const { |
| 8394 |
refs, |
| 8395 |
elements, |
| 8396 |
x: x2, |
| 8397 |
y: y2, |
| 8398 |
middlewareData, |
| 8399 |
update: update2, |
| 8400 |
placement: renderedPlacement, |
| 8401 |
context, |
| 8402 |
isPositioned, |
| 8403 |
floatingStyles: originalFloatingStyles |
| 8404 |
} = useFloating2({ |
| 8405 |
rootContext: floatingRootContext, |
| 8406 |
open: keepMounted ? mounted : void 0, |
| 8407 |
placement, |
| 8408 |
middleware, |
| 8409 |
strategy: positionMethod, |
| 8410 |
whileElementsMounted: keepMounted ? void 0 : (...args) => autoUpdate(...args, autoUpdateOptions), |
| 8411 |
nodeId, |
| 8412 |
externalTree |
| 8413 |
}); |
| 8414 |
const { |
| 8415 |
sideX, |
| 8416 |
sideY |
| 8417 |
} = middlewareData.adaptiveOrigin || DEFAULT_SIDES; |
| 8418 |
const resolvedPosition = isPositioned ? positionMethod : "fixed"; |
| 8419 |
const floatingStyles = React29.useMemo(() => { |
| 8420 |
const base = adaptiveOrigin2 ? { |
| 8421 |
position: resolvedPosition, |
| 8422 |
[sideX]: x2, |
| 8423 |
[sideY]: y2 |
| 8424 |
} : { |
| 8425 |
position: resolvedPosition, |
| 8426 |
...originalFloatingStyles |
| 8427 |
}; |
| 8428 |
if (!isPositioned) { |
| 8429 |
base.opacity = 0; |
| 8430 |
} |
| 8431 |
return base; |
| 8432 |
}, [adaptiveOrigin2, resolvedPosition, sideX, x2, sideY, y2, originalFloatingStyles, isPositioned]); |
| 8433 |
const registeredPositionReferenceRef = React29.useRef(null); |
| 8434 |
useIsoLayoutEffect(() => { |
| 8435 |
if (!mounted) { |
| 8436 |
return; |
| 8437 |
} |
| 8438 |
const anchorValue = anchorValueRef.current; |
| 8439 |
const resolvedAnchor = typeof anchorValue === "function" ? anchorValue() : anchorValue; |
| 8440 |
const unwrappedElement = (isRef(resolvedAnchor) ? resolvedAnchor.current : resolvedAnchor) || null; |
| 8441 |
const finalAnchor = unwrappedElement || null; |
| 8442 |
if (finalAnchor !== registeredPositionReferenceRef.current) { |
| 8443 |
refs.setPositionReference(finalAnchor); |
| 8444 |
registeredPositionReferenceRef.current = finalAnchor; |
| 8445 |
} |
| 8446 |
}, [mounted, refs, anchorDep, anchorValueRef]); |
| 8447 |
React29.useEffect(() => { |
| 8448 |
if (!mounted) { |
| 8449 |
return; |
| 8450 |
} |
| 8451 |
const anchorValue = anchorValueRef.current; |
| 8452 |
if (typeof anchorValue === "function") { |
| 8453 |
return; |
| 8454 |
} |
| 8455 |
if (isRef(anchorValue) && anchorValue.current !== registeredPositionReferenceRef.current) { |
| 8456 |
refs.setPositionReference(anchorValue.current); |
| 8457 |
registeredPositionReferenceRef.current = anchorValue.current; |
| 8458 |
} |
| 8459 |
}, [mounted, refs, anchorDep, anchorValueRef]); |
| 8460 |
React29.useEffect(() => { |
| 8461 |
if (keepMounted && mounted && elements.domReference && elements.floating) { |
| 8462 |
return autoUpdate(elements.domReference, elements.floating, update2, autoUpdateOptions); |
| 8463 |
} |
| 8464 |
return void 0; |
| 8465 |
}, [keepMounted, mounted, elements, update2, autoUpdateOptions]); |
| 8466 |
const renderedSide = getSide(renderedPlacement); |
| 8467 |
const logicalRenderedSide = getLogicalSide(sideParam, renderedSide, isRtl); |
| 8468 |
const renderedAlign = getAlignment(renderedPlacement) || "center"; |
| 8469 |
const anchorHidden = Boolean(middlewareData.hide?.referenceHidden); |
| 8470 |
useIsoLayoutEffect(() => { |
| 8471 |
if (lazyFlip && mounted && isPositioned) { |
| 8472 |
setMountSide(renderedSide); |
| 8473 |
} |
| 8474 |
}, [lazyFlip, mounted, isPositioned, renderedSide]); |
| 8475 |
const arrowStyles = React29.useMemo(() => ({ |
| 8476 |
position: "absolute", |
| 8477 |
top: middlewareData.arrow?.y, |
| 8478 |
left: middlewareData.arrow?.x |
| 8479 |
}), [middlewareData.arrow]); |
| 8480 |
const arrowUncentered = middlewareData.arrow?.centerOffset !== 0; |
| 8481 |
return React29.useMemo(() => ({ |
| 8482 |
positionerStyles: floatingStyles, |
| 8483 |
arrowStyles, |
| 8484 |
arrowRef, |
| 8485 |
arrowUncentered, |
| 8486 |
side: logicalRenderedSide, |
| 8487 |
align: renderedAlign, |
| 8488 |
physicalSide: renderedSide, |
| 8489 |
anchorHidden, |
| 8490 |
refs, |
| 8491 |
context, |
| 8492 |
isPositioned, |
| 8493 |
update: update2 |
| 8494 |
}), [floatingStyles, arrowStyles, arrowRef, arrowUncentered, logicalRenderedSide, renderedAlign, renderedSide, anchorHidden, refs, context, isPositioned, update2]); |
| 8495 |
} |
| 8496 |
function isRef(param) { |
| 8497 |
return param != null && "current" in param; |
| 8498 |
} |
| 8499 |
|
| 8500 |
// node_modules/@base-ui/react/esm/utils/getDisabledMountTransitionStyles.js |
| 8501 |
function getDisabledMountTransitionStyles(transitionStatus) { |
| 8502 |
return transitionStatus === "starting" ? DISABLED_TRANSITIONS_STYLE : EMPTY_OBJECT; |
| 8503 |
} |
| 8504 |
|
| 8505 |
// node_modules/@base-ui/react/esm/utils/usePositioner.js |
| 8506 |
function usePositioner(componentProps, state, { |
| 8507 |
styles, |
| 8508 |
transitionStatus, |
| 8509 |
props, |
| 8510 |
refs, |
| 8511 |
hidden, |
| 8512 |
inert = false |
| 8513 |
}) { |
| 8514 |
const style = { |
| 8515 |
...styles |
| 8516 |
}; |
| 8517 |
if (inert) { |
| 8518 |
style.pointerEvents = "none"; |
| 8519 |
} |
| 8520 |
return useRenderElement("div", componentProps, { |
| 8521 |
state, |
| 8522 |
ref: refs, |
| 8523 |
props: [{ |
| 8524 |
role: "presentation", |
| 8525 |
hidden, |
| 8526 |
style |
| 8527 |
}, getDisabledMountTransitionStyles(transitionStatus), props], |
| 8528 |
stateAttributesMapping: popupStateMapping |
| 8529 |
}); |
| 8530 |
} |
| 8531 |
|
| 8532 |
// node_modules/@base-ui/react/esm/utils/usePopupViewport.js |
| 8533 |
var React32 = __toESM(require_react(), 1); |
| 8534 |
var ReactDOM5 = __toESM(require_react_dom(), 1); |
| 8535 |
|
| 8536 |
// node_modules/@base-ui/utils/esm/usePreviousValue.js |
| 8537 |
var React30 = __toESM(require_react(), 1); |
| 8538 |
function usePreviousValue(value) { |
| 8539 |
const [state, setState] = React30.useState({ |
| 8540 |
current: value, |
| 8541 |
previous: null |
| 8542 |
}); |
| 8543 |
if (value !== state.current) { |
| 8544 |
setState({ |
| 8545 |
current: value, |
| 8546 |
previous: state.current |
| 8547 |
}); |
| 8548 |
} |
| 8549 |
return state.previous; |
| 8550 |
} |
| 8551 |
|
| 8552 |
// node_modules/@base-ui/react/esm/utils/usePopupAutoResize.js |
| 8553 |
var React31 = __toESM(require_react(), 1); |
| 8554 |
|
| 8555 |
// node_modules/@base-ui/react/esm/utils/getCssDimensions.js |
| 8556 |
function getCssDimensions2(element) { |
| 8557 |
const css = getComputedStyle2(element); |
| 8558 |
let width = parseFloat(css.width) || 0; |
| 8559 |
let height = parseFloat(css.height) || 0; |
| 8560 |
const hasOffset = isHTMLElement(element); |
| 8561 |
const offsetWidth = hasOffset ? element.offsetWidth : width; |
| 8562 |
const offsetHeight = hasOffset ? element.offsetHeight : height; |
| 8563 |
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight; |
| 8564 |
if (shouldFallback) { |
| 8565 |
width = offsetWidth; |
| 8566 |
height = offsetHeight; |
| 8567 |
} |
| 8568 |
return { |
| 8569 |
width, |
| 8570 |
height |
| 8571 |
}; |
| 8572 |
} |
| 8573 |
|
| 8574 |
// node_modules/@base-ui/react/esm/utils/usePopupAutoResize.js |
| 8575 |
var DEFAULT_ENABLED = () => true; |
| 8576 |
function usePopupAutoResize(parameters) { |
| 8577 |
const { |
| 8578 |
popupElement, |
| 8579 |
positionerElement, |
| 8580 |
content, |
| 8581 |
mounted, |
| 8582 |
enabled = DEFAULT_ENABLED, |
| 8583 |
onMeasureLayout: onMeasureLayoutParam, |
| 8584 |
onMeasureLayoutComplete: onMeasureLayoutCompleteParam, |
| 8585 |
side, |
| 8586 |
direction |
| 8587 |
} = parameters; |
| 8588 |
const runOnceAnimationsFinish = useAnimationsFinished(popupElement, true, false); |
| 8589 |
const animationFrame = useAnimationFrame(); |
| 8590 |
const committedDimensionsRef = React31.useRef(null); |
| 8591 |
const liveDimensionsRef = React31.useRef(null); |
| 8592 |
const isInitialRenderRef = React31.useRef(true); |
| 8593 |
const restoreAnchoringStylesRef = React31.useRef(NOOP); |
| 8594 |
const onMeasureLayout = useStableCallback(onMeasureLayoutParam); |
| 8595 |
const onMeasureLayoutComplete = useStableCallback(onMeasureLayoutCompleteParam); |
| 8596 |
const anchoringStyles = React31.useMemo(() => { |
| 8597 |
let isOriginSide = side === "top"; |
| 8598 |
let isPhysicalLeft = side === "left"; |
| 8599 |
if (direction === "rtl") { |
| 8600 |
isOriginSide = isOriginSide || side === "inline-end"; |
| 8601 |
isPhysicalLeft = isPhysicalLeft || side === "inline-end"; |
| 8602 |
} else { |
| 8603 |
isOriginSide = isOriginSide || side === "inline-start"; |
| 8604 |
isPhysicalLeft = isPhysicalLeft || side === "inline-start"; |
| 8605 |
} |
| 8606 |
return isOriginSide ? { |
| 8607 |
position: "absolute", |
| 8608 |
[side === "top" ? "bottom" : "top"]: "0", |
| 8609 |
[isPhysicalLeft ? "right" : "left"]: "0" |
| 8610 |
} : EMPTY_OBJECT; |
| 8611 |
}, [side, direction]); |
| 8612 |
useIsoLayoutEffect(() => { |
| 8613 |
if (!mounted || !enabled() || typeof ResizeObserver !== "function") { |
| 8614 |
restoreAnchoringStylesRef.current = NOOP; |
| 8615 |
isInitialRenderRef.current = true; |
| 8616 |
committedDimensionsRef.current = null; |
| 8617 |
liveDimensionsRef.current = null; |
| 8618 |
return void 0; |
| 8619 |
} |
| 8620 |
if (!popupElement || !positionerElement) { |
| 8621 |
return void 0; |
| 8622 |
} |
| 8623 |
restoreAnchoringStylesRef.current = applyElementStyles(popupElement, anchoringStyles); |
| 8624 |
const observer = new ResizeObserver((entries) => { |
| 8625 |
const entry = entries[0]; |
| 8626 |
if (entry) { |
| 8627 |
liveDimensionsRef.current = { |
| 8628 |
width: Math.ceil(entry.borderBoxSize[0].inlineSize), |
| 8629 |
height: Math.ceil(entry.borderBoxSize[0].blockSize) |
| 8630 |
}; |
| 8631 |
} |
| 8632 |
}); |
| 8633 |
observer.observe(popupElement); |
| 8634 |
setPopupCssSize(popupElement, "auto"); |
| 8635 |
const restorePopupPosition = overrideElementStyle(popupElement, "position", "static"); |
| 8636 |
const restorePopupTransform = overrideElementStyle(popupElement, "transform", "none"); |
| 8637 |
const restorePopupScale = overrideElementStyle(popupElement, "scale", "1"); |
| 8638 |
const restorePositionerAvailableSize = applyElementStyles(positionerElement, { |
| 8639 |
"--available-width": "max-content", |
| 8640 |
"--available-height": "max-content" |
| 8641 |
}); |
| 8642 |
function restoreMeasurementOverrides() { |
| 8643 |
restorePopupPosition(); |
| 8644 |
restorePopupTransform(); |
| 8645 |
restorePositionerAvailableSize(); |
| 8646 |
} |
| 8647 |
function restoreMeasurementOverridesIncludingScale() { |
| 8648 |
restoreMeasurementOverrides(); |
| 8649 |
restorePopupScale(); |
| 8650 |
} |
| 8651 |
onMeasureLayout?.(); |
| 8652 |
if (isInitialRenderRef.current || committedDimensionsRef.current === null) { |
| 8653 |
setPositionerCssSize(positionerElement, "max-content"); |
| 8654 |
const dimensions = getCssDimensions2(popupElement); |
| 8655 |
committedDimensionsRef.current = dimensions; |
| 8656 |
setPositionerCssSize(positionerElement, dimensions); |
| 8657 |
restoreMeasurementOverridesIncludingScale(); |
| 8658 |
onMeasureLayoutComplete?.(null, dimensions); |
| 8659 |
isInitialRenderRef.current = false; |
| 8660 |
return () => { |
| 8661 |
observer.disconnect(); |
| 8662 |
restoreAnchoringStylesRef.current(); |
| 8663 |
restoreAnchoringStylesRef.current = NOOP; |
| 8664 |
}; |
| 8665 |
} |
| 8666 |
setPopupCssSize(popupElement, "auto"); |
| 8667 |
setPositionerCssSize(positionerElement, "max-content"); |
| 8668 |
const previousDimensions = committedDimensionsRef.current ?? liveDimensionsRef.current; |
| 8669 |
const newDimensions = getCssDimensions2(popupElement); |
| 8670 |
committedDimensionsRef.current = newDimensions; |
| 8671 |
if (!previousDimensions) { |
| 8672 |
setPositionerCssSize(positionerElement, newDimensions); |
| 8673 |
restoreMeasurementOverridesIncludingScale(); |
| 8674 |
onMeasureLayoutComplete?.(null, newDimensions); |
| 8675 |
return () => { |
| 8676 |
observer.disconnect(); |
| 8677 |
animationFrame.cancel(); |
| 8678 |
restoreAnchoringStylesRef.current(); |
| 8679 |
restoreAnchoringStylesRef.current = NOOP; |
| 8680 |
}; |
| 8681 |
} |
| 8682 |
setPopupCssSize(popupElement, previousDimensions); |
| 8683 |
restoreMeasurementOverridesIncludingScale(); |
| 8684 |
onMeasureLayoutComplete?.(previousDimensions, newDimensions); |
| 8685 |
setPositionerCssSize(positionerElement, newDimensions); |
| 8686 |
const abortController = new AbortController(); |
| 8687 |
animationFrame.request(() => { |
| 8688 |
setPopupCssSize(popupElement, newDimensions); |
| 8689 |
runOnceAnimationsFinish(() => { |
| 8690 |
popupElement.style.setProperty("--popup-width", "auto"); |
| 8691 |
popupElement.style.setProperty("--popup-height", "auto"); |
| 8692 |
}, abortController.signal); |
| 8693 |
}); |
| 8694 |
return () => { |
| 8695 |
observer.disconnect(); |
| 8696 |
abortController.abort(); |
| 8697 |
animationFrame.cancel(); |
| 8698 |
restoreAnchoringStylesRef.current(); |
| 8699 |
restoreAnchoringStylesRef.current = NOOP; |
| 8700 |
}; |
| 8701 |
}, [content, popupElement, positionerElement, runOnceAnimationsFinish, animationFrame, enabled, mounted, onMeasureLayout, onMeasureLayoutComplete, anchoringStyles]); |
| 8702 |
} |
| 8703 |
function overrideElementStyle(element, property, value) { |
| 8704 |
const originalValue = element.style.getPropertyValue(property); |
| 8705 |
element.style.setProperty(property, value); |
| 8706 |
return () => { |
| 8707 |
element.style.setProperty(property, originalValue); |
| 8708 |
}; |
| 8709 |
} |
| 8710 |
function applyElementStyles(element, styles) { |
| 8711 |
const restorers = []; |
| 8712 |
for (const [key, value] of Object.entries(styles)) { |
| 8713 |
restorers.push(overrideElementStyle(element, key, value)); |
| 8714 |
} |
| 8715 |
return restorers.length ? () => { |
| 8716 |
restorers.forEach((restore) => restore()); |
| 8717 |
} : NOOP; |
| 8718 |
} |
| 8719 |
function setPopupCssSize(popupElement, size4) { |
| 8720 |
const width = size4 === "auto" ? "auto" : `${size4.width}px`; |
| 8721 |
const height = size4 === "auto" ? "auto" : `${size4.height}px`; |
| 8722 |
popupElement.style.setProperty("--popup-width", width); |
| 8723 |
popupElement.style.setProperty("--popup-height", height); |
| 8724 |
} |
| 8725 |
function setPositionerCssSize(positionerElement, size4) { |
| 8726 |
const width = size4 === "max-content" ? "max-content" : `${size4.width}px`; |
| 8727 |
const height = size4 === "max-content" ? "max-content" : `${size4.height}px`; |
| 8728 |
positionerElement.style.setProperty("--positioner-width", width); |
| 8729 |
positionerElement.style.setProperty("--positioner-height", height); |
| 8730 |
} |
| 8731 |
|
| 8732 |
// node_modules/@base-ui/react/esm/utils/usePopupViewport.js |
| 8733 |
var import_jsx_runtime35 = __toESM(require_jsx_runtime(), 1); |
| 8734 |
function usePopupViewport(parameters) { |
| 8735 |
const { |
| 8736 |
store, |
| 8737 |
side, |
| 8738 |
cssVars, |
| 8739 |
children |
| 8740 |
} = parameters; |
| 8741 |
const direction = useDirection(); |
| 8742 |
const activeTrigger = store.useState("activeTriggerElement"); |
| 8743 |
const activeTriggerId = store.useState("activeTriggerId"); |
| 8744 |
const open = store.useState("open"); |
| 8745 |
const payload = store.useState("payload"); |
| 8746 |
const mounted = store.useState("mounted"); |
| 8747 |
const popupElement = store.useState("popupElement"); |
| 8748 |
const positionerElement = store.useState("positionerElement"); |
| 8749 |
const previousActiveTrigger = usePreviousValue(open ? activeTrigger : null); |
| 8750 |
const currentContentKey = usePopupContentKey(activeTriggerId, payload); |
| 8751 |
const capturedNodeRef = React32.useRef(null); |
| 8752 |
const [previousContentNode, setPreviousContentNode] = React32.useState(null); |
| 8753 |
const [newTriggerOffset, setNewTriggerOffset] = React32.useState(null); |
| 8754 |
const currentContainerRef = React32.useRef(null); |
| 8755 |
const previousContainerRef = React32.useRef(null); |
| 8756 |
const onAnimationsFinished = useAnimationsFinished(currentContainerRef, true, false); |
| 8757 |
const cleanupFrame = useAnimationFrame(); |
| 8758 |
const [previousContentDimensions, setPreviousContentDimensions] = React32.useState(null); |
| 8759 |
const [showStartingStyleAttribute, setShowStartingStyleAttribute] = React32.useState(false); |
| 8760 |
useIsoLayoutEffect(() => { |
| 8761 |
store.set("hasViewport", true); |
| 8762 |
return () => { |
| 8763 |
store.set("hasViewport", false); |
| 8764 |
}; |
| 8765 |
}, [store]); |
| 8766 |
const handleMeasureLayout = useStableCallback(() => { |
| 8767 |
currentContainerRef.current?.style.setProperty("animation", "none"); |
| 8768 |
currentContainerRef.current?.style.setProperty("transition", "none"); |
| 8769 |
previousContainerRef.current?.style.setProperty("display", "none"); |
| 8770 |
}); |
| 8771 |
const handleMeasureLayoutComplete = useStableCallback((previousDimensions) => { |
| 8772 |
currentContainerRef.current?.style.removeProperty("animation"); |
| 8773 |
currentContainerRef.current?.style.removeProperty("transition"); |
| 8774 |
previousContainerRef.current?.style.removeProperty("display"); |
| 8775 |
if (previousDimensions) { |
| 8776 |
setPreviousContentDimensions(previousDimensions); |
| 8777 |
} |
| 8778 |
}); |
| 8779 |
const lastHandledTriggerRef = React32.useRef(null); |
| 8780 |
useIsoLayoutEffect(() => { |
| 8781 |
if (activeTrigger && previousActiveTrigger && activeTrigger !== previousActiveTrigger && lastHandledTriggerRef.current !== activeTrigger && capturedNodeRef.current) { |
| 8782 |
setPreviousContentNode(capturedNodeRef.current); |
| 8783 |
setShowStartingStyleAttribute(true); |
| 8784 |
const offset4 = calculateRelativePosition(previousActiveTrigger, activeTrigger); |
| 8785 |
setNewTriggerOffset(offset4); |
| 8786 |
cleanupFrame.request(() => { |
| 8787 |
ReactDOM5.flushSync(() => { |
| 8788 |
setShowStartingStyleAttribute(false); |
| 8789 |
}); |
| 8790 |
onAnimationsFinished(() => { |
| 8791 |
setPreviousContentNode(null); |
| 8792 |
setPreviousContentDimensions(null); |
| 8793 |
capturedNodeRef.current = null; |
| 8794 |
}); |
| 8795 |
}); |
| 8796 |
lastHandledTriggerRef.current = activeTrigger; |
| 8797 |
} |
| 8798 |
}, [activeTrigger, previousActiveTrigger, previousContentNode, onAnimationsFinished, cleanupFrame]); |
| 8799 |
useIsoLayoutEffect(() => { |
| 8800 |
const source = currentContainerRef.current; |
| 8801 |
if (!source) { |
| 8802 |
return; |
| 8803 |
} |
| 8804 |
const wrapper = ownerDocument(source).createElement("div"); |
| 8805 |
for (const child of Array.from(source.childNodes)) { |
| 8806 |
wrapper.appendChild(child.cloneNode(true)); |
| 8807 |
} |
| 8808 |
capturedNodeRef.current = wrapper; |
| 8809 |
}); |
| 8810 |
const isTransitioning = previousContentNode != null; |
| 8811 |
let childrenToRender; |
| 8812 |
if (!isTransitioning) { |
| 8813 |
childrenToRender = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { |
| 8814 |
"data-current": true, |
| 8815 |
ref: currentContainerRef, |
| 8816 |
children |
| 8817 |
}, currentContentKey); |
| 8818 |
} else { |
| 8819 |
childrenToRender = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(React32.Fragment, { |
| 8820 |
children: [/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { |
| 8821 |
"data-previous": true, |
| 8822 |
inert: inertValue(true), |
| 8823 |
ref: previousContainerRef, |
| 8824 |
style: { |
| 8825 |
...previousContentDimensions ? { |
| 8826 |
[cssVars.popupWidth]: `${previousContentDimensions.width}px`, |
| 8827 |
[cssVars.popupHeight]: `${previousContentDimensions.height}px` |
| 8828 |
} : null, |
| 8829 |
position: "absolute" |
| 8830 |
}, |
| 8831 |
"data-ending-style": showStartingStyleAttribute ? void 0 : "" |
| 8832 |
}, "previous"), /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { |
| 8833 |
"data-current": true, |
| 8834 |
ref: currentContainerRef, |
| 8835 |
"data-starting-style": showStartingStyleAttribute ? "" : void 0, |
| 8836 |
children |
| 8837 |
}, currentContentKey)] |
| 8838 |
}); |
| 8839 |
} |
| 8840 |
useIsoLayoutEffect(() => { |
| 8841 |
const container = previousContainerRef.current; |
| 8842 |
if (!container || !previousContentNode) { |
| 8843 |
return; |
| 8844 |
} |
| 8845 |
container.replaceChildren(...Array.from(previousContentNode.childNodes)); |
| 8846 |
}, [previousContentNode]); |
| 8847 |
usePopupAutoResize({ |
| 8848 |
popupElement, |
| 8849 |
positionerElement, |
| 8850 |
mounted, |
| 8851 |
content: payload, |
| 8852 |
onMeasureLayout: handleMeasureLayout, |
| 8853 |
onMeasureLayoutComplete: handleMeasureLayoutComplete, |
| 8854 |
side, |
| 8855 |
direction |
| 8856 |
}); |
| 8857 |
const state = { |
| 8858 |
activationDirection: getActivationDirection(newTriggerOffset), |
| 8859 |
transitioning: isTransitioning |
| 8860 |
}; |
| 8861 |
return { |
| 8862 |
children: childrenToRender, |
| 8863 |
state |
| 8864 |
}; |
| 8865 |
} |
| 8866 |
function getActivationDirection(offset4) { |
| 8867 |
if (!offset4) { |
| 8868 |
return void 0; |
| 8869 |
} |
| 8870 |
return `${getValueWithTolerance(offset4.horizontal, 5, "right", "left")} ${getValueWithTolerance(offset4.vertical, 5, "down", "up")}`; |
| 8871 |
} |
| 8872 |
function getValueWithTolerance(value, tolerance, positiveLabel, negativeLabel) { |
| 8873 |
if (value > tolerance) { |
| 8874 |
return positiveLabel; |
| 8875 |
} |
| 8876 |
if (value < -tolerance) { |
| 8877 |
return negativeLabel; |
| 8878 |
} |
| 8879 |
return ""; |
| 8880 |
} |
| 8881 |
function calculateRelativePosition(from, to) { |
| 8882 |
const fromRect = from.getBoundingClientRect(); |
| 8883 |
const toRect = to.getBoundingClientRect(); |
| 8884 |
const fromCenter = { |
| 8885 |
x: fromRect.left + fromRect.width / 2, |
| 8886 |
y: fromRect.top + fromRect.height / 2 |
| 8887 |
}; |
| 8888 |
const toCenter = { |
| 8889 |
x: toRect.left + toRect.width / 2, |
| 8890 |
y: toRect.top + toRect.height / 2 |
| 8891 |
}; |
| 8892 |
return { |
| 8893 |
horizontal: toCenter.x - fromCenter.x, |
| 8894 |
vertical: toCenter.y - fromCenter.y |
| 8895 |
}; |
| 8896 |
} |
| 8897 |
function usePopupContentKey(activeTriggerId, payload) { |
| 8898 |
const [contentKey, setContentKey] = React32.useState(0); |
| 8899 |
const previousActiveTriggerIdRef = React32.useRef(activeTriggerId); |
| 8900 |
const previousPayloadRef = React32.useRef(payload); |
| 8901 |
const pendingPayloadUpdateRef = React32.useRef(false); |
| 8902 |
useIsoLayoutEffect(() => { |
| 8903 |
const previousActiveTriggerId = previousActiveTriggerIdRef.current; |
| 8904 |
const previousPayload = previousPayloadRef.current; |
| 8905 |
const triggerIdChanged = activeTriggerId !== previousActiveTriggerId; |
| 8906 |
const payloadChanged = payload !== previousPayload; |
| 8907 |
if (triggerIdChanged) { |
| 8908 |
setContentKey((value) => value + 1); |
| 8909 |
pendingPayloadUpdateRef.current = !payloadChanged; |
| 8910 |
} else if (pendingPayloadUpdateRef.current && payloadChanged) { |
| 8911 |
setContentKey((value) => value + 1); |
| 8912 |
pendingPayloadUpdateRef.current = false; |
| 8913 |
} |
| 8914 |
previousActiveTriggerIdRef.current = activeTriggerId; |
| 8915 |
previousPayloadRef.current = payload; |
| 8916 |
}, [activeTriggerId, payload]); |
| 8917 |
return `${activeTriggerId ?? "current"}-${contentKey}`; |
| 8918 |
} |
| 8919 |
|
| 8920 |
// node_modules/@base-ui/react/esm/utils/FloatingPortalLite.js |
| 8921 |
var React33 = __toESM(require_react(), 1); |
| 8922 |
var ReactDOM6 = __toESM(require_react_dom(), 1); |
| 8923 |
var import_jsx_runtime36 = __toESM(require_jsx_runtime(), 1); |
| 8924 |
var FloatingPortalLite = /* @__PURE__ */ React33.forwardRef(function FloatingPortalLite2(componentProps, forwardedRef) { |
| 8925 |
const { |
| 8926 |
children, |
| 8927 |
container, |
| 8928 |
className, |
| 8929 |
render: render4, |
| 8930 |
style, |
| 8931 |
...elementProps |
| 8932 |
} = componentProps; |
| 8933 |
const { |
| 8934 |
portalNode, |
| 8935 |
portalSubtree |
| 8936 |
} = useFloatingPortalNode({ |
| 8937 |
container, |
| 8938 |
ref: forwardedRef, |
| 8939 |
componentProps, |
| 8940 |
elementProps |
| 8941 |
}); |
| 8942 |
if (!portalSubtree && !portalNode) { |
| 8943 |
return null; |
| 8944 |
} |
| 8945 |
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(React33.Fragment, { |
| 8946 |
children: [portalSubtree, portalNode && /* @__PURE__ */ ReactDOM6.createPortal(children, portalNode)] |
| 8947 |
}); |
| 8948 |
}); |
| 8949 |
if (true) FloatingPortalLite.displayName = "FloatingPortalLite"; |
| 8950 |
|
| 8951 |
// node_modules/@base-ui/react/esm/tooltip/index.parts.js |
| 8952 |
var index_parts_exports = {}; |
| 8953 |
__export(index_parts_exports, { |
| 8954 |
Arrow: () => TooltipArrow, |
| 8955 |
Handle: () => TooltipHandle, |
| 8956 |
Popup: () => TooltipPopup, |
| 8957 |
Portal: () => TooltipPortal, |
| 8958 |
Positioner: () => TooltipPositioner, |
| 8959 |
Provider: () => TooltipProvider, |
| 8960 |
Root: () => TooltipRoot, |
| 8961 |
Trigger: () => TooltipTrigger, |
| 8962 |
Viewport: () => TooltipViewport, |
| 8963 |
createHandle: () => createTooltipHandle |
| 8964 |
}); |
| 8965 |
|
| 8966 |
// node_modules/@base-ui/react/esm/tooltip/root/TooltipRoot.js |
| 8967 |
var React36 = __toESM(require_react(), 1); |
| 8968 |
|
| 8969 |
// node_modules/@base-ui/react/esm/tooltip/root/TooltipRootContext.js |
| 8970 |
var React34 = __toESM(require_react(), 1); |
| 8971 |
var TooltipRootContext = /* @__PURE__ */ React34.createContext(void 0); |
| 8972 |
if (true) TooltipRootContext.displayName = "TooltipRootContext"; |
| 8973 |
function useTooltipRootContext(optional) { |
| 8974 |
const context = React34.useContext(TooltipRootContext); |
| 8975 |
if (context === void 0 && !optional) { |
| 8976 |
throw new Error(true ? "Base UI: TooltipRootContext is missing. Tooltip parts must be placed within <Tooltip.Root>." : formatErrorMessage_default(72)); |
| 8977 |
} |
| 8978 |
return context; |
| 8979 |
} |
| 8980 |
|
| 8981 |
// node_modules/@base-ui/react/esm/tooltip/store/TooltipStore.js |
| 8982 |
var React35 = __toESM(require_react(), 1); |
| 8983 |
var ReactDOM7 = __toESM(require_react_dom(), 1); |
| 8984 |
var selectors2 = { |
| 8985 |
...popupStoreSelectors, |
| 8986 |
disabled: createSelector((state) => state.disabled), |
| 8987 |
instantType: createSelector((state) => state.instantType), |
| 8988 |
isInstantPhase: createSelector((state) => state.isInstantPhase), |
| 8989 |
trackCursorAxis: createSelector((state) => state.trackCursorAxis), |
| 8990 |
disableHoverablePopup: createSelector((state) => state.disableHoverablePopup), |
| 8991 |
lastOpenChangeReason: createSelector((state) => state.openChangeReason), |
| 8992 |
closeOnClick: createSelector((state) => state.closeOnClick), |
| 8993 |
closeDelay: createSelector((state) => state.closeDelay), |
| 8994 |
hasViewport: createSelector((state) => state.hasViewport) |
| 8995 |
}; |
| 8996 |
var TooltipStore = class _TooltipStore extends ReactStore { |
| 8997 |
constructor(initialState, floatingId, nested = false) { |
| 8998 |
const triggerElements = new PopupTriggerMap(); |
| 8999 |
const state = { |
| 9000 |
...createInitialState(), |
| 9001 |
...initialState |
| 9002 |
}; |
| 9003 |
state.floatingRootContext = createPopupFloatingRootContext(triggerElements, floatingId, nested); |
| 9004 |
super(state, { |
| 9005 |
popupRef: /* @__PURE__ */ React35.createRef(), |
| 9006 |
onOpenChange: void 0, |
| 9007 |
onOpenChangeComplete: void 0, |
| 9008 |
triggerElements |
| 9009 |
}, selectors2); |
| 9010 |
} |
| 9011 |
setOpen = (nextOpen, eventDetails) => { |
| 9012 |
const reason = eventDetails.reason; |
| 9013 |
const isHover = reason === reason_parts_exports.triggerHover; |
| 9014 |
const isFocusOpen = nextOpen && reason === reason_parts_exports.triggerFocus; |
| 9015 |
const isDismissClose = !nextOpen && (reason === reason_parts_exports.triggerPress || reason === reason_parts_exports.escapeKey); |
| 9016 |
eventDetails.preventUnmountOnClose = () => { |
| 9017 |
this.set("preventUnmountingOnClose", true); |
| 9018 |
}; |
| 9019 |
this.context.onOpenChange?.(nextOpen, eventDetails); |
| 9020 |
if (eventDetails.isCanceled) { |
| 9021 |
return; |
| 9022 |
} |
| 9023 |
this.state.floatingRootContext.dispatchOpenChange(nextOpen, eventDetails); |
| 9024 |
const changeState = () => { |
| 9025 |
const updatedState = { |
| 9026 |
open: nextOpen, |
| 9027 |
openChangeReason: reason |
| 9028 |
}; |
| 9029 |
if (isFocusOpen) { |
| 9030 |
updatedState.instantType = "focus"; |
| 9031 |
} else if (isDismissClose) { |
| 9032 |
updatedState.instantType = "dismiss"; |
| 9033 |
} else if (reason === reason_parts_exports.triggerHover) { |
| 9034 |
updatedState.instantType = void 0; |
| 9035 |
} |
| 9036 |
setOpenTriggerState(updatedState, nextOpen, eventDetails.trigger); |
| 9037 |
this.update(updatedState); |
| 9038 |
}; |
| 9039 |
if (isHover) { |
| 9040 |
ReactDOM7.flushSync(changeState); |
| 9041 |
} else { |
| 9042 |
changeState(); |
| 9043 |
} |
| 9044 |
}; |
| 9045 |
// Used by trigger clicks to clear a delayed hover open without reporting a public open-state change. |
| 9046 |
cancelPendingOpen(event) { |
| 9047 |
this.state.floatingRootContext.dispatchOpenChange(false, createChangeEventDetails(reason_parts_exports.triggerPress, event)); |
| 9048 |
} |
| 9049 |
static useStore(externalStore, initialState) { |
| 9050 |
const store = usePopupStore(externalStore, (floatingId, nested) => new _TooltipStore(initialState, floatingId, nested)).store; |
| 9051 |
return store; |
| 9052 |
} |
| 9053 |
}; |
| 9054 |
function createInitialState() { |
| 9055 |
return { |
| 9056 |
...createInitialPopupStoreState(), |
| 9057 |
disabled: false, |
| 9058 |
instantType: void 0, |
| 9059 |
isInstantPhase: false, |
| 9060 |
trackCursorAxis: "none", |
| 9061 |
disableHoverablePopup: false, |
| 9062 |
openChangeReason: null, |
| 9063 |
closeOnClick: true, |
| 9064 |
closeDelay: 0, |
| 9065 |
hasViewport: false |
| 9066 |
}; |
| 9067 |
} |
| 9068 |
|
| 9069 |
// node_modules/@base-ui/react/esm/tooltip/root/TooltipRoot.js |
| 9070 |
var import_jsx_runtime37 = __toESM(require_jsx_runtime(), 1); |
| 9071 |
var TooltipRoot = fastComponent(function TooltipRoot2(props) { |
| 9072 |
const { |
| 9073 |
disabled: disabled2 = false, |
| 9074 |
defaultOpen = false, |
| 9075 |
open: openProp, |
| 9076 |
disableHoverablePopup = false, |
| 9077 |
trackCursorAxis = "none", |
| 9078 |
actionsRef, |
| 9079 |
onOpenChange, |
| 9080 |
onOpenChangeComplete, |
| 9081 |
handle, |
| 9082 |
triggerId: triggerIdProp, |
| 9083 |
defaultTriggerId: defaultTriggerIdProp = null, |
| 9084 |
children |
| 9085 |
} = props; |
| 9086 |
const store = TooltipStore.useStore(handle?.store, { |
| 9087 |
open: defaultOpen, |
| 9088 |
openProp, |
| 9089 |
activeTriggerId: defaultTriggerIdProp, |
| 9090 |
triggerIdProp |
| 9091 |
}); |
| 9092 |
useOnFirstRender(() => { |
| 9093 |
if (openProp === void 0 && store.state.open === false && defaultOpen === true) { |
| 9094 |
store.update({ |
| 9095 |
open: true, |
| 9096 |
activeTriggerId: defaultTriggerIdProp |
| 9097 |
}); |
| 9098 |
} |
| 9099 |
}); |
| 9100 |
store.useControlledProp("openProp", openProp); |
| 9101 |
store.useControlledProp("triggerIdProp", triggerIdProp); |
| 9102 |
store.useContextCallback("onOpenChange", onOpenChange); |
| 9103 |
store.useContextCallback("onOpenChangeComplete", onOpenChangeComplete); |
| 9104 |
const openState = store.useState("open"); |
| 9105 |
const open = !disabled2 && openState; |
| 9106 |
const activeTriggerId = store.useState("activeTriggerId"); |
| 9107 |
const mounted = store.useState("mounted"); |
| 9108 |
const payload = store.useState("payload"); |
| 9109 |
store.useSyncedValues({ |
| 9110 |
trackCursorAxis, |
| 9111 |
disableHoverablePopup |
| 9112 |
}); |
| 9113 |
store.useSyncedValue("disabled", disabled2); |
| 9114 |
useImplicitActiveTrigger(store); |
| 9115 |
const { |
| 9116 |
forceUnmount, |
| 9117 |
transitionStatus |
| 9118 |
} = useOpenStateTransitions(open, store); |
| 9119 |
const isInstantPhase = store.useState("isInstantPhase"); |
| 9120 |
const instantType = store.useState("instantType"); |
| 9121 |
const lastOpenChangeReason = store.useState("lastOpenChangeReason"); |
| 9122 |
const previousInstantTypeRef = React36.useRef(null); |
| 9123 |
useIsoLayoutEffect(() => { |
| 9124 |
if (openState && disabled2) { |
| 9125 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.disabled)); |
| 9126 |
} |
| 9127 |
}, [openState, disabled2, store]); |
| 9128 |
useIsoLayoutEffect(() => { |
| 9129 |
if (transitionStatus === "ending" && lastOpenChangeReason === reason_parts_exports.none || transitionStatus !== "ending" && isInstantPhase) { |
| 9130 |
if (instantType !== "delay") { |
| 9131 |
previousInstantTypeRef.current = instantType; |
| 9132 |
} |
| 9133 |
store.set("instantType", "delay"); |
| 9134 |
} else if (previousInstantTypeRef.current !== null) { |
| 9135 |
store.set("instantType", previousInstantTypeRef.current); |
| 9136 |
previousInstantTypeRef.current = null; |
| 9137 |
} |
| 9138 |
}, [transitionStatus, isInstantPhase, lastOpenChangeReason, instantType, store]); |
| 9139 |
useIsoLayoutEffect(() => { |
| 9140 |
if (open) { |
| 9141 |
if (activeTriggerId == null) { |
| 9142 |
store.set("payload", void 0); |
| 9143 |
} |
| 9144 |
} |
| 9145 |
}, [store, activeTriggerId, open]); |
| 9146 |
const handleImperativeClose = React36.useCallback(() => { |
| 9147 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.imperativeAction)); |
| 9148 |
}, [store]); |
| 9149 |
React36.useImperativeHandle(actionsRef, () => ({ |
| 9150 |
unmount: forceUnmount, |
| 9151 |
close: handleImperativeClose |
| 9152 |
}), [forceUnmount, handleImperativeClose]); |
| 9153 |
const shouldRenderInteractions = open || mounted || !disabled2 && trackCursorAxis !== "none"; |
| 9154 |
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(TooltipRootContext.Provider, { |
| 9155 |
value: store, |
| 9156 |
children: [shouldRenderInteractions && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TooltipInteractions, { |
| 9157 |
store, |
| 9158 |
disabled: disabled2, |
| 9159 |
trackCursorAxis |
| 9160 |
}), typeof children === "function" ? children({ |
| 9161 |
payload |
| 9162 |
}) : children] |
| 9163 |
}); |
| 9164 |
}); |
| 9165 |
if (true) TooltipRoot.displayName = "TooltipRoot"; |
| 9166 |
function TooltipInteractions({ |
| 9167 |
store, |
| 9168 |
disabled: disabled2, |
| 9169 |
trackCursorAxis |
| 9170 |
}) { |
| 9171 |
const floatingRootContext = store.useState("floatingRootContext"); |
| 9172 |
const dismiss = useDismiss(floatingRootContext, { |
| 9173 |
enabled: !disabled2, |
| 9174 |
referencePress: () => store.select("closeOnClick") |
| 9175 |
}); |
| 9176 |
const clientPoint = useClientPoint(floatingRootContext, { |
| 9177 |
enabled: !disabled2 && trackCursorAxis !== "none", |
| 9178 |
axis: trackCursorAxis === "none" ? void 0 : trackCursorAxis |
| 9179 |
}); |
| 9180 |
const activeTriggerProps = React36.useMemo(() => mergeProps(clientPoint.reference, dismiss.reference), [clientPoint.reference, dismiss.reference]); |
| 9181 |
const inactiveTriggerProps = React36.useMemo(() => mergeProps(clientPoint.trigger, dismiss.trigger), [clientPoint.trigger, dismiss.trigger]); |
| 9182 |
const popupProps = React36.useMemo(() => mergeProps(FOCUSABLE_POPUP_PROPS, clientPoint.floating, dismiss.floating), [clientPoint.floating, dismiss.floating]); |
| 9183 |
usePopupInteractionProps(store, { |
| 9184 |
activeTriggerProps, |
| 9185 |
inactiveTriggerProps, |
| 9186 |
popupProps |
| 9187 |
}); |
| 9188 |
return null; |
| 9189 |
} |
| 9190 |
|
| 9191 |
// node_modules/@base-ui/react/esm/tooltip/trigger/TooltipTrigger.js |
| 9192 |
var React38 = __toESM(require_react(), 1); |
| 9193 |
|
| 9194 |
// node_modules/@base-ui/react/esm/tooltip/provider/TooltipProviderContext.js |
| 9195 |
var React37 = __toESM(require_react(), 1); |
| 9196 |
var TooltipProviderContext = /* @__PURE__ */ React37.createContext(void 0); |
| 9197 |
if (true) TooltipProviderContext.displayName = "TooltipProviderContext"; |
| 9198 |
function useTooltipProviderContext() { |
| 9199 |
return React37.useContext(TooltipProviderContext); |
| 9200 |
} |
| 9201 |
|
| 9202 |
// node_modules/@base-ui/react/esm/tooltip/trigger/TooltipTriggerDataAttributes.js |
| 9203 |
var TooltipTriggerDataAttributes = (function(TooltipTriggerDataAttributes2) { |
| 9204 |
TooltipTriggerDataAttributes2[TooltipTriggerDataAttributes2["popupOpen"] = CommonTriggerDataAttributes.popupOpen] = "popupOpen"; |
| 9205 |
TooltipTriggerDataAttributes2["triggerDisabled"] = "data-trigger-disabled"; |
| 9206 |
return TooltipTriggerDataAttributes2; |
| 9207 |
})({}); |
| 9208 |
|
| 9209 |
// node_modules/@base-ui/react/esm/tooltip/utils/constants.js |
| 9210 |
var OPEN_DELAY = 600; |
| 9211 |
|
| 9212 |
// node_modules/@base-ui/react/esm/tooltip/trigger/TooltipTrigger.js |
| 9213 |
var TOOLTIP_TRIGGER_IDENTIFIER = "data-base-ui-tooltip-trigger"; |
| 9214 |
function getTargetElement(event) { |
| 9215 |
if ("composedPath" in event) { |
| 9216 |
const path = event.composedPath(); |
| 9217 |
for (let i2 = 0; i2 < path.length; i2 += 1) { |
| 9218 |
const element = path[i2]; |
| 9219 |
if (isElement(element)) { |
| 9220 |
return element; |
| 9221 |
} |
| 9222 |
} |
| 9223 |
} |
| 9224 |
const target = event.target; |
| 9225 |
if (isElement(target)) { |
| 9226 |
return target; |
| 9227 |
} |
| 9228 |
return null; |
| 9229 |
} |
| 9230 |
function closestEnabledTooltipTrigger(element) { |
| 9231 |
let current = element; |
| 9232 |
while (current) { |
| 9233 |
if (current.hasAttribute(TOOLTIP_TRIGGER_IDENTIFIER)) { |
| 9234 |
return current; |
| 9235 |
} |
| 9236 |
const parentElement = current.parentElement; |
| 9237 |
if (parentElement) { |
| 9238 |
current = parentElement; |
| 9239 |
continue; |
| 9240 |
} |
| 9241 |
const root = current.getRootNode(); |
| 9242 |
current = "host" in root && isElement(root.host) ? root.host : null; |
| 9243 |
} |
| 9244 |
return null; |
| 9245 |
} |
| 9246 |
var TooltipTrigger = fastComponentRef(function TooltipTrigger2(componentProps, forwardedRef) { |
| 9247 |
const { |
| 9248 |
render: render4, |
| 9249 |
className, |
| 9250 |
style, |
| 9251 |
handle, |
| 9252 |
payload, |
| 9253 |
disabled: disabledProp, |
| 9254 |
delay, |
| 9255 |
closeOnClick = true, |
| 9256 |
closeDelay, |
| 9257 |
id: idProp, |
| 9258 |
...elementProps |
| 9259 |
} = componentProps; |
| 9260 |
const rootContext = useTooltipRootContext(true); |
| 9261 |
const store = handle?.store ?? rootContext; |
| 9262 |
if (!store) { |
| 9263 |
throw new Error(true ? "Base UI: <Tooltip.Trigger> must be either used within a <Tooltip.Root> component or provided with a handle." : formatErrorMessage_default(82)); |
| 9264 |
} |
| 9265 |
const thisTriggerId = useBaseUiId(idProp); |
| 9266 |
const isTriggerActive = store.useState("isTriggerActive", thisTriggerId); |
| 9267 |
const isOpenedByThisTrigger = store.useState("isOpenedByTrigger", thisTriggerId); |
| 9268 |
const floatingRootContext = store.useState("floatingRootContext"); |
| 9269 |
const triggerElementRef = React38.useRef(null); |
| 9270 |
const delayWithDefault = delay ?? OPEN_DELAY; |
| 9271 |
const closeDelayWithDefault = closeDelay ?? 0; |
| 9272 |
const { |
| 9273 |
registerTrigger, |
| 9274 |
isMountedByThisTrigger |
| 9275 |
} = useTriggerDataForwarding(thisTriggerId, triggerElementRef, store, { |
| 9276 |
payload, |
| 9277 |
closeOnClick, |
| 9278 |
closeDelay: closeDelayWithDefault |
| 9279 |
}); |
| 9280 |
const providerContext = useTooltipProviderContext(); |
| 9281 |
const { |
| 9282 |
delayRef, |
| 9283 |
isInstantPhase, |
| 9284 |
hasProvider |
| 9285 |
} = useDelayGroup(floatingRootContext, { |
| 9286 |
open: isOpenedByThisTrigger |
| 9287 |
}); |
| 9288 |
const hoverInteraction = useHoverInteractionSharedState(floatingRootContext); |
| 9289 |
store.useSyncedValue("isInstantPhase", isInstantPhase); |
| 9290 |
const rootDisabled = store.useState("disabled"); |
| 9291 |
const disabled2 = disabledProp ?? rootDisabled; |
| 9292 |
const disabledRef = useValueAsRef(disabled2); |
| 9293 |
const trackCursorAxis = store.useState("trackCursorAxis"); |
| 9294 |
const disableHoverablePopup = store.useState("disableHoverablePopup"); |
| 9295 |
const isNestedTriggerHoveredRef = React38.useRef(false); |
| 9296 |
const nestedTriggerOpenTimeout = useTimeout(); |
| 9297 |
const pointerTypeRef = React38.useRef(void 0); |
| 9298 |
function getOpenDelay() { |
| 9299 |
const providerDelay = providerContext?.delay; |
| 9300 |
const groupOpenValue = typeof delayRef.current === "object" ? delayRef.current.open : void 0; |
| 9301 |
let computedOpenDelay = delayWithDefault; |
| 9302 |
if (hasProvider) { |
| 9303 |
if (groupOpenValue !== 0) { |
| 9304 |
computedOpenDelay = delay ?? providerDelay ?? delayWithDefault; |
| 9305 |
} else { |
| 9306 |
computedOpenDelay = 0; |
| 9307 |
} |
| 9308 |
} |
| 9309 |
return computedOpenDelay; |
| 9310 |
} |
| 9311 |
function isEnabledNestedTriggerTarget(target) { |
| 9312 |
const triggerEl = triggerElementRef.current; |
| 9313 |
if (!triggerEl || !target) { |
| 9314 |
return false; |
| 9315 |
} |
| 9316 |
const nearestTrigger = closestEnabledTooltipTrigger(target); |
| 9317 |
return nearestTrigger !== null && nearestTrigger !== triggerEl && contains(triggerEl, nearestTrigger); |
| 9318 |
} |
| 9319 |
function detectNestedTriggerHover(target) { |
| 9320 |
const nestedTriggerHovered = isEnabledNestedTriggerTarget(target); |
| 9321 |
isNestedTriggerHoveredRef.current = nestedTriggerHovered; |
| 9322 |
if (nestedTriggerHovered) { |
| 9323 |
hoverInteraction.openChangeTimeout.clear(); |
| 9324 |
hoverInteraction.restTimeout.clear(); |
| 9325 |
hoverInteraction.restTimeoutPending = false; |
| 9326 |
nestedTriggerOpenTimeout.clear(); |
| 9327 |
} |
| 9328 |
return nestedTriggerHovered; |
| 9329 |
} |
| 9330 |
const hoverProps = useHoverReferenceInteraction(floatingRootContext, { |
| 9331 |
enabled: !disabled2, |
| 9332 |
mouseOnly: true, |
| 9333 |
move: false, |
| 9334 |
handleClose: !disableHoverablePopup && trackCursorAxis !== "both" ? safePolygon() : null, |
| 9335 |
restMs: getOpenDelay, |
| 9336 |
delay() { |
| 9337 |
const closeValue = typeof delayRef.current === "object" ? delayRef.current.close : void 0; |
| 9338 |
let computedCloseDelay = closeDelayWithDefault; |
| 9339 |
if (closeDelay == null && hasProvider) { |
| 9340 |
computedCloseDelay = closeValue; |
| 9341 |
} |
| 9342 |
return { |
| 9343 |
close: computedCloseDelay |
| 9344 |
}; |
| 9345 |
}, |
| 9346 |
triggerElementRef, |
| 9347 |
isActiveTrigger: isTriggerActive, |
| 9348 |
isClosing: () => store.select("transitionStatus") === "ending", |
| 9349 |
shouldOpen() { |
| 9350 |
return !isNestedTriggerHoveredRef.current; |
| 9351 |
} |
| 9352 |
}); |
| 9353 |
const focusProps = useFocus(floatingRootContext, { |
| 9354 |
enabled: !disabled2 |
| 9355 |
}).reference; |
| 9356 |
const handleNestedTriggerHover = (event) => { |
| 9357 |
const wasNestedTriggerHovered = isNestedTriggerHoveredRef.current; |
| 9358 |
const target = getTargetElement(event); |
| 9359 |
const nestedTriggerHovered = detectNestedTriggerHover(target); |
| 9360 |
const triggerEl = triggerElementRef.current; |
| 9361 |
const targetInsideTrigger = triggerEl && target && contains(triggerEl, target); |
| 9362 |
if (nestedTriggerHovered && store.select("open") && store.select("lastOpenChangeReason") === reason_parts_exports.triggerHover) { |
| 9363 |
store.setOpen(false, createChangeEventDetails(reason_parts_exports.triggerHover, event)); |
| 9364 |
return; |
| 9365 |
} |
| 9366 |
if (wasNestedTriggerHovered && !nestedTriggerHovered && targetInsideTrigger && !disabledRef.current && !store.select("open") && triggerEl && // Match the hover hook's non-strict mouse fallback for mouse-only event sequences. |
| 9367 |
isMouseLikePointerType(pointerTypeRef.current)) { |
| 9368 |
const open = () => { |
| 9369 |
if (!isNestedTriggerHoveredRef.current && !disabledRef.current && !store.select("open")) { |
| 9370 |
store.setOpen(true, createChangeEventDetails(reason_parts_exports.triggerHover, event, triggerEl)); |
| 9371 |
} |
| 9372 |
}; |
| 9373 |
const openDelay = getOpenDelay(); |
| 9374 |
if (openDelay === 0) { |
| 9375 |
nestedTriggerOpenTimeout.clear(); |
| 9376 |
open(); |
| 9377 |
} else { |
| 9378 |
nestedTriggerOpenTimeout.start(openDelay, open); |
| 9379 |
} |
| 9380 |
} |
| 9381 |
}; |
| 9382 |
const rootTriggerProps = store.useState("triggerProps", isMountedByThisTrigger); |
| 9383 |
const shouldApplyRootTriggerProps = isMountedByThisTrigger || trackCursorAxis !== "none"; |
| 9384 |
const state = { |
| 9385 |
open: isOpenedByThisTrigger |
| 9386 |
}; |
| 9387 |
const element = useRenderElement("button", componentProps, { |
| 9388 |
state, |
| 9389 |
ref: [forwardedRef, registerTrigger, triggerElementRef], |
| 9390 |
props: [hoverProps, focusProps, shouldApplyRootTriggerProps ? rootTriggerProps : void 0, { |
| 9391 |
onMouseOver(event) { |
| 9392 |
handleNestedTriggerHover(event.nativeEvent); |
| 9393 |
}, |
| 9394 |
onFocus(event) { |
| 9395 |
if (isEnabledNestedTriggerTarget(getTargetElement(event.nativeEvent))) { |
| 9396 |
event.preventBaseUIHandler(); |
| 9397 |
} |
| 9398 |
}, |
| 9399 |
onMouseLeave() { |
| 9400 |
isNestedTriggerHoveredRef.current = false; |
| 9401 |
nestedTriggerOpenTimeout.clear(); |
| 9402 |
pointerTypeRef.current = void 0; |
| 9403 |
}, |
| 9404 |
onPointerEnter(event) { |
| 9405 |
pointerTypeRef.current = event.pointerType; |
| 9406 |
}, |
| 9407 |
onPointerDown(event) { |
| 9408 |
pointerTypeRef.current = event.pointerType; |
| 9409 |
store.set("closeOnClick", closeOnClick); |
| 9410 |
if (closeOnClick && !store.select("open")) { |
| 9411 |
store.cancelPendingOpen(event.nativeEvent); |
| 9412 |
} |
| 9413 |
}, |
| 9414 |
onClick(event) { |
| 9415 |
if (closeOnClick && !store.select("open")) { |
| 9416 |
store.cancelPendingOpen(event.nativeEvent); |
| 9417 |
} |
| 9418 |
}, |
| 9419 |
id: thisTriggerId, |
| 9420 |
[TooltipTriggerDataAttributes.triggerDisabled]: disabled2 ? "" : void 0, |
| 9421 |
[TOOLTIP_TRIGGER_IDENTIFIER]: disabled2 ? void 0 : "" |
| 9422 |
}, elementProps], |
| 9423 |
stateAttributesMapping: triggerOpenStateMapping |
| 9424 |
}); |
| 9425 |
return element; |
| 9426 |
}); |
| 9427 |
if (true) TooltipTrigger.displayName = "TooltipTrigger"; |
| 9428 |
|
| 9429 |
// node_modules/@base-ui/react/esm/tooltip/portal/TooltipPortal.js |
| 9430 |
var React40 = __toESM(require_react(), 1); |
| 9431 |
|
| 9432 |
// node_modules/@base-ui/react/esm/tooltip/portal/TooltipPortalContext.js |
| 9433 |
var React39 = __toESM(require_react(), 1); |
| 9434 |
var TooltipPortalContext = /* @__PURE__ */ React39.createContext(void 0); |
| 9435 |
if (true) TooltipPortalContext.displayName = "TooltipPortalContext"; |
| 9436 |
function useTooltipPortalContext() { |
| 9437 |
const value = React39.useContext(TooltipPortalContext); |
| 9438 |
if (value === void 0) { |
| 9439 |
throw new Error(true ? "Base UI: <Tooltip.Portal> is missing." : formatErrorMessage_default(70)); |
| 9440 |
} |
| 9441 |
return value; |
| 9442 |
} |
| 9443 |
|
| 9444 |
// node_modules/@base-ui/react/esm/tooltip/portal/TooltipPortal.js |
| 9445 |
var import_jsx_runtime38 = __toESM(require_jsx_runtime(), 1); |
| 9446 |
var TooltipPortal = /* @__PURE__ */ React40.forwardRef(function TooltipPortal2(props, forwardedRef) { |
| 9447 |
const { |
| 9448 |
keepMounted = false, |
| 9449 |
...portalProps |
| 9450 |
} = props; |
| 9451 |
const store = useTooltipRootContext(); |
| 9452 |
const mounted = store.useState("mounted"); |
| 9453 |
const shouldRender = mounted || keepMounted; |
| 9454 |
if (!shouldRender) { |
| 9455 |
return null; |
| 9456 |
} |
| 9457 |
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipPortalContext.Provider, { |
| 9458 |
value: keepMounted, |
| 9459 |
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FloatingPortalLite, { |
| 9460 |
ref: forwardedRef, |
| 9461 |
...portalProps |
| 9462 |
}) |
| 9463 |
}); |
| 9464 |
}); |
| 9465 |
if (true) TooltipPortal.displayName = "TooltipPortal"; |
| 9466 |
|
| 9467 |
// node_modules/@base-ui/react/esm/tooltip/positioner/TooltipPositioner.js |
| 9468 |
var React42 = __toESM(require_react(), 1); |
| 9469 |
|
| 9470 |
// node_modules/@base-ui/react/esm/tooltip/positioner/TooltipPositionerContext.js |
| 9471 |
var React41 = __toESM(require_react(), 1); |
| 9472 |
var TooltipPositionerContext = /* @__PURE__ */ React41.createContext(void 0); |
| 9473 |
if (true) TooltipPositionerContext.displayName = "TooltipPositionerContext"; |
| 9474 |
function useTooltipPositionerContext() { |
| 9475 |
const context = React41.useContext(TooltipPositionerContext); |
| 9476 |
if (context === void 0) { |
| 9477 |
throw new Error(true ? "Base UI: TooltipPositionerContext is missing. TooltipPositioner parts must be placed within <Tooltip.Positioner>." : formatErrorMessage_default(71)); |
| 9478 |
} |
| 9479 |
return context; |
| 9480 |
} |
| 9481 |
|
| 9482 |
// node_modules/@base-ui/react/esm/tooltip/positioner/TooltipPositioner.js |
| 9483 |
var import_jsx_runtime39 = __toESM(require_jsx_runtime(), 1); |
| 9484 |
var TooltipPositioner = /* @__PURE__ */ React42.forwardRef(function TooltipPositioner2(componentProps, forwardedRef) { |
| 9485 |
const { |
| 9486 |
render: render4, |
| 9487 |
className, |
| 9488 |
anchor, |
| 9489 |
positionMethod = "absolute", |
| 9490 |
side = "top", |
| 9491 |
align = "center", |
| 9492 |
sideOffset = 0, |
| 9493 |
alignOffset = 0, |
| 9494 |
collisionBoundary = "clipping-ancestors", |
| 9495 |
collisionPadding = 5, |
| 9496 |
arrowPadding = 5, |
| 9497 |
sticky = false, |
| 9498 |
disableAnchorTracking = false, |
| 9499 |
collisionAvoidance = POPUP_COLLISION_AVOIDANCE, |
| 9500 |
style, |
| 9501 |
...elementProps |
| 9502 |
} = componentProps; |
| 9503 |
const store = useTooltipRootContext(); |
| 9504 |
const keepMounted = useTooltipPortalContext(); |
| 9505 |
const open = store.useState("open"); |
| 9506 |
const mounted = store.useState("mounted"); |
| 9507 |
const trackCursorAxis = store.useState("trackCursorAxis"); |
| 9508 |
const disableHoverablePopup = store.useState("disableHoverablePopup"); |
| 9509 |
const floatingRootContext = store.useState("floatingRootContext"); |
| 9510 |
const instantType = store.useState("instantType"); |
| 9511 |
const transitionStatus = store.useState("transitionStatus"); |
| 9512 |
const hasViewport = store.useState("hasViewport"); |
| 9513 |
const positioning = useAnchorPositioning({ |
| 9514 |
anchor, |
| 9515 |
positionMethod, |
| 9516 |
floatingRootContext, |
| 9517 |
mounted, |
| 9518 |
side, |
| 9519 |
sideOffset, |
| 9520 |
align, |
| 9521 |
alignOffset, |
| 9522 |
collisionBoundary, |
| 9523 |
collisionPadding, |
| 9524 |
sticky, |
| 9525 |
arrowPadding, |
| 9526 |
disableAnchorTracking, |
| 9527 |
keepMounted, |
| 9528 |
collisionAvoidance, |
| 9529 |
adaptiveOrigin: hasViewport ? adaptiveOrigin : void 0 |
| 9530 |
}); |
| 9531 |
const state = React42.useMemo(() => ({ |
| 9532 |
open, |
| 9533 |
side: positioning.side, |
| 9534 |
align: positioning.align, |
| 9535 |
anchorHidden: positioning.anchorHidden, |
| 9536 |
instant: trackCursorAxis !== "none" ? "tracking-cursor" : instantType |
| 9537 |
}), [open, positioning.side, positioning.align, positioning.anchorHidden, trackCursorAxis, instantType]); |
| 9538 |
const element = usePositioner(componentProps, state, { |
| 9539 |
styles: positioning.positionerStyles, |
| 9540 |
transitionStatus, |
| 9541 |
props: elementProps, |
| 9542 |
refs: [forwardedRef, store.useStateSetter("positionerElement")], |
| 9543 |
hidden: !mounted, |
| 9544 |
inert: !open || trackCursorAxis === "both" || disableHoverablePopup |
| 9545 |
}); |
| 9546 |
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(TooltipPositionerContext.Provider, { |
| 9547 |
value: positioning, |
| 9548 |
children: element |
| 9549 |
}); |
| 9550 |
}); |
| 9551 |
if (true) TooltipPositioner.displayName = "TooltipPositioner"; |
| 9552 |
|
| 9553 |
// node_modules/@base-ui/react/esm/tooltip/popup/TooltipPopup.js |
| 9554 |
var React43 = __toESM(require_react(), 1); |
| 9555 |
var stateAttributesMapping = { |
| 9556 |
...popupStateMapping, |
| 9557 |
...transitionStatusMapping |
| 9558 |
}; |
| 9559 |
var TooltipPopup = /* @__PURE__ */ React43.forwardRef(function TooltipPopup2(componentProps, forwardedRef) { |
| 9560 |
const { |
| 9561 |
render: render4, |
| 9562 |
className, |
| 9563 |
style, |
| 9564 |
...elementProps |
| 9565 |
} = componentProps; |
| 9566 |
const store = useTooltipRootContext(); |
| 9567 |
const { |
| 9568 |
side, |
| 9569 |
align |
| 9570 |
} = useTooltipPositionerContext(); |
| 9571 |
const open = store.useState("open"); |
| 9572 |
const instantType = store.useState("instantType"); |
| 9573 |
const transitionStatus = store.useState("transitionStatus"); |
| 9574 |
const popupProps = store.useState("popupProps"); |
| 9575 |
const floatingContext = store.useState("floatingRootContext"); |
| 9576 |
const disabled2 = store.useState("disabled"); |
| 9577 |
const closeDelay = store.useState("closeDelay"); |
| 9578 |
useOpenChangeComplete({ |
| 9579 |
open, |
| 9580 |
ref: store.context.popupRef, |
| 9581 |
onComplete() { |
| 9582 |
if (open) { |
| 9583 |
store.context.onOpenChangeComplete?.(true); |
| 9584 |
} |
| 9585 |
} |
| 9586 |
}); |
| 9587 |
useHoverFloatingInteraction(floatingContext, { |
| 9588 |
enabled: !disabled2, |
| 9589 |
closeDelay |
| 9590 |
}); |
| 9591 |
const setPopupElement = store.useStateSetter("popupElement"); |
| 9592 |
const state = { |
| 9593 |
open, |
| 9594 |
side, |
| 9595 |
align, |
| 9596 |
instant: instantType, |
| 9597 |
transitionStatus |
| 9598 |
}; |
| 9599 |
const element = useRenderElement("div", componentProps, { |
| 9600 |
state, |
| 9601 |
ref: [forwardedRef, store.context.popupRef, setPopupElement], |
| 9602 |
props: [popupProps, getDisabledMountTransitionStyles(transitionStatus), elementProps], |
| 9603 |
stateAttributesMapping |
| 9604 |
}); |
| 9605 |
return element; |
| 9606 |
}); |
| 9607 |
if (true) TooltipPopup.displayName = "TooltipPopup"; |
| 9608 |
|
| 9609 |
// node_modules/@base-ui/react/esm/tooltip/arrow/TooltipArrow.js |
| 9610 |
var React44 = __toESM(require_react(), 1); |
| 9611 |
var TooltipArrow = /* @__PURE__ */ React44.forwardRef(function TooltipArrow2(componentProps, forwardedRef) { |
| 9612 |
const { |
| 9613 |
render: render4, |
| 9614 |
className, |
| 9615 |
style, |
| 9616 |
...elementProps |
| 9617 |
} = componentProps; |
| 9618 |
const store = useTooltipRootContext(); |
| 9619 |
const { |
| 9620 |
arrowRef, |
| 9621 |
side, |
| 9622 |
align, |
| 9623 |
arrowUncentered, |
| 9624 |
arrowStyles |
| 9625 |
} = useTooltipPositionerContext(); |
| 9626 |
const open = store.useState("open"); |
| 9627 |
const instantType = store.useState("instantType"); |
| 9628 |
const state = { |
| 9629 |
open, |
| 9630 |
side, |
| 9631 |
align, |
| 9632 |
uncentered: arrowUncentered, |
| 9633 |
instant: instantType |
| 9634 |
}; |
| 9635 |
const element = useRenderElement("div", componentProps, { |
| 9636 |
state, |
| 9637 |
ref: [forwardedRef, arrowRef], |
| 9638 |
props: [{ |
| 9639 |
style: arrowStyles, |
| 9640 |
"aria-hidden": true |
| 9641 |
}, elementProps], |
| 9642 |
stateAttributesMapping: popupStateMapping |
| 9643 |
}); |
| 9644 |
return element; |
| 9645 |
}); |
| 9646 |
if (true) TooltipArrow.displayName = "TooltipArrow"; |
| 9647 |
|
| 9648 |
// node_modules/@base-ui/react/esm/tooltip/provider/TooltipProvider.js |
| 9649 |
var React45 = __toESM(require_react(), 1); |
| 9650 |
var import_jsx_runtime40 = __toESM(require_jsx_runtime(), 1); |
| 9651 |
var TooltipProvider = function TooltipProvider2(props) { |
| 9652 |
const { |
| 9653 |
delay, |
| 9654 |
closeDelay, |
| 9655 |
timeout = 400 |
| 9656 |
} = props; |
| 9657 |
const contextValue = React45.useMemo(() => ({ |
| 9658 |
delay, |
| 9659 |
closeDelay |
| 9660 |
}), [delay, closeDelay]); |
| 9661 |
const delayValue = React45.useMemo(() => ({ |
| 9662 |
open: delay, |
| 9663 |
close: closeDelay |
| 9664 |
}), [delay, closeDelay]); |
| 9665 |
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TooltipProviderContext.Provider, { |
| 9666 |
value: contextValue, |
| 9667 |
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(FloatingDelayGroup, { |
| 9668 |
delay: delayValue, |
| 9669 |
timeoutMs: timeout, |
| 9670 |
children: props.children |
| 9671 |
}) |
| 9672 |
}); |
| 9673 |
}; |
| 9674 |
if (true) TooltipProvider.displayName = "TooltipProvider"; |
| 9675 |
|
| 9676 |
// node_modules/@base-ui/react/esm/tooltip/viewport/TooltipViewport.js |
| 9677 |
var React46 = __toESM(require_react(), 1); |
| 9678 |
|
| 9679 |
// node_modules/@base-ui/react/esm/tooltip/viewport/TooltipViewportCssVars.js |
| 9680 |
var TooltipViewportCssVars = /* @__PURE__ */ (function(TooltipViewportCssVars2) { |
| 9681 |
TooltipViewportCssVars2["popupWidth"] = "--popup-width"; |
| 9682 |
TooltipViewportCssVars2["popupHeight"] = "--popup-height"; |
| 9683 |
return TooltipViewportCssVars2; |
| 9684 |
})({}); |
| 9685 |
|
| 9686 |
// node_modules/@base-ui/react/esm/tooltip/viewport/TooltipViewport.js |
| 9687 |
var stateAttributesMapping2 = { |
| 9688 |
activationDirection: (value) => value ? { |
| 9689 |
"data-activation-direction": value |
| 9690 |
} : null |
| 9691 |
}; |
| 9692 |
var TooltipViewport = /* @__PURE__ */ React46.forwardRef(function TooltipViewport2(componentProps, forwardedRef) { |
| 9693 |
const { |
| 9694 |
render: render4, |
| 9695 |
className, |
| 9696 |
style, |
| 9697 |
children, |
| 9698 |
...elementProps |
| 9699 |
} = componentProps; |
| 9700 |
const store = useTooltipRootContext(); |
| 9701 |
const positioner = useTooltipPositionerContext(); |
| 9702 |
const instantType = store.useState("instantType"); |
| 9703 |
const { |
| 9704 |
children: childrenToRender, |
| 9705 |
state: viewportState |
| 9706 |
} = usePopupViewport({ |
| 9707 |
store, |
| 9708 |
side: positioner.side, |
| 9709 |
cssVars: TooltipViewportCssVars, |
| 9710 |
children |
| 9711 |
}); |
| 9712 |
const state = { |
| 9713 |
activationDirection: viewportState.activationDirection, |
| 9714 |
transitioning: viewportState.transitioning, |
| 9715 |
instant: instantType |
| 9716 |
}; |
| 9717 |
return useRenderElement("div", componentProps, { |
| 9718 |
state, |
| 9719 |
ref: forwardedRef, |
| 9720 |
props: [elementProps, { |
| 9721 |
children: childrenToRender |
| 9722 |
}], |
| 9723 |
stateAttributesMapping: stateAttributesMapping2 |
| 9724 |
}); |
| 9725 |
}); |
| 9726 |
if (true) TooltipViewport.displayName = "TooltipViewport"; |
| 9727 |
|
| 9728 |
// node_modules/@base-ui/react/esm/tooltip/store/TooltipHandle.js |
| 9729 |
var TooltipHandle = class { |
| 9730 |
/** |
| 9731 |
* Internal store holding the tooltip state. |
| 9732 |
* @internal |
| 9733 |
*/ |
| 9734 |
constructor() { |
| 9735 |
this.store = new TooltipStore(); |
| 9736 |
} |
| 9737 |
/** |
| 9738 |
* Opens the tooltip and associates it with the trigger with the given ID. |
| 9739 |
* The trigger must be a Tooltip.Trigger component with this handle passed as a prop. |
| 9740 |
* |
| 9741 |
* This method should only be called in an event handler or an effect (not during rendering). |
| 9742 |
* |
| 9743 |
* @param triggerId ID of the trigger to associate with the tooltip. |
| 9744 |
*/ |
| 9745 |
open(triggerId) { |
| 9746 |
const triggerElement = triggerId ? this.store.context.triggerElements.getById(triggerId) : void 0; |
| 9747 |
if (triggerId && !triggerElement) { |
| 9748 |
throw new Error(true ? `Base UI: TooltipHandle.open: No trigger found with id "${triggerId}".` : formatErrorMessage_default(81, triggerId)); |
| 9749 |
} |
| 9750 |
this.store.setOpen(true, createChangeEventDetails(reason_parts_exports.imperativeAction, void 0, triggerElement)); |
| 9751 |
} |
| 9752 |
/** |
| 9753 |
* Closes the tooltip. |
| 9754 |
*/ |
| 9755 |
close() { |
| 9756 |
this.store.setOpen(false, createChangeEventDetails(reason_parts_exports.imperativeAction, void 0, void 0)); |
| 9757 |
} |
| 9758 |
/** |
| 9759 |
* Indicates whether the tooltip is currently open. |
| 9760 |
*/ |
| 9761 |
get isOpen() { |
| 9762 |
return this.store.select("open"); |
| 9763 |
} |
| 9764 |
}; |
| 9765 |
function createTooltipHandle() { |
| 9766 |
return new TooltipHandle(); |
| 9767 |
} |
| 9768 |
|
| 9769 |
// node_modules/@base-ui/react/esm/use-render/useRender.js |
| 9770 |
function useRender(params) { |
| 9771 |
return useRenderElement(params.defaultTagName ?? "div", params, params); |
| 9772 |
} |
| 9773 |
|
| 9774 |
// packages/ui/build-module/utils/render-slot-with-children.mjs |
| 9775 |
var import_element11 = __toESM(require_element(), 1); |
| 9776 |
function renderSlotWithChildren(slot, defaultSlot, children) { |
| 9777 |
return (0, import_element11.cloneElement)(slot ?? defaultSlot, { children }); |
| 9778 |
} |
| 9779 |
|
| 9780 |
// packages/ui/build-module/utils/theme-provider.mjs |
| 9781 |
var theme = __toESM(require_theme(), 1); |
| 9782 |
|
| 9783 |
// packages/ui/build-module/lock-unlock.mjs |
| 9784 |
var import_private_apis = __toESM(require_private_apis(), 1); |
| 9785 |
var { lock, unlock } = (0, import_private_apis.__dangerousOptInToUnstableAPIsOnlyForCoreModules)( |
| 9786 |
"I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.", |
| 9787 |
"@wordpress/ui" |
| 9788 |
); |
| 9789 |
|
| 9790 |
// packages/ui/build-module/utils/theme-provider.mjs |
| 9791 |
function getThemeProvider() { |
| 9792 |
const themePackage = theme; |
| 9793 |
if (themePackage.ThemeProvider) { |
| 9794 |
return themePackage.ThemeProvider; |
| 9795 |
} |
| 9796 |
if (!themePackage.privateApis) { |
| 9797 |
throw new Error( |
| 9798 |
"@wordpress/ui: @wordpress/theme must expose `ThemeProvider` or `privateApis.ThemeProvider`." |
| 9799 |
); |
| 9800 |
} |
| 9801 |
return unlock( |
| 9802 |
themePackage.privateApis |
| 9803 |
).ThemeProvider; |
| 9804 |
} |
| 9805 |
var ThemeProvider = getThemeProvider(); |
| 9806 |
|
| 9807 |
// packages/ui/build-module/stack/stack.mjs |
| 9808 |
var import_element12 = __toESM(require_element(), 1); |
| 9809 |
var STYLE_HASH_ATTRIBUTE = "data-wp-hash"; |
| 9810 |
function getRuntime() { |
| 9811 |
const globalScope = globalThis; |
| 9812 |
if (globalScope.__wpStyleRuntime) { |
| 9813 |
return globalScope.__wpStyleRuntime; |
| 9814 |
} |
| 9815 |
globalScope.__wpStyleRuntime = { |
| 9816 |
documents: /* @__PURE__ */ new Map(), |
| 9817 |
styles: /* @__PURE__ */ new Map(), |
| 9818 |
injectedStyles: /* @__PURE__ */ new WeakMap() |
| 9819 |
}; |
| 9820 |
if (typeof document !== "undefined") { |
| 9821 |
registerDocument(document); |
| 9822 |
} |
| 9823 |
return globalScope.__wpStyleRuntime; |
| 9824 |
} |
| 9825 |
function documentContainsStyleHash(targetDocument, hash) { |
| 9826 |
if (!targetDocument.head) { |
| 9827 |
return false; |
| 9828 |
} |
| 9829 |
for (const style of targetDocument.head.querySelectorAll( |
| 9830 |
`style[${STYLE_HASH_ATTRIBUTE}]` |
| 9831 |
)) { |
| 9832 |
if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) { |
| 9833 |
return true; |
| 9834 |
} |
| 9835 |
} |
| 9836 |
return false; |
| 9837 |
} |
| 9838 |
function injectStyle(targetDocument, hash, css) { |
| 9839 |
if (!targetDocument.head) { |
| 9840 |
return; |
| 9841 |
} |
| 9842 |
const runtime = getRuntime(); |
| 9843 |
let injectedStyles = runtime.injectedStyles.get(targetDocument); |
| 9844 |
if (!injectedStyles) { |
| 9845 |
injectedStyles = /* @__PURE__ */ new Set(); |
| 9846 |
runtime.injectedStyles.set(targetDocument, injectedStyles); |
| 9847 |
} |
| 9848 |
if (injectedStyles.has(hash)) { |
| 9849 |
return; |
| 9850 |
} |
| 9851 |
if (documentContainsStyleHash(targetDocument, hash)) { |
| 9852 |
injectedStyles.add(hash); |
| 9853 |
return; |
| 9854 |
} |
| 9855 |
const style = targetDocument.createElement("style"); |
| 9856 |
style.setAttribute(STYLE_HASH_ATTRIBUTE, hash); |
| 9857 |
style.appendChild(targetDocument.createTextNode(css)); |
| 9858 |
targetDocument.head.appendChild(style); |
| 9859 |
injectedStyles.add(hash); |
| 9860 |
} |
| 9861 |
function registerDocument(targetDocument) { |
| 9862 |
const runtime = getRuntime(); |
| 9863 |
runtime.documents.set( |
| 9864 |
targetDocument, |
| 9865 |
(runtime.documents.get(targetDocument) ?? 0) + 1 |
| 9866 |
); |
| 9867 |
for (const [hash, css] of runtime.styles) { |
| 9868 |
injectStyle(targetDocument, hash, css); |
| 9869 |
} |
| 9870 |
return () => { |
| 9871 |
const count = runtime.documents.get(targetDocument); |
| 9872 |
if (count === void 0) { |
| 9873 |
return; |
| 9874 |
} |
| 9875 |
if (count <= 1) { |
| 9876 |
runtime.documents.delete(targetDocument); |
| 9877 |
return; |
| 9878 |
} |
| 9879 |
runtime.documents.set(targetDocument, count - 1); |
| 9880 |
}; |
| 9881 |
} |
| 9882 |
function registerStyle(hash, css) { |
| 9883 |
const runtime = getRuntime(); |
| 9884 |
runtime.styles.set(hash, css); |
| 9885 |
for (const targetDocument of runtime.documents.keys()) { |
| 9886 |
injectStyle(targetDocument, hash, css); |
| 9887 |
} |
| 9888 |
} |
| 9889 |
if (typeof process === "undefined" || true) { |
| 9890 |
registerStyle("32aba35fe1", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._19ce0419607e1896__stack{display:flex}}}"); |
| 9891 |
} |
| 9892 |
var style_default = { "stack": "_19ce0419607e1896__stack" }; |
| 9893 |
var gapTokens = { |
| 9894 |
xs: "var(--wpds-dimension-gap-xs, 4px)", |
| 9895 |
sm: "var(--wpds-dimension-gap-sm, 8px)", |
| 9896 |
md: "var(--wpds-dimension-gap-md, 12px)", |
| 9897 |
lg: "var(--wpds-dimension-gap-lg, 16px)", |
| 9898 |
xl: "var(--wpds-dimension-gap-xl, 24px)", |
| 9899 |
"2xl": "var(--wpds-dimension-gap-2xl, 32px)", |
| 9900 |
"3xl": "var(--wpds-dimension-gap-3xl, 40px)" |
| 9901 |
}; |
| 9902 |
var Stack = (0, import_element12.forwardRef)(function Stack2({ direction, gap, align, justify, wrap, render: render4, ...props }, ref) { |
| 9903 |
const style = { |
| 9904 |
gap: gap && gapTokens[gap], |
| 9905 |
alignItems: align, |
| 9906 |
justifyContent: justify, |
| 9907 |
flexDirection: direction, |
| 9908 |
flexWrap: wrap |
| 9909 |
}; |
| 9910 |
const element = useRender({ |
| 9911 |
render: render4, |
| 9912 |
ref, |
| 9913 |
props: mergeProps(props, { style, className: style_default.stack }) |
| 9914 |
}); |
| 9915 |
return element; |
| 9916 |
}); |
| 9917 |
|
| 9918 |
// packages/ui/build-module/tooltip/index.mjs |
| 9919 |
var tooltip_exports = {}; |
| 9920 |
__export(tooltip_exports, { |
| 9921 |
Popup: () => Popup, |
| 9922 |
Portal: () => Portal, |
| 9923 |
Positioner: () => Positioner, |
| 9924 |
Provider: () => Provider, |
| 9925 |
Root: () => Root, |
| 9926 |
Trigger: () => Trigger |
| 9927 |
}); |
| 9928 |
|
| 9929 |
// packages/ui/build-module/tooltip/popup.mjs |
| 9930 |
var import_element15 = __toESM(require_element(), 1); |
| 9931 |
|
| 9932 |
// packages/ui/build-module/tooltip/portal.mjs |
| 9933 |
var import_element13 = __toESM(require_element(), 1); |
| 9934 |
|
| 9935 |
// packages/ui/build-module/utils/wp-compat-overlay-slot.mjs |
| 9936 |
var STYLE_HASH_ATTRIBUTE2 = "data-wp-hash"; |
| 9937 |
function getRuntime2() { |
| 9938 |
const globalScope = globalThis; |
| 9939 |
if (globalScope.__wpStyleRuntime) { |
| 9940 |
return globalScope.__wpStyleRuntime; |
| 9941 |
} |
| 9942 |
globalScope.__wpStyleRuntime = { |
| 9943 |
documents: /* @__PURE__ */ new Map(), |
| 9944 |
styles: /* @__PURE__ */ new Map(), |
| 9945 |
injectedStyles: /* @__PURE__ */ new WeakMap() |
| 9946 |
}; |
| 9947 |
if (typeof document !== "undefined") { |
| 9948 |
registerDocument2(document); |
| 9949 |
} |
| 9950 |
return globalScope.__wpStyleRuntime; |
| 9951 |
} |
| 9952 |
function documentContainsStyleHash2(targetDocument, hash) { |
| 9953 |
if (!targetDocument.head) { |
| 9954 |
return false; |
| 9955 |
} |
| 9956 |
for (const style of targetDocument.head.querySelectorAll( |
| 9957 |
`style[${STYLE_HASH_ATTRIBUTE2}]` |
| 9958 |
)) { |
| 9959 |
if (style.getAttribute(STYLE_HASH_ATTRIBUTE2) === hash) { |
| 9960 |
return true; |
| 9961 |
} |
| 9962 |
} |
| 9963 |
return false; |
| 9964 |
} |
| 9965 |
function injectStyle2(targetDocument, hash, css) { |
| 9966 |
if (!targetDocument.head) { |
| 9967 |
return; |
| 9968 |
} |
| 9969 |
const runtime = getRuntime2(); |
| 9970 |
let injectedStyles = runtime.injectedStyles.get(targetDocument); |
| 9971 |
if (!injectedStyles) { |
| 9972 |
injectedStyles = /* @__PURE__ */ new Set(); |
| 9973 |
runtime.injectedStyles.set(targetDocument, injectedStyles); |
| 9974 |
} |
| 9975 |
if (injectedStyles.has(hash)) { |
| 9976 |
return; |
| 9977 |
} |
| 9978 |
if (documentContainsStyleHash2(targetDocument, hash)) { |
| 9979 |
injectedStyles.add(hash); |
| 9980 |
return; |
| 9981 |
} |
| 9982 |
const style = targetDocument.createElement("style"); |
| 9983 |
style.setAttribute(STYLE_HASH_ATTRIBUTE2, hash); |
| 9984 |
style.appendChild(targetDocument.createTextNode(css)); |
| 9985 |
targetDocument.head.appendChild(style); |
| 9986 |
injectedStyles.add(hash); |
| 9987 |
} |
| 9988 |
function registerDocument2(targetDocument) { |
| 9989 |
const runtime = getRuntime2(); |
| 9990 |
runtime.documents.set( |
| 9991 |
targetDocument, |
| 9992 |
(runtime.documents.get(targetDocument) ?? 0) + 1 |
| 9993 |
); |
| 9994 |
for (const [hash, css] of runtime.styles) { |
| 9995 |
injectStyle2(targetDocument, hash, css); |
| 9996 |
} |
| 9997 |
return () => { |
| 9998 |
const count = runtime.documents.get(targetDocument); |
| 9999 |
if (count === void 0) { |
| 10000 |
return; |
| 10001 |
} |
| 10002 |
if (count <= 1) { |
| 10003 |
runtime.documents.delete(targetDocument); |
| 10004 |
return; |
| 10005 |
} |
| 10006 |
runtime.documents.set(targetDocument, count - 1); |
| 10007 |
}; |
| 10008 |
} |
| 10009 |
function registerStyle2(hash, css) { |
| 10010 |
const runtime = getRuntime2(); |
| 10011 |
runtime.styles.set(hash, css); |
| 10012 |
for (const targetDocument of runtime.documents.keys()) { |
| 10013 |
injectStyle2(targetDocument, hash, css); |
| 10014 |
} |
| 10015 |
} |
| 10016 |
if (typeof process === "undefined" || true) { |
| 10017 |
registerStyle2("be37f31c1e", "._11fc52b637ff8a7e__slot{inset:0;isolation:isolate;pointer-events:none;position:fixed;z-index:1000000003}@layer wp-ui{@layer utilities, components, compositions, overrides;@layer utilities{._11fc52b637ff8a7e__slot>*{pointer-events:auto}}}"); |
| 10018 |
} |
| 10019 |
var wp_compat_overlay_slot_default = { "slot": "_11fc52b637ff8a7e__slot" }; |
| 10020 |
var WP_COMPAT_OVERLAY_SLOT_ATTRIBUTE = "data-wp-compat-overlay-slot"; |
| 10021 |
function resolveOwnerDocument() { |
| 10022 |
return typeof document === "undefined" ? null : document; |
| 10023 |
} |
| 10024 |
function isInWordPressEnvironment() { |
| 10025 |
let topWp; |
| 10026 |
try { |
| 10027 |
topWp = window.top?.wp; |
| 10028 |
} catch { |
| 10029 |
} |
| 10030 |
const wp = topWp ?? window.wp; |
| 10031 |
return typeof wp?.components === "object" && wp.components !== null; |
| 10032 |
} |
| 10033 |
var cachedSlot = null; |
| 10034 |
function createSlot(ownerDocument2) { |
| 10035 |
const element = ownerDocument2.createElement("div"); |
| 10036 |
element.setAttribute(WP_COMPAT_OVERLAY_SLOT_ATTRIBUTE, ""); |
| 10037 |
if (wp_compat_overlay_slot_default.slot) { |
| 10038 |
element.classList.add(wp_compat_overlay_slot_default.slot); |
| 10039 |
} |
| 10040 |
ownerDocument2.body.appendChild(element); |
| 10041 |
return element; |
| 10042 |
} |
| 10043 |
function getWpCompatOverlaySlot() { |
| 10044 |
if (typeof window === "undefined") { |
| 10045 |
return void 0; |
| 10046 |
} |
| 10047 |
if (!isInWordPressEnvironment() && window.__wpUiCompatOverlaySlotEnabled !== true) { |
| 10048 |
return void 0; |
| 10049 |
} |
| 10050 |
const ownerDocument2 = resolveOwnerDocument(); |
| 10051 |
if (!ownerDocument2 || !ownerDocument2.body) { |
| 10052 |
return void 0; |
| 10053 |
} |
| 10054 |
if (cachedSlot && cachedSlot.ownerDocument === ownerDocument2 && cachedSlot.isConnected) { |
| 10055 |
return cachedSlot; |
| 10056 |
} |
| 10057 |
const existing = ownerDocument2.querySelector( |
| 10058 |
`[${WP_COMPAT_OVERLAY_SLOT_ATTRIBUTE}]` |
| 10059 |
); |
| 10060 |
if (existing instanceof HTMLDivElement) { |
| 10061 |
cachedSlot = existing; |
| 10062 |
return existing; |
| 10063 |
} |
| 10064 |
if (cachedSlot?.isConnected) { |
| 10065 |
cachedSlot.remove(); |
| 10066 |
} |
| 10067 |
cachedSlot = createSlot(ownerDocument2); |
| 10068 |
return cachedSlot; |
| 10069 |
} |
| 10070 |
|
| 10071 |
// packages/ui/build-module/tooltip/portal.mjs |
| 10072 |
var import_jsx_runtime41 = __toESM(require_jsx_runtime(), 1); |
| 10073 |
var Portal = (0, import_element13.forwardRef)( |
| 10074 |
function TooltipPortal3({ container, ...restProps }, ref) { |
| 10075 |
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)( |
| 10076 |
index_parts_exports.Portal, |
| 10077 |
{ |
| 10078 |
container: container ?? getWpCompatOverlaySlot(), |
| 10079 |
...restProps, |
| 10080 |
ref |
| 10081 |
} |
| 10082 |
); |
| 10083 |
} |
| 10084 |
); |
| 10085 |
|
| 10086 |
// packages/ui/build-module/tooltip/positioner.mjs |
| 10087 |
var import_element14 = __toESM(require_element(), 1); |
| 10088 |
var import_jsx_runtime42 = __toESM(require_jsx_runtime(), 1); |
| 10089 |
var STYLE_HASH_ATTRIBUTE3 = "data-wp-hash"; |
| 10090 |
function getRuntime3() { |
| 10091 |
const globalScope = globalThis; |
| 10092 |
if (globalScope.__wpStyleRuntime) { |
| 10093 |
return globalScope.__wpStyleRuntime; |
| 10094 |
} |
| 10095 |
globalScope.__wpStyleRuntime = { |
| 10096 |
documents: /* @__PURE__ */ new Map(), |
| 10097 |
styles: /* @__PURE__ */ new Map(), |
| 10098 |
injectedStyles: /* @__PURE__ */ new WeakMap() |
| 10099 |
}; |
| 10100 |
if (typeof document !== "undefined") { |
| 10101 |
registerDocument3(document); |
| 10102 |
} |
| 10103 |
return globalScope.__wpStyleRuntime; |
| 10104 |
} |
| 10105 |
function documentContainsStyleHash3(targetDocument, hash) { |
| 10106 |
if (!targetDocument.head) { |
| 10107 |
return false; |
| 10108 |
} |
| 10109 |
for (const style of targetDocument.head.querySelectorAll( |
| 10110 |
`style[${STYLE_HASH_ATTRIBUTE3}]` |
| 10111 |
)) { |
| 10112 |
if (style.getAttribute(STYLE_HASH_ATTRIBUTE3) === hash) { |
| 10113 |
return true; |
| 10114 |
} |
| 10115 |
} |
| 10116 |
return false; |
| 10117 |
} |
| 10118 |
function injectStyle3(targetDocument, hash, css) { |
| 10119 |
if (!targetDocument.head) { |
| 10120 |
return; |
| 10121 |
} |
| 10122 |
const runtime = getRuntime3(); |
| 10123 |
let injectedStyles = runtime.injectedStyles.get(targetDocument); |
| 10124 |
if (!injectedStyles) { |
| 10125 |
injectedStyles = /* @__PURE__ */ new Set(); |
| 10126 |
runtime.injectedStyles.set(targetDocument, injectedStyles); |
| 10127 |
} |
| 10128 |
if (injectedStyles.has(hash)) { |
| 10129 |
return; |
| 10130 |
} |
| 10131 |
if (documentContainsStyleHash3(targetDocument, hash)) { |
| 10132 |
injectedStyles.add(hash); |
| 10133 |
return; |
| 10134 |
} |
| 10135 |
const style = targetDocument.createElement("style"); |
| 10136 |
style.setAttribute(STYLE_HASH_ATTRIBUTE3, hash); |
| 10137 |
style.appendChild(targetDocument.createTextNode(css)); |
| 10138 |
targetDocument.head.appendChild(style); |
| 10139 |
injectedStyles.add(hash); |
| 10140 |
} |
| 10141 |
function registerDocument3(targetDocument) { |
| 10142 |
const runtime = getRuntime3(); |
| 10143 |
runtime.documents.set( |
| 10144 |
targetDocument, |
| 10145 |
(runtime.documents.get(targetDocument) ?? 0) + 1 |
| 10146 |
); |
| 10147 |
for (const [hash, css] of runtime.styles) { |
| 10148 |
injectStyle3(targetDocument, hash, css); |
| 10149 |
} |
| 10150 |
return () => { |
| 10151 |
const count = runtime.documents.get(targetDocument); |
| 10152 |
if (count === void 0) { |
| 10153 |
return; |
| 10154 |
} |
| 10155 |
if (count <= 1) { |
| 10156 |
runtime.documents.delete(targetDocument); |
| 10157 |
return; |
| 10158 |
} |
| 10159 |
runtime.documents.set(targetDocument, count - 1); |
| 10160 |
}; |
| 10161 |
} |
| 10162 |
function registerStyle3(hash, css) { |
| 10163 |
const runtime = getRuntime3(); |
| 10164 |
runtime.styles.set(hash, css); |
| 10165 |
for (const targetDocument of runtime.documents.keys()) { |
| 10166 |
injectStyle3(targetDocument, hash, css); |
| 10167 |
} |
| 10168 |
} |
| 10169 |
if (typeof process === "undefined" || true) { |
| 10170 |
registerStyle3("10f3806643", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}}"); |
| 10171 |
} |
| 10172 |
var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" }; |
| 10173 |
if (typeof process === "undefined" || true) { |
| 10174 |
registerStyle3("789467362f", '@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-background-surface-neutral-strong,#fff);border-radius:var(--wpds-border-radius-md,4px);box-shadow:var(--wpds-elevation-sm,0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005);color:var(--wpds-color-foreground-content-neutral,#1e1e1e);font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-typography-font-size-sm,12px);line-height:1.4;padding:var(--wpds-dimension-padding-xs,4px) var(--wpds-dimension-padding-sm,8px);@media (forced-colors:active){border-bottom-color:CanvasText;border-bottom-style:solid;border-bottom-width:1px;border-left-color:CanvasText;border-left-style:solid;border-left-width:1px;border-right-color:CanvasText;border-right-style:solid;border-right-width:1px;border-top-color:CanvasText;border-top-style:solid;border-top-width:1px}}}}'); |
| 10175 |
} |
| 10176 |
var style_default2 = { "positioner": "_480b748dd3510e64__positioner", "popup": "_50096b232db7709d__popup" }; |
| 10177 |
var Positioner = (0, import_element14.forwardRef)( |
| 10178 |
function TooltipPositioner3({ align = "center", className, side = "top", sideOffset = 4, ...props }, ref) { |
| 10179 |
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)( |
| 10180 |
index_parts_exports.Positioner, |
| 10181 |
{ |
| 10182 |
ref, |
| 10183 |
align, |
| 10184 |
side, |
| 10185 |
sideOffset, |
| 10186 |
...props, |
| 10187 |
className: clsx_default( |
| 10188 |
resets_default["box-sizing"], |
| 10189 |
style_default2.positioner, |
| 10190 |
className |
| 10191 |
) |
| 10192 |
} |
| 10193 |
); |
| 10194 |
} |
| 10195 |
); |
| 10196 |
|
| 10197 |
// packages/ui/build-module/tooltip/popup.mjs |
| 10198 |
var import_jsx_runtime43 = __toESM(require_jsx_runtime(), 1); |
| 10199 |
var STYLE_HASH_ATTRIBUTE4 = "data-wp-hash"; |
| 10200 |
function getRuntime4() { |
| 10201 |
const globalScope = globalThis; |
| 10202 |
if (globalScope.__wpStyleRuntime) { |
| 10203 |
return globalScope.__wpStyleRuntime; |
| 10204 |
} |
| 10205 |
globalScope.__wpStyleRuntime = { |
| 10206 |
documents: /* @__PURE__ */ new Map(), |
| 10207 |
styles: /* @__PURE__ */ new Map(), |
| 10208 |
injectedStyles: /* @__PURE__ */ new WeakMap() |
| 10209 |
}; |
| 10210 |
if (typeof document !== "undefined") { |
| 10211 |
registerDocument4(document); |
| 10212 |
} |
| 10213 |
return globalScope.__wpStyleRuntime; |
| 10214 |
} |
| 10215 |
function documentContainsStyleHash4(targetDocument, hash) { |
| 10216 |
if (!targetDocument.head) { |
| 10217 |
return false; |
| 10218 |
} |
| 10219 |
for (const style of targetDocument.head.querySelectorAll( |
| 10220 |
`style[${STYLE_HASH_ATTRIBUTE4}]` |
| 10221 |
)) { |
| 10222 |
if (style.getAttribute(STYLE_HASH_ATTRIBUTE4) === hash) { |
| 10223 |
return true; |
| 10224 |
} |
| 10225 |
} |
| 10226 |
return false; |
| 10227 |
} |
| 10228 |
function injectStyle4(targetDocument, hash, css) { |
| 10229 |
if (!targetDocument.head) { |
| 10230 |
return; |
| 10231 |
} |
| 10232 |
const runtime = getRuntime4(); |
| 10233 |
let injectedStyles = runtime.injectedStyles.get(targetDocument); |
| 10234 |
if (!injectedStyles) { |
| 10235 |
injectedStyles = /* @__PURE__ */ new Set(); |
| 10236 |
runtime.injectedStyles.set(targetDocument, injectedStyles); |
| 10237 |
} |
| 10238 |
if (injectedStyles.has(hash)) { |
| 10239 |
return; |
| 10240 |
} |
| 10241 |
if (documentContainsStyleHash4(targetDocument, hash)) { |
| 10242 |
injectedStyles.add(hash); |
| 10243 |
return; |
| 10244 |
} |
| 10245 |
const style = targetDocument.createElement("style"); |
| 10246 |
style.setAttribute(STYLE_HASH_ATTRIBUTE4, hash); |
| 10247 |
style.appendChild(targetDocument.createTextNode(css)); |
| 10248 |
targetDocument.head.appendChild(style); |
| 10249 |
injectedStyles.add(hash); |
| 10250 |
} |
| 10251 |
function registerDocument4(targetDocument) { |
| 10252 |
const runtime = getRuntime4(); |
| 10253 |
runtime.documents.set( |
| 10254 |
targetDocument, |
| 10255 |
(runtime.documents.get(targetDocument) ?? 0) + 1 |
| 10256 |
); |
| 10257 |
for (const [hash, css] of runtime.styles) { |
| 10258 |
injectStyle4(targetDocument, hash, css); |
| 10259 |
} |
| 10260 |
return () => { |
| 10261 |
const count = runtime.documents.get(targetDocument); |
| 10262 |
if (count === void 0) { |
| 10263 |
return; |
| 10264 |
} |
| 10265 |
if (count <= 1) { |
| 10266 |
runtime.documents.delete(targetDocument); |
| 10267 |
return; |
| 10268 |
} |
| 10269 |
runtime.documents.set(targetDocument, count - 1); |
| 10270 |
}; |
| 10271 |
} |
| 10272 |
function registerStyle4(hash, css) { |
| 10273 |
const runtime = getRuntime4(); |
| 10274 |
runtime.styles.set(hash, css); |
| 10275 |
for (const targetDocument of runtime.documents.keys()) { |
| 10276 |
injectStyle4(targetDocument, hash, css); |
| 10277 |
} |
| 10278 |
} |
| 10279 |
if (typeof process === "undefined" || true) { |
| 10280 |
registerStyle4("789467362f", '@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-background-surface-neutral-strong,#fff);border-radius:var(--wpds-border-radius-md,4px);box-shadow:var(--wpds-elevation-sm,0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005);color:var(--wpds-color-foreground-content-neutral,#1e1e1e);font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif);font-size:var(--wpds-typography-font-size-sm,12px);line-height:1.4;padding:var(--wpds-dimension-padding-xs,4px) var(--wpds-dimension-padding-sm,8px);@media (forced-colors:active){border-bottom-color:CanvasText;border-bottom-style:solid;border-bottom-width:1px;border-left-color:CanvasText;border-left-style:solid;border-left-width:1px;border-right-color:CanvasText;border-right-style:solid;border-right-width:1px;border-top-color:CanvasText;border-top-style:solid;border-top-width:1px}}}}'); |
| 10281 |
} |
| 10282 |
var style_default3 = { "positioner": "_480b748dd3510e64__positioner", "popup": "_50096b232db7709d__popup" }; |
| 10283 |
var POPUP_COLOR = { background: "#1e1e1e" }; |
| 10284 |
var Popup = (0, import_element15.forwardRef)(function TooltipPopup3({ portal, positioner, children, className, ...props }, ref) { |
| 10285 |
const popupContent = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ThemeProvider, { color: POPUP_COLOR, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)( |
| 10286 |
index_parts_exports.Popup, |
| 10287 |
{ |
| 10288 |
ref, |
| 10289 |
className: clsx_default(style_default3.popup, className), |
| 10290 |
...props, |
| 10291 |
children |
| 10292 |
} |
| 10293 |
) }); |
| 10294 |
const positionedPopup = renderSlotWithChildren( |
| 10295 |
positioner, |
| 10296 |
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Positioner, {}), |
| 10297 |
popupContent |
| 10298 |
); |
| 10299 |
return renderSlotWithChildren(portal, /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Portal, {}), positionedPopup); |
| 10300 |
}); |
| 10301 |
|
| 10302 |
// packages/ui/build-module/tooltip/trigger.mjs |
| 10303 |
var import_element16 = __toESM(require_element(), 1); |
| 10304 |
var import_jsx_runtime44 = __toESM(require_jsx_runtime(), 1); |
| 10305 |
var Trigger = (0, import_element16.forwardRef)( |
| 10306 |
function TooltipTrigger3(props, ref) { |
| 10307 |
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(index_parts_exports.Trigger, { ref, ...props }); |
| 10308 |
} |
| 10309 |
); |
| 10310 |
|
| 10311 |
// packages/ui/build-module/tooltip/root.mjs |
| 10312 |
var import_jsx_runtime45 = __toESM(require_jsx_runtime(), 1); |
| 10313 |
function Root(props) { |
| 10314 |
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(index_parts_exports.Root, { ...props }); |
| 10315 |
} |
| 10316 |
|
| 10317 |
// packages/ui/build-module/tooltip/provider.mjs |
| 10318 |
var import_jsx_runtime46 = __toESM(require_jsx_runtime(), 1); |
| 10319 |
function Provider({ ...props }) { |
| 10320 |
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(index_parts_exports.Provider, { ...props }); |
| 10321 |
} |
| 10322 |
|
| 10323 |
// packages/ui/build-module/visually-hidden/visually-hidden.mjs |
| 10324 |
var import_element17 = __toESM(require_element(), 1); |
| 10325 |
var STYLE_HASH_ATTRIBUTE5 = "data-wp-hash"; |
| 10326 |
function getRuntime5() { |
| 10327 |
const globalScope = globalThis; |
| 10328 |
if (globalScope.__wpStyleRuntime) { |
| 10329 |
return globalScope.__wpStyleRuntime; |
| 10330 |
} |
| 10331 |
globalScope.__wpStyleRuntime = { |
| 10332 |
documents: /* @__PURE__ */ new Map(), |
| 10333 |
styles: /* @__PURE__ */ new Map(), |
| 10334 |
injectedStyles: /* @__PURE__ */ new WeakMap() |
| 10335 |
}; |
| 10336 |
if (typeof document !== "undefined") { |
| 10337 |
registerDocument5(document); |
| 10338 |
} |
| 10339 |
return globalScope.__wpStyleRuntime; |
| 10340 |
} |
| 10341 |
function documentContainsStyleHash5(targetDocument, hash) { |
| 10342 |
if (!targetDocument.head) { |
| 10343 |
return false; |
| 10344 |
} |
| 10345 |
for (const style of targetDocument.head.querySelectorAll( |
| 10346 |
`style[${STYLE_HASH_ATTRIBUTE5}]` |
| 10347 |
)) { |
| 10348 |
if (style.getAttribute(STYLE_HASH_ATTRIBUTE5) === hash) { |
| 10349 |
return true; |
| 10350 |
} |
| 10351 |
} |
| 10352 |
return false; |
| 10353 |
} |
| 10354 |
function injectStyle5(targetDocument, hash, css) { |
| 10355 |
if (!targetDocument.head) { |
| 10356 |
return; |
| 10357 |
} |
| 10358 |
const runtime = getRuntime5(); |
| 10359 |
let injectedStyles = runtime.injectedStyles.get(targetDocument); |
| 10360 |
if (!injectedStyles) { |
| 10361 |
injectedStyles = /* @__PURE__ */ new Set(); |
| 10362 |
runtime.injectedStyles.set(targetDocument, injectedStyles); |
| 10363 |
} |
| 10364 |
if (injectedStyles.has(hash)) { |
| 10365 |
return; |
| 10366 |
} |
| 10367 |
if (documentContainsStyleHash5(targetDocument, hash)) { |
| 10368 |
injectedStyles.add(hash); |
| 10369 |
return; |
| 10370 |
} |
| 10371 |
const style = targetDocument.createElement("style"); |
| 10372 |
style.setAttribute(STYLE_HASH_ATTRIBUTE5, hash); |
| 10373 |
style.appendChild(targetDocument.createTextNode(css)); |
| 10374 |
targetDocument.head.appendChild(style); |
| 10375 |
injectedStyles.add(hash); |
| 10376 |
} |
| 10377 |
function registerDocument5(targetDocument) { |
| 10378 |
const runtime = getRuntime5(); |
| 10379 |
runtime.documents.set( |
| 10380 |
targetDocument, |
| 10381 |
(runtime.documents.get(targetDocument) ?? 0) + 1 |
| 10382 |
); |
| 10383 |
for (const [hash, css] of runtime.styles) { |
| 10384 |
injectStyle5(targetDocument, hash, css); |
| 10385 |
} |
| 10386 |
return () => { |
| 10387 |
const count = runtime.documents.get(targetDocument); |
| 10388 |
if (count === void 0) { |
| 10389 |
return; |
| 10390 |
} |
| 10391 |
if (count <= 1) { |
| 10392 |
runtime.documents.delete(targetDocument); |
| 10393 |
return; |
| 10394 |
} |
| 10395 |
runtime.documents.set(targetDocument, count - 1); |
| 10396 |
}; |
| 10397 |
} |
| 10398 |
function registerStyle5(hash, css) { |
| 10399 |
const runtime = getRuntime5(); |
| 10400 |
runtime.styles.set(hash, css); |
| 10401 |
for (const targetDocument of runtime.documents.keys()) { |
| 10402 |
injectStyle5(targetDocument, hash, css); |
| 10403 |
} |
| 10404 |
} |
| 10405 |
if (typeof process === "undefined" || true) { |
| 10406 |
registerStyle5("fa606a57ae", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer 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}}}"); |
| 10407 |
} |
| 10408 |
var style_default4 = { "visually-hidden": "f37b9e2e191ebd66__visually-hidden" }; |
| 10409 |
var VisuallyHidden = (0, import_element17.forwardRef)( |
| 10410 |
function VisuallyHidden2({ render: render4, ...restProps }, ref) { |
| 10411 |
const element = useRender({ |
| 10412 |
render: render4, |
| 10413 |
ref, |
| 10414 |
props: mergeProps( |
| 10415 |
{ className: style_default4["visually-hidden"] }, |
| 10416 |
restProps, |
| 10417 |
{ |
| 10418 |
// @ts-expect-error Arbitrary data-* attributes aren't indexable on the typed div props. Kept hardcoded so consumers can't change or remove it. |
| 10419 |
"data-visually-hidden": "" |
| 10420 |
} |
| 10421 |
) |
| 10422 |
}); |
| 10423 |
return element; |
| 10424 |
} |
| 10425 |
); |
| 10426 |
|
| 10427 |
// packages/dataviews/build-module/components/dataviews-context/index.mjs |
| 10428 |
var import_element18 = __toESM(require_element(), 1); |
| 10429 |
|
| 10430 |
// packages/dataviews/build-module/constants.mjs |
| 10431 |
var import_i18n7 = __toESM(require_i18n(), 1); |
| 10432 |
var OPERATOR_IS_ANY = "isAny"; |
| 10433 |
var OPERATOR_IS_NONE = "isNone"; |
| 10434 |
var OPERATOR_IS_ALL = "isAll"; |
| 10435 |
var OPERATOR_IS_NOT_ALL = "isNotAll"; |
| 10436 |
var OPERATOR_BETWEEN = "between"; |
| 10437 |
var OPERATOR_IN_THE_PAST = "inThePast"; |
| 10438 |
var OPERATOR_OVER = "over"; |
| 10439 |
var OPERATOR_IS = "is"; |
| 10440 |
var OPERATOR_IS_NOT = "isNot"; |
| 10441 |
var OPERATOR_LESS_THAN = "lessThan"; |
| 10442 |
var OPERATOR_GREATER_THAN = "greaterThan"; |
| 10443 |
var OPERATOR_LESS_THAN_OR_EQUAL = "lessThanOrEqual"; |
| 10444 |
var OPERATOR_GREATER_THAN_OR_EQUAL = "greaterThanOrEqual"; |
| 10445 |
var OPERATOR_BEFORE = "before"; |
| 10446 |
var OPERATOR_AFTER = "after"; |
| 10447 |
var OPERATOR_BEFORE_INC = "beforeInc"; |
| 10448 |
var OPERATOR_AFTER_INC = "afterInc"; |
| 10449 |
var OPERATOR_CONTAINS = "contains"; |
| 10450 |
var OPERATOR_NOT_CONTAINS = "notContains"; |
| 10451 |
var OPERATOR_STARTS_WITH = "startsWith"; |
| 10452 |
var OPERATOR_ON = "on"; |
| 10453 |
var OPERATOR_NOT_ON = "notOn"; |
| 10454 |
var SORTING_DIRECTIONS = ["asc", "desc"]; |
| 10455 |
var sortArrows = { asc: "\u2191", desc: "\u2193" }; |
| 10456 |
var sortValues = { asc: "ascending", desc: "descending" }; |
| 10457 |
var sortLabels = { |
| 10458 |
asc: (0, import_i18n7.__)("Sort ascending"), |
| 10459 |
desc: (0, import_i18n7.__)("Sort descending") |
| 10460 |
}; |
| 10461 |
var sortIcons = { |
| 10462 |
asc: arrow_up_default, |
| 10463 |
desc: arrow_down_default |
| 10464 |
}; |
| 10465 |
var LAYOUT_TABLE = "table"; |
| 10466 |
var LAYOUT_GRID = "grid"; |
| 10467 |
var LAYOUT_LIST = "list"; |
| 10468 |
var LAYOUT_ACTIVITY = "activity"; |
| 10469 |
var LAYOUT_PICKER_GRID = "pickerGrid"; |
| 10470 |
var LAYOUT_PICKER_TABLE = "pickerTable"; |
| 10471 |
var LAYOUT_PICKER_ACTIVITY = "pickerActivity"; |
| 10472 |
|
| 10473 |
// packages/dataviews/build-module/components/dataviews-context/index.mjs |
| 10474 |
var DataViewsContext = (0, import_element18.createContext)({ |
| 10475 |
view: { type: LAYOUT_TABLE }, |
| 10476 |
onChangeView: () => { |
| 10477 |
}, |
| 10478 |
fields: [], |
| 10479 |
data: [], |
| 10480 |
paginationInfo: { |
| 10481 |
totalItems: 0, |
| 10482 |
totalPages: 0 |
| 10483 |
}, |
| 10484 |
selection: [], |
| 10485 |
onChangeSelection: () => { |
| 10486 |
}, |
| 10487 |
setOpenedFilter: () => { |
| 10488 |
}, |
| 10489 |
openedFilter: null, |
| 10490 |
getItemId: (item) => item.id, |
| 10491 |
isItemClickable: () => true, |
| 10492 |
renderItemLink: void 0, |
| 10493 |
containerWidth: 0, |
| 10494 |
containerRef: (0, import_element18.createRef)(), |
| 10495 |
resizeObserverRef: () => { |
| 10496 |
}, |
| 10497 |
defaultLayouts: { list: {}, grid: {}, table: {} }, |
| 10498 |
filters: [], |
| 10499 |
isShowingFilter: false, |
| 10500 |
setIsShowingFilter: () => { |
| 10501 |
}, |
| 10502 |
hasInitiallyLoaded: false, |
| 10503 |
config: { |
| 10504 |
perPageSizes: [] |
| 10505 |
}, |
| 10506 |
intersectionObserver: null |
| 10507 |
}); |
| 10508 |
DataViewsContext.displayName = "DataViewsContext"; |
| 10509 |
var dataviews_context_default = DataViewsContext; |
| 10510 |
|
| 10511 |
// packages/dataviews/build-module/components/dataviews-layouts/index.mjs |
| 10512 |
var import_i18n28 = __toESM(require_i18n(), 1); |
| 10513 |
|
| 10514 |
// packages/dataviews/build-module/components/dataviews-layouts/table/index.mjs |
| 10515 |
var import_i18n15 = __toESM(require_i18n(), 1); |
| 10516 |
var import_components6 = __toESM(require_components(), 1); |
| 10517 |
var import_element26 = __toESM(require_element(), 1); |
| 10518 |
var import_keycodes = __toESM(require_keycodes(), 1); |
| 10519 |
|
| 10520 |
// packages/dataviews/build-module/components/dataviews-selection-checkbox/index.mjs |
| 10521 |
var import_components = __toESM(require_components(), 1); |
| 10522 |
var import_i18n8 = __toESM(require_i18n(), 1); |
| 10523 |
var import_jsx_runtime47 = __toESM(require_jsx_runtime(), 1); |
| 10524 |
function DataViewsSelectionCheckbox({ |
| 10525 |
selection, |
| 10526 |
onChangeSelection, |
| 10527 |
item, |
| 10528 |
getItemId, |
| 10529 |
titleField, |
| 10530 |
disabled: disabled2, |
| 10531 |
...extraProps |
| 10532 |
}) { |
| 10533 |
const id = getItemId(item); |
| 10534 |
const isInSelectionArray = selection.includes(id); |
| 10535 |
const checked = !disabled2 && isInSelectionArray; |
| 10536 |
const selectionLabel = titleField?.getValue?.({ item }) || (0, import_i18n8.__)("(no title)"); |
| 10537 |
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)( |
| 10538 |
import_components.CheckboxControl, |
| 10539 |
{ |
| 10540 |
className: "dataviews-selection-checkbox", |
| 10541 |
"aria-label": selectionLabel, |
| 10542 |
"aria-disabled": disabled2, |
| 10543 |
checked, |
| 10544 |
onChange: () => { |
| 10545 |
if (disabled2) { |
| 10546 |
return; |
| 10547 |
} |
| 10548 |
onChangeSelection( |
| 10549 |
isInSelectionArray ? selection.filter((itemId) => id !== itemId) : [...selection, id] |
| 10550 |
); |
| 10551 |
}, |
| 10552 |
...extraProps |
| 10553 |
} |
| 10554 |
); |
| 10555 |
} |
| 10556 |
|
| 10557 |
// packages/dataviews/build-module/components/dataviews-item-actions/index.mjs |
| 10558 |
var import_components2 = __toESM(require_components(), 1); |
| 10559 |
var import_i18n9 = __toESM(require_i18n(), 1); |
| 10560 |
var import_element19 = __toESM(require_element(), 1); |
| 10561 |
var import_data = __toESM(require_data(), 1); |
| 10562 |
var import_compose = __toESM(require_compose(), 1); |
| 10563 |
|
| 10564 |
// packages/dataviews/build-module/lock-unlock.mjs |
| 10565 |
var import_private_apis2 = __toESM(require_private_apis(), 1); |
| 10566 |
var { lock: lock2, unlock: unlock2 } = (0, import_private_apis2.__dangerousOptInToUnstableAPIsOnlyForCoreModules)( |
| 10567 |
"I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.", |
| 10568 |
"@wordpress/dataviews" |
| 10569 |
); |
| 10570 |
|
| 10571 |
// packages/dataviews/build-module/components/dataviews-item-actions/index.mjs |
| 10572 |
var import_jsx_runtime48 = __toESM(require_jsx_runtime(), 1); |
| 10573 |
var { Menu, kebabCase } = unlock2(import_components2.privateApis); |
| 10574 |
function ButtonTrigger({ |
| 10575 |
action, |
| 10576 |
onClick, |
| 10577 |
items, |
| 10578 |
variant |
| 10579 |
}) { |
| 10580 |
const label = typeof action.label === "string" ? action.label : action.label(items); |
| 10581 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10582 |
import_components2.Button, |
| 10583 |
{ |
| 10584 |
disabled: !!action.disabled, |
| 10585 |
accessibleWhenDisabled: true, |
| 10586 |
size: "compact", |
| 10587 |
variant, |
| 10588 |
onClick, |
| 10589 |
children: label |
| 10590 |
} |
| 10591 |
); |
| 10592 |
} |
| 10593 |
function MenuItemTrigger({ |
| 10594 |
action, |
| 10595 |
onClick, |
| 10596 |
items |
| 10597 |
}) { |
| 10598 |
const label = typeof action.label === "string" ? action.label : action.label(items); |
| 10599 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Menu.Item, { disabled: action.disabled, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Menu.ItemLabel, { children: label }) }); |
| 10600 |
} |
| 10601 |
function ActionModal({ |
| 10602 |
action, |
| 10603 |
items, |
| 10604 |
closeModal |
| 10605 |
}) { |
| 10606 |
const label = typeof action.label === "string" ? action.label : action.label(items); |
| 10607 |
const modalHeader = typeof action.modalHeader === "function" ? action.modalHeader(items) : action.modalHeader; |
| 10608 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10609 |
import_components2.Modal, |
| 10610 |
{ |
| 10611 |
title: modalHeader || label, |
| 10612 |
__experimentalHideHeader: !!action.hideModalHeader, |
| 10613 |
onRequestClose: closeModal, |
| 10614 |
focusOnMount: action.modalFocusOnMount ?? true, |
| 10615 |
size: action.modalSize || "medium", |
| 10616 |
overlayClassName: `dataviews-action-modal dataviews-action-modal__${kebabCase( |
| 10617 |
action.id |
| 10618 |
)}`, |
| 10619 |
children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(action.RenderModal, { items, closeModal }) |
| 10620 |
} |
| 10621 |
); |
| 10622 |
} |
| 10623 |
function ActionsMenuGroup({ |
| 10624 |
actions, |
| 10625 |
item, |
| 10626 |
registry, |
| 10627 |
setActiveModalAction |
| 10628 |
}) { |
| 10629 |
const { primaryActions, regularActions } = (0, import_element19.useMemo)(() => { |
| 10630 |
return actions.reduce( |
| 10631 |
(acc, action) => { |
| 10632 |
(action.isPrimary ? acc.primaryActions : acc.regularActions).push(action); |
| 10633 |
return acc; |
| 10634 |
}, |
| 10635 |
{ |
| 10636 |
primaryActions: [], |
| 10637 |
regularActions: [] |
| 10638 |
} |
| 10639 |
); |
| 10640 |
}, [actions]); |
| 10641 |
const renderActionGroup = (actionList) => actionList.map((action) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10642 |
MenuItemTrigger, |
| 10643 |
{ |
| 10644 |
action, |
| 10645 |
onClick: () => { |
| 10646 |
if ("RenderModal" in action) { |
| 10647 |
setActiveModalAction(action); |
| 10648 |
return; |
| 10649 |
} |
| 10650 |
action.callback([item], { registry }); |
| 10651 |
}, |
| 10652 |
items: [item] |
| 10653 |
}, |
| 10654 |
action.id |
| 10655 |
)); |
| 10656 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Menu.Group, { children: [ |
| 10657 |
renderActionGroup(primaryActions), |
| 10658 |
renderActionGroup(regularActions) |
| 10659 |
] }); |
| 10660 |
} |
| 10661 |
function ItemActions({ |
| 10662 |
item, |
| 10663 |
actions, |
| 10664 |
isCompact |
| 10665 |
}) { |
| 10666 |
const registry = (0, import_data.useRegistry)(); |
| 10667 |
const { primaryActions, eligibleActions } = (0, import_element19.useMemo)(() => { |
| 10668 |
const _eligibleActions = actions.filter( |
| 10669 |
(action) => !action.isEligible || action.isEligible(item) |
| 10670 |
); |
| 10671 |
const _primaryActions = _eligibleActions.filter( |
| 10672 |
(action) => action.isPrimary |
| 10673 |
); |
| 10674 |
return { |
| 10675 |
primaryActions: _primaryActions, |
| 10676 |
eligibleActions: _eligibleActions |
| 10677 |
}; |
| 10678 |
}, [actions, item]); |
| 10679 |
const isMobileViewport = (0, import_compose.useViewportMatch)("medium", "<"); |
| 10680 |
if (isCompact) { |
| 10681 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10682 |
CompactItemActions, |
| 10683 |
{ |
| 10684 |
item, |
| 10685 |
actions: eligibleActions, |
| 10686 |
isSmall: true, |
| 10687 |
registry |
| 10688 |
} |
| 10689 |
); |
| 10690 |
} |
| 10691 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)( |
| 10692 |
Stack, |
| 10693 |
{ |
| 10694 |
direction: "row", |
| 10695 |
justify: "flex-end", |
| 10696 |
className: "dataviews-item-actions", |
| 10697 |
style: { |
| 10698 |
flexShrink: 0, |
| 10699 |
width: "auto" |
| 10700 |
}, |
| 10701 |
children: [ |
| 10702 |
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10703 |
PrimaryActions, |
| 10704 |
{ |
| 10705 |
item, |
| 10706 |
actions: primaryActions, |
| 10707 |
registry |
| 10708 |
} |
| 10709 |
), |
| 10710 |
(primaryActions.length < eligibleActions.length || // Since we hide primary actions on mobile, we need to show the menu |
| 10711 |
// there if there are any actions at all. |
| 10712 |
isMobileViewport) && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10713 |
CompactItemActions, |
| 10714 |
{ |
| 10715 |
item, |
| 10716 |
actions: eligibleActions, |
| 10717 |
registry |
| 10718 |
} |
| 10719 |
) |
| 10720 |
] |
| 10721 |
} |
| 10722 |
); |
| 10723 |
} |
| 10724 |
function CompactItemActions({ |
| 10725 |
item, |
| 10726 |
actions, |
| 10727 |
isSmall, |
| 10728 |
registry |
| 10729 |
}) { |
| 10730 |
const [activeModalAction, setActiveModalAction] = (0, import_element19.useState)( |
| 10731 |
null |
| 10732 |
); |
| 10733 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [ |
| 10734 |
/* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Menu, { placement: "bottom-end", children: [ |
| 10735 |
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10736 |
Menu.TriggerButton, |
| 10737 |
{ |
| 10738 |
render: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10739 |
import_components2.Button, |
| 10740 |
{ |
| 10741 |
size: isSmall ? "small" : "compact", |
| 10742 |
icon: more_vertical_default, |
| 10743 |
label: (0, import_i18n9.__)("Actions"), |
| 10744 |
accessibleWhenDisabled: true, |
| 10745 |
disabled: !actions.length, |
| 10746 |
className: "dataviews-all-actions-button" |
| 10747 |
} |
| 10748 |
) |
| 10749 |
} |
| 10750 |
), |
| 10751 |
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Menu.Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10752 |
ActionsMenuGroup, |
| 10753 |
{ |
| 10754 |
actions, |
| 10755 |
item, |
| 10756 |
registry, |
| 10757 |
setActiveModalAction |
| 10758 |
} |
| 10759 |
) }) |
| 10760 |
] }), |
| 10761 |
!!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10762 |
ActionModal, |
| 10763 |
{ |
| 10764 |
action: activeModalAction, |
| 10765 |
items: [item], |
| 10766 |
closeModal: () => setActiveModalAction(null) |
| 10767 |
} |
| 10768 |
) |
| 10769 |
] }); |
| 10770 |
} |
| 10771 |
function PrimaryActions({ |
| 10772 |
item, |
| 10773 |
actions, |
| 10774 |
registry, |
| 10775 |
buttonVariant |
| 10776 |
}) { |
| 10777 |
const [activeModalAction, setActiveModalAction] = (0, import_element19.useState)(null); |
| 10778 |
const isMobileViewport = (0, import_compose.useViewportMatch)("medium", "<"); |
| 10779 |
if (isMobileViewport) { |
| 10780 |
return null; |
| 10781 |
} |
| 10782 |
if (!Array.isArray(actions) || actions.length === 0) { |
| 10783 |
return null; |
| 10784 |
} |
| 10785 |
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [ |
| 10786 |
actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10787 |
ButtonTrigger, |
| 10788 |
{ |
| 10789 |
action, |
| 10790 |
onClick: () => { |
| 10791 |
if ("RenderModal" in action) { |
| 10792 |
setActiveModalAction(action); |
| 10793 |
return; |
| 10794 |
} |
| 10795 |
action.callback([item], { registry }); |
| 10796 |
}, |
| 10797 |
items: [item], |
| 10798 |
variant: buttonVariant |
| 10799 |
}, |
| 10800 |
action.id |
| 10801 |
)), |
| 10802 |
!!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)( |
| 10803 |
ActionModal, |
| 10804 |
{ |
| 10805 |
action: activeModalAction, |
| 10806 |
items: [item], |
| 10807 |
closeModal: () => setActiveModalAction(null) |
| 10808 |
} |
| 10809 |
) |
| 10810 |
] }); |
| 10811 |
} |
| 10812 |
|
| 10813 |
// packages/dataviews/build-module/components/dataviews-bulk-actions/index.mjs |
| 10814 |
var import_components3 = __toESM(require_components(), 1); |
| 10815 |
var import_i18n11 = __toESM(require_i18n(), 1); |
| 10816 |
var import_element20 = __toESM(require_element(), 1); |
| 10817 |
var import_data2 = __toESM(require_data(), 1); |
| 10818 |
var import_compose2 = __toESM(require_compose(), 1); |
| 10819 |
|
| 10820 |
// packages/dataviews/build-module/utils/get-footer-message.mjs |
| 10821 |
var import_i18n10 = __toESM(require_i18n(), 1); |
| 10822 |
function getFooterMessage(selectionCount, itemsCount, totalItems, onlyTotalCount = false) { |
| 10823 |
if (selectionCount > 0) { |
| 10824 |
return (0, import_i18n10.sprintf)( |
| 10825 |
/* translators: %d: number of items. */ |
| 10826 |
(0, import_i18n10._n)("%d Item selected", "%d Items selected", selectionCount), |
| 10827 |
selectionCount |
| 10828 |
); |
| 10829 |
} |
| 10830 |
if (onlyTotalCount || totalItems <= itemsCount) { |
| 10831 |
return (0, import_i18n10.sprintf)( |
| 10832 |
/* translators: %d: number of items. */ |
| 10833 |
(0, import_i18n10._n)("%d Item", "%d Items", totalItems), |
| 10834 |
totalItems |
| 10835 |
); |
| 10836 |
} |
| 10837 |
return (0, import_i18n10.sprintf)( |
| 10838 |
/* translators: %1$d: number of items. %2$d: total number of items. */ |
| 10839 |
(0, import_i18n10._n)("%1$d of %2$d Item", "%1$d of %2$d Items", totalItems), |
| 10840 |
itemsCount, |
| 10841 |
totalItems |
| 10842 |
); |
| 10843 |
} |
| 10844 |
|
| 10845 |
// packages/dataviews/build-module/components/dataviews-bulk-actions/index.mjs |
| 10846 |
var import_jsx_runtime49 = __toESM(require_jsx_runtime(), 1); |
| 10847 |
function useHasAPossibleBulkAction(actions, item) { |
| 10848 |
return (0, import_element20.useMemo)(() => { |
| 10849 |
return actions.some((action) => { |
| 10850 |
return action.supportsBulk && (!action.isEligible || action.isEligible(item)); |
| 10851 |
}); |
| 10852 |
}, [actions, item]); |
| 10853 |
} |
| 10854 |
function useSomeItemHasAPossibleBulkAction(actions, data) { |
| 10855 |
return (0, import_element20.useMemo)(() => { |
| 10856 |
return data.some((item) => { |
| 10857 |
return actions.some((action) => { |
| 10858 |
return action.supportsBulk && (!action.isEligible || action.isEligible(item)); |
| 10859 |
}); |
| 10860 |
}); |
| 10861 |
}, [actions, data]); |
| 10862 |
} |
| 10863 |
function BulkSelectionCheckbox({ |
| 10864 |
selection, |
| 10865 |
onChangeSelection, |
| 10866 |
data, |
| 10867 |
actions, |
| 10868 |
getItemId, |
| 10869 |
disableSelectAll = false |
| 10870 |
}) { |
| 10871 |
const selectableItems = (0, import_element20.useMemo)(() => { |
| 10872 |
return data.filter((item) => { |
| 10873 |
return actions.some( |
| 10874 |
(action) => action.supportsBulk && (!action.isEligible || action.isEligible(item)) |
| 10875 |
); |
| 10876 |
}); |
| 10877 |
}, [data, actions]); |
| 10878 |
const selectedItems = data.filter( |
| 10879 |
(item) => selection.includes(getItemId(item)) && selectableItems.includes(item) |
| 10880 |
); |
| 10881 |
const hasSelection = selection.length > 0; |
| 10882 |
const areAllSelected = selectedItems.length === selectableItems.length; |
| 10883 |
if (disableSelectAll) { |
| 10884 |
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)( |
| 10885 |
import_components3.CheckboxControl, |
| 10886 |
{ |
| 10887 |
className: "dataviews-view-table-selection-checkbox", |
| 10888 |
checked: hasSelection, |
| 10889 |
disabled: !hasSelection, |
| 10890 |
onChange: () => { |
| 10891 |
onChangeSelection([]); |
| 10892 |
}, |
| 10893 |
"aria-label": (0, import_i18n11.__)("Deselect all") |
| 10894 |
} |
| 10895 |
); |
| 10896 |
} |
| 10897 |
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)( |
| 10898 |
import_components3.CheckboxControl, |
| 10899 |
{ |
| 10900 |
className: "dataviews-view-table-selection-checkbox", |
| 10901 |
checked: areAllSelected, |
| 10902 |
indeterminate: !areAllSelected && !!selectedItems.length, |
| 10903 |
onChange: () => { |
| 10904 |
if (areAllSelected) { |
| 10905 |
onChangeSelection([]); |
| 10906 |
} else { |
| 10907 |
onChangeSelection( |
| 10908 |
selectableItems.map((item) => getItemId(item)) |
| 10909 |
); |
| 10910 |
} |
| 10911 |
}, |
| 10912 |
"aria-label": areAllSelected ? (0, import_i18n11.__)("Deselect all") : (0, import_i18n11.__)("Select all") |
| 10913 |
} |
| 10914 |
); |
| 10915 |
} |
| 10916 |
|
| 10917 |
// packages/dataviews/build-module/components/dataviews-layouts/table/column-header-menu.mjs |
| 10918 |
var import_i18n12 = __toESM(require_i18n(), 1); |
| 10919 |
var import_components4 = __toESM(require_components(), 1); |
| 10920 |
var import_element21 = __toESM(require_element(), 1); |
| 10921 |
|
| 10922 |
// packages/dataviews/build-module/utils/get-hideable-fields.mjs |
| 10923 |
function getHideableFields(view, fields) { |
| 10924 |
const togglableFields = [ |
| 10925 |
view?.titleField, |
| 10926 |
view?.mediaField, |
| 10927 |
view?.descriptionField |
| 10928 |
].filter(Boolean); |
| 10929 |
return fields.filter( |
| 10930 |
(f2) => !togglableFields.includes(f2.id) && f2.type !== "media" && f2.enableHiding !== false |
| 10931 |
); |
| 10932 |
} |
| 10933 |
|
| 10934 |
// packages/dataviews/build-module/components/dataviews-layouts/table/column-header-menu.mjs |
| 10935 |
var import_jsx_runtime50 = __toESM(require_jsx_runtime(), 1); |
| 10936 |
var { Menu: Menu2 } = unlock2(import_components4.privateApis); |
| 10937 |
function WithMenuSeparators({ children }) { |
| 10938 |
return import_element21.Children.toArray(children).filter(Boolean).map((child, i2) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_element21.Fragment, { children: [ |
| 10939 |
i2 > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Separator, {}), |
| 10940 |
child |
| 10941 |
] }, i2)); |
| 10942 |
} |
| 10943 |
var _HeaderMenu = (0, import_element21.forwardRef)(function HeaderMenu({ |
| 10944 |
fieldId, |
| 10945 |
view, |
| 10946 |
fields, |
| 10947 |
onChangeView, |
| 10948 |
onHide, |
| 10949 |
setOpenedFilter, |
| 10950 |
canMove = true, |
| 10951 |
canInsertLeft = true, |
| 10952 |
canInsertRight = true |
| 10953 |
}, ref) { |
| 10954 |
const visibleFieldIds = view.fields ?? []; |
| 10955 |
const index2 = visibleFieldIds?.indexOf(fieldId); |
| 10956 |
const isSorted = view.sort?.field === fieldId; |
| 10957 |
let isHidable = false; |
| 10958 |
let isSortable = false; |
| 10959 |
let canAddFilter = false; |
| 10960 |
let operators = []; |
| 10961 |
const field = fields.find((f2) => f2.id === fieldId); |
| 10962 |
const { setIsShowingFilter } = (0, import_element21.useContext)(dataviews_context_default); |
| 10963 |
if (!field) { |
| 10964 |
return null; |
| 10965 |
} |
| 10966 |
isHidable = field.enableHiding !== false; |
| 10967 |
isSortable = field.enableSorting !== false; |
| 10968 |
const header = field.header; |
| 10969 |
operators = !!field.filterBy && field.filterBy?.operators || []; |
| 10970 |
canAddFilter = !view.filters?.some((_filter) => fieldId === _filter.field) && !!(field.hasElements || field.Edit) && field.filterBy !== false && !field.filterBy?.isPrimary; |
| 10971 |
if (!isSortable && !canMove && !isHidable && !canAddFilter) { |
| 10972 |
return header; |
| 10973 |
} |
| 10974 |
const hiddenFields = getHideableFields(view, fields).filter( |
| 10975 |
(f2) => !visibleFieldIds.includes(f2.id) |
| 10976 |
); |
| 10977 |
const canInsert = (canInsertLeft || canInsertRight) && !!hiddenFields.length; |
| 10978 |
const isRtl = (0, import_i18n12.isRTL)(); |
| 10979 |
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Menu2, { children: [ |
| 10980 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)( |
| 10981 |
Menu2.TriggerButton, |
| 10982 |
{ |
| 10983 |
render: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 10984 |
import_components4.Button, |
| 10985 |
{ |
| 10986 |
size: "compact", |
| 10987 |
className: "dataviews-view-table-header-button", |
| 10988 |
ref, |
| 10989 |
variant: "tertiary" |
| 10990 |
} |
| 10991 |
), |
| 10992 |
children: [ |
| 10993 |
header, |
| 10994 |
view.sort && isSorted && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { "aria-hidden": "true", children: sortArrows[view.sort.direction] }) |
| 10995 |
] |
| 10996 |
} |
| 10997 |
), |
| 10998 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Popover, { style: { minWidth: "240px" }, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(WithMenuSeparators, { children: [ |
| 10999 |
isSortable && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Group, { children: SORTING_DIRECTIONS.map( |
| 11000 |
(direction) => { |
| 11001 |
const isChecked = view.sort && isSorted && view.sort.direction === direction; |
| 11002 |
const value = `${fieldId}-${direction}`; |
| 11003 |
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11004 |
Menu2.RadioItem, |
| 11005 |
{ |
| 11006 |
name: "view-table-sorting", |
| 11007 |
value, |
| 11008 |
checked: isChecked, |
| 11009 |
onChange: () => { |
| 11010 |
onChangeView({ |
| 11011 |
...view, |
| 11012 |
sort: { |
| 11013 |
field: fieldId, |
| 11014 |
direction |
| 11015 |
}, |
| 11016 |
showLevels: false |
| 11017 |
}); |
| 11018 |
}, |
| 11019 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: sortLabels[direction] }) |
| 11020 |
}, |
| 11021 |
value |
| 11022 |
); |
| 11023 |
} |
| 11024 |
) }), |
| 11025 |
canAddFilter && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11026 |
Menu2.Item, |
| 11027 |
{ |
| 11028 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components4.Icon, { icon: funnel_default }), |
| 11029 |
onClick: () => { |
| 11030 |
setOpenedFilter(fieldId); |
| 11031 |
setIsShowingFilter(true); |
| 11032 |
onChangeView({ |
| 11033 |
...view, |
| 11034 |
page: 1, |
| 11035 |
filters: [ |
| 11036 |
...view.filters || [], |
| 11037 |
{ |
| 11038 |
field: fieldId, |
| 11039 |
value: void 0, |
| 11040 |
operator: operators[0] |
| 11041 |
} |
| 11042 |
] |
| 11043 |
}); |
| 11044 |
}, |
| 11045 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Add filter") }) |
| 11046 |
} |
| 11047 |
) }), |
| 11048 |
(canMove || isHidable || canInsert) && field && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Menu2.Group, { children: [ |
| 11049 |
canMove && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11050 |
Menu2.Item, |
| 11051 |
{ |
| 11052 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components4.Icon, { icon: arrow_left_default }), |
| 11053 |
disabled: isRtl ? index2 >= visibleFieldIds.length - 1 : index2 < 1, |
| 11054 |
onClick: () => { |
| 11055 |
const targetIndex = isRtl ? index2 + 1 : index2 - 1; |
| 11056 |
const newFields = [ |
| 11057 |
...visibleFieldIds |
| 11058 |
]; |
| 11059 |
newFields.splice(index2, 1); |
| 11060 |
newFields.splice( |
| 11061 |
targetIndex, |
| 11062 |
0, |
| 11063 |
fieldId |
| 11064 |
); |
| 11065 |
onChangeView({ |
| 11066 |
...view, |
| 11067 |
fields: newFields |
| 11068 |
}); |
| 11069 |
}, |
| 11070 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Move left") }) |
| 11071 |
} |
| 11072 |
), |
| 11073 |
canMove && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11074 |
Menu2.Item, |
| 11075 |
{ |
| 11076 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components4.Icon, { icon: arrow_right_default }), |
| 11077 |
disabled: isRtl ? index2 < 1 : index2 >= visibleFieldIds.length - 1, |
| 11078 |
onClick: () => { |
| 11079 |
const targetIndex = isRtl ? index2 - 1 : index2 + 1; |
| 11080 |
const newFields = [ |
| 11081 |
...visibleFieldIds |
| 11082 |
]; |
| 11083 |
newFields.splice(index2, 1); |
| 11084 |
newFields.splice( |
| 11085 |
targetIndex, |
| 11086 |
0, |
| 11087 |
fieldId |
| 11088 |
); |
| 11089 |
onChangeView({ |
| 11090 |
...view, |
| 11091 |
fields: newFields |
| 11092 |
}); |
| 11093 |
}, |
| 11094 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Move right") }) |
| 11095 |
} |
| 11096 |
), |
| 11097 |
canInsertLeft && !!hiddenFields.length && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Menu2, { children: [ |
| 11098 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.SubmenuTriggerItem, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Insert left") }) }), |
| 11099 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Popover, { children: hiddenFields.map((hiddenField) => { |
| 11100 |
const insertIndex = isRtl ? index2 + 1 : index2; |
| 11101 |
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11102 |
Menu2.Item, |
| 11103 |
{ |
| 11104 |
onClick: () => { |
| 11105 |
onChangeView({ |
| 11106 |
...view, |
| 11107 |
fields: [ |
| 11108 |
...visibleFieldIds.slice( |
| 11109 |
0, |
| 11110 |
insertIndex |
| 11111 |
), |
| 11112 |
hiddenField.id, |
| 11113 |
...visibleFieldIds.slice( |
| 11114 |
insertIndex |
| 11115 |
) |
| 11116 |
] |
| 11117 |
}); |
| 11118 |
}, |
| 11119 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: hiddenField.label }) |
| 11120 |
}, |
| 11121 |
hiddenField.id |
| 11122 |
); |
| 11123 |
}) }) |
| 11124 |
] }), |
| 11125 |
canInsertRight && !!hiddenFields.length && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Menu2, { children: [ |
| 11126 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.SubmenuTriggerItem, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Insert right") }) }), |
| 11127 |
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.Popover, { children: hiddenFields.map((hiddenField) => { |
| 11128 |
const insertIndex = isRtl ? index2 : index2 + 1; |
| 11129 |
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11130 |
Menu2.Item, |
| 11131 |
{ |
| 11132 |
onClick: () => { |
| 11133 |
onChangeView({ |
| 11134 |
...view, |
| 11135 |
fields: [ |
| 11136 |
...visibleFieldIds.slice( |
| 11137 |
0, |
| 11138 |
insertIndex |
| 11139 |
), |
| 11140 |
hiddenField.id, |
| 11141 |
...visibleFieldIds.slice( |
| 11142 |
insertIndex |
| 11143 |
) |
| 11144 |
] |
| 11145 |
}); |
| 11146 |
}, |
| 11147 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: hiddenField.label }) |
| 11148 |
}, |
| 11149 |
hiddenField.id |
| 11150 |
); |
| 11151 |
}) }) |
| 11152 |
] }), |
| 11153 |
isHidable && field && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)( |
| 11154 |
Menu2.Item, |
| 11155 |
{ |
| 11156 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components4.Icon, { icon: unseen_default }), |
| 11157 |
onClick: () => { |
| 11158 |
onHide(field); |
| 11159 |
onChangeView({ |
| 11160 |
...view, |
| 11161 |
fields: visibleFieldIds.filter( |
| 11162 |
(id) => id !== fieldId |
| 11163 |
) |
| 11164 |
}); |
| 11165 |
}, |
| 11166 |
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Menu2.ItemLabel, { children: (0, import_i18n12.__)("Hide column") }) |
| 11167 |
} |
| 11168 |
) |
| 11169 |
] }) |
| 11170 |
] }) }) |
| 11171 |
] }); |
| 11172 |
}); |
| 11173 |
var ColumnHeaderMenu = _HeaderMenu; |
| 11174 |
var column_header_menu_default = ColumnHeaderMenu; |
| 11175 |
|
| 11176 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/item-click-wrapper.mjs |
| 11177 |
var import_element22 = __toESM(require_element(), 1); |
| 11178 |
var import_jsx_runtime51 = __toESM(require_jsx_runtime(), 1); |
| 11179 |
function getClickableItemProps({ |
| 11180 |
item, |
| 11181 |
isItemClickable: isItemClickable2, |
| 11182 |
onClickItem, |
| 11183 |
className |
| 11184 |
}) { |
| 11185 |
if (!isItemClickable2(item) || !onClickItem) { |
| 11186 |
return { className }; |
| 11187 |
} |
| 11188 |
return { |
| 11189 |
className: className ? `${className} ${className}--clickable` : void 0, |
| 11190 |
role: "button", |
| 11191 |
tabIndex: 0, |
| 11192 |
onClick: (event) => { |
| 11193 |
event.stopPropagation(); |
| 11194 |
onClickItem(item); |
| 11195 |
}, |
| 11196 |
onKeyDown: (event) => { |
| 11197 |
if (event.key === "Enter" || event.key === "" || event.key === " ") { |
| 11198 |
event.stopPropagation(); |
| 11199 |
onClickItem(item); |
| 11200 |
} |
| 11201 |
} |
| 11202 |
}; |
| 11203 |
} |
| 11204 |
function ItemClickWrapper({ |
| 11205 |
item, |
| 11206 |
isItemClickable: isItemClickable2, |
| 11207 |
onClickItem, |
| 11208 |
renderItemLink, |
| 11209 |
className, |
| 11210 |
children, |
| 11211 |
...extraProps |
| 11212 |
}) { |
| 11213 |
if (!isItemClickable2(item)) { |
| 11214 |
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className, ...extraProps, children }); |
| 11215 |
} |
| 11216 |
if (renderItemLink) { |
| 11217 |
const renderedElement = renderItemLink({ |
| 11218 |
item, |
| 11219 |
className: `${className} ${className}--clickable`, |
| 11220 |
...extraProps, |
| 11221 |
children |
| 11222 |
}); |
| 11223 |
return (0, import_element22.cloneElement)(renderedElement, { |
| 11224 |
onClick: (event) => { |
| 11225 |
event.stopPropagation(); |
| 11226 |
if (renderedElement.props.onClick) { |
| 11227 |
renderedElement.props.onClick(event); |
| 11228 |
} |
| 11229 |
}, |
| 11230 |
onKeyDown: (event) => { |
| 11231 |
if (event.key === "Enter" || event.key === "" || event.key === " ") { |
| 11232 |
event.stopPropagation(); |
| 11233 |
if (renderedElement.props.onKeyDown) { |
| 11234 |
renderedElement.props.onKeyDown(event); |
| 11235 |
} |
| 11236 |
} |
| 11237 |
} |
| 11238 |
}); |
| 11239 |
} |
| 11240 |
const clickProps = getClickableItemProps({ |
| 11241 |
item, |
| 11242 |
isItemClickable: isItemClickable2, |
| 11243 |
onClickItem, |
| 11244 |
className |
| 11245 |
}); |
| 11246 |
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { ...clickProps, ...extraProps, children }); |
| 11247 |
} |
| 11248 |
|
| 11249 |
// packages/dataviews/build-module/components/dataviews-layouts/table/column-primary.mjs |
| 11250 |
var import_jsx_runtime52 = __toESM(require_jsx_runtime(), 1); |
| 11251 |
function ColumnPrimary({ |
| 11252 |
item, |
| 11253 |
level, |
| 11254 |
titleField, |
| 11255 |
mediaField, |
| 11256 |
descriptionField: descriptionField2, |
| 11257 |
onClickItem, |
| 11258 |
renderItemLink, |
| 11259 |
isItemClickable: isItemClickable2 |
| 11260 |
}) { |
| 11261 |
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Stack, { direction: "row", gap: "md", align: "flex-start", justify: "flex-start", children: [ |
| 11262 |
mediaField && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( |
| 11263 |
ItemClickWrapper, |
| 11264 |
{ |
| 11265 |
item, |
| 11266 |
isItemClickable: isItemClickable2, |
| 11267 |
onClickItem, |
| 11268 |
renderItemLink, |
| 11269 |
className: "dataviews-view-table__cell-content-wrapper dataviews-column-primary__media", |
| 11270 |
"aria-label": isItemClickable2(item) && (!!onClickItem || !!renderItemLink) && !!titleField ? titleField.getValue?.({ item }) : void 0, |
| 11271 |
children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( |
| 11272 |
mediaField.render, |
| 11273 |
{ |
| 11274 |
item, |
| 11275 |
field: mediaField, |
| 11276 |
config: { sizes: "32px" } |
| 11277 |
} |
| 11278 |
) |
| 11279 |
} |
| 11280 |
), |
| 11281 |
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( |
| 11282 |
Stack, |
| 11283 |
{ |
| 11284 |
direction: "column", |
| 11285 |
align: "flex-start", |
| 11286 |
className: "dataviews-view-table__primary-column-content", |
| 11287 |
children: [ |
| 11288 |
titleField && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)( |
| 11289 |
ItemClickWrapper, |
| 11290 |
{ |
| 11291 |
item, |
| 11292 |
isItemClickable: isItemClickable2, |
| 11293 |
onClickItem, |
| 11294 |
renderItemLink, |
| 11295 |
className: "dataviews-view-table__cell-content-wrapper dataviews-title-field", |
| 11296 |
children: [ |
| 11297 |
level !== void 0 && level > 0 && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { className: "dataviews-view-table__level", children: [ |
| 11298 |
Array(level).fill("\u2014").join(" "), |
| 11299 |
"\xA0" |
| 11300 |
] }), |
| 11301 |
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(titleField.render, { item, field: titleField }) |
| 11302 |
] |
| 11303 |
} |
| 11304 |
), |
| 11305 |
descriptionField2 && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)( |
| 11306 |
descriptionField2.render, |
| 11307 |
{ |
| 11308 |
item, |
| 11309 |
field: descriptionField2 |
| 11310 |
} |
| 11311 |
) |
| 11312 |
] |
| 11313 |
} |
| 11314 |
) |
| 11315 |
] }); |
| 11316 |
} |
| 11317 |
var column_primary_default = ColumnPrimary; |
| 11318 |
|
| 11319 |
// packages/dataviews/build-module/components/dataviews-layouts/table/use-scroll-state.mjs |
| 11320 |
var import_element23 = __toESM(require_element(), 1); |
| 11321 |
var import_i18n13 = __toESM(require_i18n(), 1); |
| 11322 |
var isScrolledToEnd = (element) => { |
| 11323 |
if ((0, import_i18n13.isRTL)()) { |
| 11324 |
const scrollLeft = Math.abs(element.scrollLeft); |
| 11325 |
return scrollLeft <= 1; |
| 11326 |
} |
| 11327 |
return element.scrollLeft + element.clientWidth >= element.scrollWidth - 1; |
| 11328 |
}; |
| 11329 |
function useScrollState({ |
| 11330 |
scrollContainerRef, |
| 11331 |
enabledHorizontal = false |
| 11332 |
}) { |
| 11333 |
const [isHorizontalScrollEnd, setIsHorizontalScrollEnd] = (0, import_element23.useState)(false); |
| 11334 |
const [isVerticallyScrolled, setIsVerticallyScrolled] = (0, import_element23.useState)(false); |
| 11335 |
const handleScroll = (0, import_element23.useCallback)(() => { |
| 11336 |
const scrollContainer = scrollContainerRef.current; |
| 11337 |
if (!scrollContainer) { |
| 11338 |
return; |
| 11339 |
} |
| 11340 |
if (enabledHorizontal) { |
| 11341 |
setIsHorizontalScrollEnd(isScrolledToEnd(scrollContainer)); |
| 11342 |
} |
| 11343 |
setIsVerticallyScrolled(scrollContainer.scrollTop > 0); |
| 11344 |
}, [scrollContainerRef, enabledHorizontal]); |
| 11345 |
(0, import_element23.useEffect)(() => { |
| 11346 |
if (typeof window === "undefined" || !scrollContainerRef.current) { |
| 11347 |
return () => { |
| 11348 |
}; |
| 11349 |
} |
| 11350 |
const scrollContainer = scrollContainerRef.current; |
| 11351 |
handleScroll(); |
| 11352 |
scrollContainer.addEventListener("scroll", handleScroll); |
| 11353 |
window.addEventListener("resize", handleScroll); |
| 11354 |
return () => { |
| 11355 |
scrollContainer.removeEventListener("scroll", handleScroll); |
| 11356 |
window.removeEventListener("resize", handleScroll); |
| 11357 |
}; |
| 11358 |
}, [scrollContainerRef, enabledHorizontal, handleScroll]); |
| 11359 |
return { isHorizontalScrollEnd, isVerticallyScrolled }; |
| 11360 |
} |
| 11361 |
|
| 11362 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/get-data-by-group.mjs |
| 11363 |
function getDataByGroup(data, groupByField) { |
| 11364 |
return data.reduce((groups, item) => { |
| 11365 |
const groupName = groupByField.getValue({ item }); |
| 11366 |
if (!groups.has(groupName)) { |
| 11367 |
groups.set(groupName, []); |
| 11368 |
} |
| 11369 |
groups.get(groupName)?.push(item); |
| 11370 |
return groups; |
| 11371 |
}, /* @__PURE__ */ new Map()); |
| 11372 |
} |
| 11373 |
|
| 11374 |
// packages/dataviews/build-module/components/dataviews-view-config/properties-section.mjs |
| 11375 |
var import_components5 = __toESM(require_components(), 1); |
| 11376 |
var import_i18n14 = __toESM(require_i18n(), 1); |
| 11377 |
var import_element24 = __toESM(require_element(), 1); |
| 11378 |
var import_jsx_runtime53 = __toESM(require_jsx_runtime(), 1); |
| 11379 |
function FieldItem({ |
| 11380 |
field, |
| 11381 |
isVisible: isVisible2, |
| 11382 |
onToggleVisibility |
| 11383 |
}) { |
| 11384 |
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_components5.__experimentalItem, { onClick: field.enableHiding ? onToggleVisibility : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Stack, { direction: "row", gap: "sm", justify: "flex-start", align: "center", children: [ |
| 11385 |
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { style: { height: 24, width: 24 }, children: isVisible2 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_components5.Icon, { icon: check_default }) }), |
| 11386 |
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "dataviews-view-config__label", children: field.label }) |
| 11387 |
] }) }); |
| 11388 |
} |
| 11389 |
function isDefined(item) { |
| 11390 |
return !!item; |
| 11391 |
} |
| 11392 |
function PropertiesSection({ |
| 11393 |
showLabel = true |
| 11394 |
}) { |
| 11395 |
const { view, fields, onChangeView } = (0, import_element24.useContext)(dataviews_context_default); |
| 11396 |
const regularFields = getHideableFields(view, fields); |
| 11397 |
if (!regularFields?.length) { |
| 11398 |
return null; |
| 11399 |
} |
| 11400 |
const titleField = fields.find((f2) => f2.id === view.titleField); |
| 11401 |
const previewField = fields.find((f2) => f2.id === view.mediaField); |
| 11402 |
const descriptionField2 = fields.find( |
| 11403 |
(f2) => f2.id === view.descriptionField |
| 11404 |
); |
| 11405 |
const lockedFields = [ |
| 11406 |
{ |
| 11407 |
field: titleField, |
| 11408 |
isVisibleFlag: "showTitle" |
| 11409 |
}, |
| 11410 |
{ |
| 11411 |
field: previewField, |
| 11412 |
isVisibleFlag: "showMedia" |
| 11413 |
}, |
| 11414 |
{ |
| 11415 |
field: descriptionField2, |
| 11416 |
isVisibleFlag: "showDescription" |
| 11417 |
} |
| 11418 |
].filter(({ field }) => isDefined(field)); |
| 11419 |
const visibleFieldIds = view.fields ?? []; |
| 11420 |
const visibleRegularFieldsCount = regularFields.filter( |
| 11421 |
(f2) => visibleFieldIds.includes(f2.id) |
| 11422 |
).length; |
| 11423 |
const visibleLockedFields = lockedFields.filter( |
| 11424 |
({ isVisibleFlag }) => ( |
| 11425 |
// @ts-expect-error |
| 11426 |
view[isVisibleFlag] ?? true |
| 11427 |
) |
| 11428 |
); |
| 11429 |
const totalVisibleFields = visibleLockedFields.length + visibleRegularFieldsCount; |
| 11430 |
const isSingleVisibleLockedField = totalVisibleFields === 1 && visibleLockedFields.length === 1; |
| 11431 |
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Stack, { direction: "column", className: "dataviews-field-control", children: [ |
| 11432 |
showLabel && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_components5.BaseControl.VisualLabel, { children: (0, import_i18n14.__)("Properties") }), |
| 11433 |
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)( |
| 11434 |
Stack, |
| 11435 |
{ |
| 11436 |
direction: "column", |
| 11437 |
className: "dataviews-view-config__properties", |
| 11438 |
children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_components5.__experimentalItemGroup, { isBordered: true, isSeparated: true, size: "medium", children: [ |
| 11439 |
lockedFields.map(({ field, isVisibleFlag }) => { |
| 11440 |
const isVisible2 = view[isVisibleFlag] ?? true; |
| 11441 |
const fieldToRender = isSingleVisibleLockedField && isVisible2 ? { ...field, enableHiding: false } : field; |
| 11442 |
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)( |
| 11443 |
FieldItem, |
| 11444 |
{ |
| 11445 |
field: fieldToRender, |
| 11446 |
isVisible: isVisible2, |
| 11447 |
onToggleVisibility: () => { |
| 11448 |
onChangeView({ |
| 11449 |
...view, |
| 11450 |
[isVisibleFlag]: !isVisible2 |
| 11451 |
}); |
| 11452 |
} |
| 11453 |
}, |
| 11454 |
field.id |
| 11455 |
); |
| 11456 |
}), |
| 11457 |
regularFields.map((field) => { |
| 11458 |
const isVisible2 = visibleFieldIds.includes(field.id); |
| 11459 |
const fieldToRender = totalVisibleFields === 1 && isVisible2 ? { ...field, enableHiding: false } : field; |
| 11460 |
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)( |
| 11461 |
FieldItem, |
| 11462 |
{ |
| 11463 |
field: fieldToRender, |
| 11464 |
isVisible: isVisible2, |
| 11465 |
onToggleVisibility: () => { |
| 11466 |
onChangeView({ |
| 11467 |
...view, |
| 11468 |
fields: isVisible2 ? visibleFieldIds.filter( |
| 11469 |
(fieldId) => fieldId !== field.id |
| 11470 |
) : [...visibleFieldIds, field.id] |
| 11471 |
}); |
| 11472 |
} |
| 11473 |
}, |
| 11474 |
field.id |
| 11475 |
); |
| 11476 |
}) |
| 11477 |
] }) |
| 11478 |
} |
| 11479 |
) |
| 11480 |
] }); |
| 11481 |
} |
| 11482 |
|
| 11483 |
// packages/dataviews/build-module/hooks/use-delayed-loading.mjs |
| 11484 |
var import_element25 = __toESM(require_element(), 1); |
| 11485 |
function useDelayedLoading(isLoading, options = { delay: 400 }) { |
| 11486 |
const [showLoader, setShowLoader] = (0, import_element25.useState)(false); |
| 11487 |
(0, import_element25.useEffect)(() => { |
| 11488 |
if (!isLoading) { |
| 11489 |
return; |
| 11490 |
} |
| 11491 |
const timeout = setTimeout(() => { |
| 11492 |
setShowLoader(true); |
| 11493 |
}, options.delay); |
| 11494 |
return () => { |
| 11495 |
clearTimeout(timeout); |
| 11496 |
setShowLoader(false); |
| 11497 |
}; |
| 11498 |
}, [isLoading, options.delay]); |
| 11499 |
return showLoader; |
| 11500 |
} |
| 11501 |
|
| 11502 |
// packages/dataviews/build-module/components/dataviews-layouts/table/index.mjs |
| 11503 |
var import_jsx_runtime54 = __toESM(require_jsx_runtime(), 1); |
| 11504 |
function getEffectiveAlign(explicitAlign, fieldType) { |
| 11505 |
if (explicitAlign) { |
| 11506 |
return explicitAlign; |
| 11507 |
} |
| 11508 |
if (fieldType === "integer" || fieldType === "number") { |
| 11509 |
return "end"; |
| 11510 |
} |
| 11511 |
return void 0; |
| 11512 |
} |
| 11513 |
function TableColumnField({ |
| 11514 |
item, |
| 11515 |
fields, |
| 11516 |
column, |
| 11517 |
align |
| 11518 |
}) { |
| 11519 |
const field = fields.find((f2) => f2.id === column); |
| 11520 |
if (!field) { |
| 11521 |
return null; |
| 11522 |
} |
| 11523 |
const className = clsx_default("dataviews-view-table__cell-content-wrapper", { |
| 11524 |
"dataviews-view-table__cell-align-end": align === "end", |
| 11525 |
"dataviews-view-table__cell-align-center": align === "center" |
| 11526 |
}); |
| 11527 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(field.render, { item, field }) }); |
| 11528 |
} |
| 11529 |
function TableRow({ |
| 11530 |
hasBulkActions, |
| 11531 |
item, |
| 11532 |
level, |
| 11533 |
actions, |
| 11534 |
fields, |
| 11535 |
id, |
| 11536 |
view, |
| 11537 |
titleField, |
| 11538 |
mediaField, |
| 11539 |
descriptionField: descriptionField2, |
| 11540 |
selection, |
| 11541 |
getItemId, |
| 11542 |
isItemClickable: isItemClickable2, |
| 11543 |
onClickItem, |
| 11544 |
renderItemLink, |
| 11545 |
onChangeSelection, |
| 11546 |
isActionsColumnSticky, |
| 11547 |
posinset |
| 11548 |
}) { |
| 11549 |
const { paginationInfo } = (0, import_element26.useContext)(dataviews_context_default); |
| 11550 |
const hasPossibleBulkAction = useHasAPossibleBulkAction(actions, item); |
| 11551 |
const isSelected2 = hasPossibleBulkAction && selection.includes(id); |
| 11552 |
const { |
| 11553 |
showTitle = true, |
| 11554 |
showMedia = true, |
| 11555 |
showDescription = true, |
| 11556 |
infiniteScrollEnabled |
| 11557 |
} = view; |
| 11558 |
const isTouchDeviceRef = (0, import_element26.useRef)(false); |
| 11559 |
const columns = view.fields ?? []; |
| 11560 |
const hasPrimaryColumn = titleField && showTitle || mediaField && showMedia || descriptionField2 && showDescription; |
| 11561 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)( |
| 11562 |
"tr", |
| 11563 |
{ |
| 11564 |
className: clsx_default("dataviews-view-table__row", { |
| 11565 |
"is-selected": hasPossibleBulkAction && isSelected2, |
| 11566 |
"has-bulk-actions": hasPossibleBulkAction |
| 11567 |
}), |
| 11568 |
onTouchStart: () => { |
| 11569 |
isTouchDeviceRef.current = true; |
| 11570 |
}, |
| 11571 |
"aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0, |
| 11572 |
"aria-posinset": posinset, |
| 11573 |
role: infiniteScrollEnabled ? "article" : void 0, |
| 11574 |
onMouseDown: (event) => { |
| 11575 |
const isMetaClick = (0, import_keycodes.isAppleOS)() ? event.metaKey : event.ctrlKey; |
| 11576 |
if (event.button === 0 && isMetaClick && window.navigator.userAgent.toLowerCase().includes("firefox")) { |
| 11577 |
event?.preventDefault(); |
| 11578 |
} |
| 11579 |
}, |
| 11580 |
onClick: (event) => { |
| 11581 |
if (!hasPossibleBulkAction) { |
| 11582 |
return; |
| 11583 |
} |
| 11584 |
const isModifierKeyPressed = (0, import_keycodes.isAppleOS)() ? event.metaKey : event.ctrlKey; |
| 11585 |
if (isModifierKeyPressed && !isTouchDeviceRef.current && document.getSelection()?.type !== "Range") { |
| 11586 |
onChangeSelection( |
| 11587 |
selection.includes(id) ? selection.filter((itemId) => id !== itemId) : [...selection, id] |
| 11588 |
); |
| 11589 |
} |
| 11590 |
}, |
| 11591 |
children: [ |
| 11592 |
hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("td", { className: "dataviews-view-table__checkbox-column", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-view-table__cell-content-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11593 |
DataViewsSelectionCheckbox, |
| 11594 |
{ |
| 11595 |
item, |
| 11596 |
selection, |
| 11597 |
onChangeSelection, |
| 11598 |
getItemId, |
| 11599 |
titleField, |
| 11600 |
disabled: !hasPossibleBulkAction |
| 11601 |
} |
| 11602 |
) }) }), |
| 11603 |
hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11604 |
column_primary_default, |
| 11605 |
{ |
| 11606 |
item, |
| 11607 |
level, |
| 11608 |
titleField: showTitle ? titleField : void 0, |
| 11609 |
mediaField: showMedia ? mediaField : void 0, |
| 11610 |
descriptionField: showDescription ? descriptionField2 : void 0, |
| 11611 |
isItemClickable: isItemClickable2, |
| 11612 |
onClickItem, |
| 11613 |
renderItemLink |
| 11614 |
} |
| 11615 |
) }), |
| 11616 |
columns.map((column) => { |
| 11617 |
const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; |
| 11618 |
const field = fields.find((f2) => f2.id === column); |
| 11619 |
const effectiveAlign = getEffectiveAlign(align, field?.type); |
| 11620 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11621 |
"td", |
| 11622 |
{ |
| 11623 |
style: { |
| 11624 |
width, |
| 11625 |
maxWidth, |
| 11626 |
minWidth |
| 11627 |
}, |
| 11628 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11629 |
TableColumnField, |
| 11630 |
{ |
| 11631 |
fields, |
| 11632 |
item, |
| 11633 |
column, |
| 11634 |
align: effectiveAlign |
| 11635 |
} |
| 11636 |
) |
| 11637 |
}, |
| 11638 |
column |
| 11639 |
); |
| 11640 |
}), |
| 11641 |
!!actions?.length && // Disable reason: we are not making the element interactive, |
| 11642 |
// but preventing any click events from bubbling up to the |
| 11643 |
// table row. This allows us to add a click handler to the row |
| 11644 |
// itself (to toggle row selection) without erroneously |
| 11645 |
// intercepting click events from ItemActions. |
| 11646 |
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11647 |
"td", |
| 11648 |
{ |
| 11649 |
className: clsx_default("dataviews-view-table__actions-column", { |
| 11650 |
"dataviews-view-table__actions-column--sticky": true, |
| 11651 |
"dataviews-view-table__actions-column--stuck": isActionsColumnSticky |
| 11652 |
}), |
| 11653 |
onClick: (e2) => e2.stopPropagation(), |
| 11654 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ItemActions, { item, actions }) |
| 11655 |
} |
| 11656 |
) |
| 11657 |
] |
| 11658 |
} |
| 11659 |
); |
| 11660 |
} |
| 11661 |
function ViewTable({ |
| 11662 |
actions, |
| 11663 |
data, |
| 11664 |
fields, |
| 11665 |
getItemId, |
| 11666 |
getItemLevel, |
| 11667 |
isLoading = false, |
| 11668 |
onChangeView, |
| 11669 |
onChangeSelection, |
| 11670 |
selection, |
| 11671 |
setOpenedFilter, |
| 11672 |
onClickItem, |
| 11673 |
isItemClickable: isItemClickable2, |
| 11674 |
renderItemLink, |
| 11675 |
view, |
| 11676 |
className, |
| 11677 |
empty |
| 11678 |
}) { |
| 11679 |
const { containerRef } = (0, import_element26.useContext)(dataviews_context_default); |
| 11680 |
const isDelayedLoading = useDelayedLoading(isLoading); |
| 11681 |
const headerMenuRefs = (0, import_element26.useRef)(/* @__PURE__ */ new Map()); |
| 11682 |
const headerMenuToFocusRef = (0, import_element26.useRef)(void 0); |
| 11683 |
const [nextHeaderMenuToFocus, setNextHeaderMenuToFocus] = (0, import_element26.useState)(); |
| 11684 |
const [contextMenuAnchor, setContextMenuAnchor] = (0, import_element26.useState)(null); |
| 11685 |
(0, import_element26.useEffect)(() => { |
| 11686 |
if (headerMenuToFocusRef.current) { |
| 11687 |
headerMenuToFocusRef.current.focus(); |
| 11688 |
headerMenuToFocusRef.current = void 0; |
| 11689 |
} |
| 11690 |
}); |
| 11691 |
const tableNoticeId = (0, import_element26.useId)(); |
| 11692 |
const { isHorizontalScrollEnd, isVerticallyScrolled } = useScrollState({ |
| 11693 |
scrollContainerRef: containerRef, |
| 11694 |
enabledHorizontal: !!actions?.length |
| 11695 |
}); |
| 11696 |
const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data); |
| 11697 |
if (nextHeaderMenuToFocus) { |
| 11698 |
headerMenuToFocusRef.current = nextHeaderMenuToFocus; |
| 11699 |
setNextHeaderMenuToFocus(void 0); |
| 11700 |
return; |
| 11701 |
} |
| 11702 |
const onHide = (field) => { |
| 11703 |
const hidden = headerMenuRefs.current.get(field.id); |
| 11704 |
const fallback = hidden ? headerMenuRefs.current.get(hidden.fallback) : void 0; |
| 11705 |
setNextHeaderMenuToFocus(fallback?.node); |
| 11706 |
}; |
| 11707 |
const handleHeaderContextMenu = (event) => { |
| 11708 |
event.preventDefault(); |
| 11709 |
event.stopPropagation(); |
| 11710 |
const virtualAnchor = { |
| 11711 |
getBoundingClientRect: () => ({ |
| 11712 |
x: event.clientX, |
| 11713 |
y: event.clientY, |
| 11714 |
top: event.clientY, |
| 11715 |
left: event.clientX, |
| 11716 |
right: event.clientX, |
| 11717 |
bottom: event.clientY, |
| 11718 |
width: 0, |
| 11719 |
height: 0, |
| 11720 |
toJSON: () => ({}) |
| 11721 |
}) |
| 11722 |
}; |
| 11723 |
window.requestAnimationFrame(() => { |
| 11724 |
setContextMenuAnchor(virtualAnchor); |
| 11725 |
}); |
| 11726 |
}; |
| 11727 |
const hasData = !!data?.length; |
| 11728 |
const titleField = fields.find((field) => field.id === view.titleField); |
| 11729 |
const mediaField = fields.find((field) => field.id === view.mediaField); |
| 11730 |
const descriptionField2 = fields.find( |
| 11731 |
(field) => field.id === view.descriptionField |
| 11732 |
); |
| 11733 |
const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; |
| 11734 |
const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; |
| 11735 |
const { showTitle = true, showMedia = true, showDescription = true } = view; |
| 11736 |
const hasPrimaryColumn = titleField && showTitle || mediaField && showMedia || descriptionField2 && showDescription; |
| 11737 |
const columns = view.fields ?? []; |
| 11738 |
const headerMenuRef = (column, index2) => (node) => { |
| 11739 |
if (node) { |
| 11740 |
headerMenuRefs.current.set(column, { |
| 11741 |
node, |
| 11742 |
fallback: columns[index2 > 0 ? index2 - 1 : 1] |
| 11743 |
}); |
| 11744 |
} else { |
| 11745 |
headerMenuRefs.current.delete(column); |
| 11746 |
} |
| 11747 |
}; |
| 11748 |
const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; |
| 11749 |
const isRtl = (0, import_i18n15.isRTL)(); |
| 11750 |
if (!hasData) { |
| 11751 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11752 |
"div", |
| 11753 |
{ |
| 11754 |
className: clsx_default("dataviews-no-results", { |
| 11755 |
"is-refreshing": isDelayedLoading |
| 11756 |
}), |
| 11757 |
id: tableNoticeId, |
| 11758 |
children: empty |
| 11759 |
} |
| 11760 |
); |
| 11761 |
} |
| 11762 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [ |
| 11763 |
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)( |
| 11764 |
"table", |
| 11765 |
{ |
| 11766 |
className: clsx_default("dataviews-view-table", className, { |
| 11767 |
[`has-${view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( |
| 11768 |
view.layout.density |
| 11769 |
), |
| 11770 |
"has-bulk-actions": hasBulkActions, |
| 11771 |
"is-refreshing": !isInfiniteScroll && isDelayedLoading |
| 11772 |
}), |
| 11773 |
"aria-busy": isLoading, |
| 11774 |
"aria-describedby": tableNoticeId, |
| 11775 |
role: isInfiniteScroll ? "feed" : void 0, |
| 11776 |
inert: !isInfiniteScroll && isLoading ? "true" : void 0, |
| 11777 |
children: [ |
| 11778 |
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("colgroup", { children: [ |
| 11779 |
hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("col", { className: "dataviews-view-table__col-checkbox" }), |
| 11780 |
hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("col", { className: "dataviews-view-table__col-first-data" }), |
| 11781 |
columns.map((column, index2) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11782 |
"col", |
| 11783 |
{ |
| 11784 |
className: clsx_default( |
| 11785 |
`dataviews-view-table__col-${column}`, |
| 11786 |
{ |
| 11787 |
"dataviews-view-table__col-expand": !hasPrimaryColumn && index2 === columns.length - 1 |
| 11788 |
} |
| 11789 |
) |
| 11790 |
}, |
| 11791 |
`col-${column}` |
| 11792 |
)), |
| 11793 |
!!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("col", { className: "dataviews-view-table__col-actions" }) |
| 11794 |
] }), |
| 11795 |
contextMenuAnchor && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11796 |
import_components6.Popover, |
| 11797 |
{ |
| 11798 |
anchor: contextMenuAnchor, |
| 11799 |
onClose: () => setContextMenuAnchor(null), |
| 11800 |
placement: "bottom-start", |
| 11801 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(PropertiesSection, { showLabel: false }) |
| 11802 |
} |
| 11803 |
), |
| 11804 |
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11805 |
"thead", |
| 11806 |
{ |
| 11807 |
className: clsx_default({ |
| 11808 |
"dataviews-view-table__thead--stuck": isVerticallyScrolled |
| 11809 |
}), |
| 11810 |
onContextMenu: handleHeaderContextMenu, |
| 11811 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("tr", { className: "dataviews-view-table__row", children: [ |
| 11812 |
hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11813 |
"th", |
| 11814 |
{ |
| 11815 |
className: "dataviews-view-table__checkbox-column", |
| 11816 |
scope: "col", |
| 11817 |
onContextMenu: handleHeaderContextMenu, |
| 11818 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11819 |
BulkSelectionCheckbox, |
| 11820 |
{ |
| 11821 |
selection, |
| 11822 |
onChangeSelection, |
| 11823 |
data, |
| 11824 |
actions, |
| 11825 |
getItemId |
| 11826 |
} |
| 11827 |
) |
| 11828 |
} |
| 11829 |
), |
| 11830 |
hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("th", { scope: "col", children: titleField && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11831 |
column_header_menu_default, |
| 11832 |
{ |
| 11833 |
ref: headerMenuRef( |
| 11834 |
titleField.id, |
| 11835 |
0 |
| 11836 |
), |
| 11837 |
fieldId: titleField.id, |
| 11838 |
view, |
| 11839 |
fields, |
| 11840 |
onChangeView, |
| 11841 |
onHide, |
| 11842 |
setOpenedFilter, |
| 11843 |
canMove: false, |
| 11844 |
canInsertLeft: isRtl ? view.layout?.enableMoving ?? true : false, |
| 11845 |
canInsertRight: isRtl ? false : view.layout?.enableMoving ?? true |
| 11846 |
} |
| 11847 |
) }), |
| 11848 |
columns.map((column, index2) => { |
| 11849 |
const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; |
| 11850 |
const field = fields.find( |
| 11851 |
(f2) => f2.id === column |
| 11852 |
); |
| 11853 |
const effectiveAlign = getEffectiveAlign( |
| 11854 |
align, |
| 11855 |
field?.type |
| 11856 |
); |
| 11857 |
const canInsertOrMove = view.layout?.enableMoving ?? true; |
| 11858 |
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11859 |
"th", |
| 11860 |
{ |
| 11861 |
style: { |
| 11862 |
width, |
| 11863 |
maxWidth, |
| 11864 |
minWidth, |
| 11865 |
textAlign: effectiveAlign |
| 11866 |
}, |
| 11867 |
"aria-sort": view.sort?.direction && view.sort?.field === column ? sortValues[view.sort.direction] : void 0, |
| 11868 |
scope: "col", |
| 11869 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11870 |
column_header_menu_default, |
| 11871 |
{ |
| 11872 |
ref: headerMenuRef(column, index2), |
| 11873 |
fieldId: column, |
| 11874 |
view, |
| 11875 |
fields, |
| 11876 |
onChangeView, |
| 11877 |
onHide, |
| 11878 |
setOpenedFilter, |
| 11879 |
canMove: canInsertOrMove, |
| 11880 |
canInsertLeft: canInsertOrMove, |
| 11881 |
canInsertRight: canInsertOrMove |
| 11882 |
} |
| 11883 |
) |
| 11884 |
}, |
| 11885 |
column |
| 11886 |
); |
| 11887 |
}), |
| 11888 |
!!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11889 |
"th", |
| 11890 |
{ |
| 11891 |
className: clsx_default( |
| 11892 |
"dataviews-view-table__actions-column", |
| 11893 |
{ |
| 11894 |
"dataviews-view-table__actions-column--sticky": true, |
| 11895 |
"dataviews-view-table__actions-column--stuck": !isHorizontalScrollEnd |
| 11896 |
} |
| 11897 |
), |
| 11898 |
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "dataviews-view-table-header", children: (0, import_i18n15.__)("Actions") }) |
| 11899 |
} |
| 11900 |
) |
| 11901 |
] }) |
| 11902 |
} |
| 11903 |
), |
| 11904 |
hasData && groupField && dataByGroup ? Array.from(dataByGroup.entries()).map( |
| 11905 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("tbody", { children: [ |
| 11906 |
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("tr", { className: "dataviews-view-table__group-header-row", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11907 |
"td", |
| 11908 |
{ |
| 11909 |
colSpan: columns.length + (hasPrimaryColumn ? 1 : 0) + (hasBulkActions ? 1 : 0) + (actions?.length ? 1 : 0), |
| 11910 |
className: "dataviews-view-table__group-header-cell", |
| 11911 |
children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n15.sprintf)( |
| 11912 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 11913 |
(0, import_i18n15.__)("%1$s: %2$s"), |
| 11914 |
groupField.label, |
| 11915 |
groupName |
| 11916 |
) |
| 11917 |
} |
| 11918 |
) }), |
| 11919 |
groupItems.map((item, index2) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11920 |
TableRow, |
| 11921 |
{ |
| 11922 |
item, |
| 11923 |
level: view.showLevels && typeof getItemLevel === "function" ? getItemLevel(item) : void 0, |
| 11924 |
hasBulkActions, |
| 11925 |
actions, |
| 11926 |
fields, |
| 11927 |
id: getItemId(item) || index2.toString(), |
| 11928 |
view, |
| 11929 |
titleField, |
| 11930 |
mediaField, |
| 11931 |
descriptionField: descriptionField2, |
| 11932 |
selection, |
| 11933 |
getItemId, |
| 11934 |
onChangeSelection, |
| 11935 |
onClickItem, |
| 11936 |
renderItemLink, |
| 11937 |
isItemClickable: isItemClickable2, |
| 11938 |
isActionsColumnSticky: !isHorizontalScrollEnd |
| 11939 |
}, |
| 11940 |
getItemId(item) |
| 11941 |
)) |
| 11942 |
] }, `group-${groupName}`) |
| 11943 |
) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("tbody", { children: hasData && data.map((item, index2) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)( |
| 11944 |
TableRow, |
| 11945 |
{ |
| 11946 |
item, |
| 11947 |
level: view.showLevels && typeof getItemLevel === "function" ? getItemLevel(item) : void 0, |
| 11948 |
hasBulkActions, |
| 11949 |
actions, |
| 11950 |
fields, |
| 11951 |
id: getItemId(item) || index2.toString(), |
| 11952 |
view, |
| 11953 |
titleField, |
| 11954 |
mediaField, |
| 11955 |
descriptionField: descriptionField2, |
| 11956 |
selection, |
| 11957 |
getItemId, |
| 11958 |
onChangeSelection, |
| 11959 |
onClickItem, |
| 11960 |
renderItemLink, |
| 11961 |
isItemClickable: isItemClickable2, |
| 11962 |
isActionsColumnSticky: !isHorizontalScrollEnd, |
| 11963 |
posinset: isInfiniteScroll ? index2 + 1 : void 0 |
| 11964 |
}, |
| 11965 |
getItemId(item) |
| 11966 |
)) }) |
| 11967 |
] |
| 11968 |
} |
| 11969 |
), |
| 11970 |
isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "dataviews-loading", id: tableNoticeId, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_components6.Spinner, {}) }) }) |
| 11971 |
] }); |
| 11972 |
} |
| 11973 |
var table_default = ViewTable; |
| 11974 |
|
| 11975 |
// packages/dataviews/build-module/components/dataviews-layouts/grid/index.mjs |
| 11976 |
var import_components9 = __toESM(require_components(), 1); |
| 11977 |
var import_i18n18 = __toESM(require_i18n(), 1); |
| 11978 |
|
| 11979 |
// packages/dataviews/build-module/components/dataviews-layouts/grid/composite-grid.mjs |
| 11980 |
var import_components8 = __toESM(require_components(), 1); |
| 11981 |
var import_i18n17 = __toESM(require_i18n(), 1); |
| 11982 |
var import_compose3 = __toESM(require_compose(), 1); |
| 11983 |
var import_keycodes2 = __toESM(require_keycodes(), 1); |
| 11984 |
var import_element30 = __toESM(require_element(), 1); |
| 11985 |
|
| 11986 |
// packages/dataviews/build-module/components/dataviews-layouts/grid/preview-size-picker.mjs |
| 11987 |
var import_components7 = __toESM(require_components(), 1); |
| 11988 |
var import_i18n16 = __toESM(require_i18n(), 1); |
| 11989 |
var import_element27 = __toESM(require_element(), 1); |
| 11990 |
var import_jsx_runtime55 = __toESM(require_jsx_runtime(), 1); |
| 11991 |
var imageSizes = [ |
| 11992 |
{ |
| 11993 |
value: 120, |
| 11994 |
breakpoint: 1 |
| 11995 |
}, |
| 11996 |
{ |
| 11997 |
value: 170, |
| 11998 |
breakpoint: 1 |
| 11999 |
}, |
| 12000 |
{ |
| 12001 |
value: 230, |
| 12002 |
breakpoint: 1 |
| 12003 |
}, |
| 12004 |
{ |
| 12005 |
value: 290, |
| 12006 |
breakpoint: 1112 |
| 12007 |
// at minimum image width, 4 images display at this container size |
| 12008 |
}, |
| 12009 |
{ |
| 12010 |
value: 350, |
| 12011 |
breakpoint: 1636 |
| 12012 |
// at minimum image width, 6 images display at this container size |
| 12013 |
}, |
| 12014 |
{ |
| 12015 |
value: 430, |
| 12016 |
breakpoint: 588 |
| 12017 |
// at minimum image width, 2 images display at this container size |
| 12018 |
} |
| 12019 |
]; |
| 12020 |
var DEFAULT_PREVIEW_SIZE = imageSizes[2].value; |
| 12021 |
function useGridColumns() { |
| 12022 |
const context = (0, import_element27.useContext)(dataviews_context_default); |
| 12023 |
const view = context.view; |
| 12024 |
return (0, import_element27.useMemo)(() => { |
| 12025 |
const containerWidth = context.containerWidth; |
| 12026 |
const gap = 32; |
| 12027 |
const previewSize = view.layout?.previewSize ?? DEFAULT_PREVIEW_SIZE; |
| 12028 |
const columns = Math.floor( |
| 12029 |
(containerWidth + gap) / (previewSize + gap) |
| 12030 |
); |
| 12031 |
return Math.max(1, columns); |
| 12032 |
}, [context.containerWidth, view.layout?.previewSize]); |
| 12033 |
} |
| 12034 |
|
| 12035 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/grid-items.mjs |
| 12036 |
var import_element28 = __toESM(require_element(), 1); |
| 12037 |
var import_jsx_runtime56 = __toESM(require_jsx_runtime(), 1); |
| 12038 |
var GridItems = (0, import_element28.forwardRef)(({ className, previewSize, ...props }, ref) => { |
| 12039 |
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)( |
| 12040 |
"div", |
| 12041 |
{ |
| 12042 |
ref, |
| 12043 |
className: clsx_default("dataviews-view-grid-items", className), |
| 12044 |
style: { |
| 12045 |
gridTemplateColumns: previewSize && `repeat(auto-fill, minmax(${previewSize}px, 1fr))` |
| 12046 |
}, |
| 12047 |
...props |
| 12048 |
} |
| 12049 |
); |
| 12050 |
}); |
| 12051 |
|
| 12052 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/use-infinite-scroll.mjs |
| 12053 |
var import_element29 = __toESM(require_element(), 1); |
| 12054 |
function useIntersectionObserver(elementRef, posinset) { |
| 12055 |
const { intersectionObserver } = (0, import_element29.useContext)(dataviews_context_default); |
| 12056 |
(0, import_element29.useEffect)(() => { |
| 12057 |
const element = elementRef.current; |
| 12058 |
if (!element || posinset === void 0 || !intersectionObserver) { |
| 12059 |
return; |
| 12060 |
} |
| 12061 |
intersectionObserver.observe(element); |
| 12062 |
return () => { |
| 12063 |
intersectionObserver.unobserve(element); |
| 12064 |
}; |
| 12065 |
}, [elementRef, intersectionObserver, posinset]); |
| 12066 |
} |
| 12067 |
function usePlaceholdersNeeded(data, isInfiniteScroll, gridColumns) { |
| 12068 |
const hasData = !!data?.length; |
| 12069 |
const firstItemPosition = hasData && isInfiniteScroll ? data[0].position : void 0; |
| 12070 |
return firstItemPosition && gridColumns ? (firstItemPosition - 1) % gridColumns : 0; |
| 12071 |
} |
| 12072 |
|
| 12073 |
// packages/dataviews/build-module/components/dataviews-layouts/grid/composite-grid.mjs |
| 12074 |
var import_jsx_runtime57 = __toESM(require_jsx_runtime(), 1); |
| 12075 |
var { Badge: WCBadge } = unlock2(import_components8.privateApis); |
| 12076 |
function chunk(array, size4) { |
| 12077 |
const chunks = []; |
| 12078 |
for (let i2 = 0, j2 = array.length; i2 < j2; i2 += size4) { |
| 12079 |
chunks.push(array.slice(i2, i2 + size4)); |
| 12080 |
} |
| 12081 |
return chunks; |
| 12082 |
} |
| 12083 |
var GridItem = (0, import_element30.forwardRef)( |
| 12084 |
function GridItem2({ |
| 12085 |
view, |
| 12086 |
selection, |
| 12087 |
onChangeSelection, |
| 12088 |
onClickItem, |
| 12089 |
isItemClickable: isItemClickable2, |
| 12090 |
renderItemLink, |
| 12091 |
getItemId, |
| 12092 |
item, |
| 12093 |
actions, |
| 12094 |
mediaField, |
| 12095 |
titleField, |
| 12096 |
descriptionField: descriptionField2, |
| 12097 |
regularFields, |
| 12098 |
badgeFields, |
| 12099 |
hasBulkActions, |
| 12100 |
config, |
| 12101 |
posinset, |
| 12102 |
setsize, |
| 12103 |
...props |
| 12104 |
}, forwardedRef) { |
| 12105 |
const { |
| 12106 |
showTitle = true, |
| 12107 |
showMedia = true, |
| 12108 |
showDescription = true |
| 12109 |
} = view; |
| 12110 |
const hasBulkAction = useHasAPossibleBulkAction(actions, item); |
| 12111 |
const id = getItemId(item); |
| 12112 |
const elementRef = (0, import_element30.useRef)(null); |
| 12113 |
const setRefs = (0, import_element30.useCallback)( |
| 12114 |
(node) => { |
| 12115 |
elementRef.current = node; |
| 12116 |
if (typeof forwardedRef === "function") { |
| 12117 |
forwardedRef(node); |
| 12118 |
} else if (forwardedRef) { |
| 12119 |
forwardedRef.current = node; |
| 12120 |
} |
| 12121 |
}, |
| 12122 |
[forwardedRef] |
| 12123 |
); |
| 12124 |
useIntersectionObserver(elementRef, posinset); |
| 12125 |
const instanceId = (0, import_compose3.useInstanceId)(GridItem2); |
| 12126 |
const isSelected2 = selection.includes(id); |
| 12127 |
const mediaPlaceholder = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "dataviews-view-grid__media-placeholder" }); |
| 12128 |
const rendersMediaField = showMedia && mediaField?.render; |
| 12129 |
const renderedMediaField = rendersMediaField ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12130 |
mediaField.render, |
| 12131 |
{ |
| 12132 |
item, |
| 12133 |
field: mediaField, |
| 12134 |
config |
| 12135 |
} |
| 12136 |
) : mediaPlaceholder; |
| 12137 |
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(titleField.render, { item, field: titleField }) : null; |
| 12138 |
let mediaA11yProps; |
| 12139 |
let titleA11yProps; |
| 12140 |
if (isItemClickable2(item) && onClickItem) { |
| 12141 |
if (renderedTitleField) { |
| 12142 |
mediaA11yProps = { |
| 12143 |
"aria-labelledby": `dataviews-view-grid__title-field-${instanceId}` |
| 12144 |
}; |
| 12145 |
titleA11yProps = { |
| 12146 |
id: `dataviews-view-grid__title-field-${instanceId}` |
| 12147 |
}; |
| 12148 |
} else { |
| 12149 |
mediaA11yProps = { |
| 12150 |
"aria-label": (0, import_i18n17.__)("Navigate to item") |
| 12151 |
}; |
| 12152 |
} |
| 12153 |
} |
| 12154 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)( |
| 12155 |
Stack, |
| 12156 |
{ |
| 12157 |
direction: "column", |
| 12158 |
...props, |
| 12159 |
ref: setRefs, |
| 12160 |
"aria-setsize": setsize, |
| 12161 |
"aria-posinset": posinset, |
| 12162 |
className: clsx_default( |
| 12163 |
props.className, |
| 12164 |
"dataviews-view-grid__row__gridcell", |
| 12165 |
"dataviews-view-grid__card", |
| 12166 |
{ |
| 12167 |
"is-selected": hasBulkAction && isSelected2 |
| 12168 |
} |
| 12169 |
), |
| 12170 |
onClickCapture: (event) => { |
| 12171 |
props.onClickCapture?.(event); |
| 12172 |
if ((0, import_keycodes2.isAppleOS)() ? event.metaKey : event.ctrlKey) { |
| 12173 |
event.stopPropagation(); |
| 12174 |
event.preventDefault(); |
| 12175 |
if (!hasBulkAction) { |
| 12176 |
return; |
| 12177 |
} |
| 12178 |
onChangeSelection( |
| 12179 |
isSelected2 ? selection.filter( |
| 12180 |
(itemId) => id !== itemId |
| 12181 |
) : [...selection, id] |
| 12182 |
); |
| 12183 |
} |
| 12184 |
}, |
| 12185 |
children: [ |
| 12186 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12187 |
ItemClickWrapper, |
| 12188 |
{ |
| 12189 |
item, |
| 12190 |
isItemClickable: isItemClickable2, |
| 12191 |
onClickItem, |
| 12192 |
renderItemLink, |
| 12193 |
className: clsx_default("dataviews-view-grid__media", { |
| 12194 |
"dataviews-view-grid__media--placeholder": !rendersMediaField |
| 12195 |
}), |
| 12196 |
...mediaA11yProps, |
| 12197 |
children: renderedMediaField |
| 12198 |
} |
| 12199 |
), |
| 12200 |
hasBulkActions && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12201 |
DataViewsSelectionCheckbox, |
| 12202 |
{ |
| 12203 |
item, |
| 12204 |
selection, |
| 12205 |
onChangeSelection, |
| 12206 |
getItemId, |
| 12207 |
titleField, |
| 12208 |
disabled: !hasBulkAction |
| 12209 |
} |
| 12210 |
), |
| 12211 |
!!actions?.length && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "dataviews-view-grid__media-actions", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12212 |
ItemActions, |
| 12213 |
{ |
| 12214 |
item, |
| 12215 |
actions, |
| 12216 |
isCompact: true |
| 12217 |
} |
| 12218 |
) }), |
| 12219 |
showTitle && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "dataviews-view-grid__title-actions", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12220 |
ItemClickWrapper, |
| 12221 |
{ |
| 12222 |
item, |
| 12223 |
isItemClickable: isItemClickable2, |
| 12224 |
onClickItem, |
| 12225 |
renderItemLink, |
| 12226 |
className: "dataviews-view-grid__title-field dataviews-title-field", |
| 12227 |
...titleA11yProps, |
| 12228 |
title: titleField?.getValueFormatted({ |
| 12229 |
item, |
| 12230 |
field: titleField |
| 12231 |
}) || void 0, |
| 12232 |
children: renderedTitleField |
| 12233 |
} |
| 12234 |
) }), |
| 12235 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(Stack, { direction: "column", gap: "xs", children: [ |
| 12236 |
showDescription && descriptionField2?.render && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12237 |
descriptionField2.render, |
| 12238 |
{ |
| 12239 |
item, |
| 12240 |
field: descriptionField2 |
| 12241 |
} |
| 12242 |
), |
| 12243 |
!!badgeFields?.length && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12244 |
Stack, |
| 12245 |
{ |
| 12246 |
direction: "row", |
| 12247 |
className: "dataviews-view-grid__badge-fields", |
| 12248 |
gap: "sm", |
| 12249 |
wrap: "wrap", |
| 12250 |
align: "top", |
| 12251 |
justify: "flex-start", |
| 12252 |
children: badgeFields.map((field) => { |
| 12253 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12254 |
WCBadge, |
| 12255 |
{ |
| 12256 |
className: "dataviews-view-grid__field-value", |
| 12257 |
children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12258 |
field.render, |
| 12259 |
{ |
| 12260 |
item, |
| 12261 |
field |
| 12262 |
} |
| 12263 |
) |
| 12264 |
}, |
| 12265 |
field.id |
| 12266 |
); |
| 12267 |
}) |
| 12268 |
} |
| 12269 |
), |
| 12270 |
!!regularFields?.length && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12271 |
Stack, |
| 12272 |
{ |
| 12273 |
direction: "column", |
| 12274 |
className: "dataviews-view-grid__fields", |
| 12275 |
gap: "xs", |
| 12276 |
children: regularFields.map((field) => { |
| 12277 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12278 |
import_components8.Flex, |
| 12279 |
{ |
| 12280 |
className: "dataviews-view-grid__field", |
| 12281 |
gap: 1, |
| 12282 |
justify: "flex-start", |
| 12283 |
expanded: true, |
| 12284 |
style: { height: "auto" }, |
| 12285 |
direction: "row", |
| 12286 |
children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [ |
| 12287 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(tooltip_exports.Root, { children: [ |
| 12288 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12289 |
tooltip_exports.Trigger, |
| 12290 |
{ |
| 12291 |
render: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_components8.FlexItem, { className: "dataviews-view-grid__field-name", children: field.header }) |
| 12292 |
} |
| 12293 |
), |
| 12294 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(tooltip_exports.Popup, { children: field.label }) |
| 12295 |
] }), |
| 12296 |
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12297 |
import_components8.FlexItem, |
| 12298 |
{ |
| 12299 |
className: "dataviews-view-grid__field-value", |
| 12300 |
style: { maxHeight: "none" }, |
| 12301 |
children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12302 |
field.render, |
| 12303 |
{ |
| 12304 |
item, |
| 12305 |
field |
| 12306 |
} |
| 12307 |
) |
| 12308 |
} |
| 12309 |
) |
| 12310 |
] }) |
| 12311 |
}, |
| 12312 |
field.id |
| 12313 |
); |
| 12314 |
}) |
| 12315 |
} |
| 12316 |
) |
| 12317 |
] }) |
| 12318 |
] |
| 12319 |
} |
| 12320 |
); |
| 12321 |
} |
| 12322 |
); |
| 12323 |
function CompositeGrid({ |
| 12324 |
data, |
| 12325 |
isInfiniteScroll, |
| 12326 |
className, |
| 12327 |
inert, |
| 12328 |
isLoading, |
| 12329 |
view, |
| 12330 |
fields, |
| 12331 |
selection, |
| 12332 |
onChangeSelection, |
| 12333 |
onClickItem, |
| 12334 |
isItemClickable: isItemClickable2, |
| 12335 |
renderItemLink, |
| 12336 |
getItemId, |
| 12337 |
actions |
| 12338 |
}) { |
| 12339 |
const { paginationInfo, resizeObserverRef } = (0, import_element30.useContext)(dataviews_context_default); |
| 12340 |
const gridColumns = useGridColumns(); |
| 12341 |
const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data); |
| 12342 |
const titleField = fields.find( |
| 12343 |
(field) => field.id === view?.titleField |
| 12344 |
); |
| 12345 |
const mediaField = fields.find( |
| 12346 |
(field) => field.id === view?.mediaField |
| 12347 |
); |
| 12348 |
const descriptionField2 = fields.find( |
| 12349 |
(field) => field.id === view?.descriptionField |
| 12350 |
); |
| 12351 |
const otherFields = view.fields ?? []; |
| 12352 |
const { regularFields, badgeFields } = otherFields.reduce( |
| 12353 |
(accumulator, fieldId) => { |
| 12354 |
const field = fields.find((f2) => f2.id === fieldId); |
| 12355 |
if (!field) { |
| 12356 |
return accumulator; |
| 12357 |
} |
| 12358 |
const key = view.layout?.badgeFields?.includes(fieldId) ? "badgeFields" : "regularFields"; |
| 12359 |
accumulator[key].push(field); |
| 12360 |
return accumulator; |
| 12361 |
}, |
| 12362 |
{ regularFields: [], badgeFields: [] } |
| 12363 |
); |
| 12364 |
const size4 = "900px"; |
| 12365 |
const totalRows = Math.ceil(data.length / gridColumns); |
| 12366 |
const placeholdersNeeded = usePlaceholdersNeeded( |
| 12367 |
data, |
| 12368 |
isInfiniteScroll, |
| 12369 |
gridColumns |
| 12370 |
); |
| 12371 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { |
| 12372 |
// Render infinite scroll layout (no rows, feed semantics) |
| 12373 |
children: [ |
| 12374 |
isInfiniteScroll && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)( |
| 12375 |
import_components8.Composite, |
| 12376 |
{ |
| 12377 |
render: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12378 |
GridItems, |
| 12379 |
{ |
| 12380 |
className: clsx_default( |
| 12381 |
"dataviews-view-grid-infinite-scroll", |
| 12382 |
className, |
| 12383 |
{ |
| 12384 |
[`has-${view.layout?.density}-density`]: view.layout?.density && [ |
| 12385 |
"compact", |
| 12386 |
"comfortable" |
| 12387 |
].includes(view.layout.density) |
| 12388 |
} |
| 12389 |
), |
| 12390 |
previewSize: view.layout?.previewSize, |
| 12391 |
"aria-busy": isLoading, |
| 12392 |
ref: resizeObserverRef |
| 12393 |
} |
| 12394 |
), |
| 12395 |
role: "feed", |
| 12396 |
focusWrap: true, |
| 12397 |
inert, |
| 12398 |
children: [ |
| 12399 |
Array.from({ length: placeholdersNeeded }).map( |
| 12400 |
(_, index2) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12401 |
import_components8.Composite.Item, |
| 12402 |
{ |
| 12403 |
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12404 |
Stack, |
| 12405 |
{ |
| 12406 |
...props, |
| 12407 |
direction: "column", |
| 12408 |
role: "article", |
| 12409 |
className: "dataviews-view-grid__row__gridcell dataviews-view-grid__card dataviews-view-grid__placeholder" |
| 12410 |
} |
| 12411 |
), |
| 12412 |
"aria-hidden": true, |
| 12413 |
tabIndex: -1 |
| 12414 |
}, |
| 12415 |
`placeholder-${index2}` |
| 12416 |
) |
| 12417 |
), |
| 12418 |
data.map((item) => { |
| 12419 |
const itemId = getItemId(item); |
| 12420 |
const stablePosition = item.position; |
| 12421 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12422 |
import_components8.Composite.Item, |
| 12423 |
{ |
| 12424 |
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12425 |
GridItem, |
| 12426 |
{ |
| 12427 |
...props, |
| 12428 |
id: itemId, |
| 12429 |
role: "article", |
| 12430 |
view, |
| 12431 |
selection, |
| 12432 |
onChangeSelection, |
| 12433 |
onClickItem, |
| 12434 |
isItemClickable: isItemClickable2, |
| 12435 |
renderItemLink, |
| 12436 |
getItemId, |
| 12437 |
item, |
| 12438 |
actions, |
| 12439 |
mediaField, |
| 12440 |
titleField, |
| 12441 |
descriptionField: descriptionField2, |
| 12442 |
regularFields, |
| 12443 |
badgeFields, |
| 12444 |
hasBulkActions, |
| 12445 |
posinset: stablePosition, |
| 12446 |
setsize: paginationInfo.totalItems, |
| 12447 |
config: { |
| 12448 |
sizes: size4 |
| 12449 |
} |
| 12450 |
} |
| 12451 |
) |
| 12452 |
}, |
| 12453 |
itemId |
| 12454 |
); |
| 12455 |
}) |
| 12456 |
] |
| 12457 |
} |
| 12458 |
), |
| 12459 |
// Render standard grid layout (with rows, grid semantics) |
| 12460 |
!isInfiniteScroll && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12461 |
import_components8.Composite, |
| 12462 |
{ |
| 12463 |
role: "grid", |
| 12464 |
className: clsx_default("dataviews-view-grid", className, { |
| 12465 |
[`has-${view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( |
| 12466 |
view.layout.density |
| 12467 |
) |
| 12468 |
}), |
| 12469 |
focusWrap: true, |
| 12470 |
"aria-busy": isLoading, |
| 12471 |
"aria-rowcount": totalRows, |
| 12472 |
ref: resizeObserverRef, |
| 12473 |
inert, |
| 12474 |
children: chunk(data, gridColumns).map((row, i2) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12475 |
import_components8.Composite.Row, |
| 12476 |
{ |
| 12477 |
render: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12478 |
"div", |
| 12479 |
{ |
| 12480 |
role: "row", |
| 12481 |
"aria-rowindex": i2 + 1, |
| 12482 |
"aria-label": (0, import_i18n17.sprintf)( |
| 12483 |
/* translators: %d: The row number in the grid */ |
| 12484 |
(0, import_i18n17.__)("Row %d"), |
| 12485 |
i2 + 1 |
| 12486 |
), |
| 12487 |
className: "dataviews-view-grid__row", |
| 12488 |
style: { |
| 12489 |
gridTemplateColumns: `repeat( ${gridColumns}, minmax(0, 1fr) )` |
| 12490 |
} |
| 12491 |
} |
| 12492 |
), |
| 12493 |
children: row.map((item) => { |
| 12494 |
const itemId = getItemId(item); |
| 12495 |
return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12496 |
import_components8.Composite.Item, |
| 12497 |
{ |
| 12498 |
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)( |
| 12499 |
GridItem, |
| 12500 |
{ |
| 12501 |
...props, |
| 12502 |
id: itemId, |
| 12503 |
role: "gridcell", |
| 12504 |
view, |
| 12505 |
selection, |
| 12506 |
onChangeSelection, |
| 12507 |
onClickItem, |
| 12508 |
isItemClickable: isItemClickable2, |
| 12509 |
renderItemLink, |
| 12510 |
getItemId, |
| 12511 |
item, |
| 12512 |
actions, |
| 12513 |
mediaField, |
| 12514 |
titleField, |
| 12515 |
descriptionField: descriptionField2, |
| 12516 |
regularFields, |
| 12517 |
badgeFields, |
| 12518 |
hasBulkActions, |
| 12519 |
config: { |
| 12520 |
sizes: size4 |
| 12521 |
} |
| 12522 |
} |
| 12523 |
) |
| 12524 |
}, |
| 12525 |
itemId |
| 12526 |
); |
| 12527 |
}) |
| 12528 |
}, |
| 12529 |
i2 |
| 12530 |
)) |
| 12531 |
} |
| 12532 |
) |
| 12533 |
] |
| 12534 |
}); |
| 12535 |
} |
| 12536 |
|
| 12537 |
// packages/dataviews/build-module/components/dataviews-layouts/grid/index.mjs |
| 12538 |
var import_jsx_runtime58 = __toESM(require_jsx_runtime(), 1); |
| 12539 |
function ViewGrid({ |
| 12540 |
actions, |
| 12541 |
data, |
| 12542 |
fields, |
| 12543 |
getItemId, |
| 12544 |
isLoading, |
| 12545 |
onChangeSelection, |
| 12546 |
onClickItem, |
| 12547 |
isItemClickable: isItemClickable2, |
| 12548 |
renderItemLink, |
| 12549 |
selection, |
| 12550 |
view, |
| 12551 |
className, |
| 12552 |
empty |
| 12553 |
}) { |
| 12554 |
const isDelayedLoading = useDelayedLoading(!!isLoading); |
| 12555 |
const hasData = !!data?.length; |
| 12556 |
const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; |
| 12557 |
const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; |
| 12558 |
const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; |
| 12559 |
if (!hasData) { |
| 12560 |
return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( |
| 12561 |
"div", |
| 12562 |
{ |
| 12563 |
className: clsx_default("dataviews-no-results", { |
| 12564 |
"is-refreshing": isDelayedLoading |
| 12565 |
}), |
| 12566 |
children: empty |
| 12567 |
} |
| 12568 |
); |
| 12569 |
} |
| 12570 |
const gridProps = { |
| 12571 |
className: clsx_default(className, { |
| 12572 |
"is-refreshing": !isInfiniteScroll && isDelayedLoading |
| 12573 |
}), |
| 12574 |
inert: !isInfiniteScroll && !!isLoading ? "true" : void 0, |
| 12575 |
isLoading, |
| 12576 |
view, |
| 12577 |
fields, |
| 12578 |
selection, |
| 12579 |
onChangeSelection, |
| 12580 |
onClickItem, |
| 12581 |
isItemClickable: isItemClickable2, |
| 12582 |
renderItemLink, |
| 12583 |
getItemId, |
| 12584 |
actions |
| 12585 |
}; |
| 12586 |
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_jsx_runtime58.Fragment, { |
| 12587 |
// Render multiple groups. |
| 12588 |
children: [ |
| 12589 |
hasData && groupField && dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Stack, { direction: "column", gap: "lg", children: Array.from(dataByGroup.entries()).map( |
| 12590 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)( |
| 12591 |
Stack, |
| 12592 |
{ |
| 12593 |
direction: "column", |
| 12594 |
gap: "sm", |
| 12595 |
children: [ |
| 12596 |
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("h3", { className: "dataviews-view-grid__group-header", children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n18.sprintf)( |
| 12597 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 12598 |
(0, import_i18n18.__)("%1$s: %2$s"), |
| 12599 |
groupField.label, |
| 12600 |
groupName |
| 12601 |
) }), |
| 12602 |
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)( |
| 12603 |
CompositeGrid, |
| 12604 |
{ |
| 12605 |
...gridProps, |
| 12606 |
data: groupItems, |
| 12607 |
isInfiniteScroll: false |
| 12608 |
} |
| 12609 |
) |
| 12610 |
] |
| 12611 |
}, |
| 12612 |
groupName |
| 12613 |
) |
| 12614 |
) }), |
| 12615 |
// Render a single grid with all data. |
| 12616 |
!dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)( |
| 12617 |
CompositeGrid, |
| 12618 |
{ |
| 12619 |
...gridProps, |
| 12620 |
data, |
| 12621 |
isInfiniteScroll: !!isInfiniteScroll |
| 12622 |
} |
| 12623 |
), |
| 12624 |
isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components9.Spinner, {}) }) |
| 12625 |
] |
| 12626 |
}); |
| 12627 |
} |
| 12628 |
var grid_default = ViewGrid; |
| 12629 |
|
| 12630 |
// packages/dataviews/build-module/components/dataviews-layouts/list/index.mjs |
| 12631 |
var import_compose4 = __toESM(require_compose(), 1); |
| 12632 |
var import_components10 = __toESM(require_components(), 1); |
| 12633 |
var import_element31 = __toESM(require_element(), 1); |
| 12634 |
var import_i18n19 = __toESM(require_i18n(), 1); |
| 12635 |
var import_data3 = __toESM(require_data(), 1); |
| 12636 |
var import_jsx_runtime59 = __toESM(require_jsx_runtime(), 1); |
| 12637 |
var { Menu: Menu3 } = unlock2(import_components10.privateApis); |
| 12638 |
function generateItemWrapperCompositeId(idPrefix) { |
| 12639 |
return `${idPrefix}-item-wrapper`; |
| 12640 |
} |
| 12641 |
function generatePrimaryActionCompositeId(idPrefix, primaryActionId) { |
| 12642 |
return `${idPrefix}-primary-action-${primaryActionId}`; |
| 12643 |
} |
| 12644 |
function generateDropdownTriggerCompositeId(idPrefix) { |
| 12645 |
return `${idPrefix}-dropdown`; |
| 12646 |
} |
| 12647 |
function PrimaryActionGridCell({ |
| 12648 |
idPrefix, |
| 12649 |
primaryAction, |
| 12650 |
item |
| 12651 |
}) { |
| 12652 |
const registry = (0, import_data3.useRegistry)(); |
| 12653 |
const [isModalOpen, setIsModalOpen] = (0, import_element31.useState)(false); |
| 12654 |
const compositeItemId = generatePrimaryActionCompositeId( |
| 12655 |
idPrefix, |
| 12656 |
primaryAction.id |
| 12657 |
); |
| 12658 |
const label = typeof primaryAction.label === "string" ? primaryAction.label : primaryAction.label([item]); |
| 12659 |
return "RenderModal" in primaryAction ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12660 |
import_components10.Composite.Item, |
| 12661 |
{ |
| 12662 |
id: compositeItemId, |
| 12663 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12664 |
import_components10.Button, |
| 12665 |
{ |
| 12666 |
disabled: !!primaryAction.disabled, |
| 12667 |
accessibleWhenDisabled: true, |
| 12668 |
text: label, |
| 12669 |
size: "small", |
| 12670 |
onClick: () => setIsModalOpen(true) |
| 12671 |
} |
| 12672 |
), |
| 12673 |
children: isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12674 |
ActionModal, |
| 12675 |
{ |
| 12676 |
action: primaryAction, |
| 12677 |
items: [item], |
| 12678 |
closeModal: () => setIsModalOpen(false) |
| 12679 |
} |
| 12680 |
) |
| 12681 |
} |
| 12682 |
) }, primaryAction.id) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12683 |
import_components10.Composite.Item, |
| 12684 |
{ |
| 12685 |
id: compositeItemId, |
| 12686 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12687 |
import_components10.Button, |
| 12688 |
{ |
| 12689 |
disabled: !!primaryAction.disabled, |
| 12690 |
accessibleWhenDisabled: true, |
| 12691 |
size: "small", |
| 12692 |
onClick: () => { |
| 12693 |
primaryAction.callback([item], { registry }); |
| 12694 |
}, |
| 12695 |
children: label |
| 12696 |
} |
| 12697 |
) |
| 12698 |
} |
| 12699 |
) }, primaryAction.id); |
| 12700 |
} |
| 12701 |
function ListItem({ |
| 12702 |
view, |
| 12703 |
actions, |
| 12704 |
idPrefix, |
| 12705 |
isSelected: isSelected2, |
| 12706 |
item, |
| 12707 |
titleField, |
| 12708 |
mediaField, |
| 12709 |
descriptionField: descriptionField2, |
| 12710 |
onSelect, |
| 12711 |
otherFields, |
| 12712 |
onDropdownTriggerKeyDown, |
| 12713 |
posinset |
| 12714 |
}) { |
| 12715 |
const { |
| 12716 |
showTitle = true, |
| 12717 |
showMedia = true, |
| 12718 |
showDescription = true, |
| 12719 |
infiniteScrollEnabled |
| 12720 |
} = view; |
| 12721 |
const itemRef = (0, import_element31.useRef)(null); |
| 12722 |
const labelId = `${idPrefix}-label`; |
| 12723 |
const descriptionId = `${idPrefix}-description`; |
| 12724 |
const registry = (0, import_data3.useRegistry)(); |
| 12725 |
const [isHovered, setIsHovered] = (0, import_element31.useState)(false); |
| 12726 |
const [activeModalAction, setActiveModalAction] = (0, import_element31.useState)( |
| 12727 |
null |
| 12728 |
); |
| 12729 |
const handleHover = ({ type }) => { |
| 12730 |
const isHover = type === "mouseenter"; |
| 12731 |
setIsHovered(isHover); |
| 12732 |
}; |
| 12733 |
const { paginationInfo } = (0, import_element31.useContext)(dataviews_context_default); |
| 12734 |
(0, import_element31.useEffect)(() => { |
| 12735 |
if (isSelected2) { |
| 12736 |
itemRef.current?.scrollIntoView({ |
| 12737 |
behavior: "auto", |
| 12738 |
block: "nearest", |
| 12739 |
inline: "nearest" |
| 12740 |
}); |
| 12741 |
} |
| 12742 |
}, [isSelected2]); |
| 12743 |
const { primaryAction, eligibleActions } = (0, import_element31.useMemo)(() => { |
| 12744 |
const _eligibleActions = actions.filter( |
| 12745 |
(action) => !action.isEligible || action.isEligible(item) |
| 12746 |
); |
| 12747 |
const _primaryActions = _eligibleActions.filter( |
| 12748 |
(action) => action.isPrimary |
| 12749 |
); |
| 12750 |
return { |
| 12751 |
primaryAction: _primaryActions[0], |
| 12752 |
eligibleActions: _eligibleActions |
| 12753 |
}; |
| 12754 |
}, [actions, item]); |
| 12755 |
const hasOnlyOnePrimaryAction = primaryAction && actions.length === 1; |
| 12756 |
const renderedMediaField = showMedia && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "dataviews-view-list__media-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12757 |
mediaField.render, |
| 12758 |
{ |
| 12759 |
item, |
| 12760 |
field: mediaField, |
| 12761 |
config: { sizes: "52px" } |
| 12762 |
} |
| 12763 |
) }) : null; |
| 12764 |
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(titleField.render, { item, field: titleField }) : null; |
| 12765 |
const renderDescription = showDescription && descriptionField2?.render; |
| 12766 |
const hasOnlyMediaAndTitle = !!renderedMediaField && !renderDescription && !otherFields.length; |
| 12767 |
const usedActions = eligibleActions?.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 12768 |
Stack, |
| 12769 |
{ |
| 12770 |
direction: "row", |
| 12771 |
gap: "md", |
| 12772 |
className: "dataviews-view-list__item-actions", |
| 12773 |
children: [ |
| 12774 |
primaryAction && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12775 |
PrimaryActionGridCell, |
| 12776 |
{ |
| 12777 |
idPrefix, |
| 12778 |
primaryAction, |
| 12779 |
item |
| 12780 |
} |
| 12781 |
), |
| 12782 |
!hasOnlyOnePrimaryAction && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { role: "gridcell", children: [ |
| 12783 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(Menu3, { placement: "bottom-end", children: [ |
| 12784 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12785 |
Menu3.TriggerButton, |
| 12786 |
{ |
| 12787 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12788 |
import_components10.Composite.Item, |
| 12789 |
{ |
| 12790 |
id: generateDropdownTriggerCompositeId( |
| 12791 |
idPrefix |
| 12792 |
), |
| 12793 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12794 |
import_components10.Button, |
| 12795 |
{ |
| 12796 |
size: "small", |
| 12797 |
icon: more_vertical_default, |
| 12798 |
label: (0, import_i18n19.__)("Actions"), |
| 12799 |
accessibleWhenDisabled: true, |
| 12800 |
disabled: !actions.length, |
| 12801 |
onKeyDown: onDropdownTriggerKeyDown |
| 12802 |
} |
| 12803 |
) |
| 12804 |
} |
| 12805 |
) |
| 12806 |
} |
| 12807 |
), |
| 12808 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Menu3.Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12809 |
ActionsMenuGroup, |
| 12810 |
{ |
| 12811 |
actions: eligibleActions, |
| 12812 |
item, |
| 12813 |
registry, |
| 12814 |
setActiveModalAction |
| 12815 |
} |
| 12816 |
) }) |
| 12817 |
] }), |
| 12818 |
!!activeModalAction && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12819 |
ActionModal, |
| 12820 |
{ |
| 12821 |
action: activeModalAction, |
| 12822 |
items: [item], |
| 12823 |
closeModal: () => setActiveModalAction(null) |
| 12824 |
} |
| 12825 |
) |
| 12826 |
] }) |
| 12827 |
] |
| 12828 |
} |
| 12829 |
); |
| 12830 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12831 |
import_components10.Composite.Row, |
| 12832 |
{ |
| 12833 |
ref: itemRef, |
| 12834 |
render: ( |
| 12835 |
/* aria-posinset breaks Composite.Row if passed to it directly. */ |
| 12836 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12837 |
"div", |
| 12838 |
{ |
| 12839 |
"aria-posinset": posinset, |
| 12840 |
"aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0 |
| 12841 |
} |
| 12842 |
) |
| 12843 |
), |
| 12844 |
role: infiniteScrollEnabled ? "article" : "row", |
| 12845 |
className: clsx_default({ |
| 12846 |
"is-selected": isSelected2, |
| 12847 |
"is-hovered": isHovered |
| 12848 |
}), |
| 12849 |
onMouseEnter: handleHover, |
| 12850 |
onMouseLeave: handleHover, |
| 12851 |
children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 12852 |
Stack, |
| 12853 |
{ |
| 12854 |
direction: "row", |
| 12855 |
className: "dataviews-view-list__item-wrapper", |
| 12856 |
children: [ |
| 12857 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { role: "gridcell", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12858 |
import_components10.Composite.Item, |
| 12859 |
{ |
| 12860 |
id: generateItemWrapperCompositeId(idPrefix), |
| 12861 |
"aria-pressed": isSelected2, |
| 12862 |
"aria-labelledby": labelId, |
| 12863 |
"aria-describedby": descriptionId, |
| 12864 |
className: "dataviews-view-list__item", |
| 12865 |
onClick: () => onSelect(item) |
| 12866 |
} |
| 12867 |
) }), |
| 12868 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 12869 |
Stack, |
| 12870 |
{ |
| 12871 |
direction: "row", |
| 12872 |
gap: "md", |
| 12873 |
justify: "start", |
| 12874 |
align: hasOnlyMediaAndTitle ? "center" : "flex-start", |
| 12875 |
style: { flex: 1, minWidth: 0 }, |
| 12876 |
children: [ |
| 12877 |
renderedMediaField, |
| 12878 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 12879 |
Stack, |
| 12880 |
{ |
| 12881 |
direction: "column", |
| 12882 |
gap: "xs", |
| 12883 |
className: "dataviews-view-list__field-wrapper", |
| 12884 |
children: [ |
| 12885 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(Stack, { direction: "row", align: "center", children: [ |
| 12886 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12887 |
"div", |
| 12888 |
{ |
| 12889 |
className: "dataviews-title-field dataviews-view-list__title-field", |
| 12890 |
id: labelId, |
| 12891 |
children: renderedTitleField |
| 12892 |
} |
| 12893 |
), |
| 12894 |
usedActions |
| 12895 |
] }), |
| 12896 |
renderDescription && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "dataviews-view-list__field", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12897 |
descriptionField2.render, |
| 12898 |
{ |
| 12899 |
item, |
| 12900 |
field: descriptionField2 |
| 12901 |
} |
| 12902 |
) }), |
| 12903 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12904 |
"div", |
| 12905 |
{ |
| 12906 |
className: "dataviews-view-list__fields", |
| 12907 |
id: descriptionId, |
| 12908 |
children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 12909 |
"div", |
| 12910 |
{ |
| 12911 |
className: "dataviews-view-list__field", |
| 12912 |
children: [ |
| 12913 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12914 |
VisuallyHidden, |
| 12915 |
{ |
| 12916 |
className: "dataviews-view-list__field-label", |
| 12917 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", {}), |
| 12918 |
children: field.label |
| 12919 |
} |
| 12920 |
), |
| 12921 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "dataviews-view-list__field-value", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 12922 |
field.render, |
| 12923 |
{ |
| 12924 |
item, |
| 12925 |
field |
| 12926 |
} |
| 12927 |
) }) |
| 12928 |
] |
| 12929 |
}, |
| 12930 |
field.id |
| 12931 |
)) |
| 12932 |
} |
| 12933 |
) |
| 12934 |
] |
| 12935 |
} |
| 12936 |
) |
| 12937 |
] |
| 12938 |
} |
| 12939 |
) |
| 12940 |
] |
| 12941 |
} |
| 12942 |
) |
| 12943 |
} |
| 12944 |
); |
| 12945 |
} |
| 12946 |
function isDefined2(item) { |
| 12947 |
return !!item; |
| 12948 |
} |
| 12949 |
function ViewList(props) { |
| 12950 |
const { |
| 12951 |
actions, |
| 12952 |
data, |
| 12953 |
fields, |
| 12954 |
getItemId, |
| 12955 |
isLoading, |
| 12956 |
onChangeSelection, |
| 12957 |
selection, |
| 12958 |
view, |
| 12959 |
className, |
| 12960 |
empty |
| 12961 |
} = props; |
| 12962 |
const baseId = (0, import_compose4.useInstanceId)(ViewList, "view-list"); |
| 12963 |
const isDelayedLoading = useDelayedLoading(!!isLoading); |
| 12964 |
const selectedItem = data?.findLast( |
| 12965 |
(item) => selection.includes(getItemId(item)) |
| 12966 |
); |
| 12967 |
const titleField = fields.find((field) => field.id === view.titleField); |
| 12968 |
const mediaField = fields.find((field) => field.id === view.mediaField); |
| 12969 |
const descriptionField2 = fields.find( |
| 12970 |
(field) => field.id === view.descriptionField |
| 12971 |
); |
| 12972 |
const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f2) => fieldId === f2.id)).filter(isDefined2); |
| 12973 |
const onSelect = (item) => onChangeSelection([getItemId(item)]); |
| 12974 |
const generateCompositeItemIdPrefix = (0, import_element31.useCallback)( |
| 12975 |
(item) => `${baseId}-${getItemId(item)}`, |
| 12976 |
[baseId, getItemId] |
| 12977 |
); |
| 12978 |
const isActiveCompositeItem = (0, import_element31.useCallback)( |
| 12979 |
(item, idToCheck) => { |
| 12980 |
return idToCheck.startsWith( |
| 12981 |
generateCompositeItemIdPrefix(item) |
| 12982 |
); |
| 12983 |
}, |
| 12984 |
[generateCompositeItemIdPrefix] |
| 12985 |
); |
| 12986 |
const [activeCompositeId, setActiveCompositeId] = (0, import_element31.useState)(void 0); |
| 12987 |
const compositeRef = (0, import_element31.useRef)(null); |
| 12988 |
(0, import_element31.useEffect)(() => { |
| 12989 |
if (selectedItem) { |
| 12990 |
setActiveCompositeId( |
| 12991 |
generateItemWrapperCompositeId( |
| 12992 |
generateCompositeItemIdPrefix(selectedItem) |
| 12993 |
) |
| 12994 |
); |
| 12995 |
} |
| 12996 |
}, [selectedItem, generateCompositeItemIdPrefix]); |
| 12997 |
const activeItemIndex = data.findIndex( |
| 12998 |
(item) => isActiveCompositeItem(item, activeCompositeId ?? "") |
| 12999 |
); |
| 13000 |
const previousActiveItemIndex = (0, import_compose4.usePrevious)(activeItemIndex); |
| 13001 |
const isActiveIdInList = activeItemIndex !== -1; |
| 13002 |
const selectCompositeItem = (0, import_element31.useCallback)( |
| 13003 |
(targetIndex, generateCompositeId) => { |
| 13004 |
const clampedIndex = Math.min( |
| 13005 |
data.length - 1, |
| 13006 |
Math.max(0, targetIndex) |
| 13007 |
); |
| 13008 |
if (!data[clampedIndex]) { |
| 13009 |
return; |
| 13010 |
} |
| 13011 |
const itemIdPrefix = generateCompositeItemIdPrefix( |
| 13012 |
data[clampedIndex] |
| 13013 |
); |
| 13014 |
const targetCompositeItemId = generateCompositeId(itemIdPrefix); |
| 13015 |
setActiveCompositeId(targetCompositeItemId); |
| 13016 |
if (compositeRef.current?.contains( |
| 13017 |
compositeRef.current.ownerDocument.activeElement |
| 13018 |
)) { |
| 13019 |
document.getElementById(targetCompositeItemId)?.focus(); |
| 13020 |
} |
| 13021 |
}, |
| 13022 |
[data, generateCompositeItemIdPrefix] |
| 13023 |
); |
| 13024 |
(0, import_element31.useEffect)(() => { |
| 13025 |
const wasActiveIdInList = previousActiveItemIndex !== void 0 && previousActiveItemIndex !== -1; |
| 13026 |
if (!isActiveIdInList && wasActiveIdInList) { |
| 13027 |
selectCompositeItem( |
| 13028 |
previousActiveItemIndex, |
| 13029 |
generateItemWrapperCompositeId |
| 13030 |
); |
| 13031 |
} |
| 13032 |
}, [isActiveIdInList, selectCompositeItem, previousActiveItemIndex]); |
| 13033 |
const onDropdownTriggerKeyDown = (0, import_element31.useCallback)( |
| 13034 |
(event) => { |
| 13035 |
if (event.key === "ArrowDown") { |
| 13036 |
event.preventDefault(); |
| 13037 |
selectCompositeItem( |
| 13038 |
activeItemIndex + 1, |
| 13039 |
generateDropdownTriggerCompositeId |
| 13040 |
); |
| 13041 |
} |
| 13042 |
if (event.key === "ArrowUp") { |
| 13043 |
event.preventDefault(); |
| 13044 |
selectCompositeItem( |
| 13045 |
activeItemIndex - 1, |
| 13046 |
generateDropdownTriggerCompositeId |
| 13047 |
); |
| 13048 |
} |
| 13049 |
}, |
| 13050 |
[selectCompositeItem, activeItemIndex] |
| 13051 |
); |
| 13052 |
const hasData = !!data?.length; |
| 13053 |
const groupField = view.groupBy?.field ? fields.find((field) => field.id === view.groupBy?.field) : null; |
| 13054 |
const dataByGroup = hasData && groupField ? getDataByGroup(data, groupField) : null; |
| 13055 |
const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; |
| 13056 |
if (!hasData) { |
| 13057 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13058 |
"div", |
| 13059 |
{ |
| 13060 |
className: clsx_default("dataviews-no-results", { |
| 13061 |
"is-refreshing": isDelayedLoading |
| 13062 |
}), |
| 13063 |
children: empty |
| 13064 |
} |
| 13065 |
); |
| 13066 |
} |
| 13067 |
if (hasData && groupField && dataByGroup) { |
| 13068 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13069 |
import_components10.Composite, |
| 13070 |
{ |
| 13071 |
ref: compositeRef, |
| 13072 |
id: `${baseId}`, |
| 13073 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", {}), |
| 13074 |
className: "dataviews-view-list__group", |
| 13075 |
role: "grid", |
| 13076 |
activeId: activeCompositeId, |
| 13077 |
setActiveId: setActiveCompositeId, |
| 13078 |
children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13079 |
Stack, |
| 13080 |
{ |
| 13081 |
direction: "column", |
| 13082 |
gap: "lg", |
| 13083 |
className: clsx_default("dataviews-view-list", className), |
| 13084 |
children: Array.from(dataByGroup.entries()).map( |
| 13085 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)( |
| 13086 |
Stack, |
| 13087 |
{ |
| 13088 |
direction: "column", |
| 13089 |
gap: "sm", |
| 13090 |
children: [ |
| 13091 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("h3", { className: "dataviews-view-list__group-header", children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n19.sprintf)( |
| 13092 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 13093 |
(0, import_i18n19.__)("%1$s: %2$s"), |
| 13094 |
groupField.label, |
| 13095 |
groupName |
| 13096 |
) }), |
| 13097 |
groupItems.map((item) => { |
| 13098 |
const id = generateCompositeItemIdPrefix(item); |
| 13099 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13100 |
ListItem, |
| 13101 |
{ |
| 13102 |
view, |
| 13103 |
idPrefix: id, |
| 13104 |
actions, |
| 13105 |
item, |
| 13106 |
isSelected: item === selectedItem, |
| 13107 |
onSelect, |
| 13108 |
mediaField, |
| 13109 |
titleField, |
| 13110 |
descriptionField: descriptionField2, |
| 13111 |
otherFields, |
| 13112 |
onDropdownTriggerKeyDown |
| 13113 |
}, |
| 13114 |
id |
| 13115 |
); |
| 13116 |
}) |
| 13117 |
] |
| 13118 |
}, |
| 13119 |
groupName |
| 13120 |
) |
| 13121 |
) |
| 13122 |
} |
| 13123 |
) |
| 13124 |
} |
| 13125 |
); |
| 13126 |
} |
| 13127 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_jsx_runtime59.Fragment, { children: [ |
| 13128 |
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13129 |
import_components10.Composite, |
| 13130 |
{ |
| 13131 |
ref: compositeRef, |
| 13132 |
id: baseId, |
| 13133 |
render: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", {}), |
| 13134 |
className: clsx_default("dataviews-view-list", className, { |
| 13135 |
[`has-${view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( |
| 13136 |
view.layout.density |
| 13137 |
), |
| 13138 |
"is-refreshing": !isInfiniteScroll && isDelayedLoading |
| 13139 |
}), |
| 13140 |
role: view.infiniteScrollEnabled ? "feed" : "grid", |
| 13141 |
activeId: activeCompositeId, |
| 13142 |
setActiveId: setActiveCompositeId, |
| 13143 |
inert: !isInfiniteScroll && !!isLoading ? "true" : void 0, |
| 13144 |
children: data.map((item, index2) => { |
| 13145 |
const id = generateCompositeItemIdPrefix(item); |
| 13146 |
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)( |
| 13147 |
ListItem, |
| 13148 |
{ |
| 13149 |
view, |
| 13150 |
idPrefix: id, |
| 13151 |
actions, |
| 13152 |
item, |
| 13153 |
isSelected: item === selectedItem, |
| 13154 |
onSelect, |
| 13155 |
mediaField, |
| 13156 |
titleField, |
| 13157 |
descriptionField: descriptionField2, |
| 13158 |
otherFields, |
| 13159 |
onDropdownTriggerKeyDown, |
| 13160 |
posinset: view.infiniteScrollEnabled ? index2 + 1 : void 0 |
| 13161 |
}, |
| 13162 |
id |
| 13163 |
); |
| 13164 |
}) |
| 13165 |
} |
| 13166 |
), |
| 13167 |
isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components10.Spinner, {}) }) |
| 13168 |
] }); |
| 13169 |
} |
| 13170 |
|
| 13171 |
// packages/dataviews/build-module/components/dataviews-layouts/activity/index.mjs |
| 13172 |
var import_components11 = __toESM(require_components(), 1); |
| 13173 |
|
| 13174 |
// packages/dataviews/build-module/components/dataviews-layouts/activity/activity-group.mjs |
| 13175 |
var import_i18n20 = __toESM(require_i18n(), 1); |
| 13176 |
var import_element32 = __toESM(require_element(), 1); |
| 13177 |
var import_jsx_runtime60 = __toESM(require_jsx_runtime(), 1); |
| 13178 |
function ActivityGroup({ |
| 13179 |
groupName, |
| 13180 |
groupData, |
| 13181 |
groupField, |
| 13182 |
showLabel = true, |
| 13183 |
children |
| 13184 |
}) { |
| 13185 |
const groupHeader = showLabel ? (0, import_element32.createInterpolateElement)( |
| 13186 |
// translators: %s: The label of the field e.g. "Status". |
| 13187 |
(0, import_i18n20.sprintf)((0, import_i18n20.__)("%s: <groupName />"), groupField.label).trim(), |
| 13188 |
{ |
| 13189 |
groupName: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)( |
| 13190 |
groupField.render, |
| 13191 |
{ |
| 13192 |
item: groupData[0], |
| 13193 |
field: groupField |
| 13194 |
} |
| 13195 |
) |
| 13196 |
} |
| 13197 |
) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(groupField.render, { item: groupData[0], field: groupField }); |
| 13198 |
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)( |
| 13199 |
Stack, |
| 13200 |
{ |
| 13201 |
direction: "column", |
| 13202 |
className: "dataviews-view-activity__group", |
| 13203 |
children: [ |
| 13204 |
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("h3", { className: "dataviews-view-activity__group-header", children: groupHeader }), |
| 13205 |
children |
| 13206 |
] |
| 13207 |
}, |
| 13208 |
groupName |
| 13209 |
); |
| 13210 |
} |
| 13211 |
|
| 13212 |
// packages/dataviews/build-module/components/dataviews-layouts/activity/activity-item.mjs |
| 13213 |
var import_element33 = __toESM(require_element(), 1); |
| 13214 |
var import_data4 = __toESM(require_data(), 1); |
| 13215 |
var import_compose5 = __toESM(require_compose(), 1); |
| 13216 |
var import_jsx_runtime61 = __toESM(require_jsx_runtime(), 1); |
| 13217 |
function ActivityItem(props) { |
| 13218 |
const { |
| 13219 |
view, |
| 13220 |
actions, |
| 13221 |
item, |
| 13222 |
titleField, |
| 13223 |
mediaField, |
| 13224 |
descriptionField: descriptionField2, |
| 13225 |
otherFields, |
| 13226 |
posinset, |
| 13227 |
onClickItem, |
| 13228 |
renderItemLink, |
| 13229 |
isItemClickable: isItemClickable2 |
| 13230 |
} = props; |
| 13231 |
const { |
| 13232 |
showTitle = true, |
| 13233 |
showMedia = true, |
| 13234 |
showDescription = true, |
| 13235 |
infiniteScrollEnabled |
| 13236 |
} = view; |
| 13237 |
const itemRef = (0, import_element33.useRef)(null); |
| 13238 |
const registry = (0, import_data4.useRegistry)(); |
| 13239 |
const { paginationInfo } = (0, import_element33.useContext)(dataviews_context_default); |
| 13240 |
const { primaryActions, eligibleActions } = (0, import_element33.useMemo)(() => { |
| 13241 |
const _eligibleActions = actions.filter( |
| 13242 |
(action) => !action.isEligible || action.isEligible(item) |
| 13243 |
); |
| 13244 |
const _primaryActions = _eligibleActions.filter( |
| 13245 |
(action) => action.isPrimary |
| 13246 |
); |
| 13247 |
return { |
| 13248 |
primaryActions: _primaryActions, |
| 13249 |
eligibleActions: _eligibleActions |
| 13250 |
}; |
| 13251 |
}, [actions, item]); |
| 13252 |
const isMobileViewport = (0, import_compose5.useViewportMatch)("medium", "<"); |
| 13253 |
const density = view.layout?.density ?? "balanced"; |
| 13254 |
const mediaContent = showMedia && density !== "compact" && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13255 |
mediaField.render, |
| 13256 |
{ |
| 13257 |
item, |
| 13258 |
field: mediaField, |
| 13259 |
config: { |
| 13260 |
sizes: density === "comfortable" ? "32px" : "24px" |
| 13261 |
} |
| 13262 |
} |
| 13263 |
) : null; |
| 13264 |
const renderedMediaField = /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "dataviews-view-activity__item-type-icon", children: mediaContent || /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13265 |
"span", |
| 13266 |
{ |
| 13267 |
className: "dataviews-view-activity__item-bullet", |
| 13268 |
"aria-hidden": "true" |
| 13269 |
} |
| 13270 |
) }); |
| 13271 |
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(titleField.render, { item, field: titleField }) : null; |
| 13272 |
const verticalGap = (0, import_element33.useMemo)(() => { |
| 13273 |
switch (density) { |
| 13274 |
case "comfortable": |
| 13275 |
return "md"; |
| 13276 |
default: |
| 13277 |
return "sm"; |
| 13278 |
} |
| 13279 |
}, [density]); |
| 13280 |
return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13281 |
"div", |
| 13282 |
{ |
| 13283 |
ref: itemRef, |
| 13284 |
role: infiniteScrollEnabled ? "article" : void 0, |
| 13285 |
"aria-posinset": posinset, |
| 13286 |
"aria-setsize": infiniteScrollEnabled ? paginationInfo.totalItems : void 0, |
| 13287 |
className: clsx_default( |
| 13288 |
"dataviews-view-activity__item", |
| 13289 |
density === "compact" && "is-compact", |
| 13290 |
density === "balanced" && "is-balanced", |
| 13291 |
density === "comfortable" && "is-comfortable" |
| 13292 |
), |
| 13293 |
children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Stack, { direction: "row", gap: "lg", justify: "start", align: "flex-start", children: [ |
| 13294 |
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13295 |
Stack, |
| 13296 |
{ |
| 13297 |
direction: "column", |
| 13298 |
gap: "xs", |
| 13299 |
align: "center", |
| 13300 |
className: "dataviews-view-activity__item-type", |
| 13301 |
children: renderedMediaField |
| 13302 |
} |
| 13303 |
), |
| 13304 |
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)( |
| 13305 |
Stack, |
| 13306 |
{ |
| 13307 |
direction: "column", |
| 13308 |
gap: verticalGap, |
| 13309 |
align: "flex-start", |
| 13310 |
className: "dataviews-view-activity__item-content", |
| 13311 |
children: [ |
| 13312 |
renderedTitleField && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13313 |
ItemClickWrapper, |
| 13314 |
{ |
| 13315 |
item, |
| 13316 |
isItemClickable: isItemClickable2, |
| 13317 |
onClickItem, |
| 13318 |
renderItemLink, |
| 13319 |
className: "dataviews-view-activity__item-title", |
| 13320 |
children: renderedTitleField |
| 13321 |
} |
| 13322 |
), |
| 13323 |
showDescription && descriptionField2 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "dataviews-view-activity__item-description", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13324 |
descriptionField2.render, |
| 13325 |
{ |
| 13326 |
item, |
| 13327 |
field: descriptionField2 |
| 13328 |
} |
| 13329 |
) }), |
| 13330 |
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "dataviews-view-activity__item-fields", children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)( |
| 13331 |
"div", |
| 13332 |
{ |
| 13333 |
className: "dataviews-view-activity__item-field", |
| 13334 |
children: [ |
| 13335 |
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13336 |
VisuallyHidden, |
| 13337 |
{ |
| 13338 |
className: "dataviews-view-activity__item-field-label", |
| 13339 |
render: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", {}), |
| 13340 |
children: field.label |
| 13341 |
} |
| 13342 |
), |
| 13343 |
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "dataviews-view-activity__item-field-value", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13344 |
field.render, |
| 13345 |
{ |
| 13346 |
item, |
| 13347 |
field |
| 13348 |
} |
| 13349 |
) }) |
| 13350 |
] |
| 13351 |
}, |
| 13352 |
field.id |
| 13353 |
)) }), |
| 13354 |
!!primaryActions?.length && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13355 |
PrimaryActions, |
| 13356 |
{ |
| 13357 |
item, |
| 13358 |
actions: primaryActions, |
| 13359 |
registry, |
| 13360 |
buttonVariant: "secondary" |
| 13361 |
} |
| 13362 |
) |
| 13363 |
] |
| 13364 |
} |
| 13365 |
), |
| 13366 |
(primaryActions.length < eligibleActions.length || // Since we hide primary actions on mobile, we need to show the menu |
| 13367 |
// there if there are any actions at all. |
| 13368 |
isMobileViewport && // At the same time, only show the menu if there are actions to show. |
| 13369 |
eligibleActions.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "dataviews-view-activity__item-actions", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)( |
| 13370 |
ItemActions, |
| 13371 |
{ |
| 13372 |
item, |
| 13373 |
actions: eligibleActions, |
| 13374 |
isCompact: true |
| 13375 |
} |
| 13376 |
) }) |
| 13377 |
] }) |
| 13378 |
} |
| 13379 |
); |
| 13380 |
} |
| 13381 |
var activity_item_default = ActivityItem; |
| 13382 |
|
| 13383 |
// packages/dataviews/build-module/components/dataviews-layouts/activity/activity-items.mjs |
| 13384 |
var import_react5 = __toESM(require_react(), 1); |
| 13385 |
function isDefined3(item) { |
| 13386 |
return !!item; |
| 13387 |
} |
| 13388 |
function ActivityItems(props) { |
| 13389 |
const { data, fields, getItemId, view } = props; |
| 13390 |
const titleField = fields.find((field) => field.id === view.titleField); |
| 13391 |
const mediaField = fields.find((field) => field.id === view.mediaField); |
| 13392 |
const descriptionField2 = fields.find( |
| 13393 |
(field) => field.id === view.descriptionField |
| 13394 |
); |
| 13395 |
const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f2) => fieldId === f2.id)).filter(isDefined3); |
| 13396 |
return data.map((item, index2) => { |
| 13397 |
return /* @__PURE__ */ (0, import_react5.createElement)( |
| 13398 |
activity_item_default, |
| 13399 |
{ |
| 13400 |
...props, |
| 13401 |
key: getItemId(item), |
| 13402 |
item, |
| 13403 |
mediaField, |
| 13404 |
titleField, |
| 13405 |
descriptionField: descriptionField2, |
| 13406 |
otherFields, |
| 13407 |
posinset: view.infiniteScrollEnabled ? index2 + 1 : void 0 |
| 13408 |
} |
| 13409 |
); |
| 13410 |
}); |
| 13411 |
} |
| 13412 |
|
| 13413 |
// packages/dataviews/build-module/components/dataviews-layouts/activity/index.mjs |
| 13414 |
var import_jsx_runtime62 = __toESM(require_jsx_runtime(), 1); |
| 13415 |
function ViewActivity(props) { |
| 13416 |
const { empty, data, fields, isLoading, view, className } = props; |
| 13417 |
const isDelayedLoading = useDelayedLoading(!!isLoading); |
| 13418 |
const hasData = !!data?.length; |
| 13419 |
const groupField = view.groupBy?.field ? fields.find((field) => field.id === view.groupBy?.field) : null; |
| 13420 |
const dataByGroup = hasData && groupField ? getDataByGroup(data, groupField) : null; |
| 13421 |
const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; |
| 13422 |
if (!hasData) { |
| 13423 |
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)( |
| 13424 |
"div", |
| 13425 |
{ |
| 13426 |
className: clsx_default("dataviews-no-results", { |
| 13427 |
"is-refreshing": isDelayedLoading |
| 13428 |
}), |
| 13429 |
children: empty |
| 13430 |
} |
| 13431 |
); |
| 13432 |
} |
| 13433 |
const isInert = !isInfiniteScroll && !!isLoading; |
| 13434 |
const wrapperClassName = clsx_default("dataviews-view-activity", className, { |
| 13435 |
"is-refreshing": !isInfiniteScroll && isDelayedLoading |
| 13436 |
}); |
| 13437 |
const groupedEntries = dataByGroup ? Array.from(dataByGroup.entries()) : []; |
| 13438 |
if (hasData && groupField && dataByGroup) { |
| 13439 |
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)( |
| 13440 |
Stack, |
| 13441 |
{ |
| 13442 |
direction: "column", |
| 13443 |
gap: "sm", |
| 13444 |
className: wrapperClassName, |
| 13445 |
inert: isInert ? "true" : void 0, |
| 13446 |
children: groupedEntries.map( |
| 13447 |
([groupName, groupData]) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)( |
| 13448 |
ActivityGroup, |
| 13449 |
{ |
| 13450 |
groupName, |
| 13451 |
groupData, |
| 13452 |
groupField, |
| 13453 |
showLabel: view.groupBy?.showLabel !== false, |
| 13454 |
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)( |
| 13455 |
ActivityItems, |
| 13456 |
{ |
| 13457 |
...props, |
| 13458 |
data: groupData |
| 13459 |
} |
| 13460 |
) |
| 13461 |
}, |
| 13462 |
groupName |
| 13463 |
) |
| 13464 |
) |
| 13465 |
} |
| 13466 |
); |
| 13467 |
} |
| 13468 |
return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [ |
| 13469 |
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)( |
| 13470 |
"div", |
| 13471 |
{ |
| 13472 |
className: wrapperClassName, |
| 13473 |
role: view.infiniteScrollEnabled ? "feed" : void 0, |
| 13474 |
inert: isInert ? "true" : void 0, |
| 13475 |
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ActivityItems, { ...props }) |
| 13476 |
} |
| 13477 |
), |
| 13478 |
isInfiniteScroll && isLoading && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_components11.Spinner, {}) }) |
| 13479 |
] }); |
| 13480 |
} |
| 13481 |
|
| 13482 |
// packages/dataviews/build-module/components/dataviews-layouts/picker-grid/index.mjs |
| 13483 |
var import_components14 = __toESM(require_components(), 1); |
| 13484 |
var import_i18n23 = __toESM(require_i18n(), 1); |
| 13485 |
var import_compose6 = __toESM(require_compose(), 1); |
| 13486 |
var import_element36 = __toESM(require_element(), 1); |
| 13487 |
|
| 13488 |
// packages/dataviews/build-module/components/dataviews-picker-footer/index.mjs |
| 13489 |
var import_components13 = __toESM(require_components(), 1); |
| 13490 |
var import_data5 = __toESM(require_data(), 1); |
| 13491 |
var import_element35 = __toESM(require_element(), 1); |
| 13492 |
var import_i18n22 = __toESM(require_i18n(), 1); |
| 13493 |
|
| 13494 |
// packages/dataviews/build-module/components/dataviews-pagination/index.mjs |
| 13495 |
var import_components12 = __toESM(require_components(), 1); |
| 13496 |
var import_element34 = __toESM(require_element(), 1); |
| 13497 |
var import_i18n21 = __toESM(require_i18n(), 1); |
| 13498 |
var import_jsx_runtime63 = __toESM(require_jsx_runtime(), 1); |
| 13499 |
function DataViewsPagination() { |
| 13500 |
const { |
| 13501 |
view, |
| 13502 |
onChangeView, |
| 13503 |
paginationInfo: { totalItems = 0, totalPages } |
| 13504 |
} = (0, import_element34.useContext)(dataviews_context_default); |
| 13505 |
if (!totalItems || !totalPages || view.infiniteScrollEnabled) { |
| 13506 |
return null; |
| 13507 |
} |
| 13508 |
const currentPage = view.page ?? 1; |
| 13509 |
const pageSelectOptions = Array.from(Array(totalPages)).map( |
| 13510 |
(_, i2) => { |
| 13511 |
const page = i2 + 1; |
| 13512 |
return { |
| 13513 |
value: page.toString(), |
| 13514 |
label: page.toString(), |
| 13515 |
"aria-label": currentPage === page ? (0, import_i18n21.sprintf)( |
| 13516 |
// translators: 1: current page number. 2: total number of pages. |
| 13517 |
(0, import_i18n21.__)("Page %1$d of %2$d"), |
| 13518 |
currentPage, |
| 13519 |
totalPages |
| 13520 |
) : page.toString() |
| 13521 |
}; |
| 13522 |
} |
| 13523 |
); |
| 13524 |
return !!totalItems && totalPages !== 1 && /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)( |
| 13525 |
Stack, |
| 13526 |
{ |
| 13527 |
direction: "row", |
| 13528 |
className: "dataviews-pagination", |
| 13529 |
justify: "end", |
| 13530 |
align: "center", |
| 13531 |
gap: "xl", |
| 13532 |
children: [ |
| 13533 |
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)( |
| 13534 |
Stack, |
| 13535 |
{ |
| 13536 |
direction: "row", |
| 13537 |
justify: "flex-start", |
| 13538 |
align: "center", |
| 13539 |
gap: "xs", |
| 13540 |
className: "dataviews-pagination__page-select", |
| 13541 |
children: (0, import_element34.createInterpolateElement)( |
| 13542 |
(0, import_i18n21.sprintf)( |
| 13543 |
// translators: 1: Current page number, 2: Total number of pages. |
| 13544 |
(0, import_i18n21._x)( |
| 13545 |
"<div>Page</div>%1$s<div>of %2$d</div>", |
| 13546 |
"paging" |
| 13547 |
), |
| 13548 |
"<CurrentPage />", |
| 13549 |
totalPages |
| 13550 |
), |
| 13551 |
{ |
| 13552 |
div: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { "aria-hidden": true }), |
| 13553 |
// @ts-expect-error — Tag injected via sprintf argument, not visible in format string. |
| 13554 |
CurrentPage: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)( |
| 13555 |
import_components12.SelectControl, |
| 13556 |
{ |
| 13557 |
"aria-label": (0, import_i18n21.__)("Current page"), |
| 13558 |
value: currentPage.toString(), |
| 13559 |
options: pageSelectOptions, |
| 13560 |
onChange: (newValue) => { |
| 13561 |
onChangeView({ |
| 13562 |
...view, |
| 13563 |
page: +newValue |
| 13564 |
}); |
| 13565 |
}, |
| 13566 |
size: "small", |
| 13567 |
variant: "minimal" |
| 13568 |
} |
| 13569 |
) |
| 13570 |
} |
| 13571 |
) |
| 13572 |
} |
| 13573 |
), |
| 13574 |
/* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Stack, { direction: "row", gap: "xs", align: "center", children: [ |
| 13575 |
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)( |
| 13576 |
import_components12.Button, |
| 13577 |
{ |
| 13578 |
onClick: () => onChangeView({ |
| 13579 |
...view, |
| 13580 |
page: currentPage - 1 |
| 13581 |
}), |
| 13582 |
disabled: currentPage === 1, |
| 13583 |
accessibleWhenDisabled: true, |
| 13584 |
label: (0, import_i18n21.__)("Previous page"), |
| 13585 |
icon: (0, import_i18n21.isRTL)() ? next_default : previous_default, |
| 13586 |
showTooltip: true, |
| 13587 |
size: "compact", |
| 13588 |
tooltipPosition: "top" |
| 13589 |
} |
| 13590 |
), |
| 13591 |
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)( |
| 13592 |
import_components12.Button, |
| 13593 |
{ |
| 13594 |
onClick: () => onChangeView({ ...view, page: currentPage + 1 }), |
| 13595 |
disabled: currentPage >= totalPages, |
| 13596 |
accessibleWhenDisabled: true, |
| 13597 |
label: (0, import_i18n21.__)("Next page"), |
| 13598 |
icon: (0, import_i18n21.isRTL)() ? previous_default : next_default, |
| 13599 |
showTooltip: true, |
| 13600 |
size: "compact", |
| 13601 |
tooltipPosition: "top" |
| 13602 |
} |
| 13603 |
) |
| 13604 |
] }) |
| 13605 |
] |
| 13606 |
} |
| 13607 |
); |
| 13608 |
} |
| 13609 |
var dataviews_pagination_default = (0, import_element34.memo)(DataViewsPagination); |
| 13610 |
|
| 13611 |
// packages/dataviews/build-module/components/dataviews-picker-footer/index.mjs |
| 13612 |
var import_jsx_runtime64 = __toESM(require_jsx_runtime(), 1); |
| 13613 |
var EMPTY_ARRAY2 = []; |
| 13614 |
function useIsMultiselectPicker(actions) { |
| 13615 |
return (0, import_element35.useMemo)(() => { |
| 13616 |
return !!actions?.length && actions?.every((action) => action.supportsBulk); |
| 13617 |
}, [actions]); |
| 13618 |
} |
| 13619 |
function BulkSelectionCheckbox2({ |
| 13620 |
selection, |
| 13621 |
selectedItems, |
| 13622 |
onChangeSelection, |
| 13623 |
data, |
| 13624 |
getItemId, |
| 13625 |
disableSelectAll = false |
| 13626 |
}) { |
| 13627 |
const hasSelection = selection.length > 0; |
| 13628 |
const areAllSelected = selectedItems.length === data.length; |
| 13629 |
if (disableSelectAll) { |
| 13630 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)( |
| 13631 |
import_components13.CheckboxControl, |
| 13632 |
{ |
| 13633 |
className: "dataviews-view-table-selection-checkbox", |
| 13634 |
checked: hasSelection, |
| 13635 |
disabled: !hasSelection, |
| 13636 |
onChange: () => { |
| 13637 |
onChangeSelection([]); |
| 13638 |
}, |
| 13639 |
"aria-label": (0, import_i18n22.__)("Deselect all") |
| 13640 |
} |
| 13641 |
); |
| 13642 |
} |
| 13643 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)( |
| 13644 |
import_components13.CheckboxControl, |
| 13645 |
{ |
| 13646 |
className: "dataviews-view-table-selection-checkbox", |
| 13647 |
checked: areAllSelected, |
| 13648 |
indeterminate: !areAllSelected && !!selectedItems.length, |
| 13649 |
onChange: () => { |
| 13650 |
if (areAllSelected) { |
| 13651 |
onChangeSelection( |
| 13652 |
selection.filter( |
| 13653 |
(id) => !data.some( |
| 13654 |
(item) => id === getItemId(item) |
| 13655 |
) |
| 13656 |
) |
| 13657 |
); |
| 13658 |
} else { |
| 13659 |
const selectionSet = /* @__PURE__ */ new Set([ |
| 13660 |
...selection, |
| 13661 |
...data.map((item) => getItemId(item)) |
| 13662 |
]); |
| 13663 |
onChangeSelection(Array.from(selectionSet)); |
| 13664 |
} |
| 13665 |
}, |
| 13666 |
"aria-label": areAllSelected ? (0, import_i18n22.__)("Deselect all") : (0, import_i18n22.__)("Select all") |
| 13667 |
} |
| 13668 |
); |
| 13669 |
} |
| 13670 |
function ActionButtons({ |
| 13671 |
actions, |
| 13672 |
items, |
| 13673 |
selection |
| 13674 |
}) { |
| 13675 |
const registry = (0, import_data5.useRegistry)(); |
| 13676 |
const [actionInProgress, setActionInProgress] = (0, import_element35.useState)( |
| 13677 |
null |
| 13678 |
); |
| 13679 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Stack, { direction: "row", gap: "xs", children: actions.map((action) => { |
| 13680 |
if (!("callback" in action)) { |
| 13681 |
return null; |
| 13682 |
} |
| 13683 |
const { id, label, icon, isPrimary, callback } = action; |
| 13684 |
const _label = typeof label === "string" ? label : label(items); |
| 13685 |
const variant = isPrimary ? "primary" : "tertiary"; |
| 13686 |
const isInProgress = id === actionInProgress; |
| 13687 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)( |
| 13688 |
import_components13.Button, |
| 13689 |
{ |
| 13690 |
accessibleWhenDisabled: true, |
| 13691 |
icon, |
| 13692 |
disabled: isInProgress || !selection?.length, |
| 13693 |
isBusy: isInProgress, |
| 13694 |
onClick: async () => { |
| 13695 |
setActionInProgress(id); |
| 13696 |
await callback(items, { |
| 13697 |
registry |
| 13698 |
}); |
| 13699 |
setActionInProgress(null); |
| 13700 |
}, |
| 13701 |
size: "compact", |
| 13702 |
variant, |
| 13703 |
children: _label |
| 13704 |
}, |
| 13705 |
id |
| 13706 |
); |
| 13707 |
}) }); |
| 13708 |
} |
| 13709 |
function PickerBulkSelectionInfo() { |
| 13710 |
const { |
| 13711 |
data, |
| 13712 |
selection, |
| 13713 |
onChangeSelection, |
| 13714 |
getItemId, |
| 13715 |
actions = EMPTY_ARRAY2, |
| 13716 |
paginationInfo, |
| 13717 |
view |
| 13718 |
} = (0, import_element35.useContext)(dataviews_context_default); |
| 13719 |
const isMultiselect = useIsMultiselectPicker(actions); |
| 13720 |
const selectedItems = (0, import_element35.useMemo)( |
| 13721 |
() => data.filter((item) => selection.includes(getItemId(item))), |
| 13722 |
[selection, getItemId, data] |
| 13723 |
); |
| 13724 |
if (!actions.length) { |
| 13725 |
return null; |
| 13726 |
} |
| 13727 |
const message2 = getFooterMessage( |
| 13728 |
selection.length, |
| 13729 |
data.length, |
| 13730 |
paginationInfo.totalItems, |
| 13731 |
!!view.infiniteScrollEnabled |
| 13732 |
); |
| 13733 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)( |
| 13734 |
Stack, |
| 13735 |
{ |
| 13736 |
direction: "row", |
| 13737 |
className: "dataviews-picker-footer__bulk-selection", |
| 13738 |
gap: "md", |
| 13739 |
align: "center", |
| 13740 |
children: [ |
| 13741 |
isMultiselect && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)( |
| 13742 |
BulkSelectionCheckbox2, |
| 13743 |
{ |
| 13744 |
selection, |
| 13745 |
selectedItems, |
| 13746 |
onChangeSelection, |
| 13747 |
data, |
| 13748 |
getItemId, |
| 13749 |
disableSelectAll: !!view.infiniteScrollEnabled |
| 13750 |
} |
| 13751 |
), |
| 13752 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "dataviews-bulk-actions-footer__item-count", children: message2 }) |
| 13753 |
] |
| 13754 |
} |
| 13755 |
); |
| 13756 |
} |
| 13757 |
function PickerActions() { |
| 13758 |
const { |
| 13759 |
data, |
| 13760 |
selection, |
| 13761 |
getItemId, |
| 13762 |
actions = EMPTY_ARRAY2 |
| 13763 |
} = (0, import_element35.useContext)(dataviews_context_default); |
| 13764 |
const selectedItems = (0, import_element35.useMemo)( |
| 13765 |
() => data.filter((item) => selection.includes(getItemId(item))), |
| 13766 |
[selection, getItemId, data] |
| 13767 |
); |
| 13768 |
if (!actions.length) { |
| 13769 |
return null; |
| 13770 |
} |
| 13771 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "dataviews-picker-footer__actions", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)( |
| 13772 |
ActionButtons, |
| 13773 |
{ |
| 13774 |
actions, |
| 13775 |
items: selectedItems, |
| 13776 |
selection |
| 13777 |
} |
| 13778 |
) }); |
| 13779 |
} |
| 13780 |
function DataViewsPickerBulkActionToolbar() { |
| 13781 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(Stack, { direction: "row", gap: "md", align: "center", children: [ |
| 13782 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PickerBulkSelectionInfo, {}), |
| 13783 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PickerActions, {}) |
| 13784 |
] }); |
| 13785 |
} |
| 13786 |
function DataViewsPickerFooter() { |
| 13787 |
const { |
| 13788 |
actions = EMPTY_ARRAY2, |
| 13789 |
paginationInfo, |
| 13790 |
view |
| 13791 |
} = (0, import_element35.useContext)(dataviews_context_default); |
| 13792 |
const hasPagination = !view.infiniteScrollEnabled && !!paginationInfo.totalItems && paginationInfo.totalPages > 1; |
| 13793 |
if (!actions.length && !hasPagination) { |
| 13794 |
return null; |
| 13795 |
} |
| 13796 |
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)( |
| 13797 |
Stack, |
| 13798 |
{ |
| 13799 |
direction: "row", |
| 13800 |
justify: "space-between", |
| 13801 |
align: "center", |
| 13802 |
className: "dataviews-footer", |
| 13803 |
gap: "sm", |
| 13804 |
children: [ |
| 13805 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PickerBulkSelectionInfo, {}), |
| 13806 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(dataviews_pagination_default, {}), |
| 13807 |
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PickerActions, {}) |
| 13808 |
] |
| 13809 |
} |
| 13810 |
); |
| 13811 |
} |
| 13812 |
|
| 13813 |
// packages/dataviews/build-module/components/dataviews-layouts/picker-grid/index.mjs |
| 13814 |
var import_jsx_runtime65 = __toESM(require_jsx_runtime(), 1); |
| 13815 |
var { Badge: WCBadge2 } = unlock2(import_components14.privateApis); |
| 13816 |
function GridItem3({ |
| 13817 |
view, |
| 13818 |
multiselect, |
| 13819 |
selection, |
| 13820 |
onChangeSelection, |
| 13821 |
getItemId, |
| 13822 |
item, |
| 13823 |
mediaField, |
| 13824 |
titleField, |
| 13825 |
descriptionField: descriptionField2, |
| 13826 |
regularFields, |
| 13827 |
badgeFields, |
| 13828 |
config, |
| 13829 |
posinset, |
| 13830 |
setsize |
| 13831 |
}) { |
| 13832 |
const { showTitle = true, showMedia = true, showDescription = true } = view; |
| 13833 |
const id = getItemId(item); |
| 13834 |
const elementRef = (0, import_element36.useRef)(null); |
| 13835 |
const isSelected2 = selection.includes(id); |
| 13836 |
useIntersectionObserver(elementRef, posinset); |
| 13837 |
const renderedMediaField = mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13838 |
mediaField.render, |
| 13839 |
{ |
| 13840 |
item, |
| 13841 |
field: mediaField, |
| 13842 |
config |
| 13843 |
} |
| 13844 |
) : null; |
| 13845 |
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(titleField.render, { item, field: titleField }) : null; |
| 13846 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)( |
| 13847 |
import_components14.Composite.Item, |
| 13848 |
{ |
| 13849 |
ref: elementRef, |
| 13850 |
"aria-label": titleField ? titleField.getValue({ item }) || (0, import_i18n23.__)("(no title)") : void 0, |
| 13851 |
render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Stack, { direction: "column", children, ...props }), |
| 13852 |
role: "option", |
| 13853 |
"aria-posinset": posinset, |
| 13854 |
"aria-setsize": setsize, |
| 13855 |
className: clsx_default("dataviews-view-picker-grid__card", { |
| 13856 |
"is-selected": isSelected2 |
| 13857 |
}), |
| 13858 |
"aria-selected": isSelected2, |
| 13859 |
onClick: () => { |
| 13860 |
if (isSelected2) { |
| 13861 |
onChangeSelection( |
| 13862 |
selection.filter((itemId) => id !== itemId) |
| 13863 |
); |
| 13864 |
} else { |
| 13865 |
const newSelection = multiselect ? [...selection, id] : [id]; |
| 13866 |
onChangeSelection(newSelection); |
| 13867 |
} |
| 13868 |
}, |
| 13869 |
children: [ |
| 13870 |
showMedia && renderedMediaField && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "dataviews-view-picker-grid__media", children: renderedMediaField }), |
| 13871 |
showMedia && renderedMediaField && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13872 |
DataViewsSelectionCheckbox, |
| 13873 |
{ |
| 13874 |
item, |
| 13875 |
selection, |
| 13876 |
onChangeSelection, |
| 13877 |
getItemId, |
| 13878 |
titleField, |
| 13879 |
disabled: false, |
| 13880 |
"aria-hidden": true, |
| 13881 |
tabIndex: -1 |
| 13882 |
} |
| 13883 |
), |
| 13884 |
showTitle && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13885 |
Stack, |
| 13886 |
{ |
| 13887 |
direction: "row", |
| 13888 |
justify: "space-between", |
| 13889 |
className: "dataviews-view-picker-grid__title-actions", |
| 13890 |
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "dataviews-view-picker-grid__title-field dataviews-title-field", children: renderedTitleField }) |
| 13891 |
} |
| 13892 |
), |
| 13893 |
/* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(Stack, { direction: "column", gap: "xs", children: [ |
| 13894 |
showDescription && descriptionField2?.render && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13895 |
descriptionField2.render, |
| 13896 |
{ |
| 13897 |
item, |
| 13898 |
field: descriptionField2 |
| 13899 |
} |
| 13900 |
), |
| 13901 |
!!badgeFields?.length && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13902 |
Stack, |
| 13903 |
{ |
| 13904 |
direction: "row", |
| 13905 |
className: "dataviews-view-picker-grid__badge-fields", |
| 13906 |
gap: "sm", |
| 13907 |
wrap: "wrap", |
| 13908 |
align: "top", |
| 13909 |
justify: "flex-start", |
| 13910 |
children: badgeFields.map((field) => { |
| 13911 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13912 |
WCBadge2, |
| 13913 |
{ |
| 13914 |
className: "dataviews-view-picker-grid__field-value", |
| 13915 |
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13916 |
field.render, |
| 13917 |
{ |
| 13918 |
item, |
| 13919 |
field |
| 13920 |
} |
| 13921 |
) |
| 13922 |
}, |
| 13923 |
field.id |
| 13924 |
); |
| 13925 |
}) |
| 13926 |
} |
| 13927 |
), |
| 13928 |
!!regularFields?.length && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13929 |
Stack, |
| 13930 |
{ |
| 13931 |
direction: "column", |
| 13932 |
className: "dataviews-view-picker-grid__fields", |
| 13933 |
gap: "xs", |
| 13934 |
children: regularFields.map((field) => { |
| 13935 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13936 |
import_components14.Flex, |
| 13937 |
{ |
| 13938 |
className: "dataviews-view-picker-grid__field", |
| 13939 |
gap: 1, |
| 13940 |
justify: "flex-start", |
| 13941 |
expanded: true, |
| 13942 |
style: { height: "auto" }, |
| 13943 |
direction: "row", |
| 13944 |
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [ |
| 13945 |
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_components14.FlexItem, { className: "dataviews-view-picker-grid__field-name", children: field.header }), |
| 13946 |
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13947 |
import_components14.FlexItem, |
| 13948 |
{ |
| 13949 |
className: "dataviews-view-picker-grid__field-value", |
| 13950 |
style: { maxHeight: "none" }, |
| 13951 |
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13952 |
field.render, |
| 13953 |
{ |
| 13954 |
item, |
| 13955 |
field |
| 13956 |
} |
| 13957 |
) |
| 13958 |
} |
| 13959 |
) |
| 13960 |
] }) |
| 13961 |
}, |
| 13962 |
field.id |
| 13963 |
); |
| 13964 |
}) |
| 13965 |
} |
| 13966 |
) |
| 13967 |
] }) |
| 13968 |
] |
| 13969 |
}, |
| 13970 |
id |
| 13971 |
); |
| 13972 |
} |
| 13973 |
function GridGroup({ |
| 13974 |
groupName, |
| 13975 |
groupField, |
| 13976 |
showLabel = true, |
| 13977 |
children |
| 13978 |
}) { |
| 13979 |
const headerId = (0, import_compose6.useInstanceId)( |
| 13980 |
GridGroup, |
| 13981 |
"dataviews-view-picker-grid-group__header" |
| 13982 |
); |
| 13983 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)( |
| 13984 |
Stack, |
| 13985 |
{ |
| 13986 |
direction: "column", |
| 13987 |
gap: "sm", |
| 13988 |
role: "group", |
| 13989 |
"aria-labelledby": headerId, |
| 13990 |
children: [ |
| 13991 |
/* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 13992 |
"h3", |
| 13993 |
{ |
| 13994 |
className: "dataviews-view-picker-grid-group__header", |
| 13995 |
id: headerId, |
| 13996 |
children: showLabel ? (0, import_i18n23.sprintf)( |
| 13997 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 13998 |
(0, import_i18n23.__)("%1$s: %2$s"), |
| 13999 |
groupField.label, |
| 14000 |
groupName |
| 14001 |
) : groupName |
| 14002 |
} |
| 14003 |
), |
| 14004 |
children |
| 14005 |
] |
| 14006 |
}, |
| 14007 |
groupName |
| 14008 |
); |
| 14009 |
} |
| 14010 |
function ViewPickerGrid({ |
| 14011 |
actions, |
| 14012 |
data, |
| 14013 |
fields, |
| 14014 |
getItemId, |
| 14015 |
isLoading, |
| 14016 |
onChangeSelection, |
| 14017 |
selection, |
| 14018 |
view, |
| 14019 |
className, |
| 14020 |
empty |
| 14021 |
}) { |
| 14022 |
const { resizeObserverRef, paginationInfo, itemListLabel } = (0, import_element36.useContext)(dataviews_context_default); |
| 14023 |
const titleField = fields.find( |
| 14024 |
(field) => field.id === view?.titleField |
| 14025 |
); |
| 14026 |
const mediaField = fields.find( |
| 14027 |
(field) => field.id === view?.mediaField |
| 14028 |
); |
| 14029 |
const descriptionField2 = fields.find( |
| 14030 |
(field) => field.id === view?.descriptionField |
| 14031 |
); |
| 14032 |
const otherFields = view.fields ?? []; |
| 14033 |
const { regularFields, badgeFields } = otherFields.reduce( |
| 14034 |
(accumulator, fieldId) => { |
| 14035 |
const field = fields.find((f2) => f2.id === fieldId); |
| 14036 |
if (!field) { |
| 14037 |
return accumulator; |
| 14038 |
} |
| 14039 |
const key = view.layout?.badgeFields?.includes(fieldId) ? "badgeFields" : "regularFields"; |
| 14040 |
accumulator[key].push(field); |
| 14041 |
return accumulator; |
| 14042 |
}, |
| 14043 |
{ regularFields: [], badgeFields: [] } |
| 14044 |
); |
| 14045 |
const hasData = !!data?.length; |
| 14046 |
const usedPreviewSize = view.layout?.previewSize; |
| 14047 |
const isMultiselect = useIsMultiselectPicker(actions); |
| 14048 |
const size4 = "900px"; |
| 14049 |
const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; |
| 14050 |
const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; |
| 14051 |
const isInfiniteScroll = (view.infiniteScrollEnabled && !dataByGroup) ?? false; |
| 14052 |
const currentPage = view?.page ?? 1; |
| 14053 |
const perPage = view?.perPage ?? 0; |
| 14054 |
const setSize = isInfiniteScroll ? paginationInfo?.totalItems : void 0; |
| 14055 |
const gridColumns = useGridColumns(); |
| 14056 |
const placeholdersNeeded = usePlaceholdersNeeded( |
| 14057 |
data, |
| 14058 |
isInfiniteScroll, |
| 14059 |
gridColumns |
| 14060 |
); |
| 14061 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_jsx_runtime65.Fragment, { |
| 14062 |
// Render multiple groups. |
| 14063 |
children: [ |
| 14064 |
hasData && groupField && dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14065 |
import_components14.Composite, |
| 14066 |
{ |
| 14067 |
virtualFocus: true, |
| 14068 |
orientation: "horizontal", |
| 14069 |
role: "listbox", |
| 14070 |
"aria-multiselectable": isMultiselect, |
| 14071 |
className: clsx_default( |
| 14072 |
"dataviews-view-picker-grid", |
| 14073 |
className, |
| 14074 |
{ |
| 14075 |
[`has-${view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( |
| 14076 |
view.layout.density |
| 14077 |
) |
| 14078 |
} |
| 14079 |
), |
| 14080 |
"aria-label": itemListLabel, |
| 14081 |
render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14082 |
Stack, |
| 14083 |
{ |
| 14084 |
direction: "column", |
| 14085 |
gap: "lg", |
| 14086 |
children, |
| 14087 |
...props |
| 14088 |
} |
| 14089 |
), |
| 14090 |
children: Array.from(dataByGroup.entries()).map( |
| 14091 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14092 |
GridGroup, |
| 14093 |
{ |
| 14094 |
groupName, |
| 14095 |
groupField, |
| 14096 |
showLabel: view.groupBy?.showLabel !== false, |
| 14097 |
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14098 |
GridItems, |
| 14099 |
{ |
| 14100 |
previewSize: usedPreviewSize, |
| 14101 |
style: { |
| 14102 |
gridTemplateColumns: usedPreviewSize && `repeat(auto-fill, minmax(${usedPreviewSize}px, 1fr))` |
| 14103 |
}, |
| 14104 |
"aria-busy": isLoading, |
| 14105 |
ref: resizeObserverRef, |
| 14106 |
children: groupItems.map((item) => { |
| 14107 |
const posInSet = item.position ?? (currentPage - 1) * perPage + data.indexOf(item) + 1; |
| 14108 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14109 |
GridItem3, |
| 14110 |
{ |
| 14111 |
view, |
| 14112 |
multiselect: isMultiselect, |
| 14113 |
selection, |
| 14114 |
onChangeSelection, |
| 14115 |
getItemId, |
| 14116 |
item, |
| 14117 |
mediaField, |
| 14118 |
titleField, |
| 14119 |
descriptionField: descriptionField2, |
| 14120 |
regularFields, |
| 14121 |
badgeFields, |
| 14122 |
config: { |
| 14123 |
sizes: size4 |
| 14124 |
}, |
| 14125 |
posinset: posInSet, |
| 14126 |
setsize: setSize |
| 14127 |
}, |
| 14128 |
getItemId(item) |
| 14129 |
); |
| 14130 |
}) |
| 14131 |
} |
| 14132 |
) |
| 14133 |
}, |
| 14134 |
groupName |
| 14135 |
) |
| 14136 |
) |
| 14137 |
} |
| 14138 |
), |
| 14139 |
// Render a single grid with all data. |
| 14140 |
hasData && !dataByGroup && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)( |
| 14141 |
import_components14.Composite, |
| 14142 |
{ |
| 14143 |
render: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14144 |
GridItems, |
| 14145 |
{ |
| 14146 |
className: clsx_default( |
| 14147 |
"dataviews-view-picker-grid", |
| 14148 |
className, |
| 14149 |
{ |
| 14150 |
[`has-${view.layout?.density}-density`]: view.layout?.density && [ |
| 14151 |
"compact", |
| 14152 |
"comfortable" |
| 14153 |
].includes(view.layout.density) |
| 14154 |
} |
| 14155 |
), |
| 14156 |
previewSize: usedPreviewSize, |
| 14157 |
"aria-busy": isLoading, |
| 14158 |
ref: resizeObserverRef |
| 14159 |
} |
| 14160 |
), |
| 14161 |
virtualFocus: true, |
| 14162 |
orientation: "horizontal", |
| 14163 |
role: "listbox", |
| 14164 |
"aria-multiselectable": isMultiselect, |
| 14165 |
"aria-label": itemListLabel, |
| 14166 |
children: [ |
| 14167 |
Array.from({ length: placeholdersNeeded }).map( |
| 14168 |
(_, index2) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14169 |
import_components14.Composite.Item, |
| 14170 |
{ |
| 14171 |
render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14172 |
Stack, |
| 14173 |
{ |
| 14174 |
direction: "column", |
| 14175 |
children, |
| 14176 |
...props |
| 14177 |
} |
| 14178 |
), |
| 14179 |
role: "option", |
| 14180 |
"aria-hidden": true, |
| 14181 |
tabIndex: -1, |
| 14182 |
className: "dataviews-view-picker-grid__card dataviews-view-picker-grid__placeholder" |
| 14183 |
}, |
| 14184 |
`placeholder-${index2}` |
| 14185 |
) |
| 14186 |
), |
| 14187 |
data.map((item) => { |
| 14188 |
const posinset = item.position; |
| 14189 |
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14190 |
GridItem3, |
| 14191 |
{ |
| 14192 |
view, |
| 14193 |
multiselect: isMultiselect, |
| 14194 |
selection, |
| 14195 |
onChangeSelection, |
| 14196 |
getItemId, |
| 14197 |
item, |
| 14198 |
mediaField, |
| 14199 |
titleField, |
| 14200 |
descriptionField: descriptionField2, |
| 14201 |
regularFields, |
| 14202 |
badgeFields, |
| 14203 |
config: { |
| 14204 |
sizes: size4 |
| 14205 |
}, |
| 14206 |
posinset, |
| 14207 |
setsize: setSize |
| 14208 |
}, |
| 14209 |
getItemId(item) |
| 14210 |
); |
| 14211 |
}) |
| 14212 |
] |
| 14213 |
} |
| 14214 |
), |
| 14215 |
// Render empty state. |
| 14216 |
!hasData && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)( |
| 14217 |
"div", |
| 14218 |
{ |
| 14219 |
className: clsx_default({ |
| 14220 |
"dataviews-loading": isLoading, |
| 14221 |
"dataviews-no-results": !isLoading |
| 14222 |
}), |
| 14223 |
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_components14.Spinner, {}) }) : empty |
| 14224 |
} |
| 14225 |
), |
| 14226 |
hasData && isLoading && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_components14.Spinner, {}) }) |
| 14227 |
] |
| 14228 |
}); |
| 14229 |
} |
| 14230 |
var picker_grid_default = ViewPickerGrid; |
| 14231 |
|
| 14232 |
// packages/dataviews/build-module/components/dataviews-layouts/picker-table/index.mjs |
| 14233 |
var import_i18n24 = __toESM(require_i18n(), 1); |
| 14234 |
var import_components15 = __toESM(require_components(), 1); |
| 14235 |
var import_element37 = __toESM(require_element(), 1); |
| 14236 |
var import_jsx_runtime66 = __toESM(require_jsx_runtime(), 1); |
| 14237 |
function TableColumnField2({ |
| 14238 |
item, |
| 14239 |
fields, |
| 14240 |
column, |
| 14241 |
align |
| 14242 |
}) { |
| 14243 |
const field = fields.find((f2) => f2.id === column); |
| 14244 |
if (!field) { |
| 14245 |
return null; |
| 14246 |
} |
| 14247 |
const className = clsx_default("dataviews-view-table__cell-content-wrapper", { |
| 14248 |
"dataviews-view-table__cell-align-end": align === "end", |
| 14249 |
"dataviews-view-table__cell-align-center": align === "center" |
| 14250 |
}); |
| 14251 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(field.render, { item, field }) }); |
| 14252 |
} |
| 14253 |
function TableRow2({ |
| 14254 |
item, |
| 14255 |
fields, |
| 14256 |
id, |
| 14257 |
view, |
| 14258 |
titleField, |
| 14259 |
mediaField, |
| 14260 |
descriptionField: descriptionField2, |
| 14261 |
selection, |
| 14262 |
getItemId, |
| 14263 |
onChangeSelection, |
| 14264 |
multiselect, |
| 14265 |
posinset |
| 14266 |
}) { |
| 14267 |
const { paginationInfo } = (0, import_element37.useContext)(dataviews_context_default); |
| 14268 |
const isSelected2 = selection.includes(id); |
| 14269 |
const [isHovered, setIsHovered] = (0, import_element37.useState)(false); |
| 14270 |
const elementRef = (0, import_element37.useRef)(null); |
| 14271 |
useIntersectionObserver(elementRef, posinset); |
| 14272 |
const { |
| 14273 |
showTitle = true, |
| 14274 |
showMedia = true, |
| 14275 |
showDescription = true, |
| 14276 |
infiniteScrollEnabled |
| 14277 |
} = view; |
| 14278 |
const handleMouseEnter = () => { |
| 14279 |
setIsHovered(true); |
| 14280 |
}; |
| 14281 |
const handleMouseLeave = () => { |
| 14282 |
setIsHovered(false); |
| 14283 |
}; |
| 14284 |
const columns = view.fields ?? []; |
| 14285 |
const hasPrimaryColumn = titleField && showTitle || mediaField && showMedia || descriptionField2 && showDescription; |
| 14286 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)( |
| 14287 |
import_components15.Composite.Item, |
| 14288 |
{ |
| 14289 |
ref: elementRef, |
| 14290 |
render: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14291 |
"tr", |
| 14292 |
{ |
| 14293 |
className: clsx_default("dataviews-view-table__row", { |
| 14294 |
"is-selected": isSelected2, |
| 14295 |
"is-hovered": isHovered |
| 14296 |
}), |
| 14297 |
onMouseEnter: handleMouseEnter, |
| 14298 |
onMouseLeave: handleMouseLeave, |
| 14299 |
children, |
| 14300 |
...props |
| 14301 |
} |
| 14302 |
), |
| 14303 |
"aria-selected": isSelected2, |
| 14304 |
"aria-setsize": paginationInfo.totalItems || void 0, |
| 14305 |
"aria-posinset": posinset, |
| 14306 |
role: infiniteScrollEnabled ? "article" : "option", |
| 14307 |
onMouseDown: (event) => { |
| 14308 |
if (event.button !== 0) { |
| 14309 |
return; |
| 14310 |
} |
| 14311 |
event.currentTarget.parentElement?.focus({ |
| 14312 |
preventScroll: true |
| 14313 |
}); |
| 14314 |
}, |
| 14315 |
onClick: () => { |
| 14316 |
if (isSelected2) { |
| 14317 |
onChangeSelection( |
| 14318 |
selection.filter((itemId) => id !== itemId) |
| 14319 |
); |
| 14320 |
} else { |
| 14321 |
const newSelection = multiselect ? [...selection, id] : [id]; |
| 14322 |
onChangeSelection(newSelection); |
| 14323 |
} |
| 14324 |
}, |
| 14325 |
children: [ |
| 14326 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14327 |
"td", |
| 14328 |
{ |
| 14329 |
className: "dataviews-view-table__checkbox-column", |
| 14330 |
role: "presentation", |
| 14331 |
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "dataviews-view-table__cell-content-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14332 |
DataViewsSelectionCheckbox, |
| 14333 |
{ |
| 14334 |
item, |
| 14335 |
selection, |
| 14336 |
onChangeSelection, |
| 14337 |
getItemId, |
| 14338 |
titleField, |
| 14339 |
disabled: false, |
| 14340 |
"aria-hidden": true, |
| 14341 |
tabIndex: -1 |
| 14342 |
} |
| 14343 |
) }) |
| 14344 |
} |
| 14345 |
), |
| 14346 |
hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14347 |
"td", |
| 14348 |
{ |
| 14349 |
role: "presentation", |
| 14350 |
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14351 |
column_primary_default, |
| 14352 |
{ |
| 14353 |
item, |
| 14354 |
titleField: showTitle ? titleField : void 0, |
| 14355 |
mediaField: showMedia ? mediaField : void 0, |
| 14356 |
descriptionField: showDescription ? descriptionField2 : void 0, |
| 14357 |
isItemClickable: () => false |
| 14358 |
} |
| 14359 |
) |
| 14360 |
} |
| 14361 |
), |
| 14362 |
columns.map((column) => { |
| 14363 |
const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; |
| 14364 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14365 |
"td", |
| 14366 |
{ |
| 14367 |
style: { |
| 14368 |
width, |
| 14369 |
maxWidth, |
| 14370 |
minWidth |
| 14371 |
}, |
| 14372 |
role: "presentation", |
| 14373 |
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14374 |
TableColumnField2, |
| 14375 |
{ |
| 14376 |
fields, |
| 14377 |
item, |
| 14378 |
column, |
| 14379 |
align |
| 14380 |
} |
| 14381 |
) |
| 14382 |
}, |
| 14383 |
column |
| 14384 |
); |
| 14385 |
}) |
| 14386 |
] |
| 14387 |
}, |
| 14388 |
id |
| 14389 |
); |
| 14390 |
} |
| 14391 |
function ViewPickerTable({ |
| 14392 |
actions, |
| 14393 |
data, |
| 14394 |
fields, |
| 14395 |
getItemId, |
| 14396 |
isLoading = false, |
| 14397 |
onChangeView, |
| 14398 |
onChangeSelection, |
| 14399 |
selection, |
| 14400 |
setOpenedFilter, |
| 14401 |
view, |
| 14402 |
className, |
| 14403 |
empty |
| 14404 |
}) { |
| 14405 |
const headerMenuRefs = (0, import_element37.useRef)(/* @__PURE__ */ new Map()); |
| 14406 |
const headerMenuToFocusRef = (0, import_element37.useRef)(void 0); |
| 14407 |
const [nextHeaderMenuToFocus, setNextHeaderMenuToFocus] = (0, import_element37.useState)(); |
| 14408 |
const isMultiselect = useIsMultiselectPicker(actions) ?? false; |
| 14409 |
(0, import_element37.useEffect)(() => { |
| 14410 |
if (headerMenuToFocusRef.current) { |
| 14411 |
headerMenuToFocusRef.current.focus(); |
| 14412 |
headerMenuToFocusRef.current = void 0; |
| 14413 |
} |
| 14414 |
}); |
| 14415 |
const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; |
| 14416 |
const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; |
| 14417 |
const isInfiniteScroll = view.infiniteScrollEnabled && !dataByGroup; |
| 14418 |
const tableNoticeId = (0, import_element37.useId)(); |
| 14419 |
if (nextHeaderMenuToFocus) { |
| 14420 |
headerMenuToFocusRef.current = nextHeaderMenuToFocus; |
| 14421 |
setNextHeaderMenuToFocus(void 0); |
| 14422 |
return; |
| 14423 |
} |
| 14424 |
const onHide = (field) => { |
| 14425 |
const hidden = headerMenuRefs.current.get(field.id); |
| 14426 |
const fallback = hidden ? headerMenuRefs.current.get(hidden.fallback) : void 0; |
| 14427 |
setNextHeaderMenuToFocus(fallback?.node); |
| 14428 |
}; |
| 14429 |
const hasData = !!data?.length; |
| 14430 |
const titleField = fields.find((field) => field.id === view.titleField); |
| 14431 |
const mediaField = fields.find((field) => field.id === view.mediaField); |
| 14432 |
const descriptionField2 = fields.find( |
| 14433 |
(field) => field.id === view.descriptionField |
| 14434 |
); |
| 14435 |
const { showTitle = true, showMedia = true, showDescription = true } = view; |
| 14436 |
const hasPrimaryColumn = titleField && showTitle || mediaField && showMedia || descriptionField2 && showDescription; |
| 14437 |
const columns = view.fields ?? []; |
| 14438 |
const headerMenuRef = (column, index2) => (node) => { |
| 14439 |
if (node) { |
| 14440 |
headerMenuRefs.current.set(column, { |
| 14441 |
node, |
| 14442 |
fallback: columns[index2 > 0 ? index2 - 1 : 1] |
| 14443 |
}); |
| 14444 |
} else { |
| 14445 |
headerMenuRefs.current.delete(column); |
| 14446 |
} |
| 14447 |
}; |
| 14448 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [ |
| 14449 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)( |
| 14450 |
"table", |
| 14451 |
{ |
| 14452 |
className: clsx_default( |
| 14453 |
"dataviews-view-table", |
| 14454 |
"dataviews-view-picker-table", |
| 14455 |
className, |
| 14456 |
{ |
| 14457 |
[`has-${view.layout?.density}-density`]: view.layout?.density && ["compact", "comfortable"].includes( |
| 14458 |
view.layout.density |
| 14459 |
) |
| 14460 |
} |
| 14461 |
), |
| 14462 |
"aria-busy": isLoading, |
| 14463 |
"aria-describedby": tableNoticeId, |
| 14464 |
role: isInfiniteScroll ? "feed" : "listbox", |
| 14465 |
children: [ |
| 14466 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("thead", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)( |
| 14467 |
"tr", |
| 14468 |
{ |
| 14469 |
className: "dataviews-view-table__row", |
| 14470 |
role: "presentation", |
| 14471 |
children: [ |
| 14472 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)("th", { className: "dataviews-view-table__checkbox-column", children: isMultiselect && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14473 |
BulkSelectionCheckbox, |
| 14474 |
{ |
| 14475 |
selection, |
| 14476 |
onChangeSelection, |
| 14477 |
data, |
| 14478 |
actions, |
| 14479 |
getItemId, |
| 14480 |
disableSelectAll: isInfiniteScroll |
| 14481 |
} |
| 14482 |
) }), |
| 14483 |
hasPrimaryColumn && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("th", { children: titleField && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14484 |
column_header_menu_default, |
| 14485 |
{ |
| 14486 |
ref: headerMenuRef( |
| 14487 |
titleField.id, |
| 14488 |
0 |
| 14489 |
), |
| 14490 |
fieldId: titleField.id, |
| 14491 |
view, |
| 14492 |
fields, |
| 14493 |
onChangeView, |
| 14494 |
onHide, |
| 14495 |
setOpenedFilter, |
| 14496 |
canMove: false |
| 14497 |
} |
| 14498 |
) }), |
| 14499 |
columns.map((column, index2) => { |
| 14500 |
const { width, maxWidth, minWidth, align } = view.layout?.styles?.[column] ?? {}; |
| 14501 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14502 |
"th", |
| 14503 |
{ |
| 14504 |
style: { |
| 14505 |
width, |
| 14506 |
maxWidth, |
| 14507 |
minWidth, |
| 14508 |
textAlign: align |
| 14509 |
}, |
| 14510 |
"aria-sort": view.sort?.direction && view.sort?.field === column ? sortValues[view.sort.direction] : void 0, |
| 14511 |
scope: "col", |
| 14512 |
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14513 |
column_header_menu_default, |
| 14514 |
{ |
| 14515 |
ref: headerMenuRef(column, index2), |
| 14516 |
fieldId: column, |
| 14517 |
view, |
| 14518 |
fields, |
| 14519 |
onChangeView, |
| 14520 |
onHide, |
| 14521 |
setOpenedFilter, |
| 14522 |
canMove: view.layout?.enableMoving ?? true |
| 14523 |
} |
| 14524 |
) |
| 14525 |
}, |
| 14526 |
column |
| 14527 |
); |
| 14528 |
}) |
| 14529 |
] |
| 14530 |
} |
| 14531 |
) }), |
| 14532 |
hasData && groupField && dataByGroup ? Array.from(dataByGroup.entries()).map( |
| 14533 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)( |
| 14534 |
import_components15.Composite, |
| 14535 |
{ |
| 14536 |
virtualFocus: true, |
| 14537 |
orientation: "vertical", |
| 14538 |
render: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("tbody", { role: "group" }), |
| 14539 |
children: [ |
| 14540 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14541 |
"tr", |
| 14542 |
{ |
| 14543 |
className: "dataviews-view-table__group-header-row", |
| 14544 |
role: "presentation", |
| 14545 |
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14546 |
"td", |
| 14547 |
{ |
| 14548 |
colSpan: columns.length + (hasPrimaryColumn ? 1 : 0) + 1, |
| 14549 |
className: "dataviews-view-table__group-header-cell", |
| 14550 |
role: "presentation", |
| 14551 |
children: view.groupBy?.showLabel === false ? groupName : (0, import_i18n24.sprintf)( |
| 14552 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 14553 |
(0, import_i18n24.__)("%1$s: %2$s"), |
| 14554 |
groupField.label, |
| 14555 |
groupName |
| 14556 |
) |
| 14557 |
} |
| 14558 |
) |
| 14559 |
} |
| 14560 |
), |
| 14561 |
groupItems.map((item, index2) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14562 |
TableRow2, |
| 14563 |
{ |
| 14564 |
item, |
| 14565 |
fields, |
| 14566 |
id: getItemId(item) || index2.toString(), |
| 14567 |
view, |
| 14568 |
titleField, |
| 14569 |
mediaField, |
| 14570 |
descriptionField: descriptionField2, |
| 14571 |
selection, |
| 14572 |
getItemId, |
| 14573 |
onChangeSelection, |
| 14574 |
multiselect: isMultiselect |
| 14575 |
}, |
| 14576 |
getItemId(item) |
| 14577 |
)) |
| 14578 |
] |
| 14579 |
}, |
| 14580 |
`group-${groupName}` |
| 14581 |
) |
| 14582 |
) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14583 |
import_components15.Composite, |
| 14584 |
{ |
| 14585 |
render: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("tbody", { role: "presentation" }), |
| 14586 |
virtualFocus: true, |
| 14587 |
orientation: "vertical", |
| 14588 |
children: hasData && data.map((item, index2) => { |
| 14589 |
const itemId = getItemId(item); |
| 14590 |
const posinset = item.position; |
| 14591 |
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)( |
| 14592 |
TableRow2, |
| 14593 |
{ |
| 14594 |
item, |
| 14595 |
fields, |
| 14596 |
id: itemId || index2.toString(), |
| 14597 |
view, |
| 14598 |
titleField, |
| 14599 |
mediaField, |
| 14600 |
descriptionField: descriptionField2, |
| 14601 |
selection, |
| 14602 |
getItemId, |
| 14603 |
onChangeSelection, |
| 14604 |
multiselect: isMultiselect, |
| 14605 |
posinset |
| 14606 |
}, |
| 14607 |
itemId |
| 14608 |
); |
| 14609 |
}) |
| 14610 |
} |
| 14611 |
) |
| 14612 |
] |
| 14613 |
} |
| 14614 |
), |
| 14615 |
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)( |
| 14616 |
"div", |
| 14617 |
{ |
| 14618 |
className: clsx_default({ |
| 14619 |
"dataviews-loading": isLoading, |
| 14620 |
"dataviews-no-results": !hasData && !isLoading |
| 14621 |
}), |
| 14622 |
id: tableNoticeId, |
| 14623 |
children: [ |
| 14624 |
!hasData && (isLoading ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_components15.Spinner, {}) }) : empty), |
| 14625 |
hasData && isLoading && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_components15.Spinner, {}) }) |
| 14626 |
] |
| 14627 |
} |
| 14628 |
) |
| 14629 |
] }); |
| 14630 |
} |
| 14631 |
var picker_table_default = ViewPickerTable; |
| 14632 |
|
| 14633 |
// packages/dataviews/build-module/components/dataviews-layouts/picker-activity/index.mjs |
| 14634 |
var import_components16 = __toESM(require_components(), 1); |
| 14635 |
var import_element38 = __toESM(require_element(), 1); |
| 14636 |
var import_compose7 = __toESM(require_compose(), 1); |
| 14637 |
var import_i18n25 = __toESM(require_i18n(), 1); |
| 14638 |
var import_jsx_runtime67 = __toESM(require_jsx_runtime(), 1); |
| 14639 |
function isDefined4(item) { |
| 14640 |
return !!item; |
| 14641 |
} |
| 14642 |
function PickerActivityItem({ |
| 14643 |
view, |
| 14644 |
multiselect, |
| 14645 |
selection, |
| 14646 |
onChangeSelection, |
| 14647 |
getItemId, |
| 14648 |
item, |
| 14649 |
titleField, |
| 14650 |
mediaField, |
| 14651 |
descriptionField: descriptionField2, |
| 14652 |
otherFields, |
| 14653 |
posinset, |
| 14654 |
setsize |
| 14655 |
}) { |
| 14656 |
const elementRef = (0, import_element38.useRef)(null); |
| 14657 |
useIntersectionObserver(elementRef, posinset); |
| 14658 |
const { showTitle = true, showMedia = true, showDescription = true } = view; |
| 14659 |
const id = getItemId(item); |
| 14660 |
const isSelected2 = selection.includes(id); |
| 14661 |
const density = view.layout?.density ?? "balanced"; |
| 14662 |
const mediaContent = showMedia && density !== "compact" && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14663 |
mediaField.render, |
| 14664 |
{ |
| 14665 |
item, |
| 14666 |
field: mediaField, |
| 14667 |
config: { |
| 14668 |
sizes: density === "comfortable" ? "32px" : "24px" |
| 14669 |
} |
| 14670 |
} |
| 14671 |
) : null; |
| 14672 |
const renderedMediaField = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "dataviews-view-picker-activity__item-type-icon", children: mediaContent || /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14673 |
"span", |
| 14674 |
{ |
| 14675 |
className: "dataviews-view-picker-activity__item-bullet", |
| 14676 |
"aria-hidden": "true" |
| 14677 |
} |
| 14678 |
) }); |
| 14679 |
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(titleField.render, { item, field: titleField }) : null; |
| 14680 |
const renderedDescriptionField = showDescription && descriptionField2?.render ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(descriptionField2.render, { item, field: descriptionField2 }) : null; |
| 14681 |
const verticalGap = (0, import_element38.useMemo)(() => { |
| 14682 |
switch (density) { |
| 14683 |
case "comfortable": |
| 14684 |
return "md"; |
| 14685 |
default: |
| 14686 |
return "sm"; |
| 14687 |
} |
| 14688 |
}, [density]); |
| 14689 |
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14690 |
import_components16.Composite.Item, |
| 14691 |
{ |
| 14692 |
ref: elementRef, |
| 14693 |
role: "option", |
| 14694 |
"aria-label": titleField ? titleField.getValue({ item }) || void 0 : void 0, |
| 14695 |
"aria-posinset": posinset, |
| 14696 |
"aria-setsize": setsize, |
| 14697 |
"aria-selected": isSelected2, |
| 14698 |
className: clsx_default( |
| 14699 |
"dataviews-view-picker-activity__item", |
| 14700 |
density === "compact" && "is-compact", |
| 14701 |
density === "balanced" && "is-balanced", |
| 14702 |
density === "comfortable" && "is-comfortable", |
| 14703 |
isSelected2 && "is-selected" |
| 14704 |
), |
| 14705 |
onClick: () => { |
| 14706 |
if (isSelected2) { |
| 14707 |
onChangeSelection( |
| 14708 |
selection.filter((itemId) => id !== itemId) |
| 14709 |
); |
| 14710 |
} else { |
| 14711 |
const newSelection = multiselect ? [...selection, id] : [id]; |
| 14712 |
onChangeSelection(newSelection); |
| 14713 |
} |
| 14714 |
}, |
| 14715 |
render: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", {}), |
| 14716 |
children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(Stack, { direction: "row", gap: "lg", justify: "start", align: "flex-start", children: [ |
| 14717 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14718 |
Stack, |
| 14719 |
{ |
| 14720 |
direction: "column", |
| 14721 |
gap: "xs", |
| 14722 |
align: "center", |
| 14723 |
className: "dataviews-view-picker-activity__item-type", |
| 14724 |
children: renderedMediaField |
| 14725 |
} |
| 14726 |
), |
| 14727 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsxs)( |
| 14728 |
Stack, |
| 14729 |
{ |
| 14730 |
direction: "column", |
| 14731 |
gap: verticalGap, |
| 14732 |
align: "flex-start", |
| 14733 |
className: "dataviews-view-picker-activity__item-content", |
| 14734 |
children: [ |
| 14735 |
renderedTitleField && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "dataviews-view-picker-activity__item-title", children: renderedTitleField }), |
| 14736 |
renderedDescriptionField && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "dataviews-view-picker-activity__item-description", children: renderedDescriptionField }), |
| 14737 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "dataviews-view-picker-activity__item-fields", children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)( |
| 14738 |
"div", |
| 14739 |
{ |
| 14740 |
className: "dataviews-view-picker-activity__item-field", |
| 14741 |
children: [ |
| 14742 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14743 |
VisuallyHidden, |
| 14744 |
{ |
| 14745 |
render: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", {}), |
| 14746 |
className: "dataviews-view-picker-activity__item-field-label", |
| 14747 |
children: field.label |
| 14748 |
} |
| 14749 |
), |
| 14750 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: "dataviews-view-picker-activity__item-field-value", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14751 |
field.render, |
| 14752 |
{ |
| 14753 |
item, |
| 14754 |
field |
| 14755 |
} |
| 14756 |
) }) |
| 14757 |
] |
| 14758 |
}, |
| 14759 |
field.id |
| 14760 |
)) }) |
| 14761 |
] |
| 14762 |
} |
| 14763 |
) |
| 14764 |
] }) |
| 14765 |
} |
| 14766 |
); |
| 14767 |
} |
| 14768 |
function PickerActivityGroup({ |
| 14769 |
groupName, |
| 14770 |
groupField, |
| 14771 |
showLabel = true, |
| 14772 |
children |
| 14773 |
}) { |
| 14774 |
const headerId = (0, import_compose7.useInstanceId)( |
| 14775 |
PickerActivityGroup, |
| 14776 |
"dataviews-view-picker-activity-group__header" |
| 14777 |
); |
| 14778 |
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)( |
| 14779 |
Stack, |
| 14780 |
{ |
| 14781 |
direction: "column", |
| 14782 |
role: "group", |
| 14783 |
"aria-labelledby": headerId, |
| 14784 |
className: "dataviews-view-picker-activity-group", |
| 14785 |
children: [ |
| 14786 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14787 |
"h3", |
| 14788 |
{ |
| 14789 |
className: "dataviews-view-picker-activity-group__header", |
| 14790 |
id: headerId, |
| 14791 |
children: showLabel ? (0, import_i18n25.sprintf)( |
| 14792 |
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022". |
| 14793 |
(0, import_i18n25.__)("%1$s: %2$s"), |
| 14794 |
groupField.label, |
| 14795 |
groupName |
| 14796 |
) : groupName |
| 14797 |
} |
| 14798 |
), |
| 14799 |
children |
| 14800 |
] |
| 14801 |
} |
| 14802 |
); |
| 14803 |
} |
| 14804 |
function ViewPickerActivity({ |
| 14805 |
data, |
| 14806 |
fields, |
| 14807 |
getItemId, |
| 14808 |
isLoading, |
| 14809 |
onChangeSelection, |
| 14810 |
selection, |
| 14811 |
view, |
| 14812 |
actions, |
| 14813 |
className, |
| 14814 |
empty |
| 14815 |
}) { |
| 14816 |
const { itemListLabel, paginationInfo } = (0, import_element38.useContext)(dataviews_context_default); |
| 14817 |
const isMultiselect = useIsMultiselectPicker(actions); |
| 14818 |
const titleField = fields.find( |
| 14819 |
(field) => field.id === view?.titleField |
| 14820 |
); |
| 14821 |
const mediaField = fields.find( |
| 14822 |
(field) => field.id === view?.mediaField |
| 14823 |
); |
| 14824 |
const descriptionField2 = fields.find( |
| 14825 |
(field) => field.id === view?.descriptionField |
| 14826 |
); |
| 14827 |
const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f2) => fieldId === f2.id)).filter(isDefined4); |
| 14828 |
const groupField = view.groupBy?.field ? fields.find((f2) => f2.id === view.groupBy?.field) : null; |
| 14829 |
const dataByGroup = groupField ? getDataByGroup(data, groupField) : null; |
| 14830 |
const isInfiniteScroll = (view.infiniteScrollEnabled && !dataByGroup) ?? false; |
| 14831 |
const setsize = isInfiniteScroll ? paginationInfo?.totalItems : void 0; |
| 14832 |
const hasData = !!data?.length; |
| 14833 |
const isGrouped = !!(groupField && dataByGroup); |
| 14834 |
const renderItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14835 |
PickerActivityItem, |
| 14836 |
{ |
| 14837 |
view, |
| 14838 |
multiselect: isMultiselect, |
| 14839 |
selection, |
| 14840 |
onChangeSelection, |
| 14841 |
getItemId, |
| 14842 |
item, |
| 14843 |
titleField, |
| 14844 |
mediaField, |
| 14845 |
descriptionField: descriptionField2, |
| 14846 |
otherFields, |
| 14847 |
posinset: item.position, |
| 14848 |
setsize |
| 14849 |
}, |
| 14850 |
getItemId(item) |
| 14851 |
); |
| 14852 |
if (!hasData) { |
| 14853 |
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14854 |
"div", |
| 14855 |
{ |
| 14856 |
className: clsx_default({ |
| 14857 |
"dataviews-loading": isLoading, |
| 14858 |
"dataviews-no-results": !isLoading |
| 14859 |
}), |
| 14860 |
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_components16.Spinner, {}) }) : empty |
| 14861 |
} |
| 14862 |
); |
| 14863 |
} |
| 14864 |
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [ |
| 14865 |
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14866 |
import_components16.Composite, |
| 14867 |
{ |
| 14868 |
virtualFocus: true, |
| 14869 |
orientation: "vertical", |
| 14870 |
role: "listbox", |
| 14871 |
"aria-multiselectable": isMultiselect, |
| 14872 |
"aria-label": itemListLabel, |
| 14873 |
"aria-busy": isLoading, |
| 14874 |
render: isGrouped ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Stack, { direction: "column", gap: "sm" }) : void 0, |
| 14875 |
className: clsx_default( |
| 14876 |
"dataviews-view-picker-activity", |
| 14877 |
className |
| 14878 |
), |
| 14879 |
children: isGrouped && dataByGroup ? Array.from(dataByGroup.entries()).map( |
| 14880 |
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)( |
| 14881 |
PickerActivityGroup, |
| 14882 |
{ |
| 14883 |
groupName, |
| 14884 |
groupField, |
| 14885 |
showLabel: view.groupBy?.showLabel !== false, |
| 14886 |
children: groupItems.map(renderItem) |
| 14887 |
}, |
| 14888 |
groupName |
| 14889 |
) |
| 14890 |
) : data.map(renderItem) |
| 14891 |
} |
| 14892 |
), |
| 14893 |
isLoading && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_components16.Spinner, {}) }) |
| 14894 |
] }); |
| 14895 |
} |
| 14896 |
|
| 14897 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/density-picker.mjs |
| 14898 |
var import_components17 = __toESM(require_components(), 1); |
| 14899 |
var import_i18n26 = __toESM(require_i18n(), 1); |
| 14900 |
var import_element39 = __toESM(require_element(), 1); |
| 14901 |
var import_jsx_runtime68 = __toESM(require_jsx_runtime(), 1); |
| 14902 |
function DensityPicker() { |
| 14903 |
const context = (0, import_element39.useContext)(dataviews_context_default); |
| 14904 |
const view = context.view; |
| 14905 |
return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)( |
| 14906 |
import_components17.__experimentalToggleGroupControl, |
| 14907 |
{ |
| 14908 |
size: "__unstable-large", |
| 14909 |
label: (0, import_i18n26.__)("Density"), |
| 14910 |
value: view.layout?.density || "balanced", |
| 14911 |
onChange: (value) => { |
| 14912 |
context.onChangeView({ |
| 14913 |
...view, |
| 14914 |
layout: { |
| 14915 |
...view.layout, |
| 14916 |
density: value |
| 14917 |
} |
| 14918 |
}); |
| 14919 |
}, |
| 14920 |
isBlock: true, |
| 14921 |
children: [ |
| 14922 |
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)( |
| 14923 |
import_components17.__experimentalToggleGroupControlOption, |
| 14924 |
{ |
| 14925 |
value: "comfortable", |
| 14926 |
label: (0, import_i18n26._x)( |
| 14927 |
"Comfortable", |
| 14928 |
"Density option for DataView layout" |
| 14929 |
) |
| 14930 |
}, |
| 14931 |
"comfortable" |
| 14932 |
), |
| 14933 |
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)( |
| 14934 |
import_components17.__experimentalToggleGroupControlOption, |
| 14935 |
{ |
| 14936 |
value: "balanced", |
| 14937 |
label: (0, import_i18n26._x)("Balanced", "Density option for DataView layout") |
| 14938 |
}, |
| 14939 |
"balanced" |
| 14940 |
), |
| 14941 |
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)( |
| 14942 |
import_components17.__experimentalToggleGroupControlOption, |
| 14943 |
{ |
| 14944 |
value: "compact", |
| 14945 |
label: (0, import_i18n26._x)("Compact", "Density option for DataView layout") |
| 14946 |
}, |
| 14947 |
"compact" |
| 14948 |
) |
| 14949 |
] |
| 14950 |
} |
| 14951 |
); |
| 14952 |
} |
| 14953 |
|
| 14954 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/preview-size-picker.mjs |
| 14955 |
var import_components18 = __toESM(require_components(), 1); |
| 14956 |
var import_i18n27 = __toESM(require_i18n(), 1); |
| 14957 |
var import_element40 = __toESM(require_element(), 1); |
| 14958 |
var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1); |
| 14959 |
var imageSizes2 = [ |
| 14960 |
{ |
| 14961 |
value: 120, |
| 14962 |
breakpoint: 1 |
| 14963 |
}, |
| 14964 |
{ |
| 14965 |
value: 170, |
| 14966 |
breakpoint: 1 |
| 14967 |
}, |
| 14968 |
{ |
| 14969 |
value: 230, |
| 14970 |
breakpoint: 1 |
| 14971 |
}, |
| 14972 |
{ |
| 14973 |
value: 290, |
| 14974 |
breakpoint: 1112 |
| 14975 |
// at minimum image width, 4 images display at this container size |
| 14976 |
}, |
| 14977 |
{ |
| 14978 |
value: 350, |
| 14979 |
breakpoint: 1636 |
| 14980 |
// at minimum image width, 6 images display at this container size |
| 14981 |
}, |
| 14982 |
{ |
| 14983 |
value: 430, |
| 14984 |
breakpoint: 588 |
| 14985 |
// at minimum image width, 2 images display at this container size |
| 14986 |
} |
| 14987 |
]; |
| 14988 |
function PreviewSizePicker() { |
| 14989 |
const context = (0, import_element40.useContext)(dataviews_context_default); |
| 14990 |
const view = context.view; |
| 14991 |
const breakValues = imageSizes2.filter((size4) => { |
| 14992 |
return context.containerWidth >= size4.breakpoint; |
| 14993 |
}); |
| 14994 |
const layoutPreviewSize = view.layout?.previewSize ?? 230; |
| 14995 |
const previewSizeToUse = breakValues.map((size4, index2) => ({ ...size4, index: index2 })).filter((size4) => size4.value <= layoutPreviewSize).sort((a2, b2) => b2.value - a2.value)[0]?.index ?? 0; |
| 14996 |
const marks = breakValues.map((size4, index2) => { |
| 14997 |
return { |
| 14998 |
value: index2 |
| 14999 |
}; |
| 15000 |
}); |
| 15001 |
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)( |
| 15002 |
import_components18.RangeControl, |
| 15003 |
{ |
| 15004 |
__next40pxDefaultSize: true, |
| 15005 |
showTooltip: false, |
| 15006 |
label: (0, import_i18n27.__)("Preview size"), |
| 15007 |
value: previewSizeToUse, |
| 15008 |
min: 0, |
| 15009 |
max: breakValues.length - 1, |
| 15010 |
withInputField: false, |
| 15011 |
onChange: (value = 0) => { |
| 15012 |
context.onChangeView({ |
| 15013 |
...view, |
| 15014 |
layout: { |
| 15015 |
...view.layout, |
| 15016 |
previewSize: breakValues[value].value |
| 15017 |
} |
| 15018 |
}); |
| 15019 |
}, |
| 15020 |
step: 1, |
| 15021 |
marks |
| 15022 |
} |
| 15023 |
); |
| 15024 |
} |
| 15025 |
|
| 15026 |
// packages/dataviews/build-module/components/dataviews-layouts/utils/grid-config-options.mjs |
| 15027 |
var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1); |
| 15028 |
function GridConfigOptions() { |
| 15029 |
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [ |
| 15030 |
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(DensityPicker, {}), |
| 15031 |
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(PreviewSizePicker, {}) |
| 15032 |
] }); |
| 15033 |
} |
| 15034 |
|
| 15035 |
// packages/dataviews/build-module/components/dataviews-layouts/index.mjs |
| 15036 |
var VIEW_LAYOUTS = [ |
| 15037 |
{ |
| 15038 |
type: LAYOUT_TABLE, |
| 15039 |
label: (0, import_i18n28.__)("Table"), |
| 15040 |
component: table_default, |
| 15041 |
icon: block_table_default, |
| 15042 |
viewConfigOptions: DensityPicker |
| 15043 |
}, |
| 15044 |
{ |
| 15045 |
type: LAYOUT_GRID, |
| 15046 |
label: (0, import_i18n28.__)("Grid"), |
| 15047 |
component: grid_default, |
| 15048 |
icon: category_default, |
| 15049 |
viewConfigOptions: GridConfigOptions |
| 15050 |
}, |
| 15051 |
{ |
| 15052 |
type: LAYOUT_LIST, |
| 15053 |
label: (0, import_i18n28.__)("List"), |
| 15054 |
component: ViewList, |
| 15055 |
icon: (0, import_i18n28.isRTL)() ? format_list_bullets_rtl_default : format_list_bullets_default, |
| 15056 |
viewConfigOptions: DensityPicker |
| 15057 |
}, |
| 15058 |
{ |
| 15059 |
type: LAYOUT_ACTIVITY, |
| 15060 |
label: (0, import_i18n28.__)("Activity"), |
| 15061 |
component: ViewActivity, |
| 15062 |
icon: scheduled_default, |
| 15063 |
viewConfigOptions: DensityPicker |
| 15064 |
}, |
| 15065 |
{ |
| 15066 |
type: LAYOUT_PICKER_GRID, |
| 15067 |
label: (0, import_i18n28.__)("Grid"), |
| 15068 |
component: picker_grid_default, |
| 15069 |
icon: category_default, |
| 15070 |
viewConfigOptions: GridConfigOptions, |
| 15071 |
isPicker: true |
| 15072 |
}, |
| 15073 |
{ |
| 15074 |
type: LAYOUT_PICKER_TABLE, |
| 15075 |
label: (0, import_i18n28.__)("Table"), |
| 15076 |
component: picker_table_default, |
| 15077 |
icon: block_table_default, |
| 15078 |
viewConfigOptions: DensityPicker, |
| 15079 |
isPicker: true |
| 15080 |
}, |
| 15081 |
{ |
| 15082 |
type: LAYOUT_PICKER_ACTIVITY, |
| 15083 |
label: (0, import_i18n28.__)("Activity"), |
| 15084 |
component: ViewPickerActivity, |
| 15085 |
icon: scheduled_default, |
| 15086 |
viewConfigOptions: DensityPicker, |
| 15087 |
isPicker: true |
| 15088 |
} |
| 15089 |
]; |
| 15090 |
|
| 15091 |
// packages/dataviews/build-module/components/dataviews-filters/filters.mjs |
| 15092 |
var import_element48 = __toESM(require_element(), 1); |
| 15093 |
|
| 15094 |
// packages/dataviews/build-module/components/dataviews-filters/filter.mjs |
| 15095 |
var import_components21 = __toESM(require_components(), 1); |
| 15096 |
var import_i18n31 = __toESM(require_i18n(), 1); |
| 15097 |
var import_element45 = __toESM(require_element(), 1); |
| 15098 |
|
| 15099 |
// node_modules/@ariakit/react-components/dist/focusable/focusable-context.js |
| 15100 |
var import_react6 = __toESM(require_react(), 1); |
| 15101 |
var FocusableContext = (0, import_react6.createContext)(true); |
| 15102 |
|
| 15103 |
// node_modules/@ariakit/utils/dist/index.js |
| 15104 |
function toArray(arg) { |
| 15105 |
if (Array.isArray(arg)) return arg; |
| 15106 |
return typeof arg !== "undefined" ? [arg] : []; |
| 15107 |
} |
| 15108 |
function flatten2DArray(array) { |
| 15109 |
const flattened = []; |
| 15110 |
for (const row of array) flattened.push(...row); |
| 15111 |
return flattened; |
| 15112 |
} |
| 15113 |
function reverseArray(array) { |
| 15114 |
return array.slice().reverse(); |
| 15115 |
} |
| 15116 |
var canUseDOM = checkIsBrowser(); |
| 15117 |
function checkIsBrowser() { |
| 15118 |
return typeof window !== "undefined" && !!window.document?.createElement; |
| 15119 |
} |
| 15120 |
function getDocument(node) { |
| 15121 |
if (!node) return document; |
| 15122 |
if ("self" in node) return node.document; |
| 15123 |
return node.ownerDocument || document; |
| 15124 |
} |
| 15125 |
function getActiveElement(node, activeDescendant = false) { |
| 15126 |
const { activeElement: activeElement2 } = getDocument(node); |
| 15127 |
if (!activeElement2?.nodeName) return null; |
| 15128 |
if (isFrame(activeElement2) && activeElement2.contentDocument?.body) return getActiveElement(activeElement2.contentDocument.body, activeDescendant); |
| 15129 |
if (activeDescendant) { |
| 15130 |
const id = activeElement2.getAttribute("aria-activedescendant"); |
| 15131 |
if (id) { |
| 15132 |
const element = getDocument(activeElement2).getElementById(id); |
| 15133 |
if (element) return element; |
| 15134 |
} |
| 15135 |
} |
| 15136 |
return activeElement2; |
| 15137 |
} |
| 15138 |
function contains2(parent, child) { |
| 15139 |
return parent === child || parent.contains(child); |
| 15140 |
} |
| 15141 |
function isElement2(target) { |
| 15142 |
return target?.nodeType === 1; |
| 15143 |
} |
| 15144 |
function isNode2(target) { |
| 15145 |
return typeof target?.nodeType === "number"; |
| 15146 |
} |
| 15147 |
function isFrame(element) { |
| 15148 |
return element.tagName === "IFRAME"; |
| 15149 |
} |
| 15150 |
function isButton(element) { |
| 15151 |
const tagName = element.tagName.toLowerCase(); |
| 15152 |
if (tagName === "button") return true; |
| 15153 |
if (tagName === "input" && element.type) return buttonInputTypes.indexOf(element.type) !== -1; |
| 15154 |
return false; |
| 15155 |
} |
| 15156 |
var buttonInputTypes = [ |
| 15157 |
"button", |
| 15158 |
"color", |
| 15159 |
"file", |
| 15160 |
"image", |
| 15161 |
"reset", |
| 15162 |
"submit" |
| 15163 |
]; |
| 15164 |
function isVisible(element) { |
| 15165 |
if (typeof element.checkVisibility === "function") return element.checkVisibility(); |
| 15166 |
const htmlElement = element; |
| 15167 |
return htmlElement.offsetWidth > 0 || htmlElement.offsetHeight > 0 || element.getClientRects().length > 0; |
| 15168 |
} |
| 15169 |
function isTextField(element) { |
| 15170 |
try { |
| 15171 |
const isTextInput = element instanceof HTMLInputElement && element.selectionStart !== null; |
| 15172 |
const isTextArea = element.tagName === "TEXTAREA"; |
| 15173 |
return isTextInput || isTextArea || false; |
| 15174 |
} catch (_error) { |
| 15175 |
return false; |
| 15176 |
} |
| 15177 |
} |
| 15178 |
function isTextbox(element) { |
| 15179 |
return element.isContentEditable || isTextField(element); |
| 15180 |
} |
| 15181 |
function getTextboxValue(element) { |
| 15182 |
if (isTextField(element)) return element.value; |
| 15183 |
if (element.isContentEditable) { |
| 15184 |
const range = getDocument(element).createRange(); |
| 15185 |
range.selectNodeContents(element); |
| 15186 |
return range.toString(); |
| 15187 |
} |
| 15188 |
return ""; |
| 15189 |
} |
| 15190 |
function getTextboxSelection(element) { |
| 15191 |
let start = 0; |
| 15192 |
let end = 0; |
| 15193 |
if (isTextField(element)) { |
| 15194 |
start = element.selectionStart || 0; |
| 15195 |
end = element.selectionEnd || 0; |
| 15196 |
} else if (element.isContentEditable) { |
| 15197 |
const selection = getDocument(element).getSelection(); |
| 15198 |
if (selection?.rangeCount && selection.anchorNode && contains2(element, selection.anchorNode) && selection.focusNode && contains2(element, selection.focusNode)) { |
| 15199 |
const range = selection.getRangeAt(0); |
| 15200 |
const nextRange = range.cloneRange(); |
| 15201 |
nextRange.selectNodeContents(element); |
| 15202 |
nextRange.setEnd(range.startContainer, range.startOffset); |
| 15203 |
start = nextRange.toString().length; |
| 15204 |
nextRange.setEnd(range.endContainer, range.endOffset); |
| 15205 |
end = nextRange.toString().length; |
| 15206 |
} |
| 15207 |
} |
| 15208 |
return { |
| 15209 |
start, |
| 15210 |
end |
| 15211 |
}; |
| 15212 |
} |
| 15213 |
function getPopupRole(element, fallback) { |
| 15214 |
const allowedPopupRoles = [ |
| 15215 |
"dialog", |
| 15216 |
"menu", |
| 15217 |
"listbox", |
| 15218 |
"tree", |
| 15219 |
"grid" |
| 15220 |
]; |
| 15221 |
const role = element?.getAttribute("role"); |
| 15222 |
if (role && allowedPopupRoles.indexOf(role) !== -1) return role; |
| 15223 |
return fallback; |
| 15224 |
} |
| 15225 |
function getScrollingElement(element) { |
| 15226 |
if (!element) return null; |
| 15227 |
const isScrollableOverflow = (overflow) => { |
| 15228 |
if (overflow === "auto") return true; |
| 15229 |
if (overflow === "scroll") return true; |
| 15230 |
return false; |
| 15231 |
}; |
| 15232 |
if (element.clientHeight && element.scrollHeight > element.clientHeight) { |
| 15233 |
const { overflowY } = getComputedStyle(element); |
| 15234 |
if (isScrollableOverflow(overflowY)) return element; |
| 15235 |
} else if (element.clientWidth && element.scrollWidth > element.clientWidth) { |
| 15236 |
const { overflowX } = getComputedStyle(element); |
| 15237 |
if (isScrollableOverflow(overflowX)) return element; |
| 15238 |
} |
| 15239 |
return getScrollingElement(element.parentElement) || document.scrollingElement || document.body; |
| 15240 |
} |
| 15241 |
function setSelectionRange(element, ...args) { |
| 15242 |
if (/text|search|password|tel|url/i.test(element.type)) element.setSelectionRange(...args); |
| 15243 |
} |
| 15244 |
function sortBasedOnDOMPosition(items, getElement) { |
| 15245 |
const pairs = items.map((item, index2) => [index2, item]); |
| 15246 |
let isOrderDifferent = false; |
| 15247 |
pairs.sort(([indexA, a2], [indexB, b2]) => { |
| 15248 |
const elementA = getElement(a2); |
| 15249 |
const elementB = getElement(b2); |
| 15250 |
if (elementA === elementB) return 0; |
| 15251 |
if (!elementA || !elementB) return 0; |
| 15252 |
if (isElementPreceding(elementA, elementB)) { |
| 15253 |
if (indexA > indexB) isOrderDifferent = true; |
| 15254 |
return -1; |
| 15255 |
} |
| 15256 |
if (indexA < indexB) isOrderDifferent = true; |
| 15257 |
return 1; |
| 15258 |
}); |
| 15259 |
if (isOrderDifferent) return pairs.map(([_, item]) => item); |
| 15260 |
return items; |
| 15261 |
} |
| 15262 |
function isElementPreceding(a2, b2) { |
| 15263 |
return Boolean(b2.compareDocumentPosition(a2) & Node.DOCUMENT_POSITION_PRECEDING); |
| 15264 |
} |
| 15265 |
function isTouchDevice() { |
| 15266 |
return canUseDOM && !!navigator.maxTouchPoints; |
| 15267 |
} |
| 15268 |
function isApple() { |
| 15269 |
if (!canUseDOM) return false; |
| 15270 |
return /mac|iphone|ipad|ipod/i.test(navigator.platform); |
| 15271 |
} |
| 15272 |
function isSafari2() { |
| 15273 |
return canUseDOM && isApple() && /apple/i.test(navigator.vendor); |
| 15274 |
} |
| 15275 |
function isFirefox2() { |
| 15276 |
return canUseDOM && /firefox\//i.test(navigator.userAgent); |
| 15277 |
} |
| 15278 |
function isPortalEvent(event) { |
| 15279 |
const { currentTarget, target } = event; |
| 15280 |
if (!currentTarget) return false; |
| 15281 |
if (!isNode2(target)) return true; |
| 15282 |
return !contains2(currentTarget, target); |
| 15283 |
} |
| 15284 |
function isSelfTarget(event) { |
| 15285 |
return event.target === event.currentTarget; |
| 15286 |
} |
| 15287 |
function isOpeningInNewTab(event) { |
| 15288 |
const element = event.currentTarget; |
| 15289 |
if (!element) return false; |
| 15290 |
const isAppleDevice = isApple(); |
| 15291 |
if (isAppleDevice && !event.metaKey) return false; |
| 15292 |
if (!isAppleDevice && !event.ctrlKey) return false; |
| 15293 |
const tagName = element.tagName.toLowerCase(); |
| 15294 |
if (tagName === "a") return true; |
| 15295 |
if (tagName === "button" && element.type === "submit") return true; |
| 15296 |
if (tagName === "input" && element.type === "submit") return true; |
| 15297 |
return false; |
| 15298 |
} |
| 15299 |
function isDownloading(event) { |
| 15300 |
const element = event.currentTarget; |
| 15301 |
if (!element) return false; |
| 15302 |
const tagName = element.tagName.toLowerCase(); |
| 15303 |
if (!event.altKey) return false; |
| 15304 |
if (tagName === "a") return true; |
| 15305 |
if (tagName === "button" && element.type === "submit") return true; |
| 15306 |
if (tagName === "input" && element.type === "submit") return true; |
| 15307 |
return false; |
| 15308 |
} |
| 15309 |
function fireBlurEvent(element, eventInit) { |
| 15310 |
const event = new FocusEvent("blur", eventInit); |
| 15311 |
const defaultAllowed = element.dispatchEvent(event); |
| 15312 |
const bubbleInit = { |
| 15313 |
...eventInit, |
| 15314 |
bubbles: true |
| 15315 |
}; |
| 15316 |
element.dispatchEvent(new FocusEvent("focusout", bubbleInit)); |
| 15317 |
return defaultAllowed; |
| 15318 |
} |
| 15319 |
function fireKeyboardEvent(element, type, eventInit) { |
| 15320 |
const event = new KeyboardEvent(type, eventInit); |
| 15321 |
return element.dispatchEvent(event); |
| 15322 |
} |
| 15323 |
function fireClickEvent(element, eventInit) { |
| 15324 |
const event = new MouseEvent("click", eventInit); |
| 15325 |
return element.dispatchEvent(event); |
| 15326 |
} |
| 15327 |
function isFocusEventOutside(event, container) { |
| 15328 |
const containerElement = container || event.currentTarget; |
| 15329 |
const relatedTarget = event.relatedTarget; |
| 15330 |
return !isNode2(relatedTarget) || !contains2(containerElement, relatedTarget); |
| 15331 |
} |
| 15332 |
function queueBeforeEvent(element, type, callback, timeout) { |
| 15333 |
const createTimer = (callback2) => { |
| 15334 |
if (timeout) { |
| 15335 |
const timerId2 = setTimeout(callback2, timeout); |
| 15336 |
return () => clearTimeout(timerId2); |
| 15337 |
} |
| 15338 |
const timerId = requestAnimationFrame(callback2); |
| 15339 |
return () => cancelAnimationFrame(timerId); |
| 15340 |
}; |
| 15341 |
const cancelTimer = createTimer(() => { |
| 15342 |
element.removeEventListener(type, callSync, true); |
| 15343 |
callback(); |
| 15344 |
}); |
| 15345 |
const callSync = () => { |
| 15346 |
cancelTimer(); |
| 15347 |
callback(); |
| 15348 |
}; |
| 15349 |
element.addEventListener(type, callSync, { |
| 15350 |
once: true, |
| 15351 |
capture: true |
| 15352 |
}); |
| 15353 |
return cancelTimer; |
| 15354 |
} |
| 15355 |
function addGlobalEventListener(type, listener, options, scope = window) { |
| 15356 |
const children = []; |
| 15357 |
try { |
| 15358 |
scope.document.addEventListener(type, listener, options); |
| 15359 |
for (const frame of Array.from(scope.frames)) children.push(addGlobalEventListener(type, listener, options, frame)); |
| 15360 |
} catch { |
| 15361 |
} |
| 15362 |
const removeEventListener = () => { |
| 15363 |
try { |
| 15364 |
scope.document.removeEventListener(type, listener, options); |
| 15365 |
} catch { |
| 15366 |
} |
| 15367 |
for (const remove of children) remove(); |
| 15368 |
}; |
| 15369 |
return removeEventListener; |
| 15370 |
} |
| 15371 |
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'])"; |
| 15372 |
function isFocusable(element) { |
| 15373 |
if (!element.matches(selector)) return false; |
| 15374 |
if (!isVisible(element)) return false; |
| 15375 |
if (element.closest("[inert]")) return false; |
| 15376 |
return true; |
| 15377 |
} |
| 15378 |
function hasFocus(element) { |
| 15379 |
const activeElement2 = getActiveElement(element); |
| 15380 |
if (!activeElement2) return false; |
| 15381 |
if (activeElement2 === element) return true; |
| 15382 |
const activeDescendant = activeElement2.getAttribute("aria-activedescendant"); |
| 15383 |
if (!activeDescendant) return false; |
| 15384 |
return activeDescendant === element.id; |
| 15385 |
} |
| 15386 |
function hasFocusWithin(element) { |
| 15387 |
const activeElement2 = getActiveElement(element); |
| 15388 |
if (!activeElement2) return false; |
| 15389 |
if (contains2(element, activeElement2)) return true; |
| 15390 |
const activeDescendant = activeElement2.getAttribute("aria-activedescendant"); |
| 15391 |
if (!activeDescendant) return false; |
| 15392 |
if (!("id" in element)) return false; |
| 15393 |
if (activeDescendant === element.id) return true; |
| 15394 |
return !!element.querySelector(`#${CSS.escape(activeDescendant)}`); |
| 15395 |
} |
| 15396 |
function focusIntoView(element, options) { |
| 15397 |
if (!("scrollIntoView" in element)) element.focus(); |
| 15398 |
else { |
| 15399 |
element.focus({ preventScroll: true }); |
| 15400 |
element.scrollIntoView({ |
| 15401 |
block: "nearest", |
| 15402 |
inline: "nearest", |
| 15403 |
...options |
| 15404 |
}); |
| 15405 |
} |
| 15406 |
} |
| 15407 |
function noop5(..._) { |
| 15408 |
} |
| 15409 |
function hasOwnProperty(object, prop) { |
| 15410 |
if (typeof Object.hasOwn === "function") return Object.hasOwn(object, prop); |
| 15411 |
return Object.prototype.hasOwnProperty.call(object, prop); |
| 15412 |
} |
| 15413 |
function chain(...fns) { |
| 15414 |
return (...args) => { |
| 15415 |
for (const fn of fns) if (typeof fn === "function") fn(...args); |
| 15416 |
}; |
| 15417 |
} |
| 15418 |
function normalizeString(str) { |
| 15419 |
return str.normalize("NFD").replace(/[\u0300-\u036f]/g, ""); |
| 15420 |
} |
| 15421 |
function omit(object, keys) { |
| 15422 |
const result = { ...object }; |
| 15423 |
for (const key of keys) if (hasOwnProperty(result, key)) delete result[key]; |
| 15424 |
return result; |
| 15425 |
} |
| 15426 |
function pick(object, paths) { |
| 15427 |
const result = {}; |
| 15428 |
for (const key of paths) if (hasOwnProperty(object, key)) result[key] = object[key]; |
| 15429 |
return result; |
| 15430 |
} |
| 15431 |
function identity(value) { |
| 15432 |
return value; |
| 15433 |
} |
| 15434 |
function invariant(condition, message2) { |
| 15435 |
if (condition) return; |
| 15436 |
if (typeof message2 !== "string") throw new Error("Invariant failed"); |
| 15437 |
throw new Error(message2); |
| 15438 |
} |
| 15439 |
function getKeys(obj) { |
| 15440 |
return Object.keys(obj); |
| 15441 |
} |
| 15442 |
function isFalsyBooleanCallback(booleanOrCallback, ...args) { |
| 15443 |
const result = typeof booleanOrCallback === "function" ? booleanOrCallback(...args) : booleanOrCallback; |
| 15444 |
if (result == null) return false; |
| 15445 |
return !result; |
| 15446 |
} |
| 15447 |
function disabledFromProps(props) { |
| 15448 |
return props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true"; |
| 15449 |
} |
| 15450 |
function removeUndefinedValues(obj) { |
| 15451 |
const result = {}; |
| 15452 |
for (const key in obj) if (obj[key] !== void 0) result[key] = obj[key]; |
| 15453 |
return result; |
| 15454 |
} |
| 15455 |
function defaultValue(...values) { |
| 15456 |
for (const value of values) if (value !== void 0) return value; |
| 15457 |
} |
| 15458 |
function createUndoCallback(callback) { |
| 15459 |
return async () => { |
| 15460 |
const redo = await callback?.(); |
| 15461 |
return createUndoCallback(async () => { |
| 15462 |
await redo?.(); |
| 15463 |
return callback; |
| 15464 |
}); |
| 15465 |
}; |
| 15466 |
} |
| 15467 |
var UndoManager = createUndoManager(); |
| 15468 |
function createUndoManager({ limit = 100 } = {}) { |
| 15469 |
const undoStack = []; |
| 15470 |
let redoStack = []; |
| 15471 |
let currentGroup = null; |
| 15472 |
const canUndo = () => undoStack.length > 0; |
| 15473 |
const canRedo = () => redoStack.length > 0; |
| 15474 |
const undo = async () => { |
| 15475 |
if (!canUndo()) return; |
| 15476 |
currentGroup = null; |
| 15477 |
redoStack.push(await undoStack.pop()?.()); |
| 15478 |
}; |
| 15479 |
const redo = async () => { |
| 15480 |
if (!canRedo()) return; |
| 15481 |
currentGroup = null; |
| 15482 |
undoStack.push(await redoStack.pop()?.()); |
| 15483 |
}; |
| 15484 |
const execute = async (callback, group) => { |
| 15485 |
if (!callback) return; |
| 15486 |
while (undoStack.length > limit) undoStack.shift(); |
| 15487 |
const sameGroup = group === currentGroup; |
| 15488 |
currentGroup = group ?? null; |
| 15489 |
const nextIndex = sameGroup ? Math.max(0, undoStack.length - 1) : undoStack.length; |
| 15490 |
const undoCallback = await callback(); |
| 15491 |
if (!undoCallback) return; |
| 15492 |
redoStack = []; |
| 15493 |
const currentUndo = undoStack[nextIndex]; |
| 15494 |
undoStack[nextIndex] = createUndoCallback(async () => { |
| 15495 |
await undoCallback?.(); |
| 15496 |
const currentRedo = await currentUndo?.(); |
| 15497 |
return async () => { |
| 15498 |
await currentRedo?.(); |
| 15499 |
await callback?.(); |
| 15500 |
}; |
| 15501 |
}); |
| 15502 |
}; |
| 15503 |
return { |
| 15504 |
canUndo, |
| 15505 |
canRedo, |
| 15506 |
undo, |
| 15507 |
redo, |
| 15508 |
execute |
| 15509 |
}; |
| 15510 |
} |
| 15511 |
|
| 15512 |
// node_modules/@ariakit/react-utils/dist/index.js |
| 15513 |
var React47 = __toESM(require_react(), 1); |
| 15514 |
var import_react7 = __toESM(require_react(), 1); |
| 15515 |
var import_jsx_runtime71 = __toESM(require_jsx_runtime(), 1); |
| 15516 |
function setRef(ref, value) { |
| 15517 |
if (typeof ref === "function") ref(value); |
| 15518 |
else if (ref) ref.current = value; |
| 15519 |
} |
| 15520 |
function isValidElementWithRef(element) { |
| 15521 |
if (!element) return false; |
| 15522 |
if (!(0, import_react7.isValidElement)(element)) return false; |
| 15523 |
if ("ref" in element.props) return true; |
| 15524 |
if ("ref" in element) return true; |
| 15525 |
return false; |
| 15526 |
} |
| 15527 |
function getRefProperty(element) { |
| 15528 |
if (!isValidElementWithRef(element)) return null; |
| 15529 |
return { ...element.props }.ref || element.ref; |
| 15530 |
} |
| 15531 |
function mergeProps2(base, overrides) { |
| 15532 |
const props = { ...base }; |
| 15533 |
for (const key in overrides) { |
| 15534 |
if (!hasOwnProperty(overrides, key)) continue; |
| 15535 |
if (key === "className") { |
| 15536 |
const prop = "className"; |
| 15537 |
const baseClass = base[prop]; |
| 15538 |
const overrideClass = overrides[prop]; |
| 15539 |
if (baseClass && overrideClass) props[prop] = `${baseClass} ${overrideClass}`; |
| 15540 |
else props[prop] = overrideClass || baseClass; |
| 15541 |
continue; |
| 15542 |
} |
| 15543 |
if (key === "style") { |
| 15544 |
const prop = "style"; |
| 15545 |
props[prop] = base[prop] ? { |
| 15546 |
...base[prop], |
| 15547 |
...overrides[prop] |
| 15548 |
} : overrides[prop]; |
| 15549 |
continue; |
| 15550 |
} |
| 15551 |
const overrideValue = overrides[key]; |
| 15552 |
if (key.startsWith("on")) { |
| 15553 |
if (typeof overrideValue !== "function") continue; |
| 15554 |
const baseValue = base[key]; |
| 15555 |
if (typeof baseValue === "function") { |
| 15556 |
props[key] = (...args) => { |
| 15557 |
overrideValue(...args); |
| 15558 |
baseValue(...args); |
| 15559 |
}; |
| 15560 |
continue; |
| 15561 |
} |
| 15562 |
} |
| 15563 |
props[key] = overrideValue; |
| 15564 |
} |
| 15565 |
return props; |
| 15566 |
} |
| 15567 |
var _React = { ...React47 }; |
| 15568 |
var useReactId = _React.useId; |
| 15569 |
var useReactDeferredValue = _React.useDeferredValue; |
| 15570 |
var useReactInsertionEffect = _React.useInsertionEffect; |
| 15571 |
var useSafeLayoutEffect = canUseDOM ? import_react7.useLayoutEffect : import_react7.useEffect; |
| 15572 |
function useInitialValue(value) { |
| 15573 |
const [initialValue] = (0, import_react7.useState)(value); |
| 15574 |
return initialValue; |
| 15575 |
} |
| 15576 |
function useLiveRef(value) { |
| 15577 |
const ref = (0, import_react7.useRef)(value); |
| 15578 |
useSafeLayoutEffect(() => { |
| 15579 |
ref.current = value; |
| 15580 |
}); |
| 15581 |
return ref; |
| 15582 |
} |
| 15583 |
function useEvent(callback) { |
| 15584 |
const ref = (0, import_react7.useRef)(() => { |
| 15585 |
throw new Error("Cannot call an event handler while rendering."); |
| 15586 |
}); |
| 15587 |
if (useReactInsertionEffect) useReactInsertionEffect(() => { |
| 15588 |
ref.current = callback; |
| 15589 |
}); |
| 15590 |
else ref.current = callback; |
| 15591 |
return (0, import_react7.useCallback)((...args) => ref.current?.(...args), []); |
| 15592 |
} |
| 15593 |
function useTransactionState(callback) { |
| 15594 |
const [state, setState] = (0, import_react7.useState)(null); |
| 15595 |
useSafeLayoutEffect(() => { |
| 15596 |
if (state == null) return; |
| 15597 |
if (!callback) return; |
| 15598 |
let prevState = null; |
| 15599 |
callback((prev) => { |
| 15600 |
prevState = prev; |
| 15601 |
return state; |
| 15602 |
}); |
| 15603 |
return () => { |
| 15604 |
callback(prevState); |
| 15605 |
}; |
| 15606 |
}, [state, callback]); |
| 15607 |
return [state, setState]; |
| 15608 |
} |
| 15609 |
function useMergeRefs(...refs) { |
| 15610 |
return (0, import_react7.useMemo)(() => { |
| 15611 |
if (!refs.some(Boolean)) return; |
| 15612 |
return (value) => { |
| 15613 |
for (const ref of refs) setRef(ref, value); |
| 15614 |
}; |
| 15615 |
}, refs); |
| 15616 |
} |
| 15617 |
function useId4(defaultId) { |
| 15618 |
if (useReactId) { |
| 15619 |
const reactId = useReactId(); |
| 15620 |
if (defaultId) return defaultId; |
| 15621 |
return reactId; |
| 15622 |
} |
| 15623 |
const [id, setId] = (0, import_react7.useState)(defaultId); |
| 15624 |
useSafeLayoutEffect(() => { |
| 15625 |
if (defaultId || id) return; |
| 15626 |
setId(`id-${Math.random().toString(36).slice(2, 8)}`); |
| 15627 |
}, [defaultId, id]); |
| 15628 |
return defaultId || id; |
| 15629 |
} |
| 15630 |
function useTagName(refOrElement, type) { |
| 15631 |
const stringOrUndefined = (type2) => { |
| 15632 |
if (typeof type2 !== "string") return; |
| 15633 |
return type2; |
| 15634 |
}; |
| 15635 |
const [tagName, setTagName] = (0, import_react7.useState)(() => stringOrUndefined(type)); |
| 15636 |
useSafeLayoutEffect(() => { |
| 15637 |
setTagName((refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement)?.tagName.toLowerCase() || stringOrUndefined(type)); |
| 15638 |
}, [refOrElement, type]); |
| 15639 |
return tagName; |
| 15640 |
} |
| 15641 |
function useAttribute(refOrElement, attributeName, defaultValue2) { |
| 15642 |
const initialValue = useInitialValue(defaultValue2); |
| 15643 |
const [attribute, setAttribute] = (0, import_react7.useState)(initialValue); |
| 15644 |
(0, import_react7.useEffect)(() => { |
| 15645 |
const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement; |
| 15646 |
if (!element) return; |
| 15647 |
const callback = () => { |
| 15648 |
const value = element.getAttribute(attributeName); |
| 15649 |
setAttribute(value == null ? initialValue : value); |
| 15650 |
}; |
| 15651 |
const observer = new MutationObserver(callback); |
| 15652 |
observer.observe(element, { attributeFilter: [attributeName] }); |
| 15653 |
callback(); |
| 15654 |
return () => observer.disconnect(); |
| 15655 |
}, [ |
| 15656 |
refOrElement, |
| 15657 |
attributeName, |
| 15658 |
initialValue |
| 15659 |
]); |
| 15660 |
return attribute; |
| 15661 |
} |
| 15662 |
function useUpdateEffect(effect, deps) { |
| 15663 |
const mounted = (0, import_react7.useRef)(false); |
| 15664 |
(0, import_react7.useEffect)(() => { |
| 15665 |
if (mounted.current) return effect(); |
| 15666 |
mounted.current = true; |
| 15667 |
}, deps); |
| 15668 |
(0, import_react7.useEffect)(() => () => { |
| 15669 |
mounted.current = false; |
| 15670 |
}, []); |
| 15671 |
} |
| 15672 |
function useUpdateLayoutEffect(effect, deps) { |
| 15673 |
const mounted = (0, import_react7.useRef)(false); |
| 15674 |
useSafeLayoutEffect(() => { |
| 15675 |
if (mounted.current) return effect(); |
| 15676 |
mounted.current = true; |
| 15677 |
}, deps); |
| 15678 |
useSafeLayoutEffect(() => () => { |
| 15679 |
mounted.current = false; |
| 15680 |
}, []); |
| 15681 |
} |
| 15682 |
function useForceUpdate() { |
| 15683 |
return (0, import_react7.useReducer)(() => [], []); |
| 15684 |
} |
| 15685 |
function useBooleanEvent(booleanOrCallback) { |
| 15686 |
return useEvent(typeof booleanOrCallback === "function" ? booleanOrCallback : () => booleanOrCallback); |
| 15687 |
} |
| 15688 |
function useWrapElement(props, callback, deps = []) { |
| 15689 |
const wrapElement = (0, import_react7.useCallback)((element) => { |
| 15690 |
if (props.wrapElement) element = props.wrapElement(element); |
| 15691 |
return callback(element); |
| 15692 |
}, [...deps, props.wrapElement]); |
| 15693 |
return { |
| 15694 |
...props, |
| 15695 |
wrapElement |
| 15696 |
}; |
| 15697 |
} |
| 15698 |
function useMetadataProps(props, key, value) { |
| 15699 |
const parent = props.onLoadedMetadataCapture; |
| 15700 |
const onLoadedMetadataCapture = (0, import_react7.useMemo)(() => { |
| 15701 |
return Object.assign(() => { |
| 15702 |
}, parent, ...value !== void 0 ? [{ [key]: value }] : []); |
| 15703 |
}, [ |
| 15704 |
parent, |
| 15705 |
key, |
| 15706 |
value |
| 15707 |
]); |
| 15708 |
return [parent?.[key], { onLoadedMetadataCapture }]; |
| 15709 |
} |
| 15710 |
var hasInstalledGlobalEventListeners = false; |
| 15711 |
function useIsMouseMoving() { |
| 15712 |
(0, import_react7.useEffect)(() => { |
| 15713 |
if (hasInstalledGlobalEventListeners) return; |
| 15714 |
addGlobalEventListener("mousemove", setMouseMoving, true); |
| 15715 |
addGlobalEventListener("mousedown", resetMouseMoving, true); |
| 15716 |
addGlobalEventListener("mouseup", resetMouseMoving, true); |
| 15717 |
addGlobalEventListener("keydown", resetMouseMoving, true); |
| 15718 |
addGlobalEventListener("scroll", resetMouseMoving, true); |
| 15719 |
hasInstalledGlobalEventListeners = true; |
| 15720 |
}, []); |
| 15721 |
return useEvent(() => mouseMoving); |
| 15722 |
} |
| 15723 |
var mouseMoving = false; |
| 15724 |
var previousScreenX = 0; |
| 15725 |
var previousScreenY = 0; |
| 15726 |
function hasMouseMovement(event) { |
| 15727 |
const movementX = event.movementX || event.screenX - previousScreenX; |
| 15728 |
const movementY = event.movementY || event.screenY - previousScreenY; |
| 15729 |
previousScreenX = event.screenX; |
| 15730 |
previousScreenY = event.screenY; |
| 15731 |
return movementX || movementY || false; |
| 15732 |
} |
| 15733 |
function setMouseMoving(event) { |
| 15734 |
if (!hasMouseMovement(event)) return; |
| 15735 |
mouseMoving = true; |
| 15736 |
} |
| 15737 |
function resetMouseMoving() { |
| 15738 |
mouseMoving = false; |
| 15739 |
} |
| 15740 |
function forwardRef20(render4) { |
| 15741 |
const Role = React47.forwardRef((props, ref) => render4({ |
| 15742 |
...props, |
| 15743 |
ref |
| 15744 |
})); |
| 15745 |
Role.displayName = render4.displayName || render4.name; |
| 15746 |
return Role; |
| 15747 |
} |
| 15748 |
function memo3(Component2, propsAreEqual) { |
| 15749 |
return React47.memo(Component2, propsAreEqual); |
| 15750 |
} |
| 15751 |
function createElement3(Type, props) { |
| 15752 |
const { wrapElement, render: render4, ...rest } = props; |
| 15753 |
const mergedRef = useMergeRefs(props.ref, getRefProperty(render4)); |
| 15754 |
let element; |
| 15755 |
if (React47.isValidElement(render4)) { |
| 15756 |
const renderProps = { |
| 15757 |
...render4.props, |
| 15758 |
ref: mergedRef |
| 15759 |
}; |
| 15760 |
element = React47.cloneElement(render4, mergeProps2(rest, renderProps)); |
| 15761 |
} else if (render4) element = render4(rest); |
| 15762 |
else element = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Type, { ...rest }); |
| 15763 |
if (wrapElement) return wrapElement(element); |
| 15764 |
return element; |
| 15765 |
} |
| 15766 |
function createHook(useProps) { |
| 15767 |
const useRole = (props = {}) => { |
| 15768 |
return useProps(props); |
| 15769 |
}; |
| 15770 |
useRole.displayName = useProps.name; |
| 15771 |
return useRole; |
| 15772 |
} |
| 15773 |
function createStoreContext(providers = [], scopedProviders = []) { |
| 15774 |
const context = React47.createContext(void 0); |
| 15775 |
const scopedContext = React47.createContext(void 0); |
| 15776 |
const useContext37 = () => React47.useContext(context); |
| 15777 |
const useScopedContext = (onlyScoped = false) => { |
| 15778 |
const scoped = React47.useContext(scopedContext); |
| 15779 |
const store = useContext37(); |
| 15780 |
if (onlyScoped) return scoped; |
| 15781 |
return scoped || store; |
| 15782 |
}; |
| 15783 |
const useProviderContext = () => { |
| 15784 |
const scoped = React47.useContext(scopedContext); |
| 15785 |
const store = useContext37(); |
| 15786 |
if (scoped && scoped === store) return; |
| 15787 |
return store; |
| 15788 |
}; |
| 15789 |
const ContextProvider = (props) => { |
| 15790 |
return providers.reduceRight((children, Provider2) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Provider2, { |
| 15791 |
...props, |
| 15792 |
children |
| 15793 |
}), /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(context.Provider, { ...props })); |
| 15794 |
}; |
| 15795 |
const ScopedContextProvider = (props) => { |
| 15796 |
return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ContextProvider, { |
| 15797 |
...props, |
| 15798 |
children: scopedProviders.reduceRight((children, Provider2) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Provider2, { |
| 15799 |
...props, |
| 15800 |
children |
| 15801 |
}), /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(scopedContext.Provider, { ...props })) |
| 15802 |
}); |
| 15803 |
}; |
| 15804 |
return { |
| 15805 |
context, |
| 15806 |
scopedContext, |
| 15807 |
useContext: useContext37, |
| 15808 |
useScopedContext, |
| 15809 |
useProviderContext, |
| 15810 |
ContextProvider, |
| 15811 |
ScopedContextProvider |
| 15812 |
}; |
| 15813 |
} |
| 15814 |
|
| 15815 |
// node_modules/@ariakit/react-components/dist/focusable/focusable.js |
| 15816 |
var import_react8 = __toESM(require_react(), 1); |
| 15817 |
var TagName = "div"; |
| 15818 |
var accessibleWhenDisabledSymbol = /* @__PURE__ */ Symbol("accessibleWhenDisabled"); |
| 15819 |
var isSafariBrowser = isSafari2(); |
| 15820 |
var alwaysFocusVisibleInputTypes = [ |
| 15821 |
"text", |
| 15822 |
"search", |
| 15823 |
"url", |
| 15824 |
"tel", |
| 15825 |
"email", |
| 15826 |
"password", |
| 15827 |
"number", |
| 15828 |
"date", |
| 15829 |
"month", |
| 15830 |
"week", |
| 15831 |
"time", |
| 15832 |
"datetime", |
| 15833 |
"datetime-local" |
| 15834 |
]; |
| 15835 |
function isAlwaysFocusVisible(element) { |
| 15836 |
const { tagName, readOnly, type } = element; |
| 15837 |
if (tagName === "TEXTAREA" && !readOnly) return true; |
| 15838 |
if (tagName === "SELECT" && !readOnly) return true; |
| 15839 |
if (tagName === "INPUT" && !readOnly) return alwaysFocusVisibleInputTypes.includes(type); |
| 15840 |
if (element.isContentEditable) return true; |
| 15841 |
if (element.getAttribute("role") === "combobox" && element.dataset.name) return true; |
| 15842 |
return false; |
| 15843 |
} |
| 15844 |
function isNativeTabbable(tagName) { |
| 15845 |
if (!tagName) return true; |
| 15846 |
return tagName === "button" || tagName === "summary" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a"; |
| 15847 |
} |
| 15848 |
function supportsDisabledAttribute(tagName) { |
| 15849 |
if (!tagName) return true; |
| 15850 |
return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea"; |
| 15851 |
} |
| 15852 |
var buttonInputTypes2 = [ |
| 15853 |
"button", |
| 15854 |
"color", |
| 15855 |
"file", |
| 15856 |
"image", |
| 15857 |
"reset", |
| 15858 |
"submit" |
| 15859 |
]; |
| 15860 |
function needsSafariTabIndex(tagName, inputType) { |
| 15861 |
if (tagName === "button") return true; |
| 15862 |
if (tagName === "input" && inputType) { |
| 15863 |
if (inputType === "checkbox" || inputType === "radio") return true; |
| 15864 |
return buttonInputTypes2.includes(inputType); |
| 15865 |
} |
| 15866 |
return false; |
| 15867 |
} |
| 15868 |
function isNativeSubmitControl(element) { |
| 15869 |
if (element.tagName === "BUTTON") { |
| 15870 |
const { type } = element; |
| 15871 |
return type === "submit"; |
| 15872 |
} |
| 15873 |
if (element.tagName === "INPUT") { |
| 15874 |
const { type } = element; |
| 15875 |
return type === "submit" || type === "image"; |
| 15876 |
} |
| 15877 |
return false; |
| 15878 |
} |
| 15879 |
function getTabIndex2({ focusable: focusable2, trulyDisabled, nativeTabbable, supportsDisabled, safariTabIndex, tabIndexProp }) { |
| 15880 |
if (!focusable2) return tabIndexProp; |
| 15881 |
if (trulyDisabled) { |
| 15882 |
if (nativeTabbable && !supportsDisabled) return -1; |
| 15883 |
return; |
| 15884 |
} |
| 15885 |
if (nativeTabbable) { |
| 15886 |
if (safariTabIndex && tabIndexProp == null) return 0; |
| 15887 |
return tabIndexProp; |
| 15888 |
} |
| 15889 |
return tabIndexProp ?? 0; |
| 15890 |
} |
| 15891 |
function useDisableEvent(onEvent, disabled2) { |
| 15892 |
return useEvent((event) => { |
| 15893 |
onEvent?.(event); |
| 15894 |
if (event.defaultPrevented) return; |
| 15895 |
if (disabled2) { |
| 15896 |
event.stopPropagation(); |
| 15897 |
event.preventDefault(); |
| 15898 |
} |
| 15899 |
}); |
| 15900 |
} |
| 15901 |
var hasInstalledGlobalEventListeners2 = false; |
| 15902 |
var isKeyboardModality = true; |
| 15903 |
function onGlobalMouseDown(event) { |
| 15904 |
const target = event.target; |
| 15905 |
if (isElement2(target) && !target.hasAttribute("data-focus-visible")) isKeyboardModality = false; |
| 15906 |
} |
| 15907 |
function onGlobalKeyDown(event) { |
| 15908 |
if (event.metaKey) return; |
| 15909 |
if (event.ctrlKey) return; |
| 15910 |
if (event.altKey) return; |
| 15911 |
isKeyboardModality = true; |
| 15912 |
} |
| 15913 |
var useFocusable = createHook(function useFocusable2({ focusable: focusable2 = true, accessibleWhenDisabled, autoFocus, onFocusVisible, ...props }) { |
| 15914 |
const ref = (0, import_react8.useRef)(null); |
| 15915 |
const [parentAccessibleWhenDisabled, metadataProps] = useMetadataProps(props, accessibleWhenDisabledSymbol, accessibleWhenDisabled); |
| 15916 |
accessibleWhenDisabled ??= parentAccessibleWhenDisabled; |
| 15917 |
(0, import_react8.useEffect)(() => { |
| 15918 |
if (!focusable2) return; |
| 15919 |
if (hasInstalledGlobalEventListeners2) return; |
| 15920 |
addGlobalEventListener("mousedown", onGlobalMouseDown, true); |
| 15921 |
addGlobalEventListener("keydown", onGlobalKeyDown, true); |
| 15922 |
hasInstalledGlobalEventListeners2 = true; |
| 15923 |
}, [focusable2]); |
| 15924 |
const disabled2 = focusable2 && disabledFromProps(props); |
| 15925 |
const trulyDisabled = disabled2 && !accessibleWhenDisabled; |
| 15926 |
const [focusVisible, setFocusVisible] = (0, import_react8.useState)(false); |
| 15927 |
const focusVisibleRef = (0, import_react8.useRef)(false); |
| 15928 |
const nativeSubmitObserverCleanupRef = (0, import_react8.useRef)(null); |
| 15929 |
const cleanupFocusVisible = useEvent((element) => { |
| 15930 |
nativeSubmitObserverCleanupRef.current?.(); |
| 15931 |
nativeSubmitObserverCleanupRef.current = null; |
| 15932 |
focusVisibleRef.current = false; |
| 15933 |
element?.removeAttribute("data-focus-visible"); |
| 15934 |
}); |
| 15935 |
(0, import_react8.useEffect)(() => { |
| 15936 |
if (!focusable2) return; |
| 15937 |
if (!trulyDisabled) return; |
| 15938 |
cleanupFocusVisible(ref.current); |
| 15939 |
if (focusVisible) setFocusVisible(false); |
| 15940 |
}, [ |
| 15941 |
focusable2, |
| 15942 |
trulyDisabled, |
| 15943 |
focusVisible, |
| 15944 |
cleanupFocusVisible |
| 15945 |
]); |
| 15946 |
(0, import_react8.useEffect)(() => { |
| 15947 |
if (!focusable2) return; |
| 15948 |
if (!focusVisible) return; |
| 15949 |
const element = ref.current; |
| 15950 |
if (!element) return; |
| 15951 |
if (typeof IntersectionObserver === "undefined") return; |
| 15952 |
const observer = new IntersectionObserver(() => { |
| 15953 |
if (!isFocusable(element)) { |
| 15954 |
focusVisibleRef.current = false; |
| 15955 |
setFocusVisible(false); |
| 15956 |
} |
| 15957 |
}); |
| 15958 |
observer.observe(element); |
| 15959 |
return () => observer.disconnect(); |
| 15960 |
}, [focusable2, focusVisible]); |
| 15961 |
(0, import_react8.useEffect)(() => { |
| 15962 |
return () => nativeSubmitObserverCleanupRef.current?.(); |
| 15963 |
}, []); |
| 15964 |
const onKeyPressCapture = useDisableEvent(props.onKeyPressCapture, disabled2); |
| 15965 |
const onMouseDownCapture = useDisableEvent(props.onMouseDownCapture, disabled2); |
| 15966 |
const onClickCapture = useDisableEvent(props.onClickCapture, disabled2); |
| 15967 |
const handleFocusVisible = (event, currentTarget) => { |
| 15968 |
if (currentTarget) event.currentTarget = currentTarget; |
| 15969 |
if (!focusable2) return; |
| 15970 |
const element = event.currentTarget; |
| 15971 |
if (!element) return; |
| 15972 |
if (!hasFocus(element)) return; |
| 15973 |
onFocusVisible?.(event); |
| 15974 |
if (event.defaultPrevented) return; |
| 15975 |
element.dataset.focusVisible = "true"; |
| 15976 |
focusVisibleRef.current = true; |
| 15977 |
if (isNativeSubmitControl(element)) { |
| 15978 |
nativeSubmitObserverCleanupRef.current?.(); |
| 15979 |
nativeSubmitObserverCleanupRef.current = null; |
| 15980 |
if (typeof IntersectionObserver !== "undefined") { |
| 15981 |
const observer = new IntersectionObserver(() => { |
| 15982 |
if (isFocusable(element)) return; |
| 15983 |
cleanupFocusVisible(element); |
| 15984 |
}); |
| 15985 |
observer.observe(element); |
| 15986 |
nativeSubmitObserverCleanupRef.current = () => observer.disconnect(); |
| 15987 |
} |
| 15988 |
return; |
| 15989 |
} |
| 15990 |
setFocusVisible(true); |
| 15991 |
}; |
| 15992 |
const onKeyDownCaptureProp = props.onKeyDownCapture; |
| 15993 |
const onKeyDownCapture = useEvent((event) => { |
| 15994 |
onKeyDownCaptureProp?.(event); |
| 15995 |
if (event.defaultPrevented) return; |
| 15996 |
if (!focusable2) return; |
| 15997 |
if (focusVisible) return; |
| 15998 |
if (focusVisibleRef.current) return; |
| 15999 |
if (event.metaKey) return; |
| 16000 |
if (event.altKey) return; |
| 16001 |
if (event.ctrlKey) return; |
| 16002 |
if (!isSelfTarget(event)) return; |
| 16003 |
const element = event.currentTarget; |
| 16004 |
const applyFocusVisible = () => handleFocusVisible(event, element); |
| 16005 |
queueBeforeEvent(element, "focusout", applyFocusVisible); |
| 16006 |
}); |
| 16007 |
const onFocusCaptureProp = props.onFocusCapture; |
| 16008 |
const onFocusCapture = useEvent((event) => { |
| 16009 |
onFocusCaptureProp?.(event); |
| 16010 |
if (event.defaultPrevented) return; |
| 16011 |
if (!focusable2) return; |
| 16012 |
if (!isSelfTarget(event)) { |
| 16013 |
setFocusVisible(false); |
| 16014 |
return; |
| 16015 |
} |
| 16016 |
const element = event.currentTarget; |
| 16017 |
const applyFocusVisible = () => handleFocusVisible(event, element); |
| 16018 |
if (isKeyboardModality || isAlwaysFocusVisible(event.target)) queueBeforeEvent(event.target, "focusout", applyFocusVisible); |
| 16019 |
else setFocusVisible(false); |
| 16020 |
}); |
| 16021 |
const onBlurProp = props.onBlur; |
| 16022 |
const onBlur = useEvent((event) => { |
| 16023 |
onBlurProp?.(event); |
| 16024 |
if (!focusable2) return; |
| 16025 |
if (!isFocusEventOutside(event)) return; |
| 16026 |
cleanupFocusVisible(event.currentTarget); |
| 16027 |
setFocusVisible(false); |
| 16028 |
}); |
| 16029 |
const autoFocusOnShow = (0, import_react8.useContext)(FocusableContext); |
| 16030 |
const autoFocusRef = useEvent((element) => { |
| 16031 |
if (!focusable2) return; |
| 16032 |
if (!autoFocus) return; |
| 16033 |
if (!element) return; |
| 16034 |
if (!autoFocusOnShow) return; |
| 16035 |
queueMicrotask(() => { |
| 16036 |
if (hasFocus(element)) return; |
| 16037 |
if (!isFocusable(element)) return; |
| 16038 |
element.focus(); |
| 16039 |
}); |
| 16040 |
}); |
| 16041 |
const tagName = useTagName(ref); |
| 16042 |
const nativeTabbable = focusable2 && isNativeTabbable(tagName); |
| 16043 |
const supportsDisabled = focusable2 && supportsDisabledAttribute(tagName); |
| 16044 |
const [safariTabIndex, setSafariTabIndex] = (0, import_react8.useState)(false); |
| 16045 |
if (isSafariBrowser) (0, import_react8.useEffect)(() => { |
| 16046 |
if (!focusable2) return; |
| 16047 |
const element = ref.current; |
| 16048 |
if (!element) return; |
| 16049 |
const tag = element.tagName.toLowerCase(); |
| 16050 |
const type = element.type; |
| 16051 |
setSafariTabIndex(needsSafariTabIndex(tag, type)); |
| 16052 |
}, [focusable2]); |
| 16053 |
const styleProp = props.style; |
| 16054 |
const style = (0, import_react8.useMemo)(() => { |
| 16055 |
if (trulyDisabled) return { |
| 16056 |
pointerEvents: "none", |
| 16057 |
...styleProp |
| 16058 |
}; |
| 16059 |
return styleProp; |
| 16060 |
}, [trulyDisabled, styleProp]); |
| 16061 |
props = { |
| 16062 |
"data-focus-visible": focusable2 && focusVisible || void 0, |
| 16063 |
"data-autofocus": autoFocus || void 0, |
| 16064 |
"aria-disabled": disabled2 || void 0, |
| 16065 |
...props, |
| 16066 |
...metadataProps, |
| 16067 |
ref: useMergeRefs(ref, autoFocusRef, props.ref), |
| 16068 |
style, |
| 16069 |
tabIndex: getTabIndex2({ |
| 16070 |
focusable: focusable2, |
| 16071 |
trulyDisabled, |
| 16072 |
nativeTabbable, |
| 16073 |
supportsDisabled, |
| 16074 |
safariTabIndex, |
| 16075 |
tabIndexProp: props.tabIndex |
| 16076 |
}), |
| 16077 |
disabled: supportsDisabled && trulyDisabled ? true : void 0, |
| 16078 |
contentEditable: disabled2 ? void 0 : props.contentEditable, |
| 16079 |
onKeyPressCapture, |
| 16080 |
onClickCapture, |
| 16081 |
onMouseDownCapture, |
| 16082 |
onKeyDownCapture, |
| 16083 |
onFocusCapture, |
| 16084 |
onBlur |
| 16085 |
}; |
| 16086 |
return removeUndefinedValues(props); |
| 16087 |
}); |
| 16088 |
var Focusable = forwardRef20(function Focusable2(props) { |
| 16089 |
return createElement3(TagName, useFocusable(props)); |
| 16090 |
}); |
| 16091 |
|
| 16092 |
// node_modules/@ariakit/react-components/dist/command/command.js |
| 16093 |
var import_react9 = __toESM(require_react(), 1); |
| 16094 |
var TagName2 = "button"; |
| 16095 |
function isNativeClick(event) { |
| 16096 |
if (!event.isTrusted) return false; |
| 16097 |
const element = event.currentTarget; |
| 16098 |
if (event.key === "Enter") return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "A"; |
| 16099 |
if (event.key === " ") return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "INPUT" || element.tagName === "SELECT"; |
| 16100 |
return false; |
| 16101 |
} |
| 16102 |
var symbol = /* @__PURE__ */ Symbol("command"); |
| 16103 |
var useCommand = createHook(function useCommand2({ clickOnEnter = true, clickOnSpace = true, ...props }) { |
| 16104 |
const ref = (0, import_react9.useRef)(null); |
| 16105 |
const [isNativeButton, setIsNativeButton] = (0, import_react9.useState)(false); |
| 16106 |
(0, import_react9.useEffect)(() => { |
| 16107 |
if (!ref.current) return; |
| 16108 |
setIsNativeButton(isButton(ref.current)); |
| 16109 |
}, []); |
| 16110 |
const [active, setActive] = (0, import_react9.useState)(false); |
| 16111 |
const activeRef = (0, import_react9.useRef)(false); |
| 16112 |
const disabled2 = disabledFromProps(props); |
| 16113 |
const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true); |
| 16114 |
const onKeyDownProp = props.onKeyDown; |
| 16115 |
const onKeyDown = useEvent((event) => { |
| 16116 |
onKeyDownProp?.(event); |
| 16117 |
const element = event.currentTarget; |
| 16118 |
if (event.defaultPrevented) return; |
| 16119 |
if (isDuplicate) return; |
| 16120 |
if (disabled2) return; |
| 16121 |
if (!isSelfTarget(event)) return; |
| 16122 |
if (isTextField(element)) return; |
| 16123 |
if (element.isContentEditable) return; |
| 16124 |
const isEnter = clickOnEnter && event.key === "Enter"; |
| 16125 |
const isSpace = clickOnSpace && event.key === " "; |
| 16126 |
const shouldPreventEnter = event.key === "Enter" && !clickOnEnter; |
| 16127 |
const shouldPreventSpace = event.key === " " && !clickOnSpace; |
| 16128 |
if (shouldPreventEnter || shouldPreventSpace) { |
| 16129 |
event.preventDefault(); |
| 16130 |
return; |
| 16131 |
} |
| 16132 |
if (isEnter || isSpace) { |
| 16133 |
const nativeClick = isNativeClick(event); |
| 16134 |
if (isEnter) { |
| 16135 |
if (!nativeClick) { |
| 16136 |
event.preventDefault(); |
| 16137 |
const { view, ...eventInit } = event; |
| 16138 |
const click = () => fireClickEvent(element, eventInit); |
| 16139 |
if (isFirefox2()) queueBeforeEvent(element, "keyup", click); |
| 16140 |
else queueMicrotask(click); |
| 16141 |
} |
| 16142 |
} else if (isSpace) { |
| 16143 |
activeRef.current = true; |
| 16144 |
if (!nativeClick) { |
| 16145 |
event.preventDefault(); |
| 16146 |
setActive(true); |
| 16147 |
} |
| 16148 |
} |
| 16149 |
} |
| 16150 |
}); |
| 16151 |
const onKeyUpProp = props.onKeyUp; |
| 16152 |
const onKeyUp = useEvent((event) => { |
| 16153 |
onKeyUpProp?.(event); |
| 16154 |
if (event.defaultPrevented) return; |
| 16155 |
if (isDuplicate) return; |
| 16156 |
if (disabled2) return; |
| 16157 |
if (event.metaKey) return; |
| 16158 |
const isSpace = clickOnSpace && event.key === " "; |
| 16159 |
if (activeRef.current && isSpace) { |
| 16160 |
activeRef.current = false; |
| 16161 |
if (!isNativeClick(event)) { |
| 16162 |
event.preventDefault(); |
| 16163 |
setActive(false); |
| 16164 |
const element = event.currentTarget; |
| 16165 |
const { view, ...eventInit } = event; |
| 16166 |
queueMicrotask(() => fireClickEvent(element, eventInit)); |
| 16167 |
} |
| 16168 |
} |
| 16169 |
}); |
| 16170 |
props = { |
| 16171 |
"data-active": active || void 0, |
| 16172 |
type: isNativeButton ? "button" : void 0, |
| 16173 |
...metadataProps, |
| 16174 |
...props, |
| 16175 |
ref: useMergeRefs(ref, props.ref), |
| 16176 |
onKeyDown, |
| 16177 |
onKeyUp |
| 16178 |
}; |
| 16179 |
props = useFocusable(props); |
| 16180 |
return props; |
| 16181 |
}); |
| 16182 |
var Command = forwardRef20(function Command2(props) { |
| 16183 |
return createElement3(TagName2, useCommand(props)); |
| 16184 |
}); |
| 16185 |
|
| 16186 |
// node_modules/@ariakit/react-components/dist/collection/collection-context.js |
| 16187 |
var ctx = createStoreContext(); |
| 16188 |
var useCollectionContext = ctx.useContext; |
| 16189 |
var useCollectionScopedContext = ctx.useScopedContext; |
| 16190 |
var useCollectionProviderContext = ctx.useProviderContext; |
| 16191 |
var CollectionContextProvider = ctx.ContextProvider; |
| 16192 |
var CollectionScopedContextProvider = ctx.ScopedContextProvider; |
| 16193 |
|
| 16194 |
// node_modules/@ariakit/react-components/dist/collection/collection-item.js |
| 16195 |
var import_react10 = __toESM(require_react(), 1); |
| 16196 |
var TagName3 = "div"; |
| 16197 |
var useCollectionItem = createHook(function useCollectionItem2({ store, shouldRegisterItem = true, getItem = identity, element, ...props }) { |
| 16198 |
const context = useCollectionContext(); |
| 16199 |
store = store || context; |
| 16200 |
const id = useId4(props.id); |
| 16201 |
const ref = (0, import_react10.useRef)(element); |
| 16202 |
(0, import_react10.useEffect)(() => { |
| 16203 |
const element2 = ref.current; |
| 16204 |
if (!id) return; |
| 16205 |
if (!element2) return; |
| 16206 |
if (!shouldRegisterItem) return; |
| 16207 |
const item = getItem({ |
| 16208 |
id, |
| 16209 |
element: element2 |
| 16210 |
}); |
| 16211 |
return store?.renderItem(item); |
| 16212 |
}, [ |
| 16213 |
id, |
| 16214 |
shouldRegisterItem, |
| 16215 |
getItem, |
| 16216 |
store |
| 16217 |
]); |
| 16218 |
props = { |
| 16219 |
...props, |
| 16220 |
ref: useMergeRefs(ref, props.ref) |
| 16221 |
}; |
| 16222 |
return removeUndefinedValues(props); |
| 16223 |
}); |
| 16224 |
var CollectionItem = forwardRef20(function CollectionItem2(props) { |
| 16225 |
return createElement3(TagName3, useCollectionItem(props)); |
| 16226 |
}); |
| 16227 |
|
| 16228 |
// node_modules/@ariakit/react-components/dist/composite/composite-context.js |
| 16229 |
var import_react11 = __toESM(require_react(), 1); |
| 16230 |
var ctx2 = createStoreContext([CollectionContextProvider], [CollectionScopedContextProvider]); |
| 16231 |
var useCompositeContext = ctx2.useContext; |
| 16232 |
var useCompositeScopedContext = ctx2.useScopedContext; |
| 16233 |
var useCompositeProviderContext = ctx2.useProviderContext; |
| 16234 |
var CompositeContextProvider = ctx2.ContextProvider; |
| 16235 |
var CompositeScopedContextProvider = ctx2.ScopedContextProvider; |
| 16236 |
var CompositeItemContext = (0, import_react11.createContext)(void 0); |
| 16237 |
var CompositeRowContext = (0, import_react11.createContext)(void 0); |
| 16238 |
|
| 16239 |
// node_modules/@ariakit/react-components/dist/composite/utils.js |
| 16240 |
function findFirstEnabledItem(items, excludeId) { |
| 16241 |
return items.find((item) => { |
| 16242 |
if (excludeId) return !item.disabled && item.id !== excludeId; |
| 16243 |
return !item.disabled; |
| 16244 |
}); |
| 16245 |
} |
| 16246 |
function getEnabledItem(store, id) { |
| 16247 |
if (!id) return null; |
| 16248 |
return store.item(id) || null; |
| 16249 |
} |
| 16250 |
function groupItemsByRows(items) { |
| 16251 |
const rows = []; |
| 16252 |
for (const item of items) { |
| 16253 |
const row = rows.find((currentRow) => currentRow[0]?.rowId === item.rowId); |
| 16254 |
if (row) row.push(item); |
| 16255 |
else rows.push([item]); |
| 16256 |
} |
| 16257 |
return rows; |
| 16258 |
} |
| 16259 |
function selectTextField(element, collapseToEnd = false) { |
| 16260 |
if (isTextField(element)) element.setSelectionRange(collapseToEnd ? element.value.length : 0, element.value.length); |
| 16261 |
else if (element.isContentEditable) { |
| 16262 |
const selection = getDocument(element).getSelection(); |
| 16263 |
selection?.selectAllChildren(element); |
| 16264 |
if (collapseToEnd) selection?.collapseToEnd(); |
| 16265 |
} |
| 16266 |
} |
| 16267 |
var FOCUS_SILENTLY = /* @__PURE__ */ Symbol("FOCUS_SILENTLY"); |
| 16268 |
function focusSilently(element) { |
| 16269 |
element[FOCUS_SILENTLY] = true; |
| 16270 |
element.focus({ preventScroll: true }); |
| 16271 |
} |
| 16272 |
function silentlyFocused(element) { |
| 16273 |
const isSilentlyFocused = element[FOCUS_SILENTLY]; |
| 16274 |
delete element[FOCUS_SILENTLY]; |
| 16275 |
return isSilentlyFocused; |
| 16276 |
} |
| 16277 |
function isItem(store, element, exclude) { |
| 16278 |
if (!element) return false; |
| 16279 |
if (element === exclude) return false; |
| 16280 |
const item = store.item(element.id); |
| 16281 |
if (!item) return false; |
| 16282 |
if (exclude && item.element === exclude) return false; |
| 16283 |
return true; |
| 16284 |
} |
| 16285 |
|
| 16286 |
// node_modules/@ariakit/react-components/dist/composite/composite-item.js |
| 16287 |
var import_react12 = __toESM(require_react(), 1); |
| 16288 |
var import_jsx_runtime72 = __toESM(require_jsx_runtime(), 1); |
| 16289 |
|
| 16290 |
// node_modules/@ariakit/store/dist/index.js |
| 16291 |
function getInternal(store, key) { |
| 16292 |
const internals = store.__unstableInternals; |
| 16293 |
invariant(internals, "Invalid store"); |
| 16294 |
return internals[key]; |
| 16295 |
} |
| 16296 |
function hasUpdatedKey(keys, updatedKey) { |
| 16297 |
if (!keys) return true; |
| 16298 |
for (const currentKey of keys) if (updatedKey instanceof Set) { |
| 16299 |
if (updatedKey.has(currentKey)) return true; |
| 16300 |
} else if (currentKey === updatedKey) return true; |
| 16301 |
return false; |
| 16302 |
} |
| 16303 |
function addKeyedListener(map, keys, listener) { |
| 16304 |
if (!keys) return; |
| 16305 |
for (const key of keys) { |
| 16306 |
let listeners = map.get(key); |
| 16307 |
if (!listeners) { |
| 16308 |
listeners = /* @__PURE__ */ new Set(); |
| 16309 |
map.set(key, listeners); |
| 16310 |
} |
| 16311 |
listeners.add(listener); |
| 16312 |
} |
| 16313 |
} |
| 16314 |
function deleteKeyedListener(map, keys, listener) { |
| 16315 |
if (!map) return; |
| 16316 |
if (!keys) return; |
| 16317 |
for (const key of keys) { |
| 16318 |
const listeners = map.get(key); |
| 16319 |
if (!listeners) continue; |
| 16320 |
listeners.delete(listener); |
| 16321 |
if (!listeners.size) map.delete(key); |
| 16322 |
} |
| 16323 |
} |
| 16324 |
function createStore(initialState, ...stores) { |
| 16325 |
let state = initialState; |
| 16326 |
let prevStateBatch = state; |
| 16327 |
let destroy = noop5; |
| 16328 |
let batchPending = false; |
| 16329 |
let inDispatch = false; |
| 16330 |
let updatedKeys = /* @__PURE__ */ new Set(); |
| 16331 |
const instances = /* @__PURE__ */ new Set(); |
| 16332 |
const setups = /* @__PURE__ */ new Set(); |
| 16333 |
const syncListenerGroup = { |
| 16334 |
listeners: /* @__PURE__ */ new Set(), |
| 16335 |
disposables: /* @__PURE__ */ new Map(), |
| 16336 |
listenerKeys: /* @__PURE__ */ new WeakMap() |
| 16337 |
}; |
| 16338 |
const batchListenerGroup = { |
| 16339 |
listeners: /* @__PURE__ */ new Set(), |
| 16340 |
disposables: /* @__PURE__ */ new Map(), |
| 16341 |
listenerKeys: /* @__PURE__ */ new WeakMap() |
| 16342 |
}; |
| 16343 |
const storeSetup = (callback) => { |
| 16344 |
setups.add(callback); |
| 16345 |
return () => setups.delete(callback); |
| 16346 |
}; |
| 16347 |
const storeInit = () => { |
| 16348 |
const initializedInstances = instances.size; |
| 16349 |
const instance = /* @__PURE__ */ Symbol(); |
| 16350 |
instances.add(instance); |
| 16351 |
const maybeDestroy = () => { |
| 16352 |
instances.delete(instance); |
| 16353 |
if (instances.size) return; |
| 16354 |
destroy(); |
| 16355 |
}; |
| 16356 |
if (initializedInstances) return maybeDestroy; |
| 16357 |
const stateKeys = getKeys(state); |
| 16358 |
const desyncs = []; |
| 16359 |
for (const store of stores) { |
| 16360 |
const storeState = store?.getState?.(); |
| 16361 |
if (!storeState) continue; |
| 16362 |
const keys = stateKeys.filter((key) => hasOwnProperty(storeState, key)); |
| 16363 |
if (!keys.length) continue; |
| 16364 |
if (stores.length === 1 || keys.length === stateKeys.length) { |
| 16365 |
for (const key of keys) desyncs.push(sync(store, [key], (state2) => { |
| 16366 |
setState(key, state2[key], true); |
| 16367 |
})); |
| 16368 |
continue; |
| 16369 |
} |
| 16370 |
let didSyncInitialState = false; |
| 16371 |
desyncs.push(sync(store, keys, (state2, prevState) => { |
| 16372 |
for (const key of keys) { |
| 16373 |
if (didSyncInitialState && state2[key] === prevState[key]) continue; |
| 16374 |
setState(key, state2[key], true); |
| 16375 |
} |
| 16376 |
didSyncInitialState = true; |
| 16377 |
})); |
| 16378 |
} |
| 16379 |
const teardowns = []; |
| 16380 |
for (const setup2 of setups) teardowns.push(setup2()); |
| 16381 |
const cleanups = stores.map(init); |
| 16382 |
destroy = chain(...desyncs, ...teardowns, ...cleanups); |
| 16383 |
return maybeDestroy; |
| 16384 |
}; |
| 16385 |
const deleteListenerIndexes = (group, listener, keys) => { |
| 16386 |
if (keys === void 0) return; |
| 16387 |
if (keys) deleteKeyedListener(group.listenersByKey, keys, listener); |
| 16388 |
else group.allKeysListeners?.delete(listener); |
| 16389 |
}; |
| 16390 |
const registerListener = (keys, listener, group = syncListenerGroup) => { |
| 16391 |
const listenerKeysValue = keys ? [...keys] : null; |
| 16392 |
if (group.listeners.has(listener)) deleteListenerIndexes(group, listener, group.listenerKeys.get(listener)); |
| 16393 |
group.listeners.add(listener); |
| 16394 |
if (listenerKeysValue) { |
| 16395 |
group.listenersByKey ??= /* @__PURE__ */ new Map(); |
| 16396 |
addKeyedListener(group.listenersByKey, listenerKeysValue, listener); |
| 16397 |
} else { |
| 16398 |
group.allKeysListeners ??= /* @__PURE__ */ new Set(); |
| 16399 |
group.allKeysListeners.add(listener); |
| 16400 |
} |
| 16401 |
group.listenerKeys.set(listener, listenerKeysValue); |
| 16402 |
return () => { |
| 16403 |
group.disposables.get(listener)?.(); |
| 16404 |
group.disposables.delete(listener); |
| 16405 |
const currentKeys = group.listenerKeys.get(listener); |
| 16406 |
deleteListenerIndexes(group, listener, listenerKeysValue); |
| 16407 |
if (currentKeys !== listenerKeysValue) deleteListenerIndexes(group, listener, currentKeys); |
| 16408 |
group.listenerKeys.delete(listener); |
| 16409 |
group.listeners.delete(listener); |
| 16410 |
}; |
| 16411 |
}; |
| 16412 |
const storeSubscribe = (keys, listener) => registerListener(keys, listener); |
| 16413 |
const reconcileInitialCleanup = (group, listener, cleanup) => { |
| 16414 |
if (cleanup) group.disposables.set(listener, cleanup); |
| 16415 |
else group.disposables.delete(listener); |
| 16416 |
}; |
| 16417 |
const storeSync = (keys, listener) => { |
| 16418 |
reconcileInitialCleanup(syncListenerGroup, listener, listener(state, state)); |
| 16419 |
return registerListener(keys, listener); |
| 16420 |
}; |
| 16421 |
const storeBatch = (keys, listener) => { |
| 16422 |
if (!batchListenerGroup.listeners.size && !inDispatch) prevStateBatch = state; |
| 16423 |
reconcileInitialCleanup(batchListenerGroup, listener, listener(state, prevStateBatch)); |
| 16424 |
return registerListener(keys, listener, batchListenerGroup); |
| 16425 |
}; |
| 16426 |
const storePick = (keys) => createStore(pick(state, keys), finalStore); |
| 16427 |
const storeOmit = (keys) => createStore(omit(state, keys), finalStore); |
| 16428 |
const getState = () => state; |
| 16429 |
const runListeners = (group, prevState, updatedKey) => { |
| 16430 |
const { disposables } = group; |
| 16431 |
if (!(updatedKey instanceof Set) && !group.allKeysListeners?.size) { |
| 16432 |
const keyedListeners = group.listenersByKey?.get(updatedKey); |
| 16433 |
if (!keyedListeners) return; |
| 16434 |
for (const listener of keyedListeners) { |
| 16435 |
const cleanup = disposables.size ? disposables.get(listener) : void 0; |
| 16436 |
if (cleanup) cleanup(); |
| 16437 |
const result = listener(state, prevState); |
| 16438 |
if (result) disposables.set(listener, result); |
| 16439 |
else if (cleanup) disposables.delete(listener); |
| 16440 |
} |
| 16441 |
return; |
| 16442 |
} |
| 16443 |
const allKeysListeners = group.allKeysListeners; |
| 16444 |
for (const listener of group.listeners) { |
| 16445 |
if (!allKeysListeners?.has(listener)) { |
| 16446 |
if (!hasUpdatedKey(group.listenerKeys.get(listener), updatedKey)) continue; |
| 16447 |
} |
| 16448 |
const cleanup = disposables.size ? disposables.get(listener) : void 0; |
| 16449 |
if (cleanup) cleanup(); |
| 16450 |
const result = listener(state, prevState); |
| 16451 |
if (result) disposables.set(listener, result); |
| 16452 |
else if (cleanup) disposables.delete(listener); |
| 16453 |
} |
| 16454 |
}; |
| 16455 |
const setState = (key, value, fromStores = false) => { |
| 16456 |
if (!hasOwnProperty(state, key)) return; |
| 16457 |
const currentValue = state[key]; |
| 16458 |
const nextValue = typeof value === "function" ? value(currentValue) : value; |
| 16459 |
if (nextValue === currentValue) return; |
| 16460 |
if (!fromStores && stores.length) for (const store of stores) store?.setState?.(key, nextValue); |
| 16461 |
const prevState = state; |
| 16462 |
state = { |
| 16463 |
...state, |
| 16464 |
[key]: nextValue |
| 16465 |
}; |
| 16466 |
const wasInDispatch = inDispatch; |
| 16467 |
inDispatch = true; |
| 16468 |
try { |
| 16469 |
runListeners(syncListenerGroup, prevState, key); |
| 16470 |
} finally { |
| 16471 |
inDispatch = wasInDispatch; |
| 16472 |
} |
| 16473 |
if (!batchListenerGroup.listeners.size) { |
| 16474 |
if (!inDispatch) prevStateBatch = state; |
| 16475 |
return; |
| 16476 |
} |
| 16477 |
updatedKeys.add(key); |
| 16478 |
if (batchPending) return; |
| 16479 |
batchPending = true; |
| 16480 |
queueMicrotask(() => { |
| 16481 |
batchPending = false; |
| 16482 |
const snapshot = state; |
| 16483 |
const updatedKeysSnapshot = updatedKeys; |
| 16484 |
updatedKeys = /* @__PURE__ */ new Set(); |
| 16485 |
const prevStateBatchBefore = prevStateBatch; |
| 16486 |
runListeners(batchListenerGroup, prevStateBatchBefore, updatedKeysSnapshot); |
| 16487 |
if (prevStateBatch === prevStateBatchBefore) prevStateBatch = snapshot; |
| 16488 |
}); |
| 16489 |
}; |
| 16490 |
const finalStore = { |
| 16491 |
getState, |
| 16492 |
setState, |
| 16493 |
__unstableInternals: { |
| 16494 |
setup: storeSetup, |
| 16495 |
init: storeInit, |
| 16496 |
subscribe: storeSubscribe, |
| 16497 |
sync: storeSync, |
| 16498 |
batch: storeBatch, |
| 16499 |
pick: storePick, |
| 16500 |
omit: storeOmit |
| 16501 |
} |
| 16502 |
}; |
| 16503 |
return finalStore; |
| 16504 |
} |
| 16505 |
function setup(store, ...args) { |
| 16506 |
if (!store) return; |
| 16507 |
return getInternal(store, "setup")(...args); |
| 16508 |
} |
| 16509 |
function init(store, ...args) { |
| 16510 |
if (!store) return; |
| 16511 |
return getInternal(store, "init")(...args); |
| 16512 |
} |
| 16513 |
function subscribe(store, ...args) { |
| 16514 |
if (!store) return; |
| 16515 |
return getInternal(store, "subscribe")(...args); |
| 16516 |
} |
| 16517 |
function sync(store, ...args) { |
| 16518 |
if (!store) return; |
| 16519 |
return getInternal(store, "sync")(...args); |
| 16520 |
} |
| 16521 |
function batch(store, ...args) { |
| 16522 |
if (!store) return; |
| 16523 |
return getInternal(store, "batch")(...args); |
| 16524 |
} |
| 16525 |
function omit2(store, ...args) { |
| 16526 |
if (!store) return; |
| 16527 |
return getInternal(store, "omit")(...args); |
| 16528 |
} |
| 16529 |
function pick2(store, ...args) { |
| 16530 |
if (!store) return; |
| 16531 |
return getInternal(store, "pick")(...args); |
| 16532 |
} |
| 16533 |
function mergeStore(...stores) { |
| 16534 |
const initialState = {}; |
| 16535 |
for (const store2 of stores) { |
| 16536 |
const nextState = store2?.getState?.(); |
| 16537 |
if (nextState) Object.assign(initialState, nextState); |
| 16538 |
} |
| 16539 |
const store = createStore(initialState, ...stores); |
| 16540 |
return Object.assign({}, ...stores, store); |
| 16541 |
} |
| 16542 |
function throwOnConflictingProps(props, store) { |
| 16543 |
if (false) return; |
| 16544 |
if (!store) return; |
| 16545 |
const defaultKeys = Object.entries(props).filter(([key, value]) => key.startsWith("default") && value !== void 0).map(([key]) => { |
| 16546 |
const stateKey = key.replace("default", ""); |
| 16547 |
return `${stateKey[0]?.toLowerCase() || ""}${stateKey.slice(1)}`; |
| 16548 |
}); |
| 16549 |
if (!defaultKeys.length) return; |
| 16550 |
const storeState = store.getState(); |
| 16551 |
if (!defaultKeys.filter((key) => hasOwnProperty(storeState, key)).length) return; |
| 16552 |
throw new Error(`Passing a store prop in conjunction with a default state is not supported. |
| 16553 |
|
| 16554 |
const store = useSelectStore(); |
| 16555 |
<SelectProvider store={store} defaultValue="Apple" /> |
| 16556 |
^ ^ |
| 16557 |
|
| 16558 |
Instead, pass the default state to the topmost store: |
| 16559 |
|
| 16560 |
const store = useSelectStore({ defaultValue: "Apple" }); |
| 16561 |
<SelectProvider store={store} /> |
| 16562 |
|
| 16563 |
See https://github.com/ariakit/ariakit/pull/2745 for more details. |
| 16564 |
|
| 16565 |
If there's a particular need for this, please submit a feature request at https://github.com/ariakit/ariakit |
| 16566 |
`); |
| 16567 |
} |
| 16568 |
|
| 16569 |
// node_modules/@ariakit/react-store/dist/index.js |
| 16570 |
var React48 = __toESM(require_react(), 1); |
| 16571 |
var import_shim2 = __toESM(require_shim(), 1); |
| 16572 |
var noopSubscribe = () => () => { |
| 16573 |
}; |
| 16574 |
function useStoreState(store, keyOrSelector = identity) { |
| 16575 |
const storeSubscribe = React48.useCallback((callback) => { |
| 16576 |
if (!store) return noopSubscribe(); |
| 16577 |
return subscribe(store, null, callback); |
| 16578 |
}, [store]); |
| 16579 |
const getSnapshot = () => { |
| 16580 |
const key = typeof keyOrSelector === "string" ? keyOrSelector : null; |
| 16581 |
const selector2 = typeof keyOrSelector === "function" ? keyOrSelector : null; |
| 16582 |
const state = store?.getState(); |
| 16583 |
if (selector2) return selector2(state); |
| 16584 |
if (!state) return; |
| 16585 |
if (!key) return; |
| 16586 |
if (!hasOwnProperty(state, key)) return; |
| 16587 |
return state[key]; |
| 16588 |
}; |
| 16589 |
return (0, import_shim2.useSyncExternalStore)(storeSubscribe, getSnapshot, getSnapshot); |
| 16590 |
} |
| 16591 |
function useStoreStateObject(store, object) { |
| 16592 |
const objRef = React48.useRef({}); |
| 16593 |
const storeSubscribe = React48.useCallback((callback) => { |
| 16594 |
if (!store) return noopSubscribe(); |
| 16595 |
return subscribe(store, null, callback); |
| 16596 |
}, [store]); |
| 16597 |
const getSnapshot = () => { |
| 16598 |
const state = store?.getState(); |
| 16599 |
let updated = false; |
| 16600 |
const obj = objRef.current; |
| 16601 |
for (const prop in object) { |
| 16602 |
const keyOrSelector = object[prop]; |
| 16603 |
if (typeof keyOrSelector === "function") { |
| 16604 |
const value = keyOrSelector(state); |
| 16605 |
if (value !== obj[prop]) { |
| 16606 |
obj[prop] = value; |
| 16607 |
updated = true; |
| 16608 |
} |
| 16609 |
} |
| 16610 |
if (typeof keyOrSelector === "string") { |
| 16611 |
if (!state) continue; |
| 16612 |
if (!hasOwnProperty(state, keyOrSelector)) continue; |
| 16613 |
const value = state[keyOrSelector]; |
| 16614 |
if (value !== obj[prop]) { |
| 16615 |
obj[prop] = value; |
| 16616 |
updated = true; |
| 16617 |
} |
| 16618 |
} |
| 16619 |
} |
| 16620 |
if (updated) objRef.current = { ...obj }; |
| 16621 |
return objRef.current; |
| 16622 |
}; |
| 16623 |
return (0, import_shim2.useSyncExternalStore)(storeSubscribe, getSnapshot, getSnapshot); |
| 16624 |
} |
| 16625 |
function useStoreProps(store, props, key, setKey) { |
| 16626 |
const value = hasOwnProperty(props, key) ? props[key] : void 0; |
| 16627 |
const propsRef = useLiveRef({ |
| 16628 |
value, |
| 16629 |
setValue: setKey ? props[setKey] : void 0 |
| 16630 |
}); |
| 16631 |
useSafeLayoutEffect(() => { |
| 16632 |
return sync(store, [key], (state, prev) => { |
| 16633 |
const { value: value2, setValue } = propsRef.current; |
| 16634 |
if (!setValue) return; |
| 16635 |
if (state[key] === prev[key]) return; |
| 16636 |
if (state[key] === value2) return; |
| 16637 |
setValue(state[key]); |
| 16638 |
}); |
| 16639 |
}, [store, key]); |
| 16640 |
useSafeLayoutEffect(() => { |
| 16641 |
if (value === void 0) return; |
| 16642 |
store.setState(key, value); |
| 16643 |
return batch(store, [key], () => { |
| 16644 |
if (value === void 0) return; |
| 16645 |
store.setState(key, value); |
| 16646 |
}); |
| 16647 |
}); |
| 16648 |
} |
| 16649 |
function useStore2(createStore2, props) { |
| 16650 |
const [store, setStore] = React48.useState(() => createStore2(props)); |
| 16651 |
useSafeLayoutEffect(() => init(store), [store]); |
| 16652 |
const useState42 = React48.useCallback((keyOrSelector) => useStoreState(store, keyOrSelector), [store]); |
| 16653 |
return [React48.useMemo(() => ({ |
| 16654 |
...store, |
| 16655 |
useState: useState42 |
| 16656 |
}), [store, useState42]), useEvent(() => { |
| 16657 |
setStore((store2) => createStore2({ |
| 16658 |
...props, |
| 16659 |
...store2.getState() |
| 16660 |
})); |
| 16661 |
})]; |
| 16662 |
} |
| 16663 |
|
| 16664 |
// node_modules/@ariakit/react-components/dist/composite/composite-item.js |
| 16665 |
var TagName4 = "button"; |
| 16666 |
function isEditableElement(element) { |
| 16667 |
if (isTextbox(element)) return true; |
| 16668 |
return element.tagName === "INPUT" && !isButton(element); |
| 16669 |
} |
| 16670 |
function getNextPageOffset(scrollingElement, pageUp = false) { |
| 16671 |
const height = scrollingElement.clientHeight; |
| 16672 |
const { top } = scrollingElement.getBoundingClientRect(); |
| 16673 |
const pageSize = Math.max(height * 0.875, height - 40) * 1.5; |
| 16674 |
const pageOffset = pageUp ? height - pageSize + top : pageSize + top; |
| 16675 |
if (scrollingElement.tagName === "HTML") return pageOffset + scrollingElement.scrollTop; |
| 16676 |
return pageOffset; |
| 16677 |
} |
| 16678 |
function getItemOffset(itemElement, pageUp = false) { |
| 16679 |
const { top } = itemElement.getBoundingClientRect(); |
| 16680 |
if (pageUp) return top + itemElement.clientHeight; |
| 16681 |
return top; |
| 16682 |
} |
| 16683 |
function findNextPageItemId(element, store, next, pageUp = false) { |
| 16684 |
if (!store) return; |
| 16685 |
if (!next) return; |
| 16686 |
const { renderedItems } = store.getState(); |
| 16687 |
const scrollingElement = getScrollingElement(element); |
| 16688 |
if (!scrollingElement) return; |
| 16689 |
const nextPageOffset = getNextPageOffset(scrollingElement, pageUp); |
| 16690 |
let id; |
| 16691 |
let prevDifference; |
| 16692 |
for (let i2 = 0; i2 < renderedItems.length; i2 += 1) { |
| 16693 |
const previousId = id; |
| 16694 |
id = next(i2); |
| 16695 |
if (!id) break; |
| 16696 |
if (id === previousId) continue; |
| 16697 |
const itemElement = getEnabledItem(store, id)?.element; |
| 16698 |
if (!itemElement) continue; |
| 16699 |
const difference = getItemOffset(itemElement, pageUp) - nextPageOffset; |
| 16700 |
const absDifference = Math.abs(difference); |
| 16701 |
if (pageUp && difference <= 0 || !pageUp && difference >= 0) { |
| 16702 |
if (prevDifference !== void 0 && prevDifference < absDifference) id = previousId; |
| 16703 |
break; |
| 16704 |
} |
| 16705 |
prevDifference = absDifference; |
| 16706 |
} |
| 16707 |
return id; |
| 16708 |
} |
| 16709 |
function targetIsAnotherItem(event, store) { |
| 16710 |
if (isSelfTarget(event)) return false; |
| 16711 |
return isItem(store, event.target); |
| 16712 |
} |
| 16713 |
var useCompositeItem = createHook(function useCompositeItem2({ store, rowId: rowIdProp, preventScrollOnKeyDown = false, moveOnKeyPress = true, tabbable: tabbable2 = false, getItem: getItemProp, "aria-setsize": ariaSetSizeProp, "aria-posinset": ariaPosInSetProp, ...props }) { |
| 16714 |
const context = useCompositeScopedContext(); |
| 16715 |
store = store || context; |
| 16716 |
const id = useId4(props.id); |
| 16717 |
const ref = (0, import_react12.useRef)(null); |
| 16718 |
const row = (0, import_react12.useContext)(CompositeRowContext); |
| 16719 |
const trulyDisabled = disabledFromProps(props) && !props.accessibleWhenDisabled; |
| 16720 |
const { rowId, baseElement, isActiveItem, ariaSetSize, ariaPosInSet, isTabbable } = useStoreStateObject(store, { |
| 16721 |
rowId(state) { |
| 16722 |
if (rowIdProp) return rowIdProp; |
| 16723 |
if (!state) return; |
| 16724 |
if (!row?.baseElement) return; |
| 16725 |
if (row.baseElement !== state.baseElement) return; |
| 16726 |
return row.id; |
| 16727 |
}, |
| 16728 |
baseElement(state) { |
| 16729 |
return state?.baseElement || void 0; |
| 16730 |
}, |
| 16731 |
isActiveItem(state) { |
| 16732 |
return !!state && state.activeId === id; |
| 16733 |
}, |
| 16734 |
ariaSetSize(state) { |
| 16735 |
if (ariaSetSizeProp != null) return ariaSetSizeProp; |
| 16736 |
if (!state) return; |
| 16737 |
if (!row?.ariaSetSize) return; |
| 16738 |
if (row.baseElement !== state.baseElement) return; |
| 16739 |
return row.ariaSetSize; |
| 16740 |
}, |
| 16741 |
ariaPosInSet(state) { |
| 16742 |
if (ariaPosInSetProp != null) return ariaPosInSetProp; |
| 16743 |
if (!state) return; |
| 16744 |
if (!row?.ariaPosInSet) return; |
| 16745 |
if (row.baseElement !== state.baseElement) return; |
| 16746 |
const itemsInRow = state.renderedItems.filter((item) => item.rowId === rowId); |
| 16747 |
return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id); |
| 16748 |
}, |
| 16749 |
isTabbable(state) { |
| 16750 |
if (!state?.renderedItems.length) return true; |
| 16751 |
if (state.virtualFocus) return false; |
| 16752 |
if (tabbable2) return true; |
| 16753 |
if (state.activeId === null) return false; |
| 16754 |
const item = store?.item(state.activeId); |
| 16755 |
if (item?.disabled) return true; |
| 16756 |
if (!item?.element) return true; |
| 16757 |
return state.activeId === id; |
| 16758 |
} |
| 16759 |
}); |
| 16760 |
const getItem = (0, import_react12.useCallback)((item) => { |
| 16761 |
const nextItem = { |
| 16762 |
...item, |
| 16763 |
id: id || item.id, |
| 16764 |
rowId, |
| 16765 |
disabled: trulyDisabled, |
| 16766 |
children: item.element?.textContent |
| 16767 |
}; |
| 16768 |
if (getItemProp) return getItemProp(nextItem); |
| 16769 |
return nextItem; |
| 16770 |
}, [ |
| 16771 |
id, |
| 16772 |
rowId, |
| 16773 |
trulyDisabled, |
| 16774 |
getItemProp |
| 16775 |
]); |
| 16776 |
const onFocusProp = props.onFocus; |
| 16777 |
const hasFocusedComposite = (0, import_react12.useRef)(false); |
| 16778 |
const onFocus = useEvent((event) => { |
| 16779 |
onFocusProp?.(event); |
| 16780 |
if (event.defaultPrevented) return; |
| 16781 |
if (isPortalEvent(event)) return; |
| 16782 |
if (!id) return; |
| 16783 |
if (!store) return; |
| 16784 |
if (targetIsAnotherItem(event, store)) return; |
| 16785 |
const { virtualFocus, baseElement: baseElement2 } = store.getState(); |
| 16786 |
store.setActiveId(id); |
| 16787 |
if (isTextbox(event.currentTarget)) selectTextField(event.currentTarget); |
| 16788 |
if (!virtualFocus) return; |
| 16789 |
if (!isSelfTarget(event)) return; |
| 16790 |
if (isEditableElement(event.currentTarget)) return; |
| 16791 |
if (!baseElement2?.isConnected) return; |
| 16792 |
if (isSafari2() && event.currentTarget.hasAttribute("data-autofocus")) event.currentTarget.scrollIntoView({ |
| 16793 |
block: "nearest", |
| 16794 |
inline: "nearest" |
| 16795 |
}); |
| 16796 |
hasFocusedComposite.current = true; |
| 16797 |
if (event.relatedTarget === baseElement2 || isItem(store, event.relatedTarget)) focusSilently(baseElement2); |
| 16798 |
else baseElement2.focus(); |
| 16799 |
}); |
| 16800 |
const onBlurCaptureProp = props.onBlurCapture; |
| 16801 |
const onBlurCapture = useEvent((event) => { |
| 16802 |
onBlurCaptureProp?.(event); |
| 16803 |
if (event.defaultPrevented) return; |
| 16804 |
if (store?.getState()?.virtualFocus && hasFocusedComposite.current) { |
| 16805 |
hasFocusedComposite.current = false; |
| 16806 |
event.preventDefault(); |
| 16807 |
event.stopPropagation(); |
| 16808 |
} |
| 16809 |
}); |
| 16810 |
const onKeyDownProp = props.onKeyDown; |
| 16811 |
const preventScrollOnKeyDownProp = useBooleanEvent(preventScrollOnKeyDown); |
| 16812 |
const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); |
| 16813 |
const onKeyDown = useEvent((event) => { |
| 16814 |
onKeyDownProp?.(event); |
| 16815 |
if (event.defaultPrevented) return; |
| 16816 |
if (!isSelfTarget(event)) return; |
| 16817 |
if (!store) return; |
| 16818 |
const { currentTarget } = event; |
| 16819 |
const state = store.getState(); |
| 16820 |
const isGrid2 = !!store.item(id)?.rowId; |
| 16821 |
const isVertical = state.orientation !== "horizontal"; |
| 16822 |
const isHorizontal = state.orientation !== "vertical"; |
| 16823 |
const canHomeEnd = () => { |
| 16824 |
if (isGrid2) return true; |
| 16825 |
if (isHorizontal) return true; |
| 16826 |
if (!state.baseElement) return true; |
| 16827 |
if (!isTextField(state.baseElement)) return true; |
| 16828 |
return false; |
| 16829 |
}; |
| 16830 |
const action = { |
| 16831 |
ArrowUp: (isGrid2 || isVertical) && store.up, |
| 16832 |
ArrowRight: (isGrid2 || isHorizontal) && store.next, |
| 16833 |
ArrowDown: (isGrid2 || isVertical) && store.down, |
| 16834 |
ArrowLeft: (isGrid2 || isHorizontal) && store.previous, |
| 16835 |
Home: () => { |
| 16836 |
if (!canHomeEnd()) return; |
| 16837 |
if (!isGrid2 || event.ctrlKey) return store?.first(); |
| 16838 |
return store?.previous(-1); |
| 16839 |
}, |
| 16840 |
End: () => { |
| 16841 |
if (!canHomeEnd()) return; |
| 16842 |
if (!isGrid2 || event.ctrlKey) return store?.last(); |
| 16843 |
return store?.next(-1); |
| 16844 |
}, |
| 16845 |
PageUp: () => { |
| 16846 |
return findNextPageItemId(currentTarget, store, store?.up, true); |
| 16847 |
}, |
| 16848 |
PageDown: () => { |
| 16849 |
return findNextPageItemId(currentTarget, store, store?.down); |
| 16850 |
} |
| 16851 |
}[event.key]; |
| 16852 |
if (action) { |
| 16853 |
if (isTextbox(currentTarget)) { |
| 16854 |
const selection = getTextboxSelection(currentTarget); |
| 16855 |
const isLeft = isHorizontal && event.key === "ArrowLeft"; |
| 16856 |
const isRight = isHorizontal && event.key === "ArrowRight"; |
| 16857 |
const isUp = isVertical && event.key === "ArrowUp"; |
| 16858 |
const isDown = isVertical && event.key === "ArrowDown"; |
| 16859 |
if (isRight || isDown) { |
| 16860 |
const { length: valueLength } = getTextboxValue(currentTarget); |
| 16861 |
if (selection.end !== valueLength) return; |
| 16862 |
} else if ((isLeft || isUp) && selection.start !== 0) return; |
| 16863 |
} |
| 16864 |
const nextId = action(); |
| 16865 |
if (preventScrollOnKeyDownProp(event) || nextId !== void 0) { |
| 16866 |
if (!moveOnKeyPressProp(event)) return; |
| 16867 |
event.preventDefault(); |
| 16868 |
store.move(nextId); |
| 16869 |
} |
| 16870 |
} |
| 16871 |
}); |
| 16872 |
const providerValue = (0, import_react12.useMemo)(() => ({ |
| 16873 |
id, |
| 16874 |
baseElement |
| 16875 |
}), [id, baseElement]); |
| 16876 |
props = useWrapElement(props, (element) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(CompositeItemContext.Provider, { |
| 16877 |
value: providerValue, |
| 16878 |
children: element |
| 16879 |
}), [providerValue]); |
| 16880 |
props = { |
| 16881 |
"data-active-item": isActiveItem || void 0, |
| 16882 |
...props, |
| 16883 |
id, |
| 16884 |
ref: useMergeRefs(ref, props.ref), |
| 16885 |
tabIndex: isTabbable ? props.tabIndex : -1, |
| 16886 |
onFocus, |
| 16887 |
onBlurCapture, |
| 16888 |
onKeyDown |
| 16889 |
}; |
| 16890 |
props = useCommand(props); |
| 16891 |
props = useCollectionItem({ |
| 16892 |
store, |
| 16893 |
...props, |
| 16894 |
getItem, |
| 16895 |
shouldRegisterItem: id ? props.shouldRegisterItem : false |
| 16896 |
}); |
| 16897 |
return removeUndefinedValues({ |
| 16898 |
...props, |
| 16899 |
"aria-setsize": ariaSetSize, |
| 16900 |
"aria-posinset": ariaPosInSet |
| 16901 |
}); |
| 16902 |
}); |
| 16903 |
var CompositeItem = memo3(forwardRef20(function CompositeItem2(props) { |
| 16904 |
return createElement3(TagName4, useCompositeItem(props)); |
| 16905 |
})); |
| 16906 |
|
| 16907 |
// node_modules/@ariakit/react-components/dist/composite/composite.js |
| 16908 |
var import_react13 = __toESM(require_react(), 1); |
| 16909 |
var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1); |
| 16910 |
var TagName5 = "div"; |
| 16911 |
function isGrid(items) { |
| 16912 |
return items.some((item) => !!item.rowId); |
| 16913 |
} |
| 16914 |
function isPrintableKey(event) { |
| 16915 |
const target = event.target; |
| 16916 |
if (target && !isTextField(target)) return false; |
| 16917 |
return event.key.length === 1 && !event.ctrlKey && !event.metaKey; |
| 16918 |
} |
| 16919 |
function isModifierKey(event) { |
| 16920 |
return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta"; |
| 16921 |
} |
| 16922 |
function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) { |
| 16923 |
return useEvent((event) => { |
| 16924 |
onKeyboardEvent?.(event); |
| 16925 |
if (event.defaultPrevented) return; |
| 16926 |
if (event.isPropagationStopped()) return; |
| 16927 |
if (!isSelfTarget(event)) return; |
| 16928 |
if (isModifierKey(event)) return; |
| 16929 |
if (isPrintableKey(event)) return; |
| 16930 |
const activeElement2 = getEnabledItem(store, store.getState().activeId)?.element; |
| 16931 |
if (!activeElement2) return; |
| 16932 |
const { view, ...eventInit } = event; |
| 16933 |
if (activeElement2 !== previousElementRef?.current) activeElement2.focus(); |
| 16934 |
if (!fireKeyboardEvent(activeElement2, event.type, eventInit)) event.preventDefault(); |
| 16935 |
if (event.currentTarget.contains(activeElement2)) event.stopPropagation(); |
| 16936 |
}); |
| 16937 |
} |
| 16938 |
function findFirstEnabledItemInTheLastRow(items) { |
| 16939 |
return findFirstEnabledItem(flatten2DArray(reverseArray(groupItemsByRows(items)))); |
| 16940 |
} |
| 16941 |
function withBaseScrollPreserved(store, callback) { |
| 16942 |
const { virtualFocus, baseElement } = store.getState(); |
| 16943 |
if (!virtualFocus || !baseElement || !isTextField(baseElement)) { |
| 16944 |
callback(); |
| 16945 |
return; |
| 16946 |
} |
| 16947 |
const savedScrollLeft = baseElement.scrollLeft; |
| 16948 |
const savedScrollTop = baseElement.scrollTop; |
| 16949 |
callback(); |
| 16950 |
baseElement.scrollLeft = savedScrollLeft; |
| 16951 |
baseElement.scrollTop = savedScrollTop; |
| 16952 |
} |
| 16953 |
function useScheduleFocus(store) { |
| 16954 |
const [scheduled, setScheduled] = (0, import_react13.useState)(false); |
| 16955 |
const schedule = (0, import_react13.useCallback)(() => setScheduled(true), []); |
| 16956 |
const activeItem = useStoreState(store, (state) => getEnabledItem(store, state.activeId)); |
| 16957 |
(0, import_react13.useEffect)(() => { |
| 16958 |
const activeElement2 = activeItem?.element; |
| 16959 |
if (!scheduled) return; |
| 16960 |
if (!activeElement2) return; |
| 16961 |
setScheduled(false); |
| 16962 |
withBaseScrollPreserved(store, () => { |
| 16963 |
activeElement2.focus({ preventScroll: true }); |
| 16964 |
}); |
| 16965 |
}, [ |
| 16966 |
store, |
| 16967 |
activeItem, |
| 16968 |
scheduled |
| 16969 |
]); |
| 16970 |
return schedule; |
| 16971 |
} |
| 16972 |
var useComposite = createHook(function useComposite2({ store, composite = true, focusOnMove = composite, moveOnKeyPress = true, ...props }) { |
| 16973 |
const context = useCompositeProviderContext(); |
| 16974 |
store = store || context; |
| 16975 |
invariant(store, "Composite must receive a `store` prop or be wrapped in a CompositeProvider component."); |
| 16976 |
const ref = (0, import_react13.useRef)(null); |
| 16977 |
const previousElementRef = (0, import_react13.useRef)(null); |
| 16978 |
const scheduleFocus = useScheduleFocus(store); |
| 16979 |
const moves = useStoreState(store, "moves"); |
| 16980 |
const [, setBaseElement] = useTransactionState(composite ? store.setBaseElement : null); |
| 16981 |
(0, import_react13.useEffect)(() => { |
| 16982 |
if (!store) return; |
| 16983 |
if (!moves) return; |
| 16984 |
if (!composite) return; |
| 16985 |
if (!focusOnMove) return; |
| 16986 |
const { activeId: activeId2 } = store.getState(); |
| 16987 |
const itemElement = getEnabledItem(store, activeId2)?.element; |
| 16988 |
if (!itemElement) return; |
| 16989 |
withBaseScrollPreserved(store, () => focusIntoView(itemElement)); |
| 16990 |
}, [ |
| 16991 |
store, |
| 16992 |
moves, |
| 16993 |
composite, |
| 16994 |
focusOnMove |
| 16995 |
]); |
| 16996 |
useSafeLayoutEffect(() => { |
| 16997 |
if (!store) return; |
| 16998 |
if (!moves) return; |
| 16999 |
if (!composite) return; |
| 17000 |
const { baseElement, activeId: activeId2 } = store.getState(); |
| 17001 |
if (!(activeId2 === null)) return; |
| 17002 |
if (!baseElement) return; |
| 17003 |
const previousElement = previousElementRef.current; |
| 17004 |
previousElementRef.current = null; |
| 17005 |
if (previousElement) fireBlurEvent(previousElement, { relatedTarget: baseElement }); |
| 17006 |
if (!hasFocus(baseElement)) baseElement.focus(); |
| 17007 |
}, [ |
| 17008 |
store, |
| 17009 |
moves, |
| 17010 |
composite |
| 17011 |
]); |
| 17012 |
const activeId = useStoreState(store, "activeId"); |
| 17013 |
const virtualFocus = useStoreState(store, "virtualFocus"); |
| 17014 |
useSafeLayoutEffect(() => { |
| 17015 |
if (!store) return; |
| 17016 |
if (!composite) return; |
| 17017 |
if (!virtualFocus) return; |
| 17018 |
const previousElement = previousElementRef.current; |
| 17019 |
previousElementRef.current = null; |
| 17020 |
if (!previousElement) return; |
| 17021 |
const relatedTarget = getEnabledItem(store, activeId)?.element || getActiveElement(previousElement); |
| 17022 |
if (relatedTarget === previousElement) return; |
| 17023 |
fireBlurEvent(previousElement, { relatedTarget }); |
| 17024 |
}, [ |
| 17025 |
store, |
| 17026 |
activeId, |
| 17027 |
virtualFocus, |
| 17028 |
composite |
| 17029 |
]); |
| 17030 |
const onKeyDownCapture = useKeyboardEventProxy(store, props.onKeyDownCapture, previousElementRef); |
| 17031 |
const onKeyUpCapture = useKeyboardEventProxy(store, props.onKeyUpCapture, previousElementRef); |
| 17032 |
const onFocusCaptureProp = props.onFocusCapture; |
| 17033 |
const onFocusCapture = useEvent((event) => { |
| 17034 |
onFocusCaptureProp?.(event); |
| 17035 |
if (event.defaultPrevented) return; |
| 17036 |
if (!store) return; |
| 17037 |
const { virtualFocus: virtualFocus2 } = store.getState(); |
| 17038 |
if (!virtualFocus2) return; |
| 17039 |
const previousActiveElement = event.relatedTarget; |
| 17040 |
const isSilentlyFocused = silentlyFocused(event.currentTarget); |
| 17041 |
if (isSelfTarget(event) && isSilentlyFocused) { |
| 17042 |
event.stopPropagation(); |
| 17043 |
previousElementRef.current = previousActiveElement; |
| 17044 |
} |
| 17045 |
}); |
| 17046 |
const onFocusProp = props.onFocus; |
| 17047 |
const onFocus = useEvent((event) => { |
| 17048 |
onFocusProp?.(event); |
| 17049 |
if (event.defaultPrevented) return; |
| 17050 |
if (!composite) return; |
| 17051 |
if (!store) return; |
| 17052 |
const { relatedTarget } = event; |
| 17053 |
const { virtualFocus: virtualFocus2 } = store.getState(); |
| 17054 |
if (virtualFocus2) { |
| 17055 |
if (isSelfTarget(event) && !isItem(store, relatedTarget)) queueMicrotask(scheduleFocus); |
| 17056 |
} else if (isSelfTarget(event)) store.setActiveId(null); |
| 17057 |
}); |
| 17058 |
const onBlurCaptureProp = props.onBlurCapture; |
| 17059 |
const onBlurCapture = useEvent((event) => { |
| 17060 |
onBlurCaptureProp?.(event); |
| 17061 |
if (event.defaultPrevented) return; |
| 17062 |
if (!store) return; |
| 17063 |
const { virtualFocus: virtualFocus2, activeId: activeId2 } = store.getState(); |
| 17064 |
if (!virtualFocus2) return; |
| 17065 |
const activeElement2 = getEnabledItem(store, activeId2)?.element; |
| 17066 |
const nextActiveElement = event.relatedTarget; |
| 17067 |
const nextActiveElementIsItem = isItem(store, nextActiveElement); |
| 17068 |
const previousElement = previousElementRef.current; |
| 17069 |
previousElementRef.current = null; |
| 17070 |
if (isSelfTarget(event) && nextActiveElementIsItem) { |
| 17071 |
if (nextActiveElement === activeElement2) { |
| 17072 |
if (previousElement && previousElement !== nextActiveElement) fireBlurEvent(previousElement, event); |
| 17073 |
} else if (activeElement2) fireBlurEvent(activeElement2, event); |
| 17074 |
else if (previousElement) fireBlurEvent(previousElement, event); |
| 17075 |
event.stopPropagation(); |
| 17076 |
} else if (!isItem(store, event.target) && activeElement2) fireBlurEvent(activeElement2, event); |
| 17077 |
}); |
| 17078 |
const onKeyDownProp = props.onKeyDown; |
| 17079 |
const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); |
| 17080 |
const onKeyDown = useEvent((event) => { |
| 17081 |
onKeyDownProp?.(event); |
| 17082 |
if (event.nativeEvent.isComposing) return; |
| 17083 |
if (event.defaultPrevented) return; |
| 17084 |
if (!store) return; |
| 17085 |
if (!isSelfTarget(event)) return; |
| 17086 |
const { orientation, renderedItems, activeId: activeId2 } = store.getState(); |
| 17087 |
if (getEnabledItem(store, activeId2)?.element?.isConnected) return; |
| 17088 |
const isVertical = orientation !== "horizontal"; |
| 17089 |
const isHorizontal = orientation !== "vertical"; |
| 17090 |
const grid = isGrid(renderedItems); |
| 17091 |
if ((event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End") && isTextField(event.currentTarget)) return; |
| 17092 |
const up = () => { |
| 17093 |
if (grid) return findFirstEnabledItemInTheLastRow(renderedItems)?.id; |
| 17094 |
return store?.last(); |
| 17095 |
}; |
| 17096 |
const action = { |
| 17097 |
ArrowUp: (grid || isVertical) && up, |
| 17098 |
ArrowRight: (grid || isHorizontal) && store.first, |
| 17099 |
ArrowDown: (grid || isVertical) && store.first, |
| 17100 |
ArrowLeft: (grid || isHorizontal) && store.last, |
| 17101 |
Home: store.first, |
| 17102 |
End: store.last, |
| 17103 |
PageUp: store.first, |
| 17104 |
PageDown: store.last |
| 17105 |
}[event.key]; |
| 17106 |
if (action) { |
| 17107 |
const id = action(); |
| 17108 |
if (id !== void 0) { |
| 17109 |
if (!moveOnKeyPressProp(event)) return; |
| 17110 |
event.preventDefault(); |
| 17111 |
store.move(id); |
| 17112 |
} |
| 17113 |
} |
| 17114 |
}); |
| 17115 |
props = useWrapElement(props, (element) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(CompositeScopedContextProvider, { |
| 17116 |
value: store, |
| 17117 |
children: element |
| 17118 |
}), [store]); |
| 17119 |
props = { |
| 17120 |
"aria-activedescendant": useStoreState(store, (state) => { |
| 17121 |
if (!store) return; |
| 17122 |
if (!composite) return; |
| 17123 |
if (!state.virtualFocus) return; |
| 17124 |
return getEnabledItem(store, state.activeId)?.id; |
| 17125 |
}), |
| 17126 |
...props, |
| 17127 |
ref: useMergeRefs(ref, setBaseElement, props.ref), |
| 17128 |
onKeyDownCapture, |
| 17129 |
onKeyUpCapture, |
| 17130 |
onFocusCapture, |
| 17131 |
onFocus, |
| 17132 |
onBlurCapture, |
| 17133 |
onKeyDown |
| 17134 |
}; |
| 17135 |
props = useFocusable({ |
| 17136 |
focusable: useStoreState(store, (state) => composite && (state.virtualFocus || state.activeId === null)), |
| 17137 |
...props |
| 17138 |
}); |
| 17139 |
return props; |
| 17140 |
}); |
| 17141 |
var Composite6 = forwardRef20(function Composite7(props) { |
| 17142 |
return createElement3(TagName5, useComposite(props)); |
| 17143 |
}); |
| 17144 |
|
| 17145 |
// node_modules/@ariakit/react-components/dist/disclosure/disclosure-context.js |
| 17146 |
var ctx3 = createStoreContext(); |
| 17147 |
var useDisclosureContext = ctx3.useContext; |
| 17148 |
var useDisclosureScopedContext = ctx3.useScopedContext; |
| 17149 |
var useDisclosureProviderContext = ctx3.useProviderContext; |
| 17150 |
var DisclosureContextProvider = ctx3.ContextProvider; |
| 17151 |
var DisclosureScopedContextProvider = ctx3.ScopedContextProvider; |
| 17152 |
|
| 17153 |
// node_modules/@ariakit/react-components/dist/dialog/dialog-context.js |
| 17154 |
var import_react14 = __toESM(require_react(), 1); |
| 17155 |
var ctx4 = createStoreContext([DisclosureContextProvider], [DisclosureScopedContextProvider]); |
| 17156 |
var useDialogContext = ctx4.useContext; |
| 17157 |
var useDialogScopedContext = ctx4.useScopedContext; |
| 17158 |
var useDialogProviderContext = ctx4.useProviderContext; |
| 17159 |
var DialogContextProvider = ctx4.ContextProvider; |
| 17160 |
var DialogScopedContextProvider = ctx4.ScopedContextProvider; |
| 17161 |
var DialogHeadingContext = (0, import_react14.createContext)(void 0); |
| 17162 |
var DialogDescriptionContext = (0, import_react14.createContext)(void 0); |
| 17163 |
|
| 17164 |
// node_modules/@ariakit/react-components/dist/disclosure/disclosure-content.js |
| 17165 |
var import_react15 = __toESM(require_react(), 1); |
| 17166 |
var import_jsx_runtime74 = __toESM(require_jsx_runtime(), 1); |
| 17167 |
var import_react_dom4 = __toESM(require_react_dom(), 1); |
| 17168 |
var TagName6 = "div"; |
| 17169 |
function afterTimeout(timeoutMs, cb) { |
| 17170 |
const timeoutId = setTimeout(cb, timeoutMs); |
| 17171 |
return () => clearTimeout(timeoutId); |
| 17172 |
} |
| 17173 |
function afterPaint(cb) { |
| 17174 |
let raf = requestAnimationFrame(() => { |
| 17175 |
raf = requestAnimationFrame(cb); |
| 17176 |
}); |
| 17177 |
return () => cancelAnimationFrame(raf); |
| 17178 |
} |
| 17179 |
function parseCSSTime(...times) { |
| 17180 |
return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => { |
| 17181 |
const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3; |
| 17182 |
const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier; |
| 17183 |
if (currentTime > longestTime) return currentTime; |
| 17184 |
return longestTime; |
| 17185 |
}, 0); |
| 17186 |
} |
| 17187 |
function isHidden(mounted, hidden, alwaysVisible) { |
| 17188 |
return !alwaysVisible && hidden !== false && (!mounted || !!hidden); |
| 17189 |
} |
| 17190 |
var useDisclosureContent = createHook(function useDisclosureContent2({ store, alwaysVisible, ...props }) { |
| 17191 |
const context = useDisclosureProviderContext(); |
| 17192 |
store = store || context; |
| 17193 |
invariant(store, "DisclosureContent must receive a `store` prop or be wrapped in a DisclosureProvider component."); |
| 17194 |
const ref = (0, import_react15.useRef)(null); |
| 17195 |
const id = useId4(props.id); |
| 17196 |
const [transition, setTransition] = (0, import_react15.useState)(null); |
| 17197 |
const open = useStoreState(store, "open"); |
| 17198 |
const mounted = useStoreState(store, "mounted"); |
| 17199 |
const animated = useStoreState(store, "animated"); |
| 17200 |
const contentElement = useStoreState(store, "contentElement"); |
| 17201 |
const otherElement = useStoreState(store.disclosure, "contentElement"); |
| 17202 |
const hasClosedRef = (0, import_react15.useRef)(false); |
| 17203 |
useSafeLayoutEffect(() => { |
| 17204 |
if (!ref.current) return; |
| 17205 |
store?.setContentElement(ref.current); |
| 17206 |
}, [store]); |
| 17207 |
useSafeLayoutEffect(() => { |
| 17208 |
let previousAnimated; |
| 17209 |
store?.setState("animated", (animated2) => { |
| 17210 |
previousAnimated = animated2; |
| 17211 |
return true; |
| 17212 |
}); |
| 17213 |
return () => { |
| 17214 |
if (previousAnimated === void 0) return; |
| 17215 |
store?.setState("animated", previousAnimated); |
| 17216 |
}; |
| 17217 |
}, [store]); |
| 17218 |
useSafeLayoutEffect(() => { |
| 17219 |
if (!animated) { |
| 17220 |
if (!open) { |
| 17221 |
hasClosedRef.current = true; |
| 17222 |
setTransition(null); |
| 17223 |
} else if (hasClosedRef.current) { |
| 17224 |
hasClosedRef.current = false; |
| 17225 |
setTransition("enter"); |
| 17226 |
} |
| 17227 |
return; |
| 17228 |
} |
| 17229 |
if (!contentElement?.isConnected) { |
| 17230 |
setTransition(null); |
| 17231 |
return; |
| 17232 |
} |
| 17233 |
return afterPaint(() => { |
| 17234 |
setTransition(open ? "enter" : mounted ? "leave" : null); |
| 17235 |
}); |
| 17236 |
}, [ |
| 17237 |
animated, |
| 17238 |
contentElement, |
| 17239 |
open, |
| 17240 |
mounted |
| 17241 |
]); |
| 17242 |
useSafeLayoutEffect(() => { |
| 17243 |
if (!store) return; |
| 17244 |
if (!animated) return; |
| 17245 |
if (!transition) return; |
| 17246 |
if (!contentElement) return; |
| 17247 |
const stopAnimation = () => store?.setState("animating", false); |
| 17248 |
const stopAnimationSync = () => (0, import_react_dom4.flushSync)(stopAnimation); |
| 17249 |
if (transition === "leave" && open) return; |
| 17250 |
if (transition === "enter" && !open) return; |
| 17251 |
if (typeof animated === "number") return afterTimeout(animated, stopAnimationSync); |
| 17252 |
const { transitionDuration, animationDuration, transitionDelay, animationDelay } = getComputedStyle(contentElement); |
| 17253 |
const { transitionDuration: transitionDuration2 = "0", animationDuration: animationDuration2 = "0", transitionDelay: transitionDelay2 = "0", animationDelay: animationDelay2 = "0" } = otherElement ? getComputedStyle(otherElement) : {}; |
| 17254 |
const timeout = parseCSSTime(transitionDelay, animationDelay, transitionDelay2, animationDelay2) + parseCSSTime(transitionDuration, animationDuration, transitionDuration2, animationDuration2); |
| 17255 |
if (!timeout) { |
| 17256 |
if (transition === "enter") store.setState("animated", false); |
| 17257 |
stopAnimation(); |
| 17258 |
return; |
| 17259 |
} |
| 17260 |
return afterTimeout(Math.max(timeout - 1e3 / 60, 0), stopAnimationSync); |
| 17261 |
}, [ |
| 17262 |
store, |
| 17263 |
animated, |
| 17264 |
contentElement, |
| 17265 |
otherElement, |
| 17266 |
open, |
| 17267 |
transition |
| 17268 |
]); |
| 17269 |
props = useWrapElement(props, (element) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DialogScopedContextProvider, { |
| 17270 |
value: store, |
| 17271 |
children: element |
| 17272 |
}), [store]); |
| 17273 |
const hidden = isHidden(mounted, props.hidden, alwaysVisible); |
| 17274 |
const styleProp = props.style; |
| 17275 |
const style = (0, import_react15.useMemo)(() => { |
| 17276 |
if (hidden) return { |
| 17277 |
...styleProp, |
| 17278 |
display: "none" |
| 17279 |
}; |
| 17280 |
return styleProp; |
| 17281 |
}, [hidden, styleProp]); |
| 17282 |
props = { |
| 17283 |
"data-open": open || void 0, |
| 17284 |
"data-enter": transition === "enter" || void 0, |
| 17285 |
"data-leave": transition === "leave" || void 0, |
| 17286 |
hidden, |
| 17287 |
...props, |
| 17288 |
id, |
| 17289 |
ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref), |
| 17290 |
style |
| 17291 |
}; |
| 17292 |
return removeUndefinedValues(props); |
| 17293 |
}); |
| 17294 |
var DisclosureContentImpl = forwardRef20(function DisclosureContentImpl2(props) { |
| 17295 |
return createElement3(TagName6, useDisclosureContent(props)); |
| 17296 |
}); |
| 17297 |
var DisclosureContent = forwardRef20(function DisclosureContent2({ unmountOnHide, ...props }) { |
| 17298 |
const context = useDisclosureProviderContext(); |
| 17299 |
if (useStoreState(props.store || context, (state) => !unmountOnHide || state?.mounted) === false) return null; |
| 17300 |
return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DisclosureContentImpl, { ...props }); |
| 17301 |
}); |
| 17302 |
|
| 17303 |
// node_modules/@ariakit/components/dist/disclosure/disclosure-store.js |
| 17304 |
function createDisclosureStore(props = {}) { |
| 17305 |
const store = mergeStore(props.store, omit2(props.disclosure, ["contentElement", "disclosureElement"])); |
| 17306 |
throwOnConflictingProps(props, store); |
| 17307 |
const syncState = store?.getState(); |
| 17308 |
const open = defaultValue(props.open, syncState?.open, props.defaultOpen, false); |
| 17309 |
const animated = defaultValue(props.animated, syncState?.animated, false); |
| 17310 |
const disclosure = createStore({ |
| 17311 |
open, |
| 17312 |
animated, |
| 17313 |
animating: !!animated && open, |
| 17314 |
mounted: open, |
| 17315 |
contentElement: defaultValue(syncState?.contentElement, null), |
| 17316 |
disclosureElement: defaultValue(syncState?.disclosureElement, null) |
| 17317 |
}, store); |
| 17318 |
setup(disclosure, () => sync(disclosure, ["animated", "animating"], (state) => { |
| 17319 |
if (state.animated) return; |
| 17320 |
disclosure.setState("animating", false); |
| 17321 |
})); |
| 17322 |
setup(disclosure, () => subscribe(disclosure, ["open"], () => { |
| 17323 |
if (!disclosure.getState().animated) return; |
| 17324 |
disclosure.setState("animating", true); |
| 17325 |
})); |
| 17326 |
setup(disclosure, () => sync(disclosure, ["open", "animating"], (state) => { |
| 17327 |
disclosure.setState("mounted", state.open || state.animating); |
| 17328 |
})); |
| 17329 |
return { |
| 17330 |
...disclosure, |
| 17331 |
disclosure: props.disclosure, |
| 17332 |
setOpen: (value) => disclosure.setState("open", value), |
| 17333 |
show: () => disclosure.setState("open", true), |
| 17334 |
hide: () => disclosure.setState("open", false), |
| 17335 |
toggle: () => disclosure.setState("open", (open2) => !open2), |
| 17336 |
stopAnimation: () => disclosure.setState("animating", false), |
| 17337 |
setContentElement: (value) => disclosure.setState("contentElement", value), |
| 17338 |
setDisclosureElement: (value) => disclosure.setState("disclosureElement", value) |
| 17339 |
}; |
| 17340 |
} |
| 17341 |
|
| 17342 |
// node_modules/@ariakit/react-components/dist/disclosure/disclosure-store.js |
| 17343 |
function useDisclosureStoreProps(store, update2, props) { |
| 17344 |
useUpdateEffect(update2, [props.store, props.disclosure]); |
| 17345 |
useStoreProps(store, props, "open", "setOpen"); |
| 17346 |
useStoreProps(store, props, "mounted", "setMounted"); |
| 17347 |
useStoreProps(store, props, "animated"); |
| 17348 |
return Object.assign(store, { disclosure: props.disclosure }); |
| 17349 |
} |
| 17350 |
|
| 17351 |
// node_modules/@ariakit/react-components/dist/popover/popover-context.js |
| 17352 |
var ctx5 = createStoreContext([DialogContextProvider], [DialogScopedContextProvider]); |
| 17353 |
var usePopoverContext = ctx5.useContext; |
| 17354 |
var usePopoverScopedContext = ctx5.useScopedContext; |
| 17355 |
var usePopoverProviderContext = ctx5.useProviderContext; |
| 17356 |
var PopoverContextProvider = ctx5.ContextProvider; |
| 17357 |
var PopoverScopedContextProvider = ctx5.ScopedContextProvider; |
| 17358 |
|
| 17359 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-context.js |
| 17360 |
var import_react16 = __toESM(require_react(), 1); |
| 17361 |
var ComboboxListRoleContext = (0, import_react16.createContext)(void 0); |
| 17362 |
var ctx6 = createStoreContext([PopoverContextProvider, CompositeContextProvider], [PopoverScopedContextProvider, CompositeScopedContextProvider]); |
| 17363 |
var useComboboxContext = ctx6.useContext; |
| 17364 |
var useComboboxScopedContext = ctx6.useScopedContext; |
| 17365 |
var useComboboxProviderContext = ctx6.useProviderContext; |
| 17366 |
var ComboboxContextProvider = ctx6.ContextProvider; |
| 17367 |
var ComboboxScopedContextProvider = ctx6.ScopedContextProvider; |
| 17368 |
var ComboboxItemValueContext = (0, import_react16.createContext)(void 0); |
| 17369 |
var ComboboxItemCheckedContext = (0, import_react16.createContext)(false); |
| 17370 |
|
| 17371 |
// node_modules/@ariakit/components/dist/collection/collection-store.js |
| 17372 |
function getCommonParent(items) { |
| 17373 |
const firstItem = items.find((item) => !!item.element); |
| 17374 |
const lastElement = [...items].reverse().find((item) => !!item.element)?.element; |
| 17375 |
let parentElement = firstItem?.element?.parentElement; |
| 17376 |
if (!lastElement) return getDocument(parentElement).body; |
| 17377 |
while (parentElement) { |
| 17378 |
if (parentElement.contains(lastElement)) return parentElement; |
| 17379 |
parentElement = parentElement.parentElement; |
| 17380 |
} |
| 17381 |
return getDocument(parentElement).body; |
| 17382 |
} |
| 17383 |
function getPrivateStore(store) { |
| 17384 |
return store?.__unstablePrivateStore; |
| 17385 |
} |
| 17386 |
function createCollectionStore(props = {}) { |
| 17387 |
throwOnConflictingProps(props, props.store); |
| 17388 |
const syncState = props.store?.getState(); |
| 17389 |
const items = defaultValue(props.items, syncState?.items, props.defaultItems, []); |
| 17390 |
const itemsMap = new Map(items.map((item) => [item.id, item])); |
| 17391 |
const initialState = { |
| 17392 |
items, |
| 17393 |
renderedItems: defaultValue(syncState?.renderedItems, []) |
| 17394 |
}; |
| 17395 |
const syncPrivateStore = getPrivateStore(props.store); |
| 17396 |
const privateStore = createStore({ |
| 17397 |
items, |
| 17398 |
renderedItems: initialState.renderedItems |
| 17399 |
}, syncPrivateStore); |
| 17400 |
const collection = createStore(initialState, props.store); |
| 17401 |
const sortItems = (renderedItems) => { |
| 17402 |
const sortedItems = sortBasedOnDOMPosition(renderedItems, (i2) => i2.element); |
| 17403 |
privateStore.setState("renderedItems", sortedItems); |
| 17404 |
collection.setState("renderedItems", sortedItems); |
| 17405 |
}; |
| 17406 |
setup(collection, () => init(privateStore)); |
| 17407 |
setup(privateStore, () => { |
| 17408 |
return batch(privateStore, ["items"], (state) => { |
| 17409 |
collection.setState("items", state.items); |
| 17410 |
}); |
| 17411 |
}); |
| 17412 |
setup(privateStore, () => { |
| 17413 |
return batch(privateStore, ["renderedItems"], (state) => { |
| 17414 |
let firstRun = true; |
| 17415 |
let raf = requestAnimationFrame(() => { |
| 17416 |
const { renderedItems } = collection.getState(); |
| 17417 |
if (state.renderedItems === renderedItems) return; |
| 17418 |
sortItems(state.renderedItems); |
| 17419 |
}); |
| 17420 |
if (typeof IntersectionObserver !== "function") return () => cancelAnimationFrame(raf); |
| 17421 |
const ioCallback = () => { |
| 17422 |
if (firstRun) { |
| 17423 |
firstRun = false; |
| 17424 |
return; |
| 17425 |
} |
| 17426 |
cancelAnimationFrame(raf); |
| 17427 |
raf = requestAnimationFrame(() => sortItems(state.renderedItems)); |
| 17428 |
}; |
| 17429 |
const root = getCommonParent(state.renderedItems); |
| 17430 |
const observer = new IntersectionObserver(ioCallback, { root }); |
| 17431 |
for (const item of state.renderedItems) { |
| 17432 |
if (!item.element) continue; |
| 17433 |
observer.observe(item.element); |
| 17434 |
} |
| 17435 |
return () => { |
| 17436 |
cancelAnimationFrame(raf); |
| 17437 |
observer.disconnect(); |
| 17438 |
}; |
| 17439 |
}); |
| 17440 |
}); |
| 17441 |
const mergeItem = (item, setItems, canDeleteFromMap = false) => { |
| 17442 |
let prevItem; |
| 17443 |
setItems((items2) => { |
| 17444 |
const index2 = items2.findIndex(({ id }) => id === item.id); |
| 17445 |
const nextItems = items2.slice(); |
| 17446 |
if (index2 !== -1) { |
| 17447 |
prevItem = items2[index2]; |
| 17448 |
const nextItem = { |
| 17449 |
...prevItem, |
| 17450 |
...item |
| 17451 |
}; |
| 17452 |
nextItems[index2] = nextItem; |
| 17453 |
itemsMap.set(item.id, nextItem); |
| 17454 |
} else { |
| 17455 |
nextItems.push(item); |
| 17456 |
itemsMap.set(item.id, item); |
| 17457 |
} |
| 17458 |
return nextItems; |
| 17459 |
}); |
| 17460 |
const unmergeItem = () => { |
| 17461 |
setItems((items2) => { |
| 17462 |
if (!prevItem) { |
| 17463 |
if (canDeleteFromMap) itemsMap.delete(item.id); |
| 17464 |
return items2.filter(({ id }) => id !== item.id); |
| 17465 |
} |
| 17466 |
const index2 = items2.findIndex(({ id }) => id === item.id); |
| 17467 |
if (index2 === -1) return items2; |
| 17468 |
const nextItems = items2.slice(); |
| 17469 |
nextItems[index2] = prevItem; |
| 17470 |
itemsMap.set(item.id, prevItem); |
| 17471 |
return nextItems; |
| 17472 |
}); |
| 17473 |
}; |
| 17474 |
return unmergeItem; |
| 17475 |
}; |
| 17476 |
const registerItem = (item) => mergeItem(item, (getItems) => privateStore.setState("items", getItems), true); |
| 17477 |
return { |
| 17478 |
...collection, |
| 17479 |
registerItem, |
| 17480 |
renderItem: (item) => chain(registerItem(item), mergeItem(item, (getItems) => privateStore.setState("renderedItems", getItems))), |
| 17481 |
item: (id) => { |
| 17482 |
if (!id) return null; |
| 17483 |
let item = itemsMap.get(id); |
| 17484 |
if (!item) { |
| 17485 |
const { items: items2 } = privateStore.getState(); |
| 17486 |
item = items2.find((item2) => item2.id === id); |
| 17487 |
if (item) itemsMap.set(id, item); |
| 17488 |
} |
| 17489 |
return item || null; |
| 17490 |
}, |
| 17491 |
__unstablePrivateStore: privateStore |
| 17492 |
}; |
| 17493 |
} |
| 17494 |
|
| 17495 |
// node_modules/@ariakit/react-components/dist/collection/collection-store.js |
| 17496 |
function useCollectionStoreProps(store, update2, props) { |
| 17497 |
useUpdateEffect(update2, [props.store]); |
| 17498 |
useStoreProps(store, props, "items", "setItems"); |
| 17499 |
return store; |
| 17500 |
} |
| 17501 |
|
| 17502 |
// node_modules/@ariakit/components/dist/composite/composite-store.js |
| 17503 |
var NULL_ITEM = { id: null }; |
| 17504 |
function findFirstEnabledItem2(items, excludeId) { |
| 17505 |
return items.find((item) => { |
| 17506 |
if (excludeId) return !item.disabled && item.id !== excludeId; |
| 17507 |
return !item.disabled; |
| 17508 |
}); |
| 17509 |
} |
| 17510 |
function getEnabledItems(items, excludeId) { |
| 17511 |
return items.filter((item) => { |
| 17512 |
if (excludeId) return !item.disabled && item.id !== excludeId; |
| 17513 |
return !item.disabled; |
| 17514 |
}); |
| 17515 |
} |
| 17516 |
function getItemsInRow(items, rowId) { |
| 17517 |
return items.filter((item) => item.rowId === rowId); |
| 17518 |
} |
| 17519 |
function flipItems(items, activeId, shouldInsertNullItem = false) { |
| 17520 |
const index2 = items.findIndex((item) => item.id === activeId); |
| 17521 |
return [ |
| 17522 |
...items.slice(index2 + 1), |
| 17523 |
...shouldInsertNullItem ? [NULL_ITEM] : [], |
| 17524 |
...items.slice(0, index2) |
| 17525 |
]; |
| 17526 |
} |
| 17527 |
function groupItemsByRows2(items) { |
| 17528 |
const rows = []; |
| 17529 |
for (const item of items) { |
| 17530 |
const row = rows.find((currentRow) => currentRow[0]?.rowId === item.rowId); |
| 17531 |
if (row) row.push(item); |
| 17532 |
else rows.push([item]); |
| 17533 |
} |
| 17534 |
return rows; |
| 17535 |
} |
| 17536 |
function getMaxRowLength(array) { |
| 17537 |
let maxLength = 0; |
| 17538 |
for (const { length } of array) if (length > maxLength) maxLength = length; |
| 17539 |
return maxLength; |
| 17540 |
} |
| 17541 |
function createEmptyItem(rowId) { |
| 17542 |
return { |
| 17543 |
id: "__EMPTY_ITEM__", |
| 17544 |
disabled: true, |
| 17545 |
rowId |
| 17546 |
}; |
| 17547 |
} |
| 17548 |
function normalizeRows(rows, activeId, focusShift) { |
| 17549 |
const maxLength = getMaxRowLength(rows); |
| 17550 |
for (const row of rows) for (let i2 = 0; i2 < maxLength; i2 += 1) { |
| 17551 |
const item = row[i2]; |
| 17552 |
if (!item || focusShift && item.disabled) { |
| 17553 |
const previousItem = i2 === 0 && focusShift ? findFirstEnabledItem2(row) : row[i2 - 1]; |
| 17554 |
row[i2] = previousItem && activeId !== previousItem.id && focusShift ? previousItem : createEmptyItem(previousItem?.rowId); |
| 17555 |
} |
| 17556 |
} |
| 17557 |
return rows; |
| 17558 |
} |
| 17559 |
function verticalizeItems(items) { |
| 17560 |
const rows = groupItemsByRows2(items); |
| 17561 |
const maxLength = getMaxRowLength(rows); |
| 17562 |
const verticalized = []; |
| 17563 |
for (let i2 = 0; i2 < maxLength; i2 += 1) for (const row of rows) { |
| 17564 |
const item = row[i2]; |
| 17565 |
if (item) verticalized.push({ |
| 17566 |
...item, |
| 17567 |
rowId: item.rowId ? `${i2}` : void 0 |
| 17568 |
}); |
| 17569 |
} |
| 17570 |
return verticalized; |
| 17571 |
} |
| 17572 |
function createCompositeStore(props = {}) { |
| 17573 |
const syncState = props.store?.getState(); |
| 17574 |
const collection = createCollectionStore(props); |
| 17575 |
const activeId = defaultValue(props.activeId, syncState?.activeId, props.defaultActiveId); |
| 17576 |
const composite = createStore({ |
| 17577 |
...collection.getState(), |
| 17578 |
id: defaultValue(props.id, syncState?.id) ?? `id-${Math.random().toString(36).slice(2, 8)}`, |
| 17579 |
activeId, |
| 17580 |
baseElement: defaultValue(syncState?.baseElement, null), |
| 17581 |
includesBaseElement: defaultValue(props.includesBaseElement, syncState?.includesBaseElement, activeId === null), |
| 17582 |
moves: defaultValue(syncState?.moves, 0), |
| 17583 |
orientation: defaultValue(props.orientation, syncState?.orientation, "both"), |
| 17584 |
rtl: defaultValue(props.rtl, syncState?.rtl, false), |
| 17585 |
virtualFocus: defaultValue(props.virtualFocus, syncState?.virtualFocus, false), |
| 17586 |
focusLoop: defaultValue(props.focusLoop, syncState?.focusLoop, false), |
| 17587 |
focusWrap: defaultValue(props.focusWrap, syncState?.focusWrap, false), |
| 17588 |
focusShift: defaultValue(props.focusShift, syncState?.focusShift, false) |
| 17589 |
}, collection, props.store); |
| 17590 |
setup(composite, () => sync(composite, ["renderedItems", "activeId"], (state) => { |
| 17591 |
composite.setState("activeId", (activeId2) => { |
| 17592 |
if (activeId2 !== void 0) return activeId2; |
| 17593 |
return findFirstEnabledItem2(state.renderedItems)?.id; |
| 17594 |
}); |
| 17595 |
})); |
| 17596 |
const getNextId = (direction = "next", options = {}) => { |
| 17597 |
const defaultState = composite.getState(); |
| 17598 |
const { skip = 0, activeId: activeId2 = defaultState.activeId, focusShift = defaultState.focusShift, focusLoop = defaultState.focusLoop, focusWrap = defaultState.focusWrap, includesBaseElement = defaultState.includesBaseElement, renderedItems = defaultState.renderedItems, rtl = defaultState.rtl } = options; |
| 17599 |
const isVerticalDirection = direction === "up" || direction === "down"; |
| 17600 |
const isNextDirection = direction === "next" || direction === "down"; |
| 17601 |
const canReverse = isNextDirection ? rtl && !isVerticalDirection : !rtl || isVerticalDirection; |
| 17602 |
const canShift = focusShift && !skip; |
| 17603 |
let items = !isVerticalDirection ? renderedItems : flatten2DArray(normalizeRows(groupItemsByRows2(renderedItems), activeId2, canShift)); |
| 17604 |
items = canReverse ? reverseArray(items) : items; |
| 17605 |
items = isVerticalDirection ? verticalizeItems(items) : items; |
| 17606 |
if (activeId2 == null) return findFirstEnabledItem2(items)?.id; |
| 17607 |
const activeItem = items.find((item) => item.id === activeId2); |
| 17608 |
if (!activeItem) return findFirstEnabledItem2(items)?.id; |
| 17609 |
const isGrid2 = items.some((item) => item.rowId); |
| 17610 |
const activeIndex = items.indexOf(activeItem); |
| 17611 |
const nextItems = items.slice(activeIndex + 1); |
| 17612 |
const nextItemsInRow = getItemsInRow(nextItems, activeItem.rowId); |
| 17613 |
if (skip) { |
| 17614 |
const nextEnabledItemsInRow = getEnabledItems(nextItemsInRow, activeId2); |
| 17615 |
return (nextEnabledItemsInRow.slice(skip)[0] || nextEnabledItemsInRow[nextEnabledItemsInRow.length - 1])?.id; |
| 17616 |
} |
| 17617 |
const canLoop = focusLoop && (isVerticalDirection ? focusLoop !== "horizontal" : focusLoop !== "vertical"); |
| 17618 |
const canWrap = isGrid2 && focusWrap && (isVerticalDirection ? focusWrap !== "horizontal" : focusWrap !== "vertical"); |
| 17619 |
const hasNullItem = isNextDirection ? (!isGrid2 || isVerticalDirection) && canLoop && includesBaseElement : isVerticalDirection ? includesBaseElement : false; |
| 17620 |
if (canLoop) return findFirstEnabledItem2(flipItems(canWrap && !hasNullItem ? items : getItemsInRow(items, activeItem.rowId), activeId2, hasNullItem), activeId2)?.id; |
| 17621 |
if (canWrap) { |
| 17622 |
const nextItem2 = findFirstEnabledItem2(hasNullItem ? nextItemsInRow : nextItems, activeId2); |
| 17623 |
return hasNullItem ? nextItem2?.id || null : nextItem2?.id; |
| 17624 |
} |
| 17625 |
const nextItem = findFirstEnabledItem2(nextItemsInRow, activeId2); |
| 17626 |
if (!nextItem && hasNullItem) return null; |
| 17627 |
return nextItem?.id; |
| 17628 |
}; |
| 17629 |
return { |
| 17630 |
...collection, |
| 17631 |
...composite, |
| 17632 |
setBaseElement: (element) => composite.setState("baseElement", element), |
| 17633 |
setActiveId: (id) => composite.setState("activeId", id), |
| 17634 |
move: (id) => { |
| 17635 |
if (id === void 0) return; |
| 17636 |
composite.setState("activeId", id); |
| 17637 |
composite.setState("moves", (moves) => moves + 1); |
| 17638 |
}, |
| 17639 |
first: () => findFirstEnabledItem2(composite.getState().renderedItems)?.id, |
| 17640 |
last: () => findFirstEnabledItem2(reverseArray(composite.getState().renderedItems))?.id, |
| 17641 |
next: (options) => { |
| 17642 |
if (options !== void 0 && typeof options === "number") options = { skip: options }; |
| 17643 |
return getNextId("next", options); |
| 17644 |
}, |
| 17645 |
previous: (options) => { |
| 17646 |
if (options !== void 0 && typeof options === "number") options = { skip: options }; |
| 17647 |
return getNextId("previous", options); |
| 17648 |
}, |
| 17649 |
down: (options) => { |
| 17650 |
if (options !== void 0 && typeof options === "number") options = { skip: options }; |
| 17651 |
return getNextId("down", options); |
| 17652 |
}, |
| 17653 |
up: (options) => { |
| 17654 |
if (options !== void 0 && typeof options === "number") options = { skip: options }; |
| 17655 |
return getNextId("up", options); |
| 17656 |
} |
| 17657 |
}; |
| 17658 |
} |
| 17659 |
|
| 17660 |
// node_modules/@ariakit/react-components/dist/composite/composite-store.js |
| 17661 |
function useCompositeStoreOptions(props) { |
| 17662 |
return { |
| 17663 |
id: useId4(props.id), |
| 17664 |
...props |
| 17665 |
}; |
| 17666 |
} |
| 17667 |
function useCompositeStoreProps(store, update2, props) { |
| 17668 |
store = useCollectionStoreProps(store, update2, props); |
| 17669 |
useStoreProps(store, props, "activeId", "setActiveId"); |
| 17670 |
useStoreProps(store, props, "includesBaseElement"); |
| 17671 |
useStoreProps(store, props, "virtualFocus"); |
| 17672 |
useStoreProps(store, props, "orientation"); |
| 17673 |
useStoreProps(store, props, "rtl"); |
| 17674 |
useStoreProps(store, props, "focusLoop"); |
| 17675 |
useStoreProps(store, props, "focusWrap"); |
| 17676 |
useStoreProps(store, props, "focusShift"); |
| 17677 |
return store; |
| 17678 |
} |
| 17679 |
|
| 17680 |
// node_modules/@ariakit/components/dist/dialog/dialog-store.js |
| 17681 |
function createDialogStore(props = {}) { |
| 17682 |
return createDisclosureStore(props); |
| 17683 |
} |
| 17684 |
|
| 17685 |
// node_modules/@ariakit/react-components/dist/dialog/dialog-store.js |
| 17686 |
function useDialogStoreProps(store, update2, props) { |
| 17687 |
return useDisclosureStoreProps(store, update2, props); |
| 17688 |
} |
| 17689 |
|
| 17690 |
// node_modules/@ariakit/components/dist/popover/popover-store.js |
| 17691 |
function createPopoverStore({ popover: otherPopover, ...props } = {}) { |
| 17692 |
const store = mergeStore(props.store, omit2(otherPopover, [ |
| 17693 |
"arrowElement", |
| 17694 |
"anchorElement", |
| 17695 |
"contentElement", |
| 17696 |
"popoverElement", |
| 17697 |
"disclosureElement" |
| 17698 |
])); |
| 17699 |
throwOnConflictingProps(props, store); |
| 17700 |
const syncState = store?.getState(); |
| 17701 |
const dialog = createDialogStore({ |
| 17702 |
...props, |
| 17703 |
store |
| 17704 |
}); |
| 17705 |
const placement = defaultValue(props.placement, syncState?.placement, "bottom"); |
| 17706 |
const popover = createStore({ |
| 17707 |
...dialog.getState(), |
| 17708 |
placement, |
| 17709 |
currentPlacement: placement, |
| 17710 |
anchorElement: defaultValue(syncState?.anchorElement, null), |
| 17711 |
popoverElement: defaultValue(syncState?.popoverElement, null), |
| 17712 |
arrowElement: defaultValue(syncState?.arrowElement, null), |
| 17713 |
rendered: /* @__PURE__ */ Symbol("rendered") |
| 17714 |
}, dialog, store); |
| 17715 |
return { |
| 17716 |
...dialog, |
| 17717 |
...popover, |
| 17718 |
setAnchorElement: (element) => popover.setState("anchorElement", element), |
| 17719 |
setPopoverElement: (element) => popover.setState("popoverElement", element), |
| 17720 |
setArrowElement: (element) => popover.setState("arrowElement", element), |
| 17721 |
render: () => popover.setState("rendered", /* @__PURE__ */ Symbol("rendered")) |
| 17722 |
}; |
| 17723 |
} |
| 17724 |
|
| 17725 |
// node_modules/@ariakit/react-components/dist/popover/popover-store.js |
| 17726 |
function usePopoverStoreProps(store, update2, props) { |
| 17727 |
useUpdateEffect(update2, [props.popover]); |
| 17728 |
useStoreProps(store, props, "placement"); |
| 17729 |
return useDialogStoreProps(store, update2, props); |
| 17730 |
} |
| 17731 |
|
| 17732 |
// node_modules/@ariakit/react-components/dist/popover/popover-anchor.js |
| 17733 |
var TagName7 = "div"; |
| 17734 |
var usePopoverAnchor = createHook(function usePopoverAnchor2({ store, ...props }) { |
| 17735 |
const context = usePopoverProviderContext(); |
| 17736 |
store = store || context; |
| 17737 |
props = { |
| 17738 |
...props, |
| 17739 |
ref: useMergeRefs(store?.setAnchorElement, props.ref) |
| 17740 |
}; |
| 17741 |
return props; |
| 17742 |
}); |
| 17743 |
var PopoverAnchor = forwardRef20(function PopoverAnchor2(props) { |
| 17744 |
return createElement3(TagName7, usePopoverAnchor(props)); |
| 17745 |
}); |
| 17746 |
|
| 17747 |
// node_modules/@ariakit/react-components/dist/composite/composite-hover.js |
| 17748 |
var import_react17 = __toESM(require_react(), 1); |
| 17749 |
var TagName8 = "div"; |
| 17750 |
function hoveringInside(event) { |
| 17751 |
const nextElement = event.relatedTarget; |
| 17752 |
if (!isElement2(nextElement)) return false; |
| 17753 |
return contains2(event.currentTarget, nextElement); |
| 17754 |
} |
| 17755 |
var symbol2 = /* @__PURE__ */ Symbol("composite-hover"); |
| 17756 |
function movingToAnotherItem(event) { |
| 17757 |
const { relatedTarget } = event; |
| 17758 |
if (!isElement2(relatedTarget)) return false; |
| 17759 |
let dest = relatedTarget; |
| 17760 |
do { |
| 17761 |
if (hasOwnProperty(dest, symbol2) && dest[symbol2]) return true; |
| 17762 |
dest = dest.parentElement; |
| 17763 |
} while (dest); |
| 17764 |
return false; |
| 17765 |
} |
| 17766 |
var useCompositeHover = createHook(function useCompositeHover2({ store, focusOnHover = true, blurOnHoverEnd = !!focusOnHover, ...props }) { |
| 17767 |
const context = useCompositeScopedContext(); |
| 17768 |
store = store || context; |
| 17769 |
invariant(store, "CompositeHover must be wrapped in a Composite component."); |
| 17770 |
const isMouseMoving = useIsMouseMoving(); |
| 17771 |
const onMouseMoveProp = props.onMouseMove; |
| 17772 |
const focusOnHoverProp = useBooleanEvent(focusOnHover); |
| 17773 |
const onMouseMove = useEvent((event) => { |
| 17774 |
onMouseMoveProp?.(event); |
| 17775 |
if (event.defaultPrevented) return; |
| 17776 |
if (!isMouseMoving()) return; |
| 17777 |
if (!focusOnHoverProp(event)) return; |
| 17778 |
if (!hasFocusWithin(event.currentTarget)) { |
| 17779 |
const baseElement = store?.getState().baseElement; |
| 17780 |
if (baseElement && !hasFocus(baseElement)) baseElement.focus(); |
| 17781 |
} |
| 17782 |
store?.setActiveId(event.currentTarget.id); |
| 17783 |
}); |
| 17784 |
const onMouseLeaveProp = props.onMouseLeave; |
| 17785 |
const blurOnHoverEndProp = useBooleanEvent(blurOnHoverEnd); |
| 17786 |
const onMouseLeave = useEvent((event) => { |
| 17787 |
onMouseLeaveProp?.(event); |
| 17788 |
if (event.defaultPrevented) return; |
| 17789 |
if (!isMouseMoving()) return; |
| 17790 |
if (hoveringInside(event)) return; |
| 17791 |
if (movingToAnotherItem(event)) return; |
| 17792 |
if (!focusOnHoverProp(event)) return; |
| 17793 |
if (!blurOnHoverEndProp(event)) return; |
| 17794 |
store?.setActiveId(null); |
| 17795 |
store?.getState().baseElement?.focus(); |
| 17796 |
}); |
| 17797 |
const ref = (0, import_react17.useCallback)((element) => { |
| 17798 |
if (!element) return; |
| 17799 |
element[symbol2] = true; |
| 17800 |
}, []); |
| 17801 |
props = { |
| 17802 |
...props, |
| 17803 |
ref: useMergeRefs(ref, props.ref), |
| 17804 |
onMouseMove, |
| 17805 |
onMouseLeave |
| 17806 |
}; |
| 17807 |
return removeUndefinedValues(props); |
| 17808 |
}); |
| 17809 |
var CompositeHover = memo3(forwardRef20(function CompositeHover2(props) { |
| 17810 |
return createElement3(TagName8, useCompositeHover(props)); |
| 17811 |
})); |
| 17812 |
|
| 17813 |
// node_modules/@ariakit/react-components/dist/combobox/combobox.js |
| 17814 |
var import_react18 = __toESM(require_react(), 1); |
| 17815 |
var TagName9 = "input"; |
| 17816 |
function isFirstItemAutoSelected(items, activeValue, autoSelect) { |
| 17817 |
if (!autoSelect) return false; |
| 17818 |
return items.find((item) => !item.disabled && item.value)?.value === activeValue; |
| 17819 |
} |
| 17820 |
function hasCompletionString(value, activeValue) { |
| 17821 |
if (!activeValue) return false; |
| 17822 |
if (value == null) return false; |
| 17823 |
value = normalizeString(value); |
| 17824 |
return activeValue.length > value.length && activeValue.toLowerCase().indexOf(value.toLowerCase()) === 0; |
| 17825 |
} |
| 17826 |
function isInputEvent(event) { |
| 17827 |
return event.type === "input"; |
| 17828 |
} |
| 17829 |
function isAriaAutoCompleteValue(value) { |
| 17830 |
return value === "inline" || value === "list" || value === "both" || value === "none"; |
| 17831 |
} |
| 17832 |
function getDefaultAutoSelectId(items) { |
| 17833 |
return items.find((item) => { |
| 17834 |
if (item.disabled) return false; |
| 17835 |
return item.element?.getAttribute("role") !== "tab"; |
| 17836 |
})?.id; |
| 17837 |
} |
| 17838 |
var useCombobox = createHook(function useCombobox2({ store, focusable: focusable2 = true, autoSelect: autoSelectProp = false, getAutoSelectId, setValueOnChange, showMinLength = 0, showOnChange, showOnMouseDown, showOnClick = showOnMouseDown, showOnKeyDown, showOnKeyPress = showOnKeyDown, blurActiveItemOnClick, setValueOnClick = true, moveOnKeyPress = true, autoComplete = "list", ...props }) { |
| 17839 |
const context = useComboboxProviderContext(); |
| 17840 |
store = store || context; |
| 17841 |
invariant(store, "Combobox must receive a `store` prop or be wrapped in a ComboboxProvider component."); |
| 17842 |
const ref = (0, import_react18.useRef)(null); |
| 17843 |
const [valueUpdated, forceValueUpdate] = useForceUpdate(); |
| 17844 |
const canAutoSelectRef = (0, import_react18.useRef)(false); |
| 17845 |
const composingRef = (0, import_react18.useRef)(false); |
| 17846 |
const autoSelect = useStoreState(store, (state) => state.virtualFocus && autoSelectProp); |
| 17847 |
const inline4 = autoComplete === "inline" || autoComplete === "both"; |
| 17848 |
const [canInline, setCanInline] = (0, import_react18.useState)(inline4); |
| 17849 |
useUpdateLayoutEffect(() => { |
| 17850 |
if (!inline4) return; |
| 17851 |
setCanInline(true); |
| 17852 |
}, [inline4]); |
| 17853 |
const storeValue = useStoreState(store, "value"); |
| 17854 |
const prevSelectedValueRef = (0, import_react18.useRef)(void 0); |
| 17855 |
(0, import_react18.useEffect)(() => { |
| 17856 |
return sync(store, ["selectedValue", "activeId"], (_, prev) => { |
| 17857 |
prevSelectedValueRef.current = prev.selectedValue; |
| 17858 |
}); |
| 17859 |
}, [store]); |
| 17860 |
const inlineActiveValue = useStoreState(store, (state) => { |
| 17861 |
if (!inline4) return; |
| 17862 |
if (!canInline) return; |
| 17863 |
if (state.activeValue && Array.isArray(state.selectedValue)) { |
| 17864 |
if (state.selectedValue.includes(state.activeValue)) return; |
| 17865 |
if (prevSelectedValueRef.current?.includes(state.activeValue)) return; |
| 17866 |
} |
| 17867 |
return state.activeValue; |
| 17868 |
}); |
| 17869 |
const items = useStoreState(store, "renderedItems"); |
| 17870 |
const open = useStoreState(store, "open"); |
| 17871 |
const contentElement = useStoreState(store, "contentElement"); |
| 17872 |
const value = (0, import_react18.useMemo)(() => { |
| 17873 |
if (!inline4) return storeValue; |
| 17874 |
if (!canInline) return storeValue; |
| 17875 |
if (isFirstItemAutoSelected(items, inlineActiveValue, autoSelect)) { |
| 17876 |
if (hasCompletionString(storeValue, inlineActiveValue)) return storeValue + (inlineActiveValue?.slice(storeValue.length) || ""); |
| 17877 |
return storeValue; |
| 17878 |
} |
| 17879 |
return inlineActiveValue || storeValue; |
| 17880 |
}, [ |
| 17881 |
inline4, |
| 17882 |
canInline, |
| 17883 |
items, |
| 17884 |
inlineActiveValue, |
| 17885 |
autoSelect, |
| 17886 |
storeValue |
| 17887 |
]); |
| 17888 |
(0, import_react18.useEffect)(() => { |
| 17889 |
const element = ref.current; |
| 17890 |
if (!element) return; |
| 17891 |
const onCompositeItemMove = () => setCanInline(true); |
| 17892 |
element.addEventListener("combobox-item-move", onCompositeItemMove); |
| 17893 |
return () => { |
| 17894 |
element.removeEventListener("combobox-item-move", onCompositeItemMove); |
| 17895 |
}; |
| 17896 |
}, []); |
| 17897 |
(0, import_react18.useEffect)(() => { |
| 17898 |
if (!inline4) return; |
| 17899 |
if (!canInline) return; |
| 17900 |
if (!inlineActiveValue) return; |
| 17901 |
if (!isFirstItemAutoSelected(items, inlineActiveValue, autoSelect)) return; |
| 17902 |
if (!hasCompletionString(storeValue, inlineActiveValue)) return; |
| 17903 |
let cleanup = noop5; |
| 17904 |
queueMicrotask(() => { |
| 17905 |
const element = ref.current; |
| 17906 |
if (!element) return; |
| 17907 |
const { start: prevStart, end: prevEnd } = getTextboxSelection(element); |
| 17908 |
const nextStart = storeValue.length; |
| 17909 |
const nextEnd = inlineActiveValue.length; |
| 17910 |
setSelectionRange(element, nextStart, nextEnd); |
| 17911 |
cleanup = () => { |
| 17912 |
if (!hasFocus(element)) return; |
| 17913 |
const { start, end } = getTextboxSelection(element); |
| 17914 |
if (start !== nextStart) return; |
| 17915 |
if (end !== nextEnd) return; |
| 17916 |
setSelectionRange(element, prevStart, prevEnd); |
| 17917 |
}; |
| 17918 |
}); |
| 17919 |
return () => cleanup(); |
| 17920 |
}, [ |
| 17921 |
valueUpdated, |
| 17922 |
inline4, |
| 17923 |
canInline, |
| 17924 |
inlineActiveValue, |
| 17925 |
items, |
| 17926 |
autoSelect, |
| 17927 |
storeValue |
| 17928 |
]); |
| 17929 |
const scrollingElementRef = (0, import_react18.useRef)(null); |
| 17930 |
const getAutoSelectIdProp = useEvent(getAutoSelectId); |
| 17931 |
const autoSelectIdRef = (0, import_react18.useRef)(null); |
| 17932 |
const autoSelectMovedRef = (0, import_react18.useRef)(void 0); |
| 17933 |
const userScrolledRef = (0, import_react18.useRef)(false); |
| 17934 |
const isAutoScrollingRef = (0, import_react18.useRef)(false); |
| 17935 |
(0, import_react18.useEffect)(() => { |
| 17936 |
if (!open) return; |
| 17937 |
if (!contentElement) return; |
| 17938 |
const scrollingElement = getScrollingElement(contentElement); |
| 17939 |
if (!scrollingElement) return; |
| 17940 |
scrollingElementRef.current = scrollingElement; |
| 17941 |
const onUserScroll = () => { |
| 17942 |
canAutoSelectRef.current = false; |
| 17943 |
userScrolledRef.current = true; |
| 17944 |
}; |
| 17945 |
const onScroll = () => { |
| 17946 |
if (!isAutoScrollingRef.current) userScrolledRef.current = true; |
| 17947 |
if (!store) return; |
| 17948 |
if (!canAutoSelectRef.current) return; |
| 17949 |
const { activeId } = store.getState(); |
| 17950 |
if (activeId === null) return; |
| 17951 |
if (activeId === autoSelectIdRef.current) return; |
| 17952 |
canAutoSelectRef.current = false; |
| 17953 |
}; |
| 17954 |
const options = { |
| 17955 |
passive: true, |
| 17956 |
capture: true |
| 17957 |
}; |
| 17958 |
scrollingElement.addEventListener("wheel", onUserScroll, options); |
| 17959 |
scrollingElement.addEventListener("touchmove", onUserScroll, options); |
| 17960 |
scrollingElement.addEventListener("scroll", onScroll, options); |
| 17961 |
return () => { |
| 17962 |
scrollingElement.removeEventListener("wheel", onUserScroll, true); |
| 17963 |
scrollingElement.removeEventListener("touchmove", onUserScroll, true); |
| 17964 |
scrollingElement.removeEventListener("scroll", onScroll, true); |
| 17965 |
}; |
| 17966 |
}, [ |
| 17967 |
open, |
| 17968 |
contentElement, |
| 17969 |
store |
| 17970 |
]); |
| 17971 |
useSafeLayoutEffect(() => { |
| 17972 |
userScrolledRef.current = false; |
| 17973 |
if (!storeValue) return; |
| 17974 |
if (composingRef.current) return; |
| 17975 |
canAutoSelectRef.current = true; |
| 17976 |
}, [storeValue]); |
| 17977 |
useSafeLayoutEffect(() => { |
| 17978 |
if (autoSelect !== "always" && open) return; |
| 17979 |
canAutoSelectRef.current = open; |
| 17980 |
}, [autoSelect, open]); |
| 17981 |
useSafeLayoutEffect(() => { |
| 17982 |
if (open) return; |
| 17983 |
autoSelectMovedRef.current = void 0; |
| 17984 |
}, [open]); |
| 17985 |
const resetValueOnSelect = useStoreState(store, "resetValueOnSelect"); |
| 17986 |
useUpdateEffect(() => { |
| 17987 |
const canAutoSelect = canAutoSelectRef.current; |
| 17988 |
if (!store) return; |
| 17989 |
if (!open) return; |
| 17990 |
if (!canAutoSelect && (!resetValueOnSelect || userScrolledRef.current)) return; |
| 17991 |
const { baseElement, contentElement: contentElement2, activeId } = store.getState(); |
| 17992 |
if (baseElement && !hasFocus(baseElement)) return; |
| 17993 |
if (contentElement2?.hasAttribute("data-placing")) { |
| 17994 |
const observer = new MutationObserver(forceValueUpdate); |
| 17995 |
observer.observe(contentElement2, { attributeFilter: ["data-placing"] }); |
| 17996 |
return () => observer.disconnect(); |
| 17997 |
} |
| 17998 |
if (autoSelect && canAutoSelect) { |
| 17999 |
const userAutoSelectId = getAutoSelectIdProp(items); |
| 18000 |
const autoSelectId = userAutoSelectId !== void 0 ? userAutoSelectId : getDefaultAutoSelectId(items) ?? store.first(); |
| 18001 |
autoSelectIdRef.current = autoSelectId; |
| 18002 |
const nextActiveId = autoSelectId ?? null; |
| 18003 |
const nextActiveValue = store.item(nextActiveId)?.value; |
| 18004 |
const moved = autoSelectMovedRef.current; |
| 18005 |
if (nextActiveId !== activeId || moved?.id !== nextActiveId || moved?.value !== nextActiveValue) { |
| 18006 |
autoSelectMovedRef.current = { |
| 18007 |
id: nextActiveId, |
| 18008 |
value: nextActiveValue |
| 18009 |
}; |
| 18010 |
store.move(nextActiveId); |
| 18011 |
} else store.setState("activeValue", nextActiveValue); |
| 18012 |
} else { |
| 18013 |
const element = store.item(activeId || store.first())?.element; |
| 18014 |
if (element && "scrollIntoView" in element) { |
| 18015 |
isAutoScrollingRef.current = true; |
| 18016 |
element.scrollIntoView({ |
| 18017 |
block: "nearest", |
| 18018 |
inline: "nearest" |
| 18019 |
}); |
| 18020 |
requestAnimationFrame(() => { |
| 18021 |
isAutoScrollingRef.current = false; |
| 18022 |
}); |
| 18023 |
} |
| 18024 |
} |
| 18025 |
}, [ |
| 18026 |
store, |
| 18027 |
open, |
| 18028 |
valueUpdated, |
| 18029 |
storeValue, |
| 18030 |
autoSelect, |
| 18031 |
resetValueOnSelect, |
| 18032 |
getAutoSelectIdProp, |
| 18033 |
items |
| 18034 |
]); |
| 18035 |
(0, import_react18.useEffect)(() => { |
| 18036 |
if (!inline4) return; |
| 18037 |
const combobox = ref.current; |
| 18038 |
if (!combobox) return; |
| 18039 |
const elements = [combobox, contentElement].filter((value2) => !!value2); |
| 18040 |
const onBlur2 = (event) => { |
| 18041 |
if (elements.every((el) => isFocusEventOutside(event, el))) store?.setValue(value); |
| 18042 |
}; |
| 18043 |
for (const element of elements) element.addEventListener("focusout", onBlur2); |
| 18044 |
return () => { |
| 18045 |
for (const element of elements) element.removeEventListener("focusout", onBlur2); |
| 18046 |
}; |
| 18047 |
}, [ |
| 18048 |
inline4, |
| 18049 |
contentElement, |
| 18050 |
store, |
| 18051 |
value |
| 18052 |
]); |
| 18053 |
const canShow = (event) => { |
| 18054 |
return event.currentTarget.value.length >= showMinLength; |
| 18055 |
}; |
| 18056 |
const onChangeProp = props.onChange; |
| 18057 |
const showOnChangeProp = useBooleanEvent(showOnChange ?? canShow); |
| 18058 |
const setValueOnChangeProp = useBooleanEvent(setValueOnChange ?? !store.tag); |
| 18059 |
const onChange = useEvent((event) => { |
| 18060 |
onChangeProp?.(event); |
| 18061 |
if (event.defaultPrevented) return; |
| 18062 |
if (!store) return; |
| 18063 |
const currentTarget = event.currentTarget; |
| 18064 |
const { value: value2, selectionStart, selectionEnd } = currentTarget; |
| 18065 |
const nativeEvent = event.nativeEvent; |
| 18066 |
canAutoSelectRef.current = true; |
| 18067 |
if (isInputEvent(nativeEvent)) { |
| 18068 |
if (nativeEvent.isComposing) { |
| 18069 |
canAutoSelectRef.current = false; |
| 18070 |
composingRef.current = true; |
| 18071 |
} |
| 18072 |
if (inline4) { |
| 18073 |
const textInserted = nativeEvent.inputType === "insertText" || nativeEvent.inputType === "insertCompositionText"; |
| 18074 |
const caretAtEnd = selectionStart === value2.length; |
| 18075 |
setCanInline(textInserted && caretAtEnd); |
| 18076 |
} |
| 18077 |
} |
| 18078 |
if (setValueOnChangeProp(event)) { |
| 18079 |
const isSameValue = value2 === store.getState().value; |
| 18080 |
store.setValue(value2); |
| 18081 |
queueMicrotask(() => { |
| 18082 |
setSelectionRange(currentTarget, selectionStart, selectionEnd); |
| 18083 |
}); |
| 18084 |
if (inline4 && autoSelect && isSameValue) forceValueUpdate(); |
| 18085 |
} |
| 18086 |
if (showOnChangeProp(event)) store.show(); |
| 18087 |
if (!autoSelect || !canAutoSelectRef.current) store.setActiveId(null); |
| 18088 |
}); |
| 18089 |
const onCompositionEndProp = props.onCompositionEnd; |
| 18090 |
const onCompositionEnd = useEvent((event) => { |
| 18091 |
canAutoSelectRef.current = true; |
| 18092 |
composingRef.current = false; |
| 18093 |
onCompositionEndProp?.(event); |
| 18094 |
if (event.defaultPrevented) return; |
| 18095 |
if (!autoSelect) return; |
| 18096 |
forceValueUpdate(); |
| 18097 |
}); |
| 18098 |
const onMouseDownProp = props.onMouseDown; |
| 18099 |
const blurActiveItemOnClickProp = useBooleanEvent(blurActiveItemOnClick ?? (() => store.getState().includesBaseElement)); |
| 18100 |
const setValueOnClickProp = useBooleanEvent(setValueOnClick); |
| 18101 |
const showOnClickProp = useBooleanEvent(showOnClick ?? canShow); |
| 18102 |
const onMouseDown = useEvent((event) => { |
| 18103 |
onMouseDownProp?.(event); |
| 18104 |
if (event.defaultPrevented) return; |
| 18105 |
if (event.button) return; |
| 18106 |
if (event.ctrlKey) return; |
| 18107 |
if (!store) return; |
| 18108 |
if (blurActiveItemOnClickProp(event)) store.setActiveId(null); |
| 18109 |
if (setValueOnClickProp(event)) store.setValue(value); |
| 18110 |
if (showOnClickProp(event)) queueBeforeEvent(event.currentTarget, "mouseup", store.show); |
| 18111 |
}); |
| 18112 |
const onKeyDownProp = props.onKeyDown; |
| 18113 |
const showOnKeyPressProp = useBooleanEvent(showOnKeyPress ?? canShow); |
| 18114 |
const onKeyDown = useEvent((event) => { |
| 18115 |
onKeyDownProp?.(event); |
| 18116 |
if (!event.repeat) canAutoSelectRef.current = false; |
| 18117 |
if (event.defaultPrevented) return; |
| 18118 |
if (!store) return; |
| 18119 |
const { open: open2 } = store.getState(); |
| 18120 |
if (open2 && event.key === "Enter") { |
| 18121 |
event.preventDefault(); |
| 18122 |
return; |
| 18123 |
} |
| 18124 |
if (event.ctrlKey) return; |
| 18125 |
if (event.altKey) return; |
| 18126 |
if (event.shiftKey) return; |
| 18127 |
if (event.metaKey) return; |
| 18128 |
if (open2) return; |
| 18129 |
if (event.key === "ArrowUp" || event.key === "ArrowDown") { |
| 18130 |
if (showOnKeyPressProp(event)) { |
| 18131 |
event.preventDefault(); |
| 18132 |
store.show(); |
| 18133 |
} |
| 18134 |
} |
| 18135 |
}); |
| 18136 |
const onBlurProp = props.onBlur; |
| 18137 |
const onBlur = useEvent((event) => { |
| 18138 |
canAutoSelectRef.current = false; |
| 18139 |
onBlurProp?.(event); |
| 18140 |
if (event.defaultPrevented) return; |
| 18141 |
}); |
| 18142 |
const id = useId4(props.id); |
| 18143 |
const ariaAutoComplete = isAriaAutoCompleteValue(autoComplete) ? autoComplete : void 0; |
| 18144 |
const isActiveItem = useStoreState(store, (state) => state.activeId === null); |
| 18145 |
props = { |
| 18146 |
role: "combobox", |
| 18147 |
"aria-autocomplete": ariaAutoComplete, |
| 18148 |
"aria-haspopup": getPopupRole(contentElement, "listbox"), |
| 18149 |
"aria-expanded": open, |
| 18150 |
"aria-controls": contentElement?.id, |
| 18151 |
"data-active-item": isActiveItem || void 0, |
| 18152 |
value, |
| 18153 |
...props, |
| 18154 |
id, |
| 18155 |
ref: useMergeRefs(ref, props.ref), |
| 18156 |
onChange, |
| 18157 |
onCompositionEnd, |
| 18158 |
onMouseDown, |
| 18159 |
onKeyDown, |
| 18160 |
onBlur |
| 18161 |
}; |
| 18162 |
props = useComposite({ |
| 18163 |
store, |
| 18164 |
focusable: focusable2, |
| 18165 |
...props, |
| 18166 |
moveOnKeyPress: (event) => { |
| 18167 |
if (isFalsyBooleanCallback(moveOnKeyPress, event)) return false; |
| 18168 |
if (inline4) setCanInline(true); |
| 18169 |
return true; |
| 18170 |
} |
| 18171 |
}); |
| 18172 |
props = usePopoverAnchor({ |
| 18173 |
store, |
| 18174 |
...props |
| 18175 |
}); |
| 18176 |
return { |
| 18177 |
autoComplete: "off", |
| 18178 |
...props |
| 18179 |
}; |
| 18180 |
}); |
| 18181 |
var Combobox = forwardRef20(function Combobox2(props) { |
| 18182 |
return createElement3(TagName9, useCombobox(props)); |
| 18183 |
}); |
| 18184 |
|
| 18185 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-item.js |
| 18186 |
var import_react19 = __toESM(require_react(), 1); |
| 18187 |
var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1); |
| 18188 |
var TagName10 = "div"; |
| 18189 |
function isSelected(storeValue, itemValue) { |
| 18190 |
if (itemValue == null) return; |
| 18191 |
if (storeValue == null) return false; |
| 18192 |
if (Array.isArray(storeValue)) return storeValue.includes(itemValue); |
| 18193 |
return storeValue === itemValue; |
| 18194 |
} |
| 18195 |
function getItemRole(popupRole) { |
| 18196 |
return { |
| 18197 |
menu: "menuitem", |
| 18198 |
listbox: "option", |
| 18199 |
tree: "treeitem" |
| 18200 |
}[popupRole] ?? "option"; |
| 18201 |
} |
| 18202 |
var useComboboxItem = createHook(function useComboboxItem2({ store, value, hideOnClick, setValueOnClick, selectValueOnClick = true, resetValueOnSelect, focusOnHover = false, moveOnKeyPress = true, getItem: getItemProp, ...props }) { |
| 18203 |
const context = useComboboxScopedContext(); |
| 18204 |
store = store || context; |
| 18205 |
invariant(store, "ComboboxItem must be wrapped in a ComboboxList or ComboboxPopover component."); |
| 18206 |
const { resetValueOnSelectState, multiSelectable, selected } = useStoreStateObject(store, { |
| 18207 |
resetValueOnSelectState: "resetValueOnSelect", |
| 18208 |
multiSelectable(state) { |
| 18209 |
return Array.isArray(state.selectedValue); |
| 18210 |
}, |
| 18211 |
selected(state) { |
| 18212 |
return isSelected(state.selectedValue, value); |
| 18213 |
} |
| 18214 |
}); |
| 18215 |
const getItem = (0, import_react19.useCallback)((item) => { |
| 18216 |
const nextItem = { |
| 18217 |
...item, |
| 18218 |
value |
| 18219 |
}; |
| 18220 |
if (getItemProp) return getItemProp(nextItem); |
| 18221 |
return nextItem; |
| 18222 |
}, [value, getItemProp]); |
| 18223 |
setValueOnClick = setValueOnClick ?? !multiSelectable; |
| 18224 |
hideOnClick = hideOnClick ?? (value != null && !multiSelectable); |
| 18225 |
const onClickProp = props.onClick; |
| 18226 |
const setValueOnClickProp = useBooleanEvent(setValueOnClick); |
| 18227 |
const selectValueOnClickProp = useBooleanEvent(selectValueOnClick); |
| 18228 |
const resetValueOnSelectProp = useBooleanEvent(resetValueOnSelect ?? resetValueOnSelectState ?? multiSelectable); |
| 18229 |
const hideOnClickProp = useBooleanEvent(hideOnClick); |
| 18230 |
const onClick = useEvent((event) => { |
| 18231 |
onClickProp?.(event); |
| 18232 |
if (event.defaultPrevented) return; |
| 18233 |
if (isDownloading(event)) return; |
| 18234 |
if (isOpeningInNewTab(event)) return; |
| 18235 |
if (value != null) { |
| 18236 |
if (selectValueOnClickProp(event)) { |
| 18237 |
if (resetValueOnSelectProp(event)) store?.resetValue(); |
| 18238 |
store?.setSelectedValue((prevValue) => { |
| 18239 |
if (!Array.isArray(prevValue)) return value; |
| 18240 |
if (prevValue.includes(value)) return prevValue.filter((v2) => v2 !== value); |
| 18241 |
return [...prevValue, value]; |
| 18242 |
}); |
| 18243 |
} |
| 18244 |
if (setValueOnClickProp(event)) store?.setValue(value); |
| 18245 |
} |
| 18246 |
if (hideOnClickProp(event)) store?.hide(); |
| 18247 |
}); |
| 18248 |
const onKeyDownProp = props.onKeyDown; |
| 18249 |
const onKeyDown = useEvent((event) => { |
| 18250 |
onKeyDownProp?.(event); |
| 18251 |
if (event.defaultPrevented) return; |
| 18252 |
const baseElement = store?.getState().baseElement; |
| 18253 |
if (!baseElement) return; |
| 18254 |
if (hasFocus(baseElement)) return; |
| 18255 |
if (event.key.length === 1 || event.key === "Backspace" || event.key === "Delete") { |
| 18256 |
queueMicrotask(() => baseElement.focus()); |
| 18257 |
if (isTextField(baseElement)) store?.setValue(baseElement.value); |
| 18258 |
} |
| 18259 |
}); |
| 18260 |
if (multiSelectable && selected != null) props = { |
| 18261 |
"aria-selected": selected, |
| 18262 |
...props |
| 18263 |
}; |
| 18264 |
props = useWrapElement(props, (element) => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ComboboxItemValueContext.Provider, { |
| 18265 |
value, |
| 18266 |
children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ComboboxItemCheckedContext.Provider, { |
| 18267 |
value: selected ?? false, |
| 18268 |
children: element |
| 18269 |
}) |
| 18270 |
}), [value, selected]); |
| 18271 |
props = { |
| 18272 |
role: getItemRole((0, import_react19.useContext)(ComboboxListRoleContext)), |
| 18273 |
children: value, |
| 18274 |
...props, |
| 18275 |
onClick, |
| 18276 |
onKeyDown |
| 18277 |
}; |
| 18278 |
const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); |
| 18279 |
props = useCompositeItem({ |
| 18280 |
store, |
| 18281 |
...props, |
| 18282 |
getItem, |
| 18283 |
moveOnKeyPress: (event) => { |
| 18284 |
if (!moveOnKeyPressProp(event)) return false; |
| 18285 |
const moveEvent = new Event("combobox-item-move"); |
| 18286 |
store?.getState().baseElement?.dispatchEvent(moveEvent); |
| 18287 |
return true; |
| 18288 |
} |
| 18289 |
}); |
| 18290 |
props = useCompositeHover({ |
| 18291 |
store, |
| 18292 |
focusOnHover, |
| 18293 |
...props |
| 18294 |
}); |
| 18295 |
return props; |
| 18296 |
}); |
| 18297 |
var ComboboxItem = memo3(forwardRef20(function ComboboxItem2(props) { |
| 18298 |
return createElement3(TagName10, useComboboxItem(props)); |
| 18299 |
})); |
| 18300 |
|
| 18301 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-item-value.js |
| 18302 |
var import_react20 = __toESM(require_react(), 1); |
| 18303 |
var import_jsx_runtime76 = __toESM(require_jsx_runtime(), 1); |
| 18304 |
var TagName11 = "span"; |
| 18305 |
function normalizeValue(value) { |
| 18306 |
return normalizeString(value).toLowerCase(); |
| 18307 |
} |
| 18308 |
function getOffsets(string, values) { |
| 18309 |
const offsets = []; |
| 18310 |
for (const value of values) { |
| 18311 |
let pos = 0; |
| 18312 |
const length = value.length; |
| 18313 |
while (string.indexOf(value, pos) !== -1) { |
| 18314 |
const index2 = string.indexOf(value, pos); |
| 18315 |
if (index2 !== -1) offsets.push([index2, length]); |
| 18316 |
pos = index2 + 1; |
| 18317 |
} |
| 18318 |
} |
| 18319 |
return offsets; |
| 18320 |
} |
| 18321 |
function filterOverlappingOffsets(offsets) { |
| 18322 |
return offsets.filter(([offset4, length], i2, arr) => { |
| 18323 |
return !arr.some(([o2, l2], j2) => j2 !== i2 && o2 <= offset4 && o2 + l2 >= offset4 + length); |
| 18324 |
}); |
| 18325 |
} |
| 18326 |
function sortOffsets(offsets) { |
| 18327 |
return offsets.sort(([a2], [b2]) => a2 - b2); |
| 18328 |
} |
| 18329 |
function splitValue(itemValue, userValue) { |
| 18330 |
if (!itemValue) return itemValue; |
| 18331 |
if (!userValue) return itemValue; |
| 18332 |
const userValues = toArray(userValue).filter(Boolean).map(normalizeValue); |
| 18333 |
const parts = []; |
| 18334 |
const span = (value, autocomplete = false) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { |
| 18335 |
"data-autocomplete-value": autocomplete ? "" : void 0, |
| 18336 |
"data-user-value": autocomplete ? void 0 : "", |
| 18337 |
children: value |
| 18338 |
}, parts.length); |
| 18339 |
const offsets = sortOffsets(filterOverlappingOffsets(getOffsets(normalizeValue(itemValue), new Set(userValues)))); |
| 18340 |
const firstEntry = offsets[0]; |
| 18341 |
if (!firstEntry) { |
| 18342 |
parts.push(span(itemValue, true)); |
| 18343 |
return parts; |
| 18344 |
} |
| 18345 |
const [firstOffset] = firstEntry; |
| 18346 |
[itemValue.slice(0, firstOffset), ...offsets.flatMap(([offset4, length], i2) => { |
| 18347 |
const value = itemValue.slice(offset4, offset4 + length); |
| 18348 |
const nextOffset = offsets[i2 + 1]?.[0]; |
| 18349 |
return [value, itemValue.slice(offset4 + length, nextOffset)]; |
| 18350 |
})].forEach((value, i2) => { |
| 18351 |
if (!value) return; |
| 18352 |
parts.push(span(value, i2 % 2 === 0)); |
| 18353 |
}); |
| 18354 |
return parts; |
| 18355 |
} |
| 18356 |
var useComboboxItemValue = createHook(function useComboboxItemValue2({ store, value, userValue, ...props }) { |
| 18357 |
const context = useComboboxScopedContext(); |
| 18358 |
store = store || context; |
| 18359 |
const itemContext = (0, import_react20.useContext)(ComboboxItemValueContext); |
| 18360 |
const itemValue = value ?? itemContext; |
| 18361 |
const inputValue = useStoreState(store, (state) => userValue ?? state?.value); |
| 18362 |
props = { |
| 18363 |
children: (0, import_react20.useMemo)(() => { |
| 18364 |
if (!itemValue) return; |
| 18365 |
if (!inputValue) return itemValue; |
| 18366 |
return splitValue(itemValue, inputValue); |
| 18367 |
}, [itemValue, inputValue]), |
| 18368 |
...props |
| 18369 |
}; |
| 18370 |
return removeUndefinedValues(props); |
| 18371 |
}); |
| 18372 |
var ComboboxItemValue = forwardRef20(function ComboboxItemValue2(props) { |
| 18373 |
return createElement3(TagName11, useComboboxItemValue(props)); |
| 18374 |
}); |
| 18375 |
|
| 18376 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-label.js |
| 18377 |
var TagName12 = "label"; |
| 18378 |
var useComboboxLabel = createHook(function useComboboxLabel2({ store, ...props }) { |
| 18379 |
const context = useComboboxProviderContext(); |
| 18380 |
store = store || context; |
| 18381 |
invariant(store, "ComboboxLabel must receive a `store` prop or be wrapped in a ComboboxProvider component."); |
| 18382 |
props = { |
| 18383 |
htmlFor: useStoreState(store, (state) => state.baseElement?.id), |
| 18384 |
...props |
| 18385 |
}; |
| 18386 |
return removeUndefinedValues(props); |
| 18387 |
}); |
| 18388 |
var ComboboxLabel = memo3(forwardRef20(function ComboboxLabel2(props) { |
| 18389 |
return createElement3(TagName12, useComboboxLabel(props)); |
| 18390 |
})); |
| 18391 |
|
| 18392 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-list.js |
| 18393 |
var import_react21 = __toESM(require_react(), 1); |
| 18394 |
var import_jsx_runtime77 = __toESM(require_jsx_runtime(), 1); |
| 18395 |
var TagName13 = "div"; |
| 18396 |
var useComboboxList = createHook(function useComboboxList2({ store, alwaysVisible, ...props }) { |
| 18397 |
const scopedContext = useComboboxScopedContext(true); |
| 18398 |
const context = useComboboxContext(); |
| 18399 |
store = store || context; |
| 18400 |
const scopedContextSameStore = !!store && store === scopedContext; |
| 18401 |
invariant(store, "ComboboxList must receive a `store` prop or be wrapped in a ComboboxProvider component."); |
| 18402 |
const ref = (0, import_react21.useRef)(null); |
| 18403 |
const id = useId4(props.id); |
| 18404 |
const mounted = useStoreState(store, "mounted"); |
| 18405 |
const hidden = isHidden(mounted, props.hidden, alwaysVisible); |
| 18406 |
const style = hidden ? { |
| 18407 |
...props.style, |
| 18408 |
display: "none" |
| 18409 |
} : props.style; |
| 18410 |
const multiSelectable = useStoreState(store, (state) => Array.isArray(state.selectedValue)); |
| 18411 |
const role = useAttribute(ref, "role", props.role); |
| 18412 |
const ariaMultiSelectable = role === "listbox" || role === "tree" || role === "grid" ? multiSelectable || void 0 : void 0; |
| 18413 |
const [hasListboxInside, setHasListboxInside] = (0, import_react21.useState)(false); |
| 18414 |
const contentElement = useStoreState(store, "contentElement"); |
| 18415 |
useSafeLayoutEffect(() => { |
| 18416 |
if (!mounted) return; |
| 18417 |
const element = ref.current; |
| 18418 |
if (!element) return; |
| 18419 |
if (contentElement !== element) return; |
| 18420 |
const callback = () => { |
| 18421 |
setHasListboxInside(!!element.querySelector("[role='listbox']")); |
| 18422 |
}; |
| 18423 |
const observer = new MutationObserver(callback); |
| 18424 |
observer.observe(element, { |
| 18425 |
subtree: true, |
| 18426 |
childList: true, |
| 18427 |
attributeFilter: ["role"] |
| 18428 |
}); |
| 18429 |
callback(); |
| 18430 |
return () => observer.disconnect(); |
| 18431 |
}, [mounted, contentElement]); |
| 18432 |
if (!hasListboxInside) props = { |
| 18433 |
role: "listbox", |
| 18434 |
"aria-multiselectable": ariaMultiSelectable, |
| 18435 |
...props |
| 18436 |
}; |
| 18437 |
props = useWrapElement(props, (element) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(ComboboxScopedContextProvider, { |
| 18438 |
value: store, |
| 18439 |
children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(ComboboxListRoleContext.Provider, { |
| 18440 |
value: role, |
| 18441 |
children: element |
| 18442 |
}) |
| 18443 |
}), [store, role]); |
| 18444 |
const setContentElement = id && (!scopedContext || !scopedContextSameStore) ? store.setContentElement : null; |
| 18445 |
props = { |
| 18446 |
hidden, |
| 18447 |
...props, |
| 18448 |
id, |
| 18449 |
ref: useMergeRefs(setContentElement, ref, props.ref), |
| 18450 |
style |
| 18451 |
}; |
| 18452 |
return removeUndefinedValues(props); |
| 18453 |
}); |
| 18454 |
var ComboboxList = forwardRef20(function ComboboxList2(props) { |
| 18455 |
return createElement3(TagName13, useComboboxList(props)); |
| 18456 |
}); |
| 18457 |
|
| 18458 |
// node_modules/@ariakit/react-components/dist/tag/tag-context.js |
| 18459 |
var import_react22 = __toESM(require_react(), 1); |
| 18460 |
var TagValueContext = (0, import_react22.createContext)(null); |
| 18461 |
var TagRemoveIdContext = (0, import_react22.createContext)(null); |
| 18462 |
var ctx7 = createStoreContext([CompositeContextProvider], [CompositeScopedContextProvider]); |
| 18463 |
var useTagContext = ctx7.useContext; |
| 18464 |
var useTagScopedContext = ctx7.useScopedContext; |
| 18465 |
var useTagProviderContext = ctx7.useProviderContext; |
| 18466 |
var TagContextProvider = ctx7.ContextProvider; |
| 18467 |
var TagScopedContextProvider = ctx7.ScopedContextProvider; |
| 18468 |
|
| 18469 |
// node_modules/@ariakit/components/dist/combobox/combobox-store.js |
| 18470 |
var isTouchSafari = isSafari2() && isTouchDevice(); |
| 18471 |
function createComboboxStore({ tag, ...props } = {}) { |
| 18472 |
const store = mergeStore(props.store, pick2(tag, ["value", "rtl"])); |
| 18473 |
throwOnConflictingProps(props, store); |
| 18474 |
const tagState = tag?.getState(); |
| 18475 |
const syncState = store?.getState(); |
| 18476 |
const activeId = defaultValue(props.activeId, syncState?.activeId, props.defaultActiveId, null); |
| 18477 |
const composite = createCompositeStore({ |
| 18478 |
...props, |
| 18479 |
activeId, |
| 18480 |
includesBaseElement: defaultValue(props.includesBaseElement, syncState?.includesBaseElement, true), |
| 18481 |
orientation: defaultValue(props.orientation, syncState?.orientation, "vertical"), |
| 18482 |
focusLoop: defaultValue(props.focusLoop, syncState?.focusLoop, true), |
| 18483 |
focusWrap: defaultValue(props.focusWrap, syncState?.focusWrap, true), |
| 18484 |
virtualFocus: defaultValue(props.virtualFocus, syncState?.virtualFocus, true) |
| 18485 |
}); |
| 18486 |
const popover = createPopoverStore({ |
| 18487 |
...props, |
| 18488 |
placement: defaultValue(props.placement, syncState?.placement, "bottom-start") |
| 18489 |
}); |
| 18490 |
const value = defaultValue(props.value, syncState?.value, props.defaultValue, ""); |
| 18491 |
const selectedValue = defaultValue(props.selectedValue, syncState?.selectedValue, tagState?.values, props.defaultSelectedValue, ""); |
| 18492 |
const multiSelectable = Array.isArray(selectedValue); |
| 18493 |
const initialState = { |
| 18494 |
...composite.getState(), |
| 18495 |
...popover.getState(), |
| 18496 |
value, |
| 18497 |
selectedValue, |
| 18498 |
resetValueOnSelect: defaultValue(props.resetValueOnSelect, syncState?.resetValueOnSelect, multiSelectable), |
| 18499 |
resetValueOnHide: defaultValue(props.resetValueOnHide, syncState?.resetValueOnHide, multiSelectable && !tag), |
| 18500 |
activeValue: syncState?.activeValue |
| 18501 |
}; |
| 18502 |
const combobox = createStore(initialState, composite, popover, store); |
| 18503 |
if (isTouchSafari) setup(combobox, () => sync(combobox, ["virtualFocus"], () => { |
| 18504 |
combobox.setState("virtualFocus", false); |
| 18505 |
})); |
| 18506 |
setup(combobox, () => { |
| 18507 |
if (!tag) return; |
| 18508 |
return chain(sync(combobox, ["selectedValue"], (state) => { |
| 18509 |
if (!Array.isArray(state.selectedValue)) return; |
| 18510 |
tag.setValues(state.selectedValue); |
| 18511 |
}), sync(tag, ["values"], (state) => { |
| 18512 |
combobox.setState("selectedValue", state.values); |
| 18513 |
})); |
| 18514 |
}); |
| 18515 |
setup(combobox, () => sync(combobox, ["resetValueOnHide", "mounted"], (state) => { |
| 18516 |
if (!state.resetValueOnHide) return; |
| 18517 |
if (state.mounted) return; |
| 18518 |
combobox.setState("value", value); |
| 18519 |
})); |
| 18520 |
setup(combobox, () => sync(combobox, ["open"], (state) => { |
| 18521 |
if (state.open) return; |
| 18522 |
combobox.setState("activeId", activeId); |
| 18523 |
combobox.setState("moves", 0); |
| 18524 |
})); |
| 18525 |
setup(combobox, () => sync(combobox, ["moves", "activeId"], (state, prevState) => { |
| 18526 |
if (state.moves === prevState.moves) combobox.setState("activeValue", void 0); |
| 18527 |
})); |
| 18528 |
setup(combobox, () => batch(combobox, ["moves", "renderedItems"], (state, prev) => { |
| 18529 |
if (state.moves === prev.moves) return; |
| 18530 |
const { activeId: activeId2 } = combobox.getState(); |
| 18531 |
const activeItem = composite.item(activeId2); |
| 18532 |
combobox.setState("activeValue", activeItem?.value); |
| 18533 |
})); |
| 18534 |
return { |
| 18535 |
...popover, |
| 18536 |
...composite, |
| 18537 |
...combobox, |
| 18538 |
tag, |
| 18539 |
setValue: (value2) => combobox.setState("value", value2), |
| 18540 |
resetValue: () => combobox.setState("value", initialState.value), |
| 18541 |
setSelectedValue: (selectedValue2) => combobox.setState("selectedValue", selectedValue2) |
| 18542 |
}; |
| 18543 |
} |
| 18544 |
|
| 18545 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-store.js |
| 18546 |
function useComboboxStoreOptions(props) { |
| 18547 |
const tag = useTagContext(); |
| 18548 |
props = { |
| 18549 |
...props, |
| 18550 |
tag: props.tag !== void 0 ? props.tag : tag |
| 18551 |
}; |
| 18552 |
return useCompositeStoreOptions(props); |
| 18553 |
} |
| 18554 |
function useComboboxStoreProps(store, update2, props) { |
| 18555 |
useUpdateEffect(update2, [props.tag]); |
| 18556 |
useStoreProps(store, props, "value", "setValue"); |
| 18557 |
useStoreProps(store, props, "selectedValue", "setSelectedValue"); |
| 18558 |
useStoreProps(store, props, "resetValueOnHide"); |
| 18559 |
useStoreProps(store, props, "resetValueOnSelect"); |
| 18560 |
return Object.assign(useCompositeStoreProps(usePopoverStoreProps(store, update2, props), update2, props), { tag: props.tag }); |
| 18561 |
} |
| 18562 |
function useComboboxStore(props = {}) { |
| 18563 |
props = useComboboxStoreOptions(props); |
| 18564 |
const [store, update2] = useStore2(createComboboxStore, props); |
| 18565 |
return useComboboxStoreProps(store, update2, props); |
| 18566 |
} |
| 18567 |
|
| 18568 |
// node_modules/@ariakit/react-components/dist/combobox/combobox-provider.js |
| 18569 |
var import_jsx_runtime78 = __toESM(require_jsx_runtime(), 1); |
| 18570 |
function ComboboxProvider(props = {}) { |
| 18571 |
return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(ComboboxContextProvider, { |
| 18572 |
value: useComboboxStore(props), |
| 18573 |
children: props.children |
| 18574 |
}); |
| 18575 |
} |
| 18576 |
|
| 18577 |
// packages/dataviews/build-module/components/dataviews-filters/search-widget.mjs |
| 18578 |
var import_remove_accents = __toESM(require_remove_accents(), 1); |
| 18579 |
var import_compose8 = __toESM(require_compose(), 1); |
| 18580 |
var import_i18n29 = __toESM(require_i18n(), 1); |
| 18581 |
var import_element42 = __toESM(require_element(), 1); |
| 18582 |
var import_components19 = __toESM(require_components(), 1); |
| 18583 |
|
| 18584 |
// packages/dataviews/build-module/components/dataviews-filters/utils.mjs |
| 18585 |
var EMPTY_ARRAY3 = []; |
| 18586 |
var getCurrentValue = (filterDefinition, currentFilter) => { |
| 18587 |
if (filterDefinition.singleSelection) { |
| 18588 |
return currentFilter?.value; |
| 18589 |
} |
| 18590 |
if (Array.isArray(currentFilter?.value)) { |
| 18591 |
return currentFilter.value; |
| 18592 |
} |
| 18593 |
if (!Array.isArray(currentFilter?.value) && !!currentFilter?.value) { |
| 18594 |
return [currentFilter.value]; |
| 18595 |
} |
| 18596 |
return EMPTY_ARRAY3; |
| 18597 |
}; |
| 18598 |
|
| 18599 |
// packages/dataviews/build-module/hooks/use-elements.mjs |
| 18600 |
var import_element41 = __toESM(require_element(), 1); |
| 18601 |
var EMPTY_ARRAY4 = []; |
| 18602 |
function useElements({ |
| 18603 |
elements, |
| 18604 |
getElements |
| 18605 |
}) { |
| 18606 |
const staticElements = Array.isArray(elements) && elements.length > 0 ? elements : EMPTY_ARRAY4; |
| 18607 |
const [records, setRecords] = (0, import_element41.useState)(staticElements); |
| 18608 |
const [isLoading, setIsLoading] = (0, import_element41.useState)(false); |
| 18609 |
(0, import_element41.useEffect)(() => { |
| 18610 |
if (!getElements) { |
| 18611 |
setRecords(staticElements); |
| 18612 |
return; |
| 18613 |
} |
| 18614 |
let cancelled = false; |
| 18615 |
setIsLoading(true); |
| 18616 |
getElements().then((fetchedElements) => { |
| 18617 |
if (!cancelled) { |
| 18618 |
const dynamicElements = Array.isArray(fetchedElements) && fetchedElements.length > 0 ? fetchedElements : staticElements; |
| 18619 |
setRecords(dynamicElements); |
| 18620 |
} |
| 18621 |
}).catch(() => { |
| 18622 |
if (!cancelled) { |
| 18623 |
setRecords(staticElements); |
| 18624 |
} |
| 18625 |
}).finally(() => { |
| 18626 |
if (!cancelled) { |
| 18627 |
setIsLoading(false); |
| 18628 |
} |
| 18629 |
}); |
| 18630 |
return () => { |
| 18631 |
cancelled = true; |
| 18632 |
}; |
| 18633 |
}, [getElements, staticElements]); |
| 18634 |
return { |
| 18635 |
elements: records, |
| 18636 |
isLoading |
| 18637 |
}; |
| 18638 |
} |
| 18639 |
|
| 18640 |
// packages/dataviews/build-module/components/dataviews-filters/search-widget.mjs |
| 18641 |
var import_jsx_runtime79 = __toESM(require_jsx_runtime(), 1); |
| 18642 |
function normalizeSearchInput(input = "") { |
| 18643 |
return (0, import_remove_accents.default)(input.trim().toLowerCase()); |
| 18644 |
} |
| 18645 |
var getNewValue = (filterDefinition, currentFilter, value) => { |
| 18646 |
if (filterDefinition.singleSelection) { |
| 18647 |
return value; |
| 18648 |
} |
| 18649 |
if (Array.isArray(currentFilter?.value)) { |
| 18650 |
return currentFilter.value.includes(value) ? currentFilter.value.filter((v2) => v2 !== value) : [...currentFilter.value, value]; |
| 18651 |
} |
| 18652 |
return [value]; |
| 18653 |
}; |
| 18654 |
function generateFilterElementCompositeItemId(prefix, filterElementValue) { |
| 18655 |
return `${prefix}-${filterElementValue}`; |
| 18656 |
} |
| 18657 |
var MultiSelectionOption = ({ selected }) => { |
| 18658 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18659 |
"span", |
| 18660 |
{ |
| 18661 |
className: clsx_default( |
| 18662 |
"dataviews-filters__search-widget-listitem-multi-selection", |
| 18663 |
{ "is-selected": selected } |
| 18664 |
), |
| 18665 |
children: selected && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_components19.Icon, { icon: check_default }) |
| 18666 |
} |
| 18667 |
); |
| 18668 |
}; |
| 18669 |
var SingleSelectionOption = ({ selected }) => { |
| 18670 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18671 |
"span", |
| 18672 |
{ |
| 18673 |
className: clsx_default( |
| 18674 |
"dataviews-filters__search-widget-listitem-single-selection", |
| 18675 |
{ "is-selected": selected } |
| 18676 |
) |
| 18677 |
} |
| 18678 |
); |
| 18679 |
}; |
| 18680 |
function ListBox({ view, filter, onChangeView }) { |
| 18681 |
const baseId = (0, import_compose8.useInstanceId)(ListBox, "dataviews-filter-list-box"); |
| 18682 |
const [activeCompositeId, setActiveCompositeId] = (0, import_element42.useState)( |
| 18683 |
// When there are one or less operators, the first item is set as active |
| 18684 |
// (by setting the initial `activeId` to `undefined`). |
| 18685 |
// With 2 or more operators, the focus is moved on the operators control |
| 18686 |
// (by setting the initial `activeId` to `null`), meaning that there won't |
| 18687 |
// be an active item initially. Focus is then managed via the |
| 18688 |
// `onFocusVisible` callback. |
| 18689 |
filter.operators?.length === 1 ? void 0 : null |
| 18690 |
); |
| 18691 |
const currentFilter = view.filters?.find( |
| 18692 |
(f2) => f2.field === filter.field |
| 18693 |
); |
| 18694 |
const currentValue = getCurrentValue(filter, currentFilter); |
| 18695 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18696 |
import_components19.Composite, |
| 18697 |
{ |
| 18698 |
virtualFocus: true, |
| 18699 |
focusLoop: true, |
| 18700 |
activeId: activeCompositeId, |
| 18701 |
setActiveId: setActiveCompositeId, |
| 18702 |
role: "listbox", |
| 18703 |
className: "dataviews-filters__search-widget-listbox", |
| 18704 |
"aria-label": (0, import_i18n29.sprintf)( |
| 18705 |
/* translators: List of items for a filter. 1: Filter name. e.g.: "List of: Author". */ |
| 18706 |
(0, import_i18n29.__)("List of: %1$s"), |
| 18707 |
filter.name |
| 18708 |
), |
| 18709 |
onFocusVisible: () => { |
| 18710 |
if (!activeCompositeId && filter.elements.length) { |
| 18711 |
setActiveCompositeId( |
| 18712 |
generateFilterElementCompositeItemId( |
| 18713 |
baseId, |
| 18714 |
filter.elements[0].value |
| 18715 |
) |
| 18716 |
); |
| 18717 |
} |
| 18718 |
}, |
| 18719 |
render: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_components19.Composite.Typeahead, {}), |
| 18720 |
children: filter.elements.map((element) => /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)( |
| 18721 |
import_components19.Composite.Hover, |
| 18722 |
{ |
| 18723 |
render: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18724 |
import_components19.Composite.Item, |
| 18725 |
{ |
| 18726 |
id: generateFilterElementCompositeItemId( |
| 18727 |
baseId, |
| 18728 |
element.value |
| 18729 |
), |
| 18730 |
render: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18731 |
"div", |
| 18732 |
{ |
| 18733 |
"aria-label": element.label, |
| 18734 |
role: "option", |
| 18735 |
className: "dataviews-filters__search-widget-listitem" |
| 18736 |
} |
| 18737 |
), |
| 18738 |
onClick: () => { |
| 18739 |
const newFilters = currentFilter ? [ |
| 18740 |
...(view.filters ?? []).map( |
| 18741 |
(_filter) => { |
| 18742 |
if (_filter.field === filter.field) { |
| 18743 |
return { |
| 18744 |
..._filter, |
| 18745 |
operator: currentFilter.operator || filter.operators[0], |
| 18746 |
value: getNewValue( |
| 18747 |
filter, |
| 18748 |
currentFilter, |
| 18749 |
element.value |
| 18750 |
) |
| 18751 |
}; |
| 18752 |
} |
| 18753 |
return _filter; |
| 18754 |
} |
| 18755 |
) |
| 18756 |
] : [ |
| 18757 |
...view.filters ?? [], |
| 18758 |
{ |
| 18759 |
field: filter.field, |
| 18760 |
operator: filter.operators[0], |
| 18761 |
value: getNewValue( |
| 18762 |
filter, |
| 18763 |
currentFilter, |
| 18764 |
element.value |
| 18765 |
) |
| 18766 |
} |
| 18767 |
]; |
| 18768 |
onChangeView({ |
| 18769 |
...view, |
| 18770 |
page: 1, |
| 18771 |
filters: newFilters |
| 18772 |
}); |
| 18773 |
} |
| 18774 |
} |
| 18775 |
), |
| 18776 |
children: [ |
| 18777 |
filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18778 |
SingleSelectionOption, |
| 18779 |
{ |
| 18780 |
selected: currentValue === element.value |
| 18781 |
} |
| 18782 |
), |
| 18783 |
!filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18784 |
MultiSelectionOption, |
| 18785 |
{ |
| 18786 |
selected: currentValue.includes(element.value) |
| 18787 |
} |
| 18788 |
), |
| 18789 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18790 |
"span", |
| 18791 |
{ |
| 18792 |
className: "dataviews-filters__search-widget-listitem-value", |
| 18793 |
title: element.label, |
| 18794 |
children: element.label |
| 18795 |
} |
| 18796 |
) |
| 18797 |
] |
| 18798 |
}, |
| 18799 |
element.value |
| 18800 |
)) |
| 18801 |
} |
| 18802 |
); |
| 18803 |
} |
| 18804 |
function ComboboxList22({ view, filter, onChangeView }) { |
| 18805 |
const [searchValue, setSearchValue] = (0, import_element42.useState)(""); |
| 18806 |
const deferredSearchValue = (0, import_element42.useDeferredValue)(searchValue); |
| 18807 |
const currentFilter = view.filters?.find( |
| 18808 |
(_filter) => _filter.field === filter.field |
| 18809 |
); |
| 18810 |
const currentValue = getCurrentValue(filter, currentFilter); |
| 18811 |
const matches = (0, import_element42.useMemo)(() => { |
| 18812 |
const normalizedSearch = normalizeSearchInput(deferredSearchValue); |
| 18813 |
return filter.elements.filter( |
| 18814 |
(item) => normalizeSearchInput(item.label).includes(normalizedSearch) |
| 18815 |
); |
| 18816 |
}, [filter.elements, deferredSearchValue]); |
| 18817 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)( |
| 18818 |
ComboboxProvider, |
| 18819 |
{ |
| 18820 |
selectedValue: currentValue, |
| 18821 |
setSelectedValue: (value) => { |
| 18822 |
const newFilters = currentFilter ? [ |
| 18823 |
...(view.filters ?? []).map((_filter) => { |
| 18824 |
if (_filter.field === filter.field) { |
| 18825 |
return { |
| 18826 |
..._filter, |
| 18827 |
operator: currentFilter.operator || filter.operators[0], |
| 18828 |
value |
| 18829 |
}; |
| 18830 |
} |
| 18831 |
return _filter; |
| 18832 |
}) |
| 18833 |
] : [ |
| 18834 |
...view.filters ?? [], |
| 18835 |
{ |
| 18836 |
field: filter.field, |
| 18837 |
operator: filter.operators[0], |
| 18838 |
value |
| 18839 |
} |
| 18840 |
]; |
| 18841 |
onChangeView({ |
| 18842 |
...view, |
| 18843 |
page: 1, |
| 18844 |
filters: newFilters |
| 18845 |
}); |
| 18846 |
}, |
| 18847 |
setValue: setSearchValue, |
| 18848 |
children: [ |
| 18849 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "dataviews-filters__search-widget-filter-combobox__wrapper", children: [ |
| 18850 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(VisuallyHidden, { render: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(ComboboxLabel, {}), children: (0, import_i18n29.__)("Search items") }), |
| 18851 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18852 |
Combobox, |
| 18853 |
{ |
| 18854 |
autoSelect: "always", |
| 18855 |
placeholder: (0, import_i18n29.__)("Search"), |
| 18856 |
className: "dataviews-filters__search-widget-filter-combobox__input" |
| 18857 |
} |
| 18858 |
), |
| 18859 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "dataviews-filters__search-widget-filter-combobox__icon", children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_components19.Icon, { icon: search_default }) }) |
| 18860 |
] }), |
| 18861 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)( |
| 18862 |
ComboboxList, |
| 18863 |
{ |
| 18864 |
className: "dataviews-filters__search-widget-filter-combobox-list", |
| 18865 |
alwaysVisible: true, |
| 18866 |
children: [ |
| 18867 |
matches.map((element) => { |
| 18868 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)( |
| 18869 |
ComboboxItem, |
| 18870 |
{ |
| 18871 |
resetValueOnSelect: false, |
| 18872 |
value: element.value, |
| 18873 |
className: "dataviews-filters__search-widget-listitem", |
| 18874 |
hideOnClick: false, |
| 18875 |
setValueOnClick: false, |
| 18876 |
focusOnHover: true, |
| 18877 |
children: [ |
| 18878 |
filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18879 |
SingleSelectionOption, |
| 18880 |
{ |
| 18881 |
selected: currentValue === element.value |
| 18882 |
} |
| 18883 |
), |
| 18884 |
!filter.singleSelection && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18885 |
MultiSelectionOption, |
| 18886 |
{ |
| 18887 |
selected: currentValue.includes( |
| 18888 |
element.value |
| 18889 |
) |
| 18890 |
} |
| 18891 |
), |
| 18892 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)( |
| 18893 |
"span", |
| 18894 |
{ |
| 18895 |
className: "dataviews-filters__search-widget-listitem-value", |
| 18896 |
title: element.label, |
| 18897 |
children: [ |
| 18898 |
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)( |
| 18899 |
ComboboxItemValue, |
| 18900 |
{ |
| 18901 |
className: "dataviews-filters__search-widget-filter-combobox-item-value", |
| 18902 |
value: element.label |
| 18903 |
} |
| 18904 |
), |
| 18905 |
!!element.description && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "dataviews-filters__search-widget-listitem-description", children: element.description }) |
| 18906 |
] |
| 18907 |
} |
| 18908 |
) |
| 18909 |
] |
| 18910 |
}, |
| 18911 |
element.value |
| 18912 |
); |
| 18913 |
}), |
| 18914 |
!matches.length && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { children: (0, import_i18n29.__)("No results found") }) |
| 18915 |
] |
| 18916 |
} |
| 18917 |
) |
| 18918 |
] |
| 18919 |
} |
| 18920 |
); |
| 18921 |
} |
| 18922 |
function SearchWidget(props) { |
| 18923 |
const { elements, isLoading } = useElements({ |
| 18924 |
elements: props.filter.elements, |
| 18925 |
getElements: props.filter.getElements |
| 18926 |
}); |
| 18927 |
if (isLoading) { |
| 18928 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "dataviews-filters__search-widget-no-elements", children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_components19.Spinner, {}) }); |
| 18929 |
} |
| 18930 |
if (elements.length === 0) { |
| 18931 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "dataviews-filters__search-widget-no-elements", children: (0, import_i18n29.__)("No elements found") }); |
| 18932 |
} |
| 18933 |
const Widget = elements.length > 10 ? ComboboxList22 : ListBox; |
| 18934 |
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Widget, { ...props, filter: { ...props.filter, elements } }); |
| 18935 |
} |
| 18936 |
|
| 18937 |
// packages/dataviews/build-module/components/dataviews-filters/input-widget.mjs |
| 18938 |
var import_es6 = __toESM(require_es6(), 1); |
| 18939 |
var import_compose9 = __toESM(require_compose(), 1); |
| 18940 |
var import_element43 = __toESM(require_element(), 1); |
| 18941 |
var import_components20 = __toESM(require_components(), 1); |
| 18942 |
var import_jsx_runtime80 = __toESM(require_jsx_runtime(), 1); |
| 18943 |
function InputWidget({ |
| 18944 |
filter, |
| 18945 |
view, |
| 18946 |
onChangeView, |
| 18947 |
fields |
| 18948 |
}) { |
| 18949 |
const currentFilter = view.filters?.find( |
| 18950 |
(f2) => f2.field === filter.field |
| 18951 |
); |
| 18952 |
const currentValue = getCurrentValue(filter, currentFilter); |
| 18953 |
const field = (0, import_element43.useMemo)(() => { |
| 18954 |
const currentField = fields.find((f2) => f2.id === filter.field); |
| 18955 |
if (currentField) { |
| 18956 |
return { |
| 18957 |
...currentField, |
| 18958 |
// Deactivate validation for filters. |
| 18959 |
isValid: {}, |
| 18960 |
// Filter controls are always enabled. |
| 18961 |
isDisabled: () => false, |
| 18962 |
// Filter controls are always visible. |
| 18963 |
isVisible: () => true, |
| 18964 |
// Configure getValue/setValue as if Item was a plain object. |
| 18965 |
getValue: ({ item }) => item[currentField.id], |
| 18966 |
setValue: ({ value }) => ({ |
| 18967 |
[currentField.id]: value |
| 18968 |
}) |
| 18969 |
}; |
| 18970 |
} |
| 18971 |
return currentField; |
| 18972 |
}, [fields, filter.field]); |
| 18973 |
const data = (0, import_element43.useMemo)(() => { |
| 18974 |
return (view.filters ?? []).reduce( |
| 18975 |
(acc, activeFilter) => { |
| 18976 |
acc[activeFilter.field] = activeFilter.value; |
| 18977 |
return acc; |
| 18978 |
}, |
| 18979 |
{} |
| 18980 |
); |
| 18981 |
}, [view.filters]); |
| 18982 |
const handleChange = (0, import_compose9.useEvent)((updatedData) => { |
| 18983 |
if (!field || !currentFilter) { |
| 18984 |
return; |
| 18985 |
} |
| 18986 |
const nextValue = field.getValue({ item: updatedData }); |
| 18987 |
if ((0, import_es6.default)(nextValue, currentValue)) { |
| 18988 |
return; |
| 18989 |
} |
| 18990 |
onChangeView({ |
| 18991 |
...view, |
| 18992 |
filters: (view.filters ?? []).map( |
| 18993 |
(_filter) => _filter.field === filter.field ? { |
| 18994 |
..._filter, |
| 18995 |
operator: currentFilter.operator || filter.operators[0], |
| 18996 |
// Consider empty strings as undefined: |
| 18997 |
// |
| 18998 |
// - undefined as value means the filter is unset: the filter widget displays no value and the search returns all records |
| 18999 |
// - empty string as value means "search empty string": returns only the records that have an empty string as value |
| 19000 |
// |
| 19001 |
// In practice, this means the filter will not be able to find an empty string as the value. |
| 19002 |
value: nextValue === "" ? void 0 : nextValue |
| 19003 |
} : _filter |
| 19004 |
) |
| 19005 |
}); |
| 19006 |
}); |
| 19007 |
if (!field || !field.Edit || !currentFilter) { |
| 19008 |
return null; |
| 19009 |
} |
| 19010 |
return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)( |
| 19011 |
import_components20.Flex, |
| 19012 |
{ |
| 19013 |
className: "dataviews-filters__user-input-widget", |
| 19014 |
gap: 2.5, |
| 19015 |
direction: "column", |
| 19016 |
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)( |
| 19017 |
field.Edit, |
| 19018 |
{ |
| 19019 |
hideLabelFromVision: true, |
| 19020 |
data, |
| 19021 |
field, |
| 19022 |
operator: currentFilter.operator, |
| 19023 |
onChange: handleChange |
| 19024 |
} |
| 19025 |
) |
| 19026 |
} |
| 19027 |
); |
| 19028 |
} |
| 19029 |
|
| 19030 |
// node_modules/date-fns/constants.js |
| 19031 |
var daysInYear = 365.2425; |
| 19032 |
var maxTime = Math.pow(10, 8) * 24 * 60 * 60 * 1e3; |
| 19033 |
var minTime = -maxTime; |
| 19034 |
var millisecondsInWeek = 6048e5; |
| 19035 |
var millisecondsInDay = 864e5; |
| 19036 |
var secondsInHour = 3600; |
| 19037 |
var secondsInDay = secondsInHour * 24; |
| 19038 |
var secondsInWeek = secondsInDay * 7; |
| 19039 |
var secondsInYear = secondsInDay * daysInYear; |
| 19040 |
var secondsInMonth = secondsInYear / 12; |
| 19041 |
var secondsInQuarter = secondsInMonth * 3; |
| 19042 |
var constructFromSymbol = /* @__PURE__ */ Symbol.for("constructDateFrom"); |
| 19043 |
|
| 19044 |
// node_modules/date-fns/constructFrom.js |
| 19045 |
function constructFrom(date, value) { |
| 19046 |
if (typeof date === "function") return date(value); |
| 19047 |
if (date && typeof date === "object" && constructFromSymbol in date) |
| 19048 |
return date[constructFromSymbol](value); |
| 19049 |
if (date instanceof Date) return new date.constructor(value); |
| 19050 |
return new Date(value); |
| 19051 |
} |
| 19052 |
|
| 19053 |
// node_modules/date-fns/toDate.js |
| 19054 |
function toDate(argument, context) { |
| 19055 |
return constructFrom(context || argument, argument); |
| 19056 |
} |
| 19057 |
|
| 19058 |
// node_modules/date-fns/addDays.js |
| 19059 |
function addDays(date, amount, options) { |
| 19060 |
const _date = toDate(date, options?.in); |
| 19061 |
if (isNaN(amount)) return constructFrom(options?.in || date, NaN); |
| 19062 |
if (!amount) return _date; |
| 19063 |
_date.setDate(_date.getDate() + amount); |
| 19064 |
return _date; |
| 19065 |
} |
| 19066 |
|
| 19067 |
// node_modules/date-fns/addMonths.js |
| 19068 |
function addMonths(date, amount, options) { |
| 19069 |
const _date = toDate(date, options?.in); |
| 19070 |
if (isNaN(amount)) return constructFrom(options?.in || date, NaN); |
| 19071 |
if (!amount) { |
| 19072 |
return _date; |
| 19073 |
} |
| 19074 |
const dayOfMonth = _date.getDate(); |
| 19075 |
const endOfDesiredMonth = constructFrom(options?.in || date, _date.getTime()); |
| 19076 |
endOfDesiredMonth.setMonth(_date.getMonth() + amount + 1, 0); |
| 19077 |
const daysInMonth = endOfDesiredMonth.getDate(); |
| 19078 |
if (dayOfMonth >= daysInMonth) { |
| 19079 |
return endOfDesiredMonth; |
| 19080 |
} else { |
| 19081 |
_date.setFullYear( |
| 19082 |
endOfDesiredMonth.getFullYear(), |
| 19083 |
endOfDesiredMonth.getMonth(), |
| 19084 |
dayOfMonth |
| 19085 |
); |
| 19086 |
return _date; |
| 19087 |
} |
| 19088 |
} |
| 19089 |
|
| 19090 |
// node_modules/date-fns/_lib/defaultOptions.js |
| 19091 |
var defaultOptions = {}; |
| 19092 |
function getDefaultOptions() { |
| 19093 |
return defaultOptions; |
| 19094 |
} |
| 19095 |
|
| 19096 |
// node_modules/date-fns/startOfWeek.js |
| 19097 |
function startOfWeek(date, options) { |
| 19098 |
const defaultOptions2 = getDefaultOptions(); |
| 19099 |
const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? defaultOptions2.weekStartsOn ?? defaultOptions2.locale?.options?.weekStartsOn ?? 0; |
| 19100 |
const _date = toDate(date, options?.in); |
| 19101 |
const day = _date.getDay(); |
| 19102 |
const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn; |
| 19103 |
_date.setDate(_date.getDate() - diff); |
| 19104 |
_date.setHours(0, 0, 0, 0); |
| 19105 |
return _date; |
| 19106 |
} |
| 19107 |
|
| 19108 |
// node_modules/date-fns/startOfISOWeek.js |
| 19109 |
function startOfISOWeek(date, options) { |
| 19110 |
return startOfWeek(date, { ...options, weekStartsOn: 1 }); |
| 19111 |
} |
| 19112 |
|
| 19113 |
// node_modules/date-fns/getISOWeekYear.js |
| 19114 |
function getISOWeekYear(date, options) { |
| 19115 |
const _date = toDate(date, options?.in); |
| 19116 |
const year = _date.getFullYear(); |
| 19117 |
const fourthOfJanuaryOfNextYear = constructFrom(_date, 0); |
| 19118 |
fourthOfJanuaryOfNextYear.setFullYear(year + 1, 0, 4); |
| 19119 |
fourthOfJanuaryOfNextYear.setHours(0, 0, 0, 0); |
| 19120 |
const startOfNextYear = startOfISOWeek(fourthOfJanuaryOfNextYear); |
| 19121 |
const fourthOfJanuaryOfThisYear = constructFrom(_date, 0); |
| 19122 |
fourthOfJanuaryOfThisYear.setFullYear(year, 0, 4); |
| 19123 |
fourthOfJanuaryOfThisYear.setHours(0, 0, 0, 0); |
| 19124 |
const startOfThisYear = startOfISOWeek(fourthOfJanuaryOfThisYear); |
| 19125 |
if (_date.getTime() >= startOfNextYear.getTime()) { |
| 19126 |
return year + 1; |
| 19127 |
} else if (_date.getTime() >= startOfThisYear.getTime()) { |
| 19128 |
return year; |
| 19129 |
} else { |
| 19130 |
return year - 1; |
| 19131 |
} |
| 19132 |
} |
| 19133 |
|
| 19134 |
// node_modules/date-fns/_lib/getTimezoneOffsetInMilliseconds.js |
| 19135 |
function getTimezoneOffsetInMilliseconds(date) { |
| 19136 |
const _date = toDate(date); |
| 19137 |
const utcDate = new Date( |
| 19138 |
Date.UTC( |
| 19139 |
_date.getFullYear(), |
| 19140 |
_date.getMonth(), |
| 19141 |
_date.getDate(), |
| 19142 |
_date.getHours(), |
| 19143 |
_date.getMinutes(), |
| 19144 |
_date.getSeconds(), |
| 19145 |
_date.getMilliseconds() |
| 19146 |
) |
| 19147 |
); |
| 19148 |
utcDate.setUTCFullYear(_date.getFullYear()); |
| 19149 |
return +date - +utcDate; |
| 19150 |
} |
| 19151 |
|
| 19152 |
// node_modules/date-fns/_lib/normalizeDates.js |
| 19153 |
function normalizeDates(context, ...dates) { |
| 19154 |
const normalize = constructFrom.bind( |
| 19155 |
null, |
| 19156 |
context || dates.find((date) => typeof date === "object") |
| 19157 |
); |
| 19158 |
return dates.map(normalize); |
| 19159 |
} |
| 19160 |
|
| 19161 |
// node_modules/date-fns/startOfDay.js |
| 19162 |
function startOfDay(date, options) { |
| 19163 |
const _date = toDate(date, options?.in); |
| 19164 |
_date.setHours(0, 0, 0, 0); |
| 19165 |
return _date; |
| 19166 |
} |
| 19167 |
|
| 19168 |
// node_modules/date-fns/differenceInCalendarDays.js |
| 19169 |
function differenceInCalendarDays(laterDate, earlierDate, options) { |
| 19170 |
const [laterDate_, earlierDate_] = normalizeDates( |
| 19171 |
options?.in, |
| 19172 |
laterDate, |
| 19173 |
earlierDate |
| 19174 |
); |
| 19175 |
const laterStartOfDay = startOfDay(laterDate_); |
| 19176 |
const earlierStartOfDay = startOfDay(earlierDate_); |
| 19177 |
const laterTimestamp = +laterStartOfDay - getTimezoneOffsetInMilliseconds(laterStartOfDay); |
| 19178 |
const earlierTimestamp = +earlierStartOfDay - getTimezoneOffsetInMilliseconds(earlierStartOfDay); |
| 19179 |
return Math.round((laterTimestamp - earlierTimestamp) / millisecondsInDay); |
| 19180 |
} |
| 19181 |
|
| 19182 |
// node_modules/date-fns/startOfISOWeekYear.js |
| 19183 |
function startOfISOWeekYear(date, options) { |
| 19184 |
const year = getISOWeekYear(date, options); |
| 19185 |
const fourthOfJanuary = constructFrom(options?.in || date, 0); |
| 19186 |
fourthOfJanuary.setFullYear(year, 0, 4); |
| 19187 |
fourthOfJanuary.setHours(0, 0, 0, 0); |
| 19188 |
return startOfISOWeek(fourthOfJanuary); |
| 19189 |
} |
| 19190 |
|
| 19191 |
// node_modules/date-fns/addWeeks.js |
| 19192 |
function addWeeks(date, amount, options) { |
| 19193 |
return addDays(date, amount * 7, options); |
| 19194 |
} |
| 19195 |
|
| 19196 |
// node_modules/date-fns/addYears.js |
| 19197 |
function addYears(date, amount, options) { |
| 19198 |
return addMonths(date, amount * 12, options); |
| 19199 |
} |
| 19200 |
|
| 19201 |
// node_modules/date-fns/isDate.js |
| 19202 |
function isDate(value) { |
| 19203 |
return value instanceof Date || typeof value === "object" && Object.prototype.toString.call(value) === "[object Date]"; |
| 19204 |
} |
| 19205 |
|
| 19206 |
// node_modules/date-fns/isValid.js |
| 19207 |
function isValid(date) { |
| 19208 |
return !(!isDate(date) && typeof date !== "number" || isNaN(+toDate(date))); |
| 19209 |
} |
| 19210 |
|
| 19211 |
// node_modules/date-fns/startOfMonth.js |
| 19212 |
function startOfMonth(date, options) { |
| 19213 |
const _date = toDate(date, options?.in); |
| 19214 |
_date.setDate(1); |
| 19215 |
_date.setHours(0, 0, 0, 0); |
| 19216 |
return _date; |
| 19217 |
} |
| 19218 |
|
| 19219 |
// node_modules/date-fns/startOfYear.js |
| 19220 |
function startOfYear(date, options) { |
| 19221 |
const date_ = toDate(date, options?.in); |
| 19222 |
date_.setFullYear(date_.getFullYear(), 0, 1); |
| 19223 |
date_.setHours(0, 0, 0, 0); |
| 19224 |
return date_; |
| 19225 |
} |
| 19226 |
|
| 19227 |
// node_modules/date-fns/locale/en-US/_lib/formatDistance.js |
| 19228 |
var formatDistanceLocale = { |
| 19229 |
lessThanXSeconds: { |
| 19230 |
one: "less than a second", |
| 19231 |
other: "less than {{count}} seconds" |
| 19232 |
}, |
| 19233 |
xSeconds: { |
| 19234 |
one: "1 second", |
| 19235 |
other: "{{count}} seconds" |
| 19236 |
}, |
| 19237 |
halfAMinute: "half a minute", |
| 19238 |
lessThanXMinutes: { |
| 19239 |
one: "less than a minute", |
| 19240 |
other: "less than {{count}} minutes" |
| 19241 |
}, |
| 19242 |
xMinutes: { |
| 19243 |
one: "1 minute", |
| 19244 |
other: "{{count}} minutes" |
| 19245 |
}, |
| 19246 |
aboutXHours: { |
| 19247 |
one: "about 1 hour", |
| 19248 |
other: "about {{count}} hours" |
| 19249 |
}, |
| 19250 |
xHours: { |
| 19251 |
one: "1 hour", |
| 19252 |
other: "{{count}} hours" |
| 19253 |
}, |
| 19254 |
xDays: { |
| 19255 |
one: "1 day", |
| 19256 |
other: "{{count}} days" |
| 19257 |
}, |
| 19258 |
aboutXWeeks: { |
| 19259 |
one: "about 1 week", |
| 19260 |
other: "about {{count}} weeks" |
| 19261 |
}, |
| 19262 |
xWeeks: { |
| 19263 |
one: "1 week", |
| 19264 |
other: "{{count}} weeks" |
| 19265 |
}, |
| 19266 |
aboutXMonths: { |
| 19267 |
one: "about 1 month", |
| 19268 |
other: "about {{count}} months" |
| 19269 |
}, |
| 19270 |
xMonths: { |
| 19271 |
one: "1 month", |
| 19272 |
other: "{{count}} months" |
| 19273 |
}, |
| 19274 |
aboutXYears: { |
| 19275 |
one: "about 1 year", |
| 19276 |
other: "about {{count}} years" |
| 19277 |
}, |
| 19278 |
xYears: { |
| 19279 |
one: "1 year", |
| 19280 |
other: "{{count}} years" |
| 19281 |
}, |
| 19282 |
overXYears: { |
| 19283 |
one: "over 1 year", |
| 19284 |
other: "over {{count}} years" |
| 19285 |
}, |
| 19286 |
almostXYears: { |
| 19287 |
one: "almost 1 year", |
| 19288 |
other: "almost {{count}} years" |
| 19289 |
} |
| 19290 |
}; |
| 19291 |
var formatDistance = (token, count, options) => { |
| 19292 |
let result; |
| 19293 |
const tokenValue = formatDistanceLocale[token]; |
| 19294 |
if (typeof tokenValue === "string") { |
| 19295 |
result = tokenValue; |
| 19296 |
} else if (count === 1) { |
| 19297 |
result = tokenValue.one; |
| 19298 |
} else { |
| 19299 |
result = tokenValue.other.replace("{{count}}", count.toString()); |
| 19300 |
} |
| 19301 |
if (options?.addSuffix) { |
| 19302 |
if (options.comparison && options.comparison > 0) { |
| 19303 |
return "in " + result; |
| 19304 |
} else { |
| 19305 |
return result + " ago"; |
| 19306 |
} |
| 19307 |
} |
| 19308 |
return result; |
| 19309 |
}; |
| 19310 |
|
| 19311 |
// node_modules/date-fns/locale/_lib/buildFormatLongFn.js |
| 19312 |
function buildFormatLongFn(args) { |
| 19313 |
return (options = {}) => { |
| 19314 |
const width = options.width ? String(options.width) : args.defaultWidth; |
| 19315 |
const format6 = args.formats[width] || args.formats[args.defaultWidth]; |
| 19316 |
return format6; |
| 19317 |
}; |
| 19318 |
} |
| 19319 |
|
| 19320 |
// node_modules/date-fns/locale/en-US/_lib/formatLong.js |
| 19321 |
var dateFormats = { |
| 19322 |
full: "EEEE, MMMM do, y", |
| 19323 |
long: "MMMM do, y", |
| 19324 |
medium: "MMM d, y", |
| 19325 |
short: "MM/dd/yyyy" |
| 19326 |
}; |
| 19327 |
var timeFormats = { |
| 19328 |
full: "h:mm:ss a zzzz", |
| 19329 |
long: "h:mm:ss a z", |
| 19330 |
medium: "h:mm:ss a", |
| 19331 |
short: "h:mm a" |
| 19332 |
}; |
| 19333 |
var dateTimeFormats = { |
| 19334 |
full: "{{date}} 'at' {{time}}", |
| 19335 |
long: "{{date}} 'at' {{time}}", |
| 19336 |
medium: "{{date}}, {{time}}", |
| 19337 |
short: "{{date}}, {{time}}" |
| 19338 |
}; |
| 19339 |
var formatLong = { |
| 19340 |
date: buildFormatLongFn({ |
| 19341 |
formats: dateFormats, |
| 19342 |
defaultWidth: "full" |
| 19343 |
}), |
| 19344 |
time: buildFormatLongFn({ |
| 19345 |
formats: timeFormats, |
| 19346 |
defaultWidth: "full" |
| 19347 |
}), |
| 19348 |
dateTime: buildFormatLongFn({ |
| 19349 |
formats: dateTimeFormats, |
| 19350 |
defaultWidth: "full" |
| 19351 |
}) |
| 19352 |
}; |
| 19353 |
|
| 19354 |
// node_modules/date-fns/locale/en-US/_lib/formatRelative.js |
| 19355 |
var formatRelativeLocale = { |
| 19356 |
lastWeek: "'last' eeee 'at' p", |
| 19357 |
yesterday: "'yesterday at' p", |
| 19358 |
today: "'today at' p", |
| 19359 |
tomorrow: "'tomorrow at' p", |
| 19360 |
nextWeek: "eeee 'at' p", |
| 19361 |
other: "P" |
| 19362 |
}; |
| 19363 |
var formatRelative = (token, _date, _baseDate, _options) => formatRelativeLocale[token]; |
| 19364 |
|
| 19365 |
// node_modules/date-fns/locale/_lib/buildLocalizeFn.js |
| 19366 |
function buildLocalizeFn(args) { |
| 19367 |
return (value, options) => { |
| 19368 |
const context = options?.context ? String(options.context) : "standalone"; |
| 19369 |
let valuesArray; |
| 19370 |
if (context === "formatting" && args.formattingValues) { |
| 19371 |
const defaultWidth = args.defaultFormattingWidth || args.defaultWidth; |
| 19372 |
const width = options?.width ? String(options.width) : defaultWidth; |
| 19373 |
valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth]; |
| 19374 |
} else { |
| 19375 |
const defaultWidth = args.defaultWidth; |
| 19376 |
const width = options?.width ? String(options.width) : args.defaultWidth; |
| 19377 |
valuesArray = args.values[width] || args.values[defaultWidth]; |
| 19378 |
} |
| 19379 |
const index2 = args.argumentCallback ? args.argumentCallback(value) : value; |
| 19380 |
return valuesArray[index2]; |
| 19381 |
}; |
| 19382 |
} |
| 19383 |
|
| 19384 |
// node_modules/date-fns/locale/en-US/_lib/localize.js |
| 19385 |
var eraValues = { |
| 19386 |
narrow: ["B", "A"], |
| 19387 |
abbreviated: ["BC", "AD"], |
| 19388 |
wide: ["Before Christ", "Anno Domini"] |
| 19389 |
}; |
| 19390 |
var quarterValues = { |
| 19391 |
narrow: ["1", "2", "3", "4"], |
| 19392 |
abbreviated: ["Q1", "Q2", "Q3", "Q4"], |
| 19393 |
wide: ["1st quarter", "2nd quarter", "3rd quarter", "4th quarter"] |
| 19394 |
}; |
| 19395 |
var monthValues = { |
| 19396 |
narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"], |
| 19397 |
abbreviated: [ |
| 19398 |
"Jan", |
| 19399 |
"Feb", |
| 19400 |
"Mar", |
| 19401 |
"Apr", |
| 19402 |
"May", |
| 19403 |
"Jun", |
| 19404 |
"Jul", |
| 19405 |
"Aug", |
| 19406 |
"Sep", |
| 19407 |
"Oct", |
| 19408 |
"Nov", |
| 19409 |
"Dec" |
| 19410 |
], |
| 19411 |
wide: [ |
| 19412 |
"January", |
| 19413 |
"February", |
| 19414 |
"March", |
| 19415 |
"April", |
| 19416 |
"May", |
| 19417 |
"June", |
| 19418 |
"July", |
| 19419 |
"August", |
| 19420 |
"September", |
| 19421 |
"October", |
| 19422 |
"November", |
| 19423 |
"December" |
| 19424 |
] |
| 19425 |
}; |
| 19426 |
var dayValues = { |
| 19427 |
narrow: ["S", "M", "T", "W", "T", "F", "S"], |
| 19428 |
short: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], |
| 19429 |
abbreviated: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], |
| 19430 |
wide: [ |
| 19431 |
"Sunday", |
| 19432 |
"Monday", |
| 19433 |
"Tuesday", |
| 19434 |
"Wednesday", |
| 19435 |
"Thursday", |
| 19436 |
"Friday", |
| 19437 |
"Saturday" |
| 19438 |
] |
| 19439 |
}; |
| 19440 |
var dayPeriodValues = { |
| 19441 |
narrow: { |
| 19442 |
am: "a", |
| 19443 |
pm: "p", |
| 19444 |
midnight: "mi", |
| 19445 |
noon: "n", |
| 19446 |
morning: "morning", |
| 19447 |
afternoon: "afternoon", |
| 19448 |
evening: "evening", |
| 19449 |
night: "night" |
| 19450 |
}, |
| 19451 |
abbreviated: { |
| 19452 |
am: "AM", |
| 19453 |
pm: "PM", |
| 19454 |
midnight: "midnight", |
| 19455 |
noon: "noon", |
| 19456 |
morning: "morning", |
| 19457 |
afternoon: "afternoon", |
| 19458 |
evening: "evening", |
| 19459 |
night: "night" |
| 19460 |
}, |
| 19461 |
wide: { |
| 19462 |
am: "a.m.", |
| 19463 |
pm: "p.m.", |
| 19464 |
midnight: "midnight", |
| 19465 |
noon: "noon", |
| 19466 |
morning: "morning", |
| 19467 |
afternoon: "afternoon", |
| 19468 |
evening: "evening", |
| 19469 |
night: "night" |
| 19470 |
} |
| 19471 |
}; |
| 19472 |
var formattingDayPeriodValues = { |
| 19473 |
narrow: { |
| 19474 |
am: "a", |
| 19475 |
pm: "p", |
| 19476 |
midnight: "mi", |
| 19477 |
noon: "n", |
| 19478 |
morning: "in the morning", |
| 19479 |
afternoon: "in the afternoon", |
| 19480 |
evening: "in the evening", |
| 19481 |
night: "at night" |
| 19482 |
}, |
| 19483 |
abbreviated: { |
| 19484 |
am: "AM", |
| 19485 |
pm: "PM", |
| 19486 |
midnight: "midnight", |
| 19487 |
noon: "noon", |
| 19488 |
morning: "in the morning", |
| 19489 |
afternoon: "in the afternoon", |
| 19490 |
evening: "in the evening", |
| 19491 |
night: "at night" |
| 19492 |
}, |
| 19493 |
wide: { |
| 19494 |
am: "a.m.", |
| 19495 |
pm: "p.m.", |
| 19496 |
midnight: "midnight", |
| 19497 |
noon: "noon", |
| 19498 |
morning: "in the morning", |
| 19499 |
afternoon: "in the afternoon", |
| 19500 |
evening: "in the evening", |
| 19501 |
night: "at night" |
| 19502 |
} |
| 19503 |
}; |
| 19504 |
var ordinalNumber = (dirtyNumber, _options) => { |
| 19505 |
const number = Number(dirtyNumber); |
| 19506 |
const rem100 = number % 100; |
| 19507 |
if (rem100 > 20 || rem100 < 10) { |
| 19508 |
switch (rem100 % 10) { |
| 19509 |
case 1: |
| 19510 |
return number + "st"; |
| 19511 |
case 2: |
| 19512 |
return number + "nd"; |
| 19513 |
case 3: |
| 19514 |
return number + "rd"; |
| 19515 |
} |
| 19516 |
} |
| 19517 |
return number + "th"; |
| 19518 |
}; |
| 19519 |
var localize = { |
| 19520 |
ordinalNumber, |
| 19521 |
era: buildLocalizeFn({ |
| 19522 |
values: eraValues, |
| 19523 |
defaultWidth: "wide" |
| 19524 |
}), |
| 19525 |
quarter: buildLocalizeFn({ |
| 19526 |
values: quarterValues, |
| 19527 |
defaultWidth: "wide", |
| 19528 |
argumentCallback: (quarter) => quarter - 1 |
| 19529 |
}), |
| 19530 |
month: buildLocalizeFn({ |
| 19531 |
values: monthValues, |
| 19532 |
defaultWidth: "wide" |
| 19533 |
}), |
| 19534 |
day: buildLocalizeFn({ |
| 19535 |
values: dayValues, |
| 19536 |
defaultWidth: "wide" |
| 19537 |
}), |
| 19538 |
dayPeriod: buildLocalizeFn({ |
| 19539 |
values: dayPeriodValues, |
| 19540 |
defaultWidth: "wide", |
| 19541 |
formattingValues: formattingDayPeriodValues, |
| 19542 |
defaultFormattingWidth: "wide" |
| 19543 |
}) |
| 19544 |
}; |
| 19545 |
|
| 19546 |
// node_modules/date-fns/locale/_lib/buildMatchFn.js |
| 19547 |
function buildMatchFn(args) { |
| 19548 |
return (string, options = {}) => { |
| 19549 |
const width = options.width; |
| 19550 |
const matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth]; |
| 19551 |
const matchResult = string.match(matchPattern); |
| 19552 |
if (!matchResult) { |
| 19553 |
return null; |
| 19554 |
} |
| 19555 |
const matchedString = matchResult[0]; |
| 19556 |
const parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth]; |
| 19557 |
const key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, (pattern) => pattern.test(matchedString)) : ( |
| 19558 |
// [TODO] -- I challenge you to fix the type |
| 19559 |
findKey(parsePatterns, (pattern) => pattern.test(matchedString)) |
| 19560 |
); |
| 19561 |
let value; |
| 19562 |
value = args.valueCallback ? args.valueCallback(key) : key; |
| 19563 |
value = options.valueCallback ? ( |
| 19564 |
// [TODO] -- I challenge you to fix the type |
| 19565 |
options.valueCallback(value) |
| 19566 |
) : value; |
| 19567 |
const rest = string.slice(matchedString.length); |
| 19568 |
return { value, rest }; |
| 19569 |
}; |
| 19570 |
} |
| 19571 |
function findKey(object, predicate) { |
| 19572 |
for (const key in object) { |
| 19573 |
if (Object.prototype.hasOwnProperty.call(object, key) && predicate(object[key])) { |
| 19574 |
return key; |
| 19575 |
} |
| 19576 |
} |
| 19577 |
return void 0; |
| 19578 |
} |
| 19579 |
function findIndex(array, predicate) { |
| 19580 |
for (let key = 0; key < array.length; key++) { |
| 19581 |
if (predicate(array[key])) { |
| 19582 |
return key; |
| 19583 |
} |
| 19584 |
} |
| 19585 |
return void 0; |
| 19586 |
} |
| 19587 |
|
| 19588 |
// node_modules/date-fns/locale/_lib/buildMatchPatternFn.js |
| 19589 |
function buildMatchPatternFn(args) { |
| 19590 |
return (string, options = {}) => { |
| 19591 |
const matchResult = string.match(args.matchPattern); |
| 19592 |
if (!matchResult) return null; |
| 19593 |
const matchedString = matchResult[0]; |
| 19594 |
const parseResult = string.match(args.parsePattern); |
| 19595 |
if (!parseResult) return null; |
| 19596 |
let value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0]; |
| 19597 |
value = options.valueCallback ? options.valueCallback(value) : value; |
| 19598 |
const rest = string.slice(matchedString.length); |
| 19599 |
return { value, rest }; |
| 19600 |
}; |
| 19601 |
} |
| 19602 |
|
| 19603 |
// node_modules/date-fns/locale/en-US/_lib/match.js |
| 19604 |
var matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i; |
| 19605 |
var parseOrdinalNumberPattern = /\d+/i; |
| 19606 |
var matchEraPatterns = { |
| 19607 |
narrow: /^(b|a)/i, |
| 19608 |
abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i, |
| 19609 |
wide: /^(before christ|before common era|anno domini|common era)/i |
| 19610 |
}; |
| 19611 |
var parseEraPatterns = { |
| 19612 |
any: [/^b/i, /^(a|c)/i] |
| 19613 |
}; |
| 19614 |
var matchQuarterPatterns = { |
| 19615 |
narrow: /^[1234]/i, |
| 19616 |
abbreviated: /^q[1234]/i, |
| 19617 |
wide: /^[1234](th|st|nd|rd)? quarter/i |
| 19618 |
}; |
| 19619 |
var parseQuarterPatterns = { |
| 19620 |
any: [/1/i, /2/i, /3/i, /4/i] |
| 19621 |
}; |
| 19622 |
var matchMonthPatterns = { |
| 19623 |
narrow: /^[jfmasond]/i, |
| 19624 |
abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i, |
| 19625 |
wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i |
| 19626 |
}; |
| 19627 |
var parseMonthPatterns = { |
| 19628 |
narrow: [ |
| 19629 |
/^j/i, |
| 19630 |
/^f/i, |
| 19631 |
/^m/i, |
| 19632 |
/^a/i, |
| 19633 |
/^m/i, |
| 19634 |
/^j/i, |
| 19635 |
/^j/i, |
| 19636 |
/^a/i, |
| 19637 |
/^s/i, |
| 19638 |
/^o/i, |
| 19639 |
/^n/i, |
| 19640 |
/^d/i |
| 19641 |
], |
| 19642 |
any: [ |
| 19643 |
/^ja/i, |
| 19644 |
/^f/i, |
| 19645 |
/^mar/i, |
| 19646 |
/^ap/i, |
| 19647 |
/^may/i, |
| 19648 |
/^jun/i, |
| 19649 |
/^jul/i, |
| 19650 |
/^au/i, |
| 19651 |
/^s/i, |
| 19652 |
/^o/i, |
| 19653 |
/^n/i, |
| 19654 |
/^d/i |
| 19655 |
] |
| 19656 |
}; |
| 19657 |
var matchDayPatterns = { |
| 19658 |
narrow: /^[smtwf]/i, |
| 19659 |
short: /^(su|mo|tu|we|th|fr|sa)/i, |
| 19660 |
abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i, |
| 19661 |
wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i |
| 19662 |
}; |
| 19663 |
var parseDayPatterns = { |
| 19664 |
narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i], |
| 19665 |
any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i] |
| 19666 |
}; |
| 19667 |
var matchDayPeriodPatterns = { |
| 19668 |
narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i, |
| 19669 |
any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i |
| 19670 |
}; |
| 19671 |
var parseDayPeriodPatterns = { |
| 19672 |
any: { |
| 19673 |
am: /^a/i, |
| 19674 |
pm: /^p/i, |
| 19675 |
midnight: /^mi/i, |
| 19676 |
noon: /^no/i, |
| 19677 |
morning: /morning/i, |
| 19678 |
afternoon: /afternoon/i, |
| 19679 |
evening: /evening/i, |
| 19680 |
night: /night/i |
| 19681 |
} |
| 19682 |
}; |
| 19683 |
var match = { |
| 19684 |
ordinalNumber: buildMatchPatternFn({ |
| 19685 |
matchPattern: matchOrdinalNumberPattern, |
| 19686 |
parsePattern: parseOrdinalNumberPattern, |
| 19687 |
valueCallback: (value) => parseInt(value, 10) |
| 19688 |
}), |
| 19689 |
era: buildMatchFn({ |
| 19690 |
matchPatterns: matchEraPatterns, |
| 19691 |
defaultMatchWidth: "wide", |
| 19692 |
parsePatterns: parseEraPatterns, |
| 19693 |
defaultParseWidth: "any" |
| 19694 |
}), |
| 19695 |
quarter: buildMatchFn({ |
| 19696 |
matchPatterns: matchQuarterPatterns, |
| 19697 |
defaultMatchWidth: "wide", |
| 19698 |
parsePatterns: parseQuarterPatterns, |
| 19699 |
defaultParseWidth: "any", |
| 19700 |
valueCallback: (index2) => index2 + 1 |
| 19701 |
}), |
| 19702 |
month: buildMatchFn({ |
| 19703 |
matchPatterns: matchMonthPatterns, |
| 19704 |
defaultMatchWidth: "wide", |
| 19705 |
parsePatterns: parseMonthPatterns, |
| 19706 |
defaultParseWidth: "any" |
| 19707 |
}), |
| 19708 |
day: buildMatchFn({ |
| 19709 |
matchPatterns: matchDayPatterns, |
| 19710 |
defaultMatchWidth: "wide", |
| 19711 |
parsePatterns: parseDayPatterns, |
| 19712 |
defaultParseWidth: "any" |
| 19713 |
}), |
| 19714 |
dayPeriod: buildMatchFn({ |
| 19715 |
matchPatterns: matchDayPeriodPatterns, |
| 19716 |
defaultMatchWidth: "any", |
| 19717 |
parsePatterns: parseDayPeriodPatterns, |
| 19718 |
defaultParseWidth: "any" |
| 19719 |
}) |
| 19720 |
}; |
| 19721 |
|
| 19722 |
// node_modules/date-fns/locale/en-US.js |
| 19723 |
var enUS = { |
| 19724 |
code: "en-US", |
| 19725 |
formatDistance, |
| 19726 |
formatLong, |
| 19727 |
formatRelative, |
| 19728 |
localize, |
| 19729 |
match, |
| 19730 |
options: { |
| 19731 |
weekStartsOn: 0, |
| 19732 |
firstWeekContainsDate: 1 |
| 19733 |
} |
| 19734 |
}; |
| 19735 |
|
| 19736 |
// node_modules/date-fns/getDayOfYear.js |
| 19737 |
function getDayOfYear(date, options) { |
| 19738 |
const _date = toDate(date, options?.in); |
| 19739 |
const diff = differenceInCalendarDays(_date, startOfYear(_date)); |
| 19740 |
const dayOfYear = diff + 1; |
| 19741 |
return dayOfYear; |
| 19742 |
} |
| 19743 |
|
| 19744 |
// node_modules/date-fns/getISOWeek.js |
| 19745 |
function getISOWeek(date, options) { |
| 19746 |
const _date = toDate(date, options?.in); |
| 19747 |
const diff = +startOfISOWeek(_date) - +startOfISOWeekYear(_date); |
| 19748 |
return Math.round(diff / millisecondsInWeek) + 1; |
| 19749 |
} |
| 19750 |
|
| 19751 |
// node_modules/date-fns/getWeekYear.js |
| 19752 |
function getWeekYear(date, options) { |
| 19753 |
const _date = toDate(date, options?.in); |
| 19754 |
const year = _date.getFullYear(); |
| 19755 |
const defaultOptions2 = getDefaultOptions(); |
| 19756 |
const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; |
| 19757 |
const firstWeekOfNextYear = constructFrom(options?.in || date, 0); |
| 19758 |
firstWeekOfNextYear.setFullYear(year + 1, 0, firstWeekContainsDate); |
| 19759 |
firstWeekOfNextYear.setHours(0, 0, 0, 0); |
| 19760 |
const startOfNextYear = startOfWeek(firstWeekOfNextYear, options); |
| 19761 |
const firstWeekOfThisYear = constructFrom(options?.in || date, 0); |
| 19762 |
firstWeekOfThisYear.setFullYear(year, 0, firstWeekContainsDate); |
| 19763 |
firstWeekOfThisYear.setHours(0, 0, 0, 0); |
| 19764 |
const startOfThisYear = startOfWeek(firstWeekOfThisYear, options); |
| 19765 |
if (+_date >= +startOfNextYear) { |
| 19766 |
return year + 1; |
| 19767 |
} else if (+_date >= +startOfThisYear) { |
| 19768 |
return year; |
| 19769 |
} else { |
| 19770 |
return year - 1; |
| 19771 |
} |
| 19772 |
} |
| 19773 |
|
| 19774 |
// node_modules/date-fns/startOfWeekYear.js |
| 19775 |
function startOfWeekYear(date, options) { |
| 19776 |
const defaultOptions2 = getDefaultOptions(); |
| 19777 |
const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; |
| 19778 |
const year = getWeekYear(date, options); |
| 19779 |
const firstWeek = constructFrom(options?.in || date, 0); |
| 19780 |
firstWeek.setFullYear(year, 0, firstWeekContainsDate); |
| 19781 |
firstWeek.setHours(0, 0, 0, 0); |
| 19782 |
const _date = startOfWeek(firstWeek, options); |
| 19783 |
return _date; |
| 19784 |
} |
| 19785 |
|
| 19786 |
// node_modules/date-fns/getWeek.js |
| 19787 |
function getWeek(date, options) { |
| 19788 |
const _date = toDate(date, options?.in); |
| 19789 |
const diff = +startOfWeek(_date, options) - +startOfWeekYear(_date, options); |
| 19790 |
return Math.round(diff / millisecondsInWeek) + 1; |
| 19791 |
} |
| 19792 |
|
| 19793 |
// node_modules/date-fns/_lib/addLeadingZeros.js |
| 19794 |
function addLeadingZeros(number, targetLength) { |
| 19795 |
const sign = number < 0 ? "-" : ""; |
| 19796 |
const output = Math.abs(number).toString().padStart(targetLength, "0"); |
| 19797 |
return sign + output; |
| 19798 |
} |
| 19799 |
|
| 19800 |
// node_modules/date-fns/_lib/format/lightFormatters.js |
| 19801 |
var lightFormatters = { |
| 19802 |
// Year |
| 19803 |
y(date, token) { |
| 19804 |
const signedYear = date.getFullYear(); |
| 19805 |
const year = signedYear > 0 ? signedYear : 1 - signedYear; |
| 19806 |
return addLeadingZeros(token === "yy" ? year % 100 : year, token.length); |
| 19807 |
}, |
| 19808 |
// Month |
| 19809 |
M(date, token) { |
| 19810 |
const month = date.getMonth(); |
| 19811 |
return token === "M" ? String(month + 1) : addLeadingZeros(month + 1, 2); |
| 19812 |
}, |
| 19813 |
// Day of the month |
| 19814 |
d(date, token) { |
| 19815 |
return addLeadingZeros(date.getDate(), token.length); |
| 19816 |
}, |
| 19817 |
// AM or PM |
| 19818 |
a(date, token) { |
| 19819 |
const dayPeriodEnumValue = date.getHours() / 12 >= 1 ? "pm" : "am"; |
| 19820 |
switch (token) { |
| 19821 |
case "a": |
| 19822 |
case "aa": |
| 19823 |
return dayPeriodEnumValue.toUpperCase(); |
| 19824 |
case "aaa": |
| 19825 |
return dayPeriodEnumValue; |
| 19826 |
case "aaaaa": |
| 19827 |
return dayPeriodEnumValue[0]; |
| 19828 |
case "aaaa": |
| 19829 |
default: |
| 19830 |
return dayPeriodEnumValue === "am" ? "a.m." : "p.m."; |
| 19831 |
} |
| 19832 |
}, |
| 19833 |
// Hour [1-12] |
| 19834 |
h(date, token) { |
| 19835 |
return addLeadingZeros(date.getHours() % 12 || 12, token.length); |
| 19836 |
}, |
| 19837 |
// Hour [0-23] |
| 19838 |
H(date, token) { |
| 19839 |
return addLeadingZeros(date.getHours(), token.length); |
| 19840 |
}, |
| 19841 |
// Minute |
| 19842 |
m(date, token) { |
| 19843 |
return addLeadingZeros(date.getMinutes(), token.length); |
| 19844 |
}, |
| 19845 |
// Second |
| 19846 |
s(date, token) { |
| 19847 |
return addLeadingZeros(date.getSeconds(), token.length); |
| 19848 |
}, |
| 19849 |
// Fraction of second |
| 19850 |
S(date, token) { |
| 19851 |
const numberOfDigits = token.length; |
| 19852 |
const milliseconds = date.getMilliseconds(); |
| 19853 |
const fractionalSeconds = Math.trunc( |
| 19854 |
milliseconds * Math.pow(10, numberOfDigits - 3) |
| 19855 |
); |
| 19856 |
return addLeadingZeros(fractionalSeconds, token.length); |
| 19857 |
} |
| 19858 |
}; |
| 19859 |
|
| 19860 |
// node_modules/date-fns/_lib/format/formatters.js |
| 19861 |
var dayPeriodEnum = { |
| 19862 |
am: "am", |
| 19863 |
pm: "pm", |
| 19864 |
midnight: "midnight", |
| 19865 |
noon: "noon", |
| 19866 |
morning: "morning", |
| 19867 |
afternoon: "afternoon", |
| 19868 |
evening: "evening", |
| 19869 |
night: "night" |
| 19870 |
}; |
| 19871 |
var formatters = { |
| 19872 |
// Era |
| 19873 |
G: function(date, token, localize2) { |
| 19874 |
const era = date.getFullYear() > 0 ? 1 : 0; |
| 19875 |
switch (token) { |
| 19876 |
// AD, BC |
| 19877 |
case "G": |
| 19878 |
case "GG": |
| 19879 |
case "GGG": |
| 19880 |
return localize2.era(era, { width: "abbreviated" }); |
| 19881 |
// A, B |
| 19882 |
case "GGGGG": |
| 19883 |
return localize2.era(era, { width: "narrow" }); |
| 19884 |
// Anno Domini, Before Christ |
| 19885 |
case "GGGG": |
| 19886 |
default: |
| 19887 |
return localize2.era(era, { width: "wide" }); |
| 19888 |
} |
| 19889 |
}, |
| 19890 |
// Year |
| 19891 |
y: function(date, token, localize2) { |
| 19892 |
if (token === "yo") { |
| 19893 |
const signedYear = date.getFullYear(); |
| 19894 |
const year = signedYear > 0 ? signedYear : 1 - signedYear; |
| 19895 |
return localize2.ordinalNumber(year, { unit: "year" }); |
| 19896 |
} |
| 19897 |
return lightFormatters.y(date, token); |
| 19898 |
}, |
| 19899 |
// Local week-numbering year |
| 19900 |
Y: function(date, token, localize2, options) { |
| 19901 |
const signedWeekYear = getWeekYear(date, options); |
| 19902 |
const weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear; |
| 19903 |
if (token === "YY") { |
| 19904 |
const twoDigitYear = weekYear % 100; |
| 19905 |
return addLeadingZeros(twoDigitYear, 2); |
| 19906 |
} |
| 19907 |
if (token === "Yo") { |
| 19908 |
return localize2.ordinalNumber(weekYear, { unit: "year" }); |
| 19909 |
} |
| 19910 |
return addLeadingZeros(weekYear, token.length); |
| 19911 |
}, |
| 19912 |
// ISO week-numbering year |
| 19913 |
R: function(date, token) { |
| 19914 |
const isoWeekYear = getISOWeekYear(date); |
| 19915 |
return addLeadingZeros(isoWeekYear, token.length); |
| 19916 |
}, |
| 19917 |
// Extended year. This is a single number designating the year of this calendar system. |
| 19918 |
// The main difference between `y` and `u` localizers are B.C. years: |
| 19919 |
// | Year | `y` | `u` | |
| 19920 |
// |------|-----|-----| |
| 19921 |
// | AC 1 | 1 | 1 | |
| 19922 |
// | BC 1 | 1 | 0 | |
| 19923 |
// | BC 2 | 2 | -1 | |
| 19924 |
// Also `yy` always returns the last two digits of a year, |
| 19925 |
// while `uu` pads single digit years to 2 characters and returns other years unchanged. |
| 19926 |
u: function(date, token) { |
| 19927 |
const year = date.getFullYear(); |
| 19928 |
return addLeadingZeros(year, token.length); |
| 19929 |
}, |
| 19930 |
// Quarter |
| 19931 |
Q: function(date, token, localize2) { |
| 19932 |
const quarter = Math.ceil((date.getMonth() + 1) / 3); |
| 19933 |
switch (token) { |
| 19934 |
// 1, 2, 3, 4 |
| 19935 |
case "Q": |
| 19936 |
return String(quarter); |
| 19937 |
// 01, 02, 03, 04 |
| 19938 |
case "QQ": |
| 19939 |
return addLeadingZeros(quarter, 2); |
| 19940 |
// 1st, 2nd, 3rd, 4th |
| 19941 |
case "Qo": |
| 19942 |
return localize2.ordinalNumber(quarter, { unit: "quarter" }); |
| 19943 |
// Q1, Q2, Q3, Q4 |
| 19944 |
case "QQQ": |
| 19945 |
return localize2.quarter(quarter, { |
| 19946 |
width: "abbreviated", |
| 19947 |
context: "formatting" |
| 19948 |
}); |
| 19949 |
// 1, 2, 3, 4 (narrow quarter; could be not numerical) |
| 19950 |
case "QQQQQ": |
| 19951 |
return localize2.quarter(quarter, { |
| 19952 |
width: "narrow", |
| 19953 |
context: "formatting" |
| 19954 |
}); |
| 19955 |
// 1st quarter, 2nd quarter, ... |
| 19956 |
case "QQQQ": |
| 19957 |
default: |
| 19958 |
return localize2.quarter(quarter, { |
| 19959 |
width: "wide", |
| 19960 |
context: "formatting" |
| 19961 |
}); |
| 19962 |
} |
| 19963 |
}, |
| 19964 |
// Stand-alone quarter |
| 19965 |
q: function(date, token, localize2) { |
| 19966 |
const quarter = Math.ceil((date.getMonth() + 1) / 3); |
| 19967 |
switch (token) { |
| 19968 |
// 1, 2, 3, 4 |
| 19969 |
case "q": |
| 19970 |
return String(quarter); |
| 19971 |
// 01, 02, 03, 04 |
| 19972 |
case "qq": |
| 19973 |
return addLeadingZeros(quarter, 2); |
| 19974 |
// 1st, 2nd, 3rd, 4th |
| 19975 |
case "qo": |
| 19976 |
return localize2.ordinalNumber(quarter, { unit: "quarter" }); |
| 19977 |
// Q1, Q2, Q3, Q4 |
| 19978 |
case "qqq": |
| 19979 |
return localize2.quarter(quarter, { |
| 19980 |
width: "abbreviated", |
| 19981 |
context: "standalone" |
| 19982 |
}); |
| 19983 |
// 1, 2, 3, 4 (narrow quarter; could be not numerical) |
| 19984 |
case "qqqqq": |
| 19985 |
return localize2.quarter(quarter, { |
| 19986 |
width: "narrow", |
| 19987 |
context: "standalone" |
| 19988 |
}); |
| 19989 |
// 1st quarter, 2nd quarter, ... |
| 19990 |
case "qqqq": |
| 19991 |
default: |
| 19992 |
return localize2.quarter(quarter, { |
| 19993 |
width: "wide", |
| 19994 |
context: "standalone" |
| 19995 |
}); |
| 19996 |
} |
| 19997 |
}, |
| 19998 |
// Month |
| 19999 |
M: function(date, token, localize2) { |
| 20000 |
const month = date.getMonth(); |
| 20001 |
switch (token) { |
| 20002 |
case "M": |
| 20003 |
case "MM": |
| 20004 |
return lightFormatters.M(date, token); |
| 20005 |
// 1st, 2nd, ..., 12th |
| 20006 |
case "Mo": |
| 20007 |
return localize2.ordinalNumber(month + 1, { unit: "month" }); |
| 20008 |
// Jan, Feb, ..., Dec |
| 20009 |
case "MMM": |
| 20010 |
return localize2.month(month, { |
| 20011 |
width: "abbreviated", |
| 20012 |
context: "formatting" |
| 20013 |
}); |
| 20014 |
// J, F, ..., D |
| 20015 |
case "MMMMM": |
| 20016 |
return localize2.month(month, { |
| 20017 |
width: "narrow", |
| 20018 |
context: "formatting" |
| 20019 |
}); |
| 20020 |
// January, February, ..., December |
| 20021 |
case "MMMM": |
| 20022 |
default: |
| 20023 |
return localize2.month(month, { width: "wide", context: "formatting" }); |
| 20024 |
} |
| 20025 |
}, |
| 20026 |
// Stand-alone month |
| 20027 |
L: function(date, token, localize2) { |
| 20028 |
const month = date.getMonth(); |
| 20029 |
switch (token) { |
| 20030 |
// 1, 2, ..., 12 |
| 20031 |
case "L": |
| 20032 |
return String(month + 1); |
| 20033 |
// 01, 02, ..., 12 |
| 20034 |
case "LL": |
| 20035 |
return addLeadingZeros(month + 1, 2); |
| 20036 |
// 1st, 2nd, ..., 12th |
| 20037 |
case "Lo": |
| 20038 |
return localize2.ordinalNumber(month + 1, { unit: "month" }); |
| 20039 |
// Jan, Feb, ..., Dec |
| 20040 |
case "LLL": |
| 20041 |
return localize2.month(month, { |
| 20042 |
width: "abbreviated", |
| 20043 |
context: "standalone" |
| 20044 |
}); |
| 20045 |
// J, F, ..., D |
| 20046 |
case "LLLLL": |
| 20047 |
return localize2.month(month, { |
| 20048 |
width: "narrow", |
| 20049 |
context: "standalone" |
| 20050 |
}); |
| 20051 |
// January, February, ..., December |
| 20052 |
case "LLLL": |
| 20053 |
default: |
| 20054 |
return localize2.month(month, { width: "wide", context: "standalone" }); |
| 20055 |
} |
| 20056 |
}, |
| 20057 |
// Local week of year |
| 20058 |
w: function(date, token, localize2, options) { |
| 20059 |
const week = getWeek(date, options); |
| 20060 |
if (token === "wo") { |
| 20061 |
return localize2.ordinalNumber(week, { unit: "week" }); |
| 20062 |
} |
| 20063 |
return addLeadingZeros(week, token.length); |
| 20064 |
}, |
| 20065 |
// ISO week of year |
| 20066 |
I: function(date, token, localize2) { |
| 20067 |
const isoWeek = getISOWeek(date); |
| 20068 |
if (token === "Io") { |
| 20069 |
return localize2.ordinalNumber(isoWeek, { unit: "week" }); |
| 20070 |
} |
| 20071 |
return addLeadingZeros(isoWeek, token.length); |
| 20072 |
}, |
| 20073 |
// Day of the month |
| 20074 |
d: function(date, token, localize2) { |
| 20075 |
if (token === "do") { |
| 20076 |
return localize2.ordinalNumber(date.getDate(), { unit: "date" }); |
| 20077 |
} |
| 20078 |
return lightFormatters.d(date, token); |
| 20079 |
}, |
| 20080 |
// Day of year |
| 20081 |
D: function(date, token, localize2) { |
| 20082 |
const dayOfYear = getDayOfYear(date); |
| 20083 |
if (token === "Do") { |
| 20084 |
return localize2.ordinalNumber(dayOfYear, { unit: "dayOfYear" }); |
| 20085 |
} |
| 20086 |
return addLeadingZeros(dayOfYear, token.length); |
| 20087 |
}, |
| 20088 |
// Day of week |
| 20089 |
E: function(date, token, localize2) { |
| 20090 |
const dayOfWeek = date.getDay(); |
| 20091 |
switch (token) { |
| 20092 |
// Tue |
| 20093 |
case "E": |
| 20094 |
case "EE": |
| 20095 |
case "EEE": |
| 20096 |
return localize2.day(dayOfWeek, { |
| 20097 |
width: "abbreviated", |
| 20098 |
context: "formatting" |
| 20099 |
}); |
| 20100 |
// T |
| 20101 |
case "EEEEE": |
| 20102 |
return localize2.day(dayOfWeek, { |
| 20103 |
width: "narrow", |
| 20104 |
context: "formatting" |
| 20105 |
}); |
| 20106 |
// Tu |
| 20107 |
case "EEEEEE": |
| 20108 |
return localize2.day(dayOfWeek, { |
| 20109 |
width: "short", |
| 20110 |
context: "formatting" |
| 20111 |
}); |
| 20112 |
// Tuesday |
| 20113 |
case "EEEE": |
| 20114 |
default: |
| 20115 |
return localize2.day(dayOfWeek, { |
| 20116 |
width: "wide", |
| 20117 |
context: "formatting" |
| 20118 |
}); |
| 20119 |
} |
| 20120 |
}, |
| 20121 |
// Local day of week |
| 20122 |
e: function(date, token, localize2, options) { |
| 20123 |
const dayOfWeek = date.getDay(); |
| 20124 |
const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7; |
| 20125 |
switch (token) { |
| 20126 |
// Numerical value (Nth day of week with current locale or weekStartsOn) |
| 20127 |
case "e": |
| 20128 |
return String(localDayOfWeek); |
| 20129 |
// Padded numerical value |
| 20130 |
case "ee": |
| 20131 |
return addLeadingZeros(localDayOfWeek, 2); |
| 20132 |
// 1st, 2nd, ..., 7th |
| 20133 |
case "eo": |
| 20134 |
return localize2.ordinalNumber(localDayOfWeek, { unit: "day" }); |
| 20135 |
case "eee": |
| 20136 |
return localize2.day(dayOfWeek, { |
| 20137 |
width: "abbreviated", |
| 20138 |
context: "formatting" |
| 20139 |
}); |
| 20140 |
// T |
| 20141 |
case "eeeee": |
| 20142 |
return localize2.day(dayOfWeek, { |
| 20143 |
width: "narrow", |
| 20144 |
context: "formatting" |
| 20145 |
}); |
| 20146 |
// Tu |
| 20147 |
case "eeeeee": |
| 20148 |
return localize2.day(dayOfWeek, { |
| 20149 |
width: "short", |
| 20150 |
context: "formatting" |
| 20151 |
}); |
| 20152 |
// Tuesday |
| 20153 |
case "eeee": |
| 20154 |
default: |
| 20155 |
return localize2.day(dayOfWeek, { |
| 20156 |
width: "wide", |
| 20157 |
context: "formatting" |
| 20158 |
}); |
| 20159 |
} |
| 20160 |
}, |
| 20161 |
// Stand-alone local day of week |
| 20162 |
c: function(date, token, localize2, options) { |
| 20163 |
const dayOfWeek = date.getDay(); |
| 20164 |
const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7; |
| 20165 |
switch (token) { |
| 20166 |
// Numerical value (same as in `e`) |
| 20167 |
case "c": |
| 20168 |
return String(localDayOfWeek); |
| 20169 |
// Padded numerical value |
| 20170 |
case "cc": |
| 20171 |
return addLeadingZeros(localDayOfWeek, token.length); |
| 20172 |
// 1st, 2nd, ..., 7th |
| 20173 |
case "co": |
| 20174 |
return localize2.ordinalNumber(localDayOfWeek, { unit: "day" }); |
| 20175 |
case "ccc": |
| 20176 |
return localize2.day(dayOfWeek, { |
| 20177 |
width: "abbreviated", |
| 20178 |
context: "standalone" |
| 20179 |
}); |
| 20180 |
// T |
| 20181 |
case "ccccc": |
| 20182 |
return localize2.day(dayOfWeek, { |
| 20183 |
width: "narrow", |
| 20184 |
context: "standalone" |
| 20185 |
}); |
| 20186 |
// Tu |
| 20187 |
case "cccccc": |
| 20188 |
return localize2.day(dayOfWeek, { |
| 20189 |
width: "short", |
| 20190 |
context: "standalone" |
| 20191 |
}); |
| 20192 |
// Tuesday |
| 20193 |
case "cccc": |
| 20194 |
default: |
| 20195 |
return localize2.day(dayOfWeek, { |
| 20196 |
width: "wide", |
| 20197 |
context: "standalone" |
| 20198 |
}); |
| 20199 |
} |
| 20200 |
}, |
| 20201 |
// ISO day of week |
| 20202 |
i: function(date, token, localize2) { |
| 20203 |
const dayOfWeek = date.getDay(); |
| 20204 |
const isoDayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek; |
| 20205 |
switch (token) { |
| 20206 |
// 2 |
| 20207 |
case "i": |
| 20208 |
return String(isoDayOfWeek); |
| 20209 |
// 02 |
| 20210 |
case "ii": |
| 20211 |
return addLeadingZeros(isoDayOfWeek, token.length); |
| 20212 |
// 2nd |
| 20213 |
case "io": |
| 20214 |
return localize2.ordinalNumber(isoDayOfWeek, { unit: "day" }); |
| 20215 |
// Tue |
| 20216 |
case "iii": |
| 20217 |
return localize2.day(dayOfWeek, { |
| 20218 |
width: "abbreviated", |
| 20219 |
context: "formatting" |
| 20220 |
}); |
| 20221 |
// T |
| 20222 |
case "iiiii": |
| 20223 |
return localize2.day(dayOfWeek, { |
| 20224 |
width: "narrow", |
| 20225 |
context: "formatting" |
| 20226 |
}); |
| 20227 |
// Tu |
| 20228 |
case "iiiiii": |
| 20229 |
return localize2.day(dayOfWeek, { |
| 20230 |
width: "short", |
| 20231 |
context: "formatting" |
| 20232 |
}); |
| 20233 |
// Tuesday |
| 20234 |
case "iiii": |
| 20235 |
default: |
| 20236 |
return localize2.day(dayOfWeek, { |
| 20237 |
width: "wide", |
| 20238 |
context: "formatting" |
| 20239 |
}); |
| 20240 |
} |
| 20241 |
}, |
| 20242 |
// AM or PM |
| 20243 |
a: function(date, token, localize2) { |
| 20244 |
const hours = date.getHours(); |
| 20245 |
const dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am"; |
| 20246 |
switch (token) { |
| 20247 |
case "a": |
| 20248 |
case "aa": |
| 20249 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20250 |
width: "abbreviated", |
| 20251 |
context: "formatting" |
| 20252 |
}); |
| 20253 |
case "aaa": |
| 20254 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20255 |
width: "abbreviated", |
| 20256 |
context: "formatting" |
| 20257 |
}).toLowerCase(); |
| 20258 |
case "aaaaa": |
| 20259 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20260 |
width: "narrow", |
| 20261 |
context: "formatting" |
| 20262 |
}); |
| 20263 |
case "aaaa": |
| 20264 |
default: |
| 20265 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20266 |
width: "wide", |
| 20267 |
context: "formatting" |
| 20268 |
}); |
| 20269 |
} |
| 20270 |
}, |
| 20271 |
// AM, PM, midnight, noon |
| 20272 |
b: function(date, token, localize2) { |
| 20273 |
const hours = date.getHours(); |
| 20274 |
let dayPeriodEnumValue; |
| 20275 |
if (hours === 12) { |
| 20276 |
dayPeriodEnumValue = dayPeriodEnum.noon; |
| 20277 |
} else if (hours === 0) { |
| 20278 |
dayPeriodEnumValue = dayPeriodEnum.midnight; |
| 20279 |
} else { |
| 20280 |
dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am"; |
| 20281 |
} |
| 20282 |
switch (token) { |
| 20283 |
case "b": |
| 20284 |
case "bb": |
| 20285 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20286 |
width: "abbreviated", |
| 20287 |
context: "formatting" |
| 20288 |
}); |
| 20289 |
case "bbb": |
| 20290 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20291 |
width: "abbreviated", |
| 20292 |
context: "formatting" |
| 20293 |
}).toLowerCase(); |
| 20294 |
case "bbbbb": |
| 20295 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20296 |
width: "narrow", |
| 20297 |
context: "formatting" |
| 20298 |
}); |
| 20299 |
case "bbbb": |
| 20300 |
default: |
| 20301 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20302 |
width: "wide", |
| 20303 |
context: "formatting" |
| 20304 |
}); |
| 20305 |
} |
| 20306 |
}, |
| 20307 |
// in the morning, in the afternoon, in the evening, at night |
| 20308 |
B: function(date, token, localize2) { |
| 20309 |
const hours = date.getHours(); |
| 20310 |
let dayPeriodEnumValue; |
| 20311 |
if (hours >= 17) { |
| 20312 |
dayPeriodEnumValue = dayPeriodEnum.evening; |
| 20313 |
} else if (hours >= 12) { |
| 20314 |
dayPeriodEnumValue = dayPeriodEnum.afternoon; |
| 20315 |
} else if (hours >= 4) { |
| 20316 |
dayPeriodEnumValue = dayPeriodEnum.morning; |
| 20317 |
} else { |
| 20318 |
dayPeriodEnumValue = dayPeriodEnum.night; |
| 20319 |
} |
| 20320 |
switch (token) { |
| 20321 |
case "B": |
| 20322 |
case "BB": |
| 20323 |
case "BBB": |
| 20324 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20325 |
width: "abbreviated", |
| 20326 |
context: "formatting" |
| 20327 |
}); |
| 20328 |
case "BBBBB": |
| 20329 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20330 |
width: "narrow", |
| 20331 |
context: "formatting" |
| 20332 |
}); |
| 20333 |
case "BBBB": |
| 20334 |
default: |
| 20335 |
return localize2.dayPeriod(dayPeriodEnumValue, { |
| 20336 |
width: "wide", |
| 20337 |
context: "formatting" |
| 20338 |
}); |
| 20339 |
} |
| 20340 |
}, |
| 20341 |
// Hour [1-12] |
| 20342 |
h: function(date, token, localize2) { |
| 20343 |
if (token === "ho") { |
| 20344 |
let hours = date.getHours() % 12; |
| 20345 |
if (hours === 0) hours = 12; |
| 20346 |
return localize2.ordinalNumber(hours, { unit: "hour" }); |
| 20347 |
} |
| 20348 |
return lightFormatters.h(date, token); |
| 20349 |
}, |
| 20350 |
// Hour [0-23] |
| 20351 |
H: function(date, token, localize2) { |
| 20352 |
if (token === "Ho") { |
| 20353 |
return localize2.ordinalNumber(date.getHours(), { unit: "hour" }); |
| 20354 |
} |
| 20355 |
return lightFormatters.H(date, token); |
| 20356 |
}, |
| 20357 |
// Hour [0-11] |
| 20358 |
K: function(date, token, localize2) { |
| 20359 |
const hours = date.getHours() % 12; |
| 20360 |
if (token === "Ko") { |
| 20361 |
return localize2.ordinalNumber(hours, { unit: "hour" }); |
| 20362 |
} |
| 20363 |
return addLeadingZeros(hours, token.length); |
| 20364 |
}, |
| 20365 |
// Hour [1-24] |
| 20366 |
k: function(date, token, localize2) { |
| 20367 |
let hours = date.getHours(); |
| 20368 |
if (hours === 0) hours = 24; |
| 20369 |
if (token === "ko") { |
| 20370 |
return localize2.ordinalNumber(hours, { unit: "hour" }); |
| 20371 |
} |
| 20372 |
return addLeadingZeros(hours, token.length); |
| 20373 |
}, |
| 20374 |
// Minute |
| 20375 |
m: function(date, token, localize2) { |
| 20376 |
if (token === "mo") { |
| 20377 |
return localize2.ordinalNumber(date.getMinutes(), { unit: "minute" }); |
| 20378 |
} |
| 20379 |
return lightFormatters.m(date, token); |
| 20380 |
}, |
| 20381 |
// Second |
| 20382 |
s: function(date, token, localize2) { |
| 20383 |
if (token === "so") { |
| 20384 |
return localize2.ordinalNumber(date.getSeconds(), { unit: "second" }); |
| 20385 |
} |
| 20386 |
return lightFormatters.s(date, token); |
| 20387 |
}, |
| 20388 |
// Fraction of second |
| 20389 |
S: function(date, token) { |
| 20390 |
return lightFormatters.S(date, token); |
| 20391 |
}, |
| 20392 |
// Timezone (ISO-8601. If offset is 0, output is always `'Z'`) |
| 20393 |
X: function(date, token, _localize) { |
| 20394 |
const timezoneOffset = date.getTimezoneOffset(); |
| 20395 |
if (timezoneOffset === 0) { |
| 20396 |
return "Z"; |
| 20397 |
} |
| 20398 |
switch (token) { |
| 20399 |
// Hours and optional minutes |
| 20400 |
case "X": |
| 20401 |
return formatTimezoneWithOptionalMinutes(timezoneOffset); |
| 20402 |
// Hours, minutes and optional seconds without `:` delimiter |
| 20403 |
// Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets |
| 20404 |
// so this token always has the same output as `XX` |
| 20405 |
case "XXXX": |
| 20406 |
case "XX": |
| 20407 |
return formatTimezone(timezoneOffset); |
| 20408 |
// Hours, minutes and optional seconds with `:` delimiter |
| 20409 |
// Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets |
| 20410 |
// so this token always has the same output as `XXX` |
| 20411 |
case "XXXXX": |
| 20412 |
case "XXX": |
| 20413 |
// Hours and minutes with `:` delimiter |
| 20414 |
default: |
| 20415 |
return formatTimezone(timezoneOffset, ":"); |
| 20416 |
} |
| 20417 |
}, |
| 20418 |
// Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent) |
| 20419 |
x: function(date, token, _localize) { |
| 20420 |
const timezoneOffset = date.getTimezoneOffset(); |
| 20421 |
switch (token) { |
| 20422 |
// Hours and optional minutes |
| 20423 |
case "x": |
| 20424 |
return formatTimezoneWithOptionalMinutes(timezoneOffset); |
| 20425 |
// Hours, minutes and optional seconds without `:` delimiter |
| 20426 |
// Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets |
| 20427 |
// so this token always has the same output as `xx` |
| 20428 |
case "xxxx": |
| 20429 |
case "xx": |
| 20430 |
return formatTimezone(timezoneOffset); |
| 20431 |
// Hours, minutes and optional seconds with `:` delimiter |
| 20432 |
// Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets |
| 20433 |
// so this token always has the same output as `xxx` |
| 20434 |
case "xxxxx": |
| 20435 |
case "xxx": |
| 20436 |
// Hours and minutes with `:` delimiter |
| 20437 |
default: |
| 20438 |
return formatTimezone(timezoneOffset, ":"); |
| 20439 |
} |
| 20440 |
}, |
| 20441 |
// Timezone (GMT) |
| 20442 |
O: function(date, token, _localize) { |
| 20443 |
const timezoneOffset = date.getTimezoneOffset(); |
| 20444 |
switch (token) { |
| 20445 |
// Short |
| 20446 |
case "O": |
| 20447 |
case "OO": |
| 20448 |
case "OOO": |
| 20449 |
return "GMT" + formatTimezoneShort(timezoneOffset, ":"); |
| 20450 |
// Long |
| 20451 |
case "OOOO": |
| 20452 |
default: |
| 20453 |
return "GMT" + formatTimezone(timezoneOffset, ":"); |
| 20454 |
} |
| 20455 |
}, |
| 20456 |
// Timezone (specific non-location) |
| 20457 |
z: function(date, token, _localize) { |
| 20458 |
const timezoneOffset = date.getTimezoneOffset(); |
| 20459 |
switch (token) { |
| 20460 |
// Short |
| 20461 |
case "z": |
| 20462 |
case "zz": |
| 20463 |
case "zzz": |
| 20464 |
return "GMT" + formatTimezoneShort(timezoneOffset, ":"); |
| 20465 |
// Long |
| 20466 |
case "zzzz": |
| 20467 |
default: |
| 20468 |
return "GMT" + formatTimezone(timezoneOffset, ":"); |
| 20469 |
} |
| 20470 |
}, |
| 20471 |
// Seconds timestamp |
| 20472 |
t: function(date, token, _localize) { |
| 20473 |
const timestamp = Math.trunc(+date / 1e3); |
| 20474 |
return addLeadingZeros(timestamp, token.length); |
| 20475 |
}, |
| 20476 |
// Milliseconds timestamp |
| 20477 |
T: function(date, token, _localize) { |
| 20478 |
return addLeadingZeros(+date, token.length); |
| 20479 |
} |
| 20480 |
}; |
| 20481 |
function formatTimezoneShort(offset4, delimiter = "") { |
| 20482 |
const sign = offset4 > 0 ? "-" : "+"; |
| 20483 |
const absOffset = Math.abs(offset4); |
| 20484 |
const hours = Math.trunc(absOffset / 60); |
| 20485 |
const minutes = absOffset % 60; |
| 20486 |
if (minutes === 0) { |
| 20487 |
return sign + String(hours); |
| 20488 |
} |
| 20489 |
return sign + String(hours) + delimiter + addLeadingZeros(minutes, 2); |
| 20490 |
} |
| 20491 |
function formatTimezoneWithOptionalMinutes(offset4, delimiter) { |
| 20492 |
if (offset4 % 60 === 0) { |
| 20493 |
const sign = offset4 > 0 ? "-" : "+"; |
| 20494 |
return sign + addLeadingZeros(Math.abs(offset4) / 60, 2); |
| 20495 |
} |
| 20496 |
return formatTimezone(offset4, delimiter); |
| 20497 |
} |
| 20498 |
function formatTimezone(offset4, delimiter = "") { |
| 20499 |
const sign = offset4 > 0 ? "-" : "+"; |
| 20500 |
const absOffset = Math.abs(offset4); |
| 20501 |
const hours = addLeadingZeros(Math.trunc(absOffset / 60), 2); |
| 20502 |
const minutes = addLeadingZeros(absOffset % 60, 2); |
| 20503 |
return sign + hours + delimiter + minutes; |
| 20504 |
} |
| 20505 |
|
| 20506 |
// node_modules/date-fns/_lib/format/longFormatters.js |
| 20507 |
var dateLongFormatter = (pattern, formatLong2) => { |
| 20508 |
switch (pattern) { |
| 20509 |
case "P": |
| 20510 |
return formatLong2.date({ width: "short" }); |
| 20511 |
case "PP": |
| 20512 |
return formatLong2.date({ width: "medium" }); |
| 20513 |
case "PPP": |
| 20514 |
return formatLong2.date({ width: "long" }); |
| 20515 |
case "PPPP": |
| 20516 |
default: |
| 20517 |
return formatLong2.date({ width: "full" }); |
| 20518 |
} |
| 20519 |
}; |
| 20520 |
var timeLongFormatter = (pattern, formatLong2) => { |
| 20521 |
switch (pattern) { |
| 20522 |
case "p": |
| 20523 |
return formatLong2.time({ width: "short" }); |
| 20524 |
case "pp": |
| 20525 |
return formatLong2.time({ width: "medium" }); |
| 20526 |
case "ppp": |
| 20527 |
return formatLong2.time({ width: "long" }); |
| 20528 |
case "pppp": |
| 20529 |
default: |
| 20530 |
return formatLong2.time({ width: "full" }); |
| 20531 |
} |
| 20532 |
}; |
| 20533 |
var dateTimeLongFormatter = (pattern, formatLong2) => { |
| 20534 |
const matchResult = pattern.match(/(P+)(p+)?/) || []; |
| 20535 |
const datePattern = matchResult[1]; |
| 20536 |
const timePattern = matchResult[2]; |
| 20537 |
if (!timePattern) { |
| 20538 |
return dateLongFormatter(pattern, formatLong2); |
| 20539 |
} |
| 20540 |
let dateTimeFormat; |
| 20541 |
switch (datePattern) { |
| 20542 |
case "P": |
| 20543 |
dateTimeFormat = formatLong2.dateTime({ width: "short" }); |
| 20544 |
break; |
| 20545 |
case "PP": |
| 20546 |
dateTimeFormat = formatLong2.dateTime({ width: "medium" }); |
| 20547 |
break; |
| 20548 |
case "PPP": |
| 20549 |
dateTimeFormat = formatLong2.dateTime({ width: "long" }); |
| 20550 |
break; |
| 20551 |
case "PPPP": |
| 20552 |
default: |
| 20553 |
dateTimeFormat = formatLong2.dateTime({ width: "full" }); |
| 20554 |
break; |
| 20555 |
} |
| 20556 |
return dateTimeFormat.replace("{{date}}", dateLongFormatter(datePattern, formatLong2)).replace("{{time}}", timeLongFormatter(timePattern, formatLong2)); |
| 20557 |
}; |
| 20558 |
var longFormatters = { |
| 20559 |
p: timeLongFormatter, |
| 20560 |
P: dateTimeLongFormatter |
| 20561 |
}; |
| 20562 |
|
| 20563 |
// node_modules/date-fns/_lib/protectedTokens.js |
| 20564 |
var dayOfYearTokenRE = /^D+$/; |
| 20565 |
var weekYearTokenRE = /^Y+$/; |
| 20566 |
var throwTokens = ["D", "DD", "YY", "YYYY"]; |
| 20567 |
function isProtectedDayOfYearToken(token) { |
| 20568 |
return dayOfYearTokenRE.test(token); |
| 20569 |
} |
| 20570 |
function isProtectedWeekYearToken(token) { |
| 20571 |
return weekYearTokenRE.test(token); |
| 20572 |
} |
| 20573 |
function warnOrThrowProtectedError(token, format6, input) { |
| 20574 |
const _message = message(token, format6, input); |
| 20575 |
console.warn(_message); |
| 20576 |
if (throwTokens.includes(token)) throw new RangeError(_message); |
| 20577 |
} |
| 20578 |
function message(token, format6, input) { |
| 20579 |
const subject = token[0] === "Y" ? "years" : "days of the month"; |
| 20580 |
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`; |
| 20581 |
} |
| 20582 |
|
| 20583 |
// node_modules/date-fns/format.js |
| 20584 |
var formattingTokensRegExp = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g; |
| 20585 |
var longFormattingTokensRegExp = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g; |
| 20586 |
var escapedStringRegExp = /^'([^]*?)'?$/; |
| 20587 |
var doubleQuoteRegExp = /''/g; |
| 20588 |
var unescapedLatinCharacterRegExp = /[a-zA-Z]/; |
| 20589 |
function format(date, formatStr, options) { |
| 20590 |
const defaultOptions2 = getDefaultOptions(); |
| 20591 |
const locale = options?.locale ?? defaultOptions2.locale ?? enUS; |
| 20592 |
const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? defaultOptions2.firstWeekContainsDate ?? defaultOptions2.locale?.options?.firstWeekContainsDate ?? 1; |
| 20593 |
const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? defaultOptions2.weekStartsOn ?? defaultOptions2.locale?.options?.weekStartsOn ?? 0; |
| 20594 |
const originalDate = toDate(date, options?.in); |
| 20595 |
if (!isValid(originalDate)) { |
| 20596 |
throw new RangeError("Invalid time value"); |
| 20597 |
} |
| 20598 |
let parts = formatStr.match(longFormattingTokensRegExp).map((substring) => { |
| 20599 |
const firstCharacter = substring[0]; |
| 20600 |
if (firstCharacter === "p" || firstCharacter === "P") { |
| 20601 |
const longFormatter = longFormatters[firstCharacter]; |
| 20602 |
return longFormatter(substring, locale.formatLong); |
| 20603 |
} |
| 20604 |
return substring; |
| 20605 |
}).join("").match(formattingTokensRegExp).map((substring) => { |
| 20606 |
if (substring === "''") { |
| 20607 |
return { isToken: false, value: "'" }; |
| 20608 |
} |
| 20609 |
const firstCharacter = substring[0]; |
| 20610 |
if (firstCharacter === "'") { |
| 20611 |
return { isToken: false, value: cleanEscapedString(substring) }; |
| 20612 |
} |
| 20613 |
if (formatters[firstCharacter]) { |
| 20614 |
return { isToken: true, value: substring }; |
| 20615 |
} |
| 20616 |
if (firstCharacter.match(unescapedLatinCharacterRegExp)) { |
| 20617 |
throw new RangeError( |
| 20618 |
"Format string contains an unescaped latin alphabet character `" + firstCharacter + "`" |
| 20619 |
); |
| 20620 |
} |
| 20621 |
return { isToken: false, value: substring }; |
| 20622 |
}); |
| 20623 |
if (locale.localize.preprocessor) { |
| 20624 |
parts = locale.localize.preprocessor(originalDate, parts); |
| 20625 |
} |
| 20626 |
const formatterOptions = { |
| 20627 |
firstWeekContainsDate, |
| 20628 |
weekStartsOn, |
| 20629 |
locale |
| 20630 |
}; |
| 20631 |
return parts.map((part) => { |
| 20632 |
if (!part.isToken) return part.value; |
| 20633 |
const token = part.value; |
| 20634 |
if (!options?.useAdditionalWeekYearTokens && isProtectedWeekYearToken(token) || !options?.useAdditionalDayOfYearTokens && isProtectedDayOfYearToken(token)) { |
| 20635 |
warnOrThrowProtectedError(token, formatStr, String(date)); |
| 20636 |
} |
| 20637 |
const formatter = formatters[token[0]]; |
| 20638 |
return formatter(originalDate, token, locale.localize, formatterOptions); |
| 20639 |
}).join(""); |
| 20640 |
} |
| 20641 |
function cleanEscapedString(input) { |
| 20642 |
const matched = input.match(escapedStringRegExp); |
| 20643 |
if (!matched) { |
| 20644 |
return input; |
| 20645 |
} |
| 20646 |
return matched[1].replace(doubleQuoteRegExp, "'"); |
| 20647 |
} |
| 20648 |
|
| 20649 |
// node_modules/date-fns/subDays.js |
| 20650 |
function subDays(date, amount, options) { |
| 20651 |
return addDays(date, -amount, options); |
| 20652 |
} |
| 20653 |
|
| 20654 |
// node_modules/date-fns/subMonths.js |
| 20655 |
function subMonths(date, amount, options) { |
| 20656 |
return addMonths(date, -amount, options); |
| 20657 |
} |
| 20658 |
|
| 20659 |
// node_modules/date-fns/subWeeks.js |
| 20660 |
function subWeeks(date, amount, options) { |
| 20661 |
return addWeeks(date, -amount, options); |
| 20662 |
} |
| 20663 |
|
| 20664 |
// node_modules/date-fns/subYears.js |
| 20665 |
function subYears(date, amount, options) { |
| 20666 |
return addYears(date, -amount, options); |
| 20667 |
} |
| 20668 |
|
| 20669 |
// packages/dataviews/build-module/utils/operators.mjs |
| 20670 |
var import_i18n30 = __toESM(require_i18n(), 1); |
| 20671 |
var import_element44 = __toESM(require_element(), 1); |
| 20672 |
var import_date = __toESM(require_date(), 1); |
| 20673 |
var import_jsx_runtime81 = __toESM(require_jsx_runtime(), 1); |
| 20674 |
var filterTextWrappers = { |
| 20675 |
Name: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "dataviews-filters__summary-filter-text-name" }), |
| 20676 |
Value: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "dataviews-filters__summary-filter-text-value" }) |
| 20677 |
}; |
| 20678 |
function getRelativeDate(value, unit) { |
| 20679 |
switch (unit) { |
| 20680 |
case "days": |
| 20681 |
return subDays(/* @__PURE__ */ new Date(), value); |
| 20682 |
case "weeks": |
| 20683 |
return subWeeks(/* @__PURE__ */ new Date(), value); |
| 20684 |
case "months": |
| 20685 |
return subMonths(/* @__PURE__ */ new Date(), value); |
| 20686 |
case "years": |
| 20687 |
return subYears(/* @__PURE__ */ new Date(), value); |
| 20688 |
default: |
| 20689 |
return /* @__PURE__ */ new Date(); |
| 20690 |
} |
| 20691 |
} |
| 20692 |
var isNoneOperatorDefinition = { |
| 20693 |
/* translators: DataViews operator name */ |
| 20694 |
label: (0, import_i18n30.__)("Is none of"), |
| 20695 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20696 |
(0, import_i18n30.sprintf)( |
| 20697 |
/* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is none of: Admin, Editor". */ |
| 20698 |
(0, import_i18n30.__)("<Name>%1$s is none of: </Name><Value>%2$s</Value>"), |
| 20699 |
filter.name, |
| 20700 |
activeElements.map((element) => element.label).join(", ") |
| 20701 |
), |
| 20702 |
filterTextWrappers |
| 20703 |
), |
| 20704 |
filter: ((item, field, filterValue) => { |
| 20705 |
if (!filterValue?.length) { |
| 20706 |
return true; |
| 20707 |
} |
| 20708 |
const fieldValue = field.getValue({ item }); |
| 20709 |
if (Array.isArray(fieldValue)) { |
| 20710 |
return !filterValue.some( |
| 20711 |
(fv) => fieldValue.includes(fv) |
| 20712 |
); |
| 20713 |
} else if (typeof fieldValue === "string") { |
| 20714 |
return !filterValue.includes(fieldValue); |
| 20715 |
} |
| 20716 |
return false; |
| 20717 |
}), |
| 20718 |
selection: "multi" |
| 20719 |
}; |
| 20720 |
var OPERATORS = [ |
| 20721 |
{ |
| 20722 |
name: OPERATOR_IS_ANY, |
| 20723 |
/* translators: DataViews operator name */ |
| 20724 |
label: (0, import_i18n30.__)("Includes"), |
| 20725 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20726 |
(0, import_i18n30.sprintf)( |
| 20727 |
/* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is any: Admin, Editor". */ |
| 20728 |
(0, import_i18n30.__)("<Name>%1$s includes: </Name><Value>%2$s</Value>"), |
| 20729 |
filter.name, |
| 20730 |
activeElements.map((element) => element.label).join(", ") |
| 20731 |
), |
| 20732 |
filterTextWrappers |
| 20733 |
), |
| 20734 |
filter(item, field, filterValue) { |
| 20735 |
if (!filterValue?.length) { |
| 20736 |
return true; |
| 20737 |
} |
| 20738 |
const fieldValue = field.getValue({ item }); |
| 20739 |
if (Array.isArray(fieldValue)) { |
| 20740 |
return filterValue.some( |
| 20741 |
(fv) => fieldValue.includes(fv) |
| 20742 |
); |
| 20743 |
} else if (typeof fieldValue === "string") { |
| 20744 |
return filterValue.includes(fieldValue); |
| 20745 |
} |
| 20746 |
return false; |
| 20747 |
}, |
| 20748 |
selection: "multi" |
| 20749 |
}, |
| 20750 |
{ |
| 20751 |
name: OPERATOR_IS_NONE, |
| 20752 |
...isNoneOperatorDefinition |
| 20753 |
}, |
| 20754 |
{ |
| 20755 |
name: OPERATOR_IS_ALL, |
| 20756 |
/* translators: DataViews operator name */ |
| 20757 |
label: (0, import_i18n30.__)("Includes all"), |
| 20758 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20759 |
(0, import_i18n30.sprintf)( |
| 20760 |
/* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author includes all: Admin, Editor". */ |
| 20761 |
(0, import_i18n30.__)("<Name>%1$s includes all: </Name><Value>%2$s</Value>"), |
| 20762 |
filter.name, |
| 20763 |
activeElements.map((element) => element.label).join(", ") |
| 20764 |
), |
| 20765 |
filterTextWrappers |
| 20766 |
), |
| 20767 |
filter(item, field, filterValue) { |
| 20768 |
if (!filterValue?.length) { |
| 20769 |
return true; |
| 20770 |
} |
| 20771 |
return filterValue.every((value) => { |
| 20772 |
return field.getValue({ item })?.includes(value); |
| 20773 |
}); |
| 20774 |
}, |
| 20775 |
selection: "multi" |
| 20776 |
}, |
| 20777 |
{ |
| 20778 |
name: OPERATOR_IS_NOT_ALL, |
| 20779 |
...isNoneOperatorDefinition |
| 20780 |
}, |
| 20781 |
{ |
| 20782 |
name: OPERATOR_BETWEEN, |
| 20783 |
/* translators: DataViews operator name */ |
| 20784 |
label: (0, import_i18n30.__)("Between (inc)"), |
| 20785 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20786 |
(0, import_i18n30.sprintf)( |
| 20787 |
/* 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". */ |
| 20788 |
(0, import_i18n30.__)( |
| 20789 |
"<Name>%1$s between (inc): </Name><Value>%2$s and %3$s</Value>" |
| 20790 |
), |
| 20791 |
filter.name, |
| 20792 |
activeElements[0].label[0], |
| 20793 |
activeElements[0].label[1] |
| 20794 |
), |
| 20795 |
filterTextWrappers |
| 20796 |
), |
| 20797 |
filter(item, field, filterValue) { |
| 20798 |
if (!Array.isArray(filterValue) || filterValue.length !== 2 || filterValue[0] === void 0 || filterValue[1] === void 0) { |
| 20799 |
return true; |
| 20800 |
} |
| 20801 |
const fieldValue = field.getValue({ item }); |
| 20802 |
if (typeof fieldValue === "number" || fieldValue instanceof Date || typeof fieldValue === "string") { |
| 20803 |
return fieldValue >= filterValue[0] && fieldValue <= filterValue[1]; |
| 20804 |
} |
| 20805 |
return false; |
| 20806 |
}, |
| 20807 |
selection: "custom" |
| 20808 |
}, |
| 20809 |
{ |
| 20810 |
name: OPERATOR_IN_THE_PAST, |
| 20811 |
/* translators: DataViews operator name */ |
| 20812 |
label: (0, import_i18n30.__)("In the past"), |
| 20813 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20814 |
(0, import_i18n30.sprintf)( |
| 20815 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "7 days"): "Date is in the past: 7 days". */ |
| 20816 |
(0, import_i18n30.__)( |
| 20817 |
"<Name>%1$s is in the past: </Name><Value>%2$s</Value>" |
| 20818 |
), |
| 20819 |
filter.name, |
| 20820 |
`${activeElements[0].value.value} ${activeElements[0].value.unit}` |
| 20821 |
), |
| 20822 |
filterTextWrappers |
| 20823 |
), |
| 20824 |
filter(item, field, filterValue) { |
| 20825 |
if (filterValue?.value === void 0 || filterValue?.unit === void 0) { |
| 20826 |
return true; |
| 20827 |
} |
| 20828 |
const targetDate = getRelativeDate( |
| 20829 |
filterValue.value, |
| 20830 |
filterValue.unit |
| 20831 |
); |
| 20832 |
const fieldValue = (0, import_date.getDate)(field.getValue({ item })); |
| 20833 |
return fieldValue >= targetDate && fieldValue <= /* @__PURE__ */ new Date(); |
| 20834 |
}, |
| 20835 |
selection: "custom" |
| 20836 |
}, |
| 20837 |
{ |
| 20838 |
name: OPERATOR_OVER, |
| 20839 |
/* translators: DataViews operator name */ |
| 20840 |
label: (0, import_i18n30.__)("Over"), |
| 20841 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20842 |
(0, import_i18n30.sprintf)( |
| 20843 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "7 days"): "Date is over: 7 days". */ |
| 20844 |
(0, import_i18n30.__)("<Name>%1$s is over: </Name><Value>%2$s</Value>"), |
| 20845 |
filter.name, |
| 20846 |
`${activeElements[0].value.value} ${activeElements[0].value.unit}` |
| 20847 |
), |
| 20848 |
filterTextWrappers |
| 20849 |
), |
| 20850 |
filter(item, field, filterValue) { |
| 20851 |
if (filterValue?.value === void 0 || filterValue?.unit === void 0) { |
| 20852 |
return true; |
| 20853 |
} |
| 20854 |
const targetDate = getRelativeDate( |
| 20855 |
filterValue.value, |
| 20856 |
filterValue.unit |
| 20857 |
); |
| 20858 |
const fieldValue = (0, import_date.getDate)(field.getValue({ item })); |
| 20859 |
return fieldValue < targetDate; |
| 20860 |
}, |
| 20861 |
selection: "custom" |
| 20862 |
}, |
| 20863 |
{ |
| 20864 |
name: OPERATOR_IS, |
| 20865 |
/* translators: DataViews operator name */ |
| 20866 |
label: (0, import_i18n30.__)("Is"), |
| 20867 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20868 |
(0, import_i18n30.sprintf)( |
| 20869 |
/* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is: Admin". */ |
| 20870 |
(0, import_i18n30.__)("<Name>%1$s is: </Name><Value>%2$s</Value>"), |
| 20871 |
filter.name, |
| 20872 |
activeElements[0].label |
| 20873 |
), |
| 20874 |
filterTextWrappers |
| 20875 |
), |
| 20876 |
filter(item, field, filterValue) { |
| 20877 |
return filterValue === field.getValue({ item }) || filterValue === void 0; |
| 20878 |
}, |
| 20879 |
selection: "single" |
| 20880 |
}, |
| 20881 |
{ |
| 20882 |
name: OPERATOR_IS_NOT, |
| 20883 |
/* translators: DataViews operator name */ |
| 20884 |
label: (0, import_i18n30.__)("Is not"), |
| 20885 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20886 |
(0, import_i18n30.sprintf)( |
| 20887 |
/* translators: 1: Filter name (e.g. "Author"). 2: Filter value (e.g. "Admin"): "Author is not: Admin". */ |
| 20888 |
(0, import_i18n30.__)("<Name>%1$s is not: </Name><Value>%2$s</Value>"), |
| 20889 |
filter.name, |
| 20890 |
activeElements[0].label |
| 20891 |
), |
| 20892 |
filterTextWrappers |
| 20893 |
), |
| 20894 |
filter(item, field, filterValue) { |
| 20895 |
return filterValue !== field.getValue({ item }); |
| 20896 |
}, |
| 20897 |
selection: "single" |
| 20898 |
}, |
| 20899 |
{ |
| 20900 |
name: OPERATOR_LESS_THAN, |
| 20901 |
/* translators: DataViews operator name */ |
| 20902 |
label: (0, import_i18n30.__)("Less than"), |
| 20903 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20904 |
(0, import_i18n30.sprintf)( |
| 20905 |
/* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is less than: 10". */ |
| 20906 |
(0, import_i18n30.__)("<Name>%1$s is less than: </Name><Value>%2$s</Value>"), |
| 20907 |
filter.name, |
| 20908 |
activeElements[0].label |
| 20909 |
), |
| 20910 |
filterTextWrappers |
| 20911 |
), |
| 20912 |
filter(item, field, filterValue) { |
| 20913 |
if (filterValue === void 0) { |
| 20914 |
return true; |
| 20915 |
} |
| 20916 |
const fieldValue = field.getValue({ item }); |
| 20917 |
return fieldValue < filterValue; |
| 20918 |
}, |
| 20919 |
selection: "single" |
| 20920 |
}, |
| 20921 |
{ |
| 20922 |
name: OPERATOR_GREATER_THAN, |
| 20923 |
/* translators: DataViews operator name */ |
| 20924 |
label: (0, import_i18n30.__)("Greater than"), |
| 20925 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20926 |
(0, import_i18n30.sprintf)( |
| 20927 |
/* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is greater than: 10". */ |
| 20928 |
(0, import_i18n30.__)( |
| 20929 |
"<Name>%1$s is greater than: </Name><Value>%2$s</Value>" |
| 20930 |
), |
| 20931 |
filter.name, |
| 20932 |
activeElements[0].label |
| 20933 |
), |
| 20934 |
filterTextWrappers |
| 20935 |
), |
| 20936 |
filter(item, field, filterValue) { |
| 20937 |
if (filterValue === void 0) { |
| 20938 |
return true; |
| 20939 |
} |
| 20940 |
const fieldValue = field.getValue({ item }); |
| 20941 |
return fieldValue > filterValue; |
| 20942 |
}, |
| 20943 |
selection: "single" |
| 20944 |
}, |
| 20945 |
{ |
| 20946 |
name: OPERATOR_LESS_THAN_OR_EQUAL, |
| 20947 |
/* translators: DataViews operator name */ |
| 20948 |
label: (0, import_i18n30.__)("Less than or equal"), |
| 20949 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20950 |
(0, import_i18n30.sprintf)( |
| 20951 |
/* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is less than or equal to: 10". */ |
| 20952 |
(0, import_i18n30.__)( |
| 20953 |
"<Name>%1$s is less than or equal to: </Name><Value>%2$s</Value>" |
| 20954 |
), |
| 20955 |
filter.name, |
| 20956 |
activeElements[0].label |
| 20957 |
), |
| 20958 |
filterTextWrappers |
| 20959 |
), |
| 20960 |
filter(item, field, filterValue) { |
| 20961 |
if (filterValue === void 0) { |
| 20962 |
return true; |
| 20963 |
} |
| 20964 |
const fieldValue = field.getValue({ item }); |
| 20965 |
return fieldValue <= filterValue; |
| 20966 |
}, |
| 20967 |
selection: "single" |
| 20968 |
}, |
| 20969 |
{ |
| 20970 |
name: OPERATOR_GREATER_THAN_OR_EQUAL, |
| 20971 |
/* translators: DataViews operator name */ |
| 20972 |
label: (0, import_i18n30.__)("Greater than or equal"), |
| 20973 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20974 |
(0, import_i18n30.sprintf)( |
| 20975 |
/* translators: 1: Filter name (e.g. "Count"). 2: Filter value (e.g. "10"): "Count is greater than or equal to: 10". */ |
| 20976 |
(0, import_i18n30.__)( |
| 20977 |
"<Name>%1$s is greater than or equal to: </Name><Value>%2$s</Value>" |
| 20978 |
), |
| 20979 |
filter.name, |
| 20980 |
activeElements[0].label |
| 20981 |
), |
| 20982 |
filterTextWrappers |
| 20983 |
), |
| 20984 |
filter(item, field, filterValue) { |
| 20985 |
if (filterValue === void 0) { |
| 20986 |
return true; |
| 20987 |
} |
| 20988 |
const fieldValue = field.getValue({ item }); |
| 20989 |
return fieldValue >= filterValue; |
| 20990 |
}, |
| 20991 |
selection: "single" |
| 20992 |
}, |
| 20993 |
{ |
| 20994 |
name: OPERATOR_BEFORE, |
| 20995 |
/* translators: DataViews operator name */ |
| 20996 |
label: (0, import_i18n30.__)("Before"), |
| 20997 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 20998 |
(0, import_i18n30.sprintf)( |
| 20999 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is before: 2024-01-01". */ |
| 21000 |
(0, import_i18n30.__)("<Name>%1$s is before: </Name><Value>%2$s</Value>"), |
| 21001 |
filter.name, |
| 21002 |
activeElements[0].label |
| 21003 |
), |
| 21004 |
filterTextWrappers |
| 21005 |
), |
| 21006 |
filter(item, field, filterValue) { |
| 21007 |
if (filterValue === void 0) { |
| 21008 |
return true; |
| 21009 |
} |
| 21010 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21011 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21012 |
return fieldDate < filterDate; |
| 21013 |
}, |
| 21014 |
selection: "single" |
| 21015 |
}, |
| 21016 |
{ |
| 21017 |
name: OPERATOR_AFTER, |
| 21018 |
/* translators: DataViews operator name */ |
| 21019 |
label: (0, import_i18n30.__)("After"), |
| 21020 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21021 |
(0, import_i18n30.sprintf)( |
| 21022 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is after: 2024-01-01". */ |
| 21023 |
(0, import_i18n30.__)("<Name>%1$s is after: </Name><Value>%2$s</Value>"), |
| 21024 |
filter.name, |
| 21025 |
activeElements[0].label |
| 21026 |
), |
| 21027 |
filterTextWrappers |
| 21028 |
), |
| 21029 |
filter(item, field, filterValue) { |
| 21030 |
if (filterValue === void 0) { |
| 21031 |
return true; |
| 21032 |
} |
| 21033 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21034 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21035 |
return fieldDate > filterDate; |
| 21036 |
}, |
| 21037 |
selection: "single" |
| 21038 |
}, |
| 21039 |
{ |
| 21040 |
name: OPERATOR_BEFORE_INC, |
| 21041 |
/* translators: DataViews operator name */ |
| 21042 |
label: (0, import_i18n30.__)("Before (inc)"), |
| 21043 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21044 |
(0, import_i18n30.sprintf)( |
| 21045 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is on or before: 2024-01-01". */ |
| 21046 |
(0, import_i18n30.__)( |
| 21047 |
"<Name>%1$s is on or before: </Name><Value>%2$s</Value>" |
| 21048 |
), |
| 21049 |
filter.name, |
| 21050 |
activeElements[0].label |
| 21051 |
), |
| 21052 |
filterTextWrappers |
| 21053 |
), |
| 21054 |
filter(item, field, filterValue) { |
| 21055 |
if (filterValue === void 0) { |
| 21056 |
return true; |
| 21057 |
} |
| 21058 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21059 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21060 |
return fieldDate <= filterDate; |
| 21061 |
}, |
| 21062 |
selection: "single" |
| 21063 |
}, |
| 21064 |
{ |
| 21065 |
name: OPERATOR_AFTER_INC, |
| 21066 |
/* translators: DataViews operator name */ |
| 21067 |
label: (0, import_i18n30.__)("After (inc)"), |
| 21068 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21069 |
(0, import_i18n30.sprintf)( |
| 21070 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is on or after: 2024-01-01". */ |
| 21071 |
(0, import_i18n30.__)( |
| 21072 |
"<Name>%1$s is on or after: </Name><Value>%2$s</Value>" |
| 21073 |
), |
| 21074 |
filter.name, |
| 21075 |
activeElements[0].label |
| 21076 |
), |
| 21077 |
filterTextWrappers |
| 21078 |
), |
| 21079 |
filter(item, field, filterValue) { |
| 21080 |
if (filterValue === void 0) { |
| 21081 |
return true; |
| 21082 |
} |
| 21083 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21084 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21085 |
return fieldDate >= filterDate; |
| 21086 |
}, |
| 21087 |
selection: "single" |
| 21088 |
}, |
| 21089 |
{ |
| 21090 |
name: OPERATOR_CONTAINS, |
| 21091 |
/* translators: DataViews operator name */ |
| 21092 |
label: (0, import_i18n30.__)("Contains"), |
| 21093 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21094 |
(0, import_i18n30.sprintf)( |
| 21095 |
/* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title contains: Hello". */ |
| 21096 |
(0, import_i18n30.__)("<Name>%1$s contains: </Name><Value>%2$s</Value>"), |
| 21097 |
filter.name, |
| 21098 |
activeElements[0].label |
| 21099 |
), |
| 21100 |
filterTextWrappers |
| 21101 |
), |
| 21102 |
filter(item, field, filterValue) { |
| 21103 |
if (filterValue === void 0) { |
| 21104 |
return true; |
| 21105 |
} |
| 21106 |
const fieldValue = field.getValue({ item }); |
| 21107 |
return typeof fieldValue === "string" && filterValue && fieldValue.toLowerCase().includes(String(filterValue).toLowerCase()); |
| 21108 |
}, |
| 21109 |
selection: "single" |
| 21110 |
}, |
| 21111 |
{ |
| 21112 |
name: OPERATOR_NOT_CONTAINS, |
| 21113 |
/* translators: DataViews operator name */ |
| 21114 |
label: (0, import_i18n30.__)("Doesn't contain"), |
| 21115 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21116 |
(0, import_i18n30.sprintf)( |
| 21117 |
/* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title doesn't contain: Hello". */ |
| 21118 |
(0, import_i18n30.__)( |
| 21119 |
"<Name>%1$s doesn't contain: </Name><Value>%2$s</Value>" |
| 21120 |
), |
| 21121 |
filter.name, |
| 21122 |
activeElements[0].label |
| 21123 |
), |
| 21124 |
filterTextWrappers |
| 21125 |
), |
| 21126 |
filter(item, field, filterValue) { |
| 21127 |
if (filterValue === void 0) { |
| 21128 |
return true; |
| 21129 |
} |
| 21130 |
const fieldValue = field.getValue({ item }); |
| 21131 |
return typeof fieldValue === "string" && filterValue && !fieldValue.toLowerCase().includes(String(filterValue).toLowerCase()); |
| 21132 |
}, |
| 21133 |
selection: "single" |
| 21134 |
}, |
| 21135 |
{ |
| 21136 |
name: OPERATOR_STARTS_WITH, |
| 21137 |
/* translators: DataViews operator name */ |
| 21138 |
label: (0, import_i18n30.__)("Starts with"), |
| 21139 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21140 |
(0, import_i18n30.sprintf)( |
| 21141 |
/* translators: 1: Filter name (e.g. "Title"). 2: Filter value (e.g. "Hello"): "Title starts with: Hello". */ |
| 21142 |
(0, import_i18n30.__)("<Name>%1$s starts with: </Name><Value>%2$s</Value>"), |
| 21143 |
filter.name, |
| 21144 |
activeElements[0].label |
| 21145 |
), |
| 21146 |
filterTextWrappers |
| 21147 |
), |
| 21148 |
filter(item, field, filterValue) { |
| 21149 |
if (filterValue === void 0) { |
| 21150 |
return true; |
| 21151 |
} |
| 21152 |
const fieldValue = field.getValue({ item }); |
| 21153 |
return typeof fieldValue === "string" && filterValue && fieldValue.toLowerCase().startsWith(String(filterValue).toLowerCase()); |
| 21154 |
}, |
| 21155 |
selection: "single" |
| 21156 |
}, |
| 21157 |
{ |
| 21158 |
name: OPERATOR_ON, |
| 21159 |
/* translators: DataViews operator name */ |
| 21160 |
label: (0, import_i18n30.__)("On"), |
| 21161 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21162 |
(0, import_i18n30.sprintf)( |
| 21163 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is: 2024-01-01". */ |
| 21164 |
(0, import_i18n30.__)("<Name>%1$s is: </Name><Value>%2$s</Value>"), |
| 21165 |
filter.name, |
| 21166 |
activeElements[0].label |
| 21167 |
), |
| 21168 |
filterTextWrappers |
| 21169 |
), |
| 21170 |
filter(item, field, filterValue) { |
| 21171 |
if (filterValue === void 0) { |
| 21172 |
return true; |
| 21173 |
} |
| 21174 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21175 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21176 |
return filterDate.getTime() === fieldDate.getTime(); |
| 21177 |
}, |
| 21178 |
selection: "single" |
| 21179 |
}, |
| 21180 |
{ |
| 21181 |
name: OPERATOR_NOT_ON, |
| 21182 |
/* translators: DataViews operator name */ |
| 21183 |
label: (0, import_i18n30.__)("Not on"), |
| 21184 |
filterText: (filter, activeElements) => (0, import_element44.createInterpolateElement)( |
| 21185 |
(0, import_i18n30.sprintf)( |
| 21186 |
/* translators: 1: Filter name (e.g. "Date"). 2: Filter value (e.g. "2024-01-01"): "Date is not: 2024-01-01". */ |
| 21187 |
(0, import_i18n30.__)("<Name>%1$s is not: </Name><Value>%2$s</Value>"), |
| 21188 |
filter.name, |
| 21189 |
activeElements[0].label |
| 21190 |
), |
| 21191 |
filterTextWrappers |
| 21192 |
), |
| 21193 |
filter(item, field, filterValue) { |
| 21194 |
if (filterValue === void 0) { |
| 21195 |
return true; |
| 21196 |
} |
| 21197 |
const filterDate = (0, import_date.getDate)(filterValue); |
| 21198 |
const fieldDate = (0, import_date.getDate)(field.getValue({ item })); |
| 21199 |
return filterDate.getTime() !== fieldDate.getTime(); |
| 21200 |
}, |
| 21201 |
selection: "single" |
| 21202 |
} |
| 21203 |
]; |
| 21204 |
var getOperatorByName = (name) => OPERATORS.find((op) => op.name === name); |
| 21205 |
var getAllOperatorNames = () => OPERATORS.map((op) => op.name); |
| 21206 |
var isSingleSelectionOperator = (name) => OPERATORS.filter((op) => op.selection === "single").some( |
| 21207 |
(op) => op.name === name |
| 21208 |
); |
| 21209 |
var isRegisteredOperator = (name) => OPERATORS.some((op) => op.name === name); |
| 21210 |
|
| 21211 |
// packages/dataviews/build-module/components/dataviews-filters/filter.mjs |
| 21212 |
var import_jsx_runtime82 = __toESM(require_jsx_runtime(), 1); |
| 21213 |
var ENTER = "Enter"; |
| 21214 |
var SPACE = " "; |
| 21215 |
var FilterText = ({ |
| 21216 |
activeElements, |
| 21217 |
filterInView, |
| 21218 |
filter |
| 21219 |
}) => { |
| 21220 |
if (activeElements === void 0 || activeElements.length === 0) { |
| 21221 |
return filter.name; |
| 21222 |
} |
| 21223 |
const operator = getOperatorByName(filterInView?.operator); |
| 21224 |
if (operator !== void 0) { |
| 21225 |
return operator.filterText(filter, activeElements); |
| 21226 |
} |
| 21227 |
return (0, import_i18n31.sprintf)( |
| 21228 |
/* translators: 1: Filter name e.g.: "Unknown status for Author". */ |
| 21229 |
(0, import_i18n31.__)("Unknown status for %1$s"), |
| 21230 |
filter.name |
| 21231 |
); |
| 21232 |
}; |
| 21233 |
function OperatorSelector({ |
| 21234 |
filter, |
| 21235 |
view, |
| 21236 |
onChangeView |
| 21237 |
}) { |
| 21238 |
const operatorOptions = filter.operators?.map((operator) => ({ |
| 21239 |
value: operator, |
| 21240 |
label: getOperatorByName(operator)?.label || operator |
| 21241 |
})); |
| 21242 |
const currentFilter = view.filters?.find( |
| 21243 |
(_filter) => _filter.field === filter.field |
| 21244 |
); |
| 21245 |
const value = currentFilter?.operator || filter.operators[0]; |
| 21246 |
return operatorOptions.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)( |
| 21247 |
Stack, |
| 21248 |
{ |
| 21249 |
direction: "row", |
| 21250 |
gap: "sm", |
| 21251 |
justify: "flex-start", |
| 21252 |
className: "dataviews-filters__summary-operators-container", |
| 21253 |
align: "center", |
| 21254 |
children: [ |
| 21255 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_components21.FlexItem, { className: "dataviews-filters__summary-operators-filter-name", children: filter.name }), |
| 21256 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21257 |
import_components21.SelectControl, |
| 21258 |
{ |
| 21259 |
className: "dataviews-filters__summary-operators-filter-select", |
| 21260 |
label: (0, import_i18n31.__)("Conditions"), |
| 21261 |
value, |
| 21262 |
options: operatorOptions, |
| 21263 |
onChange: (newValue) => { |
| 21264 |
const newOperator = newValue; |
| 21265 |
const currentOperator = currentFilter?.operator; |
| 21266 |
const newFilters = currentFilter ? [ |
| 21267 |
...(view.filters ?? []).map( |
| 21268 |
(_filter) => { |
| 21269 |
if (_filter.field === filter.field) { |
| 21270 |
const currentOpSelectionModel = getOperatorByName( |
| 21271 |
currentOperator |
| 21272 |
)?.selection; |
| 21273 |
const newOpSelectionModel = getOperatorByName( |
| 21274 |
newOperator |
| 21275 |
)?.selection; |
| 21276 |
const shouldResetValue = currentOpSelectionModel !== newOpSelectionModel || [ |
| 21277 |
currentOpSelectionModel, |
| 21278 |
newOpSelectionModel |
| 21279 |
].includes("custom"); |
| 21280 |
return { |
| 21281 |
..._filter, |
| 21282 |
value: shouldResetValue ? void 0 : _filter.value, |
| 21283 |
operator: newOperator |
| 21284 |
}; |
| 21285 |
} |
| 21286 |
return _filter; |
| 21287 |
} |
| 21288 |
) |
| 21289 |
] : [ |
| 21290 |
...view.filters ?? [], |
| 21291 |
{ |
| 21292 |
field: filter.field, |
| 21293 |
operator: newOperator, |
| 21294 |
value: void 0 |
| 21295 |
} |
| 21296 |
]; |
| 21297 |
onChangeView({ |
| 21298 |
...view, |
| 21299 |
page: 1, |
| 21300 |
filters: newFilters |
| 21301 |
}); |
| 21302 |
}, |
| 21303 |
size: "small", |
| 21304 |
variant: "minimal", |
| 21305 |
hideLabelFromVision: true |
| 21306 |
} |
| 21307 |
) |
| 21308 |
] |
| 21309 |
} |
| 21310 |
); |
| 21311 |
} |
| 21312 |
function Filter({ |
| 21313 |
addFilterRef, |
| 21314 |
openedFilter, |
| 21315 |
fields, |
| 21316 |
...commonProps |
| 21317 |
}) { |
| 21318 |
const toggleRef = (0, import_element45.useRef)(null); |
| 21319 |
const { filter, view, onChangeView } = commonProps; |
| 21320 |
const filterInView = view.filters?.find( |
| 21321 |
(f2) => f2.field === filter.field |
| 21322 |
); |
| 21323 |
let activeElements = []; |
| 21324 |
const field = (0, import_element45.useMemo)(() => { |
| 21325 |
const currentField = fields.find((f2) => f2.id === filter.field); |
| 21326 |
if (currentField) { |
| 21327 |
return { |
| 21328 |
...currentField, |
| 21329 |
// Configure getValue as if Item was a plain object. |
| 21330 |
// See related input-widget.tsx |
| 21331 |
getValue: ({ item }) => item[currentField.id] |
| 21332 |
}; |
| 21333 |
} |
| 21334 |
return currentField; |
| 21335 |
}, [fields, filter.field]); |
| 21336 |
const { elements } = useElements({ |
| 21337 |
elements: filter.elements, |
| 21338 |
getElements: filter.getElements |
| 21339 |
}); |
| 21340 |
if (elements.length > 0) { |
| 21341 |
activeElements = elements.filter((element) => { |
| 21342 |
if (filter.singleSelection) { |
| 21343 |
return element.value === filterInView?.value; |
| 21344 |
} |
| 21345 |
return filterInView?.value?.includes(element.value); |
| 21346 |
}); |
| 21347 |
} else if (Array.isArray(filterInView?.value)) { |
| 21348 |
const label = filterInView.value.map((v2) => { |
| 21349 |
const formattedValue = field?.getValueFormatted({ |
| 21350 |
item: { [field.id]: v2 }, |
| 21351 |
field |
| 21352 |
}); |
| 21353 |
return formattedValue || String(v2); |
| 21354 |
}); |
| 21355 |
activeElements = [ |
| 21356 |
{ |
| 21357 |
value: filterInView.value, |
| 21358 |
// @ts-ignore |
| 21359 |
label |
| 21360 |
} |
| 21361 |
]; |
| 21362 |
} else if (typeof filterInView?.value === "object") { |
| 21363 |
activeElements = [ |
| 21364 |
{ value: filterInView.value, label: filterInView.value } |
| 21365 |
]; |
| 21366 |
} else if (filterInView?.value !== void 0) { |
| 21367 |
const label = field !== void 0 ? field.getValueFormatted({ |
| 21368 |
item: { [field.id]: filterInView.value }, |
| 21369 |
field |
| 21370 |
}) : String(filterInView.value); |
| 21371 |
activeElements = [ |
| 21372 |
{ |
| 21373 |
value: filterInView.value, |
| 21374 |
label |
| 21375 |
} |
| 21376 |
]; |
| 21377 |
} |
| 21378 |
const isPrimary = filter.isPrimary; |
| 21379 |
const isLocked = filterInView?.isLocked; |
| 21380 |
const hasValues = !isLocked && filterInView?.value !== void 0; |
| 21381 |
const canResetOrRemove = !isLocked && (!isPrimary || hasValues); |
| 21382 |
const resetOrRemoveLabel = isPrimary ? (0, import_i18n31.__)("Reset") : (0, import_i18n31.__)("Remove"); |
| 21383 |
return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21384 |
import_components21.Dropdown, |
| 21385 |
{ |
| 21386 |
defaultOpen: openedFilter === filter.field, |
| 21387 |
contentClassName: "dataviews-filters__summary-popover", |
| 21388 |
popoverProps: { placement: "bottom-start", role: "dialog" }, |
| 21389 |
onClose: () => { |
| 21390 |
toggleRef.current?.focus(); |
| 21391 |
}, |
| 21392 |
renderToggle: ({ isOpen, onToggle }) => /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "dataviews-filters__summary-chip-container", children: [ |
| 21393 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(tooltip_exports.Root, { children: [ |
| 21394 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21395 |
tooltip_exports.Trigger, |
| 21396 |
{ |
| 21397 |
render: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21398 |
"div", |
| 21399 |
{ |
| 21400 |
className: clsx_default( |
| 21401 |
"dataviews-filters__summary-chip", |
| 21402 |
{ |
| 21403 |
"has-reset": canResetOrRemove, |
| 21404 |
"has-values": hasValues, |
| 21405 |
"is-not-clickable": isLocked |
| 21406 |
} |
| 21407 |
), |
| 21408 |
role: "button", |
| 21409 |
tabIndex: isLocked ? -1 : 0, |
| 21410 |
onClick: () => { |
| 21411 |
if (!isLocked) { |
| 21412 |
onToggle(); |
| 21413 |
} |
| 21414 |
}, |
| 21415 |
onKeyDown: (event) => { |
| 21416 |
if (!isLocked && [ENTER, SPACE].includes( |
| 21417 |
event.key |
| 21418 |
)) { |
| 21419 |
onToggle(); |
| 21420 |
event.preventDefault(); |
| 21421 |
} |
| 21422 |
}, |
| 21423 |
"aria-disabled": isLocked, |
| 21424 |
"aria-pressed": isOpen, |
| 21425 |
"aria-expanded": isOpen, |
| 21426 |
ref: toggleRef, |
| 21427 |
children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21428 |
FilterText, |
| 21429 |
{ |
| 21430 |
activeElements, |
| 21431 |
filterInView, |
| 21432 |
filter |
| 21433 |
} |
| 21434 |
) |
| 21435 |
} |
| 21436 |
) |
| 21437 |
} |
| 21438 |
), |
| 21439 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(tooltip_exports.Popup, { children: (0, import_i18n31.sprintf)( |
| 21440 |
/* translators: 1: Filter name. */ |
| 21441 |
(0, import_i18n31.__)("Filter by: %1$s"), |
| 21442 |
filter.name.toLowerCase() |
| 21443 |
) }) |
| 21444 |
] }), |
| 21445 |
canResetOrRemove && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(tooltip_exports.Root, { children: [ |
| 21446 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21447 |
tooltip_exports.Trigger, |
| 21448 |
{ |
| 21449 |
render: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21450 |
"button", |
| 21451 |
{ |
| 21452 |
className: clsx_default( |
| 21453 |
"dataviews-filters__summary-chip-remove", |
| 21454 |
{ "has-values": hasValues } |
| 21455 |
), |
| 21456 |
"aria-label": resetOrRemoveLabel, |
| 21457 |
onClick: () => { |
| 21458 |
onChangeView({ |
| 21459 |
...view, |
| 21460 |
page: 1, |
| 21461 |
filters: view.filters?.filter( |
| 21462 |
(_filter) => _filter.field !== filter.field |
| 21463 |
) |
| 21464 |
}); |
| 21465 |
if (!isPrimary) { |
| 21466 |
addFilterRef.current?.focus(); |
| 21467 |
} else { |
| 21468 |
toggleRef.current?.focus(); |
| 21469 |
} |
| 21470 |
}, |
| 21471 |
children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_components21.Icon, { icon: close_small_default }) |
| 21472 |
} |
| 21473 |
) |
| 21474 |
} |
| 21475 |
), |
| 21476 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(tooltip_exports.Popup, { children: resetOrRemoveLabel }) |
| 21477 |
] }) |
| 21478 |
] }), |
| 21479 |
renderContent: () => { |
| 21480 |
return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(Stack, { direction: "column", justify: "flex-start", children: [ |
| 21481 |
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)(OperatorSelector, { ...commonProps }), |
| 21482 |
commonProps.filter.hasElements ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)( |
| 21483 |
SearchWidget, |
| 21484 |
{ |
| 21485 |
...commonProps, |
| 21486 |
filter: { |
| 21487 |
...commonProps.filter, |
| 21488 |
elements |
| 21489 |
} |
| 21490 |
} |
| 21491 |
) : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(InputWidget, { ...commonProps, fields }) |
| 21492 |
] }); |
| 21493 |
} |
| 21494 |
} |
| 21495 |
); |
| 21496 |
} |
| 21497 |
|
| 21498 |
// packages/dataviews/build-module/components/dataviews-filters/add-filter.mjs |
| 21499 |
var import_components22 = __toESM(require_components(), 1); |
| 21500 |
var import_i18n32 = __toESM(require_i18n(), 1); |
| 21501 |
var import_element46 = __toESM(require_element(), 1); |
| 21502 |
var import_jsx_runtime83 = __toESM(require_jsx_runtime(), 1); |
| 21503 |
var { Menu: Menu4 } = unlock2(import_components22.privateApis); |
| 21504 |
function AddFilterMenu({ |
| 21505 |
filters, |
| 21506 |
view, |
| 21507 |
onChangeView, |
| 21508 |
setOpenedFilter, |
| 21509 |
triggerProps |
| 21510 |
}) { |
| 21511 |
const inactiveFilters = filters.filter((filter) => !filter.isVisible); |
| 21512 |
return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(Menu4, { children: [ |
| 21513 |
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Menu4.TriggerButton, { ...triggerProps }), |
| 21514 |
/* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Menu4.Popover, { children: inactiveFilters.map((filter) => { |
| 21515 |
return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( |
| 21516 |
Menu4.Item, |
| 21517 |
{ |
| 21518 |
onClick: () => { |
| 21519 |
setOpenedFilter(filter.field); |
| 21520 |
onChangeView({ |
| 21521 |
...view, |
| 21522 |
page: 1, |
| 21523 |
filters: [ |
| 21524 |
...view.filters || [], |
| 21525 |
{ |
| 21526 |
field: filter.field, |
| 21527 |
value: void 0, |
| 21528 |
operator: filter.operators[0] |
| 21529 |
} |
| 21530 |
] |
| 21531 |
}); |
| 21532 |
}, |
| 21533 |
children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Menu4.ItemLabel, { children: filter.name }) |
| 21534 |
}, |
| 21535 |
filter.field |
| 21536 |
); |
| 21537 |
}) }) |
| 21538 |
] }); |
| 21539 |
} |
| 21540 |
function AddFilter({ filters, view, onChangeView, setOpenedFilter }, ref) { |
| 21541 |
if (!filters.length || filters.every(({ isPrimary }) => isPrimary)) { |
| 21542 |
return null; |
| 21543 |
} |
| 21544 |
const inactiveFilters = filters.filter((filter) => !filter.isVisible); |
| 21545 |
return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( |
| 21546 |
AddFilterMenu, |
| 21547 |
{ |
| 21548 |
triggerProps: { |
| 21549 |
render: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)( |
| 21550 |
import_components22.Button, |
| 21551 |
{ |
| 21552 |
accessibleWhenDisabled: true, |
| 21553 |
size: "compact", |
| 21554 |
className: "dataviews-filters-button", |
| 21555 |
variant: "tertiary", |
| 21556 |
disabled: !inactiveFilters.length, |
| 21557 |
ref |
| 21558 |
} |
| 21559 |
), |
| 21560 |
children: (0, import_i18n32.__)("Add filter") |
| 21561 |
}, |
| 21562 |
...{ filters, view, onChangeView, setOpenedFilter } |
| 21563 |
} |
| 21564 |
); |
| 21565 |
} |
| 21566 |
var add_filter_default = (0, import_element46.forwardRef)(AddFilter); |
| 21567 |
|
| 21568 |
// packages/dataviews/build-module/components/dataviews-filters/reset-filters.mjs |
| 21569 |
var import_components23 = __toESM(require_components(), 1); |
| 21570 |
var import_i18n33 = __toESM(require_i18n(), 1); |
| 21571 |
var import_jsx_runtime84 = __toESM(require_jsx_runtime(), 1); |
| 21572 |
function ResetFilter({ |
| 21573 |
filters, |
| 21574 |
view, |
| 21575 |
onChangeView |
| 21576 |
}) { |
| 21577 |
const isPrimary = (field) => filters.some( |
| 21578 |
(_filter) => _filter.field === field && _filter.isPrimary |
| 21579 |
); |
| 21580 |
const isDisabled = !view.search && !view.filters?.some( |
| 21581 |
(_filter) => !_filter.isLocked && (_filter.value !== void 0 || !isPrimary(_filter.field)) |
| 21582 |
); |
| 21583 |
return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)( |
| 21584 |
import_components23.Button, |
| 21585 |
{ |
| 21586 |
disabled: isDisabled, |
| 21587 |
accessibleWhenDisabled: true, |
| 21588 |
size: "compact", |
| 21589 |
variant: "tertiary", |
| 21590 |
className: "dataviews-filters__reset-button", |
| 21591 |
onClick: () => { |
| 21592 |
onChangeView({ |
| 21593 |
...view, |
| 21594 |
page: 1, |
| 21595 |
search: "", |
| 21596 |
filters: view.filters?.filter((f2) => !!f2.isLocked) || [] |
| 21597 |
}); |
| 21598 |
}, |
| 21599 |
children: (0, import_i18n33.__)("Reset") |
| 21600 |
} |
| 21601 |
); |
| 21602 |
} |
| 21603 |
|
| 21604 |
// packages/dataviews/build-module/components/dataviews-filters/use-filters.mjs |
| 21605 |
var import_element47 = __toESM(require_element(), 1); |
| 21606 |
function useFilters(fields, view) { |
| 21607 |
return (0, import_element47.useMemo)(() => { |
| 21608 |
const filters = []; |
| 21609 |
fields.forEach((field) => { |
| 21610 |
if (field.filterBy === false || !field.hasElements && !field.Edit) { |
| 21611 |
return; |
| 21612 |
} |
| 21613 |
const operators = field.filterBy.operators; |
| 21614 |
const isPrimary = !!field.filterBy?.isPrimary; |
| 21615 |
const isLocked = view.filters?.some( |
| 21616 |
(f2) => f2.field === field.id && !!f2.isLocked |
| 21617 |
) ?? false; |
| 21618 |
filters.push({ |
| 21619 |
field: field.id, |
| 21620 |
name: field.label, |
| 21621 |
elements: field.elements, |
| 21622 |
getElements: field.getElements, |
| 21623 |
hasElements: field.hasElements, |
| 21624 |
singleSelection: operators.some( |
| 21625 |
(op) => isSingleSelectionOperator(op) |
| 21626 |
), |
| 21627 |
operators, |
| 21628 |
isVisible: isLocked || isPrimary || !!view.filters?.some( |
| 21629 |
(f2) => f2.field === field.id && isRegisteredOperator(f2.operator) |
| 21630 |
), |
| 21631 |
isPrimary, |
| 21632 |
isLocked |
| 21633 |
}); |
| 21634 |
}); |
| 21635 |
filters.sort((a2, b2) => { |
| 21636 |
if (a2.isLocked && !b2.isLocked) { |
| 21637 |
return -1; |
| 21638 |
} |
| 21639 |
if (!a2.isLocked && b2.isLocked) { |
| 21640 |
return 1; |
| 21641 |
} |
| 21642 |
if (a2.isPrimary && !b2.isPrimary) { |
| 21643 |
return -1; |
| 21644 |
} |
| 21645 |
if (!a2.isPrimary && b2.isPrimary) { |
| 21646 |
return 1; |
| 21647 |
} |
| 21648 |
return a2.name.localeCompare(b2.name); |
| 21649 |
}); |
| 21650 |
return filters; |
| 21651 |
}, [fields, view]); |
| 21652 |
} |
| 21653 |
var use_filters_default = useFilters; |
| 21654 |
|
| 21655 |
// packages/dataviews/build-module/components/dataviews-filters/filters.mjs |
| 21656 |
var import_jsx_runtime85 = __toESM(require_jsx_runtime(), 1); |
| 21657 |
function Filters({ className }) { |
| 21658 |
const { fields, view, onChangeView, openedFilter, setOpenedFilter } = (0, import_element48.useContext)(dataviews_context_default); |
| 21659 |
const addFilterRef = (0, import_element48.useRef)(null); |
| 21660 |
const filters = use_filters_default(fields, view); |
| 21661 |
const addFilter = /* @__PURE__ */ (0, import_jsx_runtime85.jsx)( |
| 21662 |
add_filter_default, |
| 21663 |
{ |
| 21664 |
filters, |
| 21665 |
view, |
| 21666 |
onChangeView, |
| 21667 |
ref: addFilterRef, |
| 21668 |
setOpenedFilter |
| 21669 |
}, |
| 21670 |
"add-filter" |
| 21671 |
); |
| 21672 |
const visibleFilters = filters.filter((filter) => filter.isVisible); |
| 21673 |
if (visibleFilters.length === 0) { |
| 21674 |
return null; |
| 21675 |
} |
| 21676 |
const filterComponents = [ |
| 21677 |
...visibleFilters.map((filter) => { |
| 21678 |
return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)( |
| 21679 |
Filter, |
| 21680 |
{ |
| 21681 |
filter, |
| 21682 |
view, |
| 21683 |
fields, |
| 21684 |
onChangeView, |
| 21685 |
addFilterRef, |
| 21686 |
openedFilter |
| 21687 |
}, |
| 21688 |
filter.field |
| 21689 |
); |
| 21690 |
}), |
| 21691 |
addFilter |
| 21692 |
]; |
| 21693 |
filterComponents.push( |
| 21694 |
/* @__PURE__ */ (0, import_jsx_runtime85.jsx)( |
| 21695 |
ResetFilter, |
| 21696 |
{ |
| 21697 |
filters, |
| 21698 |
view, |
| 21699 |
onChangeView |
| 21700 |
}, |
| 21701 |
"reset-filters" |
| 21702 |
) |
| 21703 |
); |
| 21704 |
return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)( |
| 21705 |
Stack, |
| 21706 |
{ |
| 21707 |
direction: "row", |
| 21708 |
justify: "flex-start", |
| 21709 |
gap: "sm", |
| 21710 |
style: { width: "fit-content" }, |
| 21711 |
wrap: "wrap", |
| 21712 |
className, |
| 21713 |
children: filterComponents |
| 21714 |
} |
| 21715 |
); |
| 21716 |
} |
| 21717 |
var filters_default = (0, import_element48.memo)(Filters); |
| 21718 |
|
| 21719 |
// packages/dataviews/build-module/components/dataviews-filters/toggle.mjs |
| 21720 |
var import_element49 = __toESM(require_element(), 1); |
| 21721 |
var import_components24 = __toESM(require_components(), 1); |
| 21722 |
var import_i18n34 = __toESM(require_i18n(), 1); |
| 21723 |
var import_jsx_runtime86 = __toESM(require_jsx_runtime(), 1); |
| 21724 |
function FiltersToggle() { |
| 21725 |
const { |
| 21726 |
filters, |
| 21727 |
view, |
| 21728 |
onChangeView, |
| 21729 |
setOpenedFilter, |
| 21730 |
isShowingFilter, |
| 21731 |
setIsShowingFilter |
| 21732 |
} = (0, import_element49.useContext)(dataviews_context_default); |
| 21733 |
const buttonRef = (0, import_element49.useRef)(null); |
| 21734 |
const onChangeViewWithFilterVisibility = (0, import_element49.useCallback)( |
| 21735 |
(_view) => { |
| 21736 |
onChangeView(_view); |
| 21737 |
setIsShowingFilter(true); |
| 21738 |
}, |
| 21739 |
[onChangeView, setIsShowingFilter] |
| 21740 |
); |
| 21741 |
if (filters.length === 0) { |
| 21742 |
return null; |
| 21743 |
} |
| 21744 |
const hasVisibleFilters = filters.some((filter) => filter.isVisible); |
| 21745 |
const addFilterButtonProps = { |
| 21746 |
label: (0, import_i18n34.__)("Add filter"), |
| 21747 |
"aria-expanded": false, |
| 21748 |
isPressed: false |
| 21749 |
}; |
| 21750 |
const toggleFiltersButtonProps = { |
| 21751 |
label: (0, import_i18n34._x)("Filter", "verb"), |
| 21752 |
"aria-expanded": isShowingFilter, |
| 21753 |
isPressed: isShowingFilter, |
| 21754 |
onClick: () => { |
| 21755 |
if (!isShowingFilter) { |
| 21756 |
setOpenedFilter(null); |
| 21757 |
} |
| 21758 |
setIsShowingFilter(!isShowingFilter); |
| 21759 |
} |
| 21760 |
}; |
| 21761 |
const hasPrimaryOrLockedFilters = filters.some( |
| 21762 |
(filter) => filter.isPrimary || filter.isLocked |
| 21763 |
); |
| 21764 |
const buttonComponent = /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( |
| 21765 |
import_components24.Button, |
| 21766 |
{ |
| 21767 |
ref: buttonRef, |
| 21768 |
className: "dataviews-filters__visibility-toggle", |
| 21769 |
size: "compact", |
| 21770 |
icon: funnel_default, |
| 21771 |
disabled: hasPrimaryOrLockedFilters, |
| 21772 |
accessibleWhenDisabled: true, |
| 21773 |
...hasVisibleFilters ? toggleFiltersButtonProps : addFilterButtonProps |
| 21774 |
} |
| 21775 |
); |
| 21776 |
return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "dataviews-filters__container-visibility-toggle", children: !hasVisibleFilters ? /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( |
| 21777 |
AddFilterMenu, |
| 21778 |
{ |
| 21779 |
filters, |
| 21780 |
view, |
| 21781 |
onChangeView: onChangeViewWithFilterVisibility, |
| 21782 |
setOpenedFilter, |
| 21783 |
triggerProps: { render: buttonComponent } |
| 21784 |
} |
| 21785 |
) : /* @__PURE__ */ (0, import_jsx_runtime86.jsx)( |
| 21786 |
FilterVisibilityToggle, |
| 21787 |
{ |
| 21788 |
buttonRef, |
| 21789 |
filtersCount: view.filters?.length, |
| 21790 |
children: buttonComponent |
| 21791 |
} |
| 21792 |
) }); |
| 21793 |
} |
| 21794 |
function FilterVisibilityToggle({ |
| 21795 |
buttonRef, |
| 21796 |
filtersCount, |
| 21797 |
children |
| 21798 |
}) { |
| 21799 |
(0, import_element49.useEffect)( |
| 21800 |
() => () => { |
| 21801 |
buttonRef.current?.focus(); |
| 21802 |
}, |
| 21803 |
[buttonRef] |
| 21804 |
); |
| 21805 |
return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [ |
| 21806 |
children, |
| 21807 |
!!filtersCount && /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("span", { className: "dataviews-filters-toggle__count", children: filtersCount }) |
| 21808 |
] }); |
| 21809 |
} |
| 21810 |
var toggle_default = FiltersToggle; |
| 21811 |
|
| 21812 |
// packages/dataviews/build-module/components/dataviews-filters/filters-toggled.mjs |
| 21813 |
var import_element50 = __toESM(require_element(), 1); |
| 21814 |
var import_jsx_runtime87 = __toESM(require_jsx_runtime(), 1); |
| 21815 |
function FiltersToggled(props) { |
| 21816 |
const { isShowingFilter } = (0, import_element50.useContext)(dataviews_context_default); |
| 21817 |
if (!isShowingFilter) { |
| 21818 |
return null; |
| 21819 |
} |
| 21820 |
return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(filters_default, { ...props }); |
| 21821 |
} |
| 21822 |
var filters_toggled_default = FiltersToggled; |
| 21823 |
|
| 21824 |
// packages/dataviews/build-module/components/dataviews-layout/index.mjs |
| 21825 |
var import_element51 = __toESM(require_element(), 1); |
| 21826 |
var import_components25 = __toESM(require_components(), 1); |
| 21827 |
var import_i18n35 = __toESM(require_i18n(), 1); |
| 21828 |
var import_jsx_runtime88 = __toESM(require_jsx_runtime(), 1); |
| 21829 |
function DataViewsLayout({ className }) { |
| 21830 |
const { |
| 21831 |
actions = [], |
| 21832 |
data, |
| 21833 |
fields, |
| 21834 |
getItemId, |
| 21835 |
getItemLevel, |
| 21836 |
hasInitiallyLoaded, |
| 21837 |
isLoading, |
| 21838 |
view, |
| 21839 |
onChangeView, |
| 21840 |
selection, |
| 21841 |
onChangeSelection, |
| 21842 |
setOpenedFilter, |
| 21843 |
onClickItem, |
| 21844 |
isItemClickable: isItemClickable2, |
| 21845 |
renderItemLink, |
| 21846 |
defaultLayouts: defaultLayouts2, |
| 21847 |
containerRef, |
| 21848 |
empty = /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("p", { children: (0, import_i18n35.__)("No results") }) |
| 21849 |
} = (0, import_element51.useContext)(dataviews_context_default); |
| 21850 |
const isDelayedInitialLoading = useDelayedLoading(!hasInitiallyLoaded, { |
| 21851 |
delay: 200 |
| 21852 |
}); |
| 21853 |
if (!hasInitiallyLoaded) { |
| 21854 |
if (!isDelayedInitialLoading) { |
| 21855 |
return null; |
| 21856 |
} |
| 21857 |
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "dataviews-loading", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_components25.Spinner, {}) }) }); |
| 21858 |
} |
| 21859 |
const ViewComponent = VIEW_LAYOUTS.find( |
| 21860 |
(v2) => v2.type === view.type && defaultLayouts2[v2.type] |
| 21861 |
)?.component; |
| 21862 |
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "dataviews-layout__container", ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)( |
| 21863 |
ViewComponent, |
| 21864 |
{ |
| 21865 |
className, |
| 21866 |
actions, |
| 21867 |
data, |
| 21868 |
fields, |
| 21869 |
getItemId, |
| 21870 |
getItemLevel, |
| 21871 |
isLoading, |
| 21872 |
onChangeView, |
| 21873 |
onChangeSelection, |
| 21874 |
selection, |
| 21875 |
setOpenedFilter, |
| 21876 |
onClickItem, |
| 21877 |
renderItemLink, |
| 21878 |
isItemClickable: isItemClickable2, |
| 21879 |
view, |
| 21880 |
empty |
| 21881 |
} |
| 21882 |
) }); |
| 21883 |
} |
| 21884 |
|
| 21885 |
// packages/dataviews/build-module/components/dataviews-search/index.mjs |
| 21886 |
var import_i18n36 = __toESM(require_i18n(), 1); |
| 21887 |
var import_element52 = __toESM(require_element(), 1); |
| 21888 |
var import_components26 = __toESM(require_components(), 1); |
| 21889 |
var import_compose10 = __toESM(require_compose(), 1); |
| 21890 |
var import_jsx_runtime89 = __toESM(require_jsx_runtime(), 1); |
| 21891 |
var DataViewsSearch = (0, import_element52.memo)(function Search({ label }) { |
| 21892 |
const { view, onChangeView } = (0, import_element52.useContext)(dataviews_context_default); |
| 21893 |
const [search, setSearch, debouncedSearch] = (0, import_compose10.useDebouncedInput)( |
| 21894 |
view.search |
| 21895 |
); |
| 21896 |
(0, import_element52.useEffect)(() => { |
| 21897 |
if (view.search !== debouncedSearch) { |
| 21898 |
setSearch(view.search ?? ""); |
| 21899 |
} |
| 21900 |
}, [view.search, setSearch]); |
| 21901 |
const onChangeViewRef = (0, import_element52.useRef)(onChangeView); |
| 21902 |
const viewRef = (0, import_element52.useRef)(view); |
| 21903 |
(0, import_element52.useEffect)(() => { |
| 21904 |
onChangeViewRef.current = onChangeView; |
| 21905 |
viewRef.current = view; |
| 21906 |
}, [onChangeView, view]); |
| 21907 |
(0, import_element52.useEffect)(() => { |
| 21908 |
if (debouncedSearch !== viewRef.current?.search) { |
| 21909 |
onChangeViewRef.current({ |
| 21910 |
...viewRef.current, |
| 21911 |
page: view.page ? 1 : void 0, |
| 21912 |
startPosition: view.startPosition ? 1 : void 0, |
| 21913 |
search: debouncedSearch |
| 21914 |
}); |
| 21915 |
} |
| 21916 |
}, [debouncedSearch]); |
| 21917 |
const searchLabel = label || (0, import_i18n36.__)("Search"); |
| 21918 |
return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)( |
| 21919 |
import_components26.SearchControl, |
| 21920 |
{ |
| 21921 |
className: "dataviews-search", |
| 21922 |
onChange: setSearch, |
| 21923 |
value: search, |
| 21924 |
label: searchLabel, |
| 21925 |
placeholder: searchLabel, |
| 21926 |
size: "compact" |
| 21927 |
} |
| 21928 |
); |
| 21929 |
}); |
| 21930 |
var dataviews_search_default = DataViewsSearch; |
| 21931 |
|
| 21932 |
// packages/dataviews/build-module/components/dataviews-view-config/index.mjs |
| 21933 |
var import_components27 = __toESM(require_components(), 1); |
| 21934 |
var import_i18n37 = __toESM(require_i18n(), 1); |
| 21935 |
var import_element53 = __toESM(require_element(), 1); |
| 21936 |
var import_warning = __toESM(require_warning(), 1); |
| 21937 |
var import_compose11 = __toESM(require_compose(), 1); |
| 21938 |
var import_jsx_runtime90 = __toESM(require_jsx_runtime(), 1); |
| 21939 |
var { Menu: Menu5 } = unlock2(import_components27.privateApis); |
| 21940 |
var DATAVIEWS_CONFIG_POPOVER_PROPS = { |
| 21941 |
className: "dataviews-config__popover", |
| 21942 |
placement: "bottom-end", |
| 21943 |
offset: 9 |
| 21944 |
}; |
| 21945 |
function ViewTypeMenu() { |
| 21946 |
const { view, onChangeView, defaultLayouts: defaultLayouts2 } = (0, import_element53.useContext)(dataviews_context_default); |
| 21947 |
const availableLayouts = Object.keys(defaultLayouts2); |
| 21948 |
if (availableLayouts.length <= 1) { |
| 21949 |
return null; |
| 21950 |
} |
| 21951 |
const activeView = VIEW_LAYOUTS.find((v2) => view.type === v2.type); |
| 21952 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(Menu5, { children: [ |
| 21953 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 21954 |
Menu5.TriggerButton, |
| 21955 |
{ |
| 21956 |
render: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 21957 |
import_components27.Button, |
| 21958 |
{ |
| 21959 |
size: "compact", |
| 21960 |
icon: activeView?.icon, |
| 21961 |
label: (0, import_i18n37.__)("Layout") |
| 21962 |
} |
| 21963 |
) |
| 21964 |
} |
| 21965 |
), |
| 21966 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Menu5.Popover, { children: availableLayouts.map((layout) => { |
| 21967 |
const config = VIEW_LAYOUTS.find( |
| 21968 |
(v2) => v2.type === layout |
| 21969 |
); |
| 21970 |
if (!config) { |
| 21971 |
return null; |
| 21972 |
} |
| 21973 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 21974 |
Menu5.RadioItem, |
| 21975 |
{ |
| 21976 |
value: layout, |
| 21977 |
name: "view-actions-available-view", |
| 21978 |
checked: layout === view.type, |
| 21979 |
hideOnClick: true, |
| 21980 |
onChange: (e2) => { |
| 21981 |
switch (e2.target.value) { |
| 21982 |
case "list": |
| 21983 |
case "grid": |
| 21984 |
case "table": |
| 21985 |
case "pickerGrid": |
| 21986 |
case "pickerTable": |
| 21987 |
case "pickerActivity": |
| 21988 |
case "activity": |
| 21989 |
const viewWithoutLayout = { ...view }; |
| 21990 |
if ("layout" in viewWithoutLayout) { |
| 21991 |
delete viewWithoutLayout.layout; |
| 21992 |
} |
| 21993 |
return onChangeView({ |
| 21994 |
...viewWithoutLayout, |
| 21995 |
type: e2.target.value, |
| 21996 |
...defaultLayouts2[e2.target.value] |
| 21997 |
}); |
| 21998 |
} |
| 21999 |
(0, import_warning.default)("Invalid dataview"); |
| 22000 |
}, |
| 22001 |
children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Menu5.ItemLabel, { children: config.label }) |
| 22002 |
}, |
| 22003 |
layout |
| 22004 |
); |
| 22005 |
}) }) |
| 22006 |
] }); |
| 22007 |
} |
| 22008 |
function SortFieldControl() { |
| 22009 |
const { view, fields, onChangeView } = (0, import_element53.useContext)(dataviews_context_default); |
| 22010 |
const orderOptions = (0, import_element53.useMemo)(() => { |
| 22011 |
const sortableFields = fields.filter( |
| 22012 |
(field) => field.enableSorting !== false |
| 22013 |
); |
| 22014 |
return sortableFields.map((field) => { |
| 22015 |
return { |
| 22016 |
label: field.label, |
| 22017 |
value: field.id |
| 22018 |
}; |
| 22019 |
}); |
| 22020 |
}, [fields]); |
| 22021 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22022 |
import_components27.SelectControl, |
| 22023 |
{ |
| 22024 |
__next40pxDefaultSize: true, |
| 22025 |
label: (0, import_i18n37.__)("Sort by"), |
| 22026 |
value: view.sort?.field, |
| 22027 |
options: orderOptions, |
| 22028 |
onChange: (value) => { |
| 22029 |
onChangeView({ |
| 22030 |
...view, |
| 22031 |
sort: { |
| 22032 |
direction: view?.sort?.direction || "desc", |
| 22033 |
field: value |
| 22034 |
}, |
| 22035 |
showLevels: false |
| 22036 |
}); |
| 22037 |
} |
| 22038 |
} |
| 22039 |
); |
| 22040 |
} |
| 22041 |
function SortDirectionControl() { |
| 22042 |
const { view, fields, onChangeView } = (0, import_element53.useContext)(dataviews_context_default); |
| 22043 |
const sortableFields = fields.filter( |
| 22044 |
(field) => field.enableSorting !== false |
| 22045 |
); |
| 22046 |
if (sortableFields.length === 0) { |
| 22047 |
return null; |
| 22048 |
} |
| 22049 |
let value = view.sort?.direction; |
| 22050 |
if (!value && view.sort?.field) { |
| 22051 |
value = "desc"; |
| 22052 |
} |
| 22053 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22054 |
import_components27.__experimentalToggleGroupControl, |
| 22055 |
{ |
| 22056 |
className: "dataviews-view-config__sort-direction", |
| 22057 |
__next40pxDefaultSize: true, |
| 22058 |
isBlock: true, |
| 22059 |
label: (0, import_i18n37.__)("Order"), |
| 22060 |
value, |
| 22061 |
onChange: (newDirection) => { |
| 22062 |
if (newDirection === "asc" || newDirection === "desc") { |
| 22063 |
onChangeView({ |
| 22064 |
...view, |
| 22065 |
sort: { |
| 22066 |
direction: newDirection, |
| 22067 |
field: view.sort?.field || // If there is no field assigned as the sorting field assign the first sortable field. |
| 22068 |
fields.find( |
| 22069 |
(field) => field.enableSorting !== false |
| 22070 |
)?.id || "" |
| 22071 |
}, |
| 22072 |
showLevels: false |
| 22073 |
}); |
| 22074 |
return; |
| 22075 |
} |
| 22076 |
(0, import_warning.default)("Invalid direction"); |
| 22077 |
}, |
| 22078 |
children: SORTING_DIRECTIONS.map((direction) => { |
| 22079 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22080 |
import_components27.__experimentalToggleGroupControlOptionIcon, |
| 22081 |
{ |
| 22082 |
value: direction, |
| 22083 |
icon: sortIcons[direction], |
| 22084 |
label: sortLabels[direction] |
| 22085 |
}, |
| 22086 |
direction |
| 22087 |
); |
| 22088 |
}) |
| 22089 |
} |
| 22090 |
); |
| 22091 |
} |
| 22092 |
function ItemsPerPageControl() { |
| 22093 |
const { view, config, onChangeView } = (0, import_element53.useContext)(dataviews_context_default); |
| 22094 |
const { infiniteScrollEnabled } = view; |
| 22095 |
if (!config || !config.perPageSizes || config.perPageSizes.length < 2 || config.perPageSizes.length > 6 || infiniteScrollEnabled) { |
| 22096 |
return null; |
| 22097 |
} |
| 22098 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22099 |
import_components27.__experimentalToggleGroupControl, |
| 22100 |
{ |
| 22101 |
__next40pxDefaultSize: true, |
| 22102 |
isBlock: true, |
| 22103 |
label: (0, import_i18n37.__)("Items per page"), |
| 22104 |
value: view.perPage || 10, |
| 22105 |
disabled: !view?.sort?.field, |
| 22106 |
onChange: (newItemsPerPage) => { |
| 22107 |
const newItemsPerPageNumber = typeof newItemsPerPage === "number" || newItemsPerPage === void 0 ? newItemsPerPage : parseInt(newItemsPerPage, 10); |
| 22108 |
onChangeView({ |
| 22109 |
...view, |
| 22110 |
perPage: newItemsPerPageNumber, |
| 22111 |
page: 1 |
| 22112 |
}); |
| 22113 |
}, |
| 22114 |
children: config.perPageSizes.map((value) => { |
| 22115 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22116 |
import_components27.__experimentalToggleGroupControlOption, |
| 22117 |
{ |
| 22118 |
value, |
| 22119 |
label: value.toString() |
| 22120 |
}, |
| 22121 |
value |
| 22122 |
); |
| 22123 |
}) |
| 22124 |
} |
| 22125 |
); |
| 22126 |
} |
| 22127 |
function ResetViewButton() { |
| 22128 |
const { onReset } = (0, import_element53.useContext)(dataviews_context_default); |
| 22129 |
if (onReset === void 0) { |
| 22130 |
return null; |
| 22131 |
} |
| 22132 |
const isDisabled = onReset === false; |
| 22133 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22134 |
import_components27.Button, |
| 22135 |
{ |
| 22136 |
variant: "tertiary", |
| 22137 |
size: "compact", |
| 22138 |
disabled: isDisabled, |
| 22139 |
accessibleWhenDisabled: true, |
| 22140 |
className: "dataviews-view-config__reset-button", |
| 22141 |
onClick: () => { |
| 22142 |
if (typeof onReset === "function") { |
| 22143 |
onReset(); |
| 22144 |
} |
| 22145 |
}, |
| 22146 |
children: (0, import_i18n37.__)("Reset view") |
| 22147 |
} |
| 22148 |
); |
| 22149 |
} |
| 22150 |
function DataviewsViewConfigDropdown() { |
| 22151 |
const { view, onReset } = (0, import_element53.useContext)(dataviews_context_default); |
| 22152 |
const popoverId = (0, import_compose11.useInstanceId)( |
| 22153 |
_DataViewsViewConfig, |
| 22154 |
"dataviews-view-config-dropdown" |
| 22155 |
); |
| 22156 |
const activeLayout = VIEW_LAYOUTS.find( |
| 22157 |
(layout) => layout.type === view.type |
| 22158 |
); |
| 22159 |
const isModified = typeof onReset === "function"; |
| 22160 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22161 |
import_components27.Dropdown, |
| 22162 |
{ |
| 22163 |
expandOnMobile: true, |
| 22164 |
popoverProps: { |
| 22165 |
...DATAVIEWS_CONFIG_POPOVER_PROPS, |
| 22166 |
id: popoverId |
| 22167 |
}, |
| 22168 |
renderToggle: ({ onToggle, isOpen }) => { |
| 22169 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "dataviews-view-config__toggle-wrapper", children: [ |
| 22170 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22171 |
import_components27.Button, |
| 22172 |
{ |
| 22173 |
size: "compact", |
| 22174 |
icon: cog_default, |
| 22175 |
label: (0, import_i18n37._x)( |
| 22176 |
"View options", |
| 22177 |
"View is used as a noun" |
| 22178 |
), |
| 22179 |
onClick: onToggle, |
| 22180 |
"aria-expanded": isOpen ? "true" : "false", |
| 22181 |
"aria-controls": popoverId |
| 22182 |
} |
| 22183 |
), |
| 22184 |
isModified && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { className: "dataviews-view-config__modified-indicator" }) |
| 22185 |
] }); |
| 22186 |
}, |
| 22187 |
renderContent: () => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22188 |
import_components27.__experimentalDropdownContentWrapper, |
| 22189 |
{ |
| 22190 |
paddingSize: "medium", |
| 22191 |
className: "dataviews-config__popover-content-wrapper", |
| 22192 |
children: /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)( |
| 22193 |
Stack, |
| 22194 |
{ |
| 22195 |
direction: "column", |
| 22196 |
className: "dataviews-view-config", |
| 22197 |
gap: "xl", |
| 22198 |
children: [ |
| 22199 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsxs)( |
| 22200 |
Stack, |
| 22201 |
{ |
| 22202 |
direction: "row", |
| 22203 |
justify: "space-between", |
| 22204 |
align: "center", |
| 22205 |
className: "dataviews-view-config__header", |
| 22206 |
children: [ |
| 22207 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)( |
| 22208 |
import_components27.__experimentalHeading, |
| 22209 |
{ |
| 22210 |
level: 2, |
| 22211 |
className: "dataviews-settings-section__title", |
| 22212 |
children: (0, import_i18n37.__)("Appearance") |
| 22213 |
} |
| 22214 |
), |
| 22215 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ResetViewButton, {}) |
| 22216 |
] |
| 22217 |
} |
| 22218 |
), |
| 22219 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(Stack, { direction: "column", gap: "lg", children: [ |
| 22220 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsxs)( |
| 22221 |
Stack, |
| 22222 |
{ |
| 22223 |
direction: "row", |
| 22224 |
gap: "sm", |
| 22225 |
className: "dataviews-view-config__sort-controls", |
| 22226 |
children: [ |
| 22227 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(SortFieldControl, {}), |
| 22228 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(SortDirectionControl, {}) |
| 22229 |
] |
| 22230 |
} |
| 22231 |
), |
| 22232 |
!!activeLayout?.viewConfigOptions && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(activeLayout.viewConfigOptions, {}), |
| 22233 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ItemsPerPageControl, {}), |
| 22234 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(PropertiesSection, {}) |
| 22235 |
] }) |
| 22236 |
] |
| 22237 |
} |
| 22238 |
) |
| 22239 |
} |
| 22240 |
) |
| 22241 |
} |
| 22242 |
); |
| 22243 |
} |
| 22244 |
function _DataViewsViewConfig() { |
| 22245 |
return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(import_jsx_runtime90.Fragment, { children: [ |
| 22246 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ViewTypeMenu, {}), |
| 22247 |
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(DataviewsViewConfigDropdown, {}) |
| 22248 |
] }); |
| 22249 |
} |
| 22250 |
var DataViewsViewConfig = (0, import_element53.memo)(_DataViewsViewConfig); |
| 22251 |
var dataviews_view_config_default = DataViewsViewConfig; |
| 22252 |
|
| 22253 |
// packages/dataviews/build-module/components/dataform-controls/checkbox.mjs |
| 22254 |
var import_components28 = __toESM(require_components(), 1); |
| 22255 |
var import_element54 = __toESM(require_element(), 1); |
| 22256 |
|
| 22257 |
// packages/dataviews/build-module/components/dataform-controls/utils/get-custom-validity.mjs |
| 22258 |
function getCustomValidity(isValid2, validity) { |
| 22259 |
let customValidity; |
| 22260 |
if (isValid2?.required && validity?.required) { |
| 22261 |
customValidity = validity?.required?.message ? validity.required : void 0; |
| 22262 |
} else if (isValid2?.pattern && validity?.pattern) { |
| 22263 |
customValidity = validity.pattern; |
| 22264 |
} else if (isValid2?.min && validity?.min) { |
| 22265 |
customValidity = validity.min; |
| 22266 |
} else if (isValid2?.max && validity?.max) { |
| 22267 |
customValidity = validity.max; |
| 22268 |
} else if (isValid2?.minLength && validity?.minLength) { |
| 22269 |
customValidity = validity.minLength; |
| 22270 |
} else if (isValid2?.maxLength && validity?.maxLength) { |
| 22271 |
customValidity = validity.maxLength; |
| 22272 |
} else if (isValid2?.elements && validity?.elements) { |
| 22273 |
customValidity = validity.elements; |
| 22274 |
} else if (validity?.custom) { |
| 22275 |
customValidity = validity.custom; |
| 22276 |
} |
| 22277 |
return customValidity; |
| 22278 |
} |
| 22279 |
|
| 22280 |
// packages/dataviews/build-module/components/dataform-controls/checkbox.mjs |
| 22281 |
var import_jsx_runtime91 = __toESM(require_jsx_runtime(), 1); |
| 22282 |
var { ValidatedCheckboxControl } = unlock2(import_components28.privateApis); |
| 22283 |
function Checkbox({ |
| 22284 |
field, |
| 22285 |
onChange, |
| 22286 |
data, |
| 22287 |
hideLabelFromVision, |
| 22288 |
markWhenOptional, |
| 22289 |
validity |
| 22290 |
}) { |
| 22291 |
const { getValue, setValue, label, description, isValid: isValid2 } = field; |
| 22292 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 22293 |
const onChangeControl = (0, import_element54.useCallback)(() => { |
| 22294 |
onChange( |
| 22295 |
setValue({ item: data, value: !getValue({ item: data }) }) |
| 22296 |
); |
| 22297 |
}, [data, getValue, onChange, setValue]); |
| 22298 |
return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)( |
| 22299 |
ValidatedCheckboxControl, |
| 22300 |
{ |
| 22301 |
required: !!field.isValid?.required, |
| 22302 |
markWhenOptional, |
| 22303 |
customValidity: getCustomValidity(isValid2, validity), |
| 22304 |
hidden: hideLabelFromVision, |
| 22305 |
label, |
| 22306 |
help: description, |
| 22307 |
checked: getValue({ item: data }), |
| 22308 |
onChange: onChangeControl, |
| 22309 |
disabled: disabled2 |
| 22310 |
} |
| 22311 |
); |
| 22312 |
} |
| 22313 |
|
| 22314 |
// packages/dataviews/build-module/components/dataform-controls/combobox.mjs |
| 22315 |
var import_components29 = __toESM(require_components(), 1); |
| 22316 |
var import_element55 = __toESM(require_element(), 1); |
| 22317 |
var import_jsx_runtime92 = __toESM(require_jsx_runtime(), 1); |
| 22318 |
var { ValidatedComboboxControl } = unlock2(import_components29.privateApis); |
| 22319 |
function Combobox3({ |
| 22320 |
data, |
| 22321 |
field, |
| 22322 |
onChange, |
| 22323 |
hideLabelFromVision, |
| 22324 |
validity |
| 22325 |
}) { |
| 22326 |
const { label, description, placeholder, getValue, setValue, isValid: isValid2 } = field; |
| 22327 |
const value = getValue({ item: data }) ?? ""; |
| 22328 |
const onChangeControl = (0, import_element55.useCallback)( |
| 22329 |
(newValue) => onChange(setValue({ item: data, value: newValue ?? "" })), |
| 22330 |
[data, onChange, setValue] |
| 22331 |
); |
| 22332 |
const { elements, isLoading } = useElements({ |
| 22333 |
elements: field.elements, |
| 22334 |
getElements: field.getElements |
| 22335 |
}); |
| 22336 |
if (isLoading) { |
| 22337 |
return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_components29.Spinner, {}); |
| 22338 |
} |
| 22339 |
return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)( |
| 22340 |
ValidatedComboboxControl, |
| 22341 |
{ |
| 22342 |
required: !!field.isValid?.required, |
| 22343 |
customValidity: getCustomValidity(isValid2, validity), |
| 22344 |
label, |
| 22345 |
value, |
| 22346 |
help: description, |
| 22347 |
placeholder, |
| 22348 |
options: elements, |
| 22349 |
onChange: onChangeControl, |
| 22350 |
hideLabelFromVision, |
| 22351 |
allowReset: true, |
| 22352 |
expandOnFocus: true |
| 22353 |
} |
| 22354 |
); |
| 22355 |
} |
| 22356 |
|
| 22357 |
// packages/dataviews/build-module/components/dataform-controls/datetime.mjs |
| 22358 |
var import_components31 = __toESM(require_components(), 1); |
| 22359 |
var import_element58 = __toESM(require_element(), 1); |
| 22360 |
var import_i18n39 = __toESM(require_i18n(), 1); |
| 22361 |
var import_date3 = __toESM(require_date(), 1); |
| 22362 |
|
| 22363 |
// packages/dataviews/build-module/components/dataform-controls/utils/relative-date-control.mjs |
| 22364 |
var import_components30 = __toESM(require_components(), 1); |
| 22365 |
var import_element56 = __toESM(require_element(), 1); |
| 22366 |
var import_i18n38 = __toESM(require_i18n(), 1); |
| 22367 |
var import_jsx_runtime93 = __toESM(require_jsx_runtime(), 1); |
| 22368 |
var TIME_UNITS_OPTIONS = { |
| 22369 |
[OPERATOR_IN_THE_PAST]: [ |
| 22370 |
{ value: "days", label: (0, import_i18n38.__)("Days") }, |
| 22371 |
{ value: "weeks", label: (0, import_i18n38.__)("Weeks") }, |
| 22372 |
{ value: "months", label: (0, import_i18n38.__)("Months") }, |
| 22373 |
{ value: "years", label: (0, import_i18n38.__)("Years") } |
| 22374 |
], |
| 22375 |
[OPERATOR_OVER]: [ |
| 22376 |
{ value: "days", label: (0, import_i18n38.__)("Days ago") }, |
| 22377 |
{ value: "weeks", label: (0, import_i18n38.__)("Weeks ago") }, |
| 22378 |
{ value: "months", label: (0, import_i18n38.__)("Months ago") }, |
| 22379 |
{ value: "years", label: (0, import_i18n38.__)("Years ago") } |
| 22380 |
] |
| 22381 |
}; |
| 22382 |
function RelativeDateControl({ |
| 22383 |
className, |
| 22384 |
data, |
| 22385 |
field, |
| 22386 |
onChange, |
| 22387 |
hideLabelFromVision, |
| 22388 |
operator |
| 22389 |
}) { |
| 22390 |
const options = TIME_UNITS_OPTIONS[operator === OPERATOR_IN_THE_PAST ? "inThePast" : "over"]; |
| 22391 |
const { id, label, description, getValue, setValue } = field; |
| 22392 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 22393 |
const fieldValue = getValue({ item: data }); |
| 22394 |
const { value: relValue = "", unit = options[0].value } = fieldValue && typeof fieldValue === "object" ? fieldValue : {}; |
| 22395 |
const onChangeValue = (0, import_element56.useCallback)( |
| 22396 |
(newValue) => onChange( |
| 22397 |
setValue({ |
| 22398 |
item: data, |
| 22399 |
value: { value: Number(newValue), unit } |
| 22400 |
}) |
| 22401 |
), |
| 22402 |
[onChange, setValue, data, unit] |
| 22403 |
); |
| 22404 |
const onChangeUnit = (0, import_element56.useCallback)( |
| 22405 |
(newUnit) => onChange( |
| 22406 |
setValue({ |
| 22407 |
item: data, |
| 22408 |
value: { value: relValue, unit: newUnit } |
| 22409 |
}) |
| 22410 |
), |
| 22411 |
[onChange, setValue, data, relValue] |
| 22412 |
); |
| 22413 |
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)( |
| 22414 |
import_components30.BaseControl, |
| 22415 |
{ |
| 22416 |
id, |
| 22417 |
className: clsx_default(className, "dataviews-controls__relative-date"), |
| 22418 |
label, |
| 22419 |
hideLabelFromVision, |
| 22420 |
help: description, |
| 22421 |
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(Stack, { direction: "row", gap: "sm", children: [ |
| 22422 |
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)( |
| 22423 |
import_components30.__experimentalNumberControl, |
| 22424 |
{ |
| 22425 |
__next40pxDefaultSize: true, |
| 22426 |
className: "dataviews-controls__relative-date-number", |
| 22427 |
spinControls: "none", |
| 22428 |
min: 1, |
| 22429 |
step: 1, |
| 22430 |
value: relValue, |
| 22431 |
onChange: onChangeValue, |
| 22432 |
disabled: disabled2 |
| 22433 |
} |
| 22434 |
), |
| 22435 |
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)( |
| 22436 |
import_components30.SelectControl, |
| 22437 |
{ |
| 22438 |
className: "dataviews-controls__relative-date-unit", |
| 22439 |
__next40pxDefaultSize: true, |
| 22440 |
label: (0, import_i18n38.__)("Unit"), |
| 22441 |
value: unit, |
| 22442 |
options, |
| 22443 |
onChange: onChangeUnit, |
| 22444 |
hideLabelFromVision: true, |
| 22445 |
disabled: disabled2 |
| 22446 |
} |
| 22447 |
) |
| 22448 |
] }) |
| 22449 |
} |
| 22450 |
); |
| 22451 |
} |
| 22452 |
|
| 22453 |
// packages/dataviews/build-module/components/dataform-controls/utils/use-disabled-date-matchers.mjs |
| 22454 |
var import_element57 = __toESM(require_element(), 1); |
| 22455 |
function useDisabledDateMatchers(isValid2, parseDateFn) { |
| 22456 |
const minConstraint = typeof isValid2.min?.constraint === "string" ? isValid2.min.constraint : void 0; |
| 22457 |
const maxConstraint = typeof isValid2.max?.constraint === "string" ? isValid2.max.constraint : void 0; |
| 22458 |
const disabledMatchers = (0, import_element57.useMemo)(() => { |
| 22459 |
const matchers = []; |
| 22460 |
if (minConstraint) { |
| 22461 |
const minDate = parseDateFn(minConstraint); |
| 22462 |
if (minDate) { |
| 22463 |
matchers.push({ before: minDate }); |
| 22464 |
} |
| 22465 |
} |
| 22466 |
if (maxConstraint) { |
| 22467 |
const maxDate = parseDateFn(maxConstraint); |
| 22468 |
if (maxDate) { |
| 22469 |
matchers.push({ after: maxDate }); |
| 22470 |
} |
| 22471 |
} |
| 22472 |
return matchers.length > 0 ? matchers : void 0; |
| 22473 |
}, [minConstraint, maxConstraint, parseDateFn]); |
| 22474 |
return { minConstraint, maxConstraint, disabledMatchers }; |
| 22475 |
} |
| 22476 |
|
| 22477 |
// packages/dataviews/build-module/field-types/utils/parse-date-time.mjs |
| 22478 |
var import_date2 = __toESM(require_date(), 1); |
| 22479 |
function parseDateTime(dateTimeString) { |
| 22480 |
if (!dateTimeString) { |
| 22481 |
return null; |
| 22482 |
} |
| 22483 |
const parsed = (0, import_date2.getDate)(dateTimeString); |
| 22484 |
return parsed && isValid(parsed) ? parsed : null; |
| 22485 |
} |
| 22486 |
|
| 22487 |
// packages/dataviews/build-module/components/dataform-controls/datetime.mjs |
| 22488 |
var import_jsx_runtime94 = __toESM(require_jsx_runtime(), 1); |
| 22489 |
var { DateCalendar, ValidatedInputControl } = unlock2(import_components31.privateApis); |
| 22490 |
var formatDateTime = (value) => { |
| 22491 |
if (!value) { |
| 22492 |
return ""; |
| 22493 |
} |
| 22494 |
return (0, import_date3.dateI18n)("Y-m-d\\TH:i", (0, import_date3.getDate)(value)); |
| 22495 |
}; |
| 22496 |
function CalendarDateTimeControl({ |
| 22497 |
data, |
| 22498 |
field, |
| 22499 |
onChange, |
| 22500 |
hideLabelFromVision, |
| 22501 |
markWhenOptional, |
| 22502 |
validity, |
| 22503 |
config |
| 22504 |
}) { |
| 22505 |
const { compact } = config || {}; |
| 22506 |
const { id, label, description, setValue, getValue, isValid: isValid2 } = field; |
| 22507 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 22508 |
const fieldValue = getValue({ item: data }); |
| 22509 |
const value = typeof fieldValue === "string" ? fieldValue : void 0; |
| 22510 |
const [calendarMonth, setCalendarMonth] = (0, import_element58.useState)(() => { |
| 22511 |
const parsedDate = parseDateTime(value); |
| 22512 |
return parsedDate || /* @__PURE__ */ new Date(); |
| 22513 |
}); |
| 22514 |
const inputControlRef = (0, import_element58.useRef)(null); |
| 22515 |
const validationTimeoutRef = (0, import_element58.useRef)(void 0); |
| 22516 |
const previousFocusRef = (0, import_element58.useRef)(null); |
| 22517 |
const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDateTime); |
| 22518 |
const onChangeCallback = (0, import_element58.useCallback)( |
| 22519 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 22520 |
[data, onChange, setValue] |
| 22521 |
); |
| 22522 |
(0, import_element58.useEffect)(() => { |
| 22523 |
return () => { |
| 22524 |
if (validationTimeoutRef.current) { |
| 22525 |
clearTimeout(validationTimeoutRef.current); |
| 22526 |
} |
| 22527 |
}; |
| 22528 |
}, []); |
| 22529 |
const onSelectDate = (0, import_element58.useCallback)( |
| 22530 |
(newDate) => { |
| 22531 |
let dateTimeValue; |
| 22532 |
if (newDate) { |
| 22533 |
const wpDate = (0, import_date3.dateI18n)("Y-m-d", newDate); |
| 22534 |
let wpTime; |
| 22535 |
if (value) { |
| 22536 |
wpTime = (0, import_date3.dateI18n)("H:i", (0, import_date3.getDate)(value)); |
| 22537 |
} else { |
| 22538 |
wpTime = (0, import_date3.dateI18n)("H:i", newDate); |
| 22539 |
} |
| 22540 |
const finalDateTime = (0, import_date3.getDate)(`${wpDate}T${wpTime}`); |
| 22541 |
dateTimeValue = finalDateTime.toISOString(); |
| 22542 |
onChangeCallback(dateTimeValue); |
| 22543 |
if (validationTimeoutRef.current) { |
| 22544 |
clearTimeout(validationTimeoutRef.current); |
| 22545 |
} |
| 22546 |
} else { |
| 22547 |
onChangeCallback(void 0); |
| 22548 |
} |
| 22549 |
previousFocusRef.current = inputControlRef.current && inputControlRef.current.ownerDocument.activeElement; |
| 22550 |
validationTimeoutRef.current = setTimeout(() => { |
| 22551 |
if (inputControlRef.current) { |
| 22552 |
inputControlRef.current.focus(); |
| 22553 |
inputControlRef.current.blur(); |
| 22554 |
onChangeCallback(dateTimeValue); |
| 22555 |
if (previousFocusRef.current && previousFocusRef.current instanceof HTMLElement) { |
| 22556 |
previousFocusRef.current.focus(); |
| 22557 |
} |
| 22558 |
} |
| 22559 |
}, 0); |
| 22560 |
}, |
| 22561 |
[onChangeCallback, value] |
| 22562 |
); |
| 22563 |
const handleManualDateTimeChange = (0, import_element58.useCallback)( |
| 22564 |
(newValue) => { |
| 22565 |
if (newValue) { |
| 22566 |
const dateTime = (0, import_date3.getDate)(newValue); |
| 22567 |
onChangeCallback(dateTime.toISOString()); |
| 22568 |
const parsedDate = parseDateTime(dateTime.toISOString()); |
| 22569 |
if (parsedDate) { |
| 22570 |
setCalendarMonth(parsedDate); |
| 22571 |
} |
| 22572 |
} else { |
| 22573 |
onChangeCallback(void 0); |
| 22574 |
} |
| 22575 |
}, |
| 22576 |
[onChangeCallback] |
| 22577 |
); |
| 22578 |
const { format: fieldFormat } = field; |
| 22579 |
const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date3.getSettings)().l10n.startOfWeek; |
| 22580 |
const { |
| 22581 |
timezone: { string: timezoneString } |
| 22582 |
} = (0, import_date3.getSettings)(); |
| 22583 |
let displayLabel = label; |
| 22584 |
if (isValid2?.required && !markWhenOptional && !hideLabelFromVision) { |
| 22585 |
displayLabel = `${label} (${(0, import_i18n39.__)("Required")})`; |
| 22586 |
} else if (!isValid2?.required && markWhenOptional && !hideLabelFromVision) { |
| 22587 |
displayLabel = `${label} (${(0, import_i18n39.__)("Optional")})`; |
| 22588 |
} |
| 22589 |
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)( |
| 22590 |
import_components31.BaseControl, |
| 22591 |
{ |
| 22592 |
id, |
| 22593 |
label: displayLabel, |
| 22594 |
help: description, |
| 22595 |
hideLabelFromVision, |
| 22596 |
children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(Stack, { direction: "column", gap: "lg", children: [ |
| 22597 |
/* @__PURE__ */ (0, import_jsx_runtime94.jsx)( |
| 22598 |
ValidatedInputControl, |
| 22599 |
{ |
| 22600 |
ref: inputControlRef, |
| 22601 |
__next40pxDefaultSize: true, |
| 22602 |
required: !!isValid2?.required, |
| 22603 |
customValidity: getCustomValidity(isValid2, validity), |
| 22604 |
type: "datetime-local", |
| 22605 |
label: (0, import_i18n39.__)("Date time"), |
| 22606 |
hideLabelFromVision: true, |
| 22607 |
value: formatDateTime(value), |
| 22608 |
onChange: handleManualDateTimeChange, |
| 22609 |
disabled: disabled2, |
| 22610 |
min: minConstraint ? formatDateTime(minConstraint) : void 0, |
| 22611 |
max: maxConstraint ? formatDateTime(maxConstraint) : void 0 |
| 22612 |
} |
| 22613 |
), |
| 22614 |
!compact && /* @__PURE__ */ (0, import_jsx_runtime94.jsx)( |
| 22615 |
DateCalendar, |
| 22616 |
{ |
| 22617 |
style: { width: "100%" }, |
| 22618 |
selected: value ? parseDateTime(value) || void 0 : void 0, |
| 22619 |
onSelect: onSelectDate, |
| 22620 |
month: calendarMonth, |
| 22621 |
onMonthChange: setCalendarMonth, |
| 22622 |
timeZone: timezoneString || void 0, |
| 22623 |
weekStartsOn, |
| 22624 |
disabled: disabled2 || disabledMatchers |
| 22625 |
} |
| 22626 |
) |
| 22627 |
] }) |
| 22628 |
} |
| 22629 |
); |
| 22630 |
} |
| 22631 |
function DateTime({ |
| 22632 |
data, |
| 22633 |
field, |
| 22634 |
onChange, |
| 22635 |
hideLabelFromVision, |
| 22636 |
markWhenOptional, |
| 22637 |
operator, |
| 22638 |
validity, |
| 22639 |
config |
| 22640 |
}) { |
| 22641 |
if (operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER) { |
| 22642 |
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)( |
| 22643 |
RelativeDateControl, |
| 22644 |
{ |
| 22645 |
className: "dataviews-controls__datetime", |
| 22646 |
data, |
| 22647 |
field, |
| 22648 |
onChange, |
| 22649 |
hideLabelFromVision, |
| 22650 |
operator |
| 22651 |
} |
| 22652 |
); |
| 22653 |
} |
| 22654 |
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)( |
| 22655 |
CalendarDateTimeControl, |
| 22656 |
{ |
| 22657 |
data, |
| 22658 |
field, |
| 22659 |
onChange, |
| 22660 |
hideLabelFromVision, |
| 22661 |
markWhenOptional, |
| 22662 |
validity, |
| 22663 |
config |
| 22664 |
} |
| 22665 |
); |
| 22666 |
} |
| 22667 |
|
| 22668 |
// packages/dataviews/build-module/components/dataform-controls/date.mjs |
| 22669 |
var import_components32 = __toESM(require_components(), 1); |
| 22670 |
var import_element59 = __toESM(require_element(), 1); |
| 22671 |
var import_i18n40 = __toESM(require_i18n(), 1); |
| 22672 |
var import_date4 = __toESM(require_date(), 1); |
| 22673 |
var import_jsx_runtime95 = __toESM(require_jsx_runtime(), 1); |
| 22674 |
var { DateCalendar: DateCalendar2, DateRangeCalendar } = unlock2(import_components32.privateApis); |
| 22675 |
var DATE_PRESETS = [ |
| 22676 |
{ |
| 22677 |
id: "today", |
| 22678 |
label: (0, import_i18n40.__)("Today"), |
| 22679 |
getValue: () => (0, import_date4.getDate)(null) |
| 22680 |
}, |
| 22681 |
{ |
| 22682 |
id: "yesterday", |
| 22683 |
label: (0, import_i18n40.__)("Yesterday"), |
| 22684 |
getValue: () => { |
| 22685 |
const today = (0, import_date4.getDate)(null); |
| 22686 |
return subDays(today, 1); |
| 22687 |
} |
| 22688 |
}, |
| 22689 |
{ |
| 22690 |
id: "past-week", |
| 22691 |
label: (0, import_i18n40.__)("Past week"), |
| 22692 |
getValue: () => { |
| 22693 |
const today = (0, import_date4.getDate)(null); |
| 22694 |
return subDays(today, 7); |
| 22695 |
} |
| 22696 |
}, |
| 22697 |
{ |
| 22698 |
id: "past-month", |
| 22699 |
label: (0, import_i18n40.__)("Past month"), |
| 22700 |
getValue: () => { |
| 22701 |
const today = (0, import_date4.getDate)(null); |
| 22702 |
return subMonths(today, 1); |
| 22703 |
} |
| 22704 |
} |
| 22705 |
]; |
| 22706 |
var DATE_RANGE_PRESETS = [ |
| 22707 |
{ |
| 22708 |
id: "last-7-days", |
| 22709 |
label: (0, import_i18n40.__)("Last 7 days"), |
| 22710 |
getValue: () => { |
| 22711 |
const today = (0, import_date4.getDate)(null); |
| 22712 |
return [subDays(today, 7), today]; |
| 22713 |
} |
| 22714 |
}, |
| 22715 |
{ |
| 22716 |
id: "last-30-days", |
| 22717 |
label: (0, import_i18n40.__)("Last 30 days"), |
| 22718 |
getValue: () => { |
| 22719 |
const today = (0, import_date4.getDate)(null); |
| 22720 |
return [subDays(today, 30), today]; |
| 22721 |
} |
| 22722 |
}, |
| 22723 |
{ |
| 22724 |
id: "month-to-date", |
| 22725 |
label: (0, import_i18n40.__)("Month to date"), |
| 22726 |
getValue: () => { |
| 22727 |
const today = (0, import_date4.getDate)(null); |
| 22728 |
return [startOfMonth(today), today]; |
| 22729 |
} |
| 22730 |
}, |
| 22731 |
{ |
| 22732 |
id: "last-year", |
| 22733 |
label: (0, import_i18n40.__)("Last year"), |
| 22734 |
getValue: () => { |
| 22735 |
const today = (0, import_date4.getDate)(null); |
| 22736 |
return [subYears(today, 1), today]; |
| 22737 |
} |
| 22738 |
}, |
| 22739 |
{ |
| 22740 |
id: "year-to-date", |
| 22741 |
label: (0, import_i18n40.__)("Year to date"), |
| 22742 |
getValue: () => { |
| 22743 |
const today = (0, import_date4.getDate)(null); |
| 22744 |
return [startOfYear(today), today]; |
| 22745 |
} |
| 22746 |
} |
| 22747 |
]; |
| 22748 |
var parseDate = (dateString) => { |
| 22749 |
if (!dateString) { |
| 22750 |
return null; |
| 22751 |
} |
| 22752 |
const parsed = (0, import_date4.getDate)(dateString); |
| 22753 |
return parsed && isValid(parsed) ? parsed : null; |
| 22754 |
}; |
| 22755 |
var formatDate = (date) => { |
| 22756 |
if (!date) { |
| 22757 |
return ""; |
| 22758 |
} |
| 22759 |
return typeof date === "string" ? date : format(date, "yyyy-MM-dd"); |
| 22760 |
}; |
| 22761 |
function ValidatedDateControl({ |
| 22762 |
field, |
| 22763 |
validity, |
| 22764 |
inputRefs, |
| 22765 |
isTouched, |
| 22766 |
setIsTouched, |
| 22767 |
children |
| 22768 |
}) { |
| 22769 |
const { isValid: isValid2 } = field; |
| 22770 |
const [customValidity, setCustomValidity] = (0, import_element59.useState)(void 0); |
| 22771 |
const validateRefs = (0, import_element59.useCallback)(() => { |
| 22772 |
const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; |
| 22773 |
for (const ref of refs) { |
| 22774 |
const input = ref.current; |
| 22775 |
if (input && !input.validity.valid) { |
| 22776 |
setCustomValidity({ |
| 22777 |
type: "invalid", |
| 22778 |
message: input.validationMessage |
| 22779 |
}); |
| 22780 |
return; |
| 22781 |
} |
| 22782 |
} |
| 22783 |
setCustomValidity(void 0); |
| 22784 |
}, [inputRefs]); |
| 22785 |
(0, import_element59.useEffect)(() => { |
| 22786 |
const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; |
| 22787 |
const result = validity ? getCustomValidity(isValid2, validity) : void 0; |
| 22788 |
for (const ref of refs) { |
| 22789 |
const input = ref.current; |
| 22790 |
if (input) { |
| 22791 |
input.setCustomValidity( |
| 22792 |
result?.type === "invalid" && result.message ? result.message : "" |
| 22793 |
); |
| 22794 |
} |
| 22795 |
} |
| 22796 |
}, [inputRefs, isValid2, validity]); |
| 22797 |
(0, import_element59.useEffect)(() => { |
| 22798 |
const refs = Array.isArray(inputRefs) ? inputRefs : [inputRefs]; |
| 22799 |
const handleInvalid = (event) => { |
| 22800 |
event.preventDefault(); |
| 22801 |
setIsTouched(true); |
| 22802 |
}; |
| 22803 |
for (const ref of refs) { |
| 22804 |
ref.current?.addEventListener("invalid", handleInvalid); |
| 22805 |
} |
| 22806 |
return () => { |
| 22807 |
for (const ref of refs) { |
| 22808 |
ref.current?.removeEventListener("invalid", handleInvalid); |
| 22809 |
} |
| 22810 |
}; |
| 22811 |
}, [inputRefs, setIsTouched]); |
| 22812 |
(0, import_element59.useEffect)(() => { |
| 22813 |
if (!isTouched) { |
| 22814 |
return; |
| 22815 |
} |
| 22816 |
const result = validity ? getCustomValidity(isValid2, validity) : void 0; |
| 22817 |
if (result) { |
| 22818 |
setCustomValidity(result); |
| 22819 |
} else { |
| 22820 |
validateRefs(); |
| 22821 |
} |
| 22822 |
}, [isTouched, isValid2, validity, validateRefs]); |
| 22823 |
const onBlur = (event) => { |
| 22824 |
if (isTouched) { |
| 22825 |
return; |
| 22826 |
} |
| 22827 |
if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) { |
| 22828 |
setIsTouched(true); |
| 22829 |
} |
| 22830 |
}; |
| 22831 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { onBlur, children: [ |
| 22832 |
children, |
| 22833 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { "aria-live": "polite", children: customValidity && /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)( |
| 22834 |
"p", |
| 22835 |
{ |
| 22836 |
className: clsx_default( |
| 22837 |
"components-validated-control__indicator", |
| 22838 |
customValidity.type === "invalid" ? "is-invalid" : void 0 |
| 22839 |
), |
| 22840 |
children: [ |
| 22841 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22842 |
import_components32.Icon, |
| 22843 |
{ |
| 22844 |
className: "components-validated-control__indicator-icon", |
| 22845 |
icon: error_default, |
| 22846 |
size: 16, |
| 22847 |
fill: "currentColor" |
| 22848 |
} |
| 22849 |
), |
| 22850 |
customValidity.message |
| 22851 |
] |
| 22852 |
} |
| 22853 |
) }) |
| 22854 |
] }); |
| 22855 |
} |
| 22856 |
function CalendarDateControl({ |
| 22857 |
data, |
| 22858 |
field, |
| 22859 |
onChange, |
| 22860 |
hideLabelFromVision, |
| 22861 |
markWhenOptional, |
| 22862 |
validity |
| 22863 |
}) { |
| 22864 |
const { |
| 22865 |
id, |
| 22866 |
label, |
| 22867 |
description, |
| 22868 |
setValue, |
| 22869 |
getValue, |
| 22870 |
isValid: isValid2, |
| 22871 |
format: fieldFormat |
| 22872 |
} = field; |
| 22873 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 22874 |
const [selectedPresetId, setSelectedPresetId] = (0, import_element59.useState)( |
| 22875 |
null |
| 22876 |
); |
| 22877 |
const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date4.getSettings)().l10n.startOfWeek; |
| 22878 |
const fieldValue = getValue({ item: data }); |
| 22879 |
const value = typeof fieldValue === "string" ? fieldValue : void 0; |
| 22880 |
const [calendarMonth, setCalendarMonth] = (0, import_element59.useState)(() => { |
| 22881 |
const parsedDate = parseDate(value); |
| 22882 |
return parsedDate || /* @__PURE__ */ new Date(); |
| 22883 |
}); |
| 22884 |
const [isTouched, setIsTouched] = (0, import_element59.useState)(false); |
| 22885 |
const validityTargetRef = (0, import_element59.useRef)(null); |
| 22886 |
const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDate); |
| 22887 |
const onChangeCallback = (0, import_element59.useCallback)( |
| 22888 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 22889 |
[data, onChange, setValue] |
| 22890 |
); |
| 22891 |
const onSelectDate = (0, import_element59.useCallback)( |
| 22892 |
(newDate) => { |
| 22893 |
const dateValue = newDate ? format(newDate, "yyyy-MM-dd") : void 0; |
| 22894 |
onChangeCallback(dateValue); |
| 22895 |
setSelectedPresetId(null); |
| 22896 |
setIsTouched(true); |
| 22897 |
}, |
| 22898 |
[onChangeCallback] |
| 22899 |
); |
| 22900 |
const handlePresetClick = (0, import_element59.useCallback)( |
| 22901 |
(preset) => { |
| 22902 |
const presetDate = preset.getValue(); |
| 22903 |
const dateValue = formatDate(presetDate); |
| 22904 |
setCalendarMonth(presetDate); |
| 22905 |
onChangeCallback(dateValue); |
| 22906 |
setSelectedPresetId(preset.id); |
| 22907 |
setIsTouched(true); |
| 22908 |
}, |
| 22909 |
[onChangeCallback] |
| 22910 |
); |
| 22911 |
const handleManualDateChange = (0, import_element59.useCallback)( |
| 22912 |
(newValue) => { |
| 22913 |
onChangeCallback(newValue); |
| 22914 |
if (newValue) { |
| 22915 |
const parsedDate = parseDate(newValue); |
| 22916 |
if (parsedDate) { |
| 22917 |
setCalendarMonth(parsedDate); |
| 22918 |
} |
| 22919 |
} |
| 22920 |
setSelectedPresetId(null); |
| 22921 |
setIsTouched(true); |
| 22922 |
}, |
| 22923 |
[onChangeCallback] |
| 22924 |
); |
| 22925 |
const { |
| 22926 |
timezone: { string: timezoneString } |
| 22927 |
} = (0, import_date4.getSettings)(); |
| 22928 |
let displayLabel = label; |
| 22929 |
if (isValid2?.required && !markWhenOptional) { |
| 22930 |
displayLabel = `${label} (${(0, import_i18n40.__)("Required")})`; |
| 22931 |
} else if (!isValid2?.required && markWhenOptional) { |
| 22932 |
displayLabel = `${label} (${(0, import_i18n40.__)("Optional")})`; |
| 22933 |
} |
| 22934 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22935 |
ValidatedDateControl, |
| 22936 |
{ |
| 22937 |
field, |
| 22938 |
validity, |
| 22939 |
inputRefs: validityTargetRef, |
| 22940 |
isTouched, |
| 22941 |
setIsTouched, |
| 22942 |
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22943 |
import_components32.BaseControl, |
| 22944 |
{ |
| 22945 |
id, |
| 22946 |
className: "dataviews-controls__date", |
| 22947 |
label: displayLabel, |
| 22948 |
help: description, |
| 22949 |
hideLabelFromVision, |
| 22950 |
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(Stack, { direction: "column", gap: "lg", children: [ |
| 22951 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)( |
| 22952 |
Stack, |
| 22953 |
{ |
| 22954 |
direction: "row", |
| 22955 |
gap: "sm", |
| 22956 |
wrap: "wrap", |
| 22957 |
justify: "flex-start", |
| 22958 |
children: [ |
| 22959 |
DATE_PRESETS.map((preset) => { |
| 22960 |
const isSelected2 = selectedPresetId === preset.id; |
| 22961 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22962 |
import_components32.Button, |
| 22963 |
{ |
| 22964 |
className: "dataviews-controls__date-preset", |
| 22965 |
variant: "tertiary", |
| 22966 |
isPressed: isSelected2, |
| 22967 |
size: "small", |
| 22968 |
disabled: disabled2, |
| 22969 |
accessibleWhenDisabled: true, |
| 22970 |
onClick: () => handlePresetClick(preset), |
| 22971 |
children: preset.label |
| 22972 |
}, |
| 22973 |
preset.id |
| 22974 |
); |
| 22975 |
}), |
| 22976 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22977 |
import_components32.Button, |
| 22978 |
{ |
| 22979 |
className: "dataviews-controls__date-preset", |
| 22980 |
variant: "tertiary", |
| 22981 |
isPressed: !selectedPresetId, |
| 22982 |
size: "small", |
| 22983 |
disabled: !!selectedPresetId || disabled2, |
| 22984 |
accessibleWhenDisabled: true, |
| 22985 |
children: (0, import_i18n40.__)("Custom") |
| 22986 |
} |
| 22987 |
) |
| 22988 |
] |
| 22989 |
} |
| 22990 |
), |
| 22991 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 22992 |
import_components32.__experimentalInputControl, |
| 22993 |
{ |
| 22994 |
__next40pxDefaultSize: true, |
| 22995 |
ref: validityTargetRef, |
| 22996 |
type: "date", |
| 22997 |
label: (0, import_i18n40.__)("Date"), |
| 22998 |
hideLabelFromVision: true, |
| 22999 |
value, |
| 23000 |
onChange: handleManualDateChange, |
| 23001 |
required: !!field.isValid?.required, |
| 23002 |
disabled: disabled2, |
| 23003 |
min: minConstraint, |
| 23004 |
max: maxConstraint |
| 23005 |
} |
| 23006 |
), |
| 23007 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23008 |
DateCalendar2, |
| 23009 |
{ |
| 23010 |
style: { width: "100%" }, |
| 23011 |
selected: value ? parseDate(value) || void 0 : void 0, |
| 23012 |
onSelect: onSelectDate, |
| 23013 |
month: calendarMonth, |
| 23014 |
onMonthChange: setCalendarMonth, |
| 23015 |
timeZone: timezoneString || void 0, |
| 23016 |
weekStartsOn, |
| 23017 |
disabled: disabled2 || disabledMatchers, |
| 23018 |
disableNavigation: disabled2 |
| 23019 |
} |
| 23020 |
) |
| 23021 |
] }) |
| 23022 |
} |
| 23023 |
) |
| 23024 |
} |
| 23025 |
); |
| 23026 |
} |
| 23027 |
function CalendarDateRangeControl({ |
| 23028 |
data, |
| 23029 |
field, |
| 23030 |
onChange, |
| 23031 |
hideLabelFromVision, |
| 23032 |
markWhenOptional, |
| 23033 |
validity |
| 23034 |
}) { |
| 23035 |
const { |
| 23036 |
id, |
| 23037 |
label, |
| 23038 |
description, |
| 23039 |
getValue, |
| 23040 |
setValue, |
| 23041 |
isValid: isValid2, |
| 23042 |
format: fieldFormat |
| 23043 |
} = field; |
| 23044 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23045 |
let value; |
| 23046 |
const fieldValue = getValue({ item: data }); |
| 23047 |
if (Array.isArray(fieldValue) && fieldValue.length === 2 && fieldValue.every((date) => typeof date === "string")) { |
| 23048 |
value = fieldValue; |
| 23049 |
} |
| 23050 |
const weekStartsOn = fieldFormat.weekStartsOn ?? (0, import_date4.getSettings)().l10n.startOfWeek; |
| 23051 |
const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid2, parseDate); |
| 23052 |
const onChangeCallback = (0, import_element59.useCallback)( |
| 23053 |
(newValue) => { |
| 23054 |
onChange( |
| 23055 |
setValue({ |
| 23056 |
item: data, |
| 23057 |
value: newValue |
| 23058 |
}) |
| 23059 |
); |
| 23060 |
}, |
| 23061 |
[data, onChange, setValue] |
| 23062 |
); |
| 23063 |
const [selectedPresetId, setSelectedPresetId] = (0, import_element59.useState)( |
| 23064 |
null |
| 23065 |
); |
| 23066 |
const selectedRange = (0, import_element59.useMemo)(() => { |
| 23067 |
if (!value) { |
| 23068 |
return { from: void 0, to: void 0 }; |
| 23069 |
} |
| 23070 |
const [from, to] = value; |
| 23071 |
return { |
| 23072 |
from: parseDate(from) || void 0, |
| 23073 |
to: parseDate(to) || void 0 |
| 23074 |
}; |
| 23075 |
}, [value]); |
| 23076 |
const [calendarMonth, setCalendarMonth] = (0, import_element59.useState)(() => { |
| 23077 |
return selectedRange.from || /* @__PURE__ */ new Date(); |
| 23078 |
}); |
| 23079 |
const [isTouched, setIsTouched] = (0, import_element59.useState)(false); |
| 23080 |
const fromInputRef = (0, import_element59.useRef)(null); |
| 23081 |
const toInputRef = (0, import_element59.useRef)(null); |
| 23082 |
const updateDateRange = (0, import_element59.useCallback)( |
| 23083 |
(fromDate, toDate2) => { |
| 23084 |
if (fromDate && toDate2) { |
| 23085 |
onChangeCallback([ |
| 23086 |
formatDate(fromDate), |
| 23087 |
formatDate(toDate2) |
| 23088 |
]); |
| 23089 |
} else if (!fromDate && !toDate2) { |
| 23090 |
onChangeCallback(void 0); |
| 23091 |
} |
| 23092 |
}, |
| 23093 |
[onChangeCallback] |
| 23094 |
); |
| 23095 |
const onSelectCalendarRange = (0, import_element59.useCallback)( |
| 23096 |
(newRange) => { |
| 23097 |
updateDateRange(newRange?.from, newRange?.to); |
| 23098 |
setSelectedPresetId(null); |
| 23099 |
setIsTouched(true); |
| 23100 |
}, |
| 23101 |
[updateDateRange] |
| 23102 |
); |
| 23103 |
const handlePresetClick = (0, import_element59.useCallback)( |
| 23104 |
(preset) => { |
| 23105 |
const [startDate, endDate] = preset.getValue(); |
| 23106 |
setCalendarMonth(startDate); |
| 23107 |
updateDateRange(startDate, endDate); |
| 23108 |
setSelectedPresetId(preset.id); |
| 23109 |
setIsTouched(true); |
| 23110 |
}, |
| 23111 |
[updateDateRange] |
| 23112 |
); |
| 23113 |
const handleManualDateChange = (0, import_element59.useCallback)( |
| 23114 |
(fromOrTo, newValue) => { |
| 23115 |
const [currentFrom, currentTo] = value || [ |
| 23116 |
void 0, |
| 23117 |
void 0 |
| 23118 |
]; |
| 23119 |
const updatedFrom = fromOrTo === "from" ? newValue : currentFrom; |
| 23120 |
const updatedTo = fromOrTo === "to" ? newValue : currentTo; |
| 23121 |
updateDateRange(updatedFrom, updatedTo); |
| 23122 |
if (newValue) { |
| 23123 |
const parsedDate = parseDate(newValue); |
| 23124 |
if (parsedDate) { |
| 23125 |
setCalendarMonth(parsedDate); |
| 23126 |
} |
| 23127 |
} |
| 23128 |
setSelectedPresetId(null); |
| 23129 |
setIsTouched(true); |
| 23130 |
}, |
| 23131 |
[value, updateDateRange] |
| 23132 |
); |
| 23133 |
const { timezone } = (0, import_date4.getSettings)(); |
| 23134 |
let displayLabel = label; |
| 23135 |
if (field.isValid?.required && !markWhenOptional) { |
| 23136 |
displayLabel = `${label} (${(0, import_i18n40.__)("Required")})`; |
| 23137 |
} else if (!field.isValid?.required && markWhenOptional) { |
| 23138 |
displayLabel = `${label} (${(0, import_i18n40.__)("Optional")})`; |
| 23139 |
} |
| 23140 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23141 |
ValidatedDateControl, |
| 23142 |
{ |
| 23143 |
field, |
| 23144 |
validity, |
| 23145 |
inputRefs: [fromInputRef, toInputRef], |
| 23146 |
isTouched, |
| 23147 |
setIsTouched, |
| 23148 |
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23149 |
import_components32.BaseControl, |
| 23150 |
{ |
| 23151 |
id, |
| 23152 |
className: "dataviews-controls__date", |
| 23153 |
label: displayLabel, |
| 23154 |
help: description, |
| 23155 |
hideLabelFromVision, |
| 23156 |
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(Stack, { direction: "column", gap: "lg", children: [ |
| 23157 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)( |
| 23158 |
Stack, |
| 23159 |
{ |
| 23160 |
direction: "row", |
| 23161 |
gap: "sm", |
| 23162 |
wrap: "wrap", |
| 23163 |
justify: "flex-start", |
| 23164 |
children: [ |
| 23165 |
DATE_RANGE_PRESETS.map((preset) => { |
| 23166 |
const isSelected2 = selectedPresetId === preset.id; |
| 23167 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23168 |
import_components32.Button, |
| 23169 |
{ |
| 23170 |
className: "dataviews-controls__date-preset", |
| 23171 |
variant: "tertiary", |
| 23172 |
isPressed: isSelected2, |
| 23173 |
size: "small", |
| 23174 |
disabled: disabled2, |
| 23175 |
accessibleWhenDisabled: true, |
| 23176 |
onClick: () => handlePresetClick(preset), |
| 23177 |
children: preset.label |
| 23178 |
}, |
| 23179 |
preset.id |
| 23180 |
); |
| 23181 |
}), |
| 23182 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23183 |
import_components32.Button, |
| 23184 |
{ |
| 23185 |
className: "dataviews-controls__date-preset", |
| 23186 |
variant: "tertiary", |
| 23187 |
isPressed: !selectedPresetId, |
| 23188 |
size: "small", |
| 23189 |
accessibleWhenDisabled: true, |
| 23190 |
disabled: !!selectedPresetId || disabled2, |
| 23191 |
children: (0, import_i18n40.__)("Custom") |
| 23192 |
} |
| 23193 |
) |
| 23194 |
] |
| 23195 |
} |
| 23196 |
), |
| 23197 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)( |
| 23198 |
Stack, |
| 23199 |
{ |
| 23200 |
direction: "row", |
| 23201 |
gap: "sm", |
| 23202 |
justify: "space-between", |
| 23203 |
className: "dataviews-controls__date-range-inputs", |
| 23204 |
children: [ |
| 23205 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23206 |
import_components32.__experimentalInputControl, |
| 23207 |
{ |
| 23208 |
__next40pxDefaultSize: true, |
| 23209 |
ref: fromInputRef, |
| 23210 |
type: "date", |
| 23211 |
label: (0, import_i18n40.__)("From"), |
| 23212 |
hideLabelFromVision: true, |
| 23213 |
value: value?.[0], |
| 23214 |
onChange: (newValue) => handleManualDateChange("from", newValue), |
| 23215 |
required: !!field.isValid?.required, |
| 23216 |
disabled: disabled2, |
| 23217 |
min: minConstraint, |
| 23218 |
max: maxConstraint |
| 23219 |
} |
| 23220 |
), |
| 23221 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23222 |
import_components32.__experimentalInputControl, |
| 23223 |
{ |
| 23224 |
__next40pxDefaultSize: true, |
| 23225 |
ref: toInputRef, |
| 23226 |
type: "date", |
| 23227 |
label: (0, import_i18n40.__)("To"), |
| 23228 |
hideLabelFromVision: true, |
| 23229 |
value: value?.[1], |
| 23230 |
onChange: (newValue) => handleManualDateChange("to", newValue), |
| 23231 |
required: !!field.isValid?.required, |
| 23232 |
disabled: disabled2, |
| 23233 |
min: minConstraint, |
| 23234 |
max: maxConstraint |
| 23235 |
} |
| 23236 |
) |
| 23237 |
] |
| 23238 |
} |
| 23239 |
), |
| 23240 |
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23241 |
DateRangeCalendar, |
| 23242 |
{ |
| 23243 |
style: { width: "100%" }, |
| 23244 |
selected: selectedRange, |
| 23245 |
onSelect: onSelectCalendarRange, |
| 23246 |
month: calendarMonth, |
| 23247 |
onMonthChange: setCalendarMonth, |
| 23248 |
timeZone: timezone.string || void 0, |
| 23249 |
weekStartsOn, |
| 23250 |
disabled: disabled2 || disabledMatchers |
| 23251 |
} |
| 23252 |
) |
| 23253 |
] }) |
| 23254 |
} |
| 23255 |
) |
| 23256 |
} |
| 23257 |
); |
| 23258 |
} |
| 23259 |
function DateControl({ |
| 23260 |
data, |
| 23261 |
field, |
| 23262 |
onChange, |
| 23263 |
hideLabelFromVision, |
| 23264 |
markWhenOptional, |
| 23265 |
operator, |
| 23266 |
validity |
| 23267 |
}) { |
| 23268 |
if (operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER) { |
| 23269 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23270 |
RelativeDateControl, |
| 23271 |
{ |
| 23272 |
className: "dataviews-controls__date", |
| 23273 |
data, |
| 23274 |
field, |
| 23275 |
onChange, |
| 23276 |
hideLabelFromVision, |
| 23277 |
operator |
| 23278 |
} |
| 23279 |
); |
| 23280 |
} |
| 23281 |
if (operator === OPERATOR_BETWEEN) { |
| 23282 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23283 |
CalendarDateRangeControl, |
| 23284 |
{ |
| 23285 |
data, |
| 23286 |
field, |
| 23287 |
onChange, |
| 23288 |
hideLabelFromVision, |
| 23289 |
markWhenOptional, |
| 23290 |
validity |
| 23291 |
} |
| 23292 |
); |
| 23293 |
} |
| 23294 |
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)( |
| 23295 |
CalendarDateControl, |
| 23296 |
{ |
| 23297 |
data, |
| 23298 |
field, |
| 23299 |
onChange, |
| 23300 |
hideLabelFromVision, |
| 23301 |
markWhenOptional, |
| 23302 |
validity |
| 23303 |
} |
| 23304 |
); |
| 23305 |
} |
| 23306 |
|
| 23307 |
// packages/dataviews/build-module/components/dataform-controls/select.mjs |
| 23308 |
var import_components33 = __toESM(require_components(), 1); |
| 23309 |
var import_element60 = __toESM(require_element(), 1); |
| 23310 |
var import_jsx_runtime96 = __toESM(require_jsx_runtime(), 1); |
| 23311 |
var { ValidatedSelectControl } = unlock2(import_components33.privateApis); |
| 23312 |
function Select({ |
| 23313 |
data, |
| 23314 |
field, |
| 23315 |
onChange, |
| 23316 |
hideLabelFromVision, |
| 23317 |
markWhenOptional, |
| 23318 |
validity |
| 23319 |
}) { |
| 23320 |
const { type, label, description, getValue, setValue, isValid: isValid2 } = field; |
| 23321 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23322 |
const isMultiple = type === "array"; |
| 23323 |
const value = getValue({ item: data }) ?? (isMultiple ? [] : ""); |
| 23324 |
const onChangeControl = (0, import_element60.useCallback)( |
| 23325 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 23326 |
[data, onChange, setValue] |
| 23327 |
); |
| 23328 |
const { elements, isLoading } = useElements({ |
| 23329 |
elements: field.elements, |
| 23330 |
getElements: field.getElements |
| 23331 |
}); |
| 23332 |
if (isLoading) { |
| 23333 |
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_components33.Spinner, {}); |
| 23334 |
} |
| 23335 |
return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)( |
| 23336 |
ValidatedSelectControl, |
| 23337 |
{ |
| 23338 |
required: !!field.isValid?.required, |
| 23339 |
markWhenOptional, |
| 23340 |
customValidity: getCustomValidity(isValid2, validity), |
| 23341 |
label, |
| 23342 |
value, |
| 23343 |
help: description, |
| 23344 |
options: elements, |
| 23345 |
onChange: onChangeControl, |
| 23346 |
__next40pxDefaultSize: true, |
| 23347 |
hideLabelFromVision, |
| 23348 |
multiple: isMultiple, |
| 23349 |
disabled: disabled2 |
| 23350 |
} |
| 23351 |
); |
| 23352 |
} |
| 23353 |
|
| 23354 |
// packages/dataviews/build-module/components/dataform-controls/adaptive-select.mjs |
| 23355 |
var import_jsx_runtime97 = __toESM(require_jsx_runtime(), 1); |
| 23356 |
var ELEMENTS_THRESHOLD = 10; |
| 23357 |
function AdaptiveSelect(props) { |
| 23358 |
const { field } = props; |
| 23359 |
const { elements } = useElements({ |
| 23360 |
elements: field.elements, |
| 23361 |
getElements: field.getElements |
| 23362 |
}); |
| 23363 |
if (elements.length >= ELEMENTS_THRESHOLD) { |
| 23364 |
return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(Combobox3, { ...props }); |
| 23365 |
} |
| 23366 |
return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(Select, { ...props }); |
| 23367 |
} |
| 23368 |
|
| 23369 |
// packages/dataviews/build-module/components/dataform-controls/email.mjs |
| 23370 |
var import_components35 = __toESM(require_components(), 1); |
| 23371 |
|
| 23372 |
// packages/dataviews/build-module/components/dataform-controls/utils/validated-input.mjs |
| 23373 |
var import_components34 = __toESM(require_components(), 1); |
| 23374 |
var import_element61 = __toESM(require_element(), 1); |
| 23375 |
var import_jsx_runtime98 = __toESM(require_jsx_runtime(), 1); |
| 23376 |
var { ValidatedInputControl: ValidatedInputControl2 } = unlock2(import_components34.privateApis); |
| 23377 |
function ValidatedText({ |
| 23378 |
data, |
| 23379 |
field, |
| 23380 |
onChange, |
| 23381 |
hideLabelFromVision, |
| 23382 |
markWhenOptional, |
| 23383 |
type, |
| 23384 |
prefix, |
| 23385 |
suffix, |
| 23386 |
validity |
| 23387 |
}) { |
| 23388 |
const { label, placeholder, description, getValue, setValue, isValid: isValid2 } = field; |
| 23389 |
const value = getValue({ item: data }); |
| 23390 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23391 |
const onChangeControl = (0, import_element61.useCallback)( |
| 23392 |
(newValue) => onChange( |
| 23393 |
setValue({ |
| 23394 |
item: data, |
| 23395 |
value: newValue |
| 23396 |
}) |
| 23397 |
), |
| 23398 |
[data, setValue, onChange] |
| 23399 |
); |
| 23400 |
return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)( |
| 23401 |
ValidatedInputControl2, |
| 23402 |
{ |
| 23403 |
required: !!isValid2.required, |
| 23404 |
markWhenOptional, |
| 23405 |
customValidity: getCustomValidity(isValid2, validity), |
| 23406 |
label, |
| 23407 |
placeholder, |
| 23408 |
value: value ?? "", |
| 23409 |
help: description, |
| 23410 |
onChange: onChangeControl, |
| 23411 |
hideLabelFromVision, |
| 23412 |
type, |
| 23413 |
prefix, |
| 23414 |
suffix, |
| 23415 |
disabled: disabled2, |
| 23416 |
pattern: isValid2.pattern ? isValid2.pattern.constraint : void 0, |
| 23417 |
minLength: isValid2.minLength ? isValid2.minLength.constraint : void 0, |
| 23418 |
maxLength: isValid2.maxLength ? isValid2.maxLength.constraint : void 0, |
| 23419 |
__next40pxDefaultSize: true |
| 23420 |
} |
| 23421 |
); |
| 23422 |
} |
| 23423 |
|
| 23424 |
// packages/dataviews/build-module/components/dataform-controls/email.mjs |
| 23425 |
var import_jsx_runtime99 = __toESM(require_jsx_runtime(), 1); |
| 23426 |
function Email({ |
| 23427 |
data, |
| 23428 |
field, |
| 23429 |
onChange, |
| 23430 |
hideLabelFromVision, |
| 23431 |
markWhenOptional, |
| 23432 |
validity |
| 23433 |
}) { |
| 23434 |
return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)( |
| 23435 |
ValidatedText, |
| 23436 |
{ |
| 23437 |
...{ |
| 23438 |
data, |
| 23439 |
field, |
| 23440 |
onChange, |
| 23441 |
hideLabelFromVision, |
| 23442 |
markWhenOptional, |
| 23443 |
validity, |
| 23444 |
type: "email", |
| 23445 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_components35.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_components35.Icon, { icon: envelope_default }) }) |
| 23446 |
} |
| 23447 |
} |
| 23448 |
); |
| 23449 |
} |
| 23450 |
|
| 23451 |
// packages/dataviews/build-module/components/dataform-controls/telephone.mjs |
| 23452 |
var import_components36 = __toESM(require_components(), 1); |
| 23453 |
var import_jsx_runtime100 = __toESM(require_jsx_runtime(), 1); |
| 23454 |
function Telephone({ |
| 23455 |
data, |
| 23456 |
field, |
| 23457 |
onChange, |
| 23458 |
hideLabelFromVision, |
| 23459 |
markWhenOptional, |
| 23460 |
validity |
| 23461 |
}) { |
| 23462 |
return /* @__PURE__ */ (0, import_jsx_runtime100.jsx)( |
| 23463 |
ValidatedText, |
| 23464 |
{ |
| 23465 |
...{ |
| 23466 |
data, |
| 23467 |
field, |
| 23468 |
onChange, |
| 23469 |
hideLabelFromVision, |
| 23470 |
markWhenOptional, |
| 23471 |
validity, |
| 23472 |
type: "tel", |
| 23473 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_components36.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_components36.Icon, { icon: mobile_default }) }) |
| 23474 |
} |
| 23475 |
} |
| 23476 |
); |
| 23477 |
} |
| 23478 |
|
| 23479 |
// packages/dataviews/build-module/components/dataform-controls/url.mjs |
| 23480 |
var import_components37 = __toESM(require_components(), 1); |
| 23481 |
var import_jsx_runtime101 = __toESM(require_jsx_runtime(), 1); |
| 23482 |
function Url({ |
| 23483 |
data, |
| 23484 |
field, |
| 23485 |
onChange, |
| 23486 |
hideLabelFromVision, |
| 23487 |
markWhenOptional, |
| 23488 |
validity |
| 23489 |
}) { |
| 23490 |
return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)( |
| 23491 |
ValidatedText, |
| 23492 |
{ |
| 23493 |
...{ |
| 23494 |
data, |
| 23495 |
field, |
| 23496 |
onChange, |
| 23497 |
hideLabelFromVision, |
| 23498 |
markWhenOptional, |
| 23499 |
validity, |
| 23500 |
type: "url", |
| 23501 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_components37.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_components37.Icon, { icon: link_default }) }) |
| 23502 |
} |
| 23503 |
} |
| 23504 |
); |
| 23505 |
} |
| 23506 |
|
| 23507 |
// packages/dataviews/build-module/components/dataform-controls/utils/validated-number.mjs |
| 23508 |
var import_components38 = __toESM(require_components(), 1); |
| 23509 |
var import_element62 = __toESM(require_element(), 1); |
| 23510 |
var import_i18n41 = __toESM(require_i18n(), 1); |
| 23511 |
var import_jsx_runtime102 = __toESM(require_jsx_runtime(), 1); |
| 23512 |
var { ValidatedNumberControl } = unlock2(import_components38.privateApis); |
| 23513 |
function toNumberOrEmpty(value) { |
| 23514 |
if (value === "" || value === void 0) { |
| 23515 |
return ""; |
| 23516 |
} |
| 23517 |
const number = Number(value); |
| 23518 |
return Number.isFinite(number) ? number : ""; |
| 23519 |
} |
| 23520 |
function BetweenControls({ |
| 23521 |
value, |
| 23522 |
onChange, |
| 23523 |
hideLabelFromVision, |
| 23524 |
step |
| 23525 |
}) { |
| 23526 |
const [min2 = "", max2 = ""] = value; |
| 23527 |
const onChangeMin = (0, import_element62.useCallback)( |
| 23528 |
(newValue) => onChange([toNumberOrEmpty(newValue), max2]), |
| 23529 |
[onChange, max2] |
| 23530 |
); |
| 23531 |
const onChangeMax = (0, import_element62.useCallback)( |
| 23532 |
(newValue) => onChange([min2, toNumberOrEmpty(newValue)]), |
| 23533 |
[onChange, min2] |
| 23534 |
); |
| 23535 |
return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)( |
| 23536 |
import_components38.BaseControl, |
| 23537 |
{ |
| 23538 |
help: (0, import_i18n41.__)("The max. value must be greater than the min. value."), |
| 23539 |
children: /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_components38.Flex, { direction: "row", gap: 4, children: [ |
| 23540 |
/* @__PURE__ */ (0, import_jsx_runtime102.jsx)( |
| 23541 |
import_components38.__experimentalNumberControl, |
| 23542 |
{ |
| 23543 |
label: (0, import_i18n41.__)("Min."), |
| 23544 |
value: min2, |
| 23545 |
max: max2 ? Number(max2) - step : void 0, |
| 23546 |
onChange: onChangeMin, |
| 23547 |
__next40pxDefaultSize: true, |
| 23548 |
hideLabelFromVision, |
| 23549 |
step |
| 23550 |
} |
| 23551 |
), |
| 23552 |
/* @__PURE__ */ (0, import_jsx_runtime102.jsx)( |
| 23553 |
import_components38.__experimentalNumberControl, |
| 23554 |
{ |
| 23555 |
label: (0, import_i18n41.__)("Max."), |
| 23556 |
value: max2, |
| 23557 |
min: min2 ? Number(min2) + step : void 0, |
| 23558 |
onChange: onChangeMax, |
| 23559 |
__next40pxDefaultSize: true, |
| 23560 |
hideLabelFromVision, |
| 23561 |
step |
| 23562 |
} |
| 23563 |
) |
| 23564 |
] }) |
| 23565 |
} |
| 23566 |
); |
| 23567 |
} |
| 23568 |
function ValidatedNumber({ |
| 23569 |
data, |
| 23570 |
field, |
| 23571 |
onChange, |
| 23572 |
hideLabelFromVision, |
| 23573 |
markWhenOptional, |
| 23574 |
operator, |
| 23575 |
validity |
| 23576 |
}) { |
| 23577 |
const decimals = field.format?.decimals ?? 0; |
| 23578 |
const step = Math.pow(10, Math.abs(decimals) * -1); |
| 23579 |
const { label, description, getValue, setValue, isValid: isValid2 } = field; |
| 23580 |
const value = getValue({ item: data }) ?? ""; |
| 23581 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23582 |
const onChangeControl = (0, import_element62.useCallback)( |
| 23583 |
(newValue) => { |
| 23584 |
onChange( |
| 23585 |
setValue({ |
| 23586 |
item: data, |
| 23587 |
// Do not convert an empty string or undefined to a number, |
| 23588 |
// otherwise there's a mismatch between the UI control (empty) |
| 23589 |
// and the data relied by onChange (0). |
| 23590 |
value: ["", void 0].includes(newValue) ? void 0 : Number(newValue) |
| 23591 |
}) |
| 23592 |
); |
| 23593 |
}, |
| 23594 |
[data, onChange, setValue] |
| 23595 |
); |
| 23596 |
const onChangeBetweenControls = (0, import_element62.useCallback)( |
| 23597 |
(newValue) => { |
| 23598 |
onChange( |
| 23599 |
setValue({ |
| 23600 |
item: data, |
| 23601 |
value: newValue |
| 23602 |
}) |
| 23603 |
); |
| 23604 |
}, |
| 23605 |
[data, onChange, setValue] |
| 23606 |
); |
| 23607 |
if (operator === OPERATOR_BETWEEN) { |
| 23608 |
let valueBetween = ["", ""]; |
| 23609 |
if (Array.isArray(value) && value.length === 2 && value.every( |
| 23610 |
(element) => typeof element === "number" || element === "" |
| 23611 |
)) { |
| 23612 |
valueBetween = value; |
| 23613 |
} |
| 23614 |
return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)( |
| 23615 |
BetweenControls, |
| 23616 |
{ |
| 23617 |
value: valueBetween, |
| 23618 |
onChange: onChangeBetweenControls, |
| 23619 |
hideLabelFromVision, |
| 23620 |
step |
| 23621 |
} |
| 23622 |
); |
| 23623 |
} |
| 23624 |
return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)( |
| 23625 |
ValidatedNumberControl, |
| 23626 |
{ |
| 23627 |
required: !!isValid2.required, |
| 23628 |
markWhenOptional, |
| 23629 |
customValidity: getCustomValidity(isValid2, validity), |
| 23630 |
label, |
| 23631 |
help: description, |
| 23632 |
value, |
| 23633 |
onChange: onChangeControl, |
| 23634 |
__next40pxDefaultSize: true, |
| 23635 |
hideLabelFromVision, |
| 23636 |
step, |
| 23637 |
min: isValid2.min ? isValid2.min.constraint : void 0, |
| 23638 |
max: isValid2.max ? isValid2.max.constraint : void 0, |
| 23639 |
disabled: disabled2 |
| 23640 |
} |
| 23641 |
); |
| 23642 |
} |
| 23643 |
|
| 23644 |
// packages/dataviews/build-module/components/dataform-controls/integer.mjs |
| 23645 |
var import_jsx_runtime103 = __toESM(require_jsx_runtime(), 1); |
| 23646 |
function Integer(props) { |
| 23647 |
return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(ValidatedNumber, { ...props }); |
| 23648 |
} |
| 23649 |
|
| 23650 |
// packages/dataviews/build-module/components/dataform-controls/number.mjs |
| 23651 |
var import_jsx_runtime104 = __toESM(require_jsx_runtime(), 1); |
| 23652 |
function Number2(props) { |
| 23653 |
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(ValidatedNumber, { ...props }); |
| 23654 |
} |
| 23655 |
|
| 23656 |
// packages/dataviews/build-module/components/dataform-controls/radio.mjs |
| 23657 |
var import_components39 = __toESM(require_components(), 1); |
| 23658 |
var import_element63 = __toESM(require_element(), 1); |
| 23659 |
var import_jsx_runtime105 = __toESM(require_jsx_runtime(), 1); |
| 23660 |
var { ValidatedRadioControl } = unlock2(import_components39.privateApis); |
| 23661 |
function Radio({ |
| 23662 |
data, |
| 23663 |
field, |
| 23664 |
onChange, |
| 23665 |
hideLabelFromVision, |
| 23666 |
markWhenOptional, |
| 23667 |
validity |
| 23668 |
}) { |
| 23669 |
const { label, description, getValue, setValue, isValid: isValid2 } = field; |
| 23670 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23671 |
const { elements, isLoading } = useElements({ |
| 23672 |
elements: field.elements, |
| 23673 |
getElements: field.getElements |
| 23674 |
}); |
| 23675 |
const value = getValue({ item: data }); |
| 23676 |
const onChangeControl = (0, import_element63.useCallback)( |
| 23677 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 23678 |
[data, onChange, setValue] |
| 23679 |
); |
| 23680 |
if (isLoading) { |
| 23681 |
return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_components39.Spinner, {}); |
| 23682 |
} |
| 23683 |
return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)( |
| 23684 |
ValidatedRadioControl, |
| 23685 |
{ |
| 23686 |
required: !!field.isValid?.required, |
| 23687 |
markWhenOptional, |
| 23688 |
customValidity: getCustomValidity(isValid2, validity), |
| 23689 |
label, |
| 23690 |
help: description, |
| 23691 |
onChange: onChangeControl, |
| 23692 |
options: elements, |
| 23693 |
selected: value, |
| 23694 |
hideLabelFromVision, |
| 23695 |
disabled: disabled2 |
| 23696 |
} |
| 23697 |
); |
| 23698 |
} |
| 23699 |
|
| 23700 |
// packages/dataviews/build-module/components/dataform-controls/text.mjs |
| 23701 |
var import_element64 = __toESM(require_element(), 1); |
| 23702 |
var import_jsx_runtime106 = __toESM(require_jsx_runtime(), 1); |
| 23703 |
function Text({ |
| 23704 |
data, |
| 23705 |
field, |
| 23706 |
onChange, |
| 23707 |
hideLabelFromVision, |
| 23708 |
markWhenOptional, |
| 23709 |
config, |
| 23710 |
validity |
| 23711 |
}) { |
| 23712 |
const { prefix, suffix } = config || {}; |
| 23713 |
return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)( |
| 23714 |
ValidatedText, |
| 23715 |
{ |
| 23716 |
...{ |
| 23717 |
data, |
| 23718 |
field, |
| 23719 |
onChange, |
| 23720 |
hideLabelFromVision, |
| 23721 |
markWhenOptional, |
| 23722 |
validity, |
| 23723 |
prefix: prefix ? (0, import_element64.createElement)(prefix) : void 0, |
| 23724 |
suffix: suffix ? (0, import_element64.createElement)(suffix) : void 0 |
| 23725 |
} |
| 23726 |
} |
| 23727 |
); |
| 23728 |
} |
| 23729 |
|
| 23730 |
// packages/dataviews/build-module/components/dataform-controls/toggle.mjs |
| 23731 |
var import_components40 = __toESM(require_components(), 1); |
| 23732 |
var import_element65 = __toESM(require_element(), 1); |
| 23733 |
var import_jsx_runtime107 = __toESM(require_jsx_runtime(), 1); |
| 23734 |
var { ValidatedToggleControl } = unlock2(import_components40.privateApis); |
| 23735 |
function Toggle({ |
| 23736 |
field, |
| 23737 |
onChange, |
| 23738 |
data, |
| 23739 |
hideLabelFromVision, |
| 23740 |
markWhenOptional, |
| 23741 |
validity |
| 23742 |
}) { |
| 23743 |
const { label, description, getValue, setValue, isValid: isValid2 } = field; |
| 23744 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23745 |
const onChangeControl = (0, import_element65.useCallback)(() => { |
| 23746 |
onChange( |
| 23747 |
setValue({ item: data, value: !getValue({ item: data }) }) |
| 23748 |
); |
| 23749 |
}, [onChange, setValue, data, getValue]); |
| 23750 |
return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)( |
| 23751 |
ValidatedToggleControl, |
| 23752 |
{ |
| 23753 |
required: !!isValid2.required, |
| 23754 |
markWhenOptional, |
| 23755 |
customValidity: getCustomValidity(isValid2, validity), |
| 23756 |
hidden: hideLabelFromVision, |
| 23757 |
label, |
| 23758 |
help: description, |
| 23759 |
checked: getValue({ item: data }), |
| 23760 |
onChange: onChangeControl, |
| 23761 |
disabled: disabled2 |
| 23762 |
} |
| 23763 |
); |
| 23764 |
} |
| 23765 |
|
| 23766 |
// packages/dataviews/build-module/components/dataform-controls/textarea.mjs |
| 23767 |
var import_components41 = __toESM(require_components(), 1); |
| 23768 |
var import_element66 = __toESM(require_element(), 1); |
| 23769 |
var import_jsx_runtime108 = __toESM(require_jsx_runtime(), 1); |
| 23770 |
var { ValidatedTextareaControl } = unlock2(import_components41.privateApis); |
| 23771 |
function Textarea({ |
| 23772 |
data, |
| 23773 |
field, |
| 23774 |
onChange, |
| 23775 |
hideLabelFromVision, |
| 23776 |
markWhenOptional, |
| 23777 |
config, |
| 23778 |
validity |
| 23779 |
}) { |
| 23780 |
const { rows = 4 } = config || {}; |
| 23781 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23782 |
const { label, placeholder, description, setValue, isValid: isValid2 } = field; |
| 23783 |
const value = field.getValue({ item: data }); |
| 23784 |
const onChangeControl = (0, import_element66.useCallback)( |
| 23785 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 23786 |
[data, onChange, setValue] |
| 23787 |
); |
| 23788 |
return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)( |
| 23789 |
ValidatedTextareaControl, |
| 23790 |
{ |
| 23791 |
required: !!isValid2.required, |
| 23792 |
markWhenOptional, |
| 23793 |
customValidity: getCustomValidity(isValid2, validity), |
| 23794 |
label, |
| 23795 |
placeholder, |
| 23796 |
value: value ?? "", |
| 23797 |
help: description, |
| 23798 |
onChange: onChangeControl, |
| 23799 |
rows, |
| 23800 |
disabled: disabled2, |
| 23801 |
minLength: isValid2.minLength ? isValid2.minLength.constraint : void 0, |
| 23802 |
maxLength: isValid2.maxLength ? isValid2.maxLength.constraint : void 0, |
| 23803 |
__next40pxDefaultSize: true, |
| 23804 |
hideLabelFromVision |
| 23805 |
} |
| 23806 |
); |
| 23807 |
} |
| 23808 |
|
| 23809 |
// packages/dataviews/build-module/components/dataform-controls/toggle-group.mjs |
| 23810 |
var import_components42 = __toESM(require_components(), 1); |
| 23811 |
var import_element67 = __toESM(require_element(), 1); |
| 23812 |
var import_jsx_runtime109 = __toESM(require_jsx_runtime(), 1); |
| 23813 |
var { ValidatedToggleGroupControl } = unlock2(import_components42.privateApis); |
| 23814 |
function ToggleGroup({ |
| 23815 |
data, |
| 23816 |
field, |
| 23817 |
onChange, |
| 23818 |
hideLabelFromVision, |
| 23819 |
markWhenOptional, |
| 23820 |
validity |
| 23821 |
}) { |
| 23822 |
const { getValue, setValue, isValid: isValid2 } = field; |
| 23823 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23824 |
const value = getValue({ item: data }); |
| 23825 |
const onChangeControl = (0, import_element67.useCallback)( |
| 23826 |
(newValue) => onChange(setValue({ item: data, value: newValue })), |
| 23827 |
[data, onChange, setValue] |
| 23828 |
); |
| 23829 |
const { elements, isLoading } = useElements({ |
| 23830 |
elements: field.elements, |
| 23831 |
getElements: field.getElements |
| 23832 |
}); |
| 23833 |
if (isLoading) { |
| 23834 |
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_components42.Spinner, {}); |
| 23835 |
} |
| 23836 |
if (elements.length === 0) { |
| 23837 |
return null; |
| 23838 |
} |
| 23839 |
const selectedOption = elements.find((el) => el.value === value); |
| 23840 |
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)( |
| 23841 |
ValidatedToggleGroupControl, |
| 23842 |
{ |
| 23843 |
required: !!field.isValid?.required, |
| 23844 |
markWhenOptional, |
| 23845 |
customValidity: getCustomValidity(isValid2, validity), |
| 23846 |
__next40pxDefaultSize: true, |
| 23847 |
isBlock: true, |
| 23848 |
label: field.label, |
| 23849 |
help: selectedOption?.description || field.description, |
| 23850 |
onChange: onChangeControl, |
| 23851 |
value, |
| 23852 |
hideLabelFromVision, |
| 23853 |
children: elements.map((el) => /* @__PURE__ */ (0, import_jsx_runtime109.jsx)( |
| 23854 |
import_components42.__experimentalToggleGroupControlOption, |
| 23855 |
{ |
| 23856 |
label: el.label, |
| 23857 |
value: el.value, |
| 23858 |
disabled: disabled2 |
| 23859 |
}, |
| 23860 |
el.value |
| 23861 |
)) |
| 23862 |
} |
| 23863 |
); |
| 23864 |
} |
| 23865 |
|
| 23866 |
// packages/dataviews/build-module/components/dataform-controls/array.mjs |
| 23867 |
var import_components43 = __toESM(require_components(), 1); |
| 23868 |
var import_element68 = __toESM(require_element(), 1); |
| 23869 |
var import_jsx_runtime110 = __toESM(require_jsx_runtime(), 1); |
| 23870 |
var { ValidatedFormTokenField } = unlock2(import_components43.privateApis); |
| 23871 |
function ArrayControl({ |
| 23872 |
data, |
| 23873 |
field, |
| 23874 |
onChange, |
| 23875 |
hideLabelFromVision, |
| 23876 |
markWhenOptional, |
| 23877 |
validity |
| 23878 |
}) { |
| 23879 |
const { label, placeholder, description, getValue, setValue, isValid: isValid2 } = field; |
| 23880 |
const value = getValue({ item: data }); |
| 23881 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 23882 |
const { elements, isLoading } = useElements({ |
| 23883 |
elements: field.elements, |
| 23884 |
getElements: field.getElements |
| 23885 |
}); |
| 23886 |
const arrayValueAsElements = (0, import_element68.useMemo)( |
| 23887 |
() => Array.isArray(value) ? value.map((token) => { |
| 23888 |
const element = elements?.find( |
| 23889 |
(suggestion) => suggestion.value === token |
| 23890 |
); |
| 23891 |
return element || { value: token, label: token }; |
| 23892 |
}) : [], |
| 23893 |
[value, elements] |
| 23894 |
); |
| 23895 |
const onChangeControl = (0, import_element68.useCallback)( |
| 23896 |
(tokens) => { |
| 23897 |
const valueTokens = tokens.map((token) => { |
| 23898 |
if (typeof token === "object" && "value" in token) { |
| 23899 |
return token.value; |
| 23900 |
} |
| 23901 |
return token; |
| 23902 |
}); |
| 23903 |
onChange(setValue({ item: data, value: valueTokens })); |
| 23904 |
}, |
| 23905 |
[onChange, setValue, data] |
| 23906 |
); |
| 23907 |
if (isLoading) { |
| 23908 |
return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_components43.Spinner, {}); |
| 23909 |
} |
| 23910 |
return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)( |
| 23911 |
ValidatedFormTokenField, |
| 23912 |
{ |
| 23913 |
required: !!isValid2?.required, |
| 23914 |
markWhenOptional, |
| 23915 |
customValidity: getCustomValidity(isValid2, validity), |
| 23916 |
label: hideLabelFromVision ? void 0 : label, |
| 23917 |
value: arrayValueAsElements, |
| 23918 |
onChange: onChangeControl, |
| 23919 |
placeholder, |
| 23920 |
suggestions: elements?.map((element) => element.value), |
| 23921 |
disabled: disabled2, |
| 23922 |
__experimentalValidateInput: (token) => { |
| 23923 |
if (field.isValid?.elements && elements) { |
| 23924 |
return elements.some( |
| 23925 |
(element) => element.value === token || element.label === token |
| 23926 |
); |
| 23927 |
} |
| 23928 |
return true; |
| 23929 |
}, |
| 23930 |
__experimentalExpandOnFocus: elements && elements.length > 0, |
| 23931 |
help: description ?? (field.isValid?.elements ? "" : void 0), |
| 23932 |
displayTransform: (token) => { |
| 23933 |
if (typeof token === "object" && "label" in token) { |
| 23934 |
return token.label; |
| 23935 |
} |
| 23936 |
if (typeof token === "string" && elements) { |
| 23937 |
const element = elements.find( |
| 23938 |
(el) => el.value === token |
| 23939 |
); |
| 23940 |
return element?.label || token; |
| 23941 |
} |
| 23942 |
return token; |
| 23943 |
}, |
| 23944 |
__experimentalRenderItem: ({ item }) => { |
| 23945 |
if (typeof item === "string" && elements) { |
| 23946 |
const element = elements.find( |
| 23947 |
(el) => el.value === item |
| 23948 |
); |
| 23949 |
return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: element?.label || item }); |
| 23950 |
} |
| 23951 |
return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("span", { children: item }); |
| 23952 |
} |
| 23953 |
} |
| 23954 |
); |
| 23955 |
} |
| 23956 |
|
| 23957 |
// node_modules/colord/index.mjs |
| 23958 |
var r2 = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }; |
| 23959 |
var t = function(r3) { |
| 23960 |
return "string" == typeof r3 ? r3.length > 0 : "number" == typeof r3; |
| 23961 |
}; |
| 23962 |
var n = function(r3, t2, n2) { |
| 23963 |
return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = Math.pow(10, t2)), Math.round(n2 * r3) / n2 + 0; |
| 23964 |
}; |
| 23965 |
var e = function(r3, t2, n2) { |
| 23966 |
return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = 1), r3 > n2 ? n2 : r3 > t2 ? r3 : t2; |
| 23967 |
}; |
| 23968 |
var u = function(r3) { |
| 23969 |
return (r3 = isFinite(r3) ? r3 % 360 : 0) > 0 ? r3 : r3 + 360; |
| 23970 |
}; |
| 23971 |
var a = function(r3) { |
| 23972 |
return { r: e(r3.r, 0, 255), g: e(r3.g, 0, 255), b: e(r3.b, 0, 255), a: e(r3.a) }; |
| 23973 |
}; |
| 23974 |
var o = function(r3) { |
| 23975 |
return { r: n(r3.r), g: n(r3.g), b: n(r3.b), a: n(r3.a, 3) }; |
| 23976 |
}; |
| 23977 |
var i = /^#([0-9a-f]{3,8})$/i; |
| 23978 |
var s = function(r3) { |
| 23979 |
var t2 = r3.toString(16); |
| 23980 |
return t2.length < 2 ? "0" + t2 : t2; |
| 23981 |
}; |
| 23982 |
var h = function(r3) { |
| 23983 |
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; |
| 23984 |
return { h: 60 * (i2 < 0 ? i2 + 6 : i2), s: a2 ? o2 / a2 * 100 : 0, v: a2 / 255 * 100, a: u2 }; |
| 23985 |
}; |
| 23986 |
var b = function(r3) { |
| 23987 |
var t2 = r3.h, n2 = r3.s, e2 = r3.v, u2 = r3.a; |
| 23988 |
t2 = t2 / 360 * 6, n2 /= 100, e2 /= 100; |
| 23989 |
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; |
| 23990 |
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 }; |
| 23991 |
}; |
| 23992 |
var g = function(r3) { |
| 23993 |
return { h: u(r3.h), s: e(r3.s, 0, 100), l: e(r3.l, 0, 100), a: e(r3.a) }; |
| 23994 |
}; |
| 23995 |
var d = function(r3) { |
| 23996 |
return { h: n(r3.h), s: n(r3.s), l: n(r3.l), a: n(r3.a, 3) }; |
| 23997 |
}; |
| 23998 |
var f = function(r3) { |
| 23999 |
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 })); |
| 24000 |
var t2, n2, e2; |
| 24001 |
}; |
| 24002 |
var c = function(r3) { |
| 24003 |
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 }; |
| 24004 |
var t2, n2, e2, u2; |
| 24005 |
}; |
| 24006 |
var l = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; |
| 24007 |
var p = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; |
| 24008 |
var v = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; |
| 24009 |
var m = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; |
| 24010 |
var y = { string: [[function(r3) { |
| 24011 |
var t2 = i.exec(r3); |
| 24012 |
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; |
| 24013 |
}, "hex"], [function(r3) { |
| 24014 |
var t2 = v.exec(r3) || m.exec(r3); |
| 24015 |
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; |
| 24016 |
}, "rgb"], [function(t2) { |
| 24017 |
var n2 = l.exec(t2) || p.exec(t2); |
| 24018 |
if (!n2) return null; |
| 24019 |
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) }); |
| 24020 |
return f(a2); |
| 24021 |
}, "hsl"]], object: [[function(r3) { |
| 24022 |
var n2 = r3.r, e2 = r3.g, u2 = r3.b, o2 = r3.a, i2 = void 0 === o2 ? 1 : o2; |
| 24023 |
return t(n2) && t(e2) && t(u2) ? a({ r: Number(n2), g: Number(e2), b: Number(u2), a: Number(i2) }) : null; |
| 24024 |
}, "rgb"], [function(r3) { |
| 24025 |
var n2 = r3.h, e2 = r3.s, u2 = r3.l, a2 = r3.a, o2 = void 0 === a2 ? 1 : a2; |
| 24026 |
if (!t(n2) || !t(e2) || !t(u2)) return null; |
| 24027 |
var i2 = g({ h: Number(n2), s: Number(e2), l: Number(u2), a: Number(o2) }); |
| 24028 |
return f(i2); |
| 24029 |
}, "hsl"], [function(r3) { |
| 24030 |
var n2 = r3.h, a2 = r3.s, o2 = r3.v, i2 = r3.a, s2 = void 0 === i2 ? 1 : i2; |
| 24031 |
if (!t(n2) || !t(a2) || !t(o2)) return null; |
| 24032 |
var h2 = (function(r4) { |
| 24033 |
return { h: u(r4.h), s: e(r4.s, 0, 100), v: e(r4.v, 0, 100), a: e(r4.a) }; |
| 24034 |
})({ h: Number(n2), s: Number(a2), v: Number(o2), a: Number(s2) }); |
| 24035 |
return b(h2); |
| 24036 |
}, "hsv"]] }; |
| 24037 |
var N = function(r3, t2) { |
| 24038 |
for (var n2 = 0; n2 < t2.length; n2++) { |
| 24039 |
var e2 = t2[n2][0](r3); |
| 24040 |
if (e2) return [e2, t2[n2][1]]; |
| 24041 |
} |
| 24042 |
return [null, void 0]; |
| 24043 |
}; |
| 24044 |
var x = function(r3) { |
| 24045 |
return "string" == typeof r3 ? N(r3.trim(), y.string) : "object" == typeof r3 && null !== r3 ? N(r3, y.object) : [null, void 0]; |
| 24046 |
}; |
| 24047 |
var M = function(r3, t2) { |
| 24048 |
var n2 = c(r3); |
| 24049 |
return { h: n2.h, s: e(n2.s + 100 * t2, 0, 100), l: n2.l, a: n2.a }; |
| 24050 |
}; |
| 24051 |
var H = function(r3) { |
| 24052 |
return (299 * r3.r + 587 * r3.g + 114 * r3.b) / 1e3 / 255; |
| 24053 |
}; |
| 24054 |
var $ = function(r3, t2) { |
| 24055 |
var n2 = c(r3); |
| 24056 |
return { h: n2.h, s: n2.s, l: e(n2.l + 100 * t2, 0, 100), a: n2.a }; |
| 24057 |
}; |
| 24058 |
var j = (function() { |
| 24059 |
function r3(r4) { |
| 24060 |
this.parsed = x(r4)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 }; |
| 24061 |
} |
| 24062 |
return r3.prototype.isValid = function() { |
| 24063 |
return null !== this.parsed; |
| 24064 |
}, r3.prototype.brightness = function() { |
| 24065 |
return n(H(this.rgba), 2); |
| 24066 |
}, r3.prototype.isDark = function() { |
| 24067 |
return H(this.rgba) < 0.5; |
| 24068 |
}, r3.prototype.isLight = function() { |
| 24069 |
return H(this.rgba) >= 0.5; |
| 24070 |
}, r3.prototype.toHex = function() { |
| 24071 |
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; |
| 24072 |
var r4, t2, e2, u2, a2, i2; |
| 24073 |
}, r3.prototype.toRgb = function() { |
| 24074 |
return o(this.rgba); |
| 24075 |
}, r3.prototype.toRgbString = function() { |
| 24076 |
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 + ")"; |
| 24077 |
var r4, t2, n2, e2, u2; |
| 24078 |
}, r3.prototype.toHsl = function() { |
| 24079 |
return d(c(this.rgba)); |
| 24080 |
}, r3.prototype.toHslString = function() { |
| 24081 |
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 + "%)"; |
| 24082 |
var r4, t2, n2, e2, u2; |
| 24083 |
}, r3.prototype.toHsv = function() { |
| 24084 |
return r4 = h(this.rgba), { h: n(r4.h), s: n(r4.s), v: n(r4.v), a: n(r4.a, 3) }; |
| 24085 |
var r4; |
| 24086 |
}, r3.prototype.invert = function() { |
| 24087 |
return w({ r: 255 - (r4 = this.rgba).r, g: 255 - r4.g, b: 255 - r4.b, a: r4.a }); |
| 24088 |
var r4; |
| 24089 |
}, r3.prototype.saturate = function(r4) { |
| 24090 |
return void 0 === r4 && (r4 = 0.1), w(M(this.rgba, r4)); |
| 24091 |
}, r3.prototype.desaturate = function(r4) { |
| 24092 |
return void 0 === r4 && (r4 = 0.1), w(M(this.rgba, -r4)); |
| 24093 |
}, r3.prototype.grayscale = function() { |
| 24094 |
return w(M(this.rgba, -1)); |
| 24095 |
}, r3.prototype.lighten = function(r4) { |
| 24096 |
return void 0 === r4 && (r4 = 0.1), w($(this.rgba, r4)); |
| 24097 |
}, r3.prototype.darken = function(r4) { |
| 24098 |
return void 0 === r4 && (r4 = 0.1), w($(this.rgba, -r4)); |
| 24099 |
}, r3.prototype.rotate = function(r4) { |
| 24100 |
return void 0 === r4 && (r4 = 15), this.hue(this.hue() + r4); |
| 24101 |
}, r3.prototype.alpha = function(r4) { |
| 24102 |
return "number" == typeof r4 ? w({ r: (t2 = this.rgba).r, g: t2.g, b: t2.b, a: r4 }) : n(this.rgba.a, 3); |
| 24103 |
var t2; |
| 24104 |
}, r3.prototype.hue = function(r4) { |
| 24105 |
var t2 = c(this.rgba); |
| 24106 |
return "number" == typeof r4 ? w({ h: r4, s: t2.s, l: t2.l, a: t2.a }) : n(t2.h); |
| 24107 |
}, r3.prototype.isEqual = function(r4) { |
| 24108 |
return this.toHex() === w(r4).toHex(); |
| 24109 |
}, r3; |
| 24110 |
})(); |
| 24111 |
var w = function(r3) { |
| 24112 |
return r3 instanceof j ? r3 : new j(r3); |
| 24113 |
}; |
| 24114 |
|
| 24115 |
// packages/dataviews/build-module/components/dataform-controls/color.mjs |
| 24116 |
var import_components44 = __toESM(require_components(), 1); |
| 24117 |
var import_element69 = __toESM(require_element(), 1); |
| 24118 |
var import_i18n42 = __toESM(require_i18n(), 1); |
| 24119 |
var import_jsx_runtime111 = __toESM(require_jsx_runtime(), 1); |
| 24120 |
var { ValidatedInputControl: ValidatedInputControl3 } = unlock2(import_components44.privateApis); |
| 24121 |
var ColorPickerDropdown = ({ |
| 24122 |
color, |
| 24123 |
onColorChange, |
| 24124 |
disabled: disabled2 |
| 24125 |
}) => { |
| 24126 |
const validColor = color && w(color).isValid() ? color : "#ffffff"; |
| 24127 |
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( |
| 24128 |
import_components44.Dropdown, |
| 24129 |
{ |
| 24130 |
className: "dataviews-controls__color-picker-dropdown", |
| 24131 |
popoverProps: { resize: false }, |
| 24132 |
renderToggle: ({ onToggle }) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( |
| 24133 |
import_components44.Button, |
| 24134 |
{ |
| 24135 |
onClick: onToggle, |
| 24136 |
"aria-label": (0, import_i18n42.__)("Open color picker"), |
| 24137 |
size: "small", |
| 24138 |
disabled: disabled2, |
| 24139 |
accessibleWhenDisabled: true, |
| 24140 |
icon: () => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components44.ColorIndicator, { colorValue: validColor }) |
| 24141 |
} |
| 24142 |
), |
| 24143 |
renderContent: () => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components44.__experimentalDropdownContentWrapper, { paddingSize: "none", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( |
| 24144 |
import_components44.ColorPicker, |
| 24145 |
{ |
| 24146 |
color: validColor, |
| 24147 |
onChange: onColorChange, |
| 24148 |
enableAlpha: true |
| 24149 |
} |
| 24150 |
) }) |
| 24151 |
} |
| 24152 |
); |
| 24153 |
}; |
| 24154 |
function Color({ |
| 24155 |
data, |
| 24156 |
field, |
| 24157 |
onChange, |
| 24158 |
hideLabelFromVision, |
| 24159 |
markWhenOptional, |
| 24160 |
validity |
| 24161 |
}) { |
| 24162 |
const { label, placeholder, description, setValue, isValid: isValid2 } = field; |
| 24163 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 24164 |
const value = field.getValue({ item: data }) || ""; |
| 24165 |
const handleColorChange = (0, import_element69.useCallback)( |
| 24166 |
(newColor) => { |
| 24167 |
onChange(setValue({ item: data, value: newColor })); |
| 24168 |
}, |
| 24169 |
[data, onChange, setValue] |
| 24170 |
); |
| 24171 |
const handleInputChange = (0, import_element69.useCallback)( |
| 24172 |
(newValue) => { |
| 24173 |
onChange(setValue({ item: data, value: newValue || "" })); |
| 24174 |
}, |
| 24175 |
[data, onChange, setValue] |
| 24176 |
); |
| 24177 |
return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( |
| 24178 |
ValidatedInputControl3, |
| 24179 |
{ |
| 24180 |
required: !!field.isValid?.required, |
| 24181 |
markWhenOptional, |
| 24182 |
customValidity: getCustomValidity(isValid2, validity), |
| 24183 |
label, |
| 24184 |
placeholder, |
| 24185 |
value, |
| 24186 |
help: description, |
| 24187 |
onChange: handleInputChange, |
| 24188 |
hideLabelFromVision, |
| 24189 |
type: "text", |
| 24190 |
disabled: disabled2, |
| 24191 |
prefix: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_components44.__experimentalInputControlPrefixWrapper, { variant: "control", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)( |
| 24192 |
ColorPickerDropdown, |
| 24193 |
{ |
| 24194 |
color: value, |
| 24195 |
onColorChange: handleColorChange, |
| 24196 |
disabled: disabled2 |
| 24197 |
} |
| 24198 |
) }) |
| 24199 |
} |
| 24200 |
); |
| 24201 |
} |
| 24202 |
|
| 24203 |
// packages/dataviews/build-module/components/dataform-controls/password.mjs |
| 24204 |
var import_components45 = __toESM(require_components(), 1); |
| 24205 |
var import_element70 = __toESM(require_element(), 1); |
| 24206 |
var import_i18n43 = __toESM(require_i18n(), 1); |
| 24207 |
var import_jsx_runtime112 = __toESM(require_jsx_runtime(), 1); |
| 24208 |
function Password({ |
| 24209 |
data, |
| 24210 |
field, |
| 24211 |
onChange, |
| 24212 |
hideLabelFromVision, |
| 24213 |
markWhenOptional, |
| 24214 |
validity |
| 24215 |
}) { |
| 24216 |
const [isVisible2, setIsVisible] = (0, import_element70.useState)(false); |
| 24217 |
const disabled2 = field.isDisabled({ item: data, field }); |
| 24218 |
const toggleVisibility = (0, import_element70.useCallback)(() => { |
| 24219 |
setIsVisible((prev) => !prev); |
| 24220 |
}, []); |
| 24221 |
return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)( |
| 24222 |
ValidatedText, |
| 24223 |
{ |
| 24224 |
...{ |
| 24225 |
data, |
| 24226 |
field, |
| 24227 |
onChange, |
| 24228 |
hideLabelFromVision, |
| 24229 |
markWhenOptional, |
| 24230 |
validity, |
| 24231 |
type: isVisible2 ? "text" : "password", |
| 24232 |
suffix: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_components45.__experimentalInputControlSuffixWrapper, { variant: "control", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)( |
| 24233 |
import_components45.Button, |
| 24234 |
{ |
| 24235 |
icon: isVisible2 ? unseen_default : seen_default, |
| 24236 |
onClick: toggleVisibility, |
| 24237 |
size: "small", |
| 24238 |
label: isVisible2 ? (0, import_i18n43.__)("Hide password") : (0, import_i18n43.__)("Show password"), |
| 24239 |
disabled: disabled2, |
| 24240 |
accessibleWhenDisabled: true |
| 24241 |
} |
| 24242 |
) }) |
| 24243 |
} |
| 24244 |
} |
| 24245 |
); |
| 24246 |
} |
| 24247 |
|
| 24248 |
// packages/dataviews/build-module/field-types/utils/has-elements.mjs |
| 24249 |
function hasElements(field) { |
| 24250 |
return Array.isArray(field.elements) && field.elements.length > 0 || typeof field.getElements === "function"; |
| 24251 |
} |
| 24252 |
|
| 24253 |
// packages/dataviews/build-module/components/dataform-controls/index.mjs |
| 24254 |
var import_jsx_runtime113 = __toESM(require_jsx_runtime(), 1); |
| 24255 |
var FORM_CONTROLS = { |
| 24256 |
adaptiveSelect: AdaptiveSelect, |
| 24257 |
array: ArrayControl, |
| 24258 |
checkbox: Checkbox, |
| 24259 |
color: Color, |
| 24260 |
combobox: Combobox3, |
| 24261 |
datetime: DateTime, |
| 24262 |
date: DateControl, |
| 24263 |
email: Email, |
| 24264 |
telephone: Telephone, |
| 24265 |
url: Url, |
| 24266 |
integer: Integer, |
| 24267 |
number: Number2, |
| 24268 |
password: Password, |
| 24269 |
radio: Radio, |
| 24270 |
select: Select, |
| 24271 |
text: Text, |
| 24272 |
toggle: Toggle, |
| 24273 |
textarea: Textarea, |
| 24274 |
toggleGroup: ToggleGroup |
| 24275 |
}; |
| 24276 |
function isEditConfig(value) { |
| 24277 |
return value && typeof value === "object" && typeof value.control === "string"; |
| 24278 |
} |
| 24279 |
function createConfiguredControl(config) { |
| 24280 |
const { control, ...controlConfig } = config; |
| 24281 |
const BaseControlType = getControlByType(control); |
| 24282 |
if (BaseControlType === null) { |
| 24283 |
return null; |
| 24284 |
} |
| 24285 |
return function ConfiguredControl(props) { |
| 24286 |
return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(BaseControlType, { ...props, config: controlConfig }); |
| 24287 |
}; |
| 24288 |
} |
| 24289 |
function getControl(field, fallback) { |
| 24290 |
if (typeof field.Edit === "function") { |
| 24291 |
return field.Edit; |
| 24292 |
} |
| 24293 |
if (typeof field.Edit === "string") { |
| 24294 |
return getControlByType(field.Edit); |
| 24295 |
} |
| 24296 |
if (isEditConfig(field.Edit)) { |
| 24297 |
return createConfiguredControl(field.Edit); |
| 24298 |
} |
| 24299 |
if (hasElements(field) && field.type !== "array") { |
| 24300 |
return getControlByType("adaptiveSelect"); |
| 24301 |
} |
| 24302 |
if (fallback === null) { |
| 24303 |
return null; |
| 24304 |
} |
| 24305 |
return getControlByType(fallback); |
| 24306 |
} |
| 24307 |
function getControlByType(type) { |
| 24308 |
if (Object.keys(FORM_CONTROLS).includes(type)) { |
| 24309 |
return FORM_CONTROLS[type]; |
| 24310 |
} |
| 24311 |
return null; |
| 24312 |
} |
| 24313 |
|
| 24314 |
// packages/dataviews/build-module/field-types/utils/get-filter-by.mjs |
| 24315 |
function getFilterBy(field, defaultOperators, validOperators) { |
| 24316 |
if (field.filterBy === false) { |
| 24317 |
return false; |
| 24318 |
} |
| 24319 |
const operators = field.filterBy?.operators?.filter( |
| 24320 |
(op) => validOperators.includes(op) |
| 24321 |
) ?? defaultOperators; |
| 24322 |
if (operators.length === 0) { |
| 24323 |
return false; |
| 24324 |
} |
| 24325 |
return { |
| 24326 |
isPrimary: !!field.filterBy?.isPrimary, |
| 24327 |
operators |
| 24328 |
}; |
| 24329 |
} |
| 24330 |
var get_filter_by_default = getFilterBy; |
| 24331 |
|
| 24332 |
// packages/dataviews/build-module/field-types/utils/get-value-from-id.mjs |
| 24333 |
var getValueFromId = (id) => ({ item }) => { |
| 24334 |
const path = id.split("."); |
| 24335 |
let value = item; |
| 24336 |
for (const segment of path) { |
| 24337 |
if (value.hasOwnProperty(segment)) { |
| 24338 |
value = value[segment]; |
| 24339 |
} else { |
| 24340 |
value = void 0; |
| 24341 |
} |
| 24342 |
} |
| 24343 |
return value; |
| 24344 |
}; |
| 24345 |
var get_value_from_id_default = getValueFromId; |
| 24346 |
|
| 24347 |
// packages/dataviews/build-module/field-types/utils/set-value-from-id.mjs |
| 24348 |
var setValueFromId = (id) => ({ value }) => { |
| 24349 |
const path = id.split("."); |
| 24350 |
const result = {}; |
| 24351 |
let current = result; |
| 24352 |
for (const segment of path.slice(0, -1)) { |
| 24353 |
current[segment] = {}; |
| 24354 |
current = current[segment]; |
| 24355 |
} |
| 24356 |
current[path.at(-1)] = value; |
| 24357 |
return result; |
| 24358 |
}; |
| 24359 |
var set_value_from_id_default = setValueFromId; |
| 24360 |
|
| 24361 |
// packages/dataviews/build-module/field-types/email.mjs |
| 24362 |
var import_i18n44 = __toESM(require_i18n(), 1); |
| 24363 |
|
| 24364 |
// packages/dataviews/build-module/field-types/utils/render-from-elements.mjs |
| 24365 |
function RenderFromElements({ |
| 24366 |
item, |
| 24367 |
field |
| 24368 |
}) { |
| 24369 |
const { elements, isLoading } = useElements({ |
| 24370 |
elements: field.elements, |
| 24371 |
getElements: field.getElements |
| 24372 |
}); |
| 24373 |
const value = field.getValue({ item }); |
| 24374 |
if (isLoading) { |
| 24375 |
return value; |
| 24376 |
} |
| 24377 |
if (elements.length === 0) { |
| 24378 |
return value; |
| 24379 |
} |
| 24380 |
return elements?.find((element) => element.value === value)?.label || field.getValue({ item }); |
| 24381 |
} |
| 24382 |
|
| 24383 |
// packages/dataviews/build-module/field-types/utils/render-default.mjs |
| 24384 |
var import_jsx_runtime114 = __toESM(require_jsx_runtime(), 1); |
| 24385 |
function render({ |
| 24386 |
item, |
| 24387 |
field |
| 24388 |
}) { |
| 24389 |
if (field.hasElements) { |
| 24390 |
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(RenderFromElements, { item, field }); |
| 24391 |
} |
| 24392 |
return field.getValueFormatted({ item, field }); |
| 24393 |
} |
| 24394 |
|
| 24395 |
// packages/dataviews/build-module/field-types/utils/sort-text.mjs |
| 24396 |
var sort_text_default = (a2, b2, direction) => { |
| 24397 |
return direction === "asc" ? a2.localeCompare(b2) : b2.localeCompare(a2); |
| 24398 |
}; |
| 24399 |
|
| 24400 |
// packages/dataviews/build-module/field-types/utils/is-valid-required.mjs |
| 24401 |
function isValidRequired(item, field) { |
| 24402 |
const value = field.getValue({ item }); |
| 24403 |
return ![void 0, "", null].includes(value); |
| 24404 |
} |
| 24405 |
|
| 24406 |
// packages/dataviews/build-module/field-types/utils/is-valid-min-length.mjs |
| 24407 |
function isValidMinLength(item, field) { |
| 24408 |
if (typeof field.isValid.minLength?.constraint !== "number") { |
| 24409 |
return false; |
| 24410 |
} |
| 24411 |
const value = field.getValue({ item }); |
| 24412 |
if ([void 0, "", null].includes(value)) { |
| 24413 |
return true; |
| 24414 |
} |
| 24415 |
return String(value).length >= field.isValid.minLength.constraint; |
| 24416 |
} |
| 24417 |
|
| 24418 |
// packages/dataviews/build-module/field-types/utils/is-valid-max-length.mjs |
| 24419 |
function isValidMaxLength(item, field) { |
| 24420 |
if (typeof field.isValid.maxLength?.constraint !== "number") { |
| 24421 |
return false; |
| 24422 |
} |
| 24423 |
const value = field.getValue({ item }); |
| 24424 |
if ([void 0, "", null].includes(value)) { |
| 24425 |
return true; |
| 24426 |
} |
| 24427 |
return String(value).length <= field.isValid.maxLength.constraint; |
| 24428 |
} |
| 24429 |
|
| 24430 |
// packages/dataviews/build-module/field-types/utils/is-valid-pattern.mjs |
| 24431 |
function isValidPattern(item, field) { |
| 24432 |
if (field.isValid.pattern?.constraint === void 0) { |
| 24433 |
return true; |
| 24434 |
} |
| 24435 |
try { |
| 24436 |
const regexp = new RegExp(field.isValid.pattern.constraint); |
| 24437 |
const value = field.getValue({ item }); |
| 24438 |
if ([void 0, "", null].includes(value)) { |
| 24439 |
return true; |
| 24440 |
} |
| 24441 |
return regexp.test(String(value)); |
| 24442 |
} catch { |
| 24443 |
return false; |
| 24444 |
} |
| 24445 |
} |
| 24446 |
|
| 24447 |
// packages/dataviews/build-module/field-types/utils/is-valid-elements.mjs |
| 24448 |
function isValidElements(item, field) { |
| 24449 |
const elements = field.elements ?? []; |
| 24450 |
const validValues = elements.map((el) => el.value); |
| 24451 |
if (validValues.length === 0) { |
| 24452 |
return true; |
| 24453 |
} |
| 24454 |
const value = field.getValue({ item }); |
| 24455 |
return [].concat(value).every((v2) => validValues.includes(v2)); |
| 24456 |
} |
| 24457 |
|
| 24458 |
// packages/dataviews/build-module/field-types/utils/get-value-formatted-default.mjs |
| 24459 |
function getValueFormatted({ |
| 24460 |
item, |
| 24461 |
field |
| 24462 |
}) { |
| 24463 |
return field.getValue({ item }); |
| 24464 |
} |
| 24465 |
var get_value_formatted_default_default = getValueFormatted; |
| 24466 |
|
| 24467 |
// packages/dataviews/build-module/field-types/email.mjs |
| 24468 |
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])?)*$/; |
| 24469 |
function isValidCustom(item, field) { |
| 24470 |
const value = field.getValue({ item }); |
| 24471 |
if (![void 0, "", null].includes(value) && !emailRegex.test(value)) { |
| 24472 |
return (0, import_i18n44.__)("Value must be a valid email address."); |
| 24473 |
} |
| 24474 |
return null; |
| 24475 |
} |
| 24476 |
var email_default = { |
| 24477 |
type: "email", |
| 24478 |
render, |
| 24479 |
Edit: "email", |
| 24480 |
sort: sort_text_default, |
| 24481 |
enableSorting: true, |
| 24482 |
enableGlobalSearch: false, |
| 24483 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 24484 |
validOperators: [ |
| 24485 |
OPERATOR_IS, |
| 24486 |
OPERATOR_IS_NOT, |
| 24487 |
OPERATOR_CONTAINS, |
| 24488 |
OPERATOR_NOT_CONTAINS, |
| 24489 |
OPERATOR_STARTS_WITH, |
| 24490 |
// Multiple selection |
| 24491 |
OPERATOR_IS_ANY, |
| 24492 |
OPERATOR_IS_NONE, |
| 24493 |
OPERATOR_IS_ALL, |
| 24494 |
OPERATOR_IS_NOT_ALL |
| 24495 |
], |
| 24496 |
format: {}, |
| 24497 |
getValueFormatted: get_value_formatted_default_default, |
| 24498 |
validate: { |
| 24499 |
required: isValidRequired, |
| 24500 |
pattern: isValidPattern, |
| 24501 |
minLength: isValidMinLength, |
| 24502 |
maxLength: isValidMaxLength, |
| 24503 |
elements: isValidElements, |
| 24504 |
custom: isValidCustom |
| 24505 |
} |
| 24506 |
}; |
| 24507 |
|
| 24508 |
// packages/dataviews/build-module/field-types/integer.mjs |
| 24509 |
var import_i18n45 = __toESM(require_i18n(), 1); |
| 24510 |
|
| 24511 |
// packages/dataviews/build-module/field-types/utils/sort-number.mjs |
| 24512 |
var sort_number_default = (a2, b2, direction) => { |
| 24513 |
return direction === "asc" ? a2 - b2 : b2 - a2; |
| 24514 |
}; |
| 24515 |
|
| 24516 |
// packages/dataviews/build-module/field-types/utils/is-valid-min.mjs |
| 24517 |
function isValidMin(item, field) { |
| 24518 |
if (typeof field.isValid.min?.constraint !== "number") { |
| 24519 |
return false; |
| 24520 |
} |
| 24521 |
const value = field.getValue({ item }); |
| 24522 |
if ([void 0, "", null].includes(value)) { |
| 24523 |
return true; |
| 24524 |
} |
| 24525 |
return Number(value) >= field.isValid.min.constraint; |
| 24526 |
} |
| 24527 |
|
| 24528 |
// packages/dataviews/build-module/field-types/utils/is-valid-max.mjs |
| 24529 |
function isValidMax(item, field) { |
| 24530 |
if (typeof field.isValid.max?.constraint !== "number") { |
| 24531 |
return false; |
| 24532 |
} |
| 24533 |
const value = field.getValue({ item }); |
| 24534 |
if ([void 0, "", null].includes(value)) { |
| 24535 |
return true; |
| 24536 |
} |
| 24537 |
return Number(value) <= field.isValid.max.constraint; |
| 24538 |
} |
| 24539 |
|
| 24540 |
// packages/dataviews/build-module/field-types/integer.mjs |
| 24541 |
var format2 = { |
| 24542 |
separatorThousand: "," |
| 24543 |
}; |
| 24544 |
function getValueFormatted2({ |
| 24545 |
item, |
| 24546 |
field |
| 24547 |
}) { |
| 24548 |
let value = field.getValue({ item }); |
| 24549 |
if (value === null || value === void 0) { |
| 24550 |
return ""; |
| 24551 |
} |
| 24552 |
value = Number(value); |
| 24553 |
if (!Number.isFinite(value)) { |
| 24554 |
return String(value); |
| 24555 |
} |
| 24556 |
let formatInteger; |
| 24557 |
if (field.type !== "integer") { |
| 24558 |
formatInteger = format2; |
| 24559 |
} else { |
| 24560 |
formatInteger = field.format; |
| 24561 |
} |
| 24562 |
const { separatorThousand } = formatInteger; |
| 24563 |
const integerValue = Math.trunc(value); |
| 24564 |
if (!separatorThousand) { |
| 24565 |
return String(integerValue); |
| 24566 |
} |
| 24567 |
return String(integerValue).replace( |
| 24568 |
/\B(?=(\d{3})+(?!\d))/g, |
| 24569 |
separatorThousand |
| 24570 |
); |
| 24571 |
} |
| 24572 |
function isValidCustom2(item, field) { |
| 24573 |
const value = field.getValue({ item }); |
| 24574 |
if (![void 0, "", null].includes(value) && !Number.isInteger(value)) { |
| 24575 |
return (0, import_i18n45.__)("Value must be an integer."); |
| 24576 |
} |
| 24577 |
return null; |
| 24578 |
} |
| 24579 |
var integer_default = { |
| 24580 |
type: "integer", |
| 24581 |
render, |
| 24582 |
Edit: "integer", |
| 24583 |
sort: sort_number_default, |
| 24584 |
enableSorting: true, |
| 24585 |
enableGlobalSearch: false, |
| 24586 |
defaultOperators: [ |
| 24587 |
OPERATOR_IS, |
| 24588 |
OPERATOR_IS_NOT, |
| 24589 |
OPERATOR_LESS_THAN, |
| 24590 |
OPERATOR_GREATER_THAN, |
| 24591 |
OPERATOR_LESS_THAN_OR_EQUAL, |
| 24592 |
OPERATOR_GREATER_THAN_OR_EQUAL, |
| 24593 |
OPERATOR_BETWEEN |
| 24594 |
], |
| 24595 |
validOperators: [ |
| 24596 |
// Single-selection |
| 24597 |
OPERATOR_IS, |
| 24598 |
OPERATOR_IS_NOT, |
| 24599 |
OPERATOR_LESS_THAN, |
| 24600 |
OPERATOR_GREATER_THAN, |
| 24601 |
OPERATOR_LESS_THAN_OR_EQUAL, |
| 24602 |
OPERATOR_GREATER_THAN_OR_EQUAL, |
| 24603 |
OPERATOR_BETWEEN, |
| 24604 |
// Multiple-selection |
| 24605 |
OPERATOR_IS_ANY, |
| 24606 |
OPERATOR_IS_NONE, |
| 24607 |
OPERATOR_IS_ALL, |
| 24608 |
OPERATOR_IS_NOT_ALL |
| 24609 |
], |
| 24610 |
format: format2, |
| 24611 |
getValueFormatted: getValueFormatted2, |
| 24612 |
validate: { |
| 24613 |
required: isValidRequired, |
| 24614 |
min: isValidMin, |
| 24615 |
max: isValidMax, |
| 24616 |
elements: isValidElements, |
| 24617 |
custom: isValidCustom2 |
| 24618 |
} |
| 24619 |
}; |
| 24620 |
|
| 24621 |
// packages/dataviews/build-module/field-types/number.mjs |
| 24622 |
var import_i18n46 = __toESM(require_i18n(), 1); |
| 24623 |
var format3 = { |
| 24624 |
separatorThousand: ",", |
| 24625 |
separatorDecimal: ".", |
| 24626 |
decimals: 2 |
| 24627 |
}; |
| 24628 |
function getValueFormatted3({ |
| 24629 |
item, |
| 24630 |
field |
| 24631 |
}) { |
| 24632 |
let value = field.getValue({ item }); |
| 24633 |
if (value === null || value === void 0) { |
| 24634 |
return ""; |
| 24635 |
} |
| 24636 |
value = Number(value); |
| 24637 |
if (!Number.isFinite(value)) { |
| 24638 |
return String(value); |
| 24639 |
} |
| 24640 |
let formatNumber; |
| 24641 |
if (field.type !== "number") { |
| 24642 |
formatNumber = format3; |
| 24643 |
} else { |
| 24644 |
formatNumber = field.format; |
| 24645 |
} |
| 24646 |
const { separatorThousand, separatorDecimal, decimals } = formatNumber; |
| 24647 |
const fixedValue = value.toFixed(decimals); |
| 24648 |
const [integerPart, decimalPart] = fixedValue.split("."); |
| 24649 |
const formattedInteger = separatorThousand ? integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, separatorThousand) : integerPart; |
| 24650 |
return decimals === 0 ? formattedInteger : formattedInteger + separatorDecimal + decimalPart; |
| 24651 |
} |
| 24652 |
function isEmpty(value) { |
| 24653 |
return value === "" || value === void 0 || value === null; |
| 24654 |
} |
| 24655 |
function isValidCustom3(item, field) { |
| 24656 |
const value = field.getValue({ item }); |
| 24657 |
if (!isEmpty(value) && !Number.isFinite(value)) { |
| 24658 |
return (0, import_i18n46.__)("Value must be a number."); |
| 24659 |
} |
| 24660 |
return null; |
| 24661 |
} |
| 24662 |
var number_default = { |
| 24663 |
type: "number", |
| 24664 |
render, |
| 24665 |
Edit: "number", |
| 24666 |
sort: sort_number_default, |
| 24667 |
enableSorting: true, |
| 24668 |
enableGlobalSearch: false, |
| 24669 |
defaultOperators: [ |
| 24670 |
OPERATOR_IS, |
| 24671 |
OPERATOR_IS_NOT, |
| 24672 |
OPERATOR_LESS_THAN, |
| 24673 |
OPERATOR_GREATER_THAN, |
| 24674 |
OPERATOR_LESS_THAN_OR_EQUAL, |
| 24675 |
OPERATOR_GREATER_THAN_OR_EQUAL, |
| 24676 |
OPERATOR_BETWEEN |
| 24677 |
], |
| 24678 |
validOperators: [ |
| 24679 |
// Single-selection |
| 24680 |
OPERATOR_IS, |
| 24681 |
OPERATOR_IS_NOT, |
| 24682 |
OPERATOR_LESS_THAN, |
| 24683 |
OPERATOR_GREATER_THAN, |
| 24684 |
OPERATOR_LESS_THAN_OR_EQUAL, |
| 24685 |
OPERATOR_GREATER_THAN_OR_EQUAL, |
| 24686 |
OPERATOR_BETWEEN, |
| 24687 |
// Multiple-selection |
| 24688 |
OPERATOR_IS_ANY, |
| 24689 |
OPERATOR_IS_NONE, |
| 24690 |
OPERATOR_IS_ALL, |
| 24691 |
OPERATOR_IS_NOT_ALL |
| 24692 |
], |
| 24693 |
format: format3, |
| 24694 |
getValueFormatted: getValueFormatted3, |
| 24695 |
validate: { |
| 24696 |
required: isValidRequired, |
| 24697 |
min: isValidMin, |
| 24698 |
max: isValidMax, |
| 24699 |
elements: isValidElements, |
| 24700 |
custom: isValidCustom3 |
| 24701 |
} |
| 24702 |
}; |
| 24703 |
|
| 24704 |
// packages/dataviews/build-module/field-types/text.mjs |
| 24705 |
var text_default = { |
| 24706 |
type: "text", |
| 24707 |
render, |
| 24708 |
Edit: "text", |
| 24709 |
sort: sort_text_default, |
| 24710 |
enableSorting: true, |
| 24711 |
enableGlobalSearch: false, |
| 24712 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 24713 |
validOperators: [ |
| 24714 |
// Single selection |
| 24715 |
OPERATOR_IS, |
| 24716 |
OPERATOR_IS_NOT, |
| 24717 |
OPERATOR_CONTAINS, |
| 24718 |
OPERATOR_NOT_CONTAINS, |
| 24719 |
OPERATOR_STARTS_WITH, |
| 24720 |
// Multiple selection |
| 24721 |
OPERATOR_IS_ANY, |
| 24722 |
OPERATOR_IS_NONE, |
| 24723 |
OPERATOR_IS_ALL, |
| 24724 |
OPERATOR_IS_NOT_ALL |
| 24725 |
], |
| 24726 |
format: {}, |
| 24727 |
getValueFormatted: get_value_formatted_default_default, |
| 24728 |
validate: { |
| 24729 |
required: isValidRequired, |
| 24730 |
pattern: isValidPattern, |
| 24731 |
minLength: isValidMinLength, |
| 24732 |
maxLength: isValidMaxLength, |
| 24733 |
elements: isValidElements |
| 24734 |
} |
| 24735 |
}; |
| 24736 |
|
| 24737 |
// packages/dataviews/build-module/field-types/datetime.mjs |
| 24738 |
var import_date7 = __toESM(require_date(), 1); |
| 24739 |
|
| 24740 |
// packages/dataviews/build-module/field-types/utils/is-valid-date-boundary.mjs |
| 24741 |
var import_date6 = __toESM(require_date(), 1); |
| 24742 |
function parseDateLike(value) { |
| 24743 |
if (!value) { |
| 24744 |
return null; |
| 24745 |
} |
| 24746 |
if (!isValid(new Date(value))) { |
| 24747 |
return null; |
| 24748 |
} |
| 24749 |
const parsed = (0, import_date6.getDate)(value); |
| 24750 |
return parsed && isValid(parsed) ? parsed : null; |
| 24751 |
} |
| 24752 |
function validateDateLikeBoundary(item, field, boundary) { |
| 24753 |
const constraint = field.isValid[boundary]?.constraint; |
| 24754 |
if (typeof constraint !== "string") { |
| 24755 |
return false; |
| 24756 |
} |
| 24757 |
const value = field.getValue({ item }); |
| 24758 |
const boundaryValue = Array.isArray(value) ? value[boundary === "min" ? 0 : value.length - 1] : value; |
| 24759 |
if (boundaryValue === void 0 || boundaryValue === null || boundaryValue === "") { |
| 24760 |
return true; |
| 24761 |
} |
| 24762 |
const parsedConstraint = parseDateLike(constraint); |
| 24763 |
const parsedValue = parseDateLike(String(boundaryValue)); |
| 24764 |
return !!parsedConstraint && !!parsedValue && (boundary === "min" ? parsedValue.getTime() >= parsedConstraint.getTime() : parsedValue.getTime() <= parsedConstraint.getTime()); |
| 24765 |
} |
| 24766 |
function isValidMinDate(item, field) { |
| 24767 |
return validateDateLikeBoundary(item, field, "min"); |
| 24768 |
} |
| 24769 |
function isValidMaxDate(item, field) { |
| 24770 |
return validateDateLikeBoundary(item, field, "max"); |
| 24771 |
} |
| 24772 |
|
| 24773 |
// packages/dataviews/build-module/field-types/datetime.mjs |
| 24774 |
var format4 = { |
| 24775 |
datetime: (0, import_date7.getSettings)().formats.datetime, |
| 24776 |
weekStartsOn: (0, import_date7.getSettings)().l10n.startOfWeek |
| 24777 |
}; |
| 24778 |
function getValueFormatted4({ |
| 24779 |
item, |
| 24780 |
field |
| 24781 |
}) { |
| 24782 |
const value = field.getValue({ item }); |
| 24783 |
if (["", void 0, null].includes(value)) { |
| 24784 |
return ""; |
| 24785 |
} |
| 24786 |
let formatDatetime; |
| 24787 |
if (field.type !== "datetime") { |
| 24788 |
formatDatetime = format4; |
| 24789 |
} else { |
| 24790 |
formatDatetime = field.format; |
| 24791 |
} |
| 24792 |
return (0, import_date7.dateI18n)(formatDatetime.datetime, (0, import_date7.getDate)(value)); |
| 24793 |
} |
| 24794 |
var sort = (a2, b2, direction) => { |
| 24795 |
const timeA = new Date(a2).getTime(); |
| 24796 |
const timeB = new Date(b2).getTime(); |
| 24797 |
return direction === "asc" ? timeA - timeB : timeB - timeA; |
| 24798 |
}; |
| 24799 |
var datetime_default = { |
| 24800 |
type: "datetime", |
| 24801 |
render, |
| 24802 |
Edit: "datetime", |
| 24803 |
sort, |
| 24804 |
enableSorting: true, |
| 24805 |
enableGlobalSearch: false, |
| 24806 |
defaultOperators: [ |
| 24807 |
OPERATOR_ON, |
| 24808 |
OPERATOR_NOT_ON, |
| 24809 |
OPERATOR_BEFORE, |
| 24810 |
OPERATOR_AFTER, |
| 24811 |
OPERATOR_BEFORE_INC, |
| 24812 |
OPERATOR_AFTER_INC, |
| 24813 |
OPERATOR_IN_THE_PAST, |
| 24814 |
OPERATOR_OVER |
| 24815 |
], |
| 24816 |
validOperators: [ |
| 24817 |
OPERATOR_ON, |
| 24818 |
OPERATOR_NOT_ON, |
| 24819 |
OPERATOR_BEFORE, |
| 24820 |
OPERATOR_AFTER, |
| 24821 |
OPERATOR_BEFORE_INC, |
| 24822 |
OPERATOR_AFTER_INC, |
| 24823 |
OPERATOR_IN_THE_PAST, |
| 24824 |
OPERATOR_OVER |
| 24825 |
], |
| 24826 |
format: format4, |
| 24827 |
getValueFormatted: getValueFormatted4, |
| 24828 |
validate: { |
| 24829 |
required: isValidRequired, |
| 24830 |
elements: isValidElements, |
| 24831 |
min: isValidMinDate, |
| 24832 |
max: isValidMaxDate |
| 24833 |
} |
| 24834 |
}; |
| 24835 |
|
| 24836 |
// packages/dataviews/build-module/field-types/date.mjs |
| 24837 |
var import_date8 = __toESM(require_date(), 1); |
| 24838 |
var format5 = { |
| 24839 |
date: (0, import_date8.getSettings)().formats.date, |
| 24840 |
weekStartsOn: (0, import_date8.getSettings)().l10n.startOfWeek |
| 24841 |
}; |
| 24842 |
function getValueFormatted5({ |
| 24843 |
item, |
| 24844 |
field |
| 24845 |
}) { |
| 24846 |
const value = field.getValue({ item }); |
| 24847 |
if (["", void 0, null].includes(value)) { |
| 24848 |
return ""; |
| 24849 |
} |
| 24850 |
let formatDate2; |
| 24851 |
if (field.type !== "date") { |
| 24852 |
formatDate2 = format5; |
| 24853 |
} else { |
| 24854 |
formatDate2 = field.format; |
| 24855 |
} |
| 24856 |
return (0, import_date8.dateI18n)(formatDate2.date, (0, import_date8.getDate)(value)); |
| 24857 |
} |
| 24858 |
var sort2 = (a2, b2, direction) => { |
| 24859 |
const timeA = new Date(a2).getTime(); |
| 24860 |
const timeB = new Date(b2).getTime(); |
| 24861 |
return direction === "asc" ? timeA - timeB : timeB - timeA; |
| 24862 |
}; |
| 24863 |
var date_default = { |
| 24864 |
type: "date", |
| 24865 |
render, |
| 24866 |
Edit: "date", |
| 24867 |
sort: sort2, |
| 24868 |
enableSorting: true, |
| 24869 |
enableGlobalSearch: false, |
| 24870 |
defaultOperators: [ |
| 24871 |
OPERATOR_ON, |
| 24872 |
OPERATOR_NOT_ON, |
| 24873 |
OPERATOR_BEFORE, |
| 24874 |
OPERATOR_AFTER, |
| 24875 |
OPERATOR_BEFORE_INC, |
| 24876 |
OPERATOR_AFTER_INC, |
| 24877 |
OPERATOR_IN_THE_PAST, |
| 24878 |
OPERATOR_OVER, |
| 24879 |
OPERATOR_BETWEEN |
| 24880 |
], |
| 24881 |
validOperators: [ |
| 24882 |
OPERATOR_ON, |
| 24883 |
OPERATOR_NOT_ON, |
| 24884 |
OPERATOR_BEFORE, |
| 24885 |
OPERATOR_AFTER, |
| 24886 |
OPERATOR_BEFORE_INC, |
| 24887 |
OPERATOR_AFTER_INC, |
| 24888 |
OPERATOR_IN_THE_PAST, |
| 24889 |
OPERATOR_OVER, |
| 24890 |
OPERATOR_BETWEEN |
| 24891 |
], |
| 24892 |
format: format5, |
| 24893 |
getValueFormatted: getValueFormatted5, |
| 24894 |
validate: { |
| 24895 |
required: isValidRequired, |
| 24896 |
elements: isValidElements, |
| 24897 |
min: isValidMinDate, |
| 24898 |
max: isValidMaxDate |
| 24899 |
} |
| 24900 |
}; |
| 24901 |
|
| 24902 |
// packages/dataviews/build-module/field-types/boolean.mjs |
| 24903 |
var import_i18n47 = __toESM(require_i18n(), 1); |
| 24904 |
|
| 24905 |
// packages/dataviews/build-module/field-types/utils/is-valid-required-for-bool.mjs |
| 24906 |
function isValidRequiredForBool(item, field) { |
| 24907 |
const value = field.getValue({ item }); |
| 24908 |
return value === true; |
| 24909 |
} |
| 24910 |
|
| 24911 |
// packages/dataviews/build-module/field-types/boolean.mjs |
| 24912 |
function getValueFormatted6({ |
| 24913 |
item, |
| 24914 |
field |
| 24915 |
}) { |
| 24916 |
const value = field.getValue({ item }); |
| 24917 |
if (value === true) { |
| 24918 |
return (0, import_i18n47.__)("True"); |
| 24919 |
} |
| 24920 |
if (value === false) { |
| 24921 |
return (0, import_i18n47.__)("False"); |
| 24922 |
} |
| 24923 |
return ""; |
| 24924 |
} |
| 24925 |
function isValidCustom4(item, field) { |
| 24926 |
const value = field.getValue({ item }); |
| 24927 |
if (![void 0, "", null].includes(value) && ![true, false].includes(value)) { |
| 24928 |
return (0, import_i18n47.__)("Value must be true, false, or undefined"); |
| 24929 |
} |
| 24930 |
return null; |
| 24931 |
} |
| 24932 |
var sort3 = (a2, b2, direction) => { |
| 24933 |
const boolA = Boolean(a2); |
| 24934 |
const boolB = Boolean(b2); |
| 24935 |
if (boolA === boolB) { |
| 24936 |
return 0; |
| 24937 |
} |
| 24938 |
if (direction === "asc") { |
| 24939 |
return boolA ? 1 : -1; |
| 24940 |
} |
| 24941 |
return boolA ? -1 : 1; |
| 24942 |
}; |
| 24943 |
var boolean_default = { |
| 24944 |
type: "boolean", |
| 24945 |
render, |
| 24946 |
Edit: "checkbox", |
| 24947 |
sort: sort3, |
| 24948 |
validate: { |
| 24949 |
required: isValidRequiredForBool, |
| 24950 |
elements: isValidElements, |
| 24951 |
custom: isValidCustom4 |
| 24952 |
}, |
| 24953 |
enableSorting: true, |
| 24954 |
enableGlobalSearch: false, |
| 24955 |
defaultOperators: [OPERATOR_IS, OPERATOR_IS_NOT], |
| 24956 |
validOperators: [OPERATOR_IS, OPERATOR_IS_NOT], |
| 24957 |
format: {}, |
| 24958 |
getValueFormatted: getValueFormatted6 |
| 24959 |
}; |
| 24960 |
|
| 24961 |
// packages/dataviews/build-module/field-types/media.mjs |
| 24962 |
var media_default = { |
| 24963 |
type: "media", |
| 24964 |
render: () => null, |
| 24965 |
Edit: null, |
| 24966 |
sort: () => 0, |
| 24967 |
enableSorting: false, |
| 24968 |
enableGlobalSearch: false, |
| 24969 |
defaultOperators: [], |
| 24970 |
validOperators: [], |
| 24971 |
format: {}, |
| 24972 |
getValueFormatted: get_value_formatted_default_default, |
| 24973 |
// cannot validate any constraint, so |
| 24974 |
// the only available validation for the field author |
| 24975 |
// would be providing a custom validator. |
| 24976 |
validate: {} |
| 24977 |
}; |
| 24978 |
|
| 24979 |
// packages/dataviews/build-module/field-types/array.mjs |
| 24980 |
var import_i18n48 = __toESM(require_i18n(), 1); |
| 24981 |
|
| 24982 |
// packages/dataviews/build-module/field-types/utils/is-valid-required-for-array.mjs |
| 24983 |
function isValidRequiredForArray(item, field) { |
| 24984 |
const value = field.getValue({ item }); |
| 24985 |
return Array.isArray(value) && value.length > 0 && value.every( |
| 24986 |
(element) => ![void 0, "", null].includes(element) |
| 24987 |
); |
| 24988 |
} |
| 24989 |
|
| 24990 |
// packages/dataviews/build-module/field-types/array.mjs |
| 24991 |
function getValueFormatted7({ |
| 24992 |
item, |
| 24993 |
field |
| 24994 |
}) { |
| 24995 |
const value = field.getValue({ item }); |
| 24996 |
const arr = Array.isArray(value) ? value : []; |
| 24997 |
return arr.join(", "); |
| 24998 |
} |
| 24999 |
function render2({ item, field }) { |
| 25000 |
return getValueFormatted7({ item, field }); |
| 25001 |
} |
| 25002 |
function isValidCustom5(item, field) { |
| 25003 |
const value = field.getValue({ item }); |
| 25004 |
if (![void 0, "", null].includes(value) && !Array.isArray(value)) { |
| 25005 |
return (0, import_i18n48.__)("Value must be an array."); |
| 25006 |
} |
| 25007 |
if (!value.every((v2) => typeof v2 === "string")) { |
| 25008 |
return (0, import_i18n48.__)("Every value must be a string."); |
| 25009 |
} |
| 25010 |
return null; |
| 25011 |
} |
| 25012 |
var sort4 = (a2, b2, direction) => { |
| 25013 |
const arrA = Array.isArray(a2) ? a2 : []; |
| 25014 |
const arrB = Array.isArray(b2) ? b2 : []; |
| 25015 |
if (arrA.length !== arrB.length) { |
| 25016 |
return direction === "asc" ? arrA.length - arrB.length : arrB.length - arrA.length; |
| 25017 |
} |
| 25018 |
const joinedA = arrA.join(","); |
| 25019 |
const joinedB = arrB.join(","); |
| 25020 |
return direction === "asc" ? joinedA.localeCompare(joinedB) : joinedB.localeCompare(joinedA); |
| 25021 |
}; |
| 25022 |
var array_default = { |
| 25023 |
type: "array", |
| 25024 |
render: render2, |
| 25025 |
Edit: "array", |
| 25026 |
sort: sort4, |
| 25027 |
enableSorting: true, |
| 25028 |
enableGlobalSearch: false, |
| 25029 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 25030 |
validOperators: [ |
| 25031 |
OPERATOR_IS_ANY, |
| 25032 |
OPERATOR_IS_NONE, |
| 25033 |
OPERATOR_IS_ALL, |
| 25034 |
OPERATOR_IS_NOT_ALL |
| 25035 |
], |
| 25036 |
format: {}, |
| 25037 |
getValueFormatted: getValueFormatted7, |
| 25038 |
validate: { |
| 25039 |
required: isValidRequiredForArray, |
| 25040 |
elements: isValidElements, |
| 25041 |
custom: isValidCustom5 |
| 25042 |
} |
| 25043 |
}; |
| 25044 |
|
| 25045 |
// packages/dataviews/build-module/field-types/password.mjs |
| 25046 |
function getValueFormatted8({ |
| 25047 |
item, |
| 25048 |
field |
| 25049 |
}) { |
| 25050 |
return field.getValue({ item }) ? "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" : ""; |
| 25051 |
} |
| 25052 |
var password_default = { |
| 25053 |
type: "password", |
| 25054 |
render, |
| 25055 |
Edit: "password", |
| 25056 |
sort: () => 0, |
| 25057 |
// Passwords should not be sortable for security reasons |
| 25058 |
enableSorting: false, |
| 25059 |
enableGlobalSearch: false, |
| 25060 |
defaultOperators: [], |
| 25061 |
validOperators: [], |
| 25062 |
format: {}, |
| 25063 |
getValueFormatted: getValueFormatted8, |
| 25064 |
validate: { |
| 25065 |
required: isValidRequired, |
| 25066 |
pattern: isValidPattern, |
| 25067 |
minLength: isValidMinLength, |
| 25068 |
maxLength: isValidMaxLength, |
| 25069 |
elements: isValidElements |
| 25070 |
} |
| 25071 |
}; |
| 25072 |
|
| 25073 |
// packages/dataviews/build-module/field-types/telephone.mjs |
| 25074 |
var telephone_default = { |
| 25075 |
type: "telephone", |
| 25076 |
render, |
| 25077 |
Edit: "telephone", |
| 25078 |
sort: sort_text_default, |
| 25079 |
enableSorting: true, |
| 25080 |
enableGlobalSearch: false, |
| 25081 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 25082 |
validOperators: [ |
| 25083 |
OPERATOR_IS, |
| 25084 |
OPERATOR_IS_NOT, |
| 25085 |
OPERATOR_CONTAINS, |
| 25086 |
OPERATOR_NOT_CONTAINS, |
| 25087 |
OPERATOR_STARTS_WITH, |
| 25088 |
// Multiple selection |
| 25089 |
OPERATOR_IS_ANY, |
| 25090 |
OPERATOR_IS_NONE, |
| 25091 |
OPERATOR_IS_ALL, |
| 25092 |
OPERATOR_IS_NOT_ALL |
| 25093 |
], |
| 25094 |
format: {}, |
| 25095 |
getValueFormatted: get_value_formatted_default_default, |
| 25096 |
validate: { |
| 25097 |
required: isValidRequired, |
| 25098 |
pattern: isValidPattern, |
| 25099 |
minLength: isValidMinLength, |
| 25100 |
maxLength: isValidMaxLength, |
| 25101 |
elements: isValidElements |
| 25102 |
} |
| 25103 |
}; |
| 25104 |
|
| 25105 |
// packages/dataviews/build-module/field-types/color.mjs |
| 25106 |
var import_i18n49 = __toESM(require_i18n(), 1); |
| 25107 |
var import_jsx_runtime115 = __toESM(require_jsx_runtime(), 1); |
| 25108 |
function render3({ item, field }) { |
| 25109 |
if (field.hasElements) { |
| 25110 |
return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(RenderFromElements, { item, field }); |
| 25111 |
} |
| 25112 |
const value = get_value_formatted_default_default({ item, field }); |
| 25113 |
if (!value || !w(value).isValid()) { |
| 25114 |
return value; |
| 25115 |
} |
| 25116 |
return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [ |
| 25117 |
/* @__PURE__ */ (0, import_jsx_runtime115.jsx)( |
| 25118 |
"div", |
| 25119 |
{ |
| 25120 |
style: { |
| 25121 |
width: "16px", |
| 25122 |
height: "16px", |
| 25123 |
borderRadius: "50%", |
| 25124 |
backgroundColor: value, |
| 25125 |
border: "1px solid #ddd", |
| 25126 |
flexShrink: 0 |
| 25127 |
} |
| 25128 |
} |
| 25129 |
), |
| 25130 |
/* @__PURE__ */ (0, import_jsx_runtime115.jsx)("span", { children: value }) |
| 25131 |
] }); |
| 25132 |
} |
| 25133 |
function isValidCustom6(item, field) { |
| 25134 |
const value = field.getValue({ item }); |
| 25135 |
if (![void 0, "", null].includes(value) && !w(value).isValid()) { |
| 25136 |
return (0, import_i18n49.__)("Value must be a valid color."); |
| 25137 |
} |
| 25138 |
return null; |
| 25139 |
} |
| 25140 |
var sort5 = (a2, b2, direction) => { |
| 25141 |
const colorA = w(a2); |
| 25142 |
const colorB = w(b2); |
| 25143 |
if (!colorA.isValid() && !colorB.isValid()) { |
| 25144 |
return 0; |
| 25145 |
} |
| 25146 |
if (!colorA.isValid()) { |
| 25147 |
return direction === "asc" ? 1 : -1; |
| 25148 |
} |
| 25149 |
if (!colorB.isValid()) { |
| 25150 |
return direction === "asc" ? -1 : 1; |
| 25151 |
} |
| 25152 |
const hslA = colorA.toHsl(); |
| 25153 |
const hslB = colorB.toHsl(); |
| 25154 |
if (hslA.h !== hslB.h) { |
| 25155 |
return direction === "asc" ? hslA.h - hslB.h : hslB.h - hslA.h; |
| 25156 |
} |
| 25157 |
if (hslA.s !== hslB.s) { |
| 25158 |
return direction === "asc" ? hslA.s - hslB.s : hslB.s - hslA.s; |
| 25159 |
} |
| 25160 |
return direction === "asc" ? hslA.l - hslB.l : hslB.l - hslA.l; |
| 25161 |
}; |
| 25162 |
var color_default = { |
| 25163 |
type: "color", |
| 25164 |
render: render3, |
| 25165 |
Edit: "color", |
| 25166 |
sort: sort5, |
| 25167 |
enableSorting: true, |
| 25168 |
enableGlobalSearch: false, |
| 25169 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 25170 |
validOperators: [ |
| 25171 |
OPERATOR_IS, |
| 25172 |
OPERATOR_IS_NOT, |
| 25173 |
OPERATOR_IS_ANY, |
| 25174 |
OPERATOR_IS_NONE |
| 25175 |
], |
| 25176 |
format: {}, |
| 25177 |
getValueFormatted: get_value_formatted_default_default, |
| 25178 |
validate: { |
| 25179 |
required: isValidRequired, |
| 25180 |
elements: isValidElements, |
| 25181 |
custom: isValidCustom6 |
| 25182 |
} |
| 25183 |
}; |
| 25184 |
|
| 25185 |
// packages/dataviews/build-module/field-types/url.mjs |
| 25186 |
var url_default = { |
| 25187 |
type: "url", |
| 25188 |
render, |
| 25189 |
Edit: "url", |
| 25190 |
sort: sort_text_default, |
| 25191 |
enableSorting: true, |
| 25192 |
enableGlobalSearch: false, |
| 25193 |
defaultOperators: [OPERATOR_IS_ANY, OPERATOR_IS_NONE], |
| 25194 |
validOperators: [ |
| 25195 |
OPERATOR_IS, |
| 25196 |
OPERATOR_IS_NOT, |
| 25197 |
OPERATOR_CONTAINS, |
| 25198 |
OPERATOR_NOT_CONTAINS, |
| 25199 |
OPERATOR_STARTS_WITH, |
| 25200 |
// Multiple selection |
| 25201 |
OPERATOR_IS_ANY, |
| 25202 |
OPERATOR_IS_NONE, |
| 25203 |
OPERATOR_IS_ALL, |
| 25204 |
OPERATOR_IS_NOT_ALL |
| 25205 |
], |
| 25206 |
format: {}, |
| 25207 |
getValueFormatted: get_value_formatted_default_default, |
| 25208 |
validate: { |
| 25209 |
required: isValidRequired, |
| 25210 |
pattern: isValidPattern, |
| 25211 |
minLength: isValidMinLength, |
| 25212 |
maxLength: isValidMaxLength, |
| 25213 |
elements: isValidElements |
| 25214 |
} |
| 25215 |
}; |
| 25216 |
|
| 25217 |
// packages/dataviews/build-module/field-types/no-type.mjs |
| 25218 |
var sort6 = (a2, b2, direction) => { |
| 25219 |
if (typeof a2 === "number" && typeof b2 === "number") { |
| 25220 |
return sort_number_default(a2, b2, direction); |
| 25221 |
} |
| 25222 |
return sort_text_default(a2, b2, direction); |
| 25223 |
}; |
| 25224 |
var no_type_default = { |
| 25225 |
// type: no type for this one |
| 25226 |
render, |
| 25227 |
Edit: null, |
| 25228 |
sort: sort6, |
| 25229 |
enableSorting: true, |
| 25230 |
enableGlobalSearch: false, |
| 25231 |
defaultOperators: [OPERATOR_IS, OPERATOR_IS_NOT], |
| 25232 |
validOperators: getAllOperatorNames(), |
| 25233 |
format: {}, |
| 25234 |
getValueFormatted: get_value_formatted_default_default, |
| 25235 |
validate: { |
| 25236 |
required: isValidRequired, |
| 25237 |
elements: isValidElements |
| 25238 |
} |
| 25239 |
}; |
| 25240 |
|
| 25241 |
// packages/dataviews/build-module/field-types/utils/get-is-valid.mjs |
| 25242 |
function supportsNumericRangeConstraint(type) { |
| 25243 |
return type === "integer" || type === "number"; |
| 25244 |
} |
| 25245 |
function supportsDateRangeConstraint(type) { |
| 25246 |
return type === "date" || type === "datetime"; |
| 25247 |
} |
| 25248 |
function normalizeRangeRule(value, fieldType, key) { |
| 25249 |
const validator = fieldType.validate[key]; |
| 25250 |
if (validator && (typeof value === "number" && supportsNumericRangeConstraint(fieldType.type) || typeof value === "string" && supportsDateRangeConstraint(fieldType.type))) { |
| 25251 |
return { constraint: value, validate: validator }; |
| 25252 |
} |
| 25253 |
return void 0; |
| 25254 |
} |
| 25255 |
function getIsValid(field, fieldType) { |
| 25256 |
const rules = field.isValid; |
| 25257 |
let required; |
| 25258 |
if (rules?.required === true && fieldType.validate.required !== void 0) { |
| 25259 |
required = { |
| 25260 |
constraint: true, |
| 25261 |
validate: fieldType.validate.required |
| 25262 |
}; |
| 25263 |
} |
| 25264 |
let elements; |
| 25265 |
if ((rules?.elements === true || // elements is enabled unless the field opts-out |
| 25266 |
rules?.elements === void 0 && (!!field.elements || !!field.getElements)) && fieldType.validate.elements !== void 0) { |
| 25267 |
elements = { |
| 25268 |
constraint: true, |
| 25269 |
validate: fieldType.validate.elements |
| 25270 |
}; |
| 25271 |
} |
| 25272 |
const min2 = normalizeRangeRule(rules?.min, fieldType, "min"); |
| 25273 |
const max2 = normalizeRangeRule(rules?.max, fieldType, "max"); |
| 25274 |
const minLengthValue = rules?.minLength; |
| 25275 |
let minLength; |
| 25276 |
if (typeof minLengthValue === "number" && fieldType.validate.minLength !== void 0) { |
| 25277 |
minLength = { |
| 25278 |
constraint: minLengthValue, |
| 25279 |
validate: fieldType.validate.minLength |
| 25280 |
}; |
| 25281 |
} |
| 25282 |
const maxLengthValue = rules?.maxLength; |
| 25283 |
let maxLength; |
| 25284 |
if (typeof maxLengthValue === "number" && fieldType.validate.maxLength !== void 0) { |
| 25285 |
maxLength = { |
| 25286 |
constraint: maxLengthValue, |
| 25287 |
validate: fieldType.validate.maxLength |
| 25288 |
}; |
| 25289 |
} |
| 25290 |
const patternValue = rules?.pattern; |
| 25291 |
let pattern; |
| 25292 |
if (patternValue !== void 0 && fieldType.validate.pattern !== void 0) { |
| 25293 |
pattern = { |
| 25294 |
constraint: patternValue, |
| 25295 |
validate: fieldType.validate.pattern |
| 25296 |
}; |
| 25297 |
} |
| 25298 |
const custom = rules?.custom ?? fieldType.validate.custom; |
| 25299 |
return { |
| 25300 |
required, |
| 25301 |
elements, |
| 25302 |
min: min2, |
| 25303 |
max: max2, |
| 25304 |
minLength, |
| 25305 |
maxLength, |
| 25306 |
pattern, |
| 25307 |
custom |
| 25308 |
}; |
| 25309 |
} |
| 25310 |
|
| 25311 |
// packages/dataviews/build-module/field-types/utils/get-filter.mjs |
| 25312 |
function getFilter(fieldType) { |
| 25313 |
return fieldType.validOperators.reduce((accumulator, operator) => { |
| 25314 |
const operatorObj = getOperatorByName(operator); |
| 25315 |
if (operatorObj?.filter) { |
| 25316 |
accumulator[operator] = operatorObj.filter; |
| 25317 |
} |
| 25318 |
return accumulator; |
| 25319 |
}, {}); |
| 25320 |
} |
| 25321 |
|
| 25322 |
// packages/dataviews/build-module/field-types/utils/get-format.mjs |
| 25323 |
function getFormat(field, fieldType) { |
| 25324 |
return { |
| 25325 |
...fieldType.format, |
| 25326 |
...field.format |
| 25327 |
}; |
| 25328 |
} |
| 25329 |
var get_format_default = getFormat; |
| 25330 |
|
| 25331 |
// packages/dataviews/build-module/field-types/index.mjs |
| 25332 |
function getFieldTypeByName(type) { |
| 25333 |
const found = [ |
| 25334 |
email_default, |
| 25335 |
integer_default, |
| 25336 |
number_default, |
| 25337 |
text_default, |
| 25338 |
datetime_default, |
| 25339 |
date_default, |
| 25340 |
boolean_default, |
| 25341 |
media_default, |
| 25342 |
array_default, |
| 25343 |
password_default, |
| 25344 |
telephone_default, |
| 25345 |
color_default, |
| 25346 |
url_default |
| 25347 |
].find((fieldType) => fieldType?.type === type); |
| 25348 |
if (!!found) { |
| 25349 |
return found; |
| 25350 |
} |
| 25351 |
return no_type_default; |
| 25352 |
} |
| 25353 |
function normalizeFields(fields) { |
| 25354 |
return fields.map((field) => { |
| 25355 |
const fieldType = getFieldTypeByName(field.type); |
| 25356 |
const getValue = field.getValue || get_value_from_id_default(field.id); |
| 25357 |
const sort7 = function(a2, b2, direction) { |
| 25358 |
const aValue = getValue({ item: a2 }); |
| 25359 |
const bValue = getValue({ item: b2 }); |
| 25360 |
return field.sort ? field.sort(aValue, bValue, direction) : fieldType.sort(aValue, bValue, direction); |
| 25361 |
}; |
| 25362 |
return { |
| 25363 |
id: field.id, |
| 25364 |
label: field.label || field.id, |
| 25365 |
header: field.header || field.label || field.id, |
| 25366 |
description: field.description, |
| 25367 |
placeholder: field.placeholder, |
| 25368 |
getValue, |
| 25369 |
setValue: field.setValue || set_value_from_id_default(field.id), |
| 25370 |
elements: field.elements, |
| 25371 |
getElements: field.getElements, |
| 25372 |
hasElements: hasElements(field), |
| 25373 |
isVisible: field.isVisible, |
| 25374 |
isDisabled: typeof field.isDisabled === "function" ? field.isDisabled : () => !!field.isDisabled, |
| 25375 |
enableHiding: field.enableHiding ?? true, |
| 25376 |
readOnly: field.readOnly ?? false, |
| 25377 |
// The type provides defaults for the following props |
| 25378 |
type: fieldType.type, |
| 25379 |
render: field.render ?? fieldType.render, |
| 25380 |
Edit: getControl(field, fieldType.Edit), |
| 25381 |
sort: sort7, |
| 25382 |
enableSorting: field.enableSorting ?? fieldType.enableSorting, |
| 25383 |
enableGlobalSearch: field.enableGlobalSearch ?? fieldType.enableGlobalSearch, |
| 25384 |
isValid: getIsValid(field, fieldType), |
| 25385 |
filterBy: get_filter_by_default( |
| 25386 |
field, |
| 25387 |
fieldType.defaultOperators, |
| 25388 |
fieldType.validOperators |
| 25389 |
), |
| 25390 |
filter: getFilter(fieldType), |
| 25391 |
format: get_format_default(field, fieldType), |
| 25392 |
getValueFormatted: field.getValueFormatted ?? fieldType.getValueFormatted |
| 25393 |
}; |
| 25394 |
}); |
| 25395 |
} |
| 25396 |
|
| 25397 |
// packages/dataviews/build-module/hooks/use-data.mjs |
| 25398 |
var import_element71 = __toESM(require_element(), 1); |
| 25399 |
function useData({ |
| 25400 |
view, |
| 25401 |
data: shownData, |
| 25402 |
getItemId, |
| 25403 |
isLoading, |
| 25404 |
paginationInfo, |
| 25405 |
selection |
| 25406 |
}) { |
| 25407 |
const isInfiniteScrollEnabled = view.infiniteScrollEnabled; |
| 25408 |
const [hasInitiallyLoaded, setHasInitiallyLoaded] = (0, import_element71.useState)( |
| 25409 |
!isLoading |
| 25410 |
); |
| 25411 |
(0, import_element71.useEffect)(() => { |
| 25412 |
if (!isLoading) { |
| 25413 |
setHasInitiallyLoaded(true); |
| 25414 |
} |
| 25415 |
}, [isLoading]); |
| 25416 |
const previousDataRef = (0, import_element71.useRef)(shownData); |
| 25417 |
const previousPaginationInfoRef = (0, import_element71.useRef)(paginationInfo); |
| 25418 |
(0, import_element71.useEffect)(() => { |
| 25419 |
if (!isLoading) { |
| 25420 |
previousDataRef.current = shownData; |
| 25421 |
previousPaginationInfoRef.current = paginationInfo; |
| 25422 |
} |
| 25423 |
}, [shownData, isLoading, paginationInfo]); |
| 25424 |
const [visibleEntries, setVisibleEntries] = (0, import_element71.useState)([]); |
| 25425 |
const positionMapRef = (0, import_element71.useRef)(/* @__PURE__ */ new Map()); |
| 25426 |
const allLoadedRecordsRef = (0, import_element71.useRef)([]); |
| 25427 |
const prevViewParamsRef = (0, import_element71.useRef)({ |
| 25428 |
search: void 0, |
| 25429 |
filters: void 0, |
| 25430 |
perPage: void 0 |
| 25431 |
}); |
| 25432 |
const scrollDirectionRef = (0, import_element71.useRef)(void 0); |
| 25433 |
const prevStartPositionRef = (0, import_element71.useRef)(void 0); |
| 25434 |
const hasInitializedRef = (0, import_element71.useRef)(false); |
| 25435 |
const allLoadedRecords = (0, import_element71.useMemo)(() => { |
| 25436 |
if (view.startPosition !== void 0 && prevStartPositionRef.current !== void 0) { |
| 25437 |
if (view.startPosition < prevStartPositionRef.current) { |
| 25438 |
scrollDirectionRef.current = "up"; |
| 25439 |
} else if (view.startPosition > prevStartPositionRef.current) { |
| 25440 |
scrollDirectionRef.current = "down"; |
| 25441 |
} |
| 25442 |
} |
| 25443 |
prevStartPositionRef.current = view.startPosition; |
| 25444 |
const currentFiltersKey = JSON.stringify(view.filters ?? []); |
| 25445 |
const prevFiltersKey = prevViewParamsRef.current.filters; |
| 25446 |
const shouldReset = !hasInitializedRef.current || !view.infiniteScrollEnabled || view.search !== prevViewParamsRef.current.search || currentFiltersKey !== prevFiltersKey || view.perPage !== prevViewParamsRef.current.perPage; |
| 25447 |
hasInitializedRef.current = true; |
| 25448 |
prevViewParamsRef.current = { |
| 25449 |
search: view.search, |
| 25450 |
filters: currentFiltersKey, |
| 25451 |
perPage: view.perPage |
| 25452 |
}; |
| 25453 |
if (shouldReset) { |
| 25454 |
positionMapRef.current.clear(); |
| 25455 |
scrollDirectionRef.current = void 0; |
| 25456 |
const startPosition = view.search ? 1 : view.startPosition ?? 1; |
| 25457 |
const records = shownData.map((record, index2) => { |
| 25458 |
const position = startPosition + index2; |
| 25459 |
positionMapRef.current.set(getItemId(record), position); |
| 25460 |
return { |
| 25461 |
...record, |
| 25462 |
position |
| 25463 |
}; |
| 25464 |
}); |
| 25465 |
allLoadedRecordsRef.current = records; |
| 25466 |
return records; |
| 25467 |
} |
| 25468 |
const prev = allLoadedRecordsRef.current; |
| 25469 |
const shownDataIds = new Set(shownData.map(getItemId)); |
| 25470 |
const scrollDirection = scrollDirectionRef.current; |
| 25471 |
const basePosition = view.search ? 1 : view.startPosition ?? 1; |
| 25472 |
const newRecords = shownData.map((record, index2) => { |
| 25473 |
const itemId = getItemId(record); |
| 25474 |
const position = view.infiniteScrollEnabled ? basePosition + index2 : void 0; |
| 25475 |
if (position !== void 0) { |
| 25476 |
positionMapRef.current.set(itemId, position); |
| 25477 |
} |
| 25478 |
return { |
| 25479 |
...record, |
| 25480 |
position |
| 25481 |
}; |
| 25482 |
}); |
| 25483 |
if (newRecords.length === 0) { |
| 25484 |
return prev; |
| 25485 |
} |
| 25486 |
const prevWithoutDuplicates = prev.filter( |
| 25487 |
(record) => !shownDataIds.has(getItemId(record)) |
| 25488 |
); |
| 25489 |
const allRecords = scrollDirection === "up" ? [...newRecords, ...prevWithoutDuplicates] : [...prevWithoutDuplicates, ...newRecords]; |
| 25490 |
allRecords.sort((a2, b2) => { |
| 25491 |
const posA = a2.position; |
| 25492 |
const posB = b2.position; |
| 25493 |
return posA - posB; |
| 25494 |
}); |
| 25495 |
let result = allRecords; |
| 25496 |
if (visibleEntries.length > 0) { |
| 25497 |
const visibleMin = Math.min(...visibleEntries); |
| 25498 |
const visibleMax = Math.max(...visibleEntries); |
| 25499 |
const buffer = 20; |
| 25500 |
const recordPositions = allRecords.map( |
| 25501 |
(r3) => r3.position |
| 25502 |
); |
| 25503 |
const minRecordPos = Math.min(...recordPositions); |
| 25504 |
const maxRecordPos = Math.max(...recordPositions); |
| 25505 |
const hasOverlap = !(maxRecordPos < visibleMin - buffer || minRecordPos > visibleMax + buffer); |
| 25506 |
if (hasOverlap) { |
| 25507 |
result = allRecords.filter((record) => { |
| 25508 |
const itemId = getItemId(record); |
| 25509 |
const isSelected2 = selection?.includes(itemId); |
| 25510 |
if (isSelected2) { |
| 25511 |
return true; |
| 25512 |
} |
| 25513 |
const itemPosition = record.position; |
| 25514 |
if (scrollDirection === "up") { |
| 25515 |
return itemPosition <= visibleMax + buffer; |
| 25516 |
} else if (scrollDirection === "down") { |
| 25517 |
return itemPosition >= visibleMin - buffer; |
| 25518 |
} |
| 25519 |
return itemPosition >= visibleMin - buffer && itemPosition <= visibleMax + buffer; |
| 25520 |
}); |
| 25521 |
} |
| 25522 |
} |
| 25523 |
allLoadedRecordsRef.current = result; |
| 25524 |
return result; |
| 25525 |
}, [ |
| 25526 |
shownData, |
| 25527 |
view.search, |
| 25528 |
view.filters, |
| 25529 |
view.perPage, |
| 25530 |
view.startPosition, |
| 25531 |
view.infiniteScrollEnabled, |
| 25532 |
visibleEntries, |
| 25533 |
selection, |
| 25534 |
getItemId |
| 25535 |
]); |
| 25536 |
if (!isInfiniteScrollEnabled) { |
| 25537 |
const dataToReturn = isLoading && previousDataRef.current?.length ? previousDataRef.current : shownData; |
| 25538 |
return { |
| 25539 |
data: dataToReturn.map((item) => ({ |
| 25540 |
...item, |
| 25541 |
position: void 0 |
| 25542 |
})), |
| 25543 |
paginationInfo: isLoading && previousDataRef.current?.length ? previousPaginationInfoRef.current : paginationInfo, |
| 25544 |
hasInitiallyLoaded, |
| 25545 |
setVisibleEntries: void 0 |
| 25546 |
}; |
| 25547 |
} |
| 25548 |
return { |
| 25549 |
data: allLoadedRecords, |
| 25550 |
paginationInfo, |
| 25551 |
hasInitiallyLoaded, |
| 25552 |
setVisibleEntries |
| 25553 |
}; |
| 25554 |
} |
| 25555 |
|
| 25556 |
// packages/dataviews/build-module/hooks/use-infinite-scroll.mjs |
| 25557 |
var import_element72 = __toESM(require_element(), 1); |
| 25558 |
var import_compose12 = __toESM(require_compose(), 1); |
| 25559 |
function captureAnchorElement(container, anchorElementRef, direction) { |
| 25560 |
const containerRect = container.getBoundingClientRect(); |
| 25561 |
const centerY = containerRect.top + containerRect.height / 2; |
| 25562 |
const items = Array.from(container.querySelectorAll("[aria-posinset]")); |
| 25563 |
if (items.length === 0) { |
| 25564 |
return false; |
| 25565 |
} |
| 25566 |
const bestAnchor = items.reduce((best, item) => { |
| 25567 |
const itemRect = item.getBoundingClientRect(); |
| 25568 |
const itemCenterY = itemRect.top + itemRect.height / 2; |
| 25569 |
const distance = Math.abs(itemCenterY - centerY); |
| 25570 |
const bestRect = best.getBoundingClientRect(); |
| 25571 |
const bestCenterY = bestRect.top + bestRect.height / 2; |
| 25572 |
const bestDistance = Math.abs(bestCenterY - centerY); |
| 25573 |
return distance < bestDistance ? item : best; |
| 25574 |
}); |
| 25575 |
const posinset = Number(bestAnchor.getAttribute("aria-posinset")); |
| 25576 |
const anchorRect = bestAnchor.getBoundingClientRect(); |
| 25577 |
anchorElementRef.current = { |
| 25578 |
posinset, |
| 25579 |
viewportOffset: anchorRect.top - containerRect.top, |
| 25580 |
direction |
| 25581 |
}; |
| 25582 |
return true; |
| 25583 |
} |
| 25584 |
function useInfiniteScroll({ |
| 25585 |
view, |
| 25586 |
onChangeView, |
| 25587 |
isLoading, |
| 25588 |
paginationInfo, |
| 25589 |
containerRef, |
| 25590 |
setVisibleEntries |
| 25591 |
}) { |
| 25592 |
const anchorElementRef = (0, import_element72.useRef)(null); |
| 25593 |
const viewRef = (0, import_element72.useRef)(view); |
| 25594 |
const isLoadingRef = (0, import_element72.useRef)(isLoading); |
| 25595 |
const onChangeViewRef = (0, import_element72.useRef)(onChangeView); |
| 25596 |
const totalItemsRef = (0, import_element72.useRef)(paginationInfo.totalItems); |
| 25597 |
(0, import_element72.useLayoutEffect)(() => { |
| 25598 |
viewRef.current = view; |
| 25599 |
isLoadingRef.current = isLoading; |
| 25600 |
onChangeViewRef.current = onChangeView; |
| 25601 |
totalItemsRef.current = paginationInfo.totalItems; |
| 25602 |
}, [view, isLoading, onChangeView, paginationInfo.totalItems]); |
| 25603 |
const intersectionObserverCallback = (0, import_element72.useCallback)( |
| 25604 |
(entries) => { |
| 25605 |
if (!setVisibleEntries) { |
| 25606 |
return; |
| 25607 |
} |
| 25608 |
setVisibleEntries((prev) => { |
| 25609 |
const newVisibleEntries = new Set(prev); |
| 25610 |
let hasChanged = false; |
| 25611 |
entries.forEach((entry) => { |
| 25612 |
const posInSet = Number( |
| 25613 |
entry.target?.attributes?.getNamedItem( |
| 25614 |
"aria-posinset" |
| 25615 |
)?.value |
| 25616 |
); |
| 25617 |
if (isNaN(posInSet)) { |
| 25618 |
return; |
| 25619 |
} |
| 25620 |
if (entry.isIntersecting) { |
| 25621 |
if (!newVisibleEntries.has(posInSet)) { |
| 25622 |
newVisibleEntries.add(posInSet); |
| 25623 |
hasChanged = true; |
| 25624 |
} |
| 25625 |
} else if (newVisibleEntries.has(posInSet)) { |
| 25626 |
newVisibleEntries.delete(posInSet); |
| 25627 |
hasChanged = true; |
| 25628 |
} |
| 25629 |
}); |
| 25630 |
return hasChanged ? Array.from(newVisibleEntries).sort() : prev; |
| 25631 |
}); |
| 25632 |
}, |
| 25633 |
[setVisibleEntries] |
| 25634 |
); |
| 25635 |
(0, import_element72.useLayoutEffect)(() => { |
| 25636 |
const container = containerRef.current; |
| 25637 |
const anchor = anchorElementRef.current; |
| 25638 |
if (!container || !view.infiniteScrollEnabled || !anchor || isLoading) { |
| 25639 |
return; |
| 25640 |
} |
| 25641 |
const anchorElement = container.querySelector( |
| 25642 |
`[aria-posinset="${anchor.posinset}"]` |
| 25643 |
); |
| 25644 |
if (anchorElement) { |
| 25645 |
const containerRect = container.getBoundingClientRect(); |
| 25646 |
const anchorRect = anchorElement.getBoundingClientRect(); |
| 25647 |
const currentOffset = anchorRect.top - containerRect.top; |
| 25648 |
const scrollAdjustment = currentOffset - anchor.viewportOffset; |
| 25649 |
if (Math.abs(scrollAdjustment) > 1) { |
| 25650 |
container.scrollTop += scrollAdjustment; |
| 25651 |
} |
| 25652 |
} |
| 25653 |
anchorElementRef.current = null; |
| 25654 |
}, [containerRef, isLoading, view.infiniteScrollEnabled]); |
| 25655 |
const intersectionObserverRef = (0, import_element72.useRef)( |
| 25656 |
null |
| 25657 |
); |
| 25658 |
(0, import_element72.useEffect)(() => { |
| 25659 |
if (!view.infiniteScrollEnabled || !intersectionObserverCallback) { |
| 25660 |
if (intersectionObserverRef.current) { |
| 25661 |
intersectionObserverRef.current.disconnect(); |
| 25662 |
intersectionObserverRef.current = null; |
| 25663 |
} |
| 25664 |
return; |
| 25665 |
} |
| 25666 |
intersectionObserverRef.current = new IntersectionObserver( |
| 25667 |
intersectionObserverCallback, |
| 25668 |
{ root: null, rootMargin: "0px", threshold: 0.1 } |
| 25669 |
); |
| 25670 |
return () => { |
| 25671 |
if (intersectionObserverRef.current) { |
| 25672 |
intersectionObserverRef.current.disconnect(); |
| 25673 |
intersectionObserverRef.current = null; |
| 25674 |
} |
| 25675 |
}; |
| 25676 |
}, [view.infiniteScrollEnabled, intersectionObserverCallback]); |
| 25677 |
(0, import_element72.useEffect)(() => { |
| 25678 |
if (!view.infiniteScrollEnabled || !containerRef.current) { |
| 25679 |
return; |
| 25680 |
} |
| 25681 |
let lastScrollTop = 0; |
| 25682 |
const BOTTOM_THRESHOLD = 600; |
| 25683 |
const TOP_THRESHOLD = 800; |
| 25684 |
const handleScroll = (0, import_compose12.throttle)((event) => { |
| 25685 |
const currentView = viewRef.current; |
| 25686 |
const totalItems = totalItemsRef.current; |
| 25687 |
const target = event.target; |
| 25688 |
const scrollTop = target.scrollTop; |
| 25689 |
const scrollHeight = target.scrollHeight; |
| 25690 |
const clientHeight = target.clientHeight; |
| 25691 |
const scrollDirection = scrollTop > lastScrollTop ? "down" : "up"; |
| 25692 |
lastScrollTop = scrollTop; |
| 25693 |
if (isLoadingRef.current) { |
| 25694 |
return; |
| 25695 |
} |
| 25696 |
const currentStartPosition = currentView.startPosition || 1; |
| 25697 |
const batchSize = currentView.perPage || 10; |
| 25698 |
const currentEndPosition = Math.min( |
| 25699 |
currentStartPosition + batchSize, |
| 25700 |
totalItems |
| 25701 |
); |
| 25702 |
if (scrollDirection === "down" && scrollTop + clientHeight >= scrollHeight - BOTTOM_THRESHOLD) { |
| 25703 |
if (currentEndPosition < totalItems) { |
| 25704 |
const newStartPosition = currentEndPosition; |
| 25705 |
captureAnchorElement(target, anchorElementRef, "down"); |
| 25706 |
onChangeViewRef.current({ |
| 25707 |
...currentView, |
| 25708 |
startPosition: newStartPosition |
| 25709 |
}); |
| 25710 |
} |
| 25711 |
} |
| 25712 |
if (scrollDirection === "up" && scrollTop <= TOP_THRESHOLD) { |
| 25713 |
if (currentStartPosition > 1) { |
| 25714 |
const calculatedStartPosition = currentStartPosition - batchSize; |
| 25715 |
const newStartPosition = calculatedStartPosition < 6 ? 1 : calculatedStartPosition; |
| 25716 |
captureAnchorElement(target, anchorElementRef, "up"); |
| 25717 |
onChangeViewRef.current({ |
| 25718 |
...currentView, |
| 25719 |
startPosition: newStartPosition |
| 25720 |
}); |
| 25721 |
} |
| 25722 |
} |
| 25723 |
}, 50); |
| 25724 |
const container = containerRef.current; |
| 25725 |
container.addEventListener("scroll", handleScroll); |
| 25726 |
return () => { |
| 25727 |
container.removeEventListener("scroll", handleScroll); |
| 25728 |
handleScroll.cancel(); |
| 25729 |
}; |
| 25730 |
}, [containerRef, view.infiniteScrollEnabled]); |
| 25731 |
return { |
| 25732 |
intersectionObserver: intersectionObserverRef.current |
| 25733 |
}; |
| 25734 |
} |
| 25735 |
|
| 25736 |
// packages/dataviews/build-module/dataviews-picker/index.mjs |
| 25737 |
var import_element73 = __toESM(require_element(), 1); |
| 25738 |
var import_compose13 = __toESM(require_compose(), 1); |
| 25739 |
var import_jsx_runtime116 = __toESM(require_jsx_runtime(), 1); |
| 25740 |
var isItemClickable = () => false; |
| 25741 |
var dataViewsPickerLayouts = VIEW_LAYOUTS.filter( |
| 25742 |
(viewLayout) => viewLayout.isPicker |
| 25743 |
); |
| 25744 |
var defaultGetItemId = (item) => item.id; |
| 25745 |
var EMPTY_ARRAY5 = []; |
| 25746 |
var DEFAULT_PICKER_LAYOUTS = { |
| 25747 |
pickerGrid: true, |
| 25748 |
pickerTable: true |
| 25749 |
}; |
| 25750 |
function DefaultUI({ |
| 25751 |
search = true, |
| 25752 |
searchLabel = void 0 |
| 25753 |
}) { |
| 25754 |
const { view } = (0, import_element73.useContext)(dataviews_context_default); |
| 25755 |
const isInfiniteScroll = view.infiniteScrollEnabled; |
| 25756 |
return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(import_jsx_runtime116.Fragment, { children: [ |
| 25757 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsxs)( |
| 25758 |
Stack, |
| 25759 |
{ |
| 25760 |
direction: "row", |
| 25761 |
align: "top", |
| 25762 |
justify: "space-between", |
| 25763 |
className: clsx_default("dataviews__view-actions", { |
| 25764 |
"dataviews__view-actions--infinite-scroll": isInfiniteScroll |
| 25765 |
}), |
| 25766 |
gap: "xs", |
| 25767 |
children: [ |
| 25768 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsxs)( |
| 25769 |
Stack, |
| 25770 |
{ |
| 25771 |
direction: "row", |
| 25772 |
gap: "sm", |
| 25773 |
justify: "start", |
| 25774 |
className: "dataviews__search", |
| 25775 |
children: [ |
| 25776 |
search && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(dataviews_search_default, { label: searchLabel }), |
| 25777 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)(toggle_default, {}) |
| 25778 |
] |
| 25779 |
} |
| 25780 |
), |
| 25781 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)(Stack, { direction: "row", gap: "xs", style: { flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(dataviews_view_config_default, {}) }) |
| 25782 |
] |
| 25783 |
} |
| 25784 |
), |
| 25785 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)(filters_toggled_default, { className: "dataviews-filters__container" }), |
| 25786 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DataViewsLayout, {}), |
| 25787 |
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DataViewsPickerFooter, {}) |
| 25788 |
] }); |
| 25789 |
} |
| 25790 |
function DataViewsPicker({ |
| 25791 |
view, |
| 25792 |
onChangeView, |
| 25793 |
fields, |
| 25794 |
search = true, |
| 25795 |
searchLabel = void 0, |
| 25796 |
actions = EMPTY_ARRAY5, |
| 25797 |
data, |
| 25798 |
getItemId = defaultGetItemId, |
| 25799 |
isLoading = false, |
| 25800 |
paginationInfo, |
| 25801 |
defaultLayouts: defaultLayoutsProperty = DEFAULT_PICKER_LAYOUTS, |
| 25802 |
selection, |
| 25803 |
onChangeSelection, |
| 25804 |
children, |
| 25805 |
config = { perPageSizes: [10, 20, 50, 100] }, |
| 25806 |
itemListLabel, |
| 25807 |
empty, |
| 25808 |
onReset |
| 25809 |
}) { |
| 25810 |
const { data: displayData, setVisibleEntries } = useData({ |
| 25811 |
view, |
| 25812 |
data, |
| 25813 |
getItemId, |
| 25814 |
selection, |
| 25815 |
paginationInfo |
| 25816 |
}); |
| 25817 |
const containerRef = (0, import_element73.useRef)(null); |
| 25818 |
const [containerWidth, setContainerWidth] = (0, import_element73.useState)(0); |
| 25819 |
const resizeObserverRef = (0, import_compose13.useResizeObserver)( |
| 25820 |
(resizeObserverEntries) => { |
| 25821 |
setContainerWidth( |
| 25822 |
resizeObserverEntries[0].borderBoxSize[0].inlineSize |
| 25823 |
); |
| 25824 |
}, |
| 25825 |
{ box: "border-box" } |
| 25826 |
); |
| 25827 |
const [openedFilter, setOpenedFilter] = (0, import_element73.useState)(null); |
| 25828 |
function setSelectionWithChange(value) { |
| 25829 |
const newValue = typeof value === "function" ? value(selection) : value; |
| 25830 |
if (onChangeSelection) { |
| 25831 |
onChangeSelection(newValue); |
| 25832 |
} |
| 25833 |
} |
| 25834 |
const _fields = (0, import_element73.useMemo)(() => normalizeFields(fields), [fields]); |
| 25835 |
const filters = use_filters_default(_fields, view); |
| 25836 |
const hasPrimaryOrLockedFilters = (0, import_element73.useMemo)( |
| 25837 |
() => (filters || []).some( |
| 25838 |
(filter) => filter.isPrimary || filter.isLocked |
| 25839 |
), |
| 25840 |
[filters] |
| 25841 |
); |
| 25842 |
const [isShowingFilter, setIsShowingFilter] = (0, import_element73.useState)( |
| 25843 |
hasPrimaryOrLockedFilters |
| 25844 |
); |
| 25845 |
const { intersectionObserver } = useInfiniteScroll({ |
| 25846 |
view, |
| 25847 |
onChangeView, |
| 25848 |
isLoading, |
| 25849 |
paginationInfo, |
| 25850 |
containerRef, |
| 25851 |
setVisibleEntries |
| 25852 |
}); |
| 25853 |
(0, import_element73.useEffect)(() => { |
| 25854 |
if (hasPrimaryOrLockedFilters && !isShowingFilter) { |
| 25855 |
setIsShowingFilter(true); |
| 25856 |
} |
| 25857 |
}, [hasPrimaryOrLockedFilters, isShowingFilter]); |
| 25858 |
const defaultLayouts2 = (0, import_element73.useMemo)( |
| 25859 |
() => Object.fromEntries( |
| 25860 |
Object.entries(defaultLayoutsProperty).filter(([layoutType]) => { |
| 25861 |
return dataViewsPickerLayouts.some( |
| 25862 |
(viewLayout) => viewLayout.type === layoutType |
| 25863 |
); |
| 25864 |
}).map(([key, value]) => [ |
| 25865 |
key, |
| 25866 |
value === true ? {} : value |
| 25867 |
]) |
| 25868 |
), |
| 25869 |
[defaultLayoutsProperty] |
| 25870 |
); |
| 25871 |
if (!defaultLayouts2[view.type]) { |
| 25872 |
return null; |
| 25873 |
} |
| 25874 |
return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)( |
| 25875 |
dataviews_context_default.Provider, |
| 25876 |
{ |
| 25877 |
value: { |
| 25878 |
view, |
| 25879 |
onChangeView, |
| 25880 |
fields: _fields, |
| 25881 |
actions, |
| 25882 |
data: displayData, |
| 25883 |
isLoading, |
| 25884 |
paginationInfo, |
| 25885 |
isItemClickable, |
| 25886 |
selection, |
| 25887 |
onChangeSelection: setSelectionWithChange, |
| 25888 |
openedFilter, |
| 25889 |
setOpenedFilter, |
| 25890 |
getItemId, |
| 25891 |
containerWidth, |
| 25892 |
containerRef, |
| 25893 |
resizeObserverRef, |
| 25894 |
defaultLayouts: defaultLayouts2, |
| 25895 |
filters, |
| 25896 |
isShowingFilter, |
| 25897 |
setIsShowingFilter, |
| 25898 |
config, |
| 25899 |
itemListLabel, |
| 25900 |
empty, |
| 25901 |
onReset, |
| 25902 |
hasInitiallyLoaded: true, |
| 25903 |
intersectionObserver |
| 25904 |
}, |
| 25905 |
children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { className: "dataviews-picker-wrapper", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(DefaultUI, { search, searchLabel }) }) |
| 25906 |
} |
| 25907 |
); |
| 25908 |
} |
| 25909 |
var DataViewsPickerSubComponents = DataViewsPicker; |
| 25910 |
DataViewsPickerSubComponents.BulkActionToolbar = DataViewsPickerBulkActionToolbar; |
| 25911 |
DataViewsPickerSubComponents.Footer = DataViewsPickerFooter; |
| 25912 |
DataViewsPickerSubComponents.Filters = filters_default; |
| 25913 |
DataViewsPickerSubComponents.FiltersToggled = filters_toggled_default; |
| 25914 |
DataViewsPickerSubComponents.FiltersToggle = toggle_default; |
| 25915 |
DataViewsPickerSubComponents.Layout = DataViewsLayout; |
| 25916 |
DataViewsPickerSubComponents.LayoutSwitcher = ViewTypeMenu; |
| 25917 |
DataViewsPickerSubComponents.Pagination = DataViewsPagination; |
| 25918 |
DataViewsPickerSubComponents.Search = dataviews_search_default; |
| 25919 |
DataViewsPickerSubComponents.ViewConfig = DataviewsViewConfigDropdown; |
| 25920 |
var dataviews_picker_default = DataViewsPickerSubComponents; |
| 25921 |
|
| 25922 |
// node_modules/dequal/dist/index.mjs |
| 25923 |
var has = Object.prototype.hasOwnProperty; |
| 25924 |
function find(iter, tar, key) { |
| 25925 |
for (key of iter.keys()) { |
| 25926 |
if (dequal(key, tar)) return key; |
| 25927 |
} |
| 25928 |
} |
| 25929 |
function dequal(foo, bar) { |
| 25930 |
var ctor, len, tmp; |
| 25931 |
if (foo === bar) return true; |
| 25932 |
if (foo && bar && (ctor = foo.constructor) === bar.constructor) { |
| 25933 |
if (ctor === Date) return foo.getTime() === bar.getTime(); |
| 25934 |
if (ctor === RegExp) return foo.toString() === bar.toString(); |
| 25935 |
if (ctor === Array) { |
| 25936 |
if ((len = foo.length) === bar.length) { |
| 25937 |
while (len-- && dequal(foo[len], bar[len])) ; |
| 25938 |
} |
| 25939 |
return len === -1; |
| 25940 |
} |
| 25941 |
if (ctor === Set) { |
| 25942 |
if (foo.size !== bar.size) { |
| 25943 |
return false; |
| 25944 |
} |
| 25945 |
for (len of foo) { |
| 25946 |
tmp = len; |
| 25947 |
if (tmp && typeof tmp === "object") { |
| 25948 |
tmp = find(bar, tmp); |
| 25949 |
if (!tmp) return false; |
| 25950 |
} |
| 25951 |
if (!bar.has(tmp)) return false; |
| 25952 |
} |
| 25953 |
return true; |
| 25954 |
} |
| 25955 |
if (ctor === Map) { |
| 25956 |
if (foo.size !== bar.size) { |
| 25957 |
return false; |
| 25958 |
} |
| 25959 |
for (len of foo) { |
| 25960 |
tmp = len[0]; |
| 25961 |
if (tmp && typeof tmp === "object") { |
| 25962 |
tmp = find(bar, tmp); |
| 25963 |
if (!tmp) return false; |
| 25964 |
} |
| 25965 |
if (!dequal(len[1], bar.get(tmp))) { |
| 25966 |
return false; |
| 25967 |
} |
| 25968 |
} |
| 25969 |
return true; |
| 25970 |
} |
| 25971 |
if (ctor === ArrayBuffer) { |
| 25972 |
foo = new Uint8Array(foo); |
| 25973 |
bar = new Uint8Array(bar); |
| 25974 |
} else if (ctor === DataView) { |
| 25975 |
if ((len = foo.byteLength) === bar.byteLength) { |
| 25976 |
while (len-- && foo.getInt8(len) === bar.getInt8(len)) ; |
| 25977 |
} |
| 25978 |
return len === -1; |
| 25979 |
} |
| 25980 |
if (ArrayBuffer.isView(foo)) { |
| 25981 |
if ((len = foo.byteLength) === bar.byteLength) { |
| 25982 |
while (len-- && foo[len] === bar[len]) ; |
| 25983 |
} |
| 25984 |
return len === -1; |
| 25985 |
} |
| 25986 |
if (!ctor || typeof foo === "object") { |
| 25987 |
len = 0; |
| 25988 |
for (ctor in foo) { |
| 25989 |
if (has.call(foo, ctor) && ++len && !has.call(bar, ctor)) return false; |
| 25990 |
if (!(ctor in bar) || !dequal(foo[ctor], bar[ctor])) return false; |
| 25991 |
} |
| 25992 |
return Object.keys(bar).length === len; |
| 25993 |
} |
| 25994 |
} |
| 25995 |
return foo !== foo && bar !== bar; |
| 25996 |
} |
| 25997 |
|
| 25998 |
// packages/views/build-module/use-view.mjs |
| 25999 |
var import_element74 = __toESM(require_element(), 1); |
| 26000 |
var import_data6 = __toESM(require_data(), 1); |
| 26001 |
var import_preferences = __toESM(require_preferences(), 1); |
| 26002 |
|
| 26003 |
// packages/views/build-module/preference-keys.mjs |
| 26004 |
function generatePreferenceKey(kind, name, slug) { |
| 26005 |
return `dataviews-${kind}-${name}-${slug}`; |
| 26006 |
} |
| 26007 |
|
| 26008 |
// packages/views/build-module/filter-utils.mjs |
| 26009 |
var SCALAR_VALUES = [ |
| 26010 |
"titleField", |
| 26011 |
"mediaField", |
| 26012 |
"descriptionField", |
| 26013 |
"showTitle", |
| 26014 |
"showMedia", |
| 26015 |
"showDescription", |
| 26016 |
"showLevels", |
| 26017 |
"infiniteScrollEnabled" |
| 26018 |
]; |
| 26019 |
function mergeActiveViewOverrides(view, activeViewOverrides, defaultView2) { |
| 26020 |
if (!activeViewOverrides) { |
| 26021 |
return view; |
| 26022 |
} |
| 26023 |
let result = view; |
| 26024 |
for (const key of SCALAR_VALUES) { |
| 26025 |
if (key in activeViewOverrides) { |
| 26026 |
result = { ...result, [key]: activeViewOverrides[key] }; |
| 26027 |
} |
| 26028 |
} |
| 26029 |
if (activeViewOverrides.filters && activeViewOverrides.filters.length > 0) { |
| 26030 |
const activeFields = new Set( |
| 26031 |
activeViewOverrides.filters.map((f2) => f2.field) |
| 26032 |
); |
| 26033 |
const preserved = (view.filters ?? []).filter( |
| 26034 |
(f2) => !activeFields.has(f2.field) |
| 26035 |
); |
| 26036 |
result = { |
| 26037 |
...result, |
| 26038 |
filters: [...preserved, ...activeViewOverrides.filters] |
| 26039 |
}; |
| 26040 |
} |
| 26041 |
if (activeViewOverrides.sort) { |
| 26042 |
const isDefaultSort = defaultView2 && view.sort?.field === defaultView2.sort?.field && view.sort?.direction === defaultView2.sort?.direction; |
| 26043 |
if (isDefaultSort) { |
| 26044 |
result = { |
| 26045 |
...result, |
| 26046 |
sort: activeViewOverrides.sort |
| 26047 |
}; |
| 26048 |
} |
| 26049 |
} |
| 26050 |
if (activeViewOverrides.layout) { |
| 26051 |
result = { |
| 26052 |
...result, |
| 26053 |
layout: { |
| 26054 |
...result.layout, |
| 26055 |
...activeViewOverrides.layout |
| 26056 |
} |
| 26057 |
}; |
| 26058 |
} |
| 26059 |
if (activeViewOverrides.groupBy) { |
| 26060 |
result = { |
| 26061 |
...result, |
| 26062 |
groupBy: activeViewOverrides.groupBy |
| 26063 |
}; |
| 26064 |
} |
| 26065 |
return result; |
| 26066 |
} |
| 26067 |
function stripActiveViewOverrides(view, activeViewOverrides, defaultView2) { |
| 26068 |
if (!activeViewOverrides) { |
| 26069 |
return view; |
| 26070 |
} |
| 26071 |
let result = view; |
| 26072 |
for (const key of SCALAR_VALUES) { |
| 26073 |
if (key in activeViewOverrides) { |
| 26074 |
const { [key]: _, ...rest } = result; |
| 26075 |
result = rest; |
| 26076 |
} |
| 26077 |
} |
| 26078 |
if (activeViewOverrides.filters && activeViewOverrides.filters.length > 0) { |
| 26079 |
const activeFields = new Set( |
| 26080 |
activeViewOverrides.filters.map((f2) => f2.field) |
| 26081 |
); |
| 26082 |
result = { |
| 26083 |
...result, |
| 26084 |
filters: (view.filters ?? []).filter( |
| 26085 |
(f2) => !activeFields.has(f2.field) |
| 26086 |
) |
| 26087 |
}; |
| 26088 |
} |
| 26089 |
if (activeViewOverrides.sort && view.sort?.field === activeViewOverrides.sort.field && view.sort?.direction === activeViewOverrides.sort.direction) { |
| 26090 |
result = { |
| 26091 |
...result, |
| 26092 |
sort: defaultView2?.sort |
| 26093 |
}; |
| 26094 |
} |
| 26095 |
if (activeViewOverrides.layout && "layout" in result && result.layout) { |
| 26096 |
const layout = { ...result.layout }; |
| 26097 |
for (const key of Object.keys(activeViewOverrides.layout)) { |
| 26098 |
delete layout[key]; |
| 26099 |
} |
| 26100 |
result = { |
| 26101 |
...result, |
| 26102 |
layout: Object.keys(layout).length > 0 ? layout : void 0 |
| 26103 |
}; |
| 26104 |
} |
| 26105 |
if (activeViewOverrides.groupBy && "groupBy" in result) { |
| 26106 |
const { groupBy: _, ...rest } = result; |
| 26107 |
result = rest; |
| 26108 |
} |
| 26109 |
return result; |
| 26110 |
} |
| 26111 |
|
| 26112 |
// packages/views/build-module/use-view.mjs |
| 26113 |
function omit3(obj, keys) { |
| 26114 |
const result = { ...obj }; |
| 26115 |
for (const key of keys) { |
| 26116 |
delete result[key]; |
| 26117 |
} |
| 26118 |
return result; |
| 26119 |
} |
| 26120 |
function useView(config) { |
| 26121 |
const { |
| 26122 |
kind, |
| 26123 |
name, |
| 26124 |
slug, |
| 26125 |
defaultView: defaultView2, |
| 26126 |
activeViewOverrides, |
| 26127 |
queryParams, |
| 26128 |
onChangeQueryParams |
| 26129 |
} = config; |
| 26130 |
const preferenceKey = generatePreferenceKey(kind, name, slug); |
| 26131 |
const persistedView = (0, import_data6.useSelect)( |
| 26132 |
(select2) => { |
| 26133 |
return select2(import_preferences.store).get( |
| 26134 |
"core/views", |
| 26135 |
preferenceKey |
| 26136 |
); |
| 26137 |
}, |
| 26138 |
[preferenceKey] |
| 26139 |
); |
| 26140 |
const { set: set2 } = (0, import_data6.useDispatch)(import_preferences.store); |
| 26141 |
const baseView = (0, import_element74.useMemo)( |
| 26142 |
() => persistedView ?? defaultView2 ?? {}, |
| 26143 |
[persistedView, defaultView2] |
| 26144 |
); |
| 26145 |
const page = Number(queryParams?.page ?? baseView.page ?? 1); |
| 26146 |
const search = queryParams?.search ?? baseView.search ?? ""; |
| 26147 |
const combinedOverrides = (0, import_element74.useMemo)(() => { |
| 26148 |
const rawDefaults = config.defaultLayouts?.[baseView.type]; |
| 26149 |
const layoutTypeDefaults = !rawDefaults || rawDefaults === true ? {} : rawDefaults; |
| 26150 |
return { ...layoutTypeDefaults, ...activeViewOverrides }; |
| 26151 |
}, [config.defaultLayouts, baseView.type, activeViewOverrides]); |
| 26152 |
const view = (0, import_element74.useMemo)(() => { |
| 26153 |
return mergeActiveViewOverrides( |
| 26154 |
{ |
| 26155 |
...baseView, |
| 26156 |
page, |
| 26157 |
search |
| 26158 |
}, |
| 26159 |
combinedOverrides, |
| 26160 |
defaultView2 |
| 26161 |
); |
| 26162 |
}, [baseView, page, search, combinedOverrides, defaultView2]); |
| 26163 |
const isModified = !!persistedView; |
| 26164 |
const updateView = (0, import_element74.useCallback)( |
| 26165 |
(newView) => { |
| 26166 |
const urlParams = { |
| 26167 |
page: newView?.page, |
| 26168 |
search: newView?.search |
| 26169 |
}; |
| 26170 |
const preferenceView = stripActiveViewOverrides( |
| 26171 |
omit3(newView, ["page", "search"]), |
| 26172 |
combinedOverrides, |
| 26173 |
defaultView2 |
| 26174 |
); |
| 26175 |
if (onChangeQueryParams && !dequal(urlParams, { page, search })) { |
| 26176 |
onChangeQueryParams(urlParams); |
| 26177 |
} |
| 26178 |
const comparableBaseView = stripActiveViewOverrides( |
| 26179 |
baseView, |
| 26180 |
combinedOverrides, |
| 26181 |
defaultView2 |
| 26182 |
); |
| 26183 |
const comparableDefaultView = stripActiveViewOverrides( |
| 26184 |
defaultView2, |
| 26185 |
combinedOverrides, |
| 26186 |
defaultView2 |
| 26187 |
); |
| 26188 |
if (!dequal(comparableBaseView, preferenceView)) { |
| 26189 |
if (dequal(preferenceView, comparableDefaultView)) { |
| 26190 |
set2("core/views", preferenceKey, void 0); |
| 26191 |
} else { |
| 26192 |
set2("core/views", preferenceKey, preferenceView); |
| 26193 |
} |
| 26194 |
} |
| 26195 |
}, |
| 26196 |
[ |
| 26197 |
onChangeQueryParams, |
| 26198 |
page, |
| 26199 |
search, |
| 26200 |
baseView, |
| 26201 |
defaultView2, |
| 26202 |
combinedOverrides, |
| 26203 |
set2, |
| 26204 |
preferenceKey |
| 26205 |
] |
| 26206 |
); |
| 26207 |
const resetToDefault = (0, import_element74.useCallback)(() => { |
| 26208 |
set2("core/views", preferenceKey, void 0); |
| 26209 |
}, [preferenceKey, set2]); |
| 26210 |
return { |
| 26211 |
view, |
| 26212 |
isModified, |
| 26213 |
updateView, |
| 26214 |
resetToDefault |
| 26215 |
}; |
| 26216 |
} |
| 26217 |
|
| 26218 |
// packages/views/build-module/load-view.mjs |
| 26219 |
var import_data7 = __toESM(require_data(), 1); |
| 26220 |
var import_preferences2 = __toESM(require_preferences(), 1); |
| 26221 |
|
| 26222 |
// packages/views/build-module/use-view-config.mjs |
| 26223 |
var import_data8 = __toESM(require_data(), 1); |
| 26224 |
var import_core_data = __toESM(require_core_data(), 1); |
| 26225 |
|
| 26226 |
// packages/views/build-module/lock-unlock.mjs |
| 26227 |
var import_private_apis3 = __toESM(require_private_apis(), 1); |
| 26228 |
var { lock: lock3, unlock: unlock3 } = (0, import_private_apis3.__dangerousOptInToUnstableAPIsOnlyForCoreModules)( |
| 26229 |
"I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.", |
| 26230 |
"@wordpress/views" |
| 26231 |
); |
| 26232 |
|
| 26233 |
// packages/media-fields/build-module/alt_text/index.mjs |
| 26234 |
var import_i18n50 = __toESM(require_i18n(), 1); |
| 26235 |
var import_components46 = __toESM(require_components(), 1); |
| 26236 |
var import_jsx_runtime117 = __toESM(require_jsx_runtime(), 1); |
| 26237 |
var altTextField = { |
| 26238 |
id: "alt_text", |
| 26239 |
type: "text", |
| 26240 |
label: (0, import_i18n50.__)("Alt text"), |
| 26241 |
isVisible: (item) => item?.media_type === "image", |
| 26242 |
render: ({ item }) => item?.alt_text || "-", |
| 26243 |
Edit: ({ field, onChange, data }) => { |
| 26244 |
return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)( |
| 26245 |
import_components46.TextareaControl, |
| 26246 |
{ |
| 26247 |
label: field.label, |
| 26248 |
value: data.alt_text || "", |
| 26249 |
onChange: (value) => onChange({ alt_text: value }), |
| 26250 |
rows: 2 |
| 26251 |
} |
| 26252 |
); |
| 26253 |
}, |
| 26254 |
enableSorting: false, |
| 26255 |
filterBy: false |
| 26256 |
}; |
| 26257 |
var alt_text_default = altTextField; |
| 26258 |
|
| 26259 |
// packages/media-fields/build-module/attached_to/index.mjs |
| 26260 |
var import_i18n53 = __toESM(require_i18n(), 1); |
| 26261 |
|
| 26262 |
// packages/media-fields/build-module/attached_to/view.mjs |
| 26263 |
var import_element75 = __toESM(require_element(), 1); |
| 26264 |
var import_i18n51 = __toESM(require_i18n(), 1); |
| 26265 |
|
| 26266 |
// packages/media-fields/build-module/utils/get-rendered-content.mjs |
| 26267 |
function getRenderedContent(content) { |
| 26268 |
if (!content) { |
| 26269 |
return ""; |
| 26270 |
} |
| 26271 |
if (typeof content === "string") { |
| 26272 |
return content; |
| 26273 |
} |
| 26274 |
if (typeof content === "object") { |
| 26275 |
return content.rendered || content.raw || ""; |
| 26276 |
} |
| 26277 |
return ""; |
| 26278 |
} |
| 26279 |
|
| 26280 |
// packages/media-fields/build-module/attached_to/view.mjs |
| 26281 |
var import_jsx_runtime118 = __toESM(require_jsx_runtime(), 1); |
| 26282 |
function MediaAttachedToView({ |
| 26283 |
item |
| 26284 |
}) { |
| 26285 |
const [attachedPostTitle, setAttachedPostTitle] = (0, import_element75.useState)(null); |
| 26286 |
const parentId = item.post; |
| 26287 |
const embeddedPostId = item._embedded?.["wp:attached-to"]?.[0]?.id; |
| 26288 |
const embeddedPostTitle = item._embedded?.["wp:attached-to"]?.[0]?.title; |
| 26289 |
(0, import_element75.useEffect)(() => { |
| 26290 |
if (!!parentId && parentId === embeddedPostId) { |
| 26291 |
setAttachedPostTitle( |
| 26292 |
getRenderedContent(embeddedPostTitle) || (0, import_i18n51.__)("(no title)") |
| 26293 |
); |
| 26294 |
} |
| 26295 |
if (!parentId) { |
| 26296 |
setAttachedPostTitle((0, import_i18n51.__)("(Unattached)")); |
| 26297 |
} |
| 26298 |
}, [parentId, embeddedPostId, embeddedPostTitle]); |
| 26299 |
return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_jsx_runtime118.Fragment, { children: attachedPostTitle }); |
| 26300 |
} |
| 26301 |
|
| 26302 |
// packages/media-fields/build-module/attached_to/edit.mjs |
| 26303 |
var import_core_data2 = __toESM(require_core_data(), 1); |
| 26304 |
var import_components47 = __toESM(require_components(), 1); |
| 26305 |
var import_i18n52 = __toESM(require_i18n(), 1); |
| 26306 |
var import_element76 = __toESM(require_element(), 1); |
| 26307 |
var import_compose14 = __toESM(require_compose(), 1); |
| 26308 |
var import_data9 = __toESM(require_data(), 1); |
| 26309 |
var import_jsx_runtime119 = __toESM(require_jsx_runtime(), 1); |
| 26310 |
function MediaAttachedToEdit({ |
| 26311 |
data, |
| 26312 |
onChange |
| 26313 |
}) { |
| 26314 |
const defaultPost = !!data.post && !!data?._embedded?.["wp:attached-to"]?.[0] ? [ |
| 26315 |
{ |
| 26316 |
label: getRenderedContent( |
| 26317 |
data._embedded?.["wp:attached-to"]?.[0]?.title |
| 26318 |
), |
| 26319 |
value: data.post.toString() |
| 26320 |
} |
| 26321 |
] : []; |
| 26322 |
const [options, setOptions] = (0, import_element76.useState)(defaultPost); |
| 26323 |
const [searchResults, setSearchResults] = (0, import_element76.useState)( |
| 26324 |
[] |
| 26325 |
); |
| 26326 |
const [isLoading, setIsLoading] = (0, import_element76.useState)(false); |
| 26327 |
const [value, setValue] = (0, import_element76.useState)( |
| 26328 |
data?.post?.toString() ?? null |
| 26329 |
); |
| 26330 |
const postTypes = (0, import_data9.useSelect)( |
| 26331 |
(select2) => select2(import_core_data2.store).getPostTypes(), |
| 26332 |
[] |
| 26333 |
); |
| 26334 |
const handleDetach = () => { |
| 26335 |
onChange({ |
| 26336 |
post: 0, |
| 26337 |
_embedded: { ...data?._embedded, "wp:attached-to": void 0 } |
| 26338 |
}); |
| 26339 |
setValue(null); |
| 26340 |
setOptions([]); |
| 26341 |
}; |
| 26342 |
const onValueChange = async (filterValue) => { |
| 26343 |
setIsLoading(true); |
| 26344 |
const results = await (0, import_core_data2.__experimentalFetchLinkSuggestions)( |
| 26345 |
filterValue, |
| 26346 |
/* |
| 26347 |
* @TODO `fetchLinkSuggestions()` should accept `perPage` as an option argument. |
| 26348 |
* `isInitialSuggestions` limits the result to 3, otherwise it's hardcoded to 20. |
| 26349 |
*/ |
| 26350 |
{ type: "post", isInitialSuggestions: true }, |
| 26351 |
{} |
| 26352 |
); |
| 26353 |
setSearchResults(results); |
| 26354 |
const suggestions = results.map((result) => { |
| 26355 |
return { |
| 26356 |
label: result.title, |
| 26357 |
value: result.id.toString() |
| 26358 |
}; |
| 26359 |
}); |
| 26360 |
const includeCurrent = !filterValue && suggestions.findIndex((s2) => s2.value === value) === -1; |
| 26361 |
setOptions(suggestions.concat(includeCurrent ? defaultPost : [])); |
| 26362 |
setIsLoading(false); |
| 26363 |
}; |
| 26364 |
const handleSelectOption = (selectedPostId) => { |
| 26365 |
if (!selectedPostId) { |
| 26366 |
handleDetach(); |
| 26367 |
return; |
| 26368 |
} |
| 26369 |
setValue(selectedPostId); |
| 26370 |
if (selectedPostId) { |
| 26371 |
const selectedPost = searchResults.find( |
| 26372 |
(result) => result.id === Number(selectedPostId) |
| 26373 |
); |
| 26374 |
if (selectedPost && postTypes) { |
| 26375 |
const postType = postTypes.find( |
| 26376 |
(_postType) => _postType.slug === selectedPost?.type |
| 26377 |
); |
| 26378 |
const attachedTo = { |
| 26379 |
...postType && { type: postType.slug }, |
| 26380 |
id: Number(selectedPostId), |
| 26381 |
title: { |
| 26382 |
raw: selectedPost.title, |
| 26383 |
rendered: selectedPost.title |
| 26384 |
} |
| 26385 |
}; |
| 26386 |
onChange({ |
| 26387 |
post: Number(selectedPostId), |
| 26388 |
_embedded: { |
| 26389 |
...data?._embedded, |
| 26390 |
"wp:attached-to": [attachedTo] |
| 26391 |
} |
| 26392 |
}); |
| 26393 |
} |
| 26394 |
} |
| 26395 |
}; |
| 26396 |
const help = (0, import_element76.createInterpolateElement)( |
| 26397 |
(0, import_i18n52.__)( |
| 26398 |
"Search for a post or page to attach this media to or <button>detach current</button>." |
| 26399 |
), |
| 26400 |
{ |
| 26401 |
button: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( |
| 26402 |
import_components47.Button, |
| 26403 |
{ |
| 26404 |
__next40pxDefaultSize: true, |
| 26405 |
onClick: handleDetach, |
| 26406 |
variant: "link", |
| 26407 |
accessibleWhenDisabled: true, |
| 26408 |
disabled: !value |
| 26409 |
} |
| 26410 |
) |
| 26411 |
} |
| 26412 |
); |
| 26413 |
return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)( |
| 26414 |
import_components47.ComboboxControl, |
| 26415 |
{ |
| 26416 |
className: "dataviews-media-field__attached-to", |
| 26417 |
__next40pxDefaultSize: true, |
| 26418 |
isLoading, |
| 26419 |
label: (0, import_i18n52.__)("Attached to"), |
| 26420 |
help, |
| 26421 |
value, |
| 26422 |
options, |
| 26423 |
onFilterValueChange: (0, import_compose14.debounce)( |
| 26424 |
(filterValue) => onValueChange(filterValue), |
| 26425 |
300 |
| 26426 |
), |
| 26427 |
onChange: handleSelectOption, |
| 26428 |
hideLabelFromVision: true |
| 26429 |
} |
| 26430 |
); |
| 26431 |
} |
| 26432 |
|
| 26433 |
// packages/media-fields/build-module/attached_to/index.mjs |
| 26434 |
var attachedToField = { |
| 26435 |
id: "attached_to", |
| 26436 |
type: "text", |
| 26437 |
label: (0, import_i18n53.__)("Attached to"), |
| 26438 |
Edit: MediaAttachedToEdit, |
| 26439 |
render: MediaAttachedToView, |
| 26440 |
enableSorting: false, |
| 26441 |
filterBy: false |
| 26442 |
}; |
| 26443 |
var attached_to_default = attachedToField; |
| 26444 |
|
| 26445 |
// packages/media-fields/build-module/author/index.mjs |
| 26446 |
var import_i18n55 = __toESM(require_i18n(), 1); |
| 26447 |
var import_data10 = __toESM(require_data(), 1); |
| 26448 |
var import_core_data3 = __toESM(require_core_data(), 1); |
| 26449 |
|
| 26450 |
// packages/media-fields/build-module/author/view.mjs |
| 26451 |
var import_i18n54 = __toESM(require_i18n(), 1); |
| 26452 |
var import_element77 = __toESM(require_element(), 1); |
| 26453 |
var import_components48 = __toESM(require_components(), 1); |
| 26454 |
var import_jsx_runtime120 = __toESM(require_jsx_runtime(), 1); |
| 26455 |
function AuthorView({ |
| 26456 |
item |
| 26457 |
}) { |
| 26458 |
const author = item?._embedded?.author?.[0]; |
| 26459 |
const text = author?.name; |
| 26460 |
const imageUrl = author?.avatar_urls?.[48]; |
| 26461 |
const [loadingState, setLoadingState] = (0, import_element77.useState)("loading"); |
| 26462 |
(0, import_element77.useEffect)(() => { |
| 26463 |
setLoadingState("loading"); |
| 26464 |
}, [imageUrl]); |
| 26465 |
const imgRef = (0, import_element77.useCallback)((img) => { |
| 26466 |
if (img?.complete) { |
| 26467 |
setLoadingState("instant"); |
| 26468 |
} |
| 26469 |
}, []); |
| 26470 |
const handleLoad = () => { |
| 26471 |
if (loadingState === "loading") { |
| 26472 |
setLoadingState("loaded"); |
| 26473 |
} |
| 26474 |
}; |
| 26475 |
return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_components48.__experimentalHStack, { alignment: "left", spacing: 0, children: [ |
| 26476 |
!!imageUrl && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)( |
| 26477 |
"div", |
| 26478 |
{ |
| 26479 |
className: clsx_default("media-author-field__avatar", { |
| 26480 |
"is-loading": loadingState === "loading", |
| 26481 |
"is-loaded": loadingState === "loaded" |
| 26482 |
}), |
| 26483 |
children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)( |
| 26484 |
"img", |
| 26485 |
{ |
| 26486 |
ref: imgRef, |
| 26487 |
onLoad: handleLoad, |
| 26488 |
alt: (0, import_i18n54.__)("Author avatar"), |
| 26489 |
src: imageUrl |
| 26490 |
} |
| 26491 |
) |
| 26492 |
} |
| 26493 |
), |
| 26494 |
!imageUrl && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("div", { className: "media-author-field__icon", children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_components48.Icon, { icon: comment_author_avatar_default }) }), |
| 26495 |
/* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "media-author-field__name", children: text }) |
| 26496 |
] }); |
| 26497 |
} |
| 26498 |
|
| 26499 |
// packages/media-fields/build-module/author/index.mjs |
| 26500 |
var authorField = { |
| 26501 |
label: (0, import_i18n55.__)("Author"), |
| 26502 |
id: "author", |
| 26503 |
type: "integer", |
| 26504 |
getElements: async () => { |
| 26505 |
const authors = await (0, import_data10.resolveSelect)(import_core_data3.store).getEntityRecords( |
| 26506 |
"root", |
| 26507 |
"user", |
| 26508 |
{ |
| 26509 |
per_page: -1, |
| 26510 |
who: "authors", |
| 26511 |
_fields: "id,name", |
| 26512 |
context: "view" |
| 26513 |
} |
| 26514 |
) ?? []; |
| 26515 |
return authors.map(({ id, name }) => ({ |
| 26516 |
value: id, |
| 26517 |
label: name |
| 26518 |
})); |
| 26519 |
}, |
| 26520 |
render: AuthorView, |
| 26521 |
sort: (a2, b2, direction) => { |
| 26522 |
const nameA = a2._embedded?.author?.[0]?.name || ""; |
| 26523 |
const nameB = b2._embedded?.author?.[0]?.name || ""; |
| 26524 |
return direction === "asc" ? nameA.localeCompare(nameB) : nameB.localeCompare(nameA); |
| 26525 |
}, |
| 26526 |
filterBy: { |
| 26527 |
operators: ["isAny", "isNone"] |
| 26528 |
}, |
| 26529 |
readOnly: true |
| 26530 |
}; |
| 26531 |
var author_default = authorField; |
| 26532 |
|
| 26533 |
// packages/media-fields/build-module/caption/index.mjs |
| 26534 |
var import_i18n56 = __toESM(require_i18n(), 1); |
| 26535 |
var import_components49 = __toESM(require_components(), 1); |
| 26536 |
|
| 26537 |
// packages/media-fields/build-module/utils/get-raw-content.mjs |
| 26538 |
function getRawContent(content) { |
| 26539 |
if (!content) { |
| 26540 |
return ""; |
| 26541 |
} |
| 26542 |
if (typeof content === "string") { |
| 26543 |
return content; |
| 26544 |
} |
| 26545 |
if (typeof content === "object" && "raw" in content) { |
| 26546 |
return content.raw || ""; |
| 26547 |
} |
| 26548 |
return ""; |
| 26549 |
} |
| 26550 |
|
| 26551 |
// packages/media-fields/build-module/caption/index.mjs |
| 26552 |
var import_jsx_runtime121 = __toESM(require_jsx_runtime(), 1); |
| 26553 |
var captionField = { |
| 26554 |
id: "caption", |
| 26555 |
type: "text", |
| 26556 |
label: (0, import_i18n56.__)("Caption"), |
| 26557 |
getValue: ({ item }) => getRawContent(item?.caption), |
| 26558 |
render: ({ item }) => getRawContent(item?.caption) || "-", |
| 26559 |
Edit: ({ field, onChange, data }) => { |
| 26560 |
return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)( |
| 26561 |
import_components49.TextareaControl, |
| 26562 |
{ |
| 26563 |
label: field.label, |
| 26564 |
value: getRawContent(data.caption) || "", |
| 26565 |
onChange: (value) => onChange({ caption: value }), |
| 26566 |
rows: 2 |
| 26567 |
} |
| 26568 |
); |
| 26569 |
}, |
| 26570 |
enableSorting: false, |
| 26571 |
filterBy: false |
| 26572 |
}; |
| 26573 |
var caption_default = captionField; |
| 26574 |
|
| 26575 |
// packages/media-fields/build-module/date_added/index.mjs |
| 26576 |
var import_i18n57 = __toESM(require_i18n(), 1); |
| 26577 |
var dateAddedField = { |
| 26578 |
id: "date", |
| 26579 |
type: "datetime", |
| 26580 |
label: (0, import_i18n57.__)("Date added"), |
| 26581 |
filterBy: { |
| 26582 |
operators: ["before", "after"] |
| 26583 |
}, |
| 26584 |
readOnly: true |
| 26585 |
}; |
| 26586 |
var date_added_default = dateAddedField; |
| 26587 |
|
| 26588 |
// packages/media-fields/build-module/date_modified/index.mjs |
| 26589 |
var import_i18n58 = __toESM(require_i18n(), 1); |
| 26590 |
var dateModifiedField = { |
| 26591 |
id: "modified", |
| 26592 |
type: "datetime", |
| 26593 |
label: (0, import_i18n58.__)("Date modified"), |
| 26594 |
filterBy: { |
| 26595 |
operators: ["before", "after"] |
| 26596 |
}, |
| 26597 |
readOnly: true |
| 26598 |
}; |
| 26599 |
var date_modified_default = dateModifiedField; |
| 26600 |
|
| 26601 |
// packages/media-fields/build-module/description/index.mjs |
| 26602 |
var import_i18n59 = __toESM(require_i18n(), 1); |
| 26603 |
var import_components50 = __toESM(require_components(), 1); |
| 26604 |
var import_jsx_runtime122 = __toESM(require_jsx_runtime(), 1); |
| 26605 |
var descriptionField = { |
| 26606 |
id: "description", |
| 26607 |
type: "text", |
| 26608 |
label: (0, import_i18n59.__)("Description"), |
| 26609 |
getValue: ({ item }) => getRawContent(item?.description), |
| 26610 |
render: ({ item }) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { children: getRawContent(item?.description) || "-" }), |
| 26611 |
Edit: ({ field, onChange, data }) => { |
| 26612 |
return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)( |
| 26613 |
import_components50.TextareaControl, |
| 26614 |
{ |
| 26615 |
label: field.label, |
| 26616 |
value: getRawContent(data.description) || "", |
| 26617 |
onChange: (value) => onChange({ description: value }), |
| 26618 |
rows: 5 |
| 26619 |
} |
| 26620 |
); |
| 26621 |
}, |
| 26622 |
enableSorting: false, |
| 26623 |
filterBy: false |
| 26624 |
}; |
| 26625 |
var description_default = descriptionField; |
| 26626 |
|
| 26627 |
// packages/media-fields/build-module/filename/index.mjs |
| 26628 |
var import_i18n60 = __toESM(require_i18n(), 1); |
| 26629 |
var import_url4 = __toESM(require_url(), 1); |
| 26630 |
|
| 26631 |
// packages/media-fields/build-module/filename/view.mjs |
| 26632 |
var import_element78 = __toESM(require_element(), 1); |
| 26633 |
var import_url3 = __toESM(require_url(), 1); |
| 26634 |
var import_jsx_runtime123 = __toESM(require_jsx_runtime(), 1); |
| 26635 |
var TRUNCATE_LENGTH = 15; |
| 26636 |
function FileNameView({ |
| 26637 |
item |
| 26638 |
}) { |
| 26639 |
const fileName = (0, import_element78.useMemo)( |
| 26640 |
() => item?.source_url ? (0, import_url3.getFilename)(item.source_url) : null, |
| 26641 |
[item?.source_url] |
| 26642 |
); |
| 26643 |
if (!fileName) { |
| 26644 |
return ""; |
| 26645 |
} |
| 26646 |
if (fileName.length <= TRUNCATE_LENGTH) { |
| 26647 |
return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("span", { className: "dataviews-media-field__filename", children: fileName }); |
| 26648 |
} |
| 26649 |
return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(tooltip_exports.Root, { children: [ |
| 26650 |
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)( |
| 26651 |
tooltip_exports.Trigger, |
| 26652 |
{ |
| 26653 |
render: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("span", { className: "dataviews-media-field__filename", children: fileName }) |
| 26654 |
} |
| 26655 |
), |
| 26656 |
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(tooltip_exports.Popup, { children: fileName }) |
| 26657 |
] }); |
| 26658 |
} |
| 26659 |
|
| 26660 |
// packages/media-fields/build-module/filename/index.mjs |
| 26661 |
var filenameField = { |
| 26662 |
id: "filename", |
| 26663 |
type: "text", |
| 26664 |
label: (0, import_i18n60.__)("File name"), |
| 26665 |
getValue: ({ item }) => (0, import_url4.getFilename)(item?.source_url || ""), |
| 26666 |
render: FileNameView, |
| 26667 |
enableSorting: false, |
| 26668 |
filterBy: false, |
| 26669 |
readOnly: true |
| 26670 |
}; |
| 26671 |
var filename_default = filenameField; |
| 26672 |
|
| 26673 |
// packages/media-fields/build-module/filesize/index.mjs |
| 26674 |
var import_i18n61 = __toESM(require_i18n(), 1); |
| 26675 |
var KB_IN_BYTES = 1024; |
| 26676 |
var MB_IN_BYTES = 1024 * KB_IN_BYTES; |
| 26677 |
var GB_IN_BYTES = 1024 * MB_IN_BYTES; |
| 26678 |
var TB_IN_BYTES = 1024 * GB_IN_BYTES; |
| 26679 |
var PB_IN_BYTES = 1024 * TB_IN_BYTES; |
| 26680 |
var EB_IN_BYTES = 1024 * PB_IN_BYTES; |
| 26681 |
var ZB_IN_BYTES = 1024 * EB_IN_BYTES; |
| 26682 |
var YB_IN_BYTES = 1024 * ZB_IN_BYTES; |
| 26683 |
function getBytesString(bytes, unitSymbol, decimals = 2) { |
| 26684 |
return (0, import_i18n61.sprintf)( |
| 26685 |
// translators: 1: Actual bytes of a file. 2: The unit symbol (e.g. MB). |
| 26686 |
(0, import_i18n61._x)("%1$s %2$s", "file size"), |
| 26687 |
bytes.toLocaleString(void 0, { |
| 26688 |
minimumFractionDigits: 0, |
| 26689 |
maximumFractionDigits: decimals |
| 26690 |
}), |
| 26691 |
unitSymbol |
| 26692 |
); |
| 26693 |
} |
| 26694 |
function formatFileSize(bytes, decimals = 2) { |
| 26695 |
if (bytes === 0) { |
| 26696 |
return getBytesString(0, (0, import_i18n61._x)("B", "unit symbol"), decimals); |
| 26697 |
} |
| 26698 |
const quant = { |
| 26699 |
/* translators: Unit symbol for yottabyte. */ |
| 26700 |
[(0, import_i18n61._x)("YB", "unit symbol")]: YB_IN_BYTES, |
| 26701 |
/* translators: Unit symbol for zettabyte. */ |
| 26702 |
[(0, import_i18n61._x)("ZB", "unit symbol")]: ZB_IN_BYTES, |
| 26703 |
/* translators: Unit symbol for exabyte. */ |
| 26704 |
[(0, import_i18n61._x)("EB", "unit symbol")]: EB_IN_BYTES, |
| 26705 |
/* translators: Unit symbol for petabyte. */ |
| 26706 |
[(0, import_i18n61._x)("PB", "unit symbol")]: PB_IN_BYTES, |
| 26707 |
/* translators: Unit symbol for terabyte. */ |
| 26708 |
[(0, import_i18n61._x)("TB", "unit symbol")]: TB_IN_BYTES, |
| 26709 |
/* translators: Unit symbol for gigabyte. */ |
| 26710 |
[(0, import_i18n61._x)("GB", "unit symbol")]: GB_IN_BYTES, |
| 26711 |
/* translators: Unit symbol for megabyte. */ |
| 26712 |
[(0, import_i18n61._x)("MB", "unit symbol")]: MB_IN_BYTES, |
| 26713 |
/* translators: Unit symbol for kilobyte. */ |
| 26714 |
[(0, import_i18n61._x)("KB", "unit symbol")]: KB_IN_BYTES, |
| 26715 |
/* translators: Unit symbol for byte. */ |
| 26716 |
[(0, import_i18n61._x)("B", "unit symbol")]: 1 |
| 26717 |
}; |
| 26718 |
for (const [unit, mag] of Object.entries(quant)) { |
| 26719 |
if (bytes >= mag) { |
| 26720 |
return getBytesString(bytes / mag, unit, decimals); |
| 26721 |
} |
| 26722 |
} |
| 26723 |
return ""; |
| 26724 |
} |
| 26725 |
var filesizeField = { |
| 26726 |
id: "filesize", |
| 26727 |
type: "text", |
| 26728 |
label: (0, import_i18n61.__)("File size"), |
| 26729 |
getValue: ({ item }) => item?.media_details?.filesize ? formatFileSize(item?.media_details?.filesize) : "", |
| 26730 |
isVisible: (item) => { |
| 26731 |
return !!item?.media_details?.filesize; |
| 26732 |
}, |
| 26733 |
enableSorting: false, |
| 26734 |
filterBy: false, |
| 26735 |
readOnly: true |
| 26736 |
}; |
| 26737 |
var filesize_default = filesizeField; |
| 26738 |
|
| 26739 |
// packages/media-fields/build-module/media_dimensions/index.mjs |
| 26740 |
var import_i18n62 = __toESM(require_i18n(), 1); |
| 26741 |
var mediaDimensionsField = { |
| 26742 |
id: "media_dimensions", |
| 26743 |
type: "text", |
| 26744 |
label: (0, import_i18n62.__)("Dimensions"), |
| 26745 |
getValue: ({ item }) => item?.media_details?.width && item?.media_details?.height ? (0, import_i18n62.sprintf)( |
| 26746 |
// translators: 1: Width. 2: Height. |
| 26747 |
(0, import_i18n62._x)("%1$s \xD7 %2$s", "image dimensions"), |
| 26748 |
item?.media_details?.width?.toString(), |
| 26749 |
item?.media_details?.height?.toString() |
| 26750 |
) : "", |
| 26751 |
isVisible: (item) => { |
| 26752 |
return !!(item?.media_details?.width && item?.media_details?.height); |
| 26753 |
}, |
| 26754 |
enableSorting: false, |
| 26755 |
filterBy: false, |
| 26756 |
readOnly: true |
| 26757 |
}; |
| 26758 |
var media_dimensions_default = mediaDimensionsField; |
| 26759 |
|
| 26760 |
// packages/media-fields/build-module/media_thumbnail/index.mjs |
| 26761 |
var import_i18n64 = __toESM(require_i18n(), 1); |
| 26762 |
|
| 26763 |
// packages/media-fields/build-module/media_thumbnail/view.mjs |
| 26764 |
var import_data11 = __toESM(require_data(), 1); |
| 26765 |
var import_core_data4 = __toESM(require_core_data(), 1); |
| 26766 |
var import_components51 = __toESM(require_components(), 1); |
| 26767 |
var import_element79 = __toESM(require_element(), 1); |
| 26768 |
var import_url5 = __toESM(require_url(), 1); |
| 26769 |
|
| 26770 |
// packages/media-fields/build-module/utils/get-media-type-from-mime-type.mjs |
| 26771 |
var import_i18n63 = __toESM(require_i18n(), 1); |
| 26772 |
function getMediaTypeFromMimeType(mimeType) { |
| 26773 |
if (mimeType.startsWith("image/")) { |
| 26774 |
return { |
| 26775 |
type: "image", |
| 26776 |
label: (0, import_i18n63.__)("Image"), |
| 26777 |
icon: image_default |
| 26778 |
}; |
| 26779 |
} |
| 26780 |
if (mimeType.startsWith("video/")) { |
| 26781 |
return { |
| 26782 |
type: "video", |
| 26783 |
label: (0, import_i18n63.__)("Video"), |
| 26784 |
icon: video_default |
| 26785 |
}; |
| 26786 |
} |
| 26787 |
if (mimeType.startsWith("audio/")) { |
| 26788 |
return { |
| 26789 |
type: "audio", |
| 26790 |
label: (0, import_i18n63.__)("Audio"), |
| 26791 |
icon: audio_default |
| 26792 |
}; |
| 26793 |
} |
| 26794 |
return { |
| 26795 |
type: "application", |
| 26796 |
label: (0, import_i18n63.__)("Application"), |
| 26797 |
icon: file_default |
| 26798 |
}; |
| 26799 |
} |
| 26800 |
|
| 26801 |
// packages/media-fields/build-module/media_thumbnail/view.mjs |
| 26802 |
var import_jsx_runtime124 = __toESM(require_jsx_runtime(), 1); |
| 26803 |
function getBestImageUrl(featuredMedia, configSizes) { |
| 26804 |
const sizes = featuredMedia?.media_details?.sizes; |
| 26805 |
if (!sizes) { |
| 26806 |
return featuredMedia.source_url; |
| 26807 |
} |
| 26808 |
const sizeEntries = Object.values(sizes); |
| 26809 |
if (!sizeEntries.length) { |
| 26810 |
return featuredMedia.source_url; |
| 26811 |
} |
| 26812 |
const targetWidth = configSizes ? parseInt(configSizes, 10) : NaN; |
| 26813 |
if (!Number.isNaN(targetWidth)) { |
| 26814 |
const validEntries = sizeEntries.filter( |
| 26815 |
(s2) => typeof s2.width === "number" && !Number.isNaN(s2.width) |
| 26816 |
); |
| 26817 |
if (!validEntries.length) { |
| 26818 |
return featuredMedia.source_url; |
| 26819 |
} |
| 26820 |
const sorted = [...validEntries].sort( |
| 26821 |
(a2, b2) => a2.width - b2.width |
| 26822 |
); |
| 26823 |
const match2 = sorted.find((s2) => s2.width >= targetWidth); |
| 26824 |
if (match2) { |
| 26825 |
return match2.source_url; |
| 26826 |
} |
| 26827 |
return sorted[sorted.length - 1].source_url; |
| 26828 |
} |
| 26829 |
return featuredMedia.source_url; |
| 26830 |
} |
| 26831 |
function FallbackView({ |
| 26832 |
item, |
| 26833 |
filename |
| 26834 |
}) { |
| 26835 |
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className: "dataviews-media-field__media-thumbnail", children: /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)( |
| 26836 |
import_components51.__experimentalVStack, |
| 26837 |
{ |
| 26838 |
justify: "center", |
| 26839 |
alignment: "center", |
| 26840 |
className: "dataviews-media-field__media-thumbnail__stack", |
| 26841 |
spacing: 0, |
| 26842 |
children: [ |
| 26843 |
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)( |
| 26844 |
import_components51.Icon, |
| 26845 |
{ |
| 26846 |
className: "dataviews-media-field__media-thumbnail--icon", |
| 26847 |
icon: getMediaTypeFromMimeType(item.mime_type).icon, |
| 26848 |
size: 24 |
| 26849 |
} |
| 26850 |
), |
| 26851 |
!!filename && /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className: "dataviews-media-field__media-thumbnail__filename", children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_components51.__experimentalTruncate, { className: "dataviews-media-field__media-thumbnail__filename__truncate", children: filename }) }) |
| 26852 |
] |
| 26853 |
} |
| 26854 |
) }); |
| 26855 |
} |
| 26856 |
function ImageView({ |
| 26857 |
item, |
| 26858 |
configSizes, |
| 26859 |
onError |
| 26860 |
}) { |
| 26861 |
const imageUrl = getBestImageUrl(item, configSizes); |
| 26862 |
const imgRef = (0, import_element79.useRef)(null); |
| 26863 |
const [loadingState, setLoadingState] = (0, import_element79.useState)("loading"); |
| 26864 |
(0, import_element79.useLayoutEffect)(() => { |
| 26865 |
if (imgRef.current?.complete) { |
| 26866 |
setLoadingState("instant"); |
| 26867 |
} else { |
| 26868 |
setLoadingState("loading"); |
| 26869 |
} |
| 26870 |
}, [imageUrl]); |
| 26871 |
const handleLoad = () => { |
| 26872 |
if (loadingState === "loading") { |
| 26873 |
setLoadingState("loaded"); |
| 26874 |
} |
| 26875 |
}; |
| 26876 |
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)( |
| 26877 |
"div", |
| 26878 |
{ |
| 26879 |
className: clsx_default("dataviews-media-field__media-thumbnail", { |
| 26880 |
"is-loading": loadingState === "loading", |
| 26881 |
"is-loaded": loadingState === "loaded" |
| 26882 |
}), |
| 26883 |
children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)( |
| 26884 |
"img", |
| 26885 |
{ |
| 26886 |
ref: imgRef, |
| 26887 |
className: "dataviews-media-field__media-thumbnail--image", |
| 26888 |
src: imageUrl, |
| 26889 |
alt: item.alt_text || item.title.raw, |
| 26890 |
onLoad: handleLoad, |
| 26891 |
onError, |
| 26892 |
loading: "lazy" |
| 26893 |
} |
| 26894 |
) |
| 26895 |
} |
| 26896 |
); |
| 26897 |
} |
| 26898 |
function MediaThumbnailView({ |
| 26899 |
item, |
| 26900 |
config |
| 26901 |
}) { |
| 26902 |
const [imageError, setImageError] = (0, import_element79.useState)(false); |
| 26903 |
const _featuredMedia = (0, import_data11.useSelect)( |
| 26904 |
(select2) => { |
| 26905 |
if (!item.featured_media) { |
| 26906 |
return; |
| 26907 |
} |
| 26908 |
return select2(import_core_data4.store).getEntityRecord( |
| 26909 |
"postType", |
| 26910 |
"attachment", |
| 26911 |
item.featured_media |
| 26912 |
); |
| 26913 |
}, |
| 26914 |
[item.featured_media] |
| 26915 |
); |
| 26916 |
const featuredMedia = item.featured_media ? _featuredMedia : item; |
| 26917 |
if (!featuredMedia) { |
| 26918 |
return null; |
| 26919 |
} |
| 26920 |
const filename = (0, import_url5.getFilename)(featuredMedia.source_url || ""); |
| 26921 |
if (imageError || getMediaTypeFromMimeType(featuredMedia.mime_type).type !== "image") { |
| 26922 |
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(FallbackView, { item: featuredMedia, filename: filename || "" }); |
| 26923 |
} |
| 26924 |
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)( |
| 26925 |
ImageView, |
| 26926 |
{ |
| 26927 |
item: featuredMedia, |
| 26928 |
configSizes: config?.sizes, |
| 26929 |
onError: () => setImageError(true) |
| 26930 |
} |
| 26931 |
); |
| 26932 |
} |
| 26933 |
|
| 26934 |
// packages/media-fields/build-module/media_thumbnail/index.mjs |
| 26935 |
var mediaThumbnailField = { |
| 26936 |
id: "media_thumbnail", |
| 26937 |
type: "media", |
| 26938 |
label: (0, import_i18n64.__)("Thumbnail"), |
| 26939 |
render: MediaThumbnailView, |
| 26940 |
enableSorting: false, |
| 26941 |
filterBy: false |
| 26942 |
}; |
| 26943 |
var media_thumbnail_default = mediaThumbnailField; |
| 26944 |
|
| 26945 |
// packages/media-fields/build-module/mime_type/index.mjs |
| 26946 |
var import_i18n65 = __toESM(require_i18n(), 1); |
| 26947 |
var mimeTypeField = { |
| 26948 |
id: "mime_type", |
| 26949 |
type: "text", |
| 26950 |
label: (0, import_i18n65.__)("File type"), |
| 26951 |
getValue: ({ item }) => item?.mime_type || "", |
| 26952 |
render: ({ item }) => item?.mime_type || "-", |
| 26953 |
// Disable sorting until REST API support for ordering my `mime_type` is added. |
| 26954 |
// See: https://core.trac.wordpress.org/ticket/64073 |
| 26955 |
enableSorting: false, |
| 26956 |
filterBy: false, |
| 26957 |
readOnly: true |
| 26958 |
}; |
| 26959 |
var mime_type_default = mimeTypeField; |
| 26960 |
|
| 26961 |
// packages/media-utils/build-module/components/media-upload-modal/index.mjs |
| 26962 |
var import_notices = __toESM(require_notices(), 1); |
| 26963 |
|
| 26964 |
// packages/media-utils/build-module/lock-unlock.mjs |
| 26965 |
var import_private_apis4 = __toESM(require_private_apis(), 1); |
| 26966 |
var { lock: lock4, unlock: unlock4 } = (0, import_private_apis4.__dangerousOptInToUnstableAPIsOnlyForCoreModules)( |
| 26967 |
"I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.", |
| 26968 |
"@wordpress/media-utils" |
| 26969 |
); |
| 26970 |
|
| 26971 |
// packages/media-utils/build-module/components/media-upload-modal/upload-status-popover.mjs |
| 26972 |
var import_element80 = __toESM(require_element(), 1); |
| 26973 |
var import_i18n66 = __toESM(require_i18n(), 1); |
| 26974 |
var import_components52 = __toESM(require_components(), 1); |
| 26975 |
var import_jsx_runtime125 = __toESM(require_jsx_runtime(), 1); |
| 26976 |
function UploadStatusPopover({ |
| 26977 |
uploadingFiles, |
| 26978 |
onDismissError, |
| 26979 |
onOpenChange |
| 26980 |
}) { |
| 26981 |
const [isOpen, setIsOpen] = (0, import_element80.useState)(false); |
| 26982 |
const [prevHadErrors, setPrevHadErrors] = (0, import_element80.useState)(false); |
| 26983 |
const triggerRef = (0, import_element80.useRef)(null); |
| 26984 |
const updateIsOpen = (0, import_element80.useCallback)( |
| 26985 |
(open) => { |
| 26986 |
setIsOpen(open); |
| 26987 |
onOpenChange?.(open); |
| 26988 |
}, |
| 26989 |
[onOpenChange] |
| 26990 |
); |
| 26991 |
const activeFiles = uploadingFiles.filter( |
| 26992 |
(file) => file.status === "uploading" |
| 26993 |
); |
| 26994 |
const errorFiles = uploadingFiles.filter( |
| 26995 |
(file) => file.status === "error" |
| 26996 |
); |
| 26997 |
const hasErrors = errorFiles.length > 0; |
| 26998 |
const isUploading = activeFiles.length > 0; |
| 26999 |
(0, import_element80.useEffect)(() => { |
| 27000 |
if (hasErrors && !prevHadErrors) { |
| 27001 |
updateIsOpen(true); |
| 27002 |
} |
| 27003 |
setPrevHadErrors(hasErrors); |
| 27004 |
}, [hasErrors, prevHadErrors, updateIsOpen]); |
| 27005 |
if (uploadingFiles.length === 0) { |
| 27006 |
return null; |
| 27007 |
} |
| 27008 |
let buttonLabel, popoverHeading; |
| 27009 |
if (isUploading) { |
| 27010 |
buttonLabel = (0, import_i18n66.sprintf)( |
| 27011 |
// translators: %s: number of files being uploaded |
| 27012 |
(0, import_i18n66._n)("Uploading %s file", "Uploading %s files", activeFiles.length), |
| 27013 |
activeFiles.length.toLocaleString() |
| 27014 |
); |
| 27015 |
popoverHeading = (0, import_i18n66.__)("Uploading"); |
| 27016 |
} else if (hasErrors) { |
| 27017 |
buttonLabel = (0, import_i18n66.sprintf)( |
| 27018 |
// translators: %s: number of upload errors |
| 27019 |
(0, import_i18n66._n)("%s upload error", "%s upload errors", errorFiles.length), |
| 27020 |
errorFiles.length.toLocaleString() |
| 27021 |
); |
| 27022 |
popoverHeading = (0, import_i18n66.__)("Upload errors"); |
| 27023 |
} else { |
| 27024 |
buttonLabel = (0, import_i18n66.__)("Upload complete"); |
| 27025 |
popoverHeading = (0, import_i18n66.__)("Upload complete"); |
| 27026 |
} |
| 27027 |
return /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)("div", { className: "media-upload-modal__upload-status", children: [ |
| 27028 |
isUploading && /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_components52.Spinner, {}), |
| 27029 |
/* @__PURE__ */ (0, import_jsx_runtime125.jsx)( |
| 27030 |
import_components52.Button, |
| 27031 |
{ |
| 27032 |
className: "media-upload-modal__upload-status__trigger", |
| 27033 |
size: "compact", |
| 27034 |
icon: chevron_down_default, |
| 27035 |
iconPosition: "right", |
| 27036 |
onClick: () => updateIsOpen(!isOpen), |
| 27037 |
"aria-expanded": isOpen, |
| 27038 |
ref: triggerRef, |
| 27039 |
children: buttonLabel |
| 27040 |
} |
| 27041 |
), |
| 27042 |
isOpen && /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)( |
| 27043 |
import_components52.Popover, |
| 27044 |
{ |
| 27045 |
className: "media-upload-modal__upload-status__popover", |
| 27046 |
placement: "top-start", |
| 27047 |
offset: 8, |
| 27048 |
anchor: triggerRef.current, |
| 27049 |
focusOnMount: true, |
| 27050 |
onClose: () => { |
| 27051 |
if (triggerRef.current?.contains( |
| 27052 |
triggerRef.current.ownerDocument.activeElement |
| 27053 |
)) { |
| 27054 |
return; |
| 27055 |
} |
| 27056 |
updateIsOpen(false); |
| 27057 |
}, |
| 27058 |
children: [ |
| 27059 |
/* @__PURE__ */ (0, import_jsx_runtime125.jsx)("div", { className: "media-upload-modal__upload-status__header", children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)("h3", { children: popoverHeading }) }), |
| 27060 |
/* @__PURE__ */ (0, import_jsx_runtime125.jsx)("ul", { className: "media-upload-modal__upload-status__list", children: uploadingFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)( |
| 27061 |
"li", |
| 27062 |
{ |
| 27063 |
className: "media-upload-modal__upload-status__item", |
| 27064 |
children: [ |
| 27065 |
file.status === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_components52.Spinner, {}), |
| 27066 |
file.status === "uploaded" && /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_components52.Icon, { icon: check_default, size: 16 }), |
| 27067 |
(file.status === "uploading" || file.status === "uploaded") && /* @__PURE__ */ (0, import_jsx_runtime125.jsx)( |
| 27068 |
"span", |
| 27069 |
{ |
| 27070 |
className: "media-upload-modal__upload-status__filename", |
| 27071 |
title: file.name, |
| 27072 |
children: file.name |
| 27073 |
} |
| 27074 |
), |
| 27075 |
file.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)( |
| 27076 |
import_components52.Notice, |
| 27077 |
{ |
| 27078 |
status: "error", |
| 27079 |
isDismissible: !!onDismissError, |
| 27080 |
onRemove: () => onDismissError?.(file.id), |
| 27081 |
children: [ |
| 27082 |
file.name, |
| 27083 |
": ", |
| 27084 |
file.error |
| 27085 |
] |
| 27086 |
} |
| 27087 |
) |
| 27088 |
] |
| 27089 |
}, |
| 27090 |
file.id |
| 27091 |
)) }) |
| 27092 |
] |
| 27093 |
} |
| 27094 |
) |
| 27095 |
] }); |
| 27096 |
} |
| 27097 |
|
| 27098 |
// packages/media-utils/build-module/components/media-upload-modal/use-invalidate-attachment-resolutions.mjs |
| 27099 |
var import_element81 = __toESM(require_element(), 1); |
| 27100 |
var import_core_data5 = __toESM(require_core_data(), 1); |
| 27101 |
var import_data12 = __toESM(require_data(), 1); |
| 27102 |
function useInvalidateAttachmentResolutions() { |
| 27103 |
const registry = (0, import_data12.useRegistry)(); |
| 27104 |
return (0, import_element81.useCallback)(() => { |
| 27105 |
const resolvers = registry.select(import_core_data5.store).getCachedResolvers(); |
| 27106 |
const entityRecordResolutions = resolvers.getEntityRecords; |
| 27107 |
entityRecordResolutions?.forEach((_value, args) => { |
| 27108 |
if (args[0] === "postType" && args[1] === "attachment") { |
| 27109 |
registry.dispatch(import_core_data5.store).invalidateResolution("getEntityRecords", args); |
| 27110 |
} |
| 27111 |
}); |
| 27112 |
}, [registry]); |
| 27113 |
} |
| 27114 |
|
| 27115 |
// packages/media-utils/build-module/components/media-upload-modal/use-upload-status.mjs |
| 27116 |
var import_element82 = __toESM(require_element(), 1); |
| 27117 |
var import_blob2 = __toESM(require_blob(), 1); |
| 27118 |
var idCounter = 0; |
| 27119 |
var batchIdCounter = 0; |
| 27120 |
function useUploadStatus({ |
| 27121 |
onBatchComplete |
| 27122 |
} = {}) { |
| 27123 |
const [uploadingFiles, setUploadingFiles] = (0, import_element82.useState)( |
| 27124 |
[] |
| 27125 |
); |
| 27126 |
const clearCompleted = (0, import_element82.useCallback)(() => { |
| 27127 |
setUploadingFiles( |
| 27128 |
(prev) => prev.filter((item) => item.status !== "uploaded") |
| 27129 |
); |
| 27130 |
}, []); |
| 27131 |
const dismissError = (0, import_element82.useCallback)((fileId) => { |
| 27132 |
setUploadingFiles( |
| 27133 |
(prev) => prev.filter((item) => item.id !== fileId) |
| 27134 |
); |
| 27135 |
}, []); |
| 27136 |
const registerBatch = (0, import_element82.useCallback)( |
| 27137 |
(files) => { |
| 27138 |
const batchId = String(++batchIdCounter); |
| 27139 |
const batchSize = files.length; |
| 27140 |
const newEntries = files.map((file) => ({ |
| 27141 |
id: String(++idCounter), |
| 27142 |
batchId, |
| 27143 |
name: file.name, |
| 27144 |
status: "uploading" |
| 27145 |
})); |
| 27146 |
setUploadingFiles((prev) => [...prev, ...newEntries]); |
| 27147 |
let successCount = 0; |
| 27148 |
let errorCount = 0; |
| 27149 |
let batchDone = false; |
| 27150 |
let successAttachments = []; |
| 27151 |
const completeBatchIfDone = () => { |
| 27152 |
if (batchDone || successCount + errorCount < batchSize) { |
| 27153 |
return; |
| 27154 |
} |
| 27155 |
batchDone = true; |
| 27156 |
setUploadingFiles( |
| 27157 |
(prev) => prev.map( |
| 27158 |
(item) => item.batchId === batchId && item.status === "uploading" ? { |
| 27159 |
...item, |
| 27160 |
status: "uploaded" |
| 27161 |
} : item |
| 27162 |
) |
| 27163 |
); |
| 27164 |
onBatchComplete?.(successAttachments); |
| 27165 |
}; |
| 27166 |
const onFileChange = (attachments) => { |
| 27167 |
if (batchDone) { |
| 27168 |
return; |
| 27169 |
} |
| 27170 |
const allReal = attachments.every( |
| 27171 |
(attachment) => attachment.id && attachment.url && !(0, import_blob2.isBlobURL)(attachment.url) |
| 27172 |
); |
| 27173 |
if (!allReal) { |
| 27174 |
return; |
| 27175 |
} |
| 27176 |
successCount = attachments.length; |
| 27177 |
successAttachments = attachments; |
| 27178 |
completeBatchIfDone(); |
| 27179 |
}; |
| 27180 |
const onError = (error) => { |
| 27181 |
const fileName = error instanceof UploadError ? error.file.name : void 0; |
| 27182 |
setUploadingFiles((prev) => { |
| 27183 |
let matched = false; |
| 27184 |
return prev.map((item) => { |
| 27185 |
if (!matched && item.batchId === batchId && item.status === "uploading" && (!fileName || item.name === fileName)) { |
| 27186 |
matched = true; |
| 27187 |
return { |
| 27188 |
...item, |
| 27189 |
status: "error", |
| 27190 |
error: error.message |
| 27191 |
}; |
| 27192 |
} |
| 27193 |
return item; |
| 27194 |
}); |
| 27195 |
}); |
| 27196 |
errorCount++; |
| 27197 |
completeBatchIfDone(); |
| 27198 |
}; |
| 27199 |
return { onFileChange, onError }; |
| 27200 |
}, |
| 27201 |
[onBatchComplete] |
| 27202 |
); |
| 27203 |
const allComplete = uploadingFiles.length > 0 && uploadingFiles.every((item) => item.status !== "uploading"); |
| 27204 |
return { |
| 27205 |
uploadingFiles, |
| 27206 |
registerBatch, |
| 27207 |
dismissError, |
| 27208 |
clearCompleted, |
| 27209 |
allComplete |
| 27210 |
}; |
| 27211 |
} |
| 27212 |
|
| 27213 |
// packages/media-utils/build-module/components/media-upload-modal/index.mjs |
| 27214 |
var import_jsx_runtime126 = __toESM(require_jsx_runtime(), 1); |
| 27215 |
var { useEntityRecordsWithPermissions } = unlock4(import_core_data6.privateApis); |
| 27216 |
var LAYOUT_PICKER_GRID2 = "pickerGrid"; |
| 27217 |
var LAYOUT_PICKER_TABLE2 = "pickerTable"; |
| 27218 |
var NOTICES_CONTEXT = "media-modal"; |
| 27219 |
var NOTICE_ID_UPLOAD_PROGRESS = "media-modal-upload-progress"; |
| 27220 |
var defaultQueryParams = { |
| 27221 |
page: 1, |
| 27222 |
search: "" |
| 27223 |
}; |
| 27224 |
var defaultView = { |
| 27225 |
type: LAYOUT_PICKER_GRID2, |
| 27226 |
fields: [], |
| 27227 |
showTitle: false, |
| 27228 |
titleField: "title", |
| 27229 |
mediaField: "media_thumbnail", |
| 27230 |
perPage: 50, |
| 27231 |
filters: [], |
| 27232 |
layout: { |
| 27233 |
previewSize: 170, |
| 27234 |
density: "compact" |
| 27235 |
} |
| 27236 |
}; |
| 27237 |
var defaultLayouts = { |
| 27238 |
[LAYOUT_PICKER_GRID2]: { |
| 27239 |
fields: [], |
| 27240 |
showTitle: false, |
| 27241 |
layout: { |
| 27242 |
previewSize: 170, |
| 27243 |
density: "compact" |
| 27244 |
} |
| 27245 |
}, |
| 27246 |
[LAYOUT_PICKER_TABLE2]: { |
| 27247 |
fields: [ |
| 27248 |
"filename", |
| 27249 |
"filesize", |
| 27250 |
"media_dimensions", |
| 27251 |
"author", |
| 27252 |
"date" |
| 27253 |
], |
| 27254 |
showTitle: true |
| 27255 |
} |
| 27256 |
}; |
| 27257 |
function MediaUploadModal({ |
| 27258 |
allowedTypes, |
| 27259 |
multiple = false, |
| 27260 |
value, |
| 27261 |
onSelect, |
| 27262 |
onClose, |
| 27263 |
onUpload, |
| 27264 |
title = (0, import_i18n67.__)("Select Media"), |
| 27265 |
isOpen, |
| 27266 |
isDismissible = true, |
| 27267 |
modalClass, |
| 27268 |
search = true, |
| 27269 |
searchLabel = (0, import_i18n67.__)("Search media") |
| 27270 |
}) { |
| 27271 |
const [selection, setSelection] = (0, import_element83.useState)(() => { |
| 27272 |
if (!value) { |
| 27273 |
return []; |
| 27274 |
} |
| 27275 |
return Array.isArray(value) ? value.map(String) : [String(value)]; |
| 27276 |
}); |
| 27277 |
const { createSuccessNotice, removeAllNotices } = (0, import_data13.useDispatch)(import_notices.store); |
| 27278 |
const invalidateAttachmentResolutions = useInvalidateAttachmentResolutions(); |
| 27279 |
const [queryParams, setQueryParams] = (0, import_element83.useState)( |
| 27280 |
() => defaultQueryParams |
| 27281 |
); |
| 27282 |
const { view, updateView, isModified, resetToDefault } = useView({ |
| 27283 |
kind: "postType", |
| 27284 |
name: "attachment", |
| 27285 |
slug: "media-modal", |
| 27286 |
defaultView, |
| 27287 |
queryParams, |
| 27288 |
onChangeQueryParams: setQueryParams |
| 27289 |
}); |
| 27290 |
const handleChangeView = (0, import_element83.useCallback)( |
| 27291 |
(nextView) => { |
| 27292 |
const normalizedView = { ...nextView }; |
| 27293 |
if (normalizedView.startPosition === void 0) { |
| 27294 |
delete normalizedView.startPosition; |
| 27295 |
} |
| 27296 |
updateView(normalizedView); |
| 27297 |
}, |
| 27298 |
[updateView] |
| 27299 |
); |
| 27300 |
const queryArgs = (0, import_element83.useMemo)(() => { |
| 27301 |
const filters = {}; |
| 27302 |
view.filters?.forEach((filter) => { |
| 27303 |
if (filter.field === "media_type") { |
| 27304 |
filters.media_type = filter.value; |
| 27305 |
} |
| 27306 |
if (filter.field === "author") { |
| 27307 |
if (filter.operator === "isAny") { |
| 27308 |
filters.author = filter.value; |
| 27309 |
} else if (filter.operator === "isNone") { |
| 27310 |
filters.author_exclude = filter.value; |
| 27311 |
} |
| 27312 |
} |
| 27313 |
if (filter.field === "date" || filter.field === "modified") { |
| 27314 |
if (filter.operator === "before") { |
| 27315 |
filters.before = filter.value; |
| 27316 |
} else if (filter.operator === "after") { |
| 27317 |
filters.after = filter.value; |
| 27318 |
} |
| 27319 |
} |
| 27320 |
if (filter.field === "mime_type") { |
| 27321 |
filters.mime_type = filter.value; |
| 27322 |
} |
| 27323 |
}); |
| 27324 |
if (!filters.media_type && !filters.mime_type && allowedTypes && !allowedTypes.includes("*")) { |
| 27325 |
const { mediaTypes, mimeTypes } = allowedTypes.reduce( |
| 27326 |
(acc, type) => { |
| 27327 |
if (type.endsWith("/*")) { |
| 27328 |
acc.mediaTypes.push(type.replace("/*", "")); |
| 27329 |
} else if (type.includes("/")) { |
| 27330 |
acc.mimeTypes.push(type); |
| 27331 |
} else { |
| 27332 |
acc.mediaTypes.push(type); |
| 27333 |
} |
| 27334 |
return acc; |
| 27335 |
}, |
| 27336 |
{ mediaTypes: [], mimeTypes: [] } |
| 27337 |
); |
| 27338 |
if (mediaTypes.length) { |
| 27339 |
filters.media_type = mediaTypes; |
| 27340 |
} |
| 27341 |
if (mimeTypes.length) { |
| 27342 |
filters.mime_type = mimeTypes; |
| 27343 |
} |
| 27344 |
} |
| 27345 |
return { |
| 27346 |
per_page: view.perPage || 20, |
| 27347 |
page: view.page || 1, |
| 27348 |
status: "inherit", |
| 27349 |
order: view.sort?.direction, |
| 27350 |
orderby: view.sort?.field, |
| 27351 |
search: view.search, |
| 27352 |
_embed: "author,wp:attached-to", |
| 27353 |
...filters |
| 27354 |
}; |
| 27355 |
}, [view, allowedTypes]); |
| 27356 |
const handleBatchComplete = (0, import_element83.useCallback)( |
| 27357 |
(attachments) => { |
| 27358 |
const uploadedIds = attachments.map((attachment) => String(attachment.id)).filter(Boolean); |
| 27359 |
if (multiple) { |
| 27360 |
setSelection((prev) => { |
| 27361 |
const existing = new Set(prev); |
| 27362 |
const newIds = uploadedIds.filter( |
| 27363 |
(id) => !existing.has(id) |
| 27364 |
); |
| 27365 |
return [...prev, ...newIds]; |
| 27366 |
}); |
| 27367 |
} else { |
| 27368 |
setSelection(uploadedIds.slice(0, 1)); |
| 27369 |
} |
| 27370 |
invalidateAttachmentResolutions(); |
| 27371 |
}, |
| 27372 |
[multiple, invalidateAttachmentResolutions] |
| 27373 |
); |
| 27374 |
const { |
| 27375 |
uploadingFiles, |
| 27376 |
registerBatch, |
| 27377 |
dismissError, |
| 27378 |
clearCompleted, |
| 27379 |
allComplete |
| 27380 |
} = useUploadStatus({ onBatchComplete: handleBatchComplete }); |
| 27381 |
const isPopoverOpenRef = (0, import_element83.useRef)(false); |
| 27382 |
const handlePopoverOpenChange = (0, import_element83.useCallback)( |
| 27383 |
(open) => { |
| 27384 |
isPopoverOpenRef.current = open; |
| 27385 |
if (!open) { |
| 27386 |
clearCompleted(); |
| 27387 |
} |
| 27388 |
}, |
| 27389 |
[clearCompleted] |
| 27390 |
); |
| 27391 |
const { |
| 27392 |
records: mediaRecords, |
| 27393 |
isResolving: isLoading, |
| 27394 |
totalItems, |
| 27395 |
totalPages |
| 27396 |
} = useEntityRecordsWithPermissions("postType", "attachment", queryArgs); |
| 27397 |
const fields = (0, import_element83.useMemo)( |
| 27398 |
() => [ |
| 27399 |
// Media field definitions from @wordpress/media-fields |
| 27400 |
// Cast is safe because RestAttachment has the same properties as Attachment |
| 27401 |
{ |
| 27402 |
...media_thumbnail_default, |
| 27403 |
enableHiding: false |
| 27404 |
// Within the modal, the thumbnail should always be shown. |
| 27405 |
}, |
| 27406 |
{ |
| 27407 |
id: "title", |
| 27408 |
type: "text", |
| 27409 |
label: (0, import_i18n67.__)("Title"), |
| 27410 |
getValue: ({ item }) => { |
| 27411 |
const titleValue = item.title.raw || item.title.rendered; |
| 27412 |
return titleValue || (0, import_i18n67.__)("(no title)"); |
| 27413 |
} |
| 27414 |
}, |
| 27415 |
alt_text_default, |
| 27416 |
caption_default, |
| 27417 |
description_default, |
| 27418 |
date_added_default, |
| 27419 |
date_modified_default, |
| 27420 |
author_default, |
| 27421 |
filename_default, |
| 27422 |
filesize_default, |
| 27423 |
media_dimensions_default, |
| 27424 |
mime_type_default, |
| 27425 |
attached_to_default |
| 27426 |
], |
| 27427 |
[] |
| 27428 |
); |
| 27429 |
const actions = (0, import_element83.useMemo)( |
| 27430 |
() => [ |
| 27431 |
{ |
| 27432 |
id: "select", |
| 27433 |
label: (0, import_i18n67.__)("Select"), |
| 27434 |
isPrimary: true, |
| 27435 |
supportsBulk: multiple, |
| 27436 |
async callback() { |
| 27437 |
if (selection.length === 0) { |
| 27438 |
return; |
| 27439 |
} |
| 27440 |
const selectedPostsQuery = { |
| 27441 |
include: selection, |
| 27442 |
per_page: -1 |
| 27443 |
}; |
| 27444 |
const selectedPosts = await (0, import_data13.resolveSelect)( |
| 27445 |
import_core_data6.store |
| 27446 |
).getEntityRecords( |
| 27447 |
"postType", |
| 27448 |
"attachment", |
| 27449 |
selectedPostsQuery |
| 27450 |
); |
| 27451 |
const transformedPosts = (selectedPosts ?? []).map(transformAttachment).filter(Boolean); |
| 27452 |
const selectedItems = multiple ? transformedPosts : transformedPosts?.[0]; |
| 27453 |
removeAllNotices("snackbar", NOTICES_CONTEXT); |
| 27454 |
onSelect(selectedItems); |
| 27455 |
} |
| 27456 |
} |
| 27457 |
], |
| 27458 |
[multiple, onSelect, selection, removeAllNotices] |
| 27459 |
); |
| 27460 |
const handleModalClose = (0, import_element83.useCallback)(() => { |
| 27461 |
removeAllNotices("snackbar", NOTICES_CONTEXT); |
| 27462 |
onClose?.(); |
| 27463 |
}, [removeAllNotices, onClose]); |
| 27464 |
(0, import_element83.useEffect)(() => { |
| 27465 |
if (!isOpen) { |
| 27466 |
setQueryParams(defaultQueryParams); |
| 27467 |
} |
| 27468 |
}, [isOpen]); |
| 27469 |
const handleUpload = onUpload || uploadMedia; |
| 27470 |
const prevAllCompleteRef = (0, import_element83.useRef)(false); |
| 27471 |
(0, import_element83.useEffect)(() => { |
| 27472 |
if (allComplete && !prevAllCompleteRef.current) { |
| 27473 |
const completeCount = uploadingFiles.filter( |
| 27474 |
(file) => file.status === "uploaded" |
| 27475 |
).length; |
| 27476 |
if (completeCount > 0) { |
| 27477 |
createSuccessNotice( |
| 27478 |
(0, import_i18n67.sprintf)( |
| 27479 |
// translators: %s: number of files |
| 27480 |
(0, import_i18n67._n)( |
| 27481 |
"Uploaded %s file", |
| 27482 |
"Uploaded %s files", |
| 27483 |
completeCount |
| 27484 |
), |
| 27485 |
completeCount.toLocaleString() |
| 27486 |
), |
| 27487 |
{ |
| 27488 |
type: "snackbar", |
| 27489 |
context: NOTICES_CONTEXT, |
| 27490 |
id: NOTICE_ID_UPLOAD_PROGRESS |
| 27491 |
} |
| 27492 |
); |
| 27493 |
} |
| 27494 |
if (!isPopoverOpenRef.current) { |
| 27495 |
clearCompleted(); |
| 27496 |
} |
| 27497 |
} |
| 27498 |
prevAllCompleteRef.current = allComplete; |
| 27499 |
}, [allComplete, uploadingFiles, createSuccessNotice, clearCompleted]); |
| 27500 |
const handleFileSelect = (0, import_element83.useCallback)( |
| 27501 |
(event) => { |
| 27502 |
const files = event.target.files; |
| 27503 |
if (files && files.length > 0) { |
| 27504 |
const filesArray = Array.from(files); |
| 27505 |
const { onFileChange, onError } = registerBatch(filesArray); |
| 27506 |
handleUpload({ |
| 27507 |
allowedTypes, |
| 27508 |
filesList: filesArray, |
| 27509 |
onFileChange, |
| 27510 |
onError |
| 27511 |
}); |
| 27512 |
} |
| 27513 |
}, |
| 27514 |
[allowedTypes, handleUpload, registerBatch] |
| 27515 |
); |
| 27516 |
const paginationInfo = (0, import_element83.useMemo)( |
| 27517 |
() => ({ |
| 27518 |
totalItems, |
| 27519 |
totalPages |
| 27520 |
}), |
| 27521 |
[totalItems, totalPages] |
| 27522 |
); |
| 27523 |
const acceptTypes = (0, import_element83.useMemo)(() => { |
| 27524 |
if (allowedTypes?.includes("*")) { |
| 27525 |
return void 0; |
| 27526 |
} |
| 27527 |
return allowedTypes?.join(","); |
| 27528 |
}, [allowedTypes]); |
| 27529 |
if (!isOpen) { |
| 27530 |
return null; |
| 27531 |
} |
| 27532 |
return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)( |
| 27533 |
import_components53.Modal, |
| 27534 |
{ |
| 27535 |
title, |
| 27536 |
onRequestClose: handleModalClose, |
| 27537 |
isDismissible, |
| 27538 |
className: modalClass, |
| 27539 |
overlayClassName: "media-upload-modal", |
| 27540 |
size: "fill", |
| 27541 |
headerActions: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)( |
| 27542 |
import_components53.FormFileUpload, |
| 27543 |
{ |
| 27544 |
accept: acceptTypes, |
| 27545 |
multiple: true, |
| 27546 |
onChange: handleFileSelect, |
| 27547 |
__next40pxDefaultSize: true, |
| 27548 |
render: ({ openFileDialog }) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)( |
| 27549 |
import_components53.Button, |
| 27550 |
{ |
| 27551 |
onClick: openFileDialog, |
| 27552 |
icon: upload_default, |
| 27553 |
__next40pxDefaultSize: true, |
| 27554 |
children: (0, import_i18n67.__)("Upload media") |
| 27555 |
} |
| 27556 |
) |
| 27557 |
} |
| 27558 |
), |
| 27559 |
children: [ |
| 27560 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)( |
| 27561 |
import_components53.DropZone, |
| 27562 |
{ |
| 27563 |
onFilesDrop: (files) => { |
| 27564 |
let filteredFiles = files; |
| 27565 |
if (allowedTypes && !allowedTypes.includes("*")) { |
| 27566 |
filteredFiles = files.filter( |
| 27567 |
(file) => allowedTypes.some((allowedType) => { |
| 27568 |
return file.type === allowedType || file.type.startsWith( |
| 27569 |
allowedType.replace("*", "") |
| 27570 |
); |
| 27571 |
}) |
| 27572 |
); |
| 27573 |
} |
| 27574 |
if (filteredFiles.length > 0) { |
| 27575 |
const { onFileChange, onError } = registerBatch(filteredFiles); |
| 27576 |
handleUpload({ |
| 27577 |
allowedTypes, |
| 27578 |
filesList: filteredFiles, |
| 27579 |
onFileChange, |
| 27580 |
onError |
| 27581 |
}); |
| 27582 |
} |
| 27583 |
}, |
| 27584 |
label: (0, import_i18n67.__)("Drop files to upload") |
| 27585 |
} |
| 27586 |
), |
| 27587 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsxs)( |
| 27588 |
dataviews_picker_default, |
| 27589 |
{ |
| 27590 |
data: mediaRecords || [], |
| 27591 |
fields, |
| 27592 |
view, |
| 27593 |
onChangeView: handleChangeView, |
| 27594 |
actions, |
| 27595 |
selection, |
| 27596 |
onChangeSelection: setSelection, |
| 27597 |
isLoading, |
| 27598 |
paginationInfo, |
| 27599 |
defaultLayouts, |
| 27600 |
getItemId: (item) => String(item.id), |
| 27601 |
itemListLabel: (0, import_i18n67.__)("Media items"), |
| 27602 |
onReset: isModified ? resetToDefault : false, |
| 27603 |
children: [ |
| 27604 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsxs)( |
| 27605 |
Stack, |
| 27606 |
{ |
| 27607 |
direction: "row", |
| 27608 |
align: "top", |
| 27609 |
justify: "space-between", |
| 27610 |
className: "dataviews__view-actions", |
| 27611 |
gap: "xs", |
| 27612 |
children: [ |
| 27613 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsxs)( |
| 27614 |
Stack, |
| 27615 |
{ |
| 27616 |
direction: "row", |
| 27617 |
gap: "sm", |
| 27618 |
justify: "start", |
| 27619 |
className: "dataviews__search", |
| 27620 |
children: [ |
| 27621 |
search && /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.Search, { label: searchLabel }), |
| 27622 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.FiltersToggle, {}) |
| 27623 |
] |
| 27624 |
} |
| 27625 |
), |
| 27626 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(Stack, { direction: "row", gap: "xs", style: { flexShrink: 0 }, children: [ |
| 27627 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.LayoutSwitcher, {}), |
| 27628 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.ViewConfig, {}) |
| 27629 |
] }) |
| 27630 |
] |
| 27631 |
} |
| 27632 |
), |
| 27633 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.FiltersToggled, { className: "dataviews-filters__container" }), |
| 27634 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.Layout, {}), |
| 27635 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsxs)( |
| 27636 |
"div", |
| 27637 |
{ |
| 27638 |
className: clsx_default("media-upload-modal__footer", { |
| 27639 |
"is-uploading": uploadingFiles.length > 0 |
| 27640 |
}), |
| 27641 |
children: [ |
| 27642 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)( |
| 27643 |
UploadStatusPopover, |
| 27644 |
{ |
| 27645 |
uploadingFiles, |
| 27646 |
onDismissError: dismissError, |
| 27647 |
onOpenChange: handlePopoverOpenChange |
| 27648 |
} |
| 27649 |
), |
| 27650 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(dataviews_picker_default.Footer, {}) |
| 27651 |
] |
| 27652 |
} |
| 27653 |
) |
| 27654 |
] |
| 27655 |
} |
| 27656 |
), |
| 27657 |
(0, import_element83.createPortal)( |
| 27658 |
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)( |
| 27659 |
import_notices.SnackbarNotices, |
| 27660 |
{ |
| 27661 |
className: "media-upload-modal__snackbar", |
| 27662 |
context: NOTICES_CONTEXT |
| 27663 |
} |
| 27664 |
), |
| 27665 |
document.body |
| 27666 |
) |
| 27667 |
] |
| 27668 |
} |
| 27669 |
); |
| 27670 |
} |
| 27671 |
|
| 27672 |
// packages/media-utils/build-module/private-apis.mjs |
| 27673 |
var privateApis12 = {}; |
| 27674 |
lock4(privateApis12, { |
| 27675 |
sideloadMedia, |
| 27676 |
MediaUploadModal |
| 27677 |
}); |
| 27678 |
return __toCommonJS(index_exports); |
| 27679 |
})(); |
| 27680 |
/*! Bundled license information: |
| 27681 |
|
| 27682 |
use-sync-external-store/cjs/use-sync-external-store-shim.development.js: |
| 27683 |
(** |
| 27684 |
* @license React |
| 27685 |
* use-sync-external-store-shim.development.js |
| 27686 |
* |
| 27687 |
* Copyright (c) Meta Platforms, Inc. and affiliates. |
| 27688 |
* |
| 27689 |
* This source code is licensed under the MIT license found in the |
| 27690 |
* LICENSE file in the root directory of this source tree. |
| 27691 |
*) |
| 27692 |
|
| 27693 |
use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js: |
| 27694 |
(** |
| 27695 |
* @license React |
| 27696 |
* use-sync-external-store-shim/with-selector.development.js |
| 27697 |
* |
| 27698 |
* Copyright (c) Meta Platforms, Inc. and affiliates. |
| 27699 |
* |
| 27700 |
* This source code is licensed under the MIT license found in the |
| 27701 |
* LICENSE file in the root directory of this source tree. |
| 27702 |
*) |
| 27703 |
*/ |
| 27704 |
//# sourceMappingURL=index.js.map |
| 27705 |
|
