@nifrajs/web 5.5.1 → 5.6.0

package/dist/islands-swap.js

@@ -0,0 +1,270 @@
+/**
+ * @nifrajs/web/islands/swap - refresh one region of a server-rendered page from a plain link or form,
+ * without a full reload and without a client router.
+ *
+ *   <form action="/hotels" data-swap="replace:results"><input name="q"></form>
+ *   <ul data-swap-slot="results">...</ul>
+ *   <a href="/hotels?page=2" data-swap="append:results">More</a>
+ *
+ * The request is the one the link or form makes anyway, plus an `x-nifra-swap: <slot>` header. The
+ * server runs the page as usual and answers with that slot's HTML alone (`slot()` in
+ * `@nifrajs/web-vanilla`), so the fragment is a slice of the real page. Any other answer - a redirect,
+ * another origin, a page without that slot - loads the URL normally. Only GET requests are enhanced:
+ * a POST form submits natively, so the browser applies its response's security policy and scripts,
+ * and the form is never sent twice.
+ */
+import { mountIsland } from "./internal/island-mount.js";
+import { SWAP_HEADER } from "./render-seam.js";
+const MODE = /^(replace|append):([A-Za-z][\w-]{0,63})$/;
+const SLOTS = "[data-swap-slot]:not([data-island-ignore],[data-island-ignore] *)";
+const HISTORY_KEY = "nifraSwap";
+// A control named like a DOM method shadows it on its form (`<input name="closest">`).
+const attr = (el, name) => Element.prototype.getAttribute.call(el, name);
+const here = () => location.pathname + location.search;
+/** The slot names a history entry's swaps changed, from the first one in this tab up to it. */
+const swappedIn = (state) => {
+    const names = typeof state === "object" && state !== null ? Reflect.get(state, HISTORY_KEY) : undefined;
+    return Array.isArray(names) ? names.filter((name) => typeof name === "string") : [];
+};
+/**
+ * Mount the page's islands, as `mountIslands` does, and make every `data-swap` link and GET form under
+ * `root` refresh its slot in place. Call it instead of `mountIslands`.
+ *
+ * - `data-swap="replace:<slot>"` replaces the content of the `data-swap-slot="<slot>"` element;
+ *   `append:<slot>` adds to it, and a link or form inside that slot is spent: the slot's child holding
+ *   it is removed when the next content arrives, so a "more" link at the end of a list gives way to
+ *   the next page and its own "more" link.
+ * - A replacing GET pushes its URL, so a filtered list survives reload and can be shared; back and
+ *   forward fetch the slots again for the URL they land on.
+ * - The islands inside a slot mount with it and unmount when it is replaced.
+ * - While a slot loads it carries `aria-busy="true"`; a newer swap of the same slot cancels the
+ *   older one. When the request fails, the page stays as it is and the link or form gets
+ *   `data-swap-error`.
+ *
+ * Nothing inside a `data-island-ignore` element swaps. Returns a disposer that removes the listeners,
+ * cancels pending swaps and unmounts every island.
+ */
+export function enableSwap(
+// `never` admits an enhancer of any props type, as in `mountIslands`.
+enhancers, options = {}) {
+    const root = options.root ?? document;
+    const stops = new Map();
+    const pending = new Map();
+    let swapped = swappedIn(history.state);
+    let shown = here();
+    const islands = "[data-island]:not([data-island-ignore],[data-island-ignore] *)";
+    const attach = (scope) => {
+        const mount = (el) => {
+            const stop = mountIsland(el, enhancers);
+            if (stop !== undefined)
+                stops.set(el, stop);
+        };
+        if (scope instanceof HTMLElement && scope.matches(islands))
+            mount(scope);
+        for (const el of scope.querySelectorAll(islands))
+            if (scope.contains(el))
+                mount(el);
+    };
+    const release = (scope) => {
+        const cleanups = [];
+        for (const [node, stop] of stops)
+            if (scope.contains(node)) {
+                stops.delete(node);
+                cleanups.push(stop);
+            }
+        // Cleanup may itself detach descendants, so collect every owner before stopping any of them.
+        for (const stop of cleanups)
+            stop();
+    };
+    // The server answers with the first slot of a name in the page, so the client takes the first too.
+    const slotNamed = (name) => {
+        for (const slot of root.querySelectorAll(SLOTS))
+            if (slot.getAttribute("data-swap-slot") === name)
+                return slot;
+        return undefined;
+    };
+    const put = (slot, html, append, source) => {
+        const template = document.createElement("template");
+        // Parsed inert: scripts in it never run, as for any HTML set this way.
+        template.innerHTML = html;
+        const focused = slot.contains(document.activeElement);
+        if (append) {
+            for (const child of [...slot.children])
+                if (child === source || (source !== undefined && child.contains(source))) {
+                    release(child);
+                    slot.removeChild(child);
+                }
+            slot.append(template.content);
+        }
+        else {
+            release(slot);
+            slot.replaceChildren(template.content);
+        }
+        attach(slot);
+        if (focused && !slot.contains(document.activeElement) && slot instanceof HTMLElement) {
+            if (!slot.hasAttribute("tabindex"))
+                slot.tabIndex = -1;
+            slot.focus({ preventScroll: true });
+        }
+    };
+    const swap = async (slot, name, append, url, source) => {
+        pending.get(slot)?.abort();
+        const abort = new AbortController();
+        pending.set(slot, abort);
+        slot.setAttribute("aria-busy", "true");
+        try {
+            const response = await fetch(url, {
+                cache: "no-store",
+                headers: { [SWAP_HEADER]: name },
+                signal: abort.signal,
+                redirect: "manual",
+            });
+            const load = () => {
+                if (source === undefined)
+                    location.reload();
+                else
+                    location.assign(response.redirected ? response.url : url);
+            };
+            if (response.type !== "basic" ||
+                !response.headers.get("content-type")?.startsWith("text/html")) {
+                load();
+                return;
+            }
+            // A slot answer joins this document, so this document's CSP governs it, whatever headers the
+            // fetch carried; anything that is not one loads as its own document under its own policy.
+            if (response.headers.get(SWAP_HEADER) !== name) {
+                load();
+                return;
+            }
+            const html = await response.text();
+            if (!slot.isConnected)
+                return;
+            try {
+                put(slot, html, append, source);
+            }
+            catch {
+                // Trusted Types without a default policy refuses the HTML before the slot changes.
+                load();
+                return;
+            }
+            if (!append && source !== undefined) {
+                if (!swapped.includes(name))
+                    swapped = [...swapped, name];
+                history.pushState({ [HISTORY_KEY]: swapped }, "", url);
+                shown = url.pathname + url.search;
+            }
+        }
+        catch {
+            if (abort.signal.aborted)
+                return;
+            // Back or forward left the URL ahead of the page: show what the URL shows.
+            if (source === undefined)
+                location.reload();
+            else
+                Element.prototype.setAttribute.call(source, "data-swap-error", "");
+        }
+        finally {
+            if (pending.get(slot) === abort) {
+                pending.delete(slot);
+                slot.removeAttribute("aria-busy");
+            }
+        }
+    };
+    const start = (event, source, url) => {
+        const mode = MODE.exec(attr(source, "data-swap") ?? "");
+        const name = mode?.[2];
+        if (name === undefined ||
+            url.origin !== location.origin ||
+            Element.prototype.closest.call(source, "[data-island-ignore]") !== null)
+            return;
+        const slot = slotNamed(name);
+        if (slot === undefined)
+            return;
+        event.preventDefault();
+        Element.prototype.removeAttribute.call(source, "data-swap-error");
+        void swap(slot, name, mode?.[1] === "append", url, source);
+    };
+    const onClick = (event) => {
+        if (!(event instanceof MouseEvent) || event.defaultPrevented || event.button !== 0)
+            return;
+        if (event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)
+            return;
+        const link = event.target instanceof Element ? event.target.closest("a[data-swap]") : null;
+        if (!(link instanceof HTMLAnchorElement) || !link.hasAttribute("href"))
+            return;
+        const target = link.getAttribute("target");
+        if ((target !== null && target !== "" && target !== "_self") || link.hasAttribute("download"))
+            return;
+        const url = new URL(link.href);
+        // An in-page anchor keeps its native jump.
+        if (url.hash !== "" && url.pathname + url.search === here())
+            return;
+        start(event, link, url);
+    };
+    const onSubmit = (event) => {
+        const form = event.target;
+        if (!(event instanceof SubmitEvent) ||
+            event.defaultPrevented ||
+            !(form instanceof HTMLFormElement) ||
+            attr(form, "data-swap") === null)
+            return;
+        const submitter = event.submitter;
+        // The button that submitted can override the form's method, action, target and encoding.
+        const pick = (name) => submitter?.hasAttribute(`form${name}`)
+            ? submitter.getAttribute(`form${name}`)
+            : attr(form, name);
+        // An empty method is a GET, as for the browser.
+        const method = (pick("method") || "get").toUpperCase();
+        const target = pick("target");
+        const enctype = pick("enctype")?.toLowerCase();
+        if (method !== "GET" ||
+            (target !== null && target !== "" && target !== "_self") ||
+            enctype === "text/plain")
+            return;
+        const action = pick("action");
+        const url = new URL(action === null || action === "" ? location.href : action, document.baseURI);
+        const data = new FormData(form, submitter);
+        const fields = new URLSearchParams();
+        for (const [key, value] of data)
+            fields.append(key, typeof value === "string" ? value : value.name);
+        url.search = fields.toString();
+        start(event, form, url);
+    };
+    const onPopState = (event) => {
+        if (here() === shown)
+            return;
+        shown = here();
+        const reached = swappedIn(event.state);
+        // Every slot a swap changed between the entry left and the one reached is in the later one's list.
+        const names = new Set([...swapped, ...reached]);
+        swapped = reached;
+        const targets = [];
+        for (const name of names) {
+            const slot = slotNamed(name);
+            if (slot === undefined) {
+                location.reload();
+                return;
+            }
+            targets.push([name, slot]);
+        }
+        for (const [name, slot] of targets)
+            void swap(slot, name, false, new URL(location.href));
+    };
+    const listen = (method) => {
+        root[method]("click", onClick);
+        root[method]("submit", onSubmit);
+    };
+    attach(root);
+    listen("addEventListener");
+    window.addEventListener("popstate", onPopState);
+    return () => {
+        listen("removeEventListener");
+        window.removeEventListener("popstate", onPopState);
+        for (const abort of pending.values())
+            abort.abort();
+        for (const stop of stops.values())
+            stop();
+        stops.clear();
+    };
+}
+//# sourceMappingURL=islands-swap.js.map

package/dist/islands-swap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"islands-swap.js","sourceRoot":"","sources":["../src/islands-swap.ts"],"names":[],"mappings":"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"}

package/dist/islands.d.ts

@@ -1,21 +1,29 @@
 /**
- * @nifrajs/web/islands - the framework-agnostic islands client runtime.
+ * @nifrajs/web/islands - the islands client runtime: interactivity for server-rendered pages without a
+ * framework runtime.
  *
- * An "island" is a server-rendered `<nifra-island>` element whose interactivity is mounted by a small
- * **plain-DOM** enhancer instead of a framework runtime. On a route that opts out of full-document
- * hydration (`export const hydrate = false`), the page ships **zero** framework JS; only the island
- * bundle (this runtime + your enhancers) loads. This variant ships ~99% less client JS than full
- * React hydration on a mostly-static page - the framework runtime is the cost, and islands skip it
- * entirely here.
+ * An island is a server-rendered element marked `data-island="<id>"`. Its interactivity is mounted by
+ * an enhancer instead of hydration, so on a route with `export const hydrate = false` the page ships
+ * no framework JS; only the island bundle (this runtime + your enhancers) loads via `islandScripts`.
  *
- * Server side: render the marker with `@nifrajs/web-react`'s `<Island>` (or any framework's host element
- * `<nifra-island data-id data-strategy data-props>`). Props are JSON-encoded inline in `data-props`
- * (attribute-escaped by the framework) - no central registry, so concurrent SSR renders never share
- * state. Client side: bundle one entry that calls `mountIslands({ <id>: enhancer })` and load it via
- * the route's `islandScripts`.
+ * Two tiers, one mount:
+ *   - `defineIsland((el, props) => cleanup)` - plain DOM code. The default.
+ *   - `bindIsland(({ state, onDispose }) => handlers)` - signals the markup binds by name through a
+ *     closed set of `data-bind-*` attributes. No expression language: names only.
+ * `signal`/`computed`/`effect`, a keyed `bindList` and an async `resource` work inside either tier;
+ * whatever an enhancer creates stops when its island unmounts.
+ *
+ * Server side: `<div data-island="counter" data-island-props="${islandProps({ start: 0 })}">`, or
+ * `@nifrajs/web-react`'s `<Island>`. Optional `data-island-strategy` (`load` | `idle` | `visible` |
+ * `media`, with `data-island-media`). Props travel as JSON in the attribute - no central registry, so
+ * concurrent SSR renders never share state. Nothing inside a `data-island-ignore` element mounts or
+ * binds: render user HTML there.
  */
-import { type IslandStrategy, MAX_MEDIA_QUERY_LENGTH, scheduleTrigger } from "@nifrajs/island-trigger";
-export { type IslandStrategy, MAX_MEDIA_QUERY_LENGTH, scheduleTrigger };
+import { type Signal } from "./internal/island-signals.js";
+export { type IslandStrategy, MAX_MEDIA_QUERY_LENGTH, scheduleTrigger, } from "@nifrajs/island-trigger";
+export { type BindListOptions, bindList, type ListContainer, type ListNode, } from "./internal/island-list.js";
+export { type Resource, type ResourceState, resource } from "./internal/island-resource.js";
+export { batch, type Computed, computed, effect, type Signal, signal, untrack, } from "./internal/island-signals.js";
 /** Optional teardown an enhancer returns (remove listeners/observers); run on `dispose()`. */
 export type IslandCleanup = () => void;
 /**
@@ -26,7 +34,7 @@ export type IslandCleanup = () => void;
 export type IslandEnhancer<P = unknown> = (el: HTMLElement, props: P) => IslandCleanup | void;
 /**
  * Author a typed enhancer. Pure identity at runtime (zero cost, tree-shaken away) - its only job is
- * to pin the `data-props` shape so `el` and `props` are typed inside the body and the enhancer is
+ * to pin the props shape so `el` and `props` are typed inside the body and the enhancer is
  * assignable to `mountIslands`. Prefer this over an inline arrow whenever an island reads props:
  *
  *   const counter = defineIsland<{ start: number }>((el, props) => {
@@ -38,19 +46,73 @@ export type IslandEnhancer<P = unknown> = (el: HTMLElement, props: P) => IslandC
  *   })
  *   mountIslands({ counter })
  *
- * The props type is a contract, not a validator - `data-props` is JSON authored by your own SSR, so
- * it is trusted framing, not user input. Keep the enhancer body imperative: read the DOM, wire
- * listeners, return cleanup. No hidden reactivity to get wrong.
+ * The props type is a contract, not a validator - `data-island-props` is JSON authored by your own
+ * SSR, so it is trusted framing, not user input. Keep the enhancer body imperative: read the DOM,
+ * wire listeners, return cleanup.
  */
 export declare function defineIsland<P = unknown>(enhancer: IslandEnhancer<P>): IslandEnhancer<P>;
 /**
- * Find every `<nifra-island data-id>` under `root` (default `document`) and enhance each with the
- * matching enhancer, honoring its `data-strategy`. An island whose `id` has no enhancer is left as
- * inert SSR HTML (forward-compatible). An enhancer that throws is isolated - it never blocks the
- * others (each island is independent). Returns a disposer that cancels pending triggers and runs every
- * enhancer's cleanup (call it on soft-nav teardown; harmless if your app never navigates).
+ * Run `callback` each time the `keepAlive` page `el` renders in is hidden behind another page, just
+ * before it leaves the document. An island in a kept page stays mounted, and its timers and window
+ * listeners keep running, while the page is hidden: pause them here. Returns its removal - hand it back
+ * as part of the enhancer's cleanup. Never runs outside a kept page.
+ *
+ *   const clock = defineIsland((el) => {
+ *     let timer = setInterval(tick, 1000)
+ *     const hide = onPageHide(el, () => clearInterval(timer))
+ *     const show = onPageShow(el, () => { timer = setInterval(tick, 1000) })
+ *     return () => { hide(); show(); clearInterval(timer) }
+ *   })
+ */
+export declare function onPageHide(el: Element, callback: () => void): () => void;
+/** Run `callback` each time the `keepAlive` page `el` renders in is shown again; returns its removal. */
+export declare function onPageShow(el: Element, callback: () => void): () => void;
+/** What a `bindIsland` setup receives. */
+export interface BindIslandContext<P> {
+    /** The island's host element. */
+    readonly root: HTMLElement;
+    /** The parsed `data-island-props`, or `undefined` when absent or malformed. */
+    readonly props: P | undefined;
+    /**
+     * The signal the markup binds as `key`, seeded from `props[key]` when present, else `fallback`.
+     * Each key returns the same signal across calls.
+     */
+    state<T>(key: string, fallback: T): Signal<T>;
+    /**
+     * Run `fn` when the island unmounts - for timers, requests and listeners the setup starts. Called
+     * after the island unmounted (say, once an awaited request settles), it runs `fn` at once.
+     */
+    onDispose(fn: () => void): void;
+}
+/**
+ * The binding tier: `setup` creates the island's state and returns the event handlers its markup
+ * names; the island's `data-bind-*` attributes then bind them.
+ *
+ *   data-bind-text="count"   data-bind-show="open"   data-bind-class="active:open"
+ *   data-bind-attr="aria-expanded:open"   data-bind-value="query"   data-bind-on="click:add"
+ *
+ * Attribute values are signal and handler names, never code; an unknown name warns once and the
+ * server-rendered content stays as it is. A binding belongs to its nearest island.
+ *
+ * A setup or binding that throws stops everything the island started before the error reaches
+ * `mountIslands`. On unmount every cleanup runs; one that throws is logged and the rest still run.
+ */
+export declare function bindIsland<P = Record<string, unknown>>(setup: (ctx: BindIslandContext<P>) => Record<string, (event: Event) => void> | void): IslandEnhancer<P>;
+/**
+ * The `data-island-props` value for `props`: JSON. Emit it through an escaping renderer into a quoted
+ * attribute (`data-island-props="${...}"`): unquoted, a space in the JSON ends the value and the rest
+ * parses as attributes.
+ */
+export declare function islandProps(props: Record<string, unknown>): string;
+/**
+ * Find every `[data-island]` element under `root` (default `document`) and enhance each with the
+ * matching enhancer, honoring its `data-island-strategy`. An island whose id has no enhancer, or that
+ * is already mounted, is left alone, so calling again after a soft navigation mounts only new hosts.
+ * An enhancer that throws is isolated - it never blocks the others. Every effect, list binding and
+ * resource an enhancer creates is owned by its island. Returns a disposer that cancels pending
+ * triggers and tears down every island it mounted (call it on soft-nav teardown).
  */
-export declare function mountIslands(enhancers: Readonly<Record<string, IslandEnhancer>>, options?: {
+export declare function mountIslands(enhancers: Readonly<Record<string, IslandEnhancer<never>>>, options?: {
     readonly root?: ParentNode;
 }): () => void;
 /** Unsubscribe one bus handler; calling twice is a no-op. Also returned so an enhancer can hand it

package/dist/islands.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"islands.d.ts","sourceRoot":"","sources":["../src/islands.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EACL,KAAK,cAAc,EACnB,sBAAsB,EACtB,eAAe,EAChB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EAAE,KAAK,cAAc,EAAE,sBAAsB,EAAE,eAAe,EAAE,CAAA;AAEvE,8FAA8F;AAC9F,MAAM,MAAM,aAAa,GAAG,MAAM,IAAI,CAAA;AAEtC;;;;GAIG;AAEH,MAAM,MAAM,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,KAAK,aAAa,GAAG,IAAI,CAAA;AAE7F;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAExF;AAaD;;;;;;GAMG;AACH,wBAAgB,YAAY,CAC1B,SAAS,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,EACnD,OAAO,GAAE;IAAE,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;CAAO,GAC3C,MAAM,IAAI,CA4CZ;AAED;2CAC2C;AAC3C,MAAM,MAAM,oBAAoB,GAAG,MAAM,IAAI,CAAA;AAE7C;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,eAAe,CAC7B,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAC7D;IACH,IAAI,CAAC,CAAC,SAAS,MAAM,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;IAC9D,EAAE,CAAC,CAAC,SAAS,MAAM,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,oBAAoB,CAAA;CAChG,CA8BA"}
+{"version":3,"file":"islands.d.ts","sourceRoot":"","sources":["../src/islands.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAKH,OAAO,EAAE,KAAK,MAAM,EAAU,MAAM,8BAA8B,CAAA;AAGlE,OAAO,EACL,KAAK,cAAc,EACnB,sBAAsB,EACtB,eAAe,GAChB,MAAM,yBAAyB,CAAA;AAChC,OAAO,EACL,KAAK,eAAe,EACpB,QAAQ,EACR,KAAK,aAAa,EAClB,KAAK,QAAQ,GACd,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,aAAa,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAC3F,OAAO,EACL,KAAK,EACL,KAAK,QAAQ,EACb,QAAQ,EACR,MAAM,EACN,KAAK,MAAM,EACX,MAAM,EACN,OAAO,GACR,MAAM,8BAA8B,CAAA;AAErC,8FAA8F;AAC9F,MAAM,MAAM,aAAa,GAAG,MAAM,IAAI,CAAA;AAEtC;;;;GAIG;AAEH,MAAM,MAAM,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,KAAK,aAAa,GAAG,IAAI,CAAA;AAE7F;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAExF;AAWD;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAExE;AAED,yGAAyG;AACzG,wBAAgB,UAAU,CAAC,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAExE;AAED,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,iCAAiC;IACjC,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAA;IAC1B,+EAA+E;IAC/E,QAAQ,CAAC,KAAK,EAAE,CAAC,GAAG,SAAS,CAAA;IAC7B;;;OAGG;IACH,KAAK,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAA;IAC7C;;;OAGG;IACH,SAAS,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,IAAI,CAAA;CAChC;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACpD,KAAK,EAAE,CAAC,GAAG,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,GAAG,IAAI,GAClF,cAAc,CAAC,CAAC,CAAC,CAuCnB;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAElE;AAED;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAE1B,SAAS,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,EAC1D,OAAO,GAAE;IAAE,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;CAAO,GAC3C,MAAM,IAAI,CAWZ;AAED;2CAC2C;AAC3C,MAAM,MAAM,oBAAoB,GAAG,MAAM,IAAI,CAAA;AAE7C;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,eAAe,CAC7B,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAC7D;IACH,IAAI,CAAC,CAAC,SAAS,MAAM,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;IAC9D,EAAE,CAAC,CAAC,SAAS,MAAM,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,oBAAoB,CAAA;CAChG,CA8BA"}