npm - @coveo/atomic - Versions diffs - 3.28.0-pre.df6c8a3eb3 → 3.28.0-pre.f769419eb8 - Mend

@coveo/atomic 3.28.0-pre.df6c8a3eb3 → 3.28.0-pre.f769419eb8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (630) hide show

package/dist/cjs/{atomic-relevance-inspector.cjs.entry.js → atomic-aria-live_2.cjs.entry.js} RENAMED Viewed

@@ -3,12 +3,78 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-757bc886.js');
+const debounceUtils = require('./debounce-utils-e014935f.js');
+const utils = require('./utils-b6642872.js');
 const headless = require('@coveo/headless');
 const stencilButton = require('./stencil-button-ac56f2c3.js');
+require('./purify-85b542e2.js');
+require('./_commonjsHelpers-b3309d7b.js');
 require('./ripple-fb3f3438.js');
 require('./event-utils-9bfcf3c5.js');
 require('./stencil-button-style-ba779fe2.js');
+const AtomicAriaLive = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.regions = {};
+        this.messagesQueue = debounceUtils.buildDebouncedQueue({ delay: 500 });
+        this.regions = {};
+    }
+    onFindAriaLive({ detail: args }) {
+        if (!args.element || !this.isInSearchInterface) {
+            args.element = this.host;
+        }
+    }
+    get isInSearchInterface() {
+        let element = this.host;
+        while (element) {
+            if (element.tagName === 'ATOMIC-SEARCH-INTERFACE') {
+                return true;
+            }
+            element = element.parentElement;
+        }
+        return false;
+    }
+    connectedCallback() {
+        this.id = utils.randomID('atomic-aria-live-');
+    }
+    /**
+     * @internal
+     */
+    async updateMessage(region, message, assertive) {
+        const updateRegion = () => (this.regions = { ...this.regions, [region]: { assertive, message } });
+        if (message) {
+            this.messagesQueue.enqueue(updateRegion, region);
+        }
+        else {
+            this.messagesQueue.cancelActionIfQueued(region);
+            updateRegion();
+        }
+    }
+    /**
+     * @internal
+     */
+    async registerRegion(region, assertive) {
+        if (region in this.regions) {
+            return;
+        }
+        this.regions = { ...this.regions, [region]: { assertive, message: '' } };
+    }
+    disconnectedCallback() {
+        this.messagesQueue.clear();
+    }
+    render() {
+        return (index.h(index.Host, { key: 'c286cff55413265b1bd69ceed79bd62ef171e20e', style: {
+                position: 'absolute',
+                display: 'block',
+                height: '0',
+                overflow: 'hidden',
+                margin: '0',
+            } }, Object.entries(this.regions).map(([regionName, { assertive, message }]) => (index.h("div", { key: regionName, id: `${this.id}-${regionName}`, "aria-live": assertive ? 'assertive' : 'polite', role: "status" }, message)))));
+    }
+    get host() { return index.getElement(this); }
+};
 const atomicRelevanceInspectorCss = "/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme;\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    font-family: var(--default-font-family, var(--atomic-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n    }\n    @supports (color: color-mix(in lab, red, red)) {\n      ::placeholder {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .\\@container {\n    container-type: inline-size;\n  }\n  .pointer-events-auto {\n    pointer-events: auto;\n  }\n  .pointer-events-none {\n    pointer-events: none;\n  }\n  .collapse {\n    visibility: collapse;\n  }\n  .invisible {\n    visibility: hidden;\n  }\n  .visible {\n    visibility: visible;\n  }\n  .sr-only {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border-width: 0;\n  }\n  .absolute {\n    position: absolute;\n  }\n  .fixed {\n    position: fixed;\n  }\n  .relative {\n    position: relative;\n  }\n  .static {\n    position: static;\n  }\n  .sticky {\n    position: sticky;\n  }\n  .-top-2 {\n    top: calc(0.25rem * -2);\n  }\n  .-top-4 {\n    top: calc(0.25rem * -4);\n  }\n  .top-0 {\n    top: calc(0.25rem * 0);\n  }\n  .top-1\\/2 {\n    top: calc(1/2 * 100%);\n  }\n  .top-6 {\n    top: calc(0.25rem * 6);\n  }\n  .top-\\[4px\\] {\n    top: 4px;\n  }\n  .top-full {\n    top: 100%;\n  }\n  .top-px {\n    top: 1px;\n  }\n  .-right-2 {\n    right: calc(0.25rem * -2);\n  }\n  .right-0 {\n    right: calc(0.25rem * 0);\n  }\n  .right-2 {\n    right: calc(0.25rem * 2);\n  }\n  .right-6 {\n    right: calc(0.25rem * 6);\n  }\n  .right-12 {\n    right: calc(0.25rem * 12);\n  }\n  .right-20 {\n    right: calc(0.25rem * 20);\n  }\n  .right-px {\n    right: 1px;\n  }\n  .bottom-0 {\n    bottom: calc(0.25rem * 0);\n  }\n  .bottom-1 {\n    bottom: calc(0.25rem * 1);\n  }\n  .bottom-2 {\n    bottom: calc(0.25rem * 2);\n  }\n  .bottom-px {\n    bottom: 1px;\n  }\n  .left-0 {\n    left: calc(0.25rem * 0);\n  }\n  .left-1 {\n    left: calc(0.25rem * 1);\n  }\n  .left-2 {\n    left: calc(0.25rem * 2);\n  }\n  .left-\\[15px\\] {\n    left: 15px;\n  }\n  .isolate {\n    isolation: isolate;\n  }\n  .z-0 {\n    z-index: 0;\n  }\n  .z-1 {\n    z-index: 1;\n  }\n  .z-10 {\n    z-index: 10;\n  }\n  .z-9998 {\n    z-index: 9998;\n  }\n  .z-9999 {\n    z-index: 9999;\n  }\n  .order-last {\n    order: 9999;\n  }\n  .col-span-2 {\n    grid-column: span 2 / span 2;\n  }\n  .container {\n    width: 100%;\n  }\n  @media (width >= 1024px) {\n    .container {\n      max-width: 1024px;\n    }\n  }\n  @media (width >= 40rem) {\n    .container {\n      max-width: 40rem;\n    }\n  }\n  @media (width >= 48rem) {\n    .container {\n      max-width: 48rem;\n    }\n  }\n  @media (width >= 64rem) {\n    .container {\n      max-width: 64rem;\n    }\n  }\n  @media (width >= 80rem) {\n    .container {\n      max-width: 80rem;\n    }\n  }\n  @media (width >= 96rem) {\n    .container {\n      max-width: 96rem;\n    }\n  }\n  .m-0 {\n    margin: calc(0.25rem * 0);\n  }\n  .m-2 {\n    margin: calc(0.25rem * 2);\n  }\n  .mx-0\\.5 {\n    margin-inline: calc(0.25rem * 0.5);\n  }\n  .mx-1 {\n    margin-inline: calc(0.25rem * 1);\n  }\n  .mx-6 {\n    margin-inline: calc(0.25rem * 6);\n  }\n  .mx-16 {\n    margin-inline: calc(0.25rem * 16);\n  }\n  .mx-auto {\n    margin-inline: auto;\n  }\n  .my-2 {\n    margin-block: calc(0.25rem * 2);\n  }\n  .my-3 {\n    margin-block: calc(0.25rem * 3);\n  }\n  .my-4 {\n    margin-block: calc(0.25rem * 4);\n  }\n  .my-6 {\n    margin-block: calc(0.25rem * 6);\n  }\n  .my-auto {\n    margin-block: auto;\n  }\n  .mt-0 {\n    margin-top: calc(0.25rem * 0);\n  }\n  .mt-1 {\n    margin-top: calc(0.25rem * 1);\n  }\n  .mt-1\\.5 {\n    margin-top: calc(0.25rem * 1.5);\n  }\n  .mt-2 {\n    margin-top: calc(0.25rem * 2);\n  }\n  .mt-2\\.5 {\n    margin-top: calc(0.25rem * 2.5);\n  }\n  .mt-3 {\n    margin-top: calc(0.25rem * 3);\n  }\n  .mt-4 {\n    margin-top: calc(0.25rem * 4);\n  }\n  .mt-6 {\n    margin-top: calc(0.25rem * 6);\n  }\n  .mt-7 {\n    margin-top: calc(0.25rem * 7);\n  }\n  .mt-8 {\n    margin-top: calc(0.25rem * 8);\n  }\n  .mt-10 {\n    margin-top: calc(0.25rem * 10);\n  }\n  .mt-px {\n    margin-top: 1px;\n  }\n  .mr-0 {\n    margin-right: calc(0.25rem * 0);\n  }\n  .mr-0\\.5 {\n    margin-right: calc(0.25rem * 0.5);\n  }\n  .mr-1 {\n    margin-right: calc(0.25rem * 1);\n  }\n  .mr-1\\.5 {\n    margin-right: calc(0.25rem * 1.5);\n  }\n  .mr-2 {\n    margin-right: calc(0.25rem * 2);\n  }\n  .mr-3 {\n    margin-right: calc(0.25rem * 3);\n  }\n  .mr-6 {\n    margin-right: calc(0.25rem * 6);\n  }\n  .mb-0 {\n    margin-bottom: calc(0.25rem * 0);\n  }\n  .mb-1 {\n    margin-bottom: calc(0.25rem * 1);\n  }\n  .mb-2 {\n    margin-bottom: calc(0.25rem * 2);\n  }\n  .mb-3 {\n    margin-bottom: calc(0.25rem * 3);\n  }\n  .mb-4 {\n    margin-bottom: calc(0.25rem * 4);\n  }\n  .mb-6 {\n    margin-bottom: calc(0.25rem * 6);\n  }\n  .ml-0\\.5 {\n    margin-left: calc(0.25rem * 0.5);\n  }\n  .ml-1 {\n    margin-left: calc(0.25rem * 1);\n  }\n  .ml-2 {\n    margin-left: calc(0.25rem * 2);\n  }\n  .ml-4 {\n    margin-left: calc(0.25rem * 4);\n  }\n  .ml-6 {\n    margin-left: calc(0.25rem * 6);\n  }\n  .ml-auto {\n    margin-left: auto;\n  }\n  .box-border {\n    box-sizing: border-box;\n  }\n  .box-content {\n    box-sizing: content-box;\n  }\n  .line-clamp-1 {\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 1;\n  }\n  .line-clamp-2 {\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n  }\n  .line-clamp-3 {\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 3;\n  }\n  .line-clamp-4 {\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 4;\n  }\n  .line-clamp-none {\n    overflow: visible;\n    display: block;\n    -webkit-box-orient: horizontal;\n    -webkit-line-clamp: unset;\n  }\n  .block {\n    display: block;\n  }\n  .contents {\n    display: contents;\n  }\n  .flex {\n    display: flex;\n  }\n  .grid {\n    display: grid;\n  }\n  .hidden {\n    display: none;\n  }\n  .inline {\n    display: inline;\n  }\n  .inline-block {\n    display: inline-block;\n  }\n  .inline-flex {\n    display: inline-flex;\n  }\n  .table {\n    display: table;\n  }\n  .aspect-square {\n    aspect-ratio: 1 / 1;\n  }\n  .size-\\[27px\\] {\n    width: 27px;\n    height: 27px;\n  }\n  .h-1 {\n    height: calc(0.25rem * 1);\n  }\n  .h-2 {\n    height: calc(0.25rem * 2);\n  }\n  .h-2\\.5 {\n    height: calc(0.25rem * 2.5);\n  }\n  .h-3 {\n    height: calc(0.25rem * 3);\n  }\n  .h-4 {\n    height: calc(0.25rem * 4);\n  }\n  .h-5 {\n    height: calc(0.25rem * 5);\n  }\n  .h-5\\/6 {\n    height: calc(5/6 * 100%);\n  }\n  .h-6 {\n    height: calc(0.25rem * 6);\n  }\n  .h-7 {\n    height: calc(0.25rem * 7);\n  }\n  .h-8 {\n    height: calc(0.25rem * 8);\n  }\n  .h-9 {\n    height: calc(0.25rem * 9);\n  }\n  .h-10 {\n    height: calc(0.25rem * 10);\n  }\n  .h-12 {\n    height: calc(0.25rem * 12);\n  }\n  .h-\\[2\\.6rem\\] {\n    height: 2.6rem;\n  }\n  .h-\\[9px\\] {\n    height: 9px;\n  }\n  .h-full {\n    height: 100%;\n  }\n  .max-h-96 {\n    max-height: calc(0.25rem * 96);\n  }\n  .min-h-10 {\n    min-height: calc(0.25rem * 10);\n  }\n  .w-0\\.5 {\n    width: calc(0.25rem * 0.5);\n  }\n  .w-1 {\n    width: calc(0.25rem * 1);\n  }\n  .w-1\\/2 {\n    width: calc(1/2 * 100%);\n  }\n  .w-2 {\n    width: calc(0.25rem * 2);\n  }\n  .w-2\\.5 {\n    width: calc(0.25rem * 2.5);\n  }\n  .w-3 {\n    width: calc(0.25rem * 3);\n  }\n  .w-3\\.5 {\n    width: calc(0.25rem * 3.5);\n  }\n  .w-3\\/5 {\n    width: calc(3/5 * 100%);\n  }\n  .w-4 {\n    width: calc(0.25rem * 4);\n  }\n  .w-5 {\n    width: calc(0.25rem * 5);\n  }\n  .w-5\\/6 {\n    width: calc(5/6 * 100%);\n  }\n  .w-6 {\n    width: calc(0.25rem * 6);\n  }\n  .w-7 {\n    width: calc(0.25rem * 7);\n  }\n  .w-8 {\n    width: calc(0.25rem * 8);\n  }\n  .w-9 {\n    width: calc(0.25rem * 9);\n  }\n  .w-10 {\n    width: calc(0.25rem * 10);\n  }\n  .w-12 {\n    width: calc(0.25rem * 12);\n  }\n  .w-20 {\n    width: calc(0.25rem * 20);\n  }\n  .w-28 {\n    width: calc(0.25rem * 28);\n  }\n  .w-32 {\n    width: calc(0.25rem * 32);\n  }\n  .w-44 {\n    width: calc(0.25rem * 44);\n  }\n  .w-48 {\n    width: calc(0.25rem * 48);\n  }\n  .w-60 {\n    width: calc(0.25rem * 60);\n  }\n  .w-72 {\n    width: calc(0.25rem * 72);\n  }\n  .w-100 {\n    width: calc(0.25rem * 100);\n  }\n  .w-\\[2\\.6rem\\] {\n    width: 2.6rem;\n  }\n  .w-auto {\n    width: auto;\n  }\n  .w-fit {\n    width: fit-content;\n  }\n  .w-full {\n    width: 100%;\n  }\n  .w-max {\n    width: max-content;\n  }\n  .max-w-4\\/5 {\n    max-width: calc(4/5 * 100%);\n  }\n  .max-w-60 {\n    max-width: calc(0.25rem * 60);\n  }\n  .max-w-\\[30ch\\] {\n    max-width: 30ch;\n  }\n  .max-w-full {\n    max-width: 100%;\n  }\n  .max-w-lg {\n    max-width: 32rem;\n  }\n  .max-w-max {\n    max-width: max-content;\n  }\n  .min-w-0 {\n    min-width: calc(0.25rem * 0);\n  }\n  .min-w-10 {\n    min-width: calc(0.25rem * 10);\n  }\n  .min-w-20 {\n    min-width: calc(0.25rem * 20);\n  }\n  .min-w-24 {\n    min-width: calc(0.25rem * 24);\n  }\n  .min-w-full {\n    min-width: 100%;\n  }\n  .flex-1 {\n    flex: 1;\n  }\n  .flex-none {\n    flex: none;\n  }\n  .flex-shrink {\n    flex-shrink: 1;\n  }\n  .shrink-0 {\n    flex-shrink: 0;\n  }\n  .flex-grow {\n    flex-grow: 1;\n  }\n  .grow {\n    flex-grow: 1;\n  }\n  .basis-1\\/2 {\n    flex-basis: calc(1/2 * 100%);\n  }\n  .basis-8 {\n    flex-basis: calc(0.25rem * 8);\n  }\n  .border-collapse {\n    border-collapse: collapse;\n  }\n  .-translate-x-1\\/2 {\n    --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .translate-x-1\\/2 {\n    --tw-translate-x: calc(1/2 * 100%);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1\\/2 {\n    --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .scale-75 {\n    --tw-scale-x: 75%;\n    --tw-scale-y: 75%;\n    --tw-scale-z: 75%;\n    scale: var(--tw-scale-x) var(--tw-scale-y);\n  }\n  .scale-100 {\n    --tw-scale-x: 100%;\n    --tw-scale-y: 100%;\n    --tw-scale-z: 100%;\n    scale: var(--tw-scale-x) var(--tw-scale-y);\n  }\n  .rotate-180 {\n    rotate: 180deg;\n  }\n  .transform {\n    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n  }\n  .animate-pulse {\n    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  }\n  .animate-spin {\n    animation: spin 1s linear infinite;\n  }\n  .cursor-\\[inherit\\] {\n    cursor: inherit;\n  }\n  .cursor-pointer {\n    cursor: pointer;\n  }\n  .resize {\n    resize: both;\n  }\n  .resize-none {\n    resize: none;\n  }\n  .list-outside {\n    list-style-position: outside;\n  }\n  .list-decimal {\n    list-style-type: decimal;\n  }\n  .list-disc {\n    list-style-type: disc;\n  }\n  .list-none {\n    list-style-type: none;\n  }\n  .appearance-none {\n    appearance: none;\n  }\n  .grid-cols-\\[min-content_1fr\\] {\n    grid-template-columns: min-content 1fr;\n  }\n  .grid-cols-\\[min-content_auto\\] {\n    grid-template-columns: min-content auto;\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .flex-row {\n    flex-direction: row;\n  }\n  .flex-nowrap {\n    flex-wrap: nowrap;\n  }\n  .flex-wrap {\n    flex-wrap: wrap;\n  }\n  .place-items-center {\n    place-items: center;\n  }\n  .content-center {\n    align-content: center;\n  }\n  .items-baseline {\n    align-items: baseline;\n  }\n  .items-center {\n    align-items: center;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .justify-between {\n    justify-content: space-between;\n  }\n  .justify-center {\n    justify-content: center;\n  }\n  .justify-end {\n    justify-content: flex-end;\n  }\n  .gap-0\\.5 {\n    gap: calc(0.25rem * 0.5);\n  }\n  .gap-1 {\n    gap: calc(0.25rem * 1);\n  }\n  .gap-2 {\n    gap: calc(0.25rem * 2);\n  }\n  .gap-3 {\n    gap: calc(0.25rem * 3);\n  }\n  .gap-4 {\n    gap: calc(0.25rem * 4);\n  }\n  .gap-8 {\n    gap: calc(0.25rem * 8);\n  }\n  .gap-x-1\\.5 {\n    column-gap: calc(0.25rem * 1.5);\n  }\n  .gap-x-2 {\n    column-gap: calc(0.25rem * 2);\n  }\n  .gap-x-4 {\n    column-gap: calc(0.25rem * 4);\n  }\n  :where(.space-x-1\\.5 > :not(:last-child)) {\n    --tw-space-x-reverse: 0;\n    margin-inline-start: calc(calc(0.25rem * 1.5) * var(--tw-space-x-reverse));\n    margin-inline-end: calc(calc(0.25rem * 1.5) * calc(1 - var(--tw-space-x-reverse)));\n  }\n  .gap-y-0\\.5 {\n    row-gap: calc(0.25rem * 0.5);\n  }\n  :where(.divide-y > :not(:last-child)) {\n    --tw-divide-y-reverse: 0;\n    border-bottom-style: var(--tw-border-style);\n    border-top-style: var(--tw-border-style);\n    border-top-width: calc(1px * var(--tw-divide-y-reverse));\n    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n  }\n  :where(.divide-neutral > :not(:last-child)) {\n    border-color: var(--atomic-neutral);\n  }\n  .self-center {\n    align-self: center;\n  }\n  .self-start {\n    align-self: flex-start;\n  }\n  .truncate {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .overflow-auto {\n    overflow: auto;\n  }\n  .overflow-hidden {\n    overflow: hidden;\n  }\n  .overflow-x-auto {\n    overflow-x: auto;\n  }\n  .overflow-x-clip {\n    overflow-x: clip;\n  }\n  .overflow-x-scroll {\n    overflow-x: scroll;\n  }\n  .overflow-y-auto {\n    overflow-y: auto;\n  }\n  .overflow-y-visible {\n    overflow-y: visible;\n  }\n  .scroll-smooth {\n    scroll-behavior: smooth;\n  }\n  .rounded {\n    border-radius: var(--atomic-border-radius);\n  }\n  .rounded-full {\n    border-radius: calc(infinity * 1px);\n  }\n  .rounded-lg {\n    border-radius: var(--atomic-border-radius-lg);\n  }\n  .rounded-md {\n    border-radius: var(--atomic-border-radius-md);\n  }\n  .rounded-none {\n    border-radius: 0;\n  }\n  .rounded-sm {\n    border-radius: var(--atomic-border-radius);\n  }\n  .rounded-xl {\n    border-radius: var(--atomic-border-radius-xl);\n  }\n  .rounded-tl-none {\n    border-top-left-radius: 0;\n  }\n  .rounded-r-none {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .border-0 {\n    border-style: var(--tw-border-style);\n    border-width: 0px;\n  }\n  .border-t {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 1px;\n  }\n  .border-r {\n    border-right-style: var(--tw-border-style);\n    border-right-width: 1px;\n  }\n  .border-b {\n    border-bottom-style: var(--tw-border-style);\n    border-bottom-width: 1px;\n  }\n  .border-l {\n    border-left-style: var(--tw-border-style);\n    border-left-width: 1px;\n  }\n  .border-solid {\n    --tw-border-style: solid;\n    border-style: solid;\n  }\n  .border-neutral {\n    border-color: var(--atomic-neutral);\n  }\n  .border-neutral-dark {\n    border-color: var(--atomic-neutral-dark);\n  }\n  .border-neutral-dim {\n    border-color: var(--atomic-neutral-dim);\n  }\n  .border-primary {\n    border-color: var(--atomic-primary);\n  }\n  .border-primary-light {\n    border-color: var(--atomic-primary-light);\n  }\n  .border-t-neutral {\n    border-top-color: var(--atomic-neutral);\n  }\n  .border-b-neutral {\n    border-bottom-color: var(--atomic-neutral);\n  }\n  .border-b-neutral-dim {\n    border-bottom-color: var(--atomic-neutral-dim);\n  }\n  .border-l-neutral {\n    border-left-color: var(--atomic-neutral);\n  }\n  .border-l-neutral-dim {\n    border-left-color: var(--atomic-neutral-dim);\n  }\n  .bg-\\[\\#F1F2FF\\] {\n    background-color: #F1F2FF;\n  }\n  .bg-background {\n    background-color: var(--atomic-background);\n  }\n  .bg-error {\n    background-color: var(--atomic-error);\n  }\n  .bg-neutral {\n    background-color: var(--atomic-neutral);\n  }\n  .bg-neutral-dark {\n    background-color: var(--atomic-neutral-dark);\n  }\n  .bg-neutral-light {\n    background-color: var(--atomic-neutral-light);\n  }\n  .bg-primary {\n    background-color: var(--atomic-primary);\n  }\n  .bg-primary-background {\n    background-color: var(--atomic-primary-background);\n  }\n  .bg-transparent {\n    background-color: transparent;\n  }\n  .bg-white {\n    background-color: #fff;\n  }\n  .bg-linear-to-l {\n    --tw-gradient-position: to left;\n  }\n  @supports (background-image: linear-gradient(in lab, red, red)) {\n    .bg-linear-to-l {\n      --tw-gradient-position: to left in oklab;\n    }\n  }\n  .bg-linear-to-l {\n    background-image: linear-gradient(var(--tw-gradient-stops));\n  }\n  .bg-linear-to-r {\n    --tw-gradient-position: to right;\n  }\n  @supports (background-image: linear-gradient(in lab, red, red)) {\n    .bg-linear-to-r {\n      --tw-gradient-position: to right in oklab;\n    }\n  }\n  .bg-linear-to-r {\n    background-image: linear-gradient(var(--tw-gradient-stops));\n  }\n  .from-background\\/60 {\n    --tw-gradient-from: color-mix(in srgb, #ffffff 60%, transparent);\n  }\n  @supports (color: color-mix(in lab, red, red)) {\n    .from-background\\/60 {\n      --tw-gradient-from: color-mix(in oklab, var(--atomic-background) 60%, transparent);\n    }\n  }\n  .from-background\\/60 {\n    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n  }\n  .fill-current {\n    fill: currentcolor;\n  }\n  .stroke-\\[1\\.25\\] {\n    stroke-width: 1.25;\n  }\n  .p-0 {\n    padding: calc(0.25rem * 0);\n  }\n  .p-1 {\n    padding: calc(0.25rem * 1);\n  }\n  .p-2 {\n    padding: calc(0.25rem * 2);\n  }\n  .p-2\\.5 {\n    padding: calc(0.25rem * 2.5);\n  }\n  .p-3 {\n    padding: calc(0.25rem * 3);\n  }\n  .p-3\\.5 {\n    padding: calc(0.25rem * 3.5);\n  }\n  .p-4 {\n    padding: calc(0.25rem * 4);\n  }\n  .p-6 {\n    padding: calc(0.25rem * 6);\n  }\n  .p-7 {\n    padding: calc(0.25rem * 7);\n  }\n  .p-8 {\n    padding: calc(0.25rem * 8);\n  }\n  .px-1 {\n    padding-inline: calc(0.25rem * 1);\n  }\n  .px-2 {\n    padding-inline: calc(0.25rem * 2);\n  }\n  .px-2\\.5 {\n    padding-inline: calc(0.25rem * 2.5);\n  }\n  .px-3 {\n    padding-inline: calc(0.25rem * 3);\n  }\n  .px-4 {\n    padding-inline: calc(0.25rem * 4);\n  }\n  .px-6 {\n    padding-inline: calc(0.25rem * 6);\n  }\n  .px-9 {\n    padding-inline: calc(0.25rem * 9);\n  }\n  .py-0\\.5 {\n    padding-block: calc(0.25rem * 0.5);\n  }\n  .py-1 {\n    padding-block: calc(0.25rem * 1);\n  }\n  .py-1\\.5 {\n    padding-block: calc(0.25rem * 1.5);\n  }\n  .py-2 {\n    padding-block: calc(0.25rem * 2);\n  }\n  .py-2\\.5 {\n    padding-block: calc(0.25rem * 2.5);\n  }\n  .py-3 {\n    padding-block: calc(0.25rem * 3);\n  }\n  .py-3\\.5 {\n    padding-block: calc(0.25rem * 3.5);\n  }\n  .py-4 {\n    padding-block: calc(0.25rem * 4);\n  }\n  .py-5 {\n    padding-block: calc(0.25rem * 5);\n  }\n  .pt-0\\.5 {\n    padding-top: calc(0.25rem * 0.5);\n  }\n  .pt-8 {\n    padding-top: calc(0.25rem * 8);\n  }\n  .pr-2 {\n    padding-right: calc(0.25rem * 2);\n  }\n  .pr-6 {\n    padding-right: calc(0.25rem * 6);\n  }\n  .pr-24 {\n    padding-right: calc(0.25rem * 24);\n  }\n  .pb-1 {\n    padding-bottom: calc(0.25rem * 1);\n  }\n  .pb-3 {\n    padding-bottom: calc(0.25rem * 3);\n  }\n  .pb-4 {\n    padding-bottom: calc(0.25rem * 4);\n  }\n  .pb-6 {\n    padding-bottom: calc(0.25rem * 6);\n  }\n  .pl-0 {\n    padding-left: calc(0.25rem * 0);\n  }\n  .pl-1 {\n    padding-left: calc(0.25rem * 1);\n  }\n  .pl-3 {\n    padding-left: calc(0.25rem * 3);\n  }\n  .pl-7 {\n    padding-left: calc(0.25rem * 7);\n  }\n  .pl-9 {\n    padding-left: calc(0.25rem * 9);\n  }\n  .pl-10 {\n    padding-left: calc(0.25rem * 10);\n  }\n  .text-center {\n    text-align: center;\n  }\n  .text-left {\n    text-align: left;\n  }\n  .align-baseline {\n    vertical-align: baseline;\n  }\n  .align-bottom {\n    vertical-align: bottom;\n  }\n  .align-middle {\n    vertical-align: middle;\n  }\n  .font-sans {\n    font-family: var(--atomic-font-family);\n  }\n  .text-2xl {\n    font-size: var(--atomic-text-2xl);\n    line-height: var(--tw-leading, calc(2 / 1.5));\n  }\n  .text-base {\n    font-size: var(--atomic-text-base);\n    line-height: var(--tw-leading, calc(1.5 / 1));\n  }\n  .text-lg {\n    font-size: var(--atomic-text-lg);\n    line-height: var(--tw-leading, calc(1.75 / 1.125));\n  }\n  .text-sm {\n    font-size: var(--atomic-text-sm);\n    line-height: var(--tw-leading, calc(1.25 / 0.875));\n  }\n  .text-xl {\n    font-size: var(--atomic-text-xl);\n    line-height: var(--tw-leading, calc(1.75 / 1.25));\n  }\n  .text-xs {\n    font-size: 0.75rem;\n    line-height: var(--tw-leading, calc(1 / 0.75));\n  }\n  .text-xs\\/\\[1rem\\] {\n    font-size: 0.75rem;\n    line-height: 1rem;\n  }\n  .leading-4 {\n    --tw-leading: calc(0.25rem * 4);\n    line-height: calc(0.25rem * 4);\n  }\n  .leading-5 {\n    --tw-leading: calc(0.25rem * 5);\n    line-height: calc(0.25rem * 5);\n  }\n  .leading-6 {\n    --tw-leading: calc(0.25rem * 6);\n    line-height: calc(0.25rem * 6);\n  }\n  .leading-8 {\n    --tw-leading: calc(0.25rem * 8);\n    line-height: calc(0.25rem * 8);\n  }\n  .leading-10 {\n    --tw-leading: calc(0.25rem * 10);\n    line-height: calc(0.25rem * 10);\n  }\n  .leading-\\[calc\\(1\\/\\.75\\)\\] {\n    --tw-leading: calc(1 / .75);\n    line-height: calc(1 / .75);\n  }\n  .font-bold {\n    --tw-font-weight: var(--atomic-font-bold);\n    font-weight: var(--atomic-font-bold);\n  }\n  .font-light {\n    --tw-font-weight: 300;\n    font-weight: 300;\n  }\n  .font-medium {\n    --tw-font-weight: 500;\n    font-weight: 500;\n  }\n  .font-normal {\n    --tw-font-weight: var(--atomic-font-normal);\n    font-weight: var(--atomic-font-normal);\n  }\n  .font-semibold {\n    --tw-font-weight: 600;\n    font-weight: 600;\n  }\n  .break-words {\n    overflow-wrap: break-word;\n  }\n  .break-all {\n    word-break: break-all;\n  }\n  .break-keep {\n    word-break: keep-all;\n  }\n  .text-ellipsis {\n    text-overflow: ellipsis;\n  }\n  .whitespace-normal {\n    white-space: normal;\n  }\n  .whitespace-nowrap {\n    white-space: nowrap;\n  }\n  .whitespace-pre-wrap {\n    white-space: pre-wrap;\n  }\n  .text-\\[\\#54698D\\] {\n    color: #54698D;\n  }\n  .text-\\[inherit\\] {\n    color: inherit;\n  }\n  .text-black {\n    color: #000;\n  }\n  .text-error {\n    color: var(--atomic-error);\n  }\n  .text-inline-code {\n    color: var(--atomic-inline-code);\n  }\n  .text-neutral {\n    color: var(--atomic-neutral);\n  }\n  .text-neutral-dark {\n    color: var(--atomic-neutral-dark);\n  }\n  .text-on-background {\n    color: var(--atomic-on-background);\n  }\n  .text-on-primary {\n    color: var(--atomic-on-primary);\n  }\n  .text-primary {\n    color: var(--atomic-primary);\n  }\n  .text-primary-light {\n    color: var(--atomic-primary-light);\n  }\n  .text-success {\n    color: var(--atomic-success);\n  }\n  .text-transparent {\n    color: transparent;\n  }\n  .capitalize {\n    text-transform: capitalize;\n  }\n  .lowercase {\n    text-transform: lowercase;\n  }\n  .italic {\n    font-style: italic;\n  }\n  .line-through {\n    text-decoration-line: line-through;\n  }\n  .placeholder-neutral-dark::placeholder {\n    color: var(--atomic-neutral-dark);\n  }\n  .opacity-0 {\n    opacity: 0%;\n  }\n  .opacity-50 {\n    opacity: 50%;\n  }\n  .opacity-80 {\n    opacity: 80%;\n  }\n  .shadow {\n    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .shadow-inner-primary {\n    --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--atomic-primary));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .shadow-lg {\n    --tw-shadow: 0px 2px 8px var(--tw-shadow-color, rgba(229, 232, 232, 0.75));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .shadow-sm {\n    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .shadow-t-lg {\n    --tw-shadow: 0px -2px 8px var(--tw-shadow-color, rgba(229, 232, 232, 0.75));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .ring {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .ring-1 {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .ring-3 {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .ring-primary {\n    --tw-ring-color: var(--atomic-primary);\n  }\n  .ring-primary-light {\n    --tw-ring-color: var(--atomic-primary-light);\n  }\n  .ring-ring-primary {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .outline-error {\n    outline-color: var(--atomic-error);\n  }\n  .outline-neutral {\n    outline-color: var(--atomic-neutral);\n  }\n  .outline-primary {\n    outline-color: var(--atomic-primary);\n  }\n  .blur {\n    --tw-blur: blur(8px);\n    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n  }\n  .invert {\n    --tw-invert: invert(100%);\n    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n  }\n  .filter {\n    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n  }\n  .transition {\n    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n  }\n  .transition-\\[visibility\\] {\n    transition-property: visibility;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n  }\n  .transition-all {\n    transition-property: all;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n  }\n  .transition-opacity {\n    transition-property: opacity;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n  }\n  .duration-200 {\n    --tw-duration: 200ms;\n    transition-duration: 200ms;\n  }\n  .duration-300 {\n    --tw-duration: 300ms;\n    transition-duration: 300ms;\n  }\n  .ease-in-out {\n    --tw-ease: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  }\n  @media (hover: hover) {\n    .group-hover\\:visible:is(:where(.group):hover *) {\n      visibility: visible;\n    }\n  }\n  @media (hover: hover) {\n    .group-hover\\:text-error:is(:where(.group):hover *) {\n      color: var(--atomic-error);\n    }\n  }\n  @media (hover: hover) {\n    .group-hover\\:text-primary:is(:where(.group):hover *) {\n      color: var(--atomic-primary);\n    }\n  }\n  @media (hover: hover) {\n    .group-hover\\:text-primary-light:is(:where(.group):hover *) {\n      color: var(--atomic-primary-light);\n    }\n  }\n  .group-focus\\:text-primary:is(:where(.group):focus *) {\n    color: var(--atomic-primary);\n  }\n  .group-focus\\:text-primary-light:is(:where(.group):focus *) {\n    color: var(--atomic-primary-light);\n  }\n  .group-focus-visible\\:text-error:is(:where(.group):focus-visible *) {\n    color: var(--atomic-error);\n  }\n  .group-focus-visible\\:text-primary:is(:where(.group):focus-visible *) {\n    color: var(--atomic-primary);\n  }\n  @media (hover: hover) {\n    .peer-hover\\:text-error:is(:where(.peer):hover ~ *) {\n      color: var(--atomic-error);\n    }\n  }\n  .after\\:absolute::after {\n    content: var(--tw-content);\n    position: absolute;\n  }\n  .after\\:-bottom-0\\.5::after {\n    content: var(--tw-content);\n    bottom: calc(0.25rem * -0.5);\n  }\n  .after\\:block::after {\n    content: var(--tw-content);\n    display: block;\n  }\n  .after\\:h-1::after {\n    content: var(--tw-content);\n    height: calc(0.25rem * 1);\n  }\n  .after\\:w-full::after {\n    content: var(--tw-content);\n    width: 100%;\n  }\n  .after\\:rounded::after {\n    content: var(--tw-content);\n    border-radius: var(--atomic-border-radius);\n  }\n  .after\\:bg-primary::after {\n    content: var(--tw-content);\n    background-color: var(--atomic-primary);\n  }\n  .focus-within\\:border-disabled:focus-within {\n    border-color: var(--atomic-disabled);\n  }\n  .focus-within\\:border-primary:focus-within {\n    border-color: var(--atomic-primary);\n  }\n  .focus-within\\:ring-3:focus-within {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .focus-within\\:ring-neutral:focus-within {\n    --tw-ring-color: var(--atomic-neutral);\n  }\n  .focus-within\\:ring-ring-primary:focus-within {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  @media (hover: hover) {\n    .hover\\:border:hover {\n      border-style: var(--tw-border-style);\n      border-width: 1px;\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:border-error:hover {\n      border-color: var(--atomic-error);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:border-primary-light:hover {\n      border-color: var(--atomic-primary-light);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:bg-error:hover {\n      background-color: var(--atomic-error);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:bg-neutral-light:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:bg-primary-light:hover {\n      background-color: var(--atomic-primary-light);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:bg-transparent:hover {\n      background-color: transparent;\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:fill-white:hover {\n      fill: #fff;\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:text-primary-light:hover {\n      color: var(--atomic-primary-light);\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:underline:hover {\n      text-decoration-line: underline;\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:opacity-100:hover {\n      opacity: 100%;\n    }\n  }\n  @media (hover: hover) {\n    .hover\\:shadow-sm:hover {\n      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n    }\n  }\n  .focus\\:opacity-100:focus {\n    opacity: 100%;\n  }\n  .focus\\:outline-hidden:focus {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  @media (forced-colors: active) {\n    .focus\\:outline-hidden:focus {\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n    }\n  }\n  .focus-visible\\:border:focus-visible {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .focus-visible\\:border-error:focus-visible {\n    border-color: var(--atomic-error);\n  }\n  .focus-visible\\:border-primary:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .focus-visible\\:border-primary-light:focus-visible {\n    border-color: var(--atomic-primary-light);\n  }\n  .focus-visible\\:bg-error:focus-visible {\n    background-color: var(--atomic-error);\n  }\n  .focus-visible\\:bg-neutral-light:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .focus-visible\\:bg-primary-light:focus-visible {\n    background-color: var(--atomic-primary-light);\n  }\n  .focus-visible\\:text-primary-light:focus-visible {\n    color: var(--atomic-primary-light);\n  }\n  .focus-visible\\:underline:focus-visible {\n    text-decoration-line: underline;\n  }\n  .focus-visible\\:ring-2:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .focus-visible\\:outline-none:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  @media (width >= 40rem) {\n    .sm\\:px-6 {\n      padding-inline: calc(0.25rem * 6);\n    }\n  }\n  .\\[part\\=\\\"breadcrumb-button\\\"\\]\\:visible:is(part=\"breadcrumb-button\") {\n    visibility: visible;\n  }\n}\n@layer theme, base, components, utilities;\n@layer components {\n  .input-primary {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n  }\n  @media (hover: hover) {\n    .input-primary:hover {\n      border-color: var(--atomic-primary-light);\n    }\n  }\n  .input-primary:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .input-primary:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .input-primary:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .input-primary:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-radio {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n  }\n  .btn-radio::before {\n    content: var(--tw-content);\n    --tw-content: attr(value);\n    content: var(--tw-content);\n  }\n  .btn-primary {\n    border-radius: var(--atomic-border-radius);\n    background-color: var(--atomic-primary);\n    color: var(--atomic-on-primary);\n  }\n  @media (hover: hover) {\n    .btn-primary:hover {\n      background-color: var(--atomic-primary-light);\n    }\n  }\n  .btn-primary:focus-visible {\n    background-color: var(--atomic-primary-light);\n  }\n  .btn-primary:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-primary:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-primary:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-primary:disabled {\n    cursor: not-allowed;\n  }\n  .btn-primary:disabled {\n    background-color: var(--atomic-disabled);\n  }\n  .btn-outline-primary {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-primary);\n  }\n  @media (hover: hover) {\n    .btn-outline-primary:hover {\n      border-color: var(--atomic-primary-light);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-primary:hover {\n      color: var(--atomic-primary-light);\n    }\n  }\n  .btn-outline-primary:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .btn-outline-primary:focus-visible {\n    color: var(--atomic-primary);\n  }\n  .btn-outline-primary:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-outline-primary:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-outline-primary:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-primary:disabled {\n    cursor: not-allowed;\n  }\n  .btn-outline-primary:disabled {\n    border-color: var(--atomic-neutral);\n  }\n  .btn-outline-primary:disabled {\n    color: var(--atomic-neutral);\n  }\n  .btn-text-primary {\n    border-radius: var(--atomic-border-radius);\n    background-color: var(--atomic-background);\n    color: var(--atomic-primary);\n  }\n  @media (hover: hover) {\n    .btn-text-primary:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  .btn-text-primary:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .btn-text-primary:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-neutral {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-outline-neutral:hover {\n      border-color: var(--atomic-primary);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-neutral:hover {\n      color: var(--atomic-primary);\n    }\n  }\n  .btn-outline-neutral:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .btn-outline-neutral:focus-visible {\n    color: var(--atomic-primary);\n  }\n  .btn-outline-neutral:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-outline-neutral:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-outline-neutral:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-neutral:disabled {\n    cursor: not-allowed;\n  }\n  .btn-outline-neutral:disabled {\n    border-color: var(--atomic-neutral);\n  }\n  .btn-outline-neutral:disabled {\n    color: var(--atomic-on-background);\n  }\n  .btn-outline-neutral:disabled {\n    opacity: 50%;\n  }\n  .btn-outline-bg-neutral {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-neutral:hover {\n      border-color: var(--atomic-primary);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-neutral:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-neutral:hover {\n      color: var(--atomic-primary);\n    }\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    color: var(--atomic-primary);\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-outline-bg-neutral:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-bg-neutral:disabled {\n    cursor: not-allowed;\n  }\n  .btn-outline-bg-neutral:disabled {\n    border-color: var(--atomic-neutral);\n  }\n  .btn-outline-bg-neutral:disabled {\n    color: var(--atomic-on-background);\n  }\n  .btn-outline-bg-neutral:disabled {\n    opacity: 50%;\n  }\n  .btn-outline-bg-error {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-error:hover {\n      border-color: var(--atomic-primary);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-error:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-bg-error:hover {\n      color: var(--atomic-primary);\n    }\n  }\n  .btn-outline-bg-error:focus-visible {\n    border-color: var(--atomic-primary);\n  }\n  .btn-outline-bg-error:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .btn-outline-bg-error:focus-visible {\n    color: var(--atomic-primary);\n  }\n  .btn-outline-bg-error:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-outline-bg-error:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-outline-bg-error:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-bg-error:disabled {\n    cursor: not-allowed;\n  }\n  .btn-outline-bg-error:disabled {\n    border-color: var(--atomic-neutral);\n  }\n  .btn-outline-bg-error:disabled {\n    color: var(--atomic-on-background);\n  }\n  .btn-outline-bg-error:disabled {\n    opacity: 50%;\n  }\n  .btn-outline-error {\n    border-radius: var(--atomic-border-radius);\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-outline-error:hover {\n      border-color: var(--atomic-error);\n    }\n  }\n  @media (hover: hover) {\n    .btn-outline-error:hover {\n      color: var(--atomic-error);\n    }\n  }\n  .btn-outline-error:focus-visible {\n    border-color: var(--atomic-error);\n  }\n  .btn-outline-error:focus-visible {\n    color: var(--atomic-error);\n  }\n  .btn-outline-error:focus-visible {\n    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .btn-outline-error:focus-visible {\n    --tw-ring-color: var(--atomic-ring-primary);\n  }\n  .btn-outline-error:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-outline-error:disabled {\n    cursor: not-allowed;\n  }\n  .btn-outline-error:disabled {\n    border-color: var(--atomic-neutral);\n  }\n  .btn-outline-error:disabled {\n    color: var(--atomic-on-background);\n  }\n  .btn-outline-error:disabled {\n    opacity: 50%;\n  }\n  .btn-text-neutral {\n    border-radius: var(--atomic-border-radius);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-text-neutral:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  @media (hover: hover) {\n    .btn-text-neutral:hover {\n      color: var(--atomic-primary);\n    }\n  }\n  .btn-text-neutral:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .btn-text-neutral:focus-visible {\n    color: var(--atomic-primary);\n  }\n  .btn-text-neutral:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-text-transparent {\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-text-transparent:hover {\n      color: var(--atomic-primary-light);\n    }\n  }\n  .btn-text-transparent:focus-visible {\n    color: var(--atomic-primary-light);\n  }\n  .btn-square-neutral {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n    border-color: var(--atomic-neutral);\n    background-color: var(--atomic-background);\n    color: var(--atomic-on-background);\n  }\n  @media (hover: hover) {\n    .btn-square-neutral:hover {\n      background-color: var(--atomic-neutral-light);\n    }\n  }\n  .btn-square-neutral:focus-visible {\n    background-color: var(--atomic-neutral-light);\n  }\n  .btn-square-neutral:focus-visible {\n    --tw-outline-style: none;\n    outline-style: none;\n  }\n  .btn-page {\n    display: grid;\n    height: calc(0.25rem * 10);\n    width: calc(0.25rem * 10);\n    place-items: center;\n    border-style: var(--tw-border-style);\n    border-width: 0px;\n    font-size: var(--atomic-text-lg);\n    line-height: var(--tw-leading, calc(1.75 / 1.125));\n  }\n  @media (hover: hover) {\n    .btn-page:hover {\n      border-style: var(--tw-border-style);\n      border-width: 1px;\n    }\n  }\n  .btn-page:focus-visible {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .btn-page.selected {\n    border-style: var(--tw-border-style);\n    border-width: 2px;\n    border-color: var(--atomic-primary);\n    --tw-font-weight: var(--atomic-font-bold);\n    font-weight: var(--atomic-font-bold);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    border-color: oklch(0.928 0.006 264.531);\n  }\n  :host {\n    display: block;\n  }\n  :host, button, input, select {\n    font-family: var(--atomic-font-family);\n    font-size: var(--atomic-text-base);\n    line-height: var(--tw-leading, calc(1.5 / 1));\n    --tw-font-weight: var(--atomic-font-normal);\n    font-weight: var(--atomic-font-normal);\n  }\n  button {\n    cursor: pointer;\n  }\n  :host(.atomic-hidden) {\n    display: none;\n  }\n  .ripple {\n    position: absolute;\n    pointer-events: none;\n    transform: scale(0);\n    border-radius: 50%;\n    animation: ripple var(--animation-duration) linear;\n  }\n  .ripple-relative {\n    position: relative;\n  }\n  .ripple-parent {\n    overflow: hidden;\n  }\n  @keyframes ripple {\n    to {\n      transform: scale(4);\n      opacity: 0;\n    }\n  }\n}\n@keyframes scaleUp {\n  0% {\n    transform: scale(0.7) translateY(150vh);\n    opacity: 0.7;\n  }\n  100% {\n    transform: scale(1) translateY(0px);\n    opacity: 1;\n  }\n}\n@keyframes slideDown {\n  0% {\n    transform: translateY(0px);\n    opacity: 1;\n  }\n  100% {\n    transform: translateY(150vh);\n    opacity: 0.7;\n  }\n}\n@property --tw-translate-x {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-y {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-z {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-scale-x {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 1;\n}\n@property --tw-scale-y {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 1;\n}\n@property --tw-scale-z {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 1;\n}\n@property --tw-rotate-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-z {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-space-x-reverse {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-divide-y-reverse {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-gradient-position {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-gradient-from {\n  syntax: \"<color>\";\n  inherits: false;\n  initial-value: #0000;\n}\n@property --tw-gradient-via {\n  syntax: \"<color>\";\n  inherits: false;\n  initial-value: #0000;\n}\n@property --tw-gradient-to {\n  syntax: \"<color>\";\n  inherits: false;\n  initial-value: #0000;\n}\n@property --tw-gradient-stops {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-gradient-via-stops {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-gradient-from-position {\n  syntax: \"<length-percentage>\";\n  inherits: false;\n  initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n  syntax: \"<length-percentage>\";\n  inherits: false;\n  initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n  syntax: \"<length-percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-leading {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-font-weight {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-inset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-offset-width {\n  syntax: \"<length>\";\n  inherits: false;\n  initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-blur {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-brightness {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-contrast {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-grayscale {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-hue-rotate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-invert {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-opacity {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-saturate {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-sepia {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-drop-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-drop-shadow-size {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-duration {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ease {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-content {\n  syntax: \"*\";\n  initial-value: \"\";\n  inherits: false;\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes pulse {\n  50% {\n    opacity: 0.5;\n  }\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes pulse {\n  50% {\n    opacity: 0.5;\n  }\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes pulse {\n  50% {\n    opacity: 0.5;\n  }\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes pulse {\n  50% {\n    opacity: 0.5;\n  }\n}\n@layer properties {\n  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n    *, ::before, ::after, ::backdrop {\n      --tw-translate-x: 0;\n      --tw-translate-y: 0;\n      --tw-translate-z: 0;\n      --tw-scale-x: 1;\n      --tw-scale-y: 1;\n      --tw-scale-z: 1;\n      --tw-rotate-x: initial;\n      --tw-rotate-y: initial;\n      --tw-rotate-z: initial;\n      --tw-skew-x: initial;\n      --tw-skew-y: initial;\n      --tw-space-x-reverse: 0;\n      --tw-divide-y-reverse: 0;\n      --tw-border-style: solid;\n      --tw-gradient-position: initial;\n      --tw-gradient-from: #0000;\n      --tw-gradient-via: #0000;\n      --tw-gradient-to: #0000;\n      --tw-gradient-stops: initial;\n      --tw-gradient-via-stops: initial;\n      --tw-gradient-from-position: 0%;\n      --tw-gradient-via-position: 50%;\n      --tw-gradient-to-position: 100%;\n      --tw-leading: initial;\n      --tw-font-weight: initial;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-color: initial;\n      --tw-shadow-alpha: 100%;\n      --tw-inset-shadow: 0 0 #0000;\n      --tw-inset-shadow-color: initial;\n      --tw-inset-shadow-alpha: 100%;\n      --tw-ring-color: initial;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-inset-ring-color: initial;\n      --tw-inset-ring-shadow: 0 0 #0000;\n      --tw-ring-inset: initial;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-outline-style: solid;\n      --tw-blur: initial;\n      --tw-brightness: initial;\n      --tw-contrast: initial;\n      --tw-grayscale: initial;\n      --tw-hue-rotate: initial;\n      --tw-invert: initial;\n      --tw-opacity: initial;\n      --tw-saturate: initial;\n      --tw-sepia: initial;\n      --tw-drop-shadow: initial;\n      --tw-drop-shadow-color: initial;\n      --tw-drop-shadow-alpha: 100%;\n      --tw-drop-shadow-size: initial;\n      --tw-duration: initial;\n      --tw-ease: initial;\n      --tw-content: \"\";\n    }\n  }\n}\n";
 const AtomicRelevanceInspectorStyle0 = atomicRelevanceInspectorCss;
@@ -21,9 +87,9 @@ const AtomicRelevanceInspector = class {
         this.open = false;
     }
     render() {
-        return (index.h("atomic-modal", { key: '46ce0cc49ee3cc72208e17ec5a47fc44bc364669', exportparts: "footer", isOpen: this.open, close: () => {
+        return (index.h("atomic-modal", { key: '6f923d9cfc3e9110f7409e227d3f623621f4f008', exportparts: "footer", isOpen: this.open, close: () => {
                 this.closeRelevanceInspector?.emit();
-            } }, index.h("p", { key: '3e9e61f720d3508d151ec2bbee9f0fe8320d48c0', slot: "header" }, "Open the relevance inspector"), index.h("p", { key: 'e105518acca647f7e38e405a468d8c6b8e86a1b4', slot: "body" }, "The Relevance Inspector will open in the Coveo Administration Console."), index.h("div", { key: '177e646a5eb79311f567c531debd84a4cf18e44b', slot: "footer", class: "flex w-full items-center justify-end" }, index.h(stencilButton.Button, { key: 'f4fd56d47235c4cbcaf41da0da814f2503c6a8d9', style: "outline-primary", class: "mr-2 p-2", onClick: () => this.closeRelevanceInspector?.emit() }, "Ignore"), index.h("a", { key: 'c98c637d86171fde324e97fee9862d9ede38bb3d', class: "btn-primary p-2", target: "_blank", href: this.adminHref, onClick: () => this.closeRelevanceInspector?.emit() }, "Open"))));
+            } }, index.h("p", { key: 'd8212fea2bd661d53ec8bbb66f748886a727f709', slot: "header" }, "Open the relevance inspector"), index.h("p", { key: 'c535ab260772d33128ee6292e69eaaf1243489d5', slot: "body" }, "The Relevance Inspector will open in the Coveo Administration Console."), index.h("div", { key: '67878280eb04322729f0f09c69231ebb91b86d46', slot: "footer", class: "flex w-full items-center justify-end" }, index.h(stencilButton.Button, { key: '244ead4c3579c8c68fb515affab77a21c7276899', style: "outline-primary", class: "mr-2 p-2", onClick: () => this.closeRelevanceInspector?.emit() }, "Ignore"), index.h("a", { key: '7ce0b272d9870be76b22f8499c3d3006deacee55', class: "btn-primary p-2", target: "_blank", href: this.adminHref, onClick: () => this.closeRelevanceInspector?.emit() }, "Open"))));
     }
     get adminHref() {
         const { organizationId, environment } = this.bindings.engine.state.configuration;
@@ -34,6 +100,7 @@ const AtomicRelevanceInspector = class {
 };
 AtomicRelevanceInspector.style = AtomicRelevanceInspectorStyle0;
+exports.atomic_aria_live = AtomicAriaLive;
 exports.atomic_relevance_inspector = AtomicRelevanceInspector;
-//# sourceMappingURL=atomic-relevance-inspector.cjs.entry.js.map
+//# sourceMappingURL=atomic-aria-live_2.cjs.entry.js.map

package/dist/cjs/atomic-aria-live_2.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"atomic-aria-live.atomic-relevance-inspector.entry.cjs.js","mappings":";;;;;;;;;;;;;;;MAsBa,cAAc;;;QAER,YAAO,GAAsB,EAAE,CAAC;QAEzC,kBAAa,GAAGA,iCAAmB,CAAC,EAAC,KAAK,EAAE,GAAG,EAAC,CAAC,CAAC;uBAFZ,EAAE;;IAMtC,cAAc,CAAC,EAAC,MAAM,EAAE,IAAI,EAAqC;QACzE,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE;YAC9C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;SAC1B;KACF;IAED,IAAY,mBAAmB;QAC7B,IAAI,OAAO,GAAmB,IAAI,CAAC,IAAI,CAAC;QACxC,OAAO,OAAO,EAAE;YACd,IAAI,OAAO,CAAC,OAAO,KAAK,yBAAyB,EAAE;gBACjD,OAAO,IAAI,CAAC;aACb;YACD,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC;SACjC;QACD,OAAO,KAAK,CAAC;KACd;IAED,iBAAiB;QACf,IAAI,CAAC,EAAE,GAAGC,cAAQ,CAAC,mBAAmB,CAAC,CAAC;KACzC;;;;IAMM,MAAM,aAAa,CACxB,MAAc,EACd,OAAe,EACf,SAAkB;QAElB,MAAM,YAAY,GAAG,OAClB,IAAI,CAAC,OAAO,GAAG,EAAC,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,GAAG,EAAC,SAAS,EAAE,OAAO,EAAC,EAAC,CAAC,CAAC;QAErE,IAAI,OAAO,EAAE;YACX,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;SAClD;aAAM;YACL,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;YAChD,YAAY,EAAE,CAAC;SAChB;KACF;;;;IAMM,MAAM,cAAc,CAAC,MAAc,EAAE,SAAkB;QAC5D,IAAI,MAAM,IAAI,IAAI,CAAC,OAAO,EAAE;YAC1B,OAAO;SACR;QACD,IAAI,CAAC,OAAO,GAAG,EAAC,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,GAAG,EAAC,SAAS,EAAE,OAAO,EAAE,EAAE,EAAC,EAAC,CAAC;KACtE;IAEM,oBAAoB;QACzB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;KAC5B;IAEM,MAAM;QACX,QACEC,QAACC,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,OAAO,EAAE,OAAO;gBAChB,MAAM,EAAE,GAAG;gBACX,QAAQ,EAAE,QAAQ;gBAClB,MAAM,EAAE,GAAG;aACZ,IAEA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAC/B,CAAC,CAAC,UAAU,EAAE,EAAC,SAAS,EAAE,OAAO,EAAC,CAAC,MACjCD,iBACE,GAAG,EAAE,UAAU,EACf,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,IAAI,UAAU,EAAE,eACnB,SAAS,GAAG,WAAW,GAAG,QAAQ,EAC7C,IAAI,EAAC,QAAQ,IAEZ,OAAO,CACJ,CACP,CACF,CACI,EACP;KACH;;;;AC/GH,MAAM,2BAA2B,GAAG,0u1DAA0u1D,CAAC;AAC/w1D,uCAAe,2BAA2B;;MCY7B,wBAAwB;;;;QAMZ,SAAI,GAAG,KAAK,CAAC;;oBAAN,KAAK;;IAK5B,MAAM;QACX,QACEA,2EACE,WAAW,EAAC,QAAQ,EACpB,MAAM,EAAE,IAAI,CAAC,IAAI,EACjB,KAAK,EAAE;gBACL,IAAI,CAAC,uBAAuB,EAAE,IAAI,EAAE,CAAC;aACtC,IAEDA,gEAAG,IAAI,EAAC,QAAQ,mCAAiC,EACjDA,gEAAG,IAAI,EAAC,MAAM,6EAEV,EACJA,kEAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,sCAAsC,IAC7DA,QAACE,oBAAM,qDACL,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,MAAM,IAAI,CAAC,uBAAuB,EAAE,IAAI,EAAE,aAG5C,EACTF,gEACE,KAAK,EAAC,iBAAiB,EACvB,MAAM,EAAC,QAAQ,EACf,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,OAAO,EAAE,MAAM,IAAI,CAAC,uBAAuB,EAAE,IAAI,EAAE,WAGjD,CACA,CACO,EACf;KACH;IAED,IAAY,SAAS;QACnB,MAAM,EAAC,cAAc,EAAE,WAAW,EAAC,GACjC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC;QAE3C,MAAM,KAAK,GAAGG,gCAAuB,CAAC,cAAc,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;QAC5E,MAAM,EAAC,gBAAgB,EAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;QAC7D,OAAO,GAAG,KAAK,YAAY,cAAc,8BAA8B,gBAAgB,EAAE,CAAC;KAC3F;;;;;;;","names":["buildDebouncedQueue","randomID","h","Host","Button","getOrganizationEndpoint"],"sources":["src/components/search/atomic-search-interface/atomic-aria-live.tsx","src/components/search/atomic-relevance-inspector/atomic-relevance-inspector.pcss?tag=atomic-relevance-inspector&encapsulation=shadow","src/components/search/atomic-relevance-inspector/atomic-relevance-inspector.tsx"],"sourcesContent":["import {\n Component,\n h,\n State,\n Element,\n Method,\n Listen,\n Host,\n} from '@stencil/core';\nimport {buildDebouncedQueue} from '../../../utils/debounce-utils';\nimport {FindAriaLiveEventArgs} from '../../../utils/stencil-accessibility-utils';\nimport {randomID} from '../../../utils/utils';\n\ntype Regions = {[regionName: string]: {assertive: boolean; message: string}};\n\n/**\n * The `atomic-aria-live` component notifies screen readers of changes in the search interface.\n */\n@Component({\n tag: 'atomic-aria-live',\n shadow: false,\n})\nexport class AtomicAriaLive {\n @Element() private host!: HTMLAtomicAriaLiveElement;\n @State() private regions: Readonly<Regions> = {};\n\n private messagesQueue = buildDebouncedQueue({delay: 500});\n private id!: string;\n\n @Listen('atomic/accessibility/findAriaLive', {target: 'document'})\n protected onFindAriaLive({detail: args}: CustomEvent<FindAriaLiveEventArgs>) {\n if (!args.element || !this.isInSearchInterface) {\n args.element = this.host;\n }\n }\n\n private get isInSearchInterface() {\n let element: Element | null = this.host;\n while (element) {\n if (element.tagName === 'ATOMIC-SEARCH-INTERFACE') {\n return true;\n }\n element = element.parentElement;\n }\n return false;\n }\n\n connectedCallback() {\n this.id = randomID('atomic-aria-live-');\n }\n\n /**\n * @internal\n */\n @Method()\n public async updateMessage(\n region: string,\n message: string,\n assertive: boolean\n ) {\n const updateRegion = () =>\n (this.regions = {...this.regions, [region]: {assertive, message}});\n\n if (message) {\n this.messagesQueue.enqueue(updateRegion, region);\n } else {\n this.messagesQueue.cancelActionIfQueued(region);\n updateRegion();\n }\n }\n\n /**\n * @internal\n */\n @Method()\n public async registerRegion(region: string, assertive: boolean) {\n if (region in this.regions) {\n return;\n }\n this.regions = {...this.regions, [region]: {assertive, message: ''}};\n }\n\n public disconnectedCallback() {\n this.messagesQueue.clear();\n }\n\n public render() {\n return (\n <Host\n style={{\n position: 'absolute',\n display: 'block',\n height: '0',\n overflow: 'hidden',\n margin: '0',\n }}\n >\n {Object.entries(this.regions).map(\n ([regionName, {assertive, message}]) => (\n <div\n key={regionName}\n id={`${this.id}-${regionName}`}\n aria-live={assertive ? 'assertive' : 'polite'}\n role=\"status\"\n >\n {message}\n </div>\n )\n )}\n </Host>\n );\n }\n}\n","@import '../../../global/global.pcss';\n","import {getOrganizationEndpoint} from '@coveo/headless';\nimport {Component, h, Prop, Event, EventEmitter} from '@stencil/core';\nimport {Button} from '../../common/stencil-button';\nimport {Bindings} from '../atomic-search-interface/atomic-search-interface';\n\n/**\n * The `atomic-relevance-inspector` component is used internally to offer insight on search page relevance, as well as information to help troubleshoot issues during development.\n */\n@Component({\n tag: 'atomic-relevance-inspector',\n styleUrl: 'atomic-relevance-inspector.pcss',\n shadow: true,\n})\nexport class AtomicRelevanceInspector {\n /**\n * The Atomic interface bindings, namely the headless search engine and i18n instances.\n */\n @Prop() bindings!: Bindings;\n\n @Prop({reflect: true}) open = false;\n\n @Event({eventName: 'atomic/relevanceInspector/close'})\n closeRelevanceInspector: EventEmitter<null> | undefined;\n\n public render() {\n return (\n <atomic-modal\n exportparts=\"footer\"\n isOpen={this.open}\n close={() => {\n this.closeRelevanceInspector?.emit();\n }}\n >\n <p slot=\"header\">Open the relevance inspector</p>\n <p slot=\"body\">\n The Relevance Inspector will open in the Coveo Administration Console.\n </p>\n <div slot=\"footer\" class=\"flex w-full items-center justify-end\">\n <Button\n style=\"outline-primary\"\n class=\"mr-2 p-2\"\n onClick={() => this.closeRelevanceInspector?.emit()}\n >\n Ignore\n </Button>\n <a\n class=\"btn-primary p-2\"\n target=\"_blank\"\n href={this.adminHref}\n onClick={() => this.closeRelevanceInspector?.emit()}\n >\n Open\n </a>\n </div>\n </atomic-modal>\n );\n }\n\n private get adminHref() {\n const {organizationId, environment} =\n this.bindings.engine.state.configuration;\n\n const admin = getOrganizationEndpoint(organizationId, environment, 'admin');\n const {searchResponseId} = this.bindings.engine.state.search;\n return `${admin}/admin/#/${organizationId}/search/relevanceInspector/${searchResponseId}`;\n }\n}\n"],"version":3}

package/dist/cjs/atomic-category-facet.cjs.entry.js CHANGED Viewed

@@ -370,7 +370,7 @@ const AtomicCategoryFacet = class {
     }
     render() {
         const { bindings: { i18n }, label, facetState: { facetSearch, enabled, valuesAsTrees, selectedValueAncestry }, searchStatusState: { hasError, firstSearchExecuted }, } = this;
-        return (index.h(facetGuard.FacetGuard, { key: '3c4d340effbf30ab14d587f7f145cc17f72cfa89', enabled: enabled, firstSearchExecuted: firstSearchExecuted, hasError: hasError, hasResults: valuesAsTrees.length > 0 }, firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, this.renderHeader(), !this.isCollapsed && [
+        return (index.h(facetGuard.FacetGuard, { key: '731be048a6df7ba6b0767f4046eac015182760e5', enabled: enabled, firstSearchExecuted: firstSearchExecuted, hasError: hasError, hasResults: valuesAsTrees.length > 0 }, firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, this.renderHeader(), !this.isCollapsed && [
             this.renderSearchInput(),
             stencilFacetValueLabelHighlight.shouldDisplaySearchResults(facetSearch) ? (index.h(index.Fragment, null, facetSearch.values.length ? (index.h(stencilFacetValuesGroup.FacetValuesGroup, { i18n: i18n, label: label, query: facetSearch.query }, this.renderSearchResults())) : (index.h("div", { class: "mt-3" })), this.renderMatches())) : (index.h(index.Fragment, null, index.h(stencilFacetValuesGroup.FacetValuesGroup, { i18n: i18n, label: label }, this.hasParents ? (index.h(valueAsTreeContainer.CategoryFacetParentAsTreeContainer, { isTopLevel: true, className: "mt-3" }, this.renderValuesTree(selectedValueAncestry, true))) : (index.h(valueAsTreeContainer.CategoryFacetChildrenAsTreeContainer, { className: "mt-3" }, this.renderChildren()))), this.renderShowMoreLess())),
         ])) : (index.h(facetPlaceholder.FacetPlaceholder, { isCollapsed: this.isCollapsed, numberOfValues: this.numberOfValues }))));

package/dist/cjs/atomic-citation.cjs.entry.js CHANGED Viewed

@@ -475,7 +475,7 @@ const AtomicCitation = class {
         return (index.h("div", { part: "citation-popover", class: `border-neutral bg-background z-10 rounded-md border p-4 shadow ${this.isOpen ? 'desktop-only:flex' : 'hidden'} mobile-only:hidden flex-col gap-3`, ref: (el) => (this.popupRef = el), role: "dialog" }, index.h("div", { class: "text-neutral-dark truncate text-sm" }, this.citation.uri), index.h(stencilHeading.Heading, { level: 0, class: "text-md font-bold" }, this.citation.title), index.h("p", { class: "text-on-background text-sm" }, this.getTruncatedText())));
     }
     render() {
-        return (index.h("div", { key: '42d214e2ce50768257f958cc29e3f55d8248c29a', class: "relative" }, index.h(itemLink.LinkWithItemAnalytics, { key: 'e41eefd525303956ff75881a1a89d4043592dbe1', href: this.citation.clickUri ?? this.citation.uri, ref: (el) => (this.citationRef = el), part: "citation", target: "_blank", rel: "noopener", "aria-haspopup": "dialog", className: "bg-background btn-outline-primary border-neutral text-on-background flex items-center rounded-full border p-1", onSelect: () => this.interactiveCitation.select(), onBeginDelayedSelect: () => this.interactiveCitation.beginDelayedSelect(), onCancelPendingSelect: () => this.interactiveCitation.cancelPendingSelect(), stopPropagation: this.stopPropagation, onMouseLeave: this.closePopover, onMouseOver: this.delayedPopoverOpen, onFocus: this.openPopover, onBlur: this.closePopover }, index.h("span", { key: '8732b737680d0017fc6c66b967b0f788c69e78eb', class: "citation-title mx-1 truncate" }, this.citation.title)), this.renderPopover()));
+        return (index.h("div", { key: 'effe5e47ebff68b2f23ba6cf7f7055218367136a', class: "relative" }, index.h(itemLink.LinkWithItemAnalytics, { key: '8a60cc883cec7f537c5b89821d303146cb871282', href: this.citation.clickUri ?? this.citation.uri, ref: (el) => (this.citationRef = el), part: "citation", target: "_blank", rel: "noopener", "aria-haspopup": "dialog", className: "bg-background btn-outline-primary border-neutral text-on-background flex items-center rounded-full border p-1", onSelect: () => this.interactiveCitation.select(), onBeginDelayedSelect: () => this.interactiveCitation.beginDelayedSelect(), onCancelPendingSelect: () => this.interactiveCitation.cancelPendingSelect(), stopPropagation: this.stopPropagation, onMouseLeave: this.closePopover, onMouseOver: this.delayedPopoverOpen, onFocus: this.openPopover, onBlur: this.closePopover }, index.h("span", { key: 'f60c01006570a83b6404555a83beb074699df4cd', class: "citation-title mx-1 truncate" }, this.citation.title)), this.renderPopover()));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/atomic-commerce-category-facet_5.cjs.entry.js CHANGED Viewed

@@ -237,7 +237,7 @@ const AtomicCommerceCategoryFacet = class {
     render() {
         const { bindings: { i18n }, facetState: { facetSearch, selectedValueAncestry, values }, } = this;
         const { hasError, firstRequestExecuted } = this.summaryState;
-        return (index.h(facetGuard.FacetGuard, { key: '9a52177ec383223eb9c6d639c7cdaebec9708171', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: values.length > 0 }, index.h(facetPlaceholder.FacetContainer, { key: '3780544f973456d617851a9a226ff834735d76db' }, this.renderHeader(), !this.isCollapsed && [
+        return (index.h(facetGuard.FacetGuard, { key: '801f8c19416fa05abaa20c760af22150ce3fd76b', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: values.length > 0 }, index.h(facetPlaceholder.FacetContainer, { key: '82b956de02e229fd592722ce7a3e26521696b5a5' }, this.renderHeader(), !this.isCollapsed && [
             this.renderSearchInput(),
             stencilFacetValueLabelHighlight.shouldDisplaySearchResults(facetSearch) ? (index.h(index.Fragment, null, facetSearch.values.length ? (index.h(stencilFacetValuesGroup.FacetValuesGroup, { i18n: i18n, label: this.displayName, query: facetSearch.query }, this.renderSearchResults())) : (index.h("div", { class: "mt-3" })), this.renderMatches())) : (index.h(index.Fragment, null, index.h(stencilFacetValuesGroup.FacetValuesGroup, { i18n: i18n, label: this.displayName }, this.hasParents ? (index.h(valueAsTreeContainer.CategoryFacetParentAsTreeContainer, { isTopLevel: true, className: "mt-3" }, selectedValueAncestry &&
                 this.renderValuesTree(selectedValueAncestry, true))) : (index.h(valueAsTreeContainer.CategoryFacetChildrenAsTreeContainer, { className: "mt-3" }, this.renderChildren()))), this.renderShowMoreLess())),
@@ -627,12 +627,12 @@ const AtomicCommerceNumericFacet = class {
     render() {
         const { bindings: { i18n }, } = this;
         const { firstRequestExecuted, hasError } = this.summaryState;
-        return (index.h(facetGuard.FacetGuard, { key: 'f72b8ee6b7c391d1ab031ad30fb82c39ab29b7b0', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: this.shouldRenderFacet }, index.h(facetPlaceholder.FacetContainer, { key: '4f9ae72b218de1b564a0f633a94813807fa61122' }, index.h(facetPlaceholder.FacetHeader, { key: 'daec7bf380fc0884c3c654276ddad138be440ff2', i18n: i18n, label: this.displayName, onClearFilters: () => {
+        return (index.h(facetGuard.FacetGuard, { key: 'd6d35e481a51378ea0f0b9a8b4d8f66423296787', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: this.shouldRenderFacet }, index.h(facetPlaceholder.FacetContainer, { key: 'e9bb474107623805fe93ca6bdd64bf8aad16a457' }, index.h(facetPlaceholder.FacetHeader, { key: 'e3bbdbeb936d3d506b5bfc57839048ccb415c728', i18n: i18n, label: this.displayName, onClearFilters: () => {
                 this.focusTarget.focusAfterSearch();
                 this.facet.deselectAll();
             }, numberOfActiveValues: this.numberOfSelectedValues, isCollapsed: this.isCollapsed, headingLevel: 0, onToggleCollapse: () => (this.isCollapsed = !this.isCollapsed), headerRef: (el) => this.focusTarget.setTarget(el) }), !this.isCollapsed && [
             this.shouldRenderValues && this.renderValues(),
-            this.shouldRenderInput && (index.h("atomic-commerce-facet-number-input", { key: 'de369a7d26bec5419257de28d4b02879c2b10e0b', bindings: this.bindings, label: this.displayName, facet: this.facet, range: this.facetState.manualRange })),
+            this.shouldRenderInput && (index.h("atomic-commerce-facet-number-input", { key: '01277a82c13a78a5d49bbd41a3737ae7c5c169f3', bindings: this.bindings, label: this.displayName, facet: this.facet, range: this.facetState.manualRange })),
         ])));
     }
     renderValues() {
@@ -873,7 +873,7 @@ const AtomicCommerceTimeframeFacet = class {
     }
     render() {
         const { hasError, firstRequestExecuted } = this.summaryState;
-        return (index.h(facetGuard.FacetGuard, { key: '7d123f1255e5d764ba44ce331ede234c1a3967d3', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: this.shouldRenderFacet }, index.h(facetPlaceholder.FacetContainer, { key: '20033097a0f749393696f1417a8f9dbe01a52393' }, this.renderHeader(), !this.isCollapsed && [
+        return (index.h(facetGuard.FacetGuard, { key: '9ccbe0aca38feeb8998dfdd32d8644e805543b33', enabled: true, firstSearchExecuted: firstRequestExecuted, hasError: hasError, hasResults: this.shouldRenderFacet }, index.h(facetPlaceholder.FacetContainer, { key: '2b6d98a651a0fea17e50e76d9bc8b2d9b20e553a' }, this.renderHeader(), !this.isCollapsed && [
             this.shouldRenderValues && this.renderValues(),
             this.shouldRenderInput && this.renderDateInput(),
         ])));

package/dist/cjs/atomic-commerce-facet-number-input_2.cjs.entry.js CHANGED Viewed

@@ -133,13 +133,13 @@ const FacetDateInput = class {
         // Fallback for Safari < 14.1, date with format yyyy-mm-dd over 1400 (API limit)
         const pattern = '^(1[4-9]\\d{2}|2\\d{3})-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$';
         const range = this.rangeGetter();
-        return (index.h("form", { key: '5b9dcc787bc6df5e367c5f42399870887c47d1ac', class: "mt-4 grid grid-cols-[min-content_1fr] gap-2 px-2", onSubmit: (e) => {
+        return (index.h("form", { key: 'a4baefb311141e8e83927641f9bc0b9f996fb7b1', class: "mt-4 grid grid-cols-[min-content_1fr] gap-2 px-2", onSubmit: (e) => {
                 e.preventDefault();
                 this.apply();
                 return false;
-            } }, index.h("label", { key: '402453cff10dc0145067c4915c37f4664062b483', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_start` }, startLabel, ":"), index.h("input", { key: '9b29df3dc13bfa9f8a75c7bc4528ed81c75b26a4', id: `${this.facetId}_start`, part: "input-start", type: "date", ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": startAria, placeholder: placeholder, pattern: pattern, required: true,
+            } }, index.h("label", { key: '5892038f99ba80a1cdc9fcad6f6e654bbe72f5e8', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_start` }, startLabel, ":"), index.h("input", { key: 'c33ac8fa37cf0fd74b2714a96fa03aeb6ba79858', id: `${this.facetId}_start`, part: "input-start", type: "date", ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": startAria, placeholder: placeholder, pattern: pattern, required: true,
             // API/Index minimum supported date
-            min: this.min || this.formattedDateValue('1401-01-01'), max: this.end ? this.formattedDateValue(this.end) : this.max, value: this.formattedDateValue(range?.start), onInput: (e) => (this.start = dateUtils.parseDate(e.target.value).toDate()) }), index.h("label", { key: 'be0174d19a814f5119ef504f56a60f1d00e690ed', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_end` }, endLabel, ":"), index.h("input", { key: '1786cc6d87fe13282dc0c7a4e56c5a979ad10d39', id: `${this.facetId}_end`, part: "input-end", type: "date", ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": endAria, placeholder: placeholder, pattern: pattern, required: true, min: this.formattedDateValue(this.start) || this.min, max: this.max, value: this.formattedDateValue(range?.end), onInput: (e) => (this.end = dateUtils.parseDate(e.target.value).toDate()) }), index.h(stencilButton.Button, { key: '4d15da7ba14e0349e0caa0b576c392ad331c29f9', style: "outline-primary", type: "submit", part: "input-apply-button", class: "col-span-2 truncate p-2.5", ariaLabel: applyAria, text: apply })));
+            min: this.min || this.formattedDateValue('1401-01-01'), max: this.end ? this.formattedDateValue(this.end) : this.max, value: this.formattedDateValue(range?.start), onInput: (e) => (this.start = dateUtils.parseDate(e.target.value).toDate()) }), index.h("label", { key: '6a43717815366cd577c3dcff12daee3b8f4f12e8', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_end` }, endLabel, ":"), index.h("input", { key: '762537555485c888053782f20ed5641742189aa1', id: `${this.facetId}_end`, part: "input-end", type: "date", ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": endAria, placeholder: placeholder, pattern: pattern, required: true, min: this.formattedDateValue(this.start) || this.min, max: this.max, value: this.formattedDateValue(range?.end), onInput: (e) => (this.end = dateUtils.parseDate(e.target.value).toDate()) }), index.h(stencilButton.Button, { key: '35ea3df63ff736489947afdb9518277e0743255f', style: "outline-primary", type: "submit", part: "input-apply-button", class: "col-span-2 truncate p-2.5", ariaLabel: applyAria, text: apply })));
     }
 };

package/dist/cjs/atomic-commerce-query-error.cjs.entry.js CHANGED Viewed

@@ -56,7 +56,7 @@ const AtomicCommerceQueryError = class {
         if (hasError) {
             this.ariaMessage = stencilLink.getAriaMessageFromErrorType(i18n, organizationId, url, error?.type);
         }
-        return (index.h(stencilLink.QueryErrorGuard, { key: '95193482503d1d712a06ab4175ef7c7d1fc869d9', hasError: hasError }, index.h(stencilLink.QueryErrorContainer, { key: '6647c2109049e59200387d4bf7bd68e3aad63d97' }, index.h(stencilLink.QueryErrorIcon, { key: '38a4d000823003282b794e75cc1fc43e18d567b0', errorType: error?.type }), index.h(stencilLink.QueryErrorTitle, { key: '3919052528558397463a849c19655f96f3574fe4', errorType: error?.type, i18n: i18n, organizationId: organizationId }), index.h(stencilLink.QueryErrorDescription, { key: 'd8b0f67ea988d3b62e2bf7ba3331e33fdb51b6d5', i18n: i18n, organizationId: organizationId, url: url, errorType: error?.type }), index.h(stencilLink.QueryErrorShowMore, { key: '77fd307d5932a1572bb2e044196f279dcf16218d', link: index.h(stencilLink.QueryErrorLink, { i18n: i18n, errorType: error?.type }), onShowMore: () => (this.showMoreInfo = !this.showMoreInfo), i18n: i18n }), index.h(stencilLink.QueryErrorDetails, { key: '5a7b5d2c14151940bc10574bb966170b275d37b1', error: error, show: this.showMoreInfo }))));
+        return (index.h(stencilLink.QueryErrorGuard, { key: 'e1d4bd6b95a5056ad802137d2742a452a34dae11', hasError: hasError }, index.h(stencilLink.QueryErrorContainer, { key: 'a66b796a5a3842cf4405fa442e4feae65e5cc96a' }, index.h(stencilLink.QueryErrorIcon, { key: '0a57620ae33b606e509de2901f445567833587c3', errorType: error?.type }), index.h(stencilLink.QueryErrorTitle, { key: 'd3a2656f6217b86c49e429029b7fa8b6414c1781', errorType: error?.type, i18n: i18n, organizationId: organizationId }), index.h(stencilLink.QueryErrorDescription, { key: '5ecb0bfe66508592fd976ff029b81462ac7e8a86', i18n: i18n, organizationId: organizationId, url: url, errorType: error?.type }), index.h(stencilLink.QueryErrorShowMore, { key: 'bf5e59bb0ae0f25ee899c90258c9f1102e6b2d46', link: index.h(stencilLink.QueryErrorLink, { i18n: i18n, errorType: error?.type }), onShowMore: () => (this.showMoreInfo = !this.showMoreInfo), i18n: i18n }), index.h(stencilLink.QueryErrorDetails, { key: '34497dc49fb6004e184b5ec692a3564af7a8a5ef', error: error, show: this.showMoreInfo }))));
     }
 };
 __decorate([

package/dist/cjs/atomic-commerce-refine-modal.cjs.entry.js CHANGED Viewed

@@ -120,7 +120,7 @@ const AtomicCommerceRefineModal = class {
         return (index.h(stencilSort.RefineModalFiltersSection, { i18n: i18n, withFacets: true, withAutomaticFacets: false }, this.breadcrumbManagerState.hasBreadcrumbs && (index.h(stencilSort.RefineModalFiltersClearButton, { i18n: i18n, onClick: () => this.breadcrumbManager.deselectAll() }))));
     }
     render() {
-        return (index.h(stencilModal.RefineModal, { key: 'aa39a5ec55ef2bbaf18b1a569de41ea65ce05332', i18n: this.bindings.i18n, host: this.host, isOpen: this.isOpen, onClose: () => (this.isOpen = false), title: this.bindings.i18n.t('sort-and-filter'), numberOfItems: this.summaryState.totalNumberOfProducts, openButton: this.openButton }, index.h(stencilSort.RefineModalBody, { key: '46ce31d9be0c2e33097ee63c5919f10e4a009773' }, this.renderSort(), this.renderFilters())));
+        return (index.h(stencilModal.RefineModal, { key: 'd969a181ddc0371a6e79c468dbe33cc3b3ec1aab', i18n: this.bindings.i18n, host: this.host, isOpen: this.isOpen, onClose: () => (this.isOpen = false), title: this.bindings.i18n.t('sort-and-filter'), numberOfItems: this.summaryState.totalNumberOfProducts, openButton: this.openButton }, index.h(stencilSort.RefineModalBody, { key: 'c81e533b343dd5d1d1820b904561e06dc0aa4cef' }, this.renderSort(), this.renderFilters())));
     }
     componentDidLoad() {
         this.host.style.display = '';

package/dist/cjs/atomic-commerce-refine-toggle.cjs.entry.js CHANGED Viewed

@@ -51,7 +51,7 @@ const AtomicCommerceRefineToggle = class {
         this.modalRef && (this.modalRef.isOpen = true);
     }
     render() {
-        return (index.h(stencilGuard.RefineToggleGuard, { key: '0936ba6fa09da9b450718da4b445ed16d9d9d56a', firstRequestExecuted: this.summaryState.firstRequestExecuted, hasError: this.summaryState.hasError, hasItems: this.summaryState.hasProducts }, index.h(stencilGuard.RefineToggleButton, { key: 'cff1eeacc25c2591f199aa36174126035c8b26af', i18n: this.bindings.i18n, onClick: () => this.enableModal(), setRef: (button) => {
+        return (index.h(stencilGuard.RefineToggleGuard, { key: '972c8d437f43c36096981474d780741a47602f55', firstRequestExecuted: this.summaryState.firstRequestExecuted, hasError: this.summaryState.hasError, hasItems: this.summaryState.hasProducts }, index.h(stencilGuard.RefineToggleButton, { key: 'e8730f9896a82deda05990ce529e753adcad02f0', i18n: this.bindings.i18n, onClick: () => this.enableModal(), setRef: (button) => {
                 if (!button) {
                     return;
                 }

package/dist/cjs/atomic-facet-manager.cjs.entry.js CHANGED Viewed

@@ -74,7 +74,7 @@ const AtomicFacetManager = class {
         this.bindings?.i18n.off('languageChanged', this.sortFacets);
     }
     render() {
-        return index.h("slot", { key: '961131ac67d2b2d74ecd11a504b5e2bf5d3b78b5' });
+        return index.h("slot", { key: '860b61ea6c3c6a4d168882fd63a3a75a6772989d' });
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/atomic-facet-number-input.cjs.entry.js CHANGED Viewed

@@ -48,11 +48,11 @@ const FacetNumberInput = class {
         const inputClasses = 'p-2.5 input-primary placeholder-neutral-dark min-w-0 mr-1';
         const labelClasses = 'text-neutral-dark text-sm';
         const step = this.type === 'integer' ? '1' : 'any';
-        return (index.h("form", { key: 'aeec1e4f98899d1653df921fc0a9c53ca3fcbf3b', class: "mt-4 gap-y-0.5 px-2", part: "input-form", onSubmit: (e) => {
+        return (index.h("form", { key: '20eae7777fc2b14691740480a700df5d5c53a04a', class: "mt-4 gap-y-0.5 px-2", part: "input-form", onSubmit: (e) => {
                 e.preventDefault();
                 this.apply();
                 return false;
-            } }, index.h("label", { key: 'edfa0efd988534f6c8228215489220f79504e166', part: "label-start", class: labelClasses, htmlFor: `${this.filterState.facetId}_start` }, minText), index.h("input", { key: 'c032ead904ce549843de5ca3f124d8502a3e4d14', part: "input-start", id: `${this.filterState.facetId}_start`, type: "number", step: step, ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": minAria, required: true, min: Number.MIN_SAFE_INTEGER, max: this.end, value: this.filterState.range?.start, onInput: (e) => (this.start = e.target.valueAsNumber) }), index.h("label", { key: '5e6950b85237aaf46b09d00487f882044402eec1', part: "label-end", class: labelClasses, htmlFor: `${this.filterState.facetId}_end` }, maxText), index.h("input", { key: 'c07d8787a0bcdc8f267f3d753752feb14c1e14f2', part: "input-end", id: `${this.filterState.facetId}_end`, type: "number", step: step, ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": maxAria, required: true, min: this.start, max: Number.MAX_SAFE_INTEGER, value: this.filterState.range?.end, onInput: (e) => (this.end = e.target.valueAsNumber) }), index.h(stencilButton.Button, { key: '97b81fcf3f99a3a250b1f4e538dd720893be20fe', style: "outline-primary", type: "submit", part: "input-apply-button", class: "flex-none truncate p-2.5", ariaLabel: applyAria, text: apply })));
+            } }, index.h("label", { key: '68c3ace8291872131a7467d3edcb2d8b34b74ce6', part: "label-start", class: labelClasses, htmlFor: `${this.filterState.facetId}_start` }, minText), index.h("input", { key: '88d8135436199ce130bd327048003966e7ca66ea', part: "input-start", id: `${this.filterState.facetId}_start`, type: "number", step: step, ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": minAria, required: true, min: Number.MIN_SAFE_INTEGER, max: this.end, value: this.filterState.range?.start, onInput: (e) => (this.start = e.target.valueAsNumber) }), index.h("label", { key: 'a9279a38a7653349e2b0ed5c2639ec47f4a1670d', part: "label-end", class: labelClasses, htmlFor: `${this.filterState.facetId}_end` }, maxText), index.h("input", { key: '9a688a97af3e9b36899e76dc909f8b7c29d782a5', part: "input-end", id: `${this.filterState.facetId}_end`, type: "number", step: step, ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": maxAria, required: true, min: this.start, max: Number.MAX_SAFE_INTEGER, value: this.filterState.range?.end, onInput: (e) => (this.end = e.target.valueAsNumber) }), index.h(stencilButton.Button, { key: 'b169caa7a3efdffa39a298d38d5498bfab294754', style: "outline-primary", type: "submit", part: "input-apply-button", class: "flex-none truncate p-2.5", ariaLabel: applyAria, text: apply })));
     }
 };
 FacetNumberInput.style = AtomicFacetNumberInputStyle0;

package/dist/cjs/atomic-facet.cjs.entry.js CHANGED Viewed

@@ -251,7 +251,7 @@ const AtomicFacet = class {
         return true;
     }
     render() {
-        return (index.h(facetGuard.FacetGuard, { key: 'a286d4742a2ee06739b1ef436a125c9a5fb4ea28', enabled: this.facetState.enabled, hasError: this.searchStatusState.hasError, firstSearchExecuted: this.searchStatusState.firstSearchExecuted, hasResults: this.facetState.values.length > 0 }, this.searchStatusState.firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, index.h(facetPlaceholder.FacetHeader, { i18n: this.bindings.i18n, label: this.definedLabel, onClearFilters: () => {
+        return (index.h(facetGuard.FacetGuard, { key: 'cb02a6cb44ed791c22cde178cd7ab6fd202edb58', enabled: this.facetState.enabled, hasError: this.searchStatusState.hasError, firstSearchExecuted: this.searchStatusState.firstSearchExecuted, hasResults: this.facetState.values.length > 0 }, this.searchStatusState.firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, index.h(facetPlaceholder.FacetHeader, { i18n: this.bindings.i18n, label: this.definedLabel, onClearFilters: () => {
                 this.focusTargets.header.focusAfterSearch();
                 this.facet.deselectAll();
             }, numberOfActiveValues: this.activeValues.length, isCollapsed: this.isCollapsed, headingLevel: this.headingLevel, onToggleCollapse: () => (this.isCollapsed = !this.isCollapsed), headerRef: (el) => this.focusTargets.header.setTarget(el) }), this.renderBody())) : (index.h(facetPlaceholder.FacetPlaceholder, { numberOfValues: this.numberOfValues, isCollapsed: this.isCollapsed }))));

package/dist/cjs/atomic-focus-trap_2.cjs.entry.js CHANGED Viewed

@@ -226,8 +226,8 @@ const AtomicModal = class {
     }
     render() {
         this.updateBreakpoints();
-        const Content = () => (index.h("article", { key: '97c068b84321020cc2849ad2aa3a6f88fff51504', part: "container", class: `bg-background text-on-background flex flex-col justify-between ${this.isOpen ? 'animate-open' : 'animate-close'} ${this.wasEverOpened ? '' : 'invisible'}`, onAnimationEnd: () => this.animationEnded.emit(), ref: (ref) => (this.animatableContainer = ref) }, index.h("header", { key: '5abf8864646b6cd77167122276d59081c4e09f95', part: "header-wrapper", class: "flex flex-col items-center" }, index.h("div", { key: '86448657992058f5baae1548f0ed429fae775227', part: "header", class: "flex w-full max-w-lg justify-between text-xl", id: this.headerId }, index.h("slot", { key: '0825c59f7328db13d1a2d88f87682968ab9b13e1', name: "header" }))), index.h("hr", { key: '52fcdce56b2eccdb5b6dc10eec0c1aea88ec66fa', part: "header-ruler", class: "border-neutral border-t" }), index.h("div", { key: '6aaf6efe85f5661409ac20708399666ee4f3b51d', part: "body-wrapper", class: "flex w-full grow flex-col items-center overflow-auto" }, index.h("div", { key: '58502a8abaff5d67ea6e2591862af1eebd34a58a', part: "body", class: "w-full max-w-lg", ref: (element) => element?.addEventListener('touchmove', (e) => this.isOpen && e.stopPropagation(), { passive: false }) }, index.h("slot", { key: '25658c844fc13ee759af20eda4c15847755c74d1', name: "body" }))), index.h("footer", { key: '0e4afb825f8e458fa45cfa29a9fd8be4a8afc2ed', part: "footer-wrapper", class: "border-neutral bg-background z-10 flex w-full flex-col items-center border-t" }, index.h("div", { key: '31dac6874a1dee52e2b3599cd14c38c18941979e', part: "footer", class: "w-full max-w-lg" }, index.h("slot", { key: '82f8398b4248a15f034f13895c75d0b8f93334a8', name: "footer" })))));
-        return (index.h(index.Host, { key: 'b2b70e2126b42ac0faf317ac6a8f63578d55c72a', class: this.getClasses().join(' '), "data-nosnippet": true }, index.h("div", { key: 'c761439e7e02b59f375b8c1195bfd63d37ddc1ef', part: "backdrop", class: ` ${this.boundary === 'page' ? 'fixed' : 'absolute'} top-0 right-0 bottom-0 left-0 z-9999`, onClick: (e) => e.target === e.currentTarget && this.close() }, index.h("atomic-focus-trap", { key: '93e244f324053e7e7c4472aeb772d19694f098b3', role: "dialog", "aria-modal": this.isOpen.toString(), "aria-labelledby": this.headerId, source: this.source, container: this.container ?? this.host, ref: (ref) => (this.focusTrap = ref), scope: this.scope }, index.h(Content, { key: '8b9b6210b33e9223bd1457dee91e780255e77d52' })))));
+        const Content = () => (index.h("article", { key: '3febf388b626ca3fecefd13733699a83707eb834', part: "container", class: `bg-background text-on-background flex flex-col justify-between ${this.isOpen ? 'animate-open' : 'animate-close'} ${this.wasEverOpened ? '' : 'invisible'}`, onAnimationEnd: () => this.animationEnded.emit(), ref: (ref) => (this.animatableContainer = ref) }, index.h("header", { key: '4ca6f76d491aa9c47b9679249c9adea417baaa82', part: "header-wrapper", class: "flex flex-col items-center" }, index.h("div", { key: '7d990b281edb791259016f120827c740414287f6', part: "header", class: "flex w-full max-w-lg justify-between text-xl", id: this.headerId }, index.h("slot", { key: '208ca8c18a11374b3b6931607bd511ab05259af1', name: "header" }))), index.h("hr", { key: '6a382499d86e6d65f39853fa8b5e42efbda64355', part: "header-ruler", class: "border-neutral border-t" }), index.h("div", { key: '7e36d96b8c5a9c3dc464306255845994326fb544', part: "body-wrapper", class: "flex w-full grow flex-col items-center overflow-auto" }, index.h("div", { key: '17a99c3934790e3f74be23b0cd546f419ece08fc', part: "body", class: "w-full max-w-lg", ref: (element) => element?.addEventListener('touchmove', (e) => this.isOpen && e.stopPropagation(), { passive: false }) }, index.h("slot", { key: '381564d0a2f444ce18c4b50d196b73686b53efb7', name: "body" }))), index.h("footer", { key: '06a7a74694a5059d18ab97d34d41bcc15391fb03', part: "footer-wrapper", class: "border-neutral bg-background z-10 flex w-full flex-col items-center border-t" }, index.h("div", { key: '77db4eede7b4ec6d3c7557efb80ce88ed4e7ee84', part: "footer", class: "w-full max-w-lg" }, index.h("slot", { key: 'eba6e0bed03b949353405efb23e42a32494966e0', name: "footer" })))));
+        return (index.h(index.Host, { key: 'de57670cf7f8d431074ad6739efa9f3dd883db94', class: this.getClasses().join(' '), "data-nosnippet": true }, index.h("div", { key: 'a57980458b892fd34f3bcf6bf89f9040064a4738', part: "backdrop", class: ` ${this.boundary === 'page' ? 'fixed' : 'absolute'} top-0 right-0 bottom-0 left-0 z-9999`, onClick: (e) => e.target === e.currentTarget && this.close() }, index.h("atomic-focus-trap", { key: '6a15295aff7abb2c79dca690372063a9ba19d72c', role: "dialog", "aria-modal": this.isOpen.toString(), "aria-labelledby": this.headerId, source: this.source, container: this.container ?? this.host, ref: (ref) => (this.focusTrap = ref), scope: this.scope }, index.h(Content, { key: 'e5a8452913950a949521b14c3c580d55307bbd12' })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/atomic-format-currency.cjs.entry.js CHANGED Viewed

@@ -23,7 +23,7 @@ const AtomicFormatCurrency = class {
     }
     render() {
         if (this.error) {
-            return (index.h("atomic-component-error", { key: '5cc04c955cdb2b9866bc1997ba5166711b66d3cd', element: this.host, error: this.error }));
+            return (index.h("atomic-component-error", { key: 'a886a7243d738d4e612853773248df5b024ebcf8', element: this.host, error: this.error }));
         }
     }
     get host() { return index.getElement(this); }

package/dist/cjs/atomic-format-number.cjs.entry.js CHANGED Viewed

@@ -35,7 +35,7 @@ const AtomicFormatNumber = class {
     }
     render() {
         if (this.error) {
-            return (index.h("atomic-component-error", { key: 'bc535a767fd78b4487288d1e2f18987215f05117', element: this.host, error: this.error }));
+            return (index.h("atomic-component-error", { key: '5e5dab84791780af23a176cb7a1c8a1f08f8adb2', element: this.host, error: this.error }));
         }
     }
     get host() { return index.getElement(this); }

package/dist/cjs/atomic-format-unit.cjs.entry.js CHANGED Viewed

@@ -38,7 +38,7 @@ const AtomicFormatUnit = class {
     }
     render() {
         if (this.error) {
-            return (index.h("atomic-component-error", { key: 'c46cf1bab2bcc058b288ac109a13c6c871525435', element: this.host, error: this.error }));
+            return (index.h("atomic-component-error", { key: '131e3789e161e06dd55b15e816f78fe38c180048', element: this.host, error: this.error }));
         }
     }
     get host() { return index.getElement(this); }

package/dist/cjs/atomic-generated-answer-feedback-modal.cjs.entry.js CHANGED Viewed

@@ -384,7 +384,7 @@ const AtomicGeneratedAnswerFeedbackModal = class {
     }
     render() {
         this.updateBreakpoints();
-        return (index.h("atomic-modal", { key: 'cd5871ef60cd3465f6094e39ef0a91ec087c5fdc', fullscreen: false, isOpen: this.isOpen, close: () => this.close(), container: this.host, part: "generated-answer-feedback-modal", exportparts: exportParts.ATOMIC_MODAL_EXPORT_PARTS }, this.renderHeader(), this.renderBody(), this.renderFooter()));
+        return (index.h("atomic-modal", { key: '0a55d42f210d83c9cc908cff68e9917d13169c8a', fullscreen: false, isOpen: this.isOpen, close: () => this.close(), container: this.host, part: "generated-answer-feedback-modal", exportparts: exportParts.ATOMIC_MODAL_EXPORT_PARTS }, this.renderHeader(), this.renderBody(), this.renderFooter()));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/atomic-html.cjs.entry.js CHANGED Viewed

@@ -38,7 +38,7 @@ const AtomicHtml = class {
         }
     }
     render() {
-        return (index.h("span", { key: 'c5d09c0ade42d0776981749f170bc434e847ffee', innerHTML: this.sanitize ? purify.DOMPurify.sanitize(this.value) : this.value }));
+        return (index.h("span", { key: '3bbb4d77aae8dcd4b7a9866f63e8a00d7dc32495', innerHTML: this.sanitize ? purify.DOMPurify.sanitize(this.value) : this.value }));
     }
 };
 __decorate([

package/dist/cjs/atomic-insight-edit-toggle.cjs.entry.js CHANGED Viewed

@@ -30,7 +30,7 @@ const AtomicInsightEditToggle = class {
         this.tooltip = '';
     }
     render() {
-        return (index.h(iconButton.IconButton, { key: 'f2c3545f7dcdcf8d7ad44ab837362fb1f3c282d5', partPrefix: "insight-edit-toggle", style: "outline-neutral", icon: EditIcon, ariaLabel: "Edit", onClick: this.clickCallback, title: this.tooltip }));
+        return (index.h(iconButton.IconButton, { key: '2101e6585b7bae20530e7a140423418462fdfed4', partPrefix: "insight-edit-toggle", style: "outline-neutral", icon: EditIcon, ariaLabel: "Edit", onClick: this.clickCallback, title: this.tooltip }));
     }
 };
 AtomicInsightEditToggle.style = AtomicInsightEditToggleStyle0;

package/dist/cjs/atomic-insight-facet.cjs.entry.js CHANGED Viewed

@@ -163,7 +163,7 @@ const AtomicInsightFacet = class {
         this.facetConditionsManager?.stopWatching();
     }
     render() {
-        return (index.h(facetGuard.FacetGuard, { key: '73a620304f1dd508cbd577ae6f45314ea98bf3b1', enabled: this.facetState.enabled, hasError: this.searchStatusState.hasError, firstSearchExecuted: this.searchStatusState.firstSearchExecuted, hasResults: this.facetState.values.length > 0 }, this.searchStatusState.firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, index.h(facetPlaceholder.FacetHeader, { i18n: this.bindings.i18n, label: this.label, onClearFilters: () => {
+        return (index.h(facetGuard.FacetGuard, { key: 'b697ed4b8772d644f9b6f102c8d943a882d0f9e0', enabled: this.facetState.enabled, hasError: this.searchStatusState.hasError, firstSearchExecuted: this.searchStatusState.firstSearchExecuted, hasResults: this.facetState.values.length > 0 }, this.searchStatusState.firstSearchExecuted ? (index.h(facetPlaceholder.FacetContainer, null, index.h(facetPlaceholder.FacetHeader, { i18n: this.bindings.i18n, label: this.label, onClearFilters: () => {
                 this.focusTargets.header.focusAfterSearch();
                 this.facet.deselectAll();
             }, numberOfActiveValues: this.activeValues.length, isCollapsed: this.isCollapsed, headingLevel: this.headingLevel, onToggleCollapse: () => (this.isCollapsed = !this.isCollapsed), headerRef: (el) => this.focusTargets.header.setTarget(el) }), this.renderBody())) : (index.h(facetPlaceholder.FacetPlaceholder, { numberOfValues: this.numberOfValues, isCollapsed: this.isCollapsed }))));

package/dist/cjs/atomic-insight-folded-result-list.cjs.entry.js CHANGED Viewed

@@ -140,7 +140,7 @@ const AtomicInsightFoldedResultList = class {
     render() {
         this.itemListCommon.updateBreakpoints();
         const listClasses = this.computeListDisplayClasses();
-        return (index.h(itemListGuard.ItemListGuard, { key: '1c801f534dfdfbcfe5ea01426ad39c684d6c3666', firstRequestExecuted: this.foldedResultListState.firstSearchExecuted, hasItems: this.foldedResultListState.hasResults, hasTemplate: this.resultTemplateRegistered, templateHasError: this.itemTemplateProvider.hasError, hasError: this.foldedResultListState.hasError }, index.h(stencilDisplayWrapper.DisplayWrapper, { key: '5cacbfd7ee2d51f746956375e039b986a30ac568', listClasses: listClasses, display: this.display }, index.h(stencilPlaceholders.ResultsPlaceholdersGuard, { key: 'f8e65c083bbd2a56ca91688dc71a642c30bd2c69', displayPlaceholders: !this.isAppLoaded, numberOfPlaceholders: this.resultsPerPageState.numberOfResults, display: this.display, density: this.density, imageSize: this.imageSize }), index.h(stencilDisplayWrapper.ItemDisplayGuard, { key: '31395926a3277ba2d443ea1bbaf464efad76d929', firstRequestExecuted: this.foldedResultListState.firstSearchExecuted, hasItems: this.foldedResultListState.hasResults }, this.foldedResultListState.results.map((collection, i) => {
+        return (index.h(itemListGuard.ItemListGuard, { key: '4bc35e880a3c985c68bc984a0c0ec74bd9724e2a', firstRequestExecuted: this.foldedResultListState.firstSearchExecuted, hasItems: this.foldedResultListState.hasResults, hasTemplate: this.resultTemplateRegistered, templateHasError: this.itemTemplateProvider.hasError, hasError: this.foldedResultListState.hasError }, index.h(stencilDisplayWrapper.DisplayWrapper, { key: 'f748b7bf7aa350c19ae340a317a03440e2f593ed', listClasses: listClasses, display: this.display }, index.h(stencilPlaceholders.ResultsPlaceholdersGuard, { key: '70dc6b0a12e83c6887c1b2b45f5ff953e08c4ee3', displayPlaceholders: !this.isAppLoaded, numberOfPlaceholders: this.resultsPerPageState.numberOfResults, display: this.display, density: this.density, imageSize: this.imageSize }), index.h(stencilDisplayWrapper.ItemDisplayGuard, { key: '1a939a81fc487d1a8f5e3982def11237a044b09c', firstRequestExecuted: this.foldedResultListState.firstSearchExecuted, hasItems: this.foldedResultListState.hasResults }, this.foldedResultListState.results.map((collection, i) => {
             const atomicInsightResultProps = this.getPropsForAtomicInsightResult(collection);
             return (index.h("atomic-insight-result", { ...atomicInsightResultProps, part: "outline", ref: (element) => element && this.itemListCommon.setNewResultRef(element, i) }));
         })))));

package/dist/cjs/atomic-insight-full-search-button.cjs.entry.js CHANGED Viewed

@@ -39,7 +39,7 @@ const AtomicInsightFullSearchButton = class {
         this.error = undefined;
     }
     render() {
-        return (index.h(iconButton.IconButton, { key: '6461da4e9a845043168907921d4293d402fc98b2', partPrefix: "full-search", style: "outline-neutral", icon: ArrowFull, ariaLabel: this.bindings.i18n.t('full-search'), title: this.tooltip }));
+        return (index.h(iconButton.IconButton, { key: '023cf32c7d4fd9e4b69b22c09efd1f2983cc09e4', partPrefix: "full-search", style: "outline-neutral", icon: ArrowFull, ariaLabel: this.bindings.i18n.t('full-search'), title: this.tooltip }));
     }
 };
 __decorate([

package/dist/cjs/atomic-insight-history-toggle.cjs.entry.js CHANGED Viewed

@@ -22,7 +22,7 @@ const AtomicInsightHistoryToggle = class {
         this.tooltip = '';
     }
     render() {
-        return (index.h(iconButton.IconButton, { key: '4a01395b936d059a3774c93df316e866cf87f8db', partPrefix: "insight-history-toggle", style: "outline-neutral", icon: clock.Clock, ariaLabel: "history", onClick: this.clickCallback, title: this.tooltip }));
+        return (index.h(iconButton.IconButton, { key: '8cd95e3c069341460bd685743cfbb9b536d8b2b1', partPrefix: "insight-history-toggle", style: "outline-neutral", icon: clock.Clock, ariaLabel: "history", onClick: this.clickCallback, title: this.tooltip }));
     }
 };
 AtomicInsightHistoryToggle.style = AtomicInsightHistoryToggleStyle0;