@warp-ds/elements 2.10.0-next.14 → 2.10.0-next.15

package/dist/packages/snackbar-item/snackbar-item.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/snackbar-item/snackbar-item.ts", "../../../packages/utils/element-collapse.js", "../../../packages/styles.ts", "../../../packages/snackbar-item/styles.ts"],
+  "sourcesContent": ["import { html, LitElement, PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport { collapse, expand } from '../utils/element-collapse.js';\nimport { reset } from '../styles.js';\nimport { styles } from './styles.js';\n\nexport type SnackbarVariant = 'positive' | 'warning' | 'negative' | 'info' | 'neutral';\n\nexport type SnackbarActionPlacement = 'inline' | 'block';\n\nexport enum SnackbarDuration {\n    Short = 4_000,\n    Long = 10_000,\n    Infinite = 120_000_000,\n}\n\n/**\n * An item to show in a `w-snackbar`.\n * \n * See the `create` function on `w-snackbar` for a convenience API which helps you make snackbar items.\n * \n * @parent w-snackbar\n * \n * @slot default - the snackbar message.\n * @slot icon - icon preceeding the message.\n * @slot action - action following the message.\n * \n * @csspart item - the container wrapping the message, icon and actions.\n * @csspart icon - the icon for the variant.\n * @csspart message - the default slot, body of the snackbar item.\n * @csspart action - close and action button.\n * \n * @cssprop --w-c-snackbar-item-radius\n * @cssprop --w-c-snackbar-item-max-width\n * @cssprop --w-c-snackbar-item-min-width\n * @cssprop --w-c-snackbar-item-padding\n * \n * @cssprop --w-c-snackbar-item-bg\n * @cssprop --w-c-snackbar-item-action-bg-active\n * @cssprop --w-c-snackbar-item-action-bg-hover\n * \n * @cssprop --w-c-snackbar-item-color\n * @cssprop --w-c-snackbar-item-action-color-active\n * @cssprop --w-c-snackbar-item-action-color-hover\n * \n * @cssprop --w-c-snackbar-item-box-shadow\n */\nexport class WarpSnackbarItem extends LitElement {\n    static styles = [reset, styles];\n    \n    /**\n     * The placement of the action and close buttons.\n     */\n    @property({ attribute: 'action-placement', reflect: true, useDefault: true })\n    actionPlacement: SnackbarActionPlacement = 'inline';\n\n    /**\n     * How long the message should stay in the document before removing itself.\n     */\n    @property({ type: Number, reflect: true, useDefault: true })\n    duration: number = SnackbarDuration.Short;\n\n    @query('.animation-wrapper')\n    private root!: HTMLDivElement | null;\n\n    @state()\n    private hasAction = false;\n\n    #expanded = false;\n\n    #durationLeft: number = SnackbarDuration.Short;\n\n    #lastFocused: HTMLElement | null = null;\n\n    // TODO How to expose the timer in an accessible maner, both visually and to assistive technologies? https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/timer_role + a progress bar style thing?\n    #timer: ReturnType<typeof setTimeout> | null = null;\n\n    #timerPaused = false;\n\n    connectedCallback(): void {\n        super.connectedCallback();\n\n        if (this.duration !== SnackbarDuration.Infinite) {\n            const updateFrequencyMs = 1000;\n            \n            // Subtract one updateFrequencyMs, otherwise the full\n            // duration would be duration + updateFrequencyMs.\n            this.#durationLeft = this.duration - updateFrequencyMs;\n\n            this.#timer = setInterval(() => {\n                if (this.#timerPaused) return;\n        \n                this.#durationLeft -= updateFrequencyMs;\n\n                if (this.#durationLeft <= 0) {\n                    this.close();\n                }\n            }, updateFrequencyMs);\n        }\n    }\n\n    disconnectedCallback(): void {\n        if (this.#timer) {\n            clearInterval(this.#timer);\n        }\n    }\n\n    async updated(): Promise<void> {\n        if (!this.root) return; // should never happen\n        \n        // Once widely available, replace with https://developer.chrome.com/docs/css-ui/animate-to-height-auto\n        if (!this.#expanded) {\n            // we need to measure including the height of the child\n            // components which aren't ready yet and have 0x0 dimensions,\n            // wait for the update to finish\n            await this.updateComplete;\n            expand(this.root, () => {\n                this.#expanded = true;\n            });\n        }\n    }\n\n    /**\n     * Remove the snackbar item from the document.\n     * \n     * Moves focus to the last focused element outside of the snackbar item, if available.\n     */\n    close(): void {\n        if (this.#lastFocused) {\n            this.#lastFocused.focus();\n        }\n        if (this.#expanded && this.root) {\n            collapse(this.root, () => {\n                this.remove();\n            });\n        } else {\n            this.remove();\n        }\n    }\n\n    /** \n     * Listen to focusin, not focus, as focus does not bubble.\n     * \n     * We're interested in running code when an action button gets focus,\n     * such as pausing the countdown and storing the last focused element\n     * outside of the snackbar so we can return there when it closes.\n     * \n     * Only save the first instance of `relatedTarget` so we don't overwrite\n     * it when focus moves from an action button to the close button.\n     */\n    #onFocusIn(e: FocusEvent) {\n        if (!this.#lastFocused) {\n            this.#timerPaused = true;\n            if (e.relatedTarget && (e.relatedTarget as HTMLElement).focus) {\n                this.#lastFocused = e.relatedTarget as HTMLElement;\n            }\n        }\n    }\n\n    /**\n     * Listen to focusout, not blur, as blur does not bubble.\n     * \n     * Unpause the countdown by clearing this.#lastFocused\n     * if the focus is moving outside of the snackbar item.\n     */\n    #onFocusOut(e: FocusEvent) {\n        const snackbarItemLostFocus =\n            !e.relatedTarget || \n            !this.shadowRoot?.host.contains(e.relatedTarget as HTMLElement);\n        if (snackbarItemLostFocus) {\n            this.#timerPaused = false;\n            this.#lastFocused = null;\n        }\n    }\n\n    #onMouseEnter() {\n        this.#timerPaused = true;\n    }\n\n    #onMouseLeave() {\n        // Unpause unless we still have keyboard focus\n        if (!this.#lastFocused) {\n            this.#timerPaused = false;\n        }\n    }\n\n    #hasAction() {\n        const actionSlot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"action\"]');\n        if (!actionSlot) return false;\n        const assignedElements = actionSlot.assignedElements();\n        return assignedElements.length > 0;\n    }\n\n    protected firstUpdated() {\n        // The slot must render before we can check its contents, hence the run on firstUpdated\n        this.hasAction = this.#hasAction(); \n    }\n\n    render() {\n        if (this.hasAction && document.documentElement.dataset['keyboardinteraction'] === 'true') {\n            const modifier = window.navigator.userAgent.includes('Macintosh') ? '\u2325' : 'Alt';\n            return html`\n                <w-attention\n                    tooltip\n                    placement=\"top\"\n                    distance=\"12\"\n                    show\n                >\n                    <div class=\"animation-wrapper\" slot=\"target\">\n                        <div part=\"item\"\n                            @mouseenter=${this.#onMouseEnter}\n                            @mouseleave=${this.#onMouseLeave}\n                            @focusin=${this.#onFocusIn}\n                            @focusout=${this.#onFocusOut}\n                        >\n                            <div part=\"icon\">\n                                <slot name=\"icon\"></slot>\n                            </div>\n                            <div part=\"message\">\n                                <slot></slot>\n                            </div>\n                            <div part=\"action\">\n                                <slot name=\"action\"></slot>\n                                <slot name=\"close\"></slot>\n                            </div>\n                        </div>\n                    </div>\n                    <!-- The keyboard shortcut is announced as part of the action button label -->\n                    <span slot=\"message\" aria-hidden=\"true\">\n                        <kbd>${modifier}</kbd> + <kbd>Enter</kbd>\n                    </span>\n                </w-attention>\n            `;\n        }\n        return html`\n            <div class=\"animation-wrapper\">\n                <div part=\"item\"\n                    @mouseenter=${this.#onMouseEnter}\n                    @mouseleave=${this.#onMouseLeave}\n                    @focusin=${this.#onFocusIn}\n                    @focusout=${this.#onFocusOut}\n                >\n                    <div part=\"icon\">\n                        <slot name=\"icon\"></slot>\n                    </div>\n                    <div part=\"message\">\n                        <slot></slot>\n                    </div>\n                    <div part=\"action\">\n                        <slot name=\"action\"></slot>\n                        <slot name=\"close\"></slot>\n                    </div>\n                </div>\n            </div>\n        `;\n    }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'w-snackbar-item': WarpSnackbarItem;\n  }\n}\n\nif (!customElements.get('w-snackbar-item')) {\n  customElements.define('w-snackbar-item', WarpSnackbarItem);\n}\n", "const windowExists = (typeof window !== 'undefined')\n\nlet prefersMotion = true\n\nif (windowExists) {\n  const query = window.matchMedia('(prefers-reduced-motion: reduce)')\n  const callback = ({ matches }) => prefersMotion = !matches\n  // older browsers don't support the new API, and the old API is deprecated\n  if (query.addEventListener) query.addEventListener('change', callback)\n  callback(query)\n}\n\nconst removeTransition = el => {\n  el.style.transition = null\n  el.style.backfaceVisibility = null\n  el.style.overflow = null\n}\n\nconst addTransition = (el) => {\n  // we set timing to something insanely short\n  // when reducing motion so the after-* hooks still fire\n  const timing = 'var(--w-expansion-duration, var(--f-expansion-duration, 0.3s))';\n  el.style.transition = `height ${timing}`;\n  el.style.backfaceVisibility = 'hidden';\n  el.style.overflow = 'hidden';\n}\n\nconst getAfterExpandCallback = (el, done) => () => {\n  el.style.height = 'auto'\n  el.style.overflow = null\n  if (done) done()\n}\n\nconst getAfterCollapseCallback = (done) => () => {\n  if (done) done()\n}\n\n/**\n * Transitions an element from 0 to a detected height\n * Will return a Promise when no 'done' callback is provided\n * @type {(el: HTMLElement, done?: function) => void | Promise<void>}\n */\nexport const expand = (el, done) => {\n  const returnPromise = (() => {\n    if (!done) return new Promise(r => { done = r })\n  })()\n\n  if (!prefersMotion) {\n    el.style.height = 'auto';\n    if (done) done();\n    return returnPromise;\n  }\n\n  const afterExpandCallback = getAfterExpandCallback(el, done)\n  removeTransition(el)\n  el.style.height = 'auto'\n  const dest = el.scrollHeight\n  windowExists && requestAnimationFrame(() => {\n    el.addEventListener('transitionend', afterExpandCallback, { once: true })\n    el.style.height = '0px'\n    el.style.transitionTimingFunction = 'ease-out'\n    addTransition(el)\n    requestAnimationFrame(() => el.style.height = dest + 'px')\n  })\n  if (returnPromise) return returnPromise\n}\n\n/**\n * Transitions an element from a detected height to 0\n * Will return a Promise when no 'done' callback is provided\n * @type {(el: HTMLElement, done?: function) => void | Promise<void>}\n */\nexport const collapse = (el, done) => {\n  const returnPromise = (() => {\n    if (!done) return new Promise(r => { done = r })\n  })();\n\n  if (!prefersMotion) {\n    el.style.height = '0px';\n    if (done) done();\n    return returnPromise;\n  }\n\n  const afterCollapseCallback = getAfterCollapseCallback(done)\n  removeTransition(el)\n  const original = el.scrollHeight\n  windowExists && requestAnimationFrame(() => {\n    el.addEventListener('transitionend', afterCollapseCallback, { once: true })\n    el.style.height = original + 'px'\n    el.style.transitionTimingFunction = 'ease-in'\n    addTransition(el)\n    requestAnimationFrame(() => el.style.height = '0px')\n  })\n\n  if (returnPromise) return returnPromise\n}\n", "import { css } from 'lit';\n\nexport const reset = css`\n  *,\n  :before,\n  :after {\n    box-sizing: border-box;\n    border-style: solid;\n    border-width: 0;\n    border-color: var(--w-s-color-border);\n  }\n  html {\n    font-size: 62.5%;\n  }\n  body {\n    background-color: var(--w-s-color-background);\n    min-height: 100%;\n    margin: 0;\n    overflow-y: scroll;\n  }\n  body,\n  :host {\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    -webkit-tap-highlight-color: transparent;\n    font-family: var(--w-font-family);\n    font-size: var(--w-font-size-m);\n    line-height: var(--w-line-height-m);\n    color: var(--w-s-color-text);\n  }\n  hr {\n    color: inherit;\n    border-top-width: 1px;\n    height: 0;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-size: inherit;\n    font-weight: 700;\n  }\n  a {\n    cursor: pointer;\n    color: var(--w-s-color-text-link);\n    text-decoration: none;\n  }\n  a:hover,\n  a:focus,\n  a:active {\n    text-decoration: underline;\n  }\n  a:focus-visible {\n    outline: 2px solid var(--w-s-color-border-focus);\n    outline-offset: 1px;\n  }\n  b,\n  strong {\n    font-weight: 700;\n  }\n  code,\n  kbd,\n  samp,\n  pre {\n    font-family:\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      Consolas,\n      Liberation Mono,\n      Courier New,\n      monospace;\n    font-size: 1em;\n  }\n  sub,\n  sup {\n    vertical-align: baseline;\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\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  button,\n  input,\n  optgroup,\n  select,\n  textarea {\n    font-family: inherit;\n    font-size: 100%;\n    font-weight: inherit;\n    line-height: inherit;\n    color: inherit;\n    margin: 0;\n    padding: 0;\n  }\n  button,\n  select {\n    text-transform: none;\n  }\n  button,\n  [type='button'],\n  [type='reset'],\n  [type='submit'] {\n    -webkit-appearance: button;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  ::-webkit-inner-spin-button {\n    height: auto;\n  }\n  ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [type='search'] {\n    -webkit-appearance: textfield;\n    outline-offset: -2px;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-file-upload-button {\n    -webkit-appearance: button;\n    font: inherit;\n  }\n  summary {\n    display: list-item;\n  }\n  blockquote,\n  dl,\n  dd,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  hr,\n  figure,\n  p,\n  pre {\n    margin: 0;\n  }\n  fieldset {\n    margin: 0;\n    padding: 0;\n  }\n  legend {\n    padding: 0;\n  }\n  ol,\n  ul,\n  menu {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n  textarea {\n    resize: vertical;\n  }\n  input::placeholder,\n  textarea::placeholder {\n    opacity: 1;\n    color: var(--w-s-color-text-placeholder);\n  }\n  button,\n  [role='button'] {\n    cursor: pointer;\n  }\n  :disabled {\n    cursor: default;\n  }\n  img,\n  svg,\n  video,\n  canvas,\n  audio,\n  iframe,\n  embed,\n  object {\n    vertical-align: middle;\n    display: block;\n  }\n  img,\n  video {\n    max-width: 100%;\n    height: auto;\n  }\n  h1 {\n    font-size: var(--w-font-size-xxl);\n    line-height: var(--w-line-height-xxl);\n  }\n  h2 {\n    font-size: var(--w-font-size-xl);\n    line-height: var(--w-line-height-xl);\n  }\n  h3 {\n    font-size: var(--w-font-size-l);\n    line-height: var(--w-line-height-l);\n  }\n  h4 {\n    font-size: var(--w-font-size-m);\n    line-height: var(--w-line-height-m);\n  }\n  h5 {\n    font-size: var(--w-font-size-s);\n    line-height: var(--w-line-height-s);\n  }\n  dt,\n  dd {\n    margin: 0 16px;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  ul,\n  ol,\n  dl,\n  p,\n  blockquote {\n    margin: 0 0 8px;\n  }\n  [hidden] {\n    display: none !important;\n  }\n  [tabindex='-1']:focus:not(:focus-visible) {\n    outline: none;\n  }\n  legend {\n    float: left;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    display: table;\n  }\n  legend + * {\n    clear: both;\n  }\n  fieldset {\n    border: 0;\n    min-width: 0;\n    margin: 0;\n    padding: 0.01em 0 0;\n  }\n  body:not(:-moz-handler-blocked) fieldset {\n    display: table-cell;\n  }\n  svg {\n    pointer-events: none;\n  }\n`;\nimport { unsafeCSS } from 'lit';\n\n// prettier-ignore\nexport const components = unsafeCSS(`*, :before, :after {\n            --w-rotate: 0;\n            --w-rotate-x: 0;\n            --w-rotate-y: 0;\n            --w-rotate-z: 0;\n            --w-scale-x: 1;\n            --w-scale-y: 1;\n            --w-scale-z: 1;\n            --w-skew-x: 0;\n            --w-skew-y: 0;\n            --w-translate-x: 0;\n            --w-translate-y: 0;\n            --w-translate-z: 0\n        }\n\n            .h4, .t4 {\n                font-weight: 700;\n                font-size: var(--w-font-size-m);\n                line-height: var(--w-line-height-m)\n            }\n\n            .t3 {\n                font-weight: 700;\n                font-size: var(--w-font-size-l);\n                line-height: var(--w-line-height-l)\n            }\n\n            @media (min-width: 480px) {\n                .sm\\\\:h3 {\n                    font-weight: 700;\n                    font-size: var(--w-font-size-l);\n                    line-height: var(--w-line-height-l)\n                }\n            }\n\n            .text-center {\n                text-align: center\n            }\n\n            .before\\\\:text-center:before {\n                text-align: center\n            }\n\n            .text-left {\n                text-align: left\n            }\n\n            .text-right {\n                text-align: right\n            }\n\n            .align-middle {\n                vertical-align: middle\n            }\n\n            .animate-inprogress {\n                background-image: linear-gradient(135deg, rgba(0, 0, 0, .05) 25%, transparent 0, transparent 50%, rgba(0, 0, 0, .05) 0, rgba(0, 0, 0, .05) 75%, transparent 0, transparent) !important;\n                background-size: 30px 30px;\n                animation: animate-inprogress 3s linear infinite\n            }\n\n            @keyframes animate-inprogress {\n                0% {\n                    background-position: 0 0\n                }\n                to {\n                    background-position: 60px 0\n                }\n            }\n\n            .\\\\[--w-modal-max-height\\\\:80\\\\%\\\\] {\n                --w-modal-max-height: 80%\n            }\n\n            .\\\\[--w-modal-width\\\\:640px\\\\] {\n                --w-modal-width: 640px\n            }\n\n            .focus\\\\:\\\\[--w-outline-offset\\\\:-2px\\\\]:focus {\n                --w-outline-offset: -2px\n            }\n\n            .backdrop-blur {\n                -webkit-backdrop-filter: blur(4px);\n                backdrop-filter: blur(4px)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:bg-center:before {\n                background-position: center\n            }\n\n            .hover\\\\:bg-clip-padding:hover {\n                -webkit-background-clip: padding-box;\n                background-clip: padding-box\n            }\n\n            .bg-transparent, .group\\\\/steph:first-child .group-first\\\\/steph\\\\:bg-transparent, .group\\\\/steph:last-child .group-last\\\\/steph\\\\:bg-transparent {\n                background-color: transparent\n            }\n\n            .bg-\\\\[--w-black\\\\/25\\\\] {\n                background-color: rgba(var(--w-rgb-black), .25)\n            }\n\n            .bg-\\\\[--w-black\\\\/70\\\\], .bg-\\\\[var\\\\(--w-black\\\\)\\\\/70\\\\] {\n                background-color: rgba(var(--w-rgb-black), .7)\n            }\n\n            .bg-\\\\[--w-color-badge-info-background\\\\] {\n                background-color: var(--w-color-badge-info-background)\n            }\n\n            .bg-\\\\[--w-color-badge-negative-background\\\\] {\n                background-color: var(--w-color-badge-negative-background)\n            }\n\n            .bg-\\\\[--w-color-badge-neutral-background\\\\] {\n                background-color: var(--w-color-badge-neutral-background)\n            }\n\n            .bg-\\\\[--w-color-badge-positive-background\\\\] {\n                background-color: var(--w-color-badge-positive-background)\n            }\n\n            .bg-\\\\[--w-color-badge-sponsored-background\\\\] {\n                background-color: var(--w-color-badge-sponsored-background)\n            }\n\n            .bg-\\\\[--w-color-badge-warning-background\\\\] {\n                background-color: var(--w-color-badge-warning-background)\n            }\n\n            .bg-\\\\[--w-color-button-primary-background\\\\] {\n                background-color: var(--w-color-button-primary-background)\n            }\n\n            .bg-\\\\[--w-color-buttongroup-utility-background-selected\\\\] {\n                background-color: var(--w-color-buttongroup-utility-background-selected)\n            }\n\n            .bg-\\\\[--w-color-callout-background\\\\] {\n                background-color: var(--w-color-callout-background)\n            }\n\n            .bg-\\\\[--w-color-pill-suggestion-background\\\\] {\n                background-color: var(--w-color-pill-suggestion-background)\n            }\n\n            .bg-\\\\[--w-color-switch-track-background\\\\] {\n                background-color: var(--w-color-switch-track-background)\n            }\n\n            .bg-\\\\[--w-s-color-surface-elevated-100\\\\] {\n                background-color: var(--w-s-color-surface-elevated-100)\n            }\n\n            .bg-\\\\[--w-s-color-surface-elevated-300\\\\] {\n                background-color: var(--w-s-color-surface-elevated-300)\n            }\n\n            .bg-\\\\[--w-s-icon-selected\\\\] {\n                background-color: var(--w-s-icon-selected)\n            }\n\n            .group:hover .group-hover\\\\:bg-\\\\[--w-color-switch-track-background-hover\\\\] {\n                background-color: var(--w-color-switch-track-background-hover)\n            }\n\n            .hover\\\\:bg-\\\\[--w-color-button-pill-background-hover\\\\]:hover {\n                background-color: var(--w-color-button-pill-background-hover)\n            }\n\n            .hover\\\\:bg-\\\\[--w-color-button-primary-background-hover\\\\]:hover {\n                background-color: var(--w-color-button-primary-background-hover)\n            }\n\n            .hover\\\\:bg-\\\\[--w-color-buttongroup-utility-background-hover\\\\]:hover {\n                background-color: var(--w-color-buttongroup-utility-background-hover)\n            }\n\n            .hover\\\\:bg-\\\\[--w-color-pill-suggestion-background-hover\\\\]:hover {\n                background-color: var(--w-color-pill-suggestion-background-hover)\n            }\n\n            .hover\\\\:bg-\\\\[--w-s-icon-subtle\\\\]:hover {\n                background-color: var(--w-s-icon-subtle)\n            }\n\n            .hover\\\\:bg-\\\\[var\\\\(--w-black\\\\)\\\\/85\\\\]:hover {\n                background-color: rgba(var(--w-rgb-black), .85)\n            }\n\n            .active\\\\:bg-\\\\[--w-color-button-pill-background-active\\\\]:active {\n                background-color: var(--w-color-button-pill-background-active)\n            }\n\n            .active\\\\:bg-\\\\[--w-color-button-primary-background-active\\\\]:active {\n                background-color: var(--w-color-button-primary-background-active)\n            }\n\n            .active\\\\:bg-\\\\[--w-color-buttongroup-utility-background-selected\\\\]:active {\n                background-color: var(--w-color-buttongroup-utility-background-selected)\n            }\n\n            .active\\\\:bg-\\\\[--w-color-pill-suggestion-background-active\\\\]:active {\n                background-color: var(--w-color-pill-suggestion-background-active)\n            }\n\n            .active\\\\:bg-\\\\[var\\\\(--w-black\\\\)\\\\]:active {\n                background-color: var(--w-black)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:bg-\\\\[url\\\\(var\\\\(--w-icon-toggle-checked\\\\)\\\\)\\\\]:before {\n                background-image: var(--w-icon-toggle-checked)\n            }\n\n            .appearance-none {\n                -moz-appearance: none;\n                appearance: none;\n                -webkit-appearance: none\n            }\n\n            .will-change-height {\n                will-change: height\n            }\n\n            .border, .border-1 {\n                border-width: 1px\n            }\n\n            .border-b {\n                border-bottom-width: 1px\n            }\n\n            .before\\\\:border:before {\n                border-width: 1px\n            }\n\n            .border-0 {\n                border-width: 0\n            }\n\n            .border-2 {\n                border-width: 2px\n            }\n\n            .border-b-0 {\n                border-bottom-width: 0\n            }\n\n            .border-b-4 {\n                border-bottom-width: 4px\n            }\n\n            .border-l-4 {\n                border-left-width: 4px\n            }\n\n            .border-r-0, .group:not(:last-of-type) .group-not-last-of-type\\\\:border-r-0 {\n                border-right-width: 0\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:border-\\\\[6\\\\]:before {\n                border-width: .6rem\n            }\n\n            .border-transparent {\n                border-color: transparent\n            }\n\n            .border-\\\\[--w-color-buttongroup-utility-border\\\\] {\n                border-color: var(--w-color-buttongroup-utility-border)\n            }\n\n            .border-\\\\[--w-color-callout-border\\\\] {\n                border-color: var(--w-color-callout-border)\n            }\n\n            .border-\\\\[--w-s-color-background-inverted\\\\] {\n                border-color: var(--w-s-color-background-inverted)\n            }\n\n            .border-\\\\[--w-s-color-surface-elevated-300\\\\] {\n                border-color: var(--w-s-color-surface-elevated-300)\n            }\n\n            .active\\\\:border-\\\\[--w-color-buttongroup-utility-border-selected\\\\]:active {\n                border-color: var(--w-color-buttongroup-utility-border-selected)\n            }\n\n            .divide-x > * + * {\n                --w-divide-x-reverse: 0;\n                border-left-width: calc(1px * calc(1 - var(--w-divide-x-reverse)));\n                border-right-width: calc(1px * var(--w-divide-x-reverse))\n            }\n\n            .divide-y > * + * {\n                --w-divide-y-reverse: 0;\n                border-top-width: calc(1px * calc(1 - var(--w-divide-y-reverse)));\n                border-bottom-width: calc(1px * var(--w-divide-y-reverse))\n            }\n\n            .rounded-4 {\n                border-radius: 4px\n            }\n\n            .rounded-8 {\n                border-radius: 8px\n            }\n\n            .rounded-full {\n                border-radius: 9999px\n            }\n\n            .before\\\\:rounded-2:before {\n                border-radius: 2px\n            }\n\n            .before\\\\:rounded-full:before {\n                border-radius: 9999px\n            }\n\n            .rounded-b-0 {\n                border-bottom-left-radius: 0;\n                border-bottom-right-radius: 0\n            }\n\n            .rounded-bl-0 {\n                border-bottom-left-radius: 0\n            }\n\n            .rounded-br-0 {\n                border-bottom-right-radius: 0\n            }\n\n            .rounded-l-0 {\n                border-top-left-radius: 0;\n                border-bottom-left-radius: 0\n            }\n\n            .rounded-l-full {\n                border-top-left-radius: 9999px;\n                border-bottom-left-radius: 9999px\n            }\n\n            .rounded-r-0 {\n                border-top-right-radius: 0;\n                border-bottom-right-radius: 0\n            }\n\n            .rounded-r-full {\n                border-top-right-radius: 9999px;\n                border-bottom-right-radius: 9999px\n            }\n\n            .rounded-tl-0 {\n                border-top-left-radius: 0\n            }\n\n            .rounded-tl-4 {\n                border-top-left-radius: 4px\n            }\n\n            .rounded-tr-0 {\n                border-top-right-radius: 0\n            }\n\n            .group:first-of-type .group-first-of-type\\\\:rounded-bl-8 {\n                border-bottom-left-radius: 8px\n            }\n\n            .group:first-of-type .group-first-of-type\\\\:rounded-tl-8 {\n                border-top-left-radius: 8px\n            }\n\n            .first\\\\:rounded-lb-4:first-child {\n                border-bottom-left-radius: 4px\n            }\n\n            .first\\\\:rounded-lt-4:first-child {\n                border-top-left-radius: 4px\n            }\n\n            .first\\\\:rounded-rt-4:first-child {\n                border-top-right-radius: 4px\n            }\n\n            .group:last-of-type .group-last-of-type\\\\:rounded-br-8 {\n                border-bottom-right-radius: 8px\n            }\n\n            .group:last-of-type .group-last-of-type\\\\:rounded-tr-8 {\n                border-top-right-radius: 8px\n            }\n\n            .last\\\\:rounded-lb-4:last-child {\n                border-bottom-left-radius: 4px\n            }\n\n            .last\\\\:rounded-rb-4:last-child {\n                border-bottom-right-radius: 4px\n            }\n\n            .last\\\\:rounded-rt-4:last-child {\n                border-top-right-radius: 4px\n            }\n\n            .caret-current {\n                caret-color: currentColor\n            }\n\n            .opacity-25 {\n                opacity: 25%\n            }\n\n            .block {\n                display: block\n            }\n\n            .before\\\\:block:before {\n                display: block\n            }\n\n            .inline-block {\n                display: inline-block\n            }\n\n            .inline {\n                display: inline\n            }\n\n            .flex, .open\\\\:flex[open] {\n                display: flex\n            }\n\n            .inline-flex {\n                display: inline-flex\n            }\n\n            .grid {\n                display: grid\n            }\n\n            .inline-grid {\n                display: inline-grid\n            }\n\n            .hidden, .group\\\\/stepv:last-child .group-last\\\\/stepv\\\\:hidden {\n                display: none\n            }\n\n            .before\\\\:hidden:before {\n                display: none\n            }\n\n            .hover\\\\:underline:hover {\n                text-decoration-line: underline\n            }\n\n            .focus\\\\:underline:focus {\n                text-decoration-line: underline\n            }\n\n            .focus-visible\\\\:underline:focus-visible {\n                text-decoration-line: underline\n            }\n\n            .active\\\\:underline:active {\n                text-decoration-line: underline\n            }\n\n            .hover\\\\:no-underline:hover {\n                text-decoration: none\n            }\n\n            .focus\\\\:no-underline:focus {\n                text-decoration: none\n            }\n\n            .active\\\\:no-underline:active {\n                text-decoration: none\n            }\n\n            .flex-1 {\n                flex: 1 1 0%\n            }\n\n            .shrink {\n                flex-shrink: 1\n            }\n\n            .shrink-0 {\n                flex-shrink: 0\n            }\n\n            .shrink-0\\\\! {\n                flex-shrink: 0 !important\n            }\n\n            .grow, .grow-1 {\n                flex-grow: 1\n            }\n\n            .basis-auto {\n                flex-basis: auto\n            }\n\n            .flex-col {\n                flex-direction: column\n            }\n\n            .focus-within\\\\:focusable:focus-within {\n                outline: 2px solid var(--w-s-color-border-focus);\n                outline-offset: var(--w-outline-offset, 1px)\n            }\n\n            .focusable:focus, .focusable:focus-visible {\n                outline: 2px solid var(--w-s-color-border-focus);\n                outline-offset: var(--w-outline-offset, 1px)\n            }\n\n            .focusable:not(:focus-visible) {\n                outline: none\n            }\n\n            .peer:focus ~ .peer-focus\\\\:focusable, .peer:focus-visible ~ .peer-focus\\\\:focusable {\n                outline: 2px solid var(--w-s-color-border-focus);\n                outline-offset: var(--w-outline-offset, 1px)\n            }\n\n            .peer:not(:focus-visible) ~ .peer-focus\\\\:focusable {\n                outline: none\n            }\n\n            .focusable-inset {\n                --w-outline-offset: -3px\n            }\n\n            .gap-12 {\n                gap: 1.2rem\n            }\n\n            .gap-8 {\n                gap: .8rem\n            }\n\n            .gap-x-16 {\n                column-gap: 1.6rem\n            }\n\n            .gap-y-16 {\n                row-gap: 1.6rem\n            }\n\n            .row-span-2 {\n                grid-row: span 2/span 2\n            }\n\n            .col-span-2 {\n                grid-column: span 2/span 2\n            }\n\n            .col-span-3 {\n                grid-column: span 3/span 3\n            }\n\n            .row-start-1 {\n                grid-row-start: 1\n            }\n\n            .row-start-2 {\n                grid-row-start: 2\n            }\n\n            .col-start-2 {\n                grid-column-start: 2\n            }\n\n            .auto-rows-auto {\n                grid-auto-rows: auto\n            }\n\n            .grid-flow-col {\n                grid-auto-flow: column\n            }\n\n            .grid-rows-\\\\[20px_auto\\\\] {\n                grid-template-rows:20px auto\n            }\n\n            .grid-rows-\\\\[auto_20px\\\\] {\n                grid-template-rows:auto 20px\n            }\n\n            .grid-cols-\\\\[1fr_20px_1fr\\\\] {\n                grid-template-columns:1fr 20px 1fr\n            }\n\n            .grid-cols-\\\\[1fr_20px\\\\] {\n                grid-template-columns:1fr 20px\n            }\n\n            .grid-cols-\\\\[20px_1fr\\\\] {\n                grid-template-columns:20px 1fr\n            }\n\n            .grid-cols-\\\\[auto_1fr_auto\\\\] {\n                grid-template-columns:auto 1fr auto\n            }\n\n            .grid-cols-1 {\n                grid-template-columns:repeat(1, minmax(0, 1fr))\n            }\n\n            .grid-cols-2 {\n                grid-template-columns:repeat(2, minmax(0, 1fr))\n            }\n\n            .grid-cols-3 {\n                grid-template-columns:repeat(3, minmax(0, 1fr))\n            }\n\n            .grid-cols-4 {\n                grid-template-columns:repeat(4, minmax(0, 1fr))\n            }\n\n            .grid-cols-5 {\n                grid-template-columns:repeat(5, minmax(0, 1fr))\n            }\n\n            .grid-cols-6 {\n                grid-template-columns:repeat(6, minmax(0, 1fr))\n            }\n\n            .grid-cols-7 {\n                grid-template-columns:repeat(7, minmax(0, 1fr))\n            }\n\n            .grid-cols-8 {\n                grid-template-columns:repeat(8, minmax(0, 1fr))\n            }\n\n            .grid-cols-9 {\n                grid-template-columns:repeat(9, minmax(0, 1fr))\n            }\n\n            .overflow-hidden {\n                overflow: hidden\n            }\n\n            .overflow-x-hidden {\n                overflow-x: hidden\n            }\n\n            .overflow-y-auto {\n                overflow-y: auto\n            }\n\n            .list-none {\n                list-style-type: none\n            }\n\n            .outline-\\\\[--w-s-color-border-negative\\\\]\\\\! {\n                outline-color: var(--w-s-color-border-negative) !important\n            }\n\n            .outline-none {\n                outline: 2px solid transparent;\n                outline-offset: 2px\n            }\n\n            .focus\\\\:outline-none:focus {\n                outline: 2px solid transparent;\n                outline-offset: 2px\n            }\n\n            .items-start {\n                align-items: flex-start\n            }\n\n            .items-end {\n                align-items: flex-end\n            }\n\n            .items-center {\n                align-items: center\n            }\n\n            .self-center {\n                align-self: center\n            }\n\n            .inset-0 {\n                top: 0rem;\n                right: 0rem;\n                bottom: 0rem;\n                left: 0rem\n            }\n\n            .-bottom-0 {\n                bottom: -0rem\n            }\n\n            .bottom-0 {\n                bottom: 0rem\n            }\n\n            .bottom-10 {\n                bottom: 1rem\n            }\n\n            .bottom-16 {\n                bottom: 1.6rem\n            }\n\n            .left-0 {\n                left: 0rem\n            }\n\n            .left-4 {\n                left: .4rem\n            }\n\n            .right-0 {\n                right: 0rem\n            }\n\n            .right-8 {\n                right: .8rem\n            }\n\n            .top-\\\\[1\\\\.92rem\\\\] {\n                top: 1.92rem\n            }\n\n            .top-0 {\n                top: 0rem\n            }\n\n            .top-20 {\n                top: 2rem\n            }\n\n            .top-4 {\n                top: .4rem\n            }\n\n            .top-8 {\n                top: .8rem\n            }\n\n            .before\\\\:bottom-0:before {\n                bottom: 0rem\n            }\n\n            .before\\\\:left-0:before {\n                left: 0rem\n            }\n\n            .before\\\\:right-0:before {\n                right: 0rem\n            }\n\n            .before\\\\:top-2:before {\n                top: .2rem\n            }\n\n            .-bottom-\\\\[8px\\\\] {\n                bottom: -8px\n            }\n\n            .-left-\\\\[8px\\\\] {\n                left: -8px\n            }\n\n            .-right-\\\\[8px\\\\] {\n                right: -8px\n            }\n\n            .-top-\\\\[8px\\\\] {\n                top: -8px\n            }\n\n            .top-\\\\[19px\\\\] {\n                top: 19px\n            }\n\n            .top-\\\\[30\\\\%\\\\] {\n                top: 30%\n            }\n\n            .justify-end {\n                justify-content: flex-end\n            }\n\n            .justify-center {\n                justify-content: center\n            }\n\n            .justify-between {\n                justify-content: space-between\n            }\n\n            .justify-items-center {\n                justify-items: center\n            }\n\n            .justify-self-start {\n                justify-self: start\n            }\n\n            .justify-self-end {\n                justify-self: end\n            }\n\n            .justify-self-center {\n                justify-self: center\n            }\n\n            .absolute {\n                position: absolute\n            }\n\n            .fixed {\n                position: fixed\n            }\n\n            .relative {\n                position: relative\n            }\n\n            .open\\\\:fixed[open] {\n                position: fixed\n            }\n\n            .before\\\\:absolute:before {\n                position: absolute\n            }\n\n            .z-10, .peer:checked ~ .peer-checked\\\\:z-10 {\n                z-index: 10\n            }\n\n            .z-30 {\n                z-index: 30\n            }\n\n            .z-50 {\n                z-index: 50\n            }\n\n            .hover\\\\:z-30:hover {\n                z-index: 30\n            }\n\n            .\\\\!s-bg-selected {\n                background-color: var(--w-s-color-background-selected) !important\n            }\n\n            .s-bg {\n                background-color: var(--w-s-color-background)\n            }\n\n            .s-bg-disabled {\n                background-color: var(--w-s-color-background-disabled)\n            }\n\n            .s-bg-disabled-subtle {\n                background-color: var(--w-s-color-background-disabled-subtle)\n            }\n\n            .s-bg-info-subtle {\n                background-color: var(--w-s-color-background-info-subtle)\n            }\n\n            .s-bg-inverted {\n                background-color: var(--w-s-color-background-inverted)\n            }\n\n            .s-bg-negative {\n                background-color: var(--w-s-color-background-negative)\n            }\n\n            .s-bg-negative-subtle {\n                background-color: var(--w-s-color-background-negative-subtle)\n            }\n\n            .s-bg-positive-subtle {\n                background-color: var(--w-s-color-background-positive-subtle)\n            }\n\n            .s-bg-primary, .peer:checked ~ .peer-checked\\\\:s-bg-primary {\n                background-color: var(--w-s-color-background-primary)\n            }\n\n            .s-bg-selected {\n                background-color: var(--w-s-color-background-selected)\n            }\n\n            .s-bg-subtle {\n                background-color: var(--w-s-color-background-subtle)\n            }\n\n            .s-bg-warning-subtle {\n                background-color: var(--w-s-color-background-warning-subtle)\n            }\n\n            .peer:checked:hover ~ .peer-checked\\\\:peer-hover\\\\:before\\\\:s-bg-negative-hover:before {\n                background-color: var(--w-s-color-background-negative-hover)\n            }\n\n            .peer:checked:hover ~ .peer-checked\\\\:peer-hover\\\\:before\\\\:s-bg-primary-hover:before {\n                background-color: var(--w-s-color-background-primary-hover)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-bg-disabled:before {\n                background-color: var(--w-s-color-background-disabled)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-bg-negative:before {\n                background-color: var(--w-s-color-background-negative)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-bg-primary:before {\n                background-color: var(--w-s-color-background-primary)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-bg-disabled:before {\n                background-color: var(--w-s-color-background-disabled)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-bg-negative:before {\n                background-color: var(--w-s-color-background-negative)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-bg-primary:before {\n                background-color: var(--w-s-color-background-primary)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:hover\\\\:before\\\\:s-bg-negative-hover:hover:before {\n                background-color: var(--w-s-color-background-negative-hover)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:hover\\\\:before\\\\:s-bg-primary-hover:hover:before {\n                background-color: var(--w-s-color-background-primary-hover)\n            }\n\n            .\\\\!hover\\\\:s-bg-selected-hover:hover {\n                background-color: var(--w-s-color-background-selected-hover) !important\n            }\n\n            .group:hover .group-hover\\\\:s-bg-primary-hover {\n                background-color: var(--w-s-color-background-primary-hover)\n            }\n\n            .hover\\\\:before\\\\:s-bg-hover:hover:before {\n                background-color: var(--w-s-color-background-hover)\n            }\n\n            .hover\\\\:before\\\\:s-bg-negative-subtle-hover:hover:before {\n                background-color: var(--w-s-color-background-negative-subtle-hover)\n            }\n\n            .hover\\\\:s-bg-hover:hover {\n                background-color: var(--w-s-color-background-hover)\n            }\n\n            .hover\\\\:s-bg-negative-hover:hover {\n                background-color: var(--w-s-color-background-negative-hover)\n            }\n\n            .hover\\\\:s-bg-negative-subtle-hover:hover {\n                background-color: var(--w-s-color-background-negative-subtle-hover)\n            }\n\n            .hover\\\\:s-bg-primary-hover:hover {\n                background-color: var(--w-s-color-background-primary-hover)\n            }\n\n            .hover\\\\:s-bg-selected-hover:hover {\n                background-color: var(--w-s-color-background-selected-hover)\n            }\n\n            .peer:hover:not(:checked) ~ .peer-hover\\\\:peer-not-checked\\\\:s-bg-hover {\n                background-color: var(--w-s-color-background-hover)\n            }\n\n            .peer:hover ~ .peer-hover\\\\:before\\\\:s-bg-hover:before {\n                background-color: var(--w-s-color-background-hover)\n            }\n\n            .peer:hover ~ .peer-hover\\\\:before\\\\:s-bg-negative-subtle:before {\n                background-color: var(--w-s-color-background-negative-subtle)\n            }\n\n            .focus\\\\:s-bg-primary-hover:focus {\n                background-color: var(--w-s-color-background-primary-hover)\n            }\n\n            .\\\\!active\\\\:s-bg-selected-active:active {\n                background-color: var(--w-s-color-background-selected-active) !important\n            }\n\n            .active\\\\:s-bg-active:active {\n                background-color: var(--w-s-color-background-active)\n            }\n\n            .active\\\\:s-bg-negative-active:active {\n                background-color: var(--w-s-color-background-negative-active)\n            }\n\n            .active\\\\:s-bg-negative-subtle-active:active {\n                background-color: var(--w-s-color-background-negative-subtle-active)\n            }\n\n            .active\\\\:s-bg-primary-active:active {\n                background-color: var(--w-s-color-background-primary-active)\n            }\n\n            .active\\\\:s-bg-selected-active:active {\n                background-color: var(--w-s-color-background-selected-active)\n            }\n\n            .before\\\\:s-bg-disabled-subtle:before {\n                background-color: var(--w-s-color-background-disabled-subtle)\n            }\n\n            .before\\\\:s-bg:before {\n                background-color: var(--w-s-color-background)\n            }\n\n            .s-text {\n                color: var(--w-s-color-text)\n            }\n\n            .s-text-disabled {\n                color: var(--w-s-color-text-disabled)\n            }\n\n            .s-text-inverted, .peer:checked ~ .peer-checked\\\\:s-text-inverted {\n                color: var(--w-s-color-text-inverted)\n            }\n\n            .s-text-inverted-static {\n                color: var(--w-s-color-text-inverted-static)\n            }\n\n            .s-text-link {\n                color: var(--w-s-color-text-link)\n            }\n\n            .s-text-negative {\n                color: var(--w-s-color-text-negative)\n            }\n\n            .s-text-subtle {\n                color: var(--w-s-color-text-subtle)\n            }\n\n            .hover\\\\:s-text-link:hover {\n                color: var(--w-s-color-text-link)\n            }\n\n            .active\\\\:s-text:active {\n                color: var(--w-s-color-text)\n            }\n\n            .placeholder\\\\:s-text-placeholder::placeholder {\n                color: var(--w-s-color-text-placeholder)\n            }\n\n            .s-icon {\n                color: var(--w-s-color-icon)\n            }\n\n            .s-icon-info {\n                color: var(--w-s-color-icon-info)\n            }\n\n            .s-icon-inverted {\n                color: var(--w-s-color-icon-inverted)\n            }\n\n            .s-icon-negative {\n                color: var(--w-s-color-icon-negative)\n            }\n\n            .s-icon-positive {\n                color: var(--w-s-color-icon-positive)\n            }\n\n            .s-icon-warning {\n                color: var(--w-s-color-icon-warning)\n            }\n\n            .hover\\\\:s-icon-hover:hover {\n                color: var(--w-s-color-icon-hover)\n            }\n\n            .active\\\\:s-icon-active:active {\n                color: var(--w-s-color-icon-active)\n            }\n\n            .before\\\\:s-icon-inverted:before {\n                color: var(--w-s-color-icon-inverted)\n            }\n\n            .s-border {\n                border-color: var(--w-s-color-border)\n            }\n\n            .s-border-disabled {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .s-border-info-subtle {\n                border-color: var(--w-s-color-border-info-subtle)\n            }\n\n            .s-border-l-info {\n                border-left-color: var(--w-s-color-border-info)\n            }\n\n            .s-border-l-negative {\n                border-left-color: var(--w-s-color-border-negative)\n            }\n\n            .s-border-l-positive {\n                border-left-color: var(--w-s-color-border-positive)\n            }\n\n            .s-border-l-warning {\n                border-left-color: var(--w-s-color-border-warning)\n            }\n\n            .s-border-negative {\n                border-color: var(--w-s-color-border-negative)\n            }\n\n            .s-border-negative-subtle {\n                border-color: var(--w-s-color-border-negative-subtle)\n            }\n\n            .s-border-positive-subtle {\n                border-color: var(--w-s-color-border-positive-subtle)\n            }\n\n            .s-border-primary, .peer:checked ~ .peer-checked\\\\:s-border-primary {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .s-border-selected {\n                border-color: var(--w-s-color-border-selected)\n            }\n\n            .s-border-warning-subtle {\n                border-color: var(--w-s-color-border-warning-subtle)\n            }\n\n            .peer:checked:hover ~ .peer-checked\\\\:peer-hover\\\\:before\\\\:s-border-negative-hover:before {\n                border-color: var(--w-s-color-border-negative-hover)\n            }\n\n            .peer:checked:hover ~ .peer-checked\\\\:peer-hover\\\\:before\\\\:s-border-primary-hover:before {\n                border-color: var(--w-s-color-border-primary-hover)\n            }\n\n            .peer:checked:hover ~ .peer-checked\\\\:peer-hover\\\\:before\\\\:s-border-selected-hover:before {\n                border-color: var(--w-s-color-border-selected-hover)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-border-disabled:before {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-border-negative:before {\n                border-color: var(--w-s-color-border-negative)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-border-primary:before {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .peer:checked ~ .peer-checked\\\\:before\\\\:s-border-selected:before {\n                border-color: var(--w-s-color-border-selected)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-border-disabled:before {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-border-negative:before {\n                border-color: var(--w-s-color-border-negative)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:before\\\\:s-border-primary:before {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:hover\\\\:before\\\\:s-border-negative-hover:hover:before {\n                border-color: var(--w-s-color-border-negative-hover)\n            }\n\n            .peer:indeterminate ~ .peer-indeterminate\\\\:hover\\\\:before\\\\:s-border-primary-hover:hover:before {\n                border-color: var(--w-s-color-border-primary-hover)\n            }\n\n            .group:hover .group-hover\\\\:s-border-selected-hover {\n                border-color: var(--w-s-color-border-selected-hover)\n            }\n\n            .hover\\\\:before\\\\:s-border-negative-hover:hover:before {\n                border-color: var(--w-s-color-border-negative-hover)\n            }\n\n            .hover\\\\:before\\\\:s-border-primary:hover:before {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .hover\\\\:s-border-disabled:hover {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .hover\\\\:s-border-hover:hover {\n                border-color: var(--w-s-color-border-hover)\n            }\n\n            .hover\\\\:s-border-negative-hover:hover {\n                border-color: var(--w-s-color-border-negative-hover)\n            }\n\n            .hover\\\\:s-border-primary-hover:hover {\n                border-color: var(--w-s-color-border-primary-hover)\n            }\n\n            .hover\\\\:s-border-primary:hover {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .hover\\\\:s-border-selected-hover:hover {\n                border-color: var(--w-s-color-border-selected-hover)\n            }\n\n            .peer:hover ~ .peer-hover\\\\:before\\\\:s-border-negative-hover:before {\n                border-color: var(--w-s-color-border-negative-hover)\n            }\n\n            .peer:hover ~ .peer-hover\\\\:before\\\\:s-border-primary:before {\n                border-color: var(--w-s-color-border-primary)\n            }\n\n            .focus\\\\:s-border-primary-hover:focus {\n                border-color: var(--w-s-color-border-primary-hover)\n            }\n\n            .active\\\\:s-border-active:active {\n                border-color: var(--w-s-color-border-active)\n            }\n\n            .active\\\\:s-border-disabled:active {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .active\\\\:s-border-primary-active:active {\n                border-color: var(--w-s-color-border-primary-active)\n            }\n\n            .active\\\\:s-border-selected-active:active {\n                border-color: var(--w-s-color-border-selected-active)\n            }\n\n            .active\\\\:s-border-selected:active {\n                border-color: var(--w-s-color-border-selected)\n            }\n\n            .group:active .group-active\\\\:s-border-active {\n                border-color: var(--w-s-color-border-active)\n            }\n\n            .group:active .group-active\\\\:s-border-selected-active {\n                border-color: var(--w-s-color-border-selected-active)\n            }\n\n            .before\\\\:s-border-disabled:before {\n                border-color: var(--w-s-color-border-disabled)\n            }\n\n            .before\\\\:s-border-negative:before {\n                border-color: var(--w-s-color-border-negative)\n            }\n\n            .s-surface-sunken {\n                background-color: var(--w-s-color-surface-sunken)\n            }\n\n            .s-surface-elevated-200 {\n                background-color: var(--w-s-color-surface-elevated-200);\n                box-shadow: var(--w-s-shadow-surface-elevated-200)\n            }\n\n            .hover\\\\:s-surface-elevated-200-hover:hover {\n                background-color: var(--w-s-color-surface-elevated-200-hover);\n                box-shadow: var(--w-s-shadow-surface-elevated-200-hover)\n            }\n\n            .active\\\\:s-surface-elevated-200-active:active {\n                background-color: var(--w-s-color-surface-elevated-200-active);\n                box-shadow: var(--w-s-shadow-surface-elevated-200-active)\n            }\n\n            .drop-shadow-m {\n                filter: drop-shadow(rgba(64, 64, 64, .24) 0 3px 8px) drop-shadow(rgba(64, 64, 64, .16) 0 3px 6px)\n            }\n\n            .shadow-m {\n                box-shadow: var(--w-shadow-m)\n            }\n\n            .shadow-s {\n                box-shadow: var(--w-shadow-s)\n            }\n\n            .shadow-\\\\[--w-shadow-slider\\\\] {\n                box-shadow: var(--w-shadow-slider)\n            }\n\n            .hover\\\\:shadow-\\\\[--w-shadow-slider-handle-hover\\\\]:hover {\n                box-shadow: var(--w-shadow-slider-handle-hover)\n            }\n\n            .focus\\\\:shadow-\\\\[--w-shadow-slider-handle-hover\\\\]:focus {\n                box-shadow: var(--w-shadow-slider-handle-hover)\n            }\n\n            .active\\\\:shadow-\\\\[--w-shadow-slider-handle-active\\\\]:active {\n                box-shadow: var(--w-shadow-slider-handle-active)\n            }\n\n            .h-0 {\n                height: 0rem\n            }\n\n            .h-16 {\n                height: 1.6rem\n            }\n\n            .h-2 {\n                height: .2rem\n            }\n\n            .h-20 {\n                height: 2rem\n            }\n\n            .h-24 {\n                height: 2.4rem\n            }\n\n            .h-4 {\n                height: .4rem\n            }\n\n            .h-44 {\n                height: 4.4rem\n            }\n\n            .h-6 {\n                height: .6rem\n            }\n\n            .h-8 {\n                height: .8rem\n            }\n\n            .h-full {\n                height: 100%\n            }\n\n            .h-unset {\n                height: unset\n            }\n\n            .max-h-unset {\n                max-height: unset\n            }\n\n            .max-w-full {\n                max-width: 100%\n            }\n\n            .max-w-max {\n                max-width: max-content\n            }\n\n            .max-w-unset {\n                max-width: unset\n            }\n\n            .min-h-32 {\n                min-height: 3.2rem\n            }\n\n            .min-h-40 {\n                min-height: 4rem\n            }\n\n            .min-w-16 {\n                min-width: 1.6rem\n            }\n\n            .min-w-32 {\n                min-width: 3.2rem\n            }\n\n            .w-16 {\n                width: 1.6rem\n            }\n\n            .w-2 {\n                width: .2rem\n            }\n\n            .w-20 {\n                width: 2rem\n            }\n\n            .w-24 {\n                width: 2.4rem\n            }\n\n            .w-32 {\n                width: 3.2rem\n            }\n\n            .w-40 {\n                width: 4rem\n            }\n\n            .w-44 {\n                width: 4.4rem\n            }\n\n            .w-8 {\n                width: .8rem\n            }\n\n            .w-full {\n                width: 100%\n            }\n\n            .w-max {\n                width: max-content\n            }\n\n            .w-unset {\n                width: unset\n            }\n\n            .before\\\\:h-20:before {\n                height: 2rem\n            }\n\n            .before\\\\:h-full:before {\n                height: 100%\n            }\n\n            .before\\\\:w-20:before {\n                width: 2rem\n            }\n\n            .before\\\\:w-32:before {\n                width: 3.2rem\n            }\n\n            .h-\\\\[--w-modal-height\\\\] {\n                height: var(--w-modal-height)\n            }\n\n            .h-\\\\[14px\\\\] {\n                height: 14px\n            }\n\n            .h-\\\\[16px\\\\] {\n                height: 16px\n            }\n\n            .max-h-\\\\[--w-modal-max-height\\\\] {\n                max-height: var(--w-modal-max-height)\n            }\n\n            .min-h-\\\\[--w-modal-min-height\\\\] {\n                min-height: var(--w-modal-min-height)\n            }\n\n            .min-h-\\\\[32px\\\\] {\n                min-height: 32px\n            }\n\n            .min-h-\\\\[40px\\\\] {\n                min-height: 40px\n            }\n\n            .min-h-\\\\[42\\\\] {\n                min-height: 4.2rem\n            }\n\n            .min-h-\\\\[44px\\\\] {\n                min-height: 44px\n            }\n\n            .min-w-\\\\[32px\\\\] {\n                min-width: 32px\n            }\n\n            .min-w-\\\\[40px\\\\] {\n                min-width: 40px\n            }\n\n            .min-w-\\\\[44px\\\\] {\n                min-width: 44px\n            }\n\n            .w-\\\\[--w-modal-width\\\\] {\n                width: var(--w-modal-width)\n            }\n\n            .w-\\\\[14px\\\\] {\n                width: 14px\n            }\n\n            .w-\\\\[16px\\\\] {\n                width: 16px\n            }\n\n            .space-x-8 > :not([hidden]) ~ :not([hidden]) {\n                --w-space-x-reverse: 0;\n                margin-left: calc(.8rem * calc(1 - var(--w-space-x-reverse)));\n                margin-right: calc(.8rem * var(--w-space-x-reverse))\n            }\n\n            .space-y-16 > :not([hidden]) ~ :not([hidden]) {\n                --w-space-y-reverse: 0;\n                margin-top: calc(1.6rem * calc(1 - var(--w-space-y-reverse)));\n                margin-bottom: calc(1.6rem * var(--w-space-y-reverse))\n            }\n\n            .m-0 {\n                margin: 0rem\n            }\n\n            .m-auto {\n                margin: auto\n            }\n\n            .-mx-16 {\n                margin-left: -1.6rem;\n                margin-right: -1.6rem\n            }\n\n            .mx-0 {\n                margin-left: 0rem;\n                margin-right: 0rem\n            }\n\n            .mx-8 {\n                margin-left: .8rem;\n                margin-right: .8rem\n            }\n\n            .mx-auto {\n                margin-left: auto;\n                margin-right: auto\n            }\n\n            .-mb-1 {\n                margin-bottom: -.1rem\n            }\n\n            .-ml-8 {\n                margin-left: -.8rem\n            }\n\n            .-mr-1 {\n                margin-right: -.1rem\n            }\n\n            .-mr-8 {\n                margin-right: -.8rem\n            }\n\n            .-mt-2 {\n                margin-top: -.2rem\n            }\n\n            .-mt-4 {\n                margin-top: -.4rem\n            }\n\n            .last-child\\\\:mb-0 > :last-child, .mb-0 {\n                margin-bottom: 0rem\n            }\n\n            .mb-32 {\n                margin-bottom: 3.2rem\n            }\n\n            .ml-8 {\n                margin-left: .8rem\n            }\n\n            .ml-auto {\n                margin-left: auto\n            }\n\n            .mr-8 {\n                margin-right: .8rem\n            }\n\n            .mt-16 {\n                margin-top: 1.6rem\n            }\n\n            .mt-4 {\n                margin-top: .4rem\n            }\n\n            .group:not(:first-child) .group-not-first\\\\:-ml-2 {\n                margin-left: -.2rem\n            }\n\n            .last\\\\:mb-0:last-child {\n                margin-bottom: 0rem\n            }\n\n            .last\\\\:mr-0:last-child {\n                margin-right: 0rem\n            }\n\n            .m-\\\\[8px\\\\] {\n                margin: 8px\n            }\n\n            .p-0 {\n                padding: 0rem\n            }\n\n            .p-16 {\n                padding: 1.6rem\n            }\n\n            .p-4 {\n                padding: .4rem\n            }\n\n            .p-8 {\n                padding: .8rem\n            }\n\n            .px-0 {\n                padding-left: 0rem;\n                padding-right: 0rem\n            }\n\n            .px-1 {\n                padding-left: .1rem;\n                padding-right: .1rem\n            }\n\n            .px-12 {\n                padding-left: 1.2rem;\n                padding-right: 1.2rem\n            }\n\n            .px-14 {\n                padding-left: 1.4rem;\n                padding-right: 1.4rem\n            }\n\n            .px-16 {\n                padding-left: 1.6rem;\n                padding-right: 1.6rem\n            }\n\n            .px-8 {\n                padding-left: .8rem;\n                padding-right: .8rem\n            }\n\n            .py-0 {\n                padding-top: 0rem;\n                padding-bottom: 0rem\n            }\n\n            .py-1 {\n                padding-top: .1rem;\n                padding-bottom: .1rem\n            }\n\n            .py-10 {\n                padding-top: 1rem;\n                padding-bottom: 1rem\n            }\n\n            .py-12 {\n                padding-top: 1.2rem;\n                padding-bottom: 1.2rem\n            }\n\n            .py-2 {\n                padding-top: .2rem;\n                padding-bottom: .2rem\n            }\n\n            .py-4 {\n                padding-top: .4rem;\n                padding-bottom: .4rem\n            }\n\n            .py-6 {\n                padding-top: .6rem;\n                padding-bottom: .6rem\n            }\n\n            .py-8 {\n                padding-top: .8rem;\n                padding-bottom: .8rem\n            }\n\n            .pb-0 {\n                padding-bottom: 0rem\n            }\n\n            .pb-32 {\n                padding-bottom: 3.2rem\n            }\n\n            .pb-4 {\n                padding-bottom: .4rem\n            }\n\n            .pb-8 {\n                padding-bottom: .8rem\n            }\n\n            .pl-0 {\n                padding-left: 0rem\n            }\n\n            .pl-1 {\n                padding-left: .1rem\n            }\n\n            .pl-12 {\n                padding-left: 1.2rem\n            }\n\n            .pl-28 {\n                padding-left: 2.8rem\n            }\n\n            .pl-4 {\n                padding-left: .4rem\n            }\n\n            .pl-8 {\n                padding-left: .8rem\n            }\n\n            .pr-12 {\n                padding-right: 1.2rem\n            }\n\n            .pr-14 {\n                padding-right: 1.4rem\n            }\n\n            .pr-2 {\n                padding-right: .2rem\n            }\n\n            .pr-32 {\n                padding-right: 3.2rem\n            }\n\n            .pr-40 {\n                padding-right: 4rem\n            }\n\n            .pt-0 {\n                padding-top: 0rem\n            }\n\n            .pt-1 {\n                padding-top: .1rem\n            }\n\n            .pt-16 {\n                padding-top: 1.6rem\n            }\n\n            .pt-24 {\n                padding-top: 2.4rem\n            }\n\n            .pt-8 {\n                padding-top: .8rem\n            }\n\n            .group\\\\/step:last-child .group-last\\\\/step\\\\:last\\\\:pb-0:last-child {\n                padding-bottom: 0rem\n            }\n\n            .last\\\\:pb-1:last-child {\n                padding-bottom: .1rem\n            }\n\n            .last\\\\:pr-1:last-child {\n                padding-right: .1rem\n            }\n\n            .p-\\\\[8px\\\\] {\n                padding: 8px\n            }\n\n            .px-\\\\[15px\\\\] {\n                padding-left: 15px;\n                padding-right: 15px\n            }\n\n            .px-\\\\[8px\\\\] {\n                padding-left: 8px;\n                padding-right: 8px\n            }\n\n            .py-\\\\[11px\\\\] {\n                padding-top: 11px;\n                padding-bottom: 11px\n            }\n\n            .py-\\\\[5px\\\\] {\n                padding-top: 5px;\n                padding-bottom: 5px\n            }\n\n            .py-\\\\[7px\\\\] {\n                padding-top: 7px;\n                padding-bottom: 7px\n            }\n\n            .pl-\\\\[var\\\\(--w-prefix-width\\\\,_40px\\\\)\\\\] {\n                padding-left: var(--w-prefix-width, 40px)\n            }\n\n            .invisible {\n                visibility: hidden\n            }\n\n            .backface-hidden {\n                backface-visibility: hidden\n            }\n\n            .break-words {\n                overflow-wrap: break-word\n            }\n\n            .before\\\\:content-\\\\[\\\\\"\u00E2\u20AC\u201C\\\\\"\\\\]:before {\n                content: \"\u00E2\u20AC\u201C\"\n            }\n\n            .before\\\\:content-\\\\[\\\\\"\\\\\"\\\\]:before {\n                content: \"\"\n            }\n\n            .cursor-default {\n                cursor: default\n            }\n\n            .cursor-pointer {\n                cursor: pointer\n            }\n\n            .antialiased {\n                -webkit-font-smoothing: antialiased;\n                -moz-osx-font-smoothing: grayscale;\n                font-smoothing: grayscale\n            }\n\n            .font-bold {\n                font-weight: 700\n            }\n\n            .before\\\\:font-bold:before {\n                font-weight: 700\n            }\n\n            .font-normal {\n                font-weight: 400\n            }\n\n            .pointer-events-auto {\n                pointer-events: auto\n            }\n\n            .pointer-events-none {\n                pointer-events: none\n            }\n\n            .before\\\\:pointer-events-none:before {\n                pointer-events: none\n            }\n\n            .pb-safe-\\\\[32\\\\] {\n                padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px))\n            }\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\n            .touch-pan-y {\n                touch-action: pan-y\n            }\n\n            .select-none {\n                -webkit-user-select: none;\n                user-select: none\n            }\n\n            .translate-x-20 {\n                --w-translate-x: 2rem;\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .translate-z-0 {\n                --w-translate-z: 0rem;\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .-rotate-180, .part-\\\\[w-icon-chevron-down-16-part\\\\]\\\\:-rotate-180::part(w-icon-chevron-down-16-part) {\n                --w-rotate-x: 0;\n                --w-rotate-y: 0;\n                --w-rotate-z: 0;\n                --w-rotate: -180deg;\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .part-\\\\[w-icon-chevron-up-16-part\\\\]\\\\:rotate-180::part(w-icon-chevron-up-16-part), .rotate-180 {\n                --w-rotate-x: 0;\n                --w-rotate-y: 0;\n                --w-rotate-z: 0;\n                --w-rotate: 180deg;\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .rotate-90 {\n                --w-rotate-x: 0;\n                --w-rotate-y: 0;\n                --w-rotate-z: 0;\n                --w-rotate: 90deg;\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .part-\\\\[w-icon-chevron-down-16-part\\\\]\\\\:transform::part(w-icon-chevron-down-16-part), .part-\\\\[w-icon-chevron-up-16-part\\\\]\\\\:transform::part(w-icon-chevron-up-16-part), .transform {\n                transform: translate(var(--w-translate-x)) translateY(var(--w-translate-y)) translateZ(var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .part-\\\\[w-icon-chevron-down-16-part\\\\]\\\\:transform-gpu::part(w-icon-chevron-down-16-part), .part-\\\\[w-icon-chevron-up-16-part\\\\]\\\\:transform-gpu::part(w-icon-chevron-up-16-part), .transform-gpu {\n                transform: translate3d(var(--w-translate-x), var(--w-translate-y), var(--w-translate-z)) rotate(var(--w-rotate)) rotateX(var(--w-rotate-x)) rotateY(var(--w-rotate-y)) rotate(var(--w-rotate-z)) skew(var(--w-skew-x)) skewY(var(--w-skew-y)) scaleX(var(--w-scale-x)) scaleY(var(--w-scale-y)) scaleZ(var(--w-scale-z))\n            }\n\n            .part-\\\\[w-icon-chevron-down-16-part\\\\]\\\\:transition-transform::part(w-icon-chevron-down-16-part), .part-\\\\[w-icon-chevron-up-16-part\\\\]\\\\:transition-transform::part(w-icon-chevron-up-16-part), .transition-transform {\n                transition-property: transform;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .15s\n            }\n\n            .transition-300 {\n                transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .3s\n            }\n\n            .transition-all {\n                transition-property: all;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .15s\n            }\n\n            .transition-colors {\n                transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .15s\n            }\n\n            .transition-shadow {\n                transition-property: box-shadow;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .15s\n            }\n\n            .before\\\\:transition-all:before {\n                transition-property: all;\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n                transition-duration: .15s\n            }\n\n            .duration-300 {\n                transition-duration: .3s\n            }\n\n            .ease-in-out, .part-\\\\[w-icon-chevron-down-16-part\\\\]\\\\:ease-in-out::part(w-icon-chevron-down-16-part), .part-\\\\[w-icon-chevron-up-16-part\\\\]\\\\:ease-in-out::part(w-icon-chevron-up-16-part) {\n                transition-timing-function: cubic-bezier(.4, 0, .2, 1)\n            }\n\n            .text-m {\n                font-size: var(--w-font-size-m);\n                line-height: var(--w-line-height-m)\n            }\n\n            .text-s {\n                font-size: var(--w-font-size-s);\n                line-height: var(--w-line-height-s)\n            }\n\n            .text-xs {\n                font-size: var(--w-font-size-xs);\n                line-height: var(--w-line-height-xs)\n            }\n\n            .leading-m {\n                line-height: var(--w-line-height-m)\n            }\n\n            .before\\\\:leading-xs:before {\n                line-height: var(--w-line-height-xs)\n            }\n\n            .leading-\\\\[24\\\\] {\n                line-height: 2.4rem\n            }\n\n            @media (max-width: 479.9px) {\n                .lt-sm\\\\:rounded-b-0 {\n                    border-bottom-left-radius: 0;\n                    border-bottom-right-radius: 0\n                }\n            }\n            @media (min-width: 480px) {\n                .sm\\\\:border-b-0 {\n                    border-bottom-width: 0\n                }\n\n                .sm\\\\:rounded-8 {\n                    border-radius: 8px\n                }\n\n                .sm\\\\:rounded-b-8 {\n                    border-bottom-left-radius: 8px;\n                    border-bottom-right-radius: 8px\n                }\n\n                .sm\\\\:gap-16 {\n                    gap: 1.6rem\n                }\n\n                .sm\\\\:place-content-center {\n                    place-content: center\n                }\n\n                .sm\\\\:place-items-center {\n                    place-items: center\n                }\n\n                .sm\\\\:h-24 {\n                    height: 2.4rem\n                }\n\n                .sm\\\\:min-h-48 {\n                    min-height: 4.8rem\n                }\n\n                .sm\\\\:w-24 {\n                    width: 2.4rem\n                }\n\n                .sm\\\\:min-h-\\\\[32px\\\\] {\n                    min-height: 32px\n                }\n\n                .sm\\\\:min-h-\\\\[44px\\\\] {\n                    min-height: 44px\n                }\n\n                .sm\\\\:min-h-\\\\[45\\\\] {\n                    min-height: 4.5rem\n                }\n\n                .sm\\\\:min-w-\\\\[32px\\\\] {\n                    min-width: 32px\n                }\n\n                .sm\\\\:min-w-\\\\[44px\\\\] {\n                    min-width: 44px\n                }\n\n                .sm\\\\:mx-0 {\n                    margin-left: 0rem;\n                    margin-right: 0rem\n                }\n\n                .sm\\\\:mx-16 {\n                    margin-left: 1.6rem;\n                    margin-right: 1.6rem\n                }\n\n                .sm\\\\:-ml-12 {\n                    margin-left: -1.2rem\n                }\n\n                .sm\\\\:-mr-12 {\n                    margin-right: -1.2rem\n                }\n\n                .sm\\\\:-mt-8 {\n                    margin-top: -.8rem\n                }\n\n                .sm\\\\:px-32 {\n                    padding-left: 3.2rem;\n                    padding-right: 3.2rem\n                }\n\n                .sm\\\\:py-0 {\n                    padding-top: 0rem;\n                    padding-bottom: 0rem\n                }\n\n                .sm\\\\:pb-32 {\n                    padding-bottom: 3.2rem\n                }\n\n                .sm\\\\:pt-24 {\n                    padding-top: 2.4rem\n                }\n\n                .sm\\\\:pt-32 {\n                    padding-top: 3.2rem\n                }\n            }\n            @media (min-width: 768px) {\n                .md\\\\:block {\n                    display: block\n                }\n\n                .md\\\\:hidden {\n                    display: none\n                }\n            }\n        `);\n", "import { css } from \"lit\";\n\nexport const styles = css`\n    :host {\n        display: block;\n\n        --_snackbar-item-bg: var(--w-c-snackbar-item-bg, var(--w-color-tooltip-background-static));\n        --_snackbar-item-action-bg-hover: var(--w-c-snackbar-item-action-bg-hover, var(--w-color-tooltip-background-static));\n        --_snackbar-item-action-bg-active: var(--w-c-snackbar-item-action-bg-active, var(--w-color-tooltip-background-static));\n        --_snackbar-item-border-radius: var(--w-c-snackbar-item-radius, 8px);\n        --_snackbar-item-box-shadow: var(--w-c-snackbar-item-box-shadow, var(--w-shadow-l));\n        --_snackbar-item-color: var(--w-c-snackbar-item-color, var(--w-s-color-text-inverted-static));\n        --_snackbar-item-action-color-hover: var(--w-c-snackbar-item-action-color-hover, var(--w-s-color-text-inverted-static));\n        --_snackbar-item-action-color-active: var(--w-c-snackbar-item-action-color-active, var(--w-s-color-text-inverted-static));\n        --_snackbar-item-max-width: var(--w-c-snackbar-item-max-width, 480px);\n        --_snackbar-item-min-width: var(--w-c-snackbar-item-min-width, 328px);\n        --_snackbar-item-padding: var(--w-c-snackbar-item-padding, 8px);\n    }\n\n    /* Using a padding-less div as target so we get animation to and from zero height */\n    .animation-wrapper {\n        border-radius: var(--_snackbar-item-border-radius); /* Avoid sharp bottom corners during the transitino */\n    }\n\n    [part='item'] {\n        background-color: var(--_snackbar-item-bg);\n        border-radius: var(--_snackbar-item-border-radius);\n        box-shadow: var(--_snackbar-item-box-shadow);\n        color: var(--_snackbar-item-color);\n        max-width: var(--_snackbar-item-max-width);\n        min-width: var(--_snackbar-item-min-width);\n        padding: var(--_snackbar-item-padding);\n        \n        display: grid;\n        column-gap: 8px;\n        grid-template:\n            \"icon message inline-action\"\n            \"block-action block-action block-action\";\n        grid-template-columns: auto 1fr auto;\n        align-items: center;\n    }\n\n    [part='item'] w-button,\n    [part='item'] ::slotted(w-button) {\n        --w-c-button-bg: var(--_snackbar-item-bg);\n        --w-c-button-bg-active: var(--_snackbar-item-action-bg-active);\n        --w-c-button-bg-hover: var(--_snackbar-item-action-bg-hover);\n        --w-c-button-color: var(--_snackbar-item-color);\n        --w-c-button-color-active: var(--_snackbar-item-action-color-active);\n        --w-c-button-color-hover: var(--_snackbar-item-action-color-hover);\n    }\n\n    [part='icon'] {\n        grid-area: icon;\n\n        color: var(--_snackbar-item-color);\n        padding-block: 4px;\n    }\n\n    [part='icon'] ::slotted(w-icon) {\n        display: block; /* override default inline-block to avoid line-height */\n        margin-inline-start: 4px;\n    }\n\n    [part='icon'] ::slotted(w-icon[name=\"SuccessFilled\"]) {\n        color: var(--w-s-color-icon-positive);\n    }\n    \n    [part='icon'] ::slotted(w-icon[name=\"WarningFilled\"]) {\n        color: var(--w-s-color-icon-warning);\n    }\n    \n    [part='icon'] ::slotted(w-icon[name=\"ErrorFilled\"]) {\n        color: var(--w-s-color-icon-negative);\n    }\n    \n    [part='icon'] ::slotted(w-icon[name=\"InfoFilled\"]) {\n        color: var(--w-s-color-icon-info);\n    }\n    \n    [part='message'] {\n        grid-area: message;\n\n        align-self: center;\n        font-size: var(--w-font-size-s);\n        line-height: var(--w-line-height-s);\n        padding-block: 7px;\n    }\n\n    [part='action'] {\n        grid-area: inline-action;\n\n        display: flex;\n        column-gap: 2px; /* to allow space for focus outline */\n        justify-content: flex-end;\n        padding-inline-start: 8px;\n    }\n    \n    :host([action-placement='block']) [part='action'] {\n        grid-area: block-action;\n\n    }\n\n    w-attention [slot='message'] {\n        font-size: var(--w-font-size-s);\n        line-height: var(--w-line-height-s);\n    }\n\n    kbd {\n        font-family: var(--w-font-family);\n    }\n`;\n"],
+  "mappings": "ikBAAA,OAAS,QAAAA,EAAM,cAAAC,MAAkC,MACjD,OAAS,YAAAC,EAAU,SAAAC,EAAO,SAAAC,MAAa,oBCDvC,IAAMC,EAAgB,OAAO,OAAW,IAEpCC,EAAgB,GAEpB,GAAID,EAAc,CAChB,IAAME,EAAQ,OAAO,WAAW,kCAAkC,EAC5DC,EAAW,CAAC,CAAE,QAAAC,CAAQ,IAAMH,EAAgB,CAACG,EAE/CF,EAAM,kBAAkBA,EAAM,iBAAiB,SAAUC,CAAQ,EACrEA,EAASD,CAAK,CAChB,CAEA,IAAMG,EAAmBC,GAAM,CAC7BA,EAAG,MAAM,WAAa,KACtBA,EAAG,MAAM,mBAAqB,KAC9BA,EAAG,MAAM,SAAW,IACtB,EAEMC,EAAiBD,GAAO,CAG5B,IAAME,EAAS,iEACfF,EAAG,MAAM,WAAa,UAAUE,CAAM,GACtCF,EAAG,MAAM,mBAAqB,SAC9BA,EAAG,MAAM,SAAW,QACtB,EAEMG,EAAyB,CAACH,EAAII,IAAS,IAAM,CACjDJ,EAAG,MAAM,OAAS,OAClBA,EAAG,MAAM,SAAW,KAChBI,GAAMA,EAAK,CACjB,EAEMC,EAA4BD,GAAS,IAAM,CAC3CA,GAAMA,EAAK,CACjB,EAOaE,EAAS,CAACN,EAAII,IAAS,CAClC,IAAMG,GAAiB,IAAM,CAC3B,GAAI,CAACH,EAAM,OAAO,IAAI,QAAQI,GAAK,CAAEJ,EAAOI,CAAE,CAAC,CACjD,GAAG,EAEH,GAAI,CAACb,EACH,OAAAK,EAAG,MAAM,OAAS,OACdI,GAAMA,EAAK,EACRG,EAGT,IAAME,EAAsBN,EAAuBH,EAAII,CAAI,EAC3DL,EAAiBC,CAAE,EACnBA,EAAG,MAAM,OAAS,OAClB,IAAMU,EAAOV,EAAG,aAQhB,GAPAN,GAAgB,sBAAsB,IAAM,CAC1CM,EAAG,iBAAiB,gBAAiBS,EAAqB,CAAE,KAAM,EAAK,CAAC,EACxET,EAAG,MAAM,OAAS,MAClBA,EAAG,MAAM,yBAA2B,WACpCC,EAAcD,CAAE,EAChB,sBAAsB,IAAMA,EAAG,MAAM,OAASU,EAAO,IAAI,CAC3D,CAAC,EACGH,EAAe,OAAOA,CAC5B,EAOaI,EAAW,CAACX,EAAII,IAAS,CACpC,IAAMG,GAAiB,IAAM,CAC3B,GAAI,CAACH,EAAM,OAAO,IAAI,QAAQI,GAAK,CAAEJ,EAAOI,CAAE,CAAC,CACjD,GAAG,EAEH,GAAI,CAACb,EACH,OAAAK,EAAG,MAAM,OAAS,MACdI,GAAMA,EAAK,EACRG,EAGT,IAAMK,EAAwBP,EAAyBD,CAAI,EAC3DL,EAAiBC,CAAE,EACnB,IAAMa,EAAWb,EAAG,aASpB,GARAN,GAAgB,sBAAsB,IAAM,CAC1CM,EAAG,iBAAiB,gBAAiBY,EAAuB,CAAE,KAAM,EAAK,CAAC,EAC1EZ,EAAG,MAAM,OAASa,EAAW,KAC7Bb,EAAG,MAAM,yBAA2B,UACpCC,EAAcD,CAAE,EAChB,sBAAsB,IAAMA,EAAG,MAAM,OAAS,KAAK,CACrD,CAAC,EAEGO,EAAe,OAAOA,CAC5B,EC/FA,OAAS,OAAAO,MAAW,MAoRpB,OAAS,aAAAC,MAAiB,MAlRnB,IAAMC,EAAQF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqRRG,EAAaF,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAsnE3B,EC74ET,OAAS,OAAAG,MAAW,MAEb,IAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EHSf,IAAKE,OACRA,IAAA,MAAQ,KAAR,QACAA,IAAA,KAAO,KAAP,OACAA,IAAA,SAAW,MAAX,WAHQA,OAAA,IAXZC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAgDaC,EAAN,cAA+BC,CAAW,CAA1C,kCAAAC,EAAA,KAAAR,GAOH,qBAA2C,SAM3C,cAAmB,IAMnB,KAAQ,UAAY,GAEpBQ,EAAA,KAAAb,EAAY,IAEZa,EAAA,KAAAZ,EAAwB,KAExBY,EAAA,KAAAX,EAAmC,MAGnCW,EAAA,KAAAV,EAA+C,MAE/CU,EAAA,KAAAT,EAAe,IAEf,mBAA0B,CACtB,MAAM,kBAAkB,EAEpB,KAAK,WAAa,OAKlBU,EAAA,KAAKb,EAAgB,KAAK,SAAW,KAErCa,EAAA,KAAKX,EAAS,YAAY,IAAM,CACxBY,EAAA,KAAKX,KAETU,EAAA,KAAKb,EAALc,EAAA,KAAKd,GAAiB,KAElBc,EAAA,KAAKd,IAAiB,GACtB,KAAK,MAAM,EAEnB,EAAG,GAAiB,GAE5B,CAEA,sBAA6B,CACrBc,EAAA,KAAKZ,IACL,cAAcY,EAAA,KAAKZ,EAAM,CAEjC,CAEA,MAAM,SAAyB,CACtB,KAAK,OAGLY,EAAA,KAAKf,KAIN,MAAM,KAAK,eACXgB,EAAO,KAAK,KAAM,IAAM,CACpBF,EAAA,KAAKd,EAAY,GACrB,CAAC,GAET,CAOA,OAAc,CACNe,EAAA,KAAKb,IACLa,EAAA,KAAKb,GAAa,MAAM,EAExBa,EAAA,KAAKf,IAAa,KAAK,KACvBiB,EAAS,KAAK,KAAM,IAAM,CACtB,KAAK,OAAO,CAChB,CAAC,EAED,KAAK,OAAO,CAEpB,CAuDU,cAAe,CAErB,KAAK,UAAYC,EAAA,KAAKb,EAAAK,GAAL,UACrB,CAEA,QAAS,CACL,GAAI,KAAK,WAAa,SAAS,gBAAgB,QAAQ,sBAA2B,OAAQ,CACtF,IAAMS,EAAW,OAAO,UAAU,UAAU,SAAS,WAAW,EAAI,SAAM,MAC1E,OAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0CASuBF,EAAA,KAAKb,EAAAG,EAAa;AAAA,0CAClBU,EAAA,KAAKb,EAAAI,EAAa;AAAA,uCACrBS,EAAA,KAAKb,EAAAC,EAAU;AAAA,wCACdY,EAAA,KAAKb,EAAAE,EAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAgBzBY,CAAQ;AAAA;AAAA;AAAA,aAI/B,CACA,OAAOC;AAAA;AAAA;AAAA,kCAGmBF,EAAA,KAAKb,EAAAG,EAAa;AAAA,kCAClBU,EAAA,KAAKb,EAAAI,EAAa;AAAA,+BACrBS,EAAA,KAAKb,EAAAC,EAAU;AAAA,gCACdY,EAAA,KAAKb,EAAAE,EAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAe5C,CACJ,EA5LIP,EAAA,YAEAC,EAAA,YAEAC,EAAA,YAGAC,EAAA,YAEAC,EAAA,YA9BGC,EAAA,YAuGHC,EAAU,SAACe,EAAe,CACjBN,EAAA,KAAKb,KACNY,EAAA,KAAKV,EAAe,IAChBiB,EAAE,eAAkBA,EAAE,cAA8B,OACpDP,EAAA,KAAKZ,EAAemB,EAAE,eAGlC,EAQAd,EAAW,SAACc,EAAe,EAEnB,CAACA,EAAE,eACH,CAAC,KAAK,YAAY,KAAK,SAASA,EAAE,aAA4B,KAE9DP,EAAA,KAAKV,EAAe,IACpBU,EAAA,KAAKZ,EAAe,MAE5B,EAEAM,EAAa,UAAG,CACZM,EAAA,KAAKV,EAAe,GACxB,EAEAK,EAAa,UAAG,CAEPM,EAAA,KAAKb,IACNY,EAAA,KAAKV,EAAe,GAE5B,EAEAM,EAAU,UAAG,CACT,IAAMY,EAAa,KAAK,YAAY,cAA+B,qBAAqB,EACxF,OAAKA,EACoBA,EAAW,iBAAiB,EAC7B,OAAS,EAFT,EAG5B,EAhJSX,EACF,OAAS,CAACY,EAAOC,CAAM,EAM9BC,EAAA,CADCC,EAAS,CAAE,UAAW,mBAAoB,QAAS,GAAM,WAAY,EAAK,CAAC,GANnEf,EAOT,+BAMAc,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,GAAM,WAAY,EAAK,CAAC,GAZlDf,EAaT,wBAGQc,EAAA,CADPE,EAAM,oBAAoB,GAflBhB,EAgBD,oBAGAc,EAAA,CADPG,EAAM,GAlBEjB,EAmBD,yBAsMP,eAAe,IAAI,iBAAiB,GACvC,eAAe,OAAO,kBAAmBA,CAAgB",
+  "names": ["html", "LitElement", "property", "query", "state", "windowExists", "prefersMotion", "query", "callback", "matches", "removeTransition", "el", "addTransition", "timing", "getAfterExpandCallback", "done", "getAfterCollapseCallback", "expand", "returnPromise", "r", "afterExpandCallback", "dest", "collapse", "afterCollapseCallback", "original", "css", "unsafeCSS", "reset", "components", "css", "styles", "SnackbarDuration", "_expanded", "_durationLeft", "_lastFocused", "_timer", "_timerPaused", "_WarpSnackbarItem_instances", "onFocusIn_fn", "onFocusOut_fn", "onMouseEnter_fn", "onMouseLeave_fn", "hasAction_fn", "WarpSnackbarItem", "LitElement", "__privateAdd", "__privateSet", "__privateGet", "expand", "collapse", "__privateMethod", "modifier", "html", "e", "actionSlot", "reset", "styles", "__decorateClass", "property", "query", "state"]
+}

package/dist/packages/snackbar-item/snackbar-item.react.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/packages/snackbar-item/snackbar-item.react.test.js

@@ -0,0 +1,5 @@
+import { describeReactSsrAttributeMapping } from '../../tests/react-ssr-attributes';
+import { SnackbarItem } from './react.js';
+describeReactSsrAttributeMapping('SnackbarItem', SnackbarItem, [
+    { propName: 'actionPlacement', attrName: 'action-placement', value: 'block' },
+]);

package/dist/packages/snackbar-item/styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/dist/packages/snackbar-item/styles.js

@@ -0,0 +1,111 @@
+import { css } from "lit";
+export const styles = css `
+    :host {
+        display: block;
+
+        --_snackbar-item-bg: var(--w-c-snackbar-item-bg, var(--w-color-tooltip-background-static));
+        --_snackbar-item-action-bg-hover: var(--w-c-snackbar-item-action-bg-hover, var(--w-color-tooltip-background-static));
+        --_snackbar-item-action-bg-active: var(--w-c-snackbar-item-action-bg-active, var(--w-color-tooltip-background-static));
+        --_snackbar-item-border-radius: var(--w-c-snackbar-item-radius, 8px);
+        --_snackbar-item-box-shadow: var(--w-c-snackbar-item-box-shadow, var(--w-shadow-l));
+        --_snackbar-item-color: var(--w-c-snackbar-item-color, var(--w-s-color-text-inverted-static));
+        --_snackbar-item-action-color-hover: var(--w-c-snackbar-item-action-color-hover, var(--w-s-color-text-inverted-static));
+        --_snackbar-item-action-color-active: var(--w-c-snackbar-item-action-color-active, var(--w-s-color-text-inverted-static));
+        --_snackbar-item-max-width: var(--w-c-snackbar-item-max-width, 480px);
+        --_snackbar-item-min-width: var(--w-c-snackbar-item-min-width, 328px);
+        --_snackbar-item-padding: var(--w-c-snackbar-item-padding, 8px);
+    }
+
+    /* Using a padding-less div as target so we get animation to and from zero height */
+    .animation-wrapper {
+        border-radius: var(--_snackbar-item-border-radius); /* Avoid sharp bottom corners during the transitino */
+    }
+
+    [part='item'] {
+        background-color: var(--_snackbar-item-bg);
+        border-radius: var(--_snackbar-item-border-radius);
+        box-shadow: var(--_snackbar-item-box-shadow);
+        color: var(--_snackbar-item-color);
+        max-width: var(--_snackbar-item-max-width);
+        min-width: var(--_snackbar-item-min-width);
+        padding: var(--_snackbar-item-padding);
+        
+        display: grid;
+        column-gap: 8px;
+        grid-template:
+            "icon message inline-action"
+            "block-action block-action block-action";
+        grid-template-columns: auto 1fr auto;
+        align-items: center;
+    }
+
+    [part='item'] w-button,
+    [part='item'] ::slotted(w-button) {
+        --w-c-button-bg: var(--_snackbar-item-bg);
+        --w-c-button-bg-active: var(--_snackbar-item-action-bg-active);
+        --w-c-button-bg-hover: var(--_snackbar-item-action-bg-hover);
+        --w-c-button-color: var(--_snackbar-item-color);
+        --w-c-button-color-active: var(--_snackbar-item-action-color-active);
+        --w-c-button-color-hover: var(--_snackbar-item-action-color-hover);
+    }
+
+    [part='icon'] {
+        grid-area: icon;
+
+        color: var(--_snackbar-item-color);
+        padding-block: 4px;
+    }
+
+    [part='icon'] ::slotted(w-icon) {
+        display: block; /* override default inline-block to avoid line-height */
+        margin-inline-start: 4px;
+    }
+
+    [part='icon'] ::slotted(w-icon[name="SuccessFilled"]) {
+        color: var(--w-s-color-icon-positive);
+    }
+    
+    [part='icon'] ::slotted(w-icon[name="WarningFilled"]) {
+        color: var(--w-s-color-icon-warning);
+    }
+    
+    [part='icon'] ::slotted(w-icon[name="ErrorFilled"]) {
+        color: var(--w-s-color-icon-negative);
+    }
+    
+    [part='icon'] ::slotted(w-icon[name="InfoFilled"]) {
+        color: var(--w-s-color-icon-info);
+    }
+    
+    [part='message'] {
+        grid-area: message;
+
+        align-self: center;
+        font-size: var(--w-font-size-s);
+        line-height: var(--w-line-height-s);
+        padding-block: 7px;
+    }
+
+    [part='action'] {
+        grid-area: inline-action;
+
+        display: flex;
+        column-gap: 2px; /* to allow space for focus outline */
+        justify-content: flex-end;
+        padding-inline-start: 8px;
+    }
+    
+    :host([action-placement='block']) [part='action'] {
+        grid-area: block-action;
+
+    }
+
+    w-attention [slot='message'] {
+        font-size: var(--w-font-size-s);
+        line-height: var(--w-line-height-s);
+    }
+
+    kbd {
+        font-family: var(--w-font-family);
+    }
+`;

package/dist/packages/step/step.js

@@ -1,4 +1,4 @@
-var le=Object.defineProperty;var ce=Object.getOwnPropertyDescriptor;var b=(t,e,r,o)=>{for(var a=o>1?void 0:o?ce(e,r):e,s=t.length-1,i;s>=0;s--)(i=t[s])&&(a=(o?i(e,r,a):i(a))||a);return o&&a&&le(e,r,a),a};var h=function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];return t.reduce(function(r,o){return r.concat(typeof o=="string"?o:Array.isArray(o)?h.apply(void 0,o):typeof o=="object"&&o?Object.keys(o).map(function(a){return o[a]?a:""}):"")},[]).join(" ")};var g=t=>typeof t=="string",de=t=>typeof t=="function",I=new Map,V="en";function P(t){return[...Array.isArray(t)?t:[t],V]}function j(t,e,r){let o=P(t);r||(r="default");let a;if(typeof r=="string")switch(a={day:"numeric",month:"short",year:"numeric"},r){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=r;return y(()=>_("date",o,r),()=>new Intl.DateTimeFormat(o,a)).format(g(e)?new Date(e):e)}function pe(t,e,r){let o;if(r||(r="default"),typeof r=="string")switch(o={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":o.timeZoneName="short";break;case"short":delete o.second}else o=r;return j(t,e,o)}function M(t,e,r){let o=P(t);return y(()=>_("number",o,r),()=>new Intl.NumberFormat(o,r)).format(e)}function R(t,e,r,{offset:o=0,...a}){let s=P(t),i=e?y(()=>_("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):y(()=>_("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return a[r]??a[i.select(r-o)]??a.other}function y(t,e){let r=t(),o=I.get(r);return o||(o=e(),I.set(r,o)),o}function _(t,e,r){let o=e.join("-");return`${t}-${o}-${JSON.stringify(r)}`}var X=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,Z=t=>t.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(e,r,o)=>{if(r){let a=parseInt(r,16);return String.fromCharCode(a)}else{let a=parseInt(o,16);return String.fromCharCode(a)}}),H="%__lingui_octothorpe__%",be=(t,e,r={})=>{let o=e||t,a=i=>typeof i=="object"?i:r[i],s=(i,n)=>{let c=Object.keys(r).length?a("number"):void 0,p=M(o,i,c);return n.replace(new RegExp(H,"g"),p)};return{plural:(i,n)=>{let{offset:c=0}=n,p=R(o,!1,i,n);return s(i-c,p)},selectordinal:(i,n)=>{let{offset:c=0}=n,p=R(o,!0,i,n);return s(i-c,p)},select:ge,number:(i,n)=>M(o,i,a(n)||{style:n}),date:(i,n)=>j(o,i,a(n)||n),time:(i,n)=>pe(o,i,a(n)||n)}},ge=(t,e)=>e[t]??e.other;function ue(t,e,r){return(o={},a)=>{let s=be(e,r,a),i=(c,p=!1)=>Array.isArray(c)?c.reduce((f,x)=>{if(x==="#"&&p)return f+H;if(g(x))return f+x;let[D,m,N]=x,E={};m==="plural"||m==="selectordinal"||m==="select"?Object.entries(N).forEach(([C,se])=>{E[C]=i(se,m==="plural"||m==="selectordinal")}):E=N;let k;if(m){let C=s[m];k=C(o[D],E)}else k=o[D];return k==null?f:f+k},""):c,n=i(t);return g(n)&&X.test(n)?Z(n):g(n)?n:n?String(n):""}}var me=Object.defineProperty,he=(t,e,r)=>e in t?me(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,ve=(t,e,r)=>(he(t,typeof e!="symbol"?e+"":e,r),r),S=class{constructor(){ve(this,"_events",{})}on(e,r){var o;return(o=this._events)[e]??(o[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let o=this._getListeners(e);if(!o)return;let a=o.indexOf(r);~a&&o.splice(a,1)}emit(e,...r){let o=this._getListeners(e);o&&o.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},we=Object.defineProperty,fe=(t,e,r)=>e in t?we(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,v=(t,e,r)=>(fe(t,typeof e!="symbol"?e+"":e,r),r),F=class extends S{constructor(e){super(),v(this,"_locale",""),v(this,"_locales"),v(this,"_localeData",{}),v(this,"_messages",{}),v(this,"_missing"),v(this,"_messageCompiler"),v(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate(e.locale??V,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){return this._messages[this._locale]??{}}get localeData(){return this._localeData[this._locale]??{}}_loadLocaleData(e,r){let o=this._localeData[e];o?Object.assign(o,r):this._localeData[e]=r}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,r){typeof e=="string"?this._loadLocaleData(e,r):Object.keys(e).forEach(o=>this._loadLocaleData(o,e[o])),this.emit("change")}_load(e,r){let o=this._messages[e];o?Object.assign(o,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([o,a])=>this._load(o,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:o}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=o,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,o){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=o?.message;e||(e=""),g(e)||(r=e.values||r,a=e.message,e=e.id);let s=this.messages[e],i=s===void 0,n=this._missing;if(n&&i)return de(n)?n(this._locale,e):n;i&&this.emit("missing",{id:e,locale:this._locale});let c=s||a||e;return g(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
+var le=Object.defineProperty;var ce=Object.getOwnPropertyDescriptor;var b=(t,e,r,o)=>{for(var a=o>1?void 0:o?ce(e,r):e,s=t.length-1,i;s>=0;s--)(i=t[s])&&(a=(o?i(e,r,a):i(a))||a);return o&&a&&le(e,r,a),a};var h=function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];return t.reduce(function(r,o){return r.concat(typeof o=="string"?o:Array.isArray(o)?h.apply(void 0,o):typeof o=="object"&&o?Object.keys(o).map(function(a){return o[a]?a:""}):"")},[]).join(" ")};var g=t=>typeof t=="string",de=t=>typeof t=="function",I=new Map,V="en";function P(t){return[...Array.isArray(t)?t:[t],V]}function j(t,e,r){let o=P(t);r||(r="default");let a;if(typeof r=="string")switch(a={day:"numeric",month:"short",year:"numeric"},r){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=r;return y(()=>_("date",o,r),()=>new Intl.DateTimeFormat(o,a)).format(g(e)?new Date(e):e)}function pe(t,e,r){let o;if(r||(r="default"),typeof r=="string")switch(o={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":o.timeZoneName="short";break;case"short":delete o.second}else o=r;return j(t,e,o)}function M(t,e,r){let o=P(t);return y(()=>_("number",o,r),()=>new Intl.NumberFormat(o,r)).format(e)}function R(t,e,r,{offset:o=0,...a}){let s=P(t),i=e?y(()=>_("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):y(()=>_("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return a[r]??a[i.select(r-o)]??a.other}function y(t,e){let r=t(),o=I.get(r);return o||(o=e(),I.set(r,o)),o}function _(t,e,r){let o=e.join("-");return`${t}-${o}-${JSON.stringify(r)}`}var X=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,H=t=>t.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(e,r,o)=>{if(r){let a=parseInt(r,16);return String.fromCharCode(a)}else{let a=parseInt(o,16);return String.fromCharCode(a)}}),Z="%__lingui_octothorpe__%",be=(t,e,r={})=>{let o=e||t,a=i=>typeof i=="object"?i:r[i],s=(i,n)=>{let c=Object.keys(r).length?a("number"):void 0,p=M(o,i,c);return n.replace(new RegExp(Z,"g"),p)};return{plural:(i,n)=>{let{offset:c=0}=n,p=R(o,!1,i,n);return s(i-c,p)},selectordinal:(i,n)=>{let{offset:c=0}=n,p=R(o,!0,i,n);return s(i-c,p)},select:ge,number:(i,n)=>M(o,i,a(n)||{style:n}),date:(i,n)=>j(o,i,a(n)||n),time:(i,n)=>pe(o,i,a(n)||n)}},ge=(t,e)=>e[t]??e.other;function ue(t,e,r){return(o={},a)=>{let s=be(e,r,a),i=(c,p=!1)=>Array.isArray(c)?c.reduce((f,x)=>{if(x==="#"&&p)return f+Z;if(g(x))return f+x;let[N,m,D]=x,E={};m==="plural"||m==="selectordinal"||m==="select"?Object.entries(D).forEach(([C,se])=>{E[C]=i(se,m==="plural"||m==="selectordinal")}):E=D;let k;if(m){let C=s[m];k=C(o[N],E)}else k=o[N];return k==null?f:f+k},""):c,n=i(t);return g(n)&&X.test(n)?H(n):g(n)?n:n?String(n):""}}var me=Object.defineProperty,he=(t,e,r)=>e in t?me(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,ve=(t,e,r)=>(he(t,typeof e!="symbol"?e+"":e,r),r),S=class{constructor(){ve(this,"_events",{})}on(e,r){var o;return(o=this._events)[e]??(o[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let o=this._getListeners(e);if(!o)return;let a=o.indexOf(r);~a&&o.splice(a,1)}emit(e,...r){let o=this._getListeners(e);o&&o.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},we=Object.defineProperty,fe=(t,e,r)=>e in t?we(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,v=(t,e,r)=>(fe(t,typeof e!="symbol"?e+"":e,r),r),F=class extends S{constructor(e){super(),v(this,"_locale",""),v(this,"_locales"),v(this,"_localeData",{}),v(this,"_messages",{}),v(this,"_missing"),v(this,"_messageCompiler"),v(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate(e.locale??V,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){return this._messages[this._locale]??{}}get localeData(){return this._localeData[this._locale]??{}}_loadLocaleData(e,r){let o=this._localeData[e];o?Object.assign(o,r):this._localeData[e]=r}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,r){typeof e=="string"?this._loadLocaleData(e,r):Object.keys(e).forEach(o=>this._loadLocaleData(o,e[o])),this.emit("change")}_load(e,r){let o=this._messages[e];o?Object.assign(o,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([o,a])=>this._load(o,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:o}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=o,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,o){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=o?.message;e||(e=""),g(e)||(r=e.values||r,a=e.message,e=e.id);let s=this.messages[e],i=s===void 0,n=this._missing;if(n&&i)return de(n)?n(this._locale,e):n;i&&this.emit("missing",{id:e,locale:this._locale});let c=s||a||e;return g(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
 
 > ${c}
 
@@ -6,7 +6,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
 ICU features such as interpolation and plurals will not work properly for that message. 
 
 Please compile your catalog first. 
-`)),g(c)&&X.test(c)?Z(c):g(c)?c:ue(c,this._locale,this._locales)(r,o?.formats)}date(e,r){return j(this._locales||this._locale,e,r)}number(e,r){return M(this._locales||this._locale,e,r)}};function xe(t={}){return new F(t)}var d=xe();import{html as O,LitElement as Oe,nothing as T}from"lit";import{property as ie,state as Te}from"lit/decorators.js";import{ifDefined as ne}from"lit/directives/if-defined.js";import{html as ye,LitElement as _e}from"lit";import{property as $,state as ze}from"lit/decorators.js";import{classMap as Le}from"lit/directives/class-map.js";import{css as ke}from"lit";var G=ke`
+`)),g(c)&&X.test(c)?H(c):g(c)?c:ue(c,this._locale,this._locales)(r,o?.formats)}date(e,r){return j(this._locales||this._locale,e,r)}number(e,r){return M(this._locales||this._locale,e,r)}};function xe(t={}){return new F(t)}var d=xe();import{html as A,LitElement as Ae,nothing as O}from"lit";import{property as ie,state as Oe}from"lit/decorators.js";import{ifDefined as ne}from"lit/directives/if-defined.js";import{html as ye,LitElement as _e}from"lit";import{property as T,state as ze}from"lit/decorators.js";import{classMap as Le}from"lit/directives/class-map.js";import{css as ke}from"lit";var G=ke`
 :host {
   display: inline-block;
 }
@@ -31,7 +31,7 @@ Please compile your catalog first.
   --w-icon-size: 32px;
 }
 
-`;var Y=new Map,Ee='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Ce(t,e={}){let r=e.responseParser??(o=>o.text());return Y.has(t)||Y.set(t,fetch(t).then(r)),Y.get(t)}var u=class extends _e{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons/v1/${this.locale}/${r}.svg`;try{let a=await Ce(o);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ee,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",o=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return ye`<div class="${Le(a)}" style="${s}" part="w-${o.toLowerCase()}">${this.svg}</div>`}};u.styles=[G],b([$({type:String,reflect:!0})],u.prototype,"name",2),b([$({type:String,reflect:!0})],u.prototype,"size",2),b([$({type:String,reflect:!0,useDefault:!0})],u.prototype,"locale",2),b([ze()],u.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",u);var Me=["en","nb","fi","da","sv"],A="en",z=t=>Me.find(e=>t===e||t.toLowerCase().includes(e))||A;function L(){if(typeof window>"u"){let t=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return z(t)}try{let t=U(document);if(t)return z(t);let e=je();if(e)return z(e);let r=U(K());return r?z(r):A}catch(t){return console.warn("could not detect locale, falling back to source locale",t),A}}var q=(t,e,r,o,a)=>{d.load("en",t),d.load("nb",e),d.load("fi",r),d.load("da",o),d.load("sv",a);let s=L();d.activate(s),B(),Fe()},Se="warp-i18n-change";function B(){typeof window>"u"||window.dispatchEvent(new Event(Se))}var J=!1;function Fe(){if(J||typeof window>"u"||!document?.documentElement)return;J=!0;let t=()=>{let a=L();d.locale!==a&&(d.activate(a),B())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){t();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=K();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let o=Pe();o&&e.observe(o,{attributes:!0,attributeFilter:["lang"]})}function K(){try{return window.parent?.document??null}catch{return null}}function U(t){try{return t?.documentElement?.lang??""}catch{return""}}function Pe(){try{return window.frameElement??null}catch{return null}}function je(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{unsafeCSS as $e}from"lit";var Q=$e("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.flex{display:flex}.grid{display:grid}.static{position:static}.w-full{width:100%}");import{css as Ye}from"lit";import{unsafeCSS as Ae}from"lit";var W=Ye`
+`;var $=new Map,Ee='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Ce(t,e={}){let r=e.responseParser??(o=>o.text());return $.has(t)||$.set(t,fetch(t).then(r)),$.get(t)}var u=class extends _e{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons/~1/${this.locale}/${r}.svg`;try{let a=await Ce(o);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ee,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",o=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return ye`<div class="${Le(a)}" style="${s}" part="w-${o.toLowerCase()}">${this.svg}</div>`}};u.styles=[G],b([T({type:String,reflect:!0})],u.prototype,"name",2),b([T({type:String,reflect:!0})],u.prototype,"size",2),b([T({type:String,reflect:!0,useDefault:!0})],u.prototype,"locale",2),b([ze()],u.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",u);var Me=["en","nb","fi","da","sv"],Y="en",z=t=>Me.find(e=>t===e||t.toLowerCase().includes(e))||Y;function L(){if(typeof window>"u"){let t=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return z(t)}try{let t=U(document);if(t)return z(t);let e=je();if(e)return z(e);let r=U(K());return r?z(r):Y}catch(t){return console.warn("could not detect locale, falling back to source locale",t),Y}}var q=(t,e,r,o,a)=>{d.load("en",t),d.load("nb",e),d.load("fi",r),d.load("da",o),d.load("sv",a);let s=L();d.activate(s),B(),Fe()},Se="warp-i18n-change";function B(){typeof window>"u"||window.dispatchEvent(new Event(Se))}var J=!1;function Fe(){if(J||typeof window>"u"||!document?.documentElement)return;J=!0;let t=()=>{let a=L();d.locale!==a&&(d.activate(a),B())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){t();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=K();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let o=Pe();o&&e.observe(o,{attributes:!0,attributeFilter:["lang"]})}function K(){try{return window.parent?.document??null}catch{return null}}function U(t){try{return t?.documentElement?.lang??""}catch{return""}}function Pe(){try{return window.frameElement??null}catch{return null}}function je(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{unsafeCSS as Te}from"lit";var Q=Te("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.flex{display:flex}.grid{display:grid}.static{position:static}.w-full{width:100%}");import{css as $e}from"lit";import{unsafeCSS as Ye}from"lit";var W=$e`
   *,
   :before,
   :after {
@@ -304,7 +304,7 @@ Please compile your catalog first.
   svg {
     pointer-events: none;
   }
-`,tr=Ae(`*, :before, :after {
+`,tr=Ye(`*, :before, :after {
             --w-rotate: 0;
             --w-rotate-x: 0;
             --w-rotate-y: 0;
@@ -2470,16 +2470,16 @@ Please compile your catalog first.
                     display: none
                 }
             }
-        `);var ee=JSON.parse('{"steps.aria.active":["Trinindikator aktiv cirkel"],"steps.aria.completed":["Trinindikator fuldf\xF8rt cirkel"],"steps.aria.emptyCircle":["Tom cirkel"]}');var re=JSON.parse('{"steps.aria.active":["Step indicator active circle"],"steps.aria.completed":["Step indicator completed circle"],"steps.aria.emptyCircle":["Empty circle"]}');var oe=JSON.parse('{"steps.aria.active":["Vaiheilmaisin aktiivinen ympyr\xE4"],"steps.aria.completed":["Vaiheilmaisin valmis ympyr\xE4"],"steps.aria.emptyCircle":["Tyhj\xE4 ympyr\xE4"]}');var te=JSON.parse('{"steps.aria.active":["Stegindikator aktiv sirkel"],"steps.aria.completed":["Stegindikator hel sirkel"],"steps.aria.emptyCircle":["Tom sirkel"]}');var ae=JSON.parse('{"steps.aria.active":["Stegindikator aktiv cirkel"],"steps.aria.completed":["Stegindikator full\xE4ndad cirkel"],"steps.aria.emptyCircle":["Tom cirkel"]}');var l={base:"group/step",vertical:"group/stepv grid-rows-[20px_auto] grid grid-flow-col gap-x-16",horizontal:"group/steph grid-rows-[auto_20px] grid-cols-[1fr_20px_1fr] flex-1 grid items-center",alignLeft:"grid-cols-[20px_1fr]",alignRight:"grid-cols-[1fr_20px] text-right",dot:"rounded-full border-2 h-20 w-20 transition-colors duration-300 s-icon-inverted",dotAlignRight:"col-start-2",dotHorizontal:"row-start-2 justify-self-end",dotActive:"s-border-primary s-bg-primary",dotIncomplete:"s-border s-bg",line:"transition-colors duration-300",lineVertical:"w-2 h-full justify-self-center",lineAlignRight:"col-start-2",lineHorizontal:"h-2 w-full row-start-2",lineIncomplete:"s-bg-disabled",lineComplete:"s-bg-primary",content:"last:mb-0",contentVertical:"row-span-2 pb-32",contentHorizontal:"col-span-3 px-16 row-start-1 text-center"},w=class extends Oe{constructor(){super();this.active=!1;this.completed=!1;this._context={horizontal:!1,right:!1,isLast:!1,isFirst:!1};this._internals=this.attachInternals(),q(re,te,oe,ee,ae)}connectedCallback(){super.connectedCallback(),this._internals.role="listitem"}setContext(r){this._context=r}getAriaLabel(){return this.completed?d._({id:"steps.aria.completed",message:"Step indicator completed circle",comment:"Completed circle"}):this.active?d._({id:"steps.aria.active",message:"Step indicator active circle",comment:"Active circle"}):d._({id:"steps.aria.emptyCircle",message:"Empty circle",comment:"Empty circle"})}render(){let r=!this._context.horizontal,o=!this._context.right,a=this._context.isFirst,s=this._context.isLast,i=h([l.base,r?l.vertical:l.horizontal,r?o?l.alignLeft:l.alignRight:""]),n=h([l.line,l.lineHorizontal,this.active||this.completed?l.lineComplete:l.lineIncomplete,a?"invisible":""]),c=h([l.dot,r?o?"":l.dotAlignRight:l.dotHorizontal,this.active||this.completed?l.dotActive:l.dotIncomplete]),p=h([l.line,r?l.lineVertical:l.lineHorizontal,r&&!o?l.lineAlignRight:"",this.completed?l.lineComplete:l.lineIncomplete,s?"invisible":""]),f=h([l.content,r?l.contentVertical:l.contentHorizontal,s?"pb-0":""]);return O`
+        `);var ee=JSON.parse('{"steps.aria.active":["Trinindikator aktiv cirkel"],"steps.aria.completed":["Trinindikator fuldf\xF8rt cirkel"],"steps.aria.emptyCircle":["Tom cirkel"]}');var re=JSON.parse('{"steps.aria.active":["Step indicator active circle"],"steps.aria.completed":["Step indicator completed circle"],"steps.aria.emptyCircle":["Empty circle"]}');var oe=JSON.parse('{"steps.aria.active":["Vaiheilmaisin aktiivinen ympyr\xE4"],"steps.aria.completed":["Vaiheilmaisin valmis ympyr\xE4"],"steps.aria.emptyCircle":["Tyhj\xE4 ympyr\xE4"]}');var te=JSON.parse('{"steps.aria.active":["Stegindikator aktiv sirkel"],"steps.aria.completed":["Stegindikator hel sirkel"],"steps.aria.emptyCircle":["Tom sirkel"]}');var ae=JSON.parse('{"steps.aria.active":["Stegindikator aktiv cirkel"],"steps.aria.completed":["Stegindikator full\xE4ndad cirkel"],"steps.aria.emptyCircle":["Tom cirkel"]}');var l={base:"group/step",vertical:"group/stepv grid-rows-[20px_auto] grid grid-flow-col gap-x-16",horizontal:"group/steph grid-rows-[auto_20px] grid-cols-[1fr_20px_1fr] flex-1 grid items-center",alignLeft:"grid-cols-[20px_1fr]",alignRight:"grid-cols-[1fr_20px] text-right",dot:"rounded-full border-2 h-20 w-20 transition-colors duration-300 s-icon-inverted",dotAlignRight:"col-start-2",dotHorizontal:"row-start-2 justify-self-end",dotActive:"s-border-primary s-bg-primary",dotIncomplete:"s-border s-bg",line:"transition-colors duration-300",lineVertical:"w-2 h-full justify-self-center",lineAlignRight:"col-start-2",lineHorizontal:"h-2 w-full row-start-2",lineIncomplete:"s-bg-disabled",lineComplete:"s-bg-primary",content:"last:mb-0",contentVertical:"row-span-2 pb-32",contentHorizontal:"col-span-3 px-16 row-start-1 text-center"},w=class extends Ae{constructor(){super();this.active=!1;this.completed=!1;this._context={horizontal:!1,right:!1,isLast:!1,isFirst:!1};this._internals=this.attachInternals(),q(re,te,oe,ee,ae)}connectedCallback(){super.connectedCallback(),this._internals.role="listitem"}setContext(r){this._context=r}getAriaLabel(){return this.completed?d._({id:"steps.aria.completed",message:"Step indicator completed circle",comment:"Completed circle"}):this.active?d._({id:"steps.aria.active",message:"Step indicator active circle",comment:"Active circle"}):d._({id:"steps.aria.emptyCircle",message:"Empty circle",comment:"Empty circle"})}render(){let r=!this._context.horizontal,o=!this._context.right,a=this._context.isFirst,s=this._context.isLast,i=h([l.base,r?l.vertical:l.horizontal,r?o?l.alignLeft:l.alignRight:""]),n=h([l.line,l.lineHorizontal,this.active||this.completed?l.lineComplete:l.lineIncomplete,a?"invisible":""]),c=h([l.dot,r?o?"":l.dotAlignRight:l.dotHorizontal,this.active||this.completed?l.dotActive:l.dotIncomplete]),p=h([l.line,r?l.lineVertical:l.lineHorizontal,r&&!o?l.lineAlignRight:"",this.completed?l.lineComplete:l.lineIncomplete,s?"invisible":""]),f=h([l.content,r?l.contentVertical:l.contentHorizontal,s?"pb-0":""]);return A`
       <div class="${i}" style=${ne(this._context.horizontal?"height: 100%;":void 0)}>
-        ${r?T:O`<div class=${n}></div>`}
-        <div class=${c} role="img" aria-label=${this.getAriaLabel()} aria-current=${this.active?"step":T}>
-          ${this.completed?O`<w-icon name="Check" size="small" locale="${L()}" data-testid="completed-icon" class="flex"></w-icon>`:T}
+        ${r?O:A`<div class=${n}></div>`}
+        <div class=${c} role="img" aria-label=${this.getAriaLabel()} aria-current=${this.active?"step":O}>
+          ${this.completed?A`<w-icon name="Check" size="small" locale="${L()}" data-testid="completed-icon" class="flex"></w-icon>`:O}
         </div>
         <div class=${p}></div>
         <div class=${f} style=${ne(this._context.horizontal?"height: 100%;":void 0)}>
           <slot></slot>
         </div>
       </div>
-    `}};w.styles=[W,Q],b([ie({type:Boolean,reflect:!0})],w.prototype,"active",2),b([ie({type:Boolean,reflect:!0})],w.prototype,"completed",2),b([Te()],w.prototype,"_context",2);customElements.get("w-step")||customElements.define("w-step",w);export{w as WarpStep};
+    `}};w.styles=[W,Q],b([ie({type:Boolean,reflect:!0})],w.prototype,"active",2),b([ie({type:Boolean,reflect:!0})],w.prototype,"completed",2),b([Oe()],w.prototype,"_context",2);customElements.get("w-step")||customElements.define("w-step",w);export{w as WarpStep};
 //# sourceMappingURL=step.js.map