| @@ -1198,11 +1198,38 @@ | ||
| 1198 | 1198 | return d3(n3); |
| 1199 | 1199 | }, []); |
| 1200 | 1200 | } |
| 1201 | 1201 | |
| 1202 | -// packages/interactivity/build-module/directives.mjs | |
| 1202 | +// packages/interactivity/build-module/hooks.mjs | |
| 1203 | 1203 | init_preact_module(); |
| 1204 | 1204 | |
| 1205 | +// packages/interactivity/build-module/proxies/registry.mjs | |
| 1206 | +var objToProxy = /* @__PURE__ */ new WeakMap(); | |
| 1207 | +var proxyToObj = /* @__PURE__ */ new WeakMap(); | |
| 1208 | +var proxyToNs = /* @__PURE__ */ new WeakMap(); | |
| 1209 | +var supported = /* @__PURE__ */ new Set([Object, Array]); | |
| 1210 | +var createProxy = (namespace, obj, handlers) => { | |
| 1211 | + if (!shouldProxy(obj)) { | |
| 1212 | + throw Error("This object cannot be proxified."); | |
| 1213 | + } | |
| 1214 | + if (!objToProxy.has(obj)) { | |
| 1215 | + const proxy = new Proxy(obj, handlers); | |
| 1216 | + objToProxy.set(obj, proxy); | |
| 1217 | + proxyToObj.set(proxy, obj); | |
| 1218 | + proxyToNs.set(proxy, namespace); | |
| 1219 | + } | |
| 1220 | + return objToProxy.get(obj); | |
| 1221 | +}; | |
| 1222 | +var getProxyFromObject = (obj) => objToProxy.get(obj); | |
| 1223 | +var getNamespaceFromProxy = (proxy) => proxyToNs.get(proxy); | |
| 1224 | +var shouldProxy = (candidate) => { | |
| 1225 | + if (typeof candidate !== "object" || candidate === null) { | |
| 1226 | + return false; | |
| 1227 | + } | |
| 1228 | + return !proxyToNs.has(candidate) && supported.has(candidate.constructor); | |
| 1229 | +}; | |
| 1230 | +var getObjectFromProxy = (proxy) => proxyToObj.get(proxy); | |
| 1231 | + | |
| 1205 | 1232 | // packages/interactivity/build-module/namespaces.mjs |
| 1206 | 1233 | var namespaceStack = []; |
| 1207 | 1234 | var getNamespace = () => namespaceStack.slice(-1)[0]; |
| 1208 | 1235 | var setNamespace = (namespace) => { |
| @@ -1211,61 +1238,8 @@ | ||
| 1211 | 1238 | var resetNamespace = () => { |
| 1212 | 1239 | namespaceStack.pop(); |
| 1213 | 1240 | }; |
| 1214 | 1241 | |
| 1215 | -// packages/interactivity/build-module/scopes.mjs | |
| 1216 | -var scopeStack = []; | |
| 1217 | -var getScope = () => scopeStack.slice(-1)[0]; | |
| 1218 | -var setScope = (scope) => { | |
| 1219 | - scopeStack.push(scope); | |
| 1220 | -}; | |
| 1221 | -var resetScope = () => { | |
| 1222 | - scopeStack.pop(); | |
| 1223 | -}; | |
| 1224 | -var throwNotInScope = (method) => { | |
| 1225 | - throw Error( | |
| 1226 | - `Cannot call \`${method}()\` when there is no scope. If you are using an async function, please consider using a generator instead. If you are using some sort of async callbacks, like \`setTimeout\`, please wrap the callback with \`withScope(callback)\`.` | |
| 1227 | - ); | |
| 1228 | -}; | |
| 1229 | -var getContext = (namespace) => { | |
| 1230 | - const scope = getScope(); | |
| 1231 | - if (true) { | |
| 1232 | - if (!scope) { | |
| 1233 | - throwNotInScope("getContext"); | |
| 1234 | - } | |
| 1235 | - } | |
| 1236 | - return scope.context[namespace || getNamespace()]; | |
| 1237 | -}; | |
| 1238 | -var getElement = () => { | |
| 1239 | - const scope = getScope(); | |
| 1240 | - let deepReadOnlyOptions = {}; | |
| 1241 | - if (true) { | |
| 1242 | - if (!scope) { | |
| 1243 | - throwNotInScope("getElement"); | |
| 1244 | - } | |
| 1245 | - deepReadOnlyOptions = { | |
| 1246 | - errorMessage: "Don't mutate the attributes from `getElement`, use `data-wp-bind` to modify the attributes of an element instead." | |
| 1247 | - }; | |
| 1248 | - } | |
| 1249 | - const { ref, attributes } = scope; | |
| 1250 | - return Object.freeze({ | |
| 1251 | - ref: ref.current, | |
| 1252 | - attributes: deepReadOnly(attributes, deepReadOnlyOptions) | |
| 1253 | - }); | |
| 1254 | -}; | |
| 1255 | -var navigationContextSignal = d3(0); | |
| 1256 | -function getServerContext(namespace) { | |
| 1257 | - const scope = getScope(); | |
| 1258 | - if (true) { | |
| 1259 | - if (!scope) { | |
| 1260 | - throwNotInScope("getServerContext"); | |
| 1261 | - } | |
| 1262 | - } | |
| 1263 | - getServerContext.subscribe = navigationContextSignal.value; | |
| 1264 | - return deepClone(scope.serverContext[namespace || getNamespace()]); | |
| 1265 | -} | |
| 1266 | -getServerContext.subscribe = 0; | |
| 1267 | - | |
| 1268 | 1242 | // packages/interactivity/build-module/utils.mjs |
| 1269 | 1243 | var afterNextFrame = (callback) => { |
| 1270 | 1244 | return new Promise((resolve2) => { |
| 1271 | 1245 | const done = () => { |
| @@ -1486,37 +1460,60 @@ | ||
| 1486 | 1460 | } |
| 1487 | 1461 | return source; |
| 1488 | 1462 | } |
| 1489 | 1463 | |
| 1490 | -// packages/interactivity/build-module/hooks.mjs | |
| 1491 | -init_preact_module(); | |
| 1492 | - | |
| 1493 | -// packages/interactivity/build-module/proxies/registry.mjs | |
| 1494 | -var objToProxy = /* @__PURE__ */ new WeakMap(); | |
| 1495 | -var proxyToObj = /* @__PURE__ */ new WeakMap(); | |
| 1496 | -var proxyToNs = /* @__PURE__ */ new WeakMap(); | |
| 1497 | -var supported = /* @__PURE__ */ new Set([Object, Array]); | |
| 1498 | -var createProxy = (namespace, obj, handlers) => { | |
| 1499 | - if (!shouldProxy(obj)) { | |
| 1500 | - throw Error("This object cannot be proxified."); | |
| 1464 | +// packages/interactivity/build-module/scopes.mjs | |
| 1465 | +var scopeStack = []; | |
| 1466 | +var getScope = () => scopeStack.slice(-1)[0]; | |
| 1467 | +var setScope = (scope) => { | |
| 1468 | + scopeStack.push(scope); | |
| 1469 | +}; | |
| 1470 | +var resetScope = () => { | |
| 1471 | + scopeStack.pop(); | |
| 1472 | +}; | |
| 1473 | +var throwNotInScope = (method) => { | |
| 1474 | + throw Error( | |
| 1475 | + `Cannot call \`${method}()\` when there is no scope. If you are using an async function, please consider using a generator instead. If you are using some sort of async callbacks, like \`setTimeout\`, please wrap the callback with \`withScope(callback)\`.` | |
| 1476 | + ); | |
| 1477 | +}; | |
| 1478 | +var getContext = (namespace) => { | |
| 1479 | + const scope = getScope(); | |
| 1480 | + if (true) { | |
| 1481 | + if (!scope) { | |
| 1482 | + throwNotInScope("getContext"); | |
| 1483 | + } | |
| 1501 | 1484 | } |
| 1502 | - if (!objToProxy.has(obj)) { | |
| 1503 | - const proxy = new Proxy(obj, handlers); | |
| 1504 | - objToProxy.set(obj, proxy); | |
| 1505 | - proxyToObj.set(proxy, obj); | |
| 1506 | - proxyToNs.set(proxy, namespace); | |
| 1485 | + return scope.context[namespace || getNamespace()]; | |
| 1486 | +}; | |
| 1487 | +var getElement = () => { | |
| 1488 | + const scope = getScope(); | |
| 1489 | + let deepReadOnlyOptions = {}; | |
| 1490 | + if (true) { | |
| 1491 | + if (!scope) { | |
| 1492 | + throwNotInScope("getElement"); | |
| 1493 | + } | |
| 1494 | + deepReadOnlyOptions = { | |
| 1495 | + errorMessage: "Don't mutate the attributes from `getElement`, use `data-wp-bind` to modify the attributes of an element instead." | |
| 1496 | + }; | |
| 1507 | 1497 | } |
| 1508 | - return objToProxy.get(obj); | |
| 1498 | + const { ref, attributes } = scope; | |
| 1499 | + return Object.freeze({ | |
| 1500 | + ref: ref.current, | |
| 1501 | + attributes: deepReadOnly(attributes, deepReadOnlyOptions) | |
| 1502 | + }); | |
| 1509 | 1503 | }; |
| 1510 | -var getProxyFromObject = (obj) => objToProxy.get(obj); | |
| 1511 | -var getNamespaceFromProxy = (proxy) => proxyToNs.get(proxy); | |
| 1512 | -var shouldProxy = (candidate) => { | |
| 1513 | - if (typeof candidate !== "object" || candidate === null) { | |
| 1514 | - return false; | |
| 1504 | +var navigationContextSignal = d3(0); | |
| 1505 | +function getServerContext(namespace) { | |
| 1506 | + const scope = getScope(); | |
| 1507 | + if (true) { | |
| 1508 | + if (!scope) { | |
| 1509 | + throwNotInScope("getServerContext"); | |
| 1510 | + } | |
| 1515 | 1511 | } |
| 1516 | - return !proxyToNs.has(candidate) && supported.has(candidate.constructor); | |
| 1517 | -}; | |
| 1518 | -var getObjectFromProxy = (proxy) => proxyToObj.get(proxy); | |
| 1512 | + getServerContext.subscribe = navigationContextSignal.value; | |
| 1513 | + return deepClone(scope.serverContext[namespace || getNamespace()]); | |
| 1514 | +} | |
| 1515 | +getServerContext.subscribe = 0; | |
| 1519 | 1516 | |
| 1520 | 1517 | // packages/interactivity/build-module/proxies/signals.mjs |
| 1521 | 1518 | var NO_SCOPE = {}; |
| 1522 | 1519 | var PropSignal = class { |
| @@ -1788,9 +1785,12 @@ | ||
| 1788 | 1785 | propSignal.setPendingGetter(desc.get); |
| 1789 | 1786 | } |
| 1790 | 1787 | } |
| 1791 | 1788 | } else if (isPlainObject(source[key])) { |
| 1792 | - const targetValue = Object.getOwnPropertyDescriptor(target, key)?.value; | |
| 1789 | + const targetValue = Object.getOwnPropertyDescriptor( | |
| 1790 | + target, | |
| 1791 | + key | |
| 1792 | + )?.value; | |
| 1793 | 1793 | if (isNew || override && !isPlainObject(targetValue)) { |
| 1794 | 1794 | target[key] = {}; |
| 1795 | 1795 | if (propSignal) { |
| 1796 | 1796 | const ns = getNamespaceFromProxy(proxy); |
| @@ -2165,9 +2165,9 @@ | ||
| 2165 | 2165 | old(vnode); |
| 2166 | 2166 | } |
| 2167 | 2167 | }; |
| 2168 | 2168 | |
| 2169 | -// packages/interactivity/build-module/directives.mjs | |
| 2169 | +// packages/interactivity/build-module/directives/utils/warnings.mjs | |
| 2170 | 2170 | var warnUniqueIdWithTwoHyphens = (prefix, suffix, uniqueId) => { |
| 2171 | 2171 | if (true) { |
| 2172 | 2172 | warn( |
| 2173 | 2173 | `The usage of data-wp-${prefix}--${suffix}${uniqueId ? `--${uniqueId}` : ""} (two hyphens for unique ID) is deprecated and will stop working in WordPress 7.1. Please use data-wp-${prefix}${uniqueId ? `--${suffix}---${uniqueId}` : `---${suffix}`} (three hyphens for unique ID) from now on.` |
| @@ -2187,8 +2187,351 @@ | ||
| 2187 | 2187 | `The usage of data-wp-${wrongPrefix} is deprecated and will stop working in WordPress 7.0. Please, use data-wp-${rightPrefix} with the withSyncEvent() helper from now on.` |
| 2188 | 2188 | ); |
| 2189 | 2189 | } |
| 2190 | 2190 | }; |
| 2191 | + | |
| 2192 | +// packages/interactivity/build-module/directives/bind.mjs | |
| 2193 | +directive("bind", ({ directives: { bind }, element, evaluate }) => { | |
| 2194 | + bind.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2195 | + if (entry.uniqueId) { | |
| 2196 | + if (true) { | |
| 2197 | + warnUniqueIdNotSupported("bind", entry.uniqueId); | |
| 2198 | + } | |
| 2199 | + return; | |
| 2200 | + } | |
| 2201 | + const attribute = entry.suffix; | |
| 2202 | + let result = evaluate(entry); | |
| 2203 | + if (result === PENDING_GETTER) { | |
| 2204 | + return; | |
| 2205 | + } | |
| 2206 | + if (typeof result === "function") { | |
| 2207 | + result = result(); | |
| 2208 | + } | |
| 2209 | + element.props[attribute] = result; | |
| 2210 | + useInit(() => { | |
| 2211 | + const el = element.ref.current; | |
| 2212 | + if (attribute === "style") { | |
| 2213 | + if (typeof result === "string") { | |
| 2214 | + el.style.cssText = result; | |
| 2215 | + } | |
| 2216 | + return; | |
| 2217 | + } else if (attribute !== "width" && attribute !== "height" && attribute !== "href" && attribute !== "list" && attribute !== "form" && /* | |
| 2218 | + * The value for `tabindex` follows the parsing rules for an | |
| 2219 | + * integer. If that fails, or if the attribute isn't present, then | |
| 2220 | + * the browsers should "follow platform conventions to determine if | |
| 2221 | + * the element should be considered as a focusable area", | |
| 2222 | + * practically meaning that most elements get a default of `-1` (not | |
| 2223 | + * focusable), but several also get a default of `0` (focusable in | |
| 2224 | + * order after all elements with a positive `tabindex` value). | |
| 2225 | + * | |
| 2226 | + * @see https://html.spec.whatwg.org/#tabindex-value | |
| 2227 | + */ | |
| 2228 | + attribute !== "tabIndex" && attribute !== "download" && attribute !== "rowSpan" && attribute !== "colSpan" && attribute !== "role" && attribute !== "popover" && attribute in el) { | |
| 2229 | + try { | |
| 2230 | + el[attribute] = result === null || result === void 0 ? "" : result; | |
| 2231 | + return; | |
| 2232 | + } catch { | |
| 2233 | + } | |
| 2234 | + } | |
| 2235 | + if (result !== null && result !== void 0 && (result !== false || attribute[4] === "-")) { | |
| 2236 | + el.setAttribute( | |
| 2237 | + attribute, | |
| 2238 | + attribute === "popover" && result === true ? "" : result | |
| 2239 | + ); | |
| 2240 | + } else { | |
| 2241 | + el.removeAttribute(attribute); | |
| 2242 | + } | |
| 2243 | + }); | |
| 2244 | + }); | |
| 2245 | +}); | |
| 2246 | + | |
| 2247 | +// packages/interactivity/build-module/directives/class.mjs | |
| 2248 | +directive( | |
| 2249 | + "class", | |
| 2250 | + ({ directives: { class: classNames }, element, evaluate }) => { | |
| 2251 | + classNames.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2252 | + const className = entry.uniqueId ? `${entry.suffix}---${entry.uniqueId}` : entry.suffix; | |
| 2253 | + let result = evaluate(entry); | |
| 2254 | + if (result === PENDING_GETTER) { | |
| 2255 | + return; | |
| 2256 | + } | |
| 2257 | + if (typeof result === "function") { | |
| 2258 | + result = result(); | |
| 2259 | + } | |
| 2260 | + const currentClass = element.props.class || ""; | |
| 2261 | + const classFinder = new RegExp( | |
| 2262 | + `(^|\\s)${className}(\\s|$)`, | |
| 2263 | + "g" | |
| 2264 | + ); | |
| 2265 | + if (!result) { | |
| 2266 | + element.props.class = currentClass.replace(classFinder, " ").trim(); | |
| 2267 | + } else if (!classFinder.test(currentClass)) { | |
| 2268 | + element.props.class = currentClass ? `${currentClass} ${className}` : className; | |
| 2269 | + } | |
| 2270 | + useInit(() => { | |
| 2271 | + if (!result) { | |
| 2272 | + element.ref.current.classList.remove(className); | |
| 2273 | + } else { | |
| 2274 | + element.ref.current.classList.add(className); | |
| 2275 | + } | |
| 2276 | + }); | |
| 2277 | + }); | |
| 2278 | + } | |
| 2279 | +); | |
| 2280 | + | |
| 2281 | +// packages/interactivity/build-module/directives/context.mjs | |
| 2282 | +init_preact_module(); | |
| 2283 | +directive( | |
| 2284 | + "context", | |
| 2285 | + ({ | |
| 2286 | + directives: { context: context2 }, | |
| 2287 | + props: { children }, | |
| 2288 | + context: inheritedContext | |
| 2289 | + }) => { | |
| 2290 | + const entries = context2.filter(isDefaultDirectiveSuffix).reverse(); | |
| 2291 | + if (!entries.length) { | |
| 2292 | + if (true) { | |
| 2293 | + warn( | |
| 2294 | + "The usage of data-wp-context--unique-id (two hyphens) is not supported. To add a unique ID to the directive, please use data-wp-context---unique-id (three hyphens) instead." | |
| 2295 | + ); | |
| 2296 | + } | |
| 2297 | + return; | |
| 2298 | + } | |
| 2299 | + const { Provider } = inheritedContext; | |
| 2300 | + const { client: inheritedClient, server: inheritedServer } = x2(inheritedContext); | |
| 2301 | + const client = A2({}); | |
| 2302 | + const server = {}; | |
| 2303 | + const result = { | |
| 2304 | + client: { ...inheritedClient }, | |
| 2305 | + server: { ...inheritedServer } | |
| 2306 | + }; | |
| 2307 | + const namespaces2 = /* @__PURE__ */ new Set(); | |
| 2308 | + entries.forEach(({ value, namespace, uniqueId }) => { | |
| 2309 | + if (!isPlainObject(value)) { | |
| 2310 | + if (true) { | |
| 2311 | + warn( | |
| 2312 | + `The value of data-wp-context${uniqueId ? `---${uniqueId}` : ""} on the ${namespace} namespace must be a valid stringified JSON object.` | |
| 2313 | + ); | |
| 2314 | + } | |
| 2315 | + return; | |
| 2316 | + } | |
| 2317 | + if (!client.current[namespace]) { | |
| 2318 | + client.current[namespace] = proxifyState(namespace, {}); | |
| 2319 | + } | |
| 2320 | + deepMerge(client.current[namespace], deepClone(value), false); | |
| 2321 | + server[namespace] = value; | |
| 2322 | + namespaces2.add(namespace); | |
| 2323 | + }); | |
| 2324 | + namespaces2.forEach((namespace) => { | |
| 2325 | + result.client[namespace] = proxifyContext( | |
| 2326 | + client.current[namespace], | |
| 2327 | + inheritedClient[namespace] | |
| 2328 | + ); | |
| 2329 | + result.server[namespace] = proxifyContext( | |
| 2330 | + server[namespace], | |
| 2331 | + inheritedServer[namespace] | |
| 2332 | + ); | |
| 2333 | + }); | |
| 2334 | + return k(Provider, { value: result }, children); | |
| 2335 | + }, | |
| 2336 | + { priority: 5 } | |
| 2337 | +); | |
| 2338 | + | |
| 2339 | +// packages/interactivity/build-module/directives/each.mjs | |
| 2340 | +init_preact_module(); | |
| 2341 | +var evaluateItemKey = (inheritedValue, namespace, item, itemProp, eachKey) => { | |
| 2342 | + const clientContextWithItem = { | |
| 2343 | + ...inheritedValue.client, | |
| 2344 | + [namespace]: { | |
| 2345 | + ...inheritedValue.client[namespace], | |
| 2346 | + [itemProp]: item | |
| 2347 | + } | |
| 2348 | + }; | |
| 2349 | + const scope = { | |
| 2350 | + ...getScope(), | |
| 2351 | + context: clientContextWithItem, | |
| 2352 | + serverContext: inheritedValue.server | |
| 2353 | + }; | |
| 2354 | + return eachKey ? getEvaluate({ scope })(eachKey) : item; | |
| 2355 | +}; | |
| 2356 | +var useItemContexts = function* (inheritedValue, namespace, items, itemProp, eachKey) { | |
| 2357 | + const { current: itemContexts } = A2(/* @__PURE__ */ new Map()); | |
| 2358 | + for (const item of items) { | |
| 2359 | + const key = evaluateItemKey( | |
| 2360 | + inheritedValue, | |
| 2361 | + namespace, | |
| 2362 | + item, | |
| 2363 | + itemProp, | |
| 2364 | + eachKey | |
| 2365 | + ); | |
| 2366 | + if (!itemContexts.has(key)) { | |
| 2367 | + itemContexts.set( | |
| 2368 | + key, | |
| 2369 | + proxifyContext( | |
| 2370 | + proxifyState(namespace, { | |
| 2371 | + // Inits the item prop in the context to shadow it in case | |
| 2372 | + // it was inherited from the parent context. The actual | |
| 2373 | + // value is set in the `wp-each` directive later on. | |
| 2374 | + [itemProp]: void 0 | |
| 2375 | + }), | |
| 2376 | + inheritedValue.client[namespace] | |
| 2377 | + ) | |
| 2378 | + ); | |
| 2379 | + } | |
| 2380 | + yield [item, itemContexts.get(key), key]; | |
| 2381 | + } | |
| 2382 | +}; | |
| 2383 | +directive( | |
| 2384 | + "each", | |
| 2385 | + ({ | |
| 2386 | + directives: { each, "each-key": eachKey }, | |
| 2387 | + context: inheritedContext, | |
| 2388 | + element, | |
| 2389 | + evaluate | |
| 2390 | + }) => { | |
| 2391 | + if (element.type !== "template") { | |
| 2392 | + if (true) { | |
| 2393 | + warn( | |
| 2394 | + "The data-wp-each directive can only be used on <template> elements." | |
| 2395 | + ); | |
| 2396 | + } | |
| 2397 | + return; | |
| 2398 | + } | |
| 2399 | + const { Provider } = inheritedContext; | |
| 2400 | + const inheritedValue = x2(inheritedContext); | |
| 2401 | + const [entry] = each; | |
| 2402 | + const { namespace, suffix, uniqueId } = entry; | |
| 2403 | + if (each.length > 1) { | |
| 2404 | + if (true) { | |
| 2405 | + warn( | |
| 2406 | + "The usage of multiple data-wp-each directives on the same element is not supported. Please pick only one." | |
| 2407 | + ); | |
| 2408 | + } | |
| 2409 | + return; | |
| 2410 | + } | |
| 2411 | + if (uniqueId) { | |
| 2412 | + if (true) { | |
| 2413 | + warnUniqueIdNotSupported("each", uniqueId); | |
| 2414 | + } | |
| 2415 | + return; | |
| 2416 | + } | |
| 2417 | + let iterable = evaluate(entry); | |
| 2418 | + if (iterable === PENDING_GETTER) { | |
| 2419 | + return; | |
| 2420 | + } | |
| 2421 | + if (typeof iterable === "function") { | |
| 2422 | + iterable = iterable(); | |
| 2423 | + } | |
| 2424 | + if (typeof iterable?.[Symbol.iterator] !== "function") { | |
| 2425 | + return; | |
| 2426 | + } | |
| 2427 | + const itemProp = suffix ? kebabToCamelCase(suffix) : "item"; | |
| 2428 | + const result = []; | |
| 2429 | + const itemContexts = useItemContexts( | |
| 2430 | + inheritedValue, | |
| 2431 | + namespace, | |
| 2432 | + iterable, | |
| 2433 | + itemProp, | |
| 2434 | + eachKey?.[0] | |
| 2435 | + ); | |
| 2436 | + for (const [item, itemContext, key] of itemContexts) { | |
| 2437 | + const mergedContext = { | |
| 2438 | + client: { | |
| 2439 | + ...inheritedValue.client, | |
| 2440 | + [namespace]: itemContext | |
| 2441 | + }, | |
| 2442 | + server: { ...inheritedValue.server } | |
| 2443 | + }; | |
| 2444 | + mergedContext.client[namespace][itemProp] = item; | |
| 2445 | + result.push( | |
| 2446 | + k( | |
| 2447 | + Provider, | |
| 2448 | + { value: mergedContext, key }, | |
| 2449 | + element.props.content | |
| 2450 | + ) | |
| 2451 | + ); | |
| 2452 | + } | |
| 2453 | + return result; | |
| 2454 | + }, | |
| 2455 | + { priority: 20 } | |
| 2456 | +); | |
| 2457 | +directive( | |
| 2458 | + "each-child", | |
| 2459 | + ({ directives: { "each-child": eachChild }, element, evaluate }) => { | |
| 2460 | + const entry = eachChild.find(isDefaultDirectiveSuffix); | |
| 2461 | + if (!entry) { | |
| 2462 | + return; | |
| 2463 | + } | |
| 2464 | + const iterable = evaluate(entry); | |
| 2465 | + return iterable === PENDING_GETTER ? element : null; | |
| 2466 | + }, | |
| 2467 | + { priority: 1 } | |
| 2468 | +); | |
| 2469 | + | |
| 2470 | +// packages/interactivity/build-module/directives/ignore.mjs | |
| 2471 | +init_preact_module(); | |
| 2472 | +directive( | |
| 2473 | + "ignore", | |
| 2474 | + ({ | |
| 2475 | + element: { | |
| 2476 | + type: Type, | |
| 2477 | + props: { innerHTML, ...rest } | |
| 2478 | + } | |
| 2479 | + }) => { | |
| 2480 | + if (true) { | |
| 2481 | + warn( | |
| 2482 | + "The data-wp-ignore directive is deprecated and will be removed in version 7.0." | |
| 2483 | + ); | |
| 2484 | + } | |
| 2485 | + const cached = T2(() => innerHTML, []); | |
| 2486 | + return k(Type, { | |
| 2487 | + dangerouslySetInnerHTML: { __html: cached }, | |
| 2488 | + ...rest | |
| 2489 | + }); | |
| 2490 | + } | |
| 2491 | +); | |
| 2492 | + | |
| 2493 | +// packages/interactivity/build-module/directives/init.mjs | |
| 2494 | +directive("init", ({ directives: { init }, evaluate }) => { | |
| 2495 | + init.forEach((entry) => { | |
| 2496 | + if (true) { | |
| 2497 | + if (entry.suffix) { | |
| 2498 | + warnUniqueIdWithTwoHyphens("init", entry.suffix); | |
| 2499 | + } | |
| 2500 | + } | |
| 2501 | + useInit(() => { | |
| 2502 | + let start; | |
| 2503 | + if (true) { | |
| 2504 | + if (true) { | |
| 2505 | + start = performance.now(); | |
| 2506 | + } | |
| 2507 | + } | |
| 2508 | + let result = evaluate(entry); | |
| 2509 | + if (typeof result === "function") { | |
| 2510 | + result = result(); | |
| 2511 | + } | |
| 2512 | + if (true) { | |
| 2513 | + if (true) { | |
| 2514 | + performance.measure( | |
| 2515 | + `interactivity api init ${entry.namespace}`, | |
| 2516 | + { | |
| 2517 | + start, | |
| 2518 | + end: performance.now(), | |
| 2519 | + detail: { | |
| 2520 | + devtools: { | |
| 2521 | + track: `IA: init ${entry.namespace}` | |
| 2522 | + } | |
| 2523 | + } | |
| 2524 | + } | |
| 2525 | + ); | |
| 2526 | + } | |
| 2527 | + } | |
| 2528 | + return result; | |
| 2529 | + }); | |
| 2530 | + }); | |
| 2531 | +}); | |
| 2532 | + | |
| 2533 | +// packages/interactivity/build-module/directives/on.mjs | |
| 2191 | 2534 | function wrapEventAsync(event) { |
| 2192 | 2535 | const handler = { |
| 2193 | 2536 | get(target, prop, receiver) { |
| 2194 | 2537 | const value = target[prop]; |
| @@ -2222,27 +2565,8 @@ | ||
| 2222 | 2565 | } |
| 2223 | 2566 | }; |
| 2224 | 2567 | return new Proxy(event, handler); |
| 2225 | 2568 | } |
| 2226 | -var newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; | |
| 2227 | -var ruleClean = /\/\*[^]*?\*\/| +/g; | |
| 2228 | -var ruleNewline = /\n+/g; | |
| 2229 | -var empty = " "; | |
| 2230 | -var cssStringToObject = (val) => { | |
| 2231 | - const tree = [{}]; | |
| 2232 | - let block, left; | |
| 2233 | - while (block = newRule.exec(val.replace(ruleClean, ""))) { | |
| 2234 | - if (block[4]) { | |
| 2235 | - tree.shift(); | |
| 2236 | - } else if (block[3]) { | |
| 2237 | - left = block[3].replace(ruleNewline, empty).trim(); | |
| 2238 | - tree.unshift(tree[0][left] = tree[0][left] || {}); | |
| 2239 | - } else { | |
| 2240 | - tree[0][block[1]] = block[2].replace(ruleNewline, empty).trim(); | |
| 2241 | - } | |
| 2242 | - } | |
| 2243 | - return tree[0]; | |
| 2244 | -}; | |
| 2245 | 2569 | var getGlobalEventDirective = (type) => { |
| 2246 | 2570 | return ({ directives, evaluate }) => { |
| 2247 | 2571 | directives[`on-${type}`].filter(isNonDefaultDirectiveSuffix).forEach((entry) => { |
| 2248 | 2572 | const suffixParts = entry.suffix.split("--", 2); |
| @@ -2272,50 +2596,8 @@ | ||
| 2272 | 2596 | }); |
| 2273 | 2597 | }); |
| 2274 | 2598 | }; |
| 2275 | 2599 | }; |
| 2276 | -var evaluateItemKey = (inheritedValue, namespace, item, itemProp, eachKey) => { | |
| 2277 | - const clientContextWithItem = { | |
| 2278 | - ...inheritedValue.client, | |
| 2279 | - [namespace]: { | |
| 2280 | - ...inheritedValue.client[namespace], | |
| 2281 | - [itemProp]: item | |
| 2282 | - } | |
| 2283 | - }; | |
| 2284 | - const scope = { | |
| 2285 | - ...getScope(), | |
| 2286 | - context: clientContextWithItem, | |
| 2287 | - serverContext: inheritedValue.server | |
| 2288 | - }; | |
| 2289 | - return eachKey ? getEvaluate({ scope })(eachKey) : item; | |
| 2290 | -}; | |
| 2291 | -var useItemContexts = function* (inheritedValue, namespace, items, itemProp, eachKey) { | |
| 2292 | - const { current: itemContexts } = A2(/* @__PURE__ */ new Map()); | |
| 2293 | - for (const item of items) { | |
| 2294 | - const key = evaluateItemKey( | |
| 2295 | - inheritedValue, | |
| 2296 | - namespace, | |
| 2297 | - item, | |
| 2298 | - itemProp, | |
| 2299 | - eachKey | |
| 2300 | - ); | |
| 2301 | - if (!itemContexts.has(key)) { | |
| 2302 | - itemContexts.set( | |
| 2303 | - key, | |
| 2304 | - proxifyContext( | |
| 2305 | - proxifyState(namespace, { | |
| 2306 | - // Inits the item prop in the context to shadow it in case | |
| 2307 | - // it was inherited from the parent context. The actual | |
| 2308 | - // value is set in the `wp-each` directive later on. | |
| 2309 | - [itemProp]: void 0 | |
| 2310 | - }), | |
| 2311 | - inheritedValue.client[namespace] | |
| 2312 | - ) | |
| 2313 | - ); | |
| 2314 | - } | |
| 2315 | - yield [item, itemContexts.get(key), key]; | |
| 2316 | - } | |
| 2317 | -}; | |
| 2318 | 2600 | var getGlobalAsyncEventDirective = (type) => { |
| 2319 | 2601 | return ({ directives, evaluate }) => { |
| 2320 | 2602 | directives[`on-async-${type}`].filter(isNonDefaultDirectiveSuffix).forEach((entry) => { |
| 2321 | 2603 | if (true) { |
| @@ -2338,115 +2620,33 @@ | ||
| 2338 | 2620 | }); |
| 2339 | 2621 | }); |
| 2340 | 2622 | }; |
| 2341 | 2623 | }; |
| 2342 | -var routerRegions = /* @__PURE__ */ new Map(); | |
| 2343 | -var directives_default = () => { | |
| 2344 | - directive( | |
| 2345 | - "context", | |
| 2346 | - ({ | |
| 2347 | - directives: { context: context2 }, | |
| 2348 | - props: { children }, | |
| 2349 | - context: inheritedContext | |
| 2350 | - }) => { | |
| 2351 | - const entries = context2.filter(isDefaultDirectiveSuffix).reverse(); | |
| 2352 | - if (!entries.length) { | |
| 2353 | - if (true) { | |
| 2354 | - warn( | |
| 2355 | - "The usage of data-wp-context--unique-id (two hyphens) is not supported. To add a unique ID to the directive, please use data-wp-context---unique-id (three hyphens) instead." | |
| 2356 | - ); | |
| 2357 | - } | |
| 2358 | - return; | |
| 2359 | - } | |
| 2360 | - const { Provider } = inheritedContext; | |
| 2361 | - const { client: inheritedClient, server: inheritedServer } = x2(inheritedContext); | |
| 2362 | - const client = A2({}); | |
| 2363 | - const server = {}; | |
| 2364 | - const result = { | |
| 2365 | - client: { ...inheritedClient }, | |
| 2366 | - server: { ...inheritedServer } | |
| 2367 | - }; | |
| 2368 | - const namespaces2 = /* @__PURE__ */ new Set(); | |
| 2369 | - entries.forEach(({ value, namespace, uniqueId }) => { | |
| 2370 | - if (!isPlainObject(value)) { | |
| 2371 | - if (true) { | |
| 2372 | - warn( | |
| 2373 | - `The value of data-wp-context${uniqueId ? `---${uniqueId}` : ""} on the ${namespace} namespace must be a valid stringified JSON object.` | |
| 2374 | - ); | |
| 2375 | - } | |
| 2376 | - return; | |
| 2377 | - } | |
| 2378 | - if (!client.current[namespace]) { | |
| 2379 | - client.current[namespace] = proxifyState(namespace, {}); | |
| 2380 | - } | |
| 2381 | - deepMerge( | |
| 2382 | - client.current[namespace], | |
| 2383 | - deepClone(value), | |
| 2384 | - false | |
| 2624 | +directive("on", ({ directives: { on }, element, evaluate }) => { | |
| 2625 | + const events = /* @__PURE__ */ new Map(); | |
| 2626 | + on.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2627 | + const suffixParts = entry.suffix.split("--", 2); | |
| 2628 | + if (true) { | |
| 2629 | + if (suffixParts[1]) { | |
| 2630 | + warnUniqueIdWithTwoHyphens( | |
| 2631 | + "on", | |
| 2632 | + suffixParts[0], | |
| 2633 | + suffixParts[1] | |
| 2385 | 2634 | ); |
| 2386 | - server[namespace] = value; | |
| 2387 | - namespaces2.add(namespace); | |
| 2388 | - }); | |
| 2389 | - namespaces2.forEach((namespace) => { | |
| 2390 | - result.client[namespace] = proxifyContext( | |
| 2391 | - client.current[namespace], | |
| 2392 | - inheritedClient[namespace] | |
| 2393 | - ); | |
| 2394 | - result.server[namespace] = proxifyContext( | |
| 2395 | - server[namespace], | |
| 2396 | - inheritedServer[namespace] | |
| 2397 | - ); | |
| 2398 | - }); | |
| 2399 | - return k(Provider, { value: result }, children); | |
| 2400 | - }, | |
| 2401 | - { priority: 5 } | |
| 2402 | - ); | |
| 2403 | - directive("watch", ({ directives: { watch: watch2 }, evaluate }) => { | |
| 2404 | - watch2.forEach((entry) => { | |
| 2405 | - if (true) { | |
| 2406 | - if (entry.suffix) { | |
| 2407 | - warnUniqueIdWithTwoHyphens("watch", entry.suffix); | |
| 2408 | - } | |
| 2409 | 2635 | } |
| 2410 | - useWatch(() => { | |
| 2411 | - let start; | |
| 2412 | - if (true) { | |
| 2413 | - if (true) { | |
| 2414 | - start = performance.now(); | |
| 2415 | - } | |
| 2416 | - } | |
| 2417 | - let result = evaluate(entry); | |
| 2418 | - if (typeof result === "function") { | |
| 2419 | - result = result(); | |
| 2420 | - } | |
| 2421 | - if (true) { | |
| 2422 | - if (true) { | |
| 2423 | - performance.measure( | |
| 2424 | - `interactivity api watch ${entry.namespace}`, | |
| 2425 | - { | |
| 2426 | - start, | |
| 2427 | - end: performance.now(), | |
| 2428 | - detail: { | |
| 2429 | - devtools: { | |
| 2430 | - track: `IA: watch ${entry.namespace}` | |
| 2431 | - } | |
| 2432 | - } | |
| 2433 | - } | |
| 2434 | - ); | |
| 2435 | - } | |
| 2436 | - } | |
| 2437 | - return result; | |
| 2438 | - }); | |
| 2439 | - }); | |
| 2636 | + } | |
| 2637 | + if (!events.has(suffixParts[0])) { | |
| 2638 | + events.set(suffixParts[0], /* @__PURE__ */ new Set()); | |
| 2639 | + } | |
| 2640 | + events.get(suffixParts[0]).add(entry); | |
| 2440 | 2641 | }); |
| 2441 | - directive("init", ({ directives: { init }, evaluate }) => { | |
| 2442 | - init.forEach((entry) => { | |
| 2443 | - if (true) { | |
| 2444 | - if (entry.suffix) { | |
| 2445 | - warnUniqueIdWithTwoHyphens("init", entry.suffix); | |
| 2446 | - } | |
| 2642 | + events.forEach((entries, eventType) => { | |
| 2643 | + const existingHandler = element.props[`on${eventType}`]; | |
| 2644 | + element.props[`on${eventType}`] = (event) => { | |
| 2645 | + if (existingHandler) { | |
| 2646 | + existingHandler(event); | |
| 2447 | 2647 | } |
| 2448 | - useInit(() => { | |
| 2648 | + entries.forEach((entry) => { | |
| 2449 | 2649 | let start; |
| 2450 | 2650 | if (true) { |
| 2451 | 2651 | if (true) { |
| 2452 | 2652 | start = performance.now(); |
| @@ -2451,22 +2651,25 @@ | ||
| 2451 | 2651 | if (true) { |
| 2452 | 2652 | start = performance.now(); |
| 2453 | 2653 | } |
| 2454 | 2654 | } |
| 2455 | - let result = evaluate(entry); | |
| 2655 | + const result = evaluate(entry); | |
| 2456 | 2656 | if (typeof result === "function") { |
| 2457 | - result = result(); | |
| 2657 | + if (!result?.sync) { | |
| 2658 | + event = wrapEventAsync(event); | |
| 2659 | + } | |
| 2660 | + result(event); | |
| 2458 | 2661 | } |
| 2459 | 2662 | if (true) { |
| 2460 | 2663 | if (true) { |
| 2461 | 2664 | performance.measure( |
| 2462 | - `interactivity api init ${entry.namespace}`, | |
| 2665 | + `interactivity api on ${entry.namespace}`, | |
| 2463 | 2666 | { |
| 2464 | 2667 | start, |
| 2465 | 2668 | end: performance.now(), |
| 2466 | 2669 | detail: { |
| 2467 | 2670 | devtools: { |
| 2468 | - track: `IA: init ${entry.namespace}` | |
| 2671 | + track: `IA: on ${entry.namespace}` | |
| 2469 | 2672 | } |
| 2470 | 2673 | } |
| 2471 | 2674 | } |
| 2472 | 2675 | ); |
| @@ -2471,29 +2674,25 @@ | ||
| 2471 | 2674 | } |
| 2472 | 2675 | ); |
| 2473 | 2676 | } |
| 2474 | 2677 | } |
| 2475 | - return result; | |
| 2476 | 2678 | }); |
| 2477 | - }); | |
| 2679 | + }; | |
| 2478 | 2680 | }); |
| 2479 | - directive("on", ({ directives: { on }, element, evaluate }) => { | |
| 2681 | +}); | |
| 2682 | +directive( | |
| 2683 | + "on-async", | |
| 2684 | + ({ directives: { "on-async": onAsync }, element, evaluate }) => { | |
| 2685 | + if (true) { | |
| 2686 | + warnWithSyncEvent("on-async", "on"); | |
| 2687 | + } | |
| 2480 | 2688 | const events = /* @__PURE__ */ new Map(); |
| 2481 | - on.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2482 | - const suffixParts = entry.suffix.split("--", 2); | |
| 2483 | - if (true) { | |
| 2484 | - if (suffixParts[1]) { | |
| 2485 | - warnUniqueIdWithTwoHyphens( | |
| 2486 | - "on", | |
| 2487 | - suffixParts[0], | |
| 2488 | - suffixParts[1] | |
| 2489 | - ); | |
| 2490 | - } | |
| 2689 | + onAsync.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2690 | + const event = entry.suffix.split("--", 1)[0]; | |
| 2691 | + if (!events.has(event)) { | |
| 2692 | + events.set(event, /* @__PURE__ */ new Set()); | |
| 2491 | 2693 | } |
| 2492 | - if (!events.has(suffixParts[0])) { | |
| 2493 | - events.set(suffixParts[0], /* @__PURE__ */ new Set()); | |
| 2494 | - } | |
| 2495 | - events.get(suffixParts[0]).add(entry); | |
| 2694 | + events.get(event).add(entry); | |
| 2496 | 2695 | }); |
| 2497 | 2696 | events.forEach((entries, eventType) => { |
| 2498 | 2697 | const existingHandler = element.props[`on${eventType}`]; |
| 2499 | 2698 | element.props[`on${eventType}`] = (event) => { |
| @@ -2499,155 +2698,157 @@ | ||
| 2499 | 2698 | element.props[`on${eventType}`] = (event) => { |
| 2500 | 2699 | if (existingHandler) { |
| 2501 | 2700 | existingHandler(event); |
| 2502 | 2701 | } |
| 2503 | - entries.forEach((entry) => { | |
| 2504 | - let start; | |
| 2505 | - if (true) { | |
| 2506 | - if (true) { | |
| 2507 | - start = performance.now(); | |
| 2508 | - } | |
| 2509 | - } | |
| 2702 | + entries.forEach(async (entry) => { | |
| 2703 | + await splitTask(); | |
| 2510 | 2704 | const result = evaluate(entry); |
| 2511 | 2705 | if (typeof result === "function") { |
| 2512 | - if (!result?.sync) { | |
| 2513 | - event = wrapEventAsync(event); | |
| 2514 | - } | |
| 2515 | 2706 | result(event); |
| 2516 | 2707 | } |
| 2517 | - if (true) { | |
| 2518 | - if (true) { | |
| 2519 | - performance.measure( | |
| 2520 | - `interactivity api on ${entry.namespace}`, | |
| 2521 | - { | |
| 2522 | - start, | |
| 2523 | - end: performance.now(), | |
| 2524 | - detail: { | |
| 2525 | - devtools: { | |
| 2526 | - track: `IA: on ${entry.namespace}` | |
| 2527 | - } | |
| 2528 | - } | |
| 2529 | - } | |
| 2530 | - ); | |
| 2531 | - } | |
| 2532 | - } | |
| 2533 | 2708 | }); |
| 2534 | 2709 | }; |
| 2535 | 2710 | }); |
| 2536 | - }); | |
| 2537 | - directive( | |
| 2538 | - "on-async", | |
| 2539 | - ({ directives: { "on-async": onAsync }, element, evaluate }) => { | |
| 2711 | + } | |
| 2712 | +); | |
| 2713 | +directive("on-window", getGlobalEventDirective("window")); | |
| 2714 | +directive("on-document", getGlobalEventDirective("document")); | |
| 2715 | +directive("on-async-window", getGlobalAsyncEventDirective("window")); | |
| 2716 | +directive("on-async-document", getGlobalAsyncEventDirective("document")); | |
| 2717 | + | |
| 2718 | +// packages/interactivity/build-module/directives/router-region.mjs | |
| 2719 | +init_preact_module(); | |
| 2720 | +var routerRegions = /* @__PURE__ */ new Map(); | |
| 2721 | +directive( | |
| 2722 | + "router-region", | |
| 2723 | + ({ directives: { "router-region": routerRegion } }) => { | |
| 2724 | + const entry = routerRegion.find(isDefaultDirectiveSuffix); | |
| 2725 | + if (!entry) { | |
| 2726 | + return; | |
| 2727 | + } | |
| 2728 | + if (entry.suffix) { | |
| 2540 | 2729 | if (true) { |
| 2541 | - warnWithSyncEvent("on-async", "on"); | |
| 2730 | + warn( | |
| 2731 | + `Suffixes for the data-wp-router-region directive are not supported. Ignoring the directive with suffix "${entry.suffix}".` | |
| 2732 | + ); | |
| 2542 | 2733 | } |
| 2543 | - const events = /* @__PURE__ */ new Map(); | |
| 2544 | - onAsync.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2545 | - const event = entry.suffix.split("--", 1)[0]; | |
| 2546 | - if (!events.has(event)) { | |
| 2547 | - events.set(event, /* @__PURE__ */ new Set()); | |
| 2548 | - } | |
| 2549 | - events.get(event).add(entry); | |
| 2550 | - }); | |
| 2551 | - events.forEach((entries, eventType) => { | |
| 2552 | - const existingHandler = element.props[`on${eventType}`]; | |
| 2553 | - element.props[`on${eventType}`] = (event) => { | |
| 2554 | - if (existingHandler) { | |
| 2555 | - existingHandler(event); | |
| 2556 | - } | |
| 2557 | - entries.forEach(async (entry) => { | |
| 2558 | - await splitTask(); | |
| 2559 | - const result = evaluate(entry); | |
| 2560 | - if (typeof result === "function") { | |
| 2561 | - result(event); | |
| 2562 | - } | |
| 2563 | - }); | |
| 2564 | - }; | |
| 2565 | - }); | |
| 2734 | + return; | |
| 2566 | 2735 | } |
| 2567 | - ); | |
| 2568 | - directive("on-window", getGlobalEventDirective("window")); | |
| 2569 | - directive("on-document", getGlobalEventDirective("document")); | |
| 2570 | - directive("on-async-window", getGlobalAsyncEventDirective("window")); | |
| 2571 | - directive( | |
| 2572 | - "on-async-document", | |
| 2573 | - getGlobalAsyncEventDirective("document") | |
| 2574 | - ); | |
| 2575 | - directive( | |
| 2576 | - "class", | |
| 2577 | - ({ directives: { class: classNames }, element, evaluate }) => { | |
| 2578 | - classNames.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2579 | - const className = entry.uniqueId ? `${entry.suffix}---${entry.uniqueId}` : entry.suffix; | |
| 2580 | - let result = evaluate(entry); | |
| 2581 | - if (result === PENDING_GETTER) { | |
| 2582 | - return; | |
| 2583 | - } | |
| 2584 | - if (typeof result === "function") { | |
| 2585 | - result = result(); | |
| 2586 | - } | |
| 2587 | - const currentClass = element.props.class || ""; | |
| 2588 | - const classFinder = new RegExp( | |
| 2589 | - `(^|\\s)${className}(\\s|$)`, | |
| 2590 | - "g" | |
| 2591 | - ); | |
| 2592 | - if (!result) { | |
| 2593 | - element.props.class = currentClass.replace(classFinder, " ").trim(); | |
| 2594 | - } else if (!classFinder.test(currentClass)) { | |
| 2595 | - element.props.class = currentClass ? `${currentClass} ${className}` : className; | |
| 2596 | - } | |
| 2597 | - useInit(() => { | |
| 2598 | - if (!result) { | |
| 2599 | - element.ref.current.classList.remove(className); | |
| 2600 | - } else { | |
| 2601 | - element.ref.current.classList.add(className); | |
| 2602 | - } | |
| 2603 | - }); | |
| 2604 | - }); | |
| 2736 | + if (entry.uniqueId) { | |
| 2737 | + if (true) { | |
| 2738 | + warnUniqueIdNotSupported("router-region", entry.uniqueId); | |
| 2739 | + } | |
| 2740 | + return; | |
| 2605 | 2741 | } |
| 2606 | - ); | |
| 2607 | - directive("style", ({ directives: { style }, element, evaluate }) => { | |
| 2608 | - style.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2609 | - if (entry.uniqueId) { | |
| 2610 | - if (true) { | |
| 2611 | - warnUniqueIdNotSupported("style", entry.uniqueId); | |
| 2612 | - } | |
| 2613 | - return; | |
| 2742 | + const regionId = typeof entry.value === "string" ? entry.value : entry.value.id; | |
| 2743 | + if (!routerRegions.has(regionId)) { | |
| 2744 | + routerRegions.set(regionId, d3()); | |
| 2745 | + } | |
| 2746 | + const vdom = routerRegions.get(regionId).value; | |
| 2747 | + _2(() => { | |
| 2748 | + if (vdom && typeof vdom.type !== "string") { | |
| 2749 | + navigationContextSignal.value = navigationContextSignal.peek() + 1; | |
| 2614 | 2750 | } |
| 2615 | - const styleProp = entry.suffix; | |
| 2616 | - let result = evaluate(entry); | |
| 2617 | - if (result === PENDING_GETTER) { | |
| 2618 | - return; | |
| 2751 | + }, [vdom]); | |
| 2752 | + if (vdom && typeof vdom.type !== "string") { | |
| 2753 | + const previousScope = getScope(); | |
| 2754 | + return W(vdom, { previousScope }); | |
| 2755 | + } | |
| 2756 | + return vdom; | |
| 2757 | + }, | |
| 2758 | + { priority: 1 } | |
| 2759 | +); | |
| 2760 | + | |
| 2761 | +// packages/interactivity/build-module/directives/run.mjs | |
| 2762 | +directive("run", ({ directives: { run }, evaluate }) => { | |
| 2763 | + run.forEach((entry) => { | |
| 2764 | + if (true) { | |
| 2765 | + if (entry.suffix) { | |
| 2766 | + warnUniqueIdWithTwoHyphens("run", entry.suffix); | |
| 2619 | 2767 | } |
| 2620 | - if (typeof result === "function") { | |
| 2621 | - result = result(); | |
| 2768 | + } | |
| 2769 | + let result = evaluate(entry); | |
| 2770 | + if (typeof result === "function") { | |
| 2771 | + result = result(); | |
| 2772 | + } | |
| 2773 | + return result; | |
| 2774 | + }); | |
| 2775 | +}); | |
| 2776 | + | |
| 2777 | +// packages/interactivity/build-module/directives/style.mjs | |
| 2778 | +var newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; | |
| 2779 | +var ruleClean = /\/\*[^]*?\*\/| +/g; | |
| 2780 | +var ruleNewline = /\n+/g; | |
| 2781 | +var empty = " "; | |
| 2782 | +var cssStringToObject = (val) => { | |
| 2783 | + const tree = [{}]; | |
| 2784 | + let block, left; | |
| 2785 | + while (block = newRule.exec(val.replace(ruleClean, ""))) { | |
| 2786 | + if (block[4]) { | |
| 2787 | + tree.shift(); | |
| 2788 | + } else if (block[3]) { | |
| 2789 | + left = block[3].replace(ruleNewline, empty).trim(); | |
| 2790 | + tree.unshift(tree[0][left] = tree[0][left] || {}); | |
| 2791 | + } else { | |
| 2792 | + tree[0][block[1]] = block[2].replace(ruleNewline, empty).trim(); | |
| 2793 | + } | |
| 2794 | + } | |
| 2795 | + return tree[0]; | |
| 2796 | +}; | |
| 2797 | +directive("style", ({ directives: { style }, element, evaluate }) => { | |
| 2798 | + style.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2799 | + if (entry.uniqueId) { | |
| 2800 | + if (true) { | |
| 2801 | + warnUniqueIdNotSupported("style", entry.uniqueId); | |
| 2622 | 2802 | } |
| 2623 | - element.props.style = element.props.style || {}; | |
| 2624 | - if (typeof element.props.style === "string") { | |
| 2625 | - element.props.style = cssStringToObject(element.props.style); | |
| 2626 | - } | |
| 2803 | + return; | |
| 2804 | + } | |
| 2805 | + const styleProp = entry.suffix; | |
| 2806 | + let result = evaluate(entry); | |
| 2807 | + if (result === PENDING_GETTER) { | |
| 2808 | + return; | |
| 2809 | + } | |
| 2810 | + if (typeof result === "function") { | |
| 2811 | + result = result(); | |
| 2812 | + } | |
| 2813 | + element.props.style = element.props.style || {}; | |
| 2814 | + if (typeof element.props.style === "string") { | |
| 2815 | + element.props.style = cssStringToObject(element.props.style); | |
| 2816 | + } | |
| 2817 | + if (!result) { | |
| 2818 | + delete element.props.style[styleProp]; | |
| 2819 | + } else { | |
| 2820 | + element.props.style[styleProp] = result; | |
| 2821 | + } | |
| 2822 | + useInit(() => { | |
| 2627 | 2823 | if (!result) { |
| 2628 | - delete element.props.style[styleProp]; | |
| 2824 | + element.ref.current.style.removeProperty(styleProp); | |
| 2629 | 2825 | } else { |
| 2630 | - element.props.style[styleProp] = result; | |
| 2826 | + element.ref.current.style.setProperty(styleProp, result); | |
| 2631 | 2827 | } |
| 2632 | - useInit(() => { | |
| 2633 | - if (!result) { | |
| 2634 | - element.ref.current.style.removeProperty(styleProp); | |
| 2635 | - } else { | |
| 2636 | - element.ref.current.style.setProperty(styleProp, result); | |
| 2637 | - } | |
| 2638 | - }); | |
| 2639 | 2828 | }); |
| 2640 | 2829 | }); |
| 2641 | - directive("bind", ({ directives: { bind }, element, evaluate }) => { | |
| 2642 | - bind.filter(isNonDefaultDirectiveSuffix).forEach((entry) => { | |
| 2643 | - if (entry.uniqueId) { | |
| 2644 | - if (true) { | |
| 2645 | - warnUniqueIdNotSupported("bind", entry.uniqueId); | |
| 2646 | - } | |
| 2647 | - return; | |
| 2830 | +}); | |
| 2831 | + | |
| 2832 | +// packages/interactivity/build-module/directives/text.mjs | |
| 2833 | +directive("text", ({ directives: { text }, element, evaluate }) => { | |
| 2834 | + const entries = text.filter(isDefaultDirectiveSuffix); | |
| 2835 | + if (!entries.length) { | |
| 2836 | + if (true) { | |
| 2837 | + warn( | |
| 2838 | + "The usage of data-wp-text--suffix is not supported. Please use data-wp-text instead." | |
| 2839 | + ); | |
| 2840 | + } | |
| 2841 | + return; | |
| 2842 | + } | |
| 2843 | + entries.forEach((entry) => { | |
| 2844 | + if (entry.uniqueId) { | |
| 2845 | + if (true) { | |
| 2846 | + warnUniqueIdNotSupported("text", entry.uniqueId); | |
| 2648 | 2847 | } |
| 2649 | - const attribute = entry.suffix; | |
| 2848 | + return; | |
| 2849 | + } | |
| 2850 | + try { | |
| 2650 | 2851 | let result = evaluate(entry); |
| 2651 | 2852 | if (result === PENDING_GETTER) { |
| 2652 | 2853 | return; |
| 2653 | 2854 | } |
| @@ -2653,236 +2854,54 @@ | ||
| 2653 | 2854 | } |
| 2654 | 2855 | if (typeof result === "function") { |
| 2655 | 2856 | result = result(); |
| 2656 | 2857 | } |
| 2657 | - element.props[attribute] = result; | |
| 2658 | - useInit(() => { | |
| 2659 | - const el = element.ref.current; | |
| 2660 | - if (attribute === "style") { | |
| 2661 | - if (typeof result === "string") { | |
| 2662 | - el.style.cssText = result; | |
| 2663 | - } | |
| 2664 | - return; | |
| 2665 | - } else if (attribute !== "width" && attribute !== "height" && attribute !== "href" && attribute !== "list" && attribute !== "form" && /* | |
| 2666 | - * The value for `tabindex` follows the parsing rules for an | |
| 2667 | - * integer. If that fails, or if the attribute isn't present, then | |
| 2668 | - * the browsers should "follow platform conventions to determine if | |
| 2669 | - * the element should be considered as a focusable area", | |
| 2670 | - * practically meaning that most elements get a default of `-1` (not | |
| 2671 | - * focusable), but several also get a default of `0` (focusable in | |
| 2672 | - * order after all elements with a positive `tabindex` value). | |
| 2673 | - * | |
| 2674 | - * @see https://html.spec.whatwg.org/#tabindex-value | |
| 2675 | - */ | |
| 2676 | - attribute !== "tabIndex" && attribute !== "download" && attribute !== "rowSpan" && attribute !== "colSpan" && attribute !== "role" && attribute !== "popover" && attribute in el) { | |
| 2677 | - try { | |
| 2678 | - el[attribute] = result === null || result === void 0 ? "" : result; | |
| 2679 | - return; | |
| 2680 | - } catch { | |
| 2681 | - } | |
| 2682 | - } | |
| 2683 | - if (result !== null && result !== void 0 && (result !== false || attribute[4] === "-")) { | |
| 2684 | - el.setAttribute( | |
| 2685 | - attribute, | |
| 2686 | - attribute === "popover" && result === true ? "" : result | |
| 2687 | - ); | |
| 2688 | - } else { | |
| 2689 | - el.removeAttribute(attribute); | |
| 2690 | - } | |
| 2691 | - }); | |
| 2692 | - }); | |
| 2858 | + element.props.children = typeof result === "object" ? null : result.toString(); | |
| 2859 | + } catch { | |
| 2860 | + element.props.children = null; | |
| 2861 | + } | |
| 2693 | 2862 | }); |
| 2694 | - directive( | |
| 2695 | - "ignore", | |
| 2696 | - ({ | |
| 2697 | - element: { | |
| 2698 | - type: Type, | |
| 2699 | - props: { innerHTML, ...rest } | |
| 2863 | +}); | |
| 2864 | + | |
| 2865 | +// packages/interactivity/build-module/directives/watch.mjs | |
| 2866 | +directive("watch", ({ directives: { watch: watch2 }, evaluate }) => { | |
| 2867 | + watch2.forEach((entry) => { | |
| 2868 | + if (true) { | |
| 2869 | + if (entry.suffix) { | |
| 2870 | + warnUniqueIdWithTwoHyphens("watch", entry.suffix); | |
| 2700 | 2871 | } |
| 2701 | - }) => { | |
| 2702 | - if (true) { | |
| 2703 | - warn( | |
| 2704 | - "The data-wp-ignore directive is deprecated and will be removed in version 7.0." | |
| 2705 | - ); | |
| 2706 | - } | |
| 2707 | - const cached = T2(() => innerHTML, []); | |
| 2708 | - return k(Type, { | |
| 2709 | - dangerouslySetInnerHTML: { __html: cached }, | |
| 2710 | - ...rest | |
| 2711 | - }); | |
| 2712 | 2872 | } |
| 2713 | - ); | |
| 2714 | - directive("text", ({ directives: { text }, element, evaluate }) => { | |
| 2715 | - const entries = text.filter(isDefaultDirectiveSuffix); | |
| 2716 | - if (!entries.length) { | |
| 2873 | + useWatch(() => { | |
| 2874 | + let start; | |
| 2717 | 2875 | if (true) { |
| 2718 | - warn( | |
| 2719 | - "The usage of data-wp-text--suffix is not supported. Please use data-wp-text instead." | |
| 2720 | - ); | |
| 2721 | - } | |
| 2722 | - return; | |
| 2723 | - } | |
| 2724 | - entries.forEach((entry) => { | |
| 2725 | - if (entry.uniqueId) { | |
| 2726 | 2876 | if (true) { |
| 2727 | - warnUniqueIdNotSupported("text", entry.uniqueId); | |
| 2877 | + start = performance.now(); | |
| 2728 | 2878 | } |
| 2729 | - return; | |
| 2730 | 2879 | } |
| 2731 | - try { | |
| 2732 | - let result = evaluate(entry); | |
| 2733 | - if (result === PENDING_GETTER) { | |
| 2734 | - return; | |
| 2735 | - } | |
| 2736 | - if (typeof result === "function") { | |
| 2737 | - result = result(); | |
| 2738 | - } | |
| 2739 | - element.props.children = typeof result === "object" ? null : result.toString(); | |
| 2740 | - } catch { | |
| 2741 | - element.props.children = null; | |
| 2742 | - } | |
| 2743 | - }); | |
| 2744 | - }); | |
| 2745 | - directive("run", ({ directives: { run }, evaluate }) => { | |
| 2746 | - run.forEach((entry) => { | |
| 2747 | - if (true) { | |
| 2748 | - if (entry.suffix) { | |
| 2749 | - warnUniqueIdWithTwoHyphens("run", entry.suffix); | |
| 2750 | - } | |
| 2751 | - } | |
| 2752 | 2880 | let result = evaluate(entry); |
| 2753 | 2881 | if (typeof result === "function") { |
| 2754 | 2882 | result = result(); |
| 2755 | 2883 | } |
| 2756 | - return result; | |
| 2757 | - }); | |
| 2758 | - }); | |
| 2759 | - directive( | |
| 2760 | - "each", | |
| 2761 | - ({ | |
| 2762 | - directives: { each, "each-key": eachKey }, | |
| 2763 | - context: inheritedContext, | |
| 2764 | - element, | |
| 2765 | - evaluate | |
| 2766 | - }) => { | |
| 2767 | - if (element.type !== "template") { | |
| 2884 | + if (true) { | |
| 2768 | 2885 | if (true) { |
| 2769 | - warn( | |
| 2770 | - "The data-wp-each directive can only be used on <template> elements." | |
| 2886 | + performance.measure( | |
| 2887 | + `interactivity api watch ${entry.namespace}`, | |
| 2888 | + { | |
| 2889 | + start, | |
| 2890 | + end: performance.now(), | |
| 2891 | + detail: { | |
| 2892 | + devtools: { | |
| 2893 | + track: `IA: watch ${entry.namespace}` | |
| 2894 | + } | |
| 2895 | + } | |
| 2896 | + } | |
| 2771 | 2897 | ); |
| 2772 | 2898 | } |
| 2773 | - return; | |
| 2774 | 2899 | } |
| 2775 | - const { Provider } = inheritedContext; | |
| 2776 | - const inheritedValue = x2(inheritedContext); | |
| 2777 | - const [entry] = each; | |
| 2778 | - const { namespace, suffix, uniqueId } = entry; | |
| 2779 | - if (each.length > 1) { | |
| 2780 | - if (true) { | |
| 2781 | - warn( | |
| 2782 | - "The usage of multiple data-wp-each directives on the same element is not supported. Please pick only one." | |
| 2783 | - ); | |
| 2784 | - } | |
| 2785 | - return; | |
| 2786 | - } | |
| 2787 | - if (uniqueId) { | |
| 2788 | - if (true) { | |
| 2789 | - warnUniqueIdNotSupported("each", uniqueId); | |
| 2790 | - } | |
| 2791 | - return; | |
| 2792 | - } | |
| 2793 | - let iterable = evaluate(entry); | |
| 2794 | - if (iterable === PENDING_GETTER) { | |
| 2795 | - return; | |
| 2796 | - } | |
| 2797 | - if (typeof iterable === "function") { | |
| 2798 | - iterable = iterable(); | |
| 2799 | - } | |
| 2800 | - if (typeof iterable?.[Symbol.iterator] !== "function") { | |
| 2801 | - return; | |
| 2802 | - } | |
| 2803 | - const itemProp = suffix ? kebabToCamelCase(suffix) : "item"; | |
| 2804 | - const result = []; | |
| 2805 | - const itemContexts = useItemContexts( | |
| 2806 | - inheritedValue, | |
| 2807 | - namespace, | |
| 2808 | - iterable, | |
| 2809 | - itemProp, | |
| 2810 | - eachKey?.[0] | |
| 2811 | - ); | |
| 2812 | - for (const [item, itemContext, key] of itemContexts) { | |
| 2813 | - const mergedContext = { | |
| 2814 | - client: { | |
| 2815 | - ...inheritedValue.client, | |
| 2816 | - [namespace]: itemContext | |
| 2817 | - }, | |
| 2818 | - server: { ...inheritedValue.server } | |
| 2819 | - }; | |
| 2820 | - mergedContext.client[namespace][itemProp] = item; | |
| 2821 | - result.push( | |
| 2822 | - k( | |
| 2823 | - Provider, | |
| 2824 | - { value: mergedContext, key }, | |
| 2825 | - element.props.content | |
| 2826 | - ) | |
| 2827 | - ); | |
| 2828 | - } | |
| 2829 | 2900 | return result; |
| 2830 | - }, | |
| 2831 | - { priority: 20 } | |
| 2832 | - ); | |
| 2833 | - directive( | |
| 2834 | - "each-child", | |
| 2835 | - ({ directives: { "each-child": eachChild }, element, evaluate }) => { | |
| 2836 | - const entry = eachChild.find(isDefaultDirectiveSuffix); | |
| 2837 | - if (!entry) { | |
| 2838 | - return; | |
| 2839 | - } | |
| 2840 | - const iterable = evaluate(entry); | |
| 2841 | - return iterable === PENDING_GETTER ? element : null; | |
| 2842 | - }, | |
| 2843 | - { priority: 1 } | |
| 2844 | - ); | |
| 2845 | - directive( | |
| 2846 | - "router-region", | |
| 2847 | - ({ directives: { "router-region": routerRegion } }) => { | |
| 2848 | - const entry = routerRegion.find(isDefaultDirectiveSuffix); | |
| 2849 | - if (!entry) { | |
| 2850 | - return; | |
| 2851 | - } | |
| 2852 | - if (entry.suffix) { | |
| 2853 | - if (true) { | |
| 2854 | - warn( | |
| 2855 | - `Suffixes for the data-wp-router-region directive are not supported. Ignoring the directive with suffix "${entry.suffix}".` | |
| 2856 | - ); | |
| 2857 | - } | |
| 2858 | - return; | |
| 2859 | - } | |
| 2860 | - if (entry.uniqueId) { | |
| 2861 | - if (true) { | |
| 2862 | - warnUniqueIdNotSupported("router-region", entry.uniqueId); | |
| 2863 | - } | |
| 2864 | - return; | |
| 2865 | - } | |
| 2866 | - const regionId = typeof entry.value === "string" ? entry.value : entry.value.id; | |
| 2867 | - if (!routerRegions.has(regionId)) { | |
| 2868 | - routerRegions.set(regionId, d3()); | |
| 2869 | - } | |
| 2870 | - const vdom = routerRegions.get(regionId).value; | |
| 2871 | - _2(() => { | |
| 2872 | - if (vdom && typeof vdom.type !== "string") { | |
| 2873 | - navigationContextSignal.value = navigationContextSignal.peek() + 1; | |
| 2874 | - } | |
| 2875 | - }, [vdom]); | |
| 2876 | - if (vdom && typeof vdom.type !== "string") { | |
| 2877 | - const previousScope = getScope(); | |
| 2878 | - return W(vdom, { previousScope }); | |
| 2879 | - } | |
| 2880 | - return vdom; | |
| 2881 | - }, | |
| 2882 | - { priority: 1 } | |
| 2883 | - ); | |
| 2884 | -}; | |
| 2901 | + }); | |
| 2902 | + }); | |
| 2903 | +}); | |
| 2885 | 2904 | |
| 2886 | 2905 | // packages/interactivity/build-module/hydration.mjs |
| 2887 | 2906 | init_preact_module(); |
| 2888 | 2907 | |
| @@ -3135,9 +3154,8 @@ | ||
| 3135 | 3154 | } |
| 3136 | 3155 | throw new Error("Forbidden access."); |
| 3137 | 3156 | }; |
| 3138 | 3157 | populateServerData(parseServerData()); |
| 3139 | -directives_default(); | |
| 3140 | 3158 | onDOMReady(hydrateRegions); |
| 3141 | 3159 | window.history.replaceState( |
| 3142 | 3160 | { ...window.history.state, wpInteractivityId: sessionId }, |
| 3143 | 3161 | "" |