@verbb/plugin-kit-web 2.0.1 → 2.0.4

package/dist/chunks/pk-button-Cilu5WAT.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pk-button-Cilu5WAT.js","names":[],"sources":["../../src/components/button/pk-button.styles.ts","../../src/components/button/pk-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nimport { hostDisplayInlineBlock } from '../../base/styles.js';\nimport { iconStyles } from '../../base/icon.styles.js';\nimport {\n    buttonGroupBorderJoinStyles,\n    buttonGroupCornerRadiusStyles,\n    buttonGroupCornerRoleStyles,\n    buttonGroupIndentStyles,\n} from '../button-group/button-group-item.styles.js';\n\nexport const pkButtonStyles = [\n    hostDisplayInlineBlock,\n    iconStyles,\n    buttonGroupCornerRoleStyles(),\n    buttonGroupCornerRadiusStyles('.button'),\n    buttonGroupIndentStyles(),\n    buttonGroupBorderJoinStyles('.button'),\n    css`\n        @layer pk-component {\n            :host {\n                font-family: var(--pk-font-family);\n                font-size: var(--pk-font-size-base);\n                line-height: var(--pk-line-height);\n                cursor: pointer;\n                --pk-btn-height: var(--pk-btn-height-default);\n                --pk-btn-font: var(--pk-btn-font-default);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-default);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-default);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-default);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-default);\n                --pk-btn-radius: var(--pk-btn-radius-default);\n            }\n\n            :host([disabled]) {\n                cursor: not-allowed;\n                pointer-events: none;\n            }\n\n            :host([loading]):not([disabled]) {\n                pointer-events: none;\n            }\n\n            .button {\n                display: inline-flex;\n                align-items: center;\n                justify-content: center;\n                gap: var(--pk-btn-icon-gap);\n                box-sizing: border-box;\n                width: auto;\n                margin: 0;\n                /* Every button carries a 1px border (transparent for fill/plain variants) so the box\n                 * model is identical across variants and states. Prevents width shift when swapping a\n                 * button between filled and outline/dashed, or toggling states. Matches Bootstrap\n                 * (transparent baseline) and  (border always present, only color changes).\n                 */\n                border: 1px solid transparent;\n                border-radius: var(--pk-btn-radius);\n                font: inherit;\n                font-size: var(--pk-btn-font);\n                font-weight: 400;\n                line-height: 1.2;\n                text-decoration: none;\n                white-space: nowrap;\n                /* Inherit host cursor so className/style (e.g. cursor-move) pierce shadow. */\n                cursor: inherit;\n                user-select: none;\n                vertical-align: middle;\n                appearance: none;\n                background: var(--pk-btn-fill, var(--pk-action-fill));\n                color: var(--pk-btn-on, var(--pk-action-on));\n                height: var(--pk-btn-height);\n                min-height: var(--pk-btn-height);\n                /* Block padding defaults to 0 (height tokens center content). Override for nav rows. */\n                padding-block: var(--pk-btn-padding-block, 0);\n                padding-inline: var(--pk-btn-padding-inline);\n                transition: background-color 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;\n            }\n\n            .button:disabled {\n                opacity: 0.5;\n            }\n\n            .icon-slot {\n                display: none;\n                align-items: center;\n                justify-content: center;\n                flex-shrink: 0;\n                line-height: 0;\n            }\n\n            .icon-slot--has-content {\n                display: inline-flex;\n            }\n\n            /* Fixed token sizes for all icons (labeled or icon-only) — matches plugin-kit-react Button. */\n            .icon-slot slot::slotted(svg),\n            slot[name='start']::slotted(svg),\n            slot[name='end']::slotted(svg) {\n                display: block;\n                width: var(--pk-btn-icon-size);\n                height: var(--pk-btn-icon-size);\n                flex-shrink: 0;\n                pointer-events: none;\n            }\n\n            .icon-slot slot::slotted(img),\n            slot[name='start']::slotted(img),\n            slot[name='end']::slotted(img) {\n                display: block;\n                width: var(--pk-btn-icon-size);\n                height: var(--pk-btn-icon-size);\n                object-fit: contain;\n                flex-shrink: 0;\n                pointer-events: none;\n            }\n\n            /* pk-icon sizes itself from font-size (1em), so scale it to the\n             * icon token. This keeps the idiomatic slotted pk-icon usage in\n             * sync with raw slotted svg. Set width/height explicitly — %/size-full\n             * collapses when the icon-slot has no definite box.\n             */\n            .icon-slot slot::slotted(pk-icon),\n            slot[name='start']::slotted(pk-icon),\n            slot[name='end']::slotted(pk-icon) {\n                font-size: var(--pk-btn-icon-size);\n                width: var(--pk-btn-icon-size);\n                height: var(--pk-btn-icon-size);\n                /* Kill pk-icon's text-baseline nudge (-0.125em) — flex slots center optically. */\n                vertical-align: 0;\n                flex-shrink: 0;\n                pointer-events: none;\n            }\n\n            .label {\n                display: inline-flex;\n                align-items: center;\n                min-width: 0;\n                line-height: 1.2;\n            }\n\n            /* Trailing slot (status): grow + clip the label so end sits at the far edge\n             * and long titles truncate instead of colliding with the indicator.\n             */\n            .button:has(.icon-slot--end.icon-slot--has-content) .label:not(.is-empty) {\n                flex: 1 1 auto;\n                overflow: hidden;\n            }\n\n            .label.is-empty {\n                display: none;\n            }\n\n            /* Icon-only (no label): square hit box = size height. Button owns the target;\n             * glyph size comes from --pk-btn-icon-size. Do not Tailwind-size the Icon.\n             * Opt out with icon (compact), size=none, or group-trigger (narrow disclosure cap).\n             */\n            :host(:not([icon]):not([size='none']):not([group-trigger])) .button:not(.has-label) {\n                width: var(--pk-btn-height);\n                min-width: var(--pk-btn-height);\n                padding-inline: 0;\n            }\n\n            /* Compact density (icon attr): padless box that hugs the glyph.\n             * size still drives --pk-btn-icon-size; height/width tiers do not apply.\n             * Use for dense x / ellipsis in cells — not for table action rows (prefer square above).\n             * line-height: 0 collapses whitespace flex-struts so the glyph sits dead-center.\n             */\n            :host([icon]) {\n                display: inline-flex;\n                line-height: 0;\n                vertical-align: middle;\n            }\n\n            :host([icon]) .button {\n                display: flex;\n                width: auto;\n                min-width: 0;\n                height: auto;\n                min-height: 0;\n                padding-inline: 0.25rem;\n                padding-block: 0;\n                line-height: 0;\n                align-items: center;\n                justify-content: center;\n            }\n\n            /* Keep label space while loading even before slotchange runs. */\n            .button.loading .label.is-empty {\n                display: inline-flex;\n                visibility: hidden;\n            }\n\n            /* Sizes — token-driven scale (see tokens.css) */\n            :host([size='xxs']) {\n                --pk-btn-height: var(--pk-btn-height-xxs);\n                --pk-btn-font: var(--pk-btn-font-xxs);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-xxs);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-xxs);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-xxs);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-xxs);\n                --pk-btn-radius: var(--pk-btn-radius-xxs);\n            }\n\n            :host([size='xs']) {\n                --pk-btn-height: var(--pk-btn-height-xs);\n                --pk-btn-font: var(--pk-btn-font-xs);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-xs);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-xs);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-xs);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-xs);\n                --pk-btn-radius: var(--pk-btn-radius-xs);\n            }\n\n            :host([size='sm']) {\n                --pk-btn-height: var(--pk-btn-height-sm);\n                --pk-btn-font: var(--pk-btn-font-sm);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-sm);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-sm);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-sm);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-sm);\n                --pk-btn-radius: var(--pk-btn-radius-sm);\n            }\n\n            :host([size='default']) {\n                --pk-btn-height: var(--pk-btn-height-default);\n                --pk-btn-font: var(--pk-btn-font-default);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-default);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-default);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-default);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-default);\n                --pk-btn-radius: var(--pk-btn-radius-default);\n            }\n\n            :host([size='lg']) {\n                --pk-btn-height: var(--pk-btn-height-lg);\n                --pk-btn-font: var(--pk-btn-font-lg);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-lg);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-lg);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-lg);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-lg);\n                --pk-btn-radius: var(--pk-btn-radius-lg);\n            }\n\n            :host([size='xl']) {\n                --pk-btn-height: var(--pk-btn-height-xl);\n                --pk-btn-font: var(--pk-btn-font-xl);\n                --pk-btn-padding-inline: var(--pk-btn-padding-inline-xl);\n                --pk-btn-icon-size: var(--pk-btn-icon-size-xl);\n                --pk-btn-icon-gap: var(--pk-btn-icon-gap-xl);\n                --pk-btn-caret-size: var(--pk-btn-caret-size-xl);\n                --pk-btn-radius: var(--pk-btn-radius-xl);\n            }\n\n            /* No preset scale — size to content or set --pk-btn-* on the host for one-off dimensions\n             * (height, padding, font, icon, radius) without fighting a named size tier.\n             * Pair with icon for a padless glyph host, or set --pk-btn-padding-inline / --pk-btn-height yourself.\n             */\n            :host([size='none']) {\n                --pk-btn-height: auto;\n                --pk-btn-font: inherit;\n                --pk-btn-padding-inline: 0px;\n                --pk-btn-padding-block: 0px;\n                --pk-btn-icon-size: 1em;\n                --pk-btn-icon-gap: 0px;\n                --pk-btn-caret-size: 1em;\n                --pk-btn-radius: 0px;\n            }\n\n            :host([size='none']) .button {\n                height: auto;\n                min-height: auto;\n                width: 100%;\n            }\n\n            /* Variants */\n            :host([variant='default']) {\n                --pk-btn-fill: var(--pk-action-fill);\n                --pk-btn-fill-hover: var(--pk-action-fill-hover);\n                --pk-btn-fill-active: var(--pk-action-fill-active);\n                --pk-btn-on: var(--pk-action-on);\n            }\n\n            :host([variant='primary']) {\n                --pk-btn-fill: var(--pk-action-primary-fill);\n                --pk-btn-fill-hover: var(--pk-action-primary-fill-hover);\n                --pk-btn-fill-active: var(--pk-action-primary-fill-active);\n                --pk-btn-on: var(--pk-action-primary-on);\n            }\n\n            :host([variant='primary']) .button,\n            :host([variant='secondary']) .button {\n                -moz-osx-font-smoothing: grayscale;\n                -webkit-font-smoothing: antialiased;\n            }\n\n            :host([variant='secondary']) {\n                --pk-btn-fill: var(--pk-color-gray-500);\n                --pk-btn-fill-hover: var(--pk-color-gray-550);\n                --pk-btn-fill-active: var(--pk-color-gray-600);\n                --pk-btn-on: var(--pk-color-white);\n            }\n\n            :host([variant='outline']) .button {\n                background: transparent;\n                border-color: var(--pk-color-slate-400);\n                color: var(--pk-color-gray-700);\n            }\n\n            :host([variant='transparent']) .button {\n                background: transparent;\n                color: var(--pk-color-gray-700);\n            }\n\n            /* link/none opt out of the shared transparent 1px border: they never render a border, so\n             * carrying one only pads the box by 2px inline (and 2px block at size='none', where height\n             * is auto). These are the \"inline text\" / \"no chrome\" variants — content-sized is the point,\n             * and neither participates in button-group border joins. Other variants keep the stable box.\n             */\n            /*\n             * Craft CP sets --link-color on :root (inherits into shadow). Prefer that,\n             * then kit --pk-color-link — not sky-700 (reads as a different “CP blue”).\n             * Color on :host so consumer utilities (e.g. text-[var(--link-color)]) can override.\n             * Height must be content-sized — default --pk-btn-height (34px) bloated table rows.\n             */\n            :host([variant='link']) {\n                color: var(--link-color, var(--pk-color-link));\n                --pk-btn-height: auto;\n                --pk-btn-padding-inline: 0;\n                --pk-btn-padding-block: 0;\n            }\n\n            :host([variant='link']) .button {\n                background: transparent;\n                border-width: 0;\n                border-radius: 0;\n                color: inherit;\n                width: auto;\n                height: auto;\n                min-height: 0;\n                padding: 0;\n                text-underline-offset: 2px;\n            }\n\n            :host([variant='dashed']) .button {\n                background: transparent;\n                border-style: dashed;\n                border-color: var(--pk-color-slate-500);\n                color: var(--pk-color-gray-700);\n            }\n\n            :host([variant='none']) .button {\n                border-width: 0;\n                border-radius: 0;\n                background: transparent;\n                color: inherit;\n            }\n\n            /* Interaction — pseudo-classes only; playground matrices use dev/pk-button-demo-states.css */\n            .button:hover:not(:disabled) {\n                background: var(--pk-btn-fill-hover, var(--pk-btn-fill));\n            }\n\n            :host([variant='outline']) .button:hover:not(:disabled),\n            :host([variant='transparent']) .button:hover:not(:disabled),\n            :host([variant='dashed']) .button:hover:not(:disabled) {\n                background: var(--pk-color-slate-150);\n            }\n\n            :host([variant='link']) .button:hover:not(:disabled) {\n                background: transparent;\n                text-decoration: underline;\n            }\n\n            :host([variant='none']) .button:hover:not(:disabled) {\n                background: transparent;\n            }\n\n            .button:active:not(:disabled) {\n                background: var(--pk-btn-fill-active, var(--pk-btn-fill-hover, var(--pk-btn-fill)));\n            }\n\n            :host([variant='outline']) .button:active:not(:disabled),\n            :host([variant='transparent']) .button:active:not(:disabled),\n            :host([variant='dashed']) .button:active:not(:disabled) {\n                background: var(--pk-color-slate-200);\n            }\n\n            :host([variant='link']) .button:active:not(:disabled),\n            :host([variant='none']) .button:active:not(:disabled) {\n                background: transparent;\n            }\n\n            .button:focus {\n                outline: none;\n            }\n\n            .button:focus-visible {\n                box-shadow: var(--pk-shadow-focus);\n            }\n\n            /* Bordered variants: fold the button's own border into the focus ring by recoloring it to\n             * the accent (and solidifying dashed) so focus reads as one cohesive ring instead of a\n             * doubled border. The ring is thinned to 1px here because the recolored 1px border already\n             * supplies the other half — total 2px, matching the filled variants' ring weight.\n             */\n            :host([variant='outline']) .button:focus-visible,\n            :host([variant='dashed']) .button:focus-visible {\n                border-color: var(--pk-color-sky-600);\n                box-shadow: 0 0 0 1px var(--pk-color-sky-600), 0 0 5px 1px hsl(from var(--pk-color-sky-600) h s l / 0.7);\n            }\n\n            :host([variant='dashed']) .button:focus-visible {\n                border-style: solid;\n            }\n\n            :host(.pk-dialog__close) .button:focus-visible {\n                box-shadow: 0 0 0 2px var(--pk-color-gray-600);\n            }\n\n            :host-context(pk-button-group) {\n                position: relative;\n            }\n\n            :host-context(pk-button-group[orientation='vertical']) {\n                display: block;\n                width: 100%;\n                max-width: 100%;\n                box-sizing: border-box;\n            }\n\n            :host-context(pk-button-group[orientation='vertical']) .button {\n                width: 100%;\n                box-sizing: border-box;\n            }\n\n            :host-context(pk-button-group:focus-visible) {\n                z-index: 2;\n            }\n\n            /* Bordered variants — matching border divider (filled uses margin gap via buttonGroupIndentStyles) */\n\n            :host([variant='primary']) .button:focus-visible,\n            :host([variant='secondary']) .button:focus-visible {\n                box-shadow: var(--pk-shadow-focus-inset);\n            }\n\n            :host-context(pk-button-group[exclusive]):host([aria-pressed='true']) .button {\n                background: var(--pk-color-gray-500);\n                color: var(--pk-color-white);\n            }\n\n            :host-context(pk-button-group[exclusive]):host([aria-pressed='true']) .button:hover:not(:disabled) {\n                background: var(--pk-color-gray-550);\n            }\n\n            :host-context(pk-button-group[exclusive]):host([aria-pressed='true']) .button:active:not(:disabled) {\n                background: var(--pk-color-gray-600);\n            }\n\n            :host-context(pk-button-group[exclusive]):host([aria-pressed='true']) .button:focus-visible {\n                box-shadow: var(--pk-shadow-focus);\n            }\n\n            :host([variant='link']) .button:focus-visible {\n                box-shadow: none;\n                text-decoration: underline;\n            }\n\n            .button.loading {\n                position: relative;\n                cursor: default;\n                pointer-events: none;\n            }\n\n            .label.loading {\n                visibility: hidden;\n            }\n\n            .button.loading .icon-slot,\n            .button.loading slot[name='start']::slotted(*),\n            .button.loading slot[name='end']::slotted(*) {\n                visibility: hidden;\n            }\n\n            .button.caret .icon-slot--end.icon-slot--has-content {\n                display: none;\n            }\n\n            /* Scope to the caret span — the button host also gets class caret when\n               with-caret is set; an unscoped .caret rule was adding 2px margin\n               to the whole button and shifting dropdown anchors left. */\n            .button > .caret {\n                display: inline-flex;\n                align-self: center;\n                align-items: center;\n                justify-content: center;\n                flex-shrink: 0;\n                line-height: 0;\n                /* Sits slightly further from the label than the flex gap alone. */\n                margin-inline-start: 2px;\n            }\n\n            /* Caret has its own per-size token (--pk-btn-caret-size), kept deliberately smaller than\n             * --pk-btn-icon-size so it reads as a subordinate dropdown affordance next to real icons.\n             */\n            .button > .caret svg {\n                display: block;\n                width: var(--pk-btn-caret-size);\n                height: var(--pk-btn-caret-size);\n            }\n\n            :host([group-trigger]) .button {\n                padding-inline: 6px;\n            }\n\n            /* Compact disclosure cap — hide content, keep only the shared SVG caret (centered). */\n            :host([group-trigger]) .label,\n            :host([group-trigger]) .icon-slot {\n                display: none;\n            }\n\n            :host([group-trigger]) .button > .caret {\n                margin-inline-start: 0;\n            }\n\n            :host([size='sm'][group-trigger]) .button,\n            :host([size='xs'][group-trigger]) .button,\n            :host([size='xxs'][group-trigger]) .button {\n                padding-inline: 6px;\n            }\n\n            :host([size='lg'][group-trigger]) .button {\n                padding-inline: 10px;\n            }\n\n            :host([size='xl'][group-trigger]) .button {\n                padding-inline: 12px;\n            }\n\n            :host-context(pk-button-group[orientation='horizontal']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='outline']) .button,\n            :host-context(pk-button-group[orientation='horizontal']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='dashed']) .button,\n            :host-context(pk-button-group[orientation='horizontal']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='transparent']) .button {\n                border-left-width: 0;\n            }\n\n            :host-context(pk-button-group[orientation='vertical']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='outline']) .button,\n            :host-context(pk-button-group[orientation='vertical']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='dashed']) .button,\n            :host-context(pk-button-group[orientation='vertical']):host([data-pk-group-join]:not([data-pk-group-divider])[variant='transparent']) .button {\n                border-top-width: 0;\n            }\n\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-join]:not([data-pk-group-divider])[variant='outline']) .button,\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-join]:not([data-pk-group-divider])[variant='dashed']) .button,\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-join]:not([data-pk-group-divider])[variant='transparent']) .button {\n                border-left-width: 0;\n            }\n\n            :host([data-pk-group-orientation='vertical'][data-pk-group-join]:not([data-pk-group-divider])[variant='outline']) .button,\n            :host([data-pk-group-orientation='vertical'][data-pk-group-join]:not([data-pk-group-divider])[variant='dashed']) .button,\n            :host([data-pk-group-orientation='vertical'][data-pk-group-join]:not([data-pk-group-divider])[variant='transparent']) .button {\n                border-top-width: 0;\n            }\n\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-divider][variant='outline']) .button {\n                box-shadow: none;\n                border-left-width: 1px;\n                border-left-style: solid;\n                border-left-color: var(--pk-btn-group-divider-color-outline, var(--pk-color-slate-400));\n            }\n\n            :host([data-pk-group-orientation='vertical'][data-pk-group-divider][variant='outline']) .button {\n                box-shadow: none;\n                border-top-width: 1px;\n                border-top-style: solid;\n                border-top-color: var(--pk-btn-group-divider-color-outline, var(--pk-color-slate-400));\n            }\n\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-divider][variant='dashed']) .button {\n                box-shadow: none;\n                border-left-width: 1px;\n                border-left-style: dashed;\n                border-left-color: var(--pk-btn-group-divider-color-dashed, var(--pk-color-slate-500));\n            }\n\n            :host([data-pk-group-orientation='vertical'][data-pk-group-divider][variant='dashed']) .button {\n                box-shadow: none;\n                border-top-width: 1px;\n                border-top-style: dashed;\n                border-top-color: var(--pk-btn-group-divider-color-dashed, var(--pk-color-slate-500));\n            }\n\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-divider][variant='outline']) .button:focus-visible,\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-divider][variant='dashed']) .button:focus-visible {\n                box-shadow: var(--pk-shadow-focus);\n            }\n\n            :host([data-pk-group-orientation='vertical'][data-pk-group-divider][variant='outline']) .button:focus-visible,\n            :host([data-pk-group-orientation='vertical'][data-pk-group-divider][variant='dashed']) .button:focus-visible {\n                box-shadow: var(--pk-shadow-focus);\n            }\n\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-internal-trail][variant='outline']) .button,\n            :host([data-pk-group-orientation='horizontal'][data-pk-group-internal-trail][variant='dashed']) .button {\n                border-right-width: 0;\n            }\n\n            :host([data-pk-group-orientation='vertical'][data-pk-group-internal-trail][variant='outline']) .button,\n            :host([data-pk-group-orientation='vertical'][data-pk-group-internal-trail][variant='dashed']) .button {\n                border-bottom-width: 0;\n            }\n        }\n    `,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { chevronDown, iconToSvg } from '@verbb/plugin-kit-icons';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { getButtonSpinnerSize, resolveSpinnerVariant } from '../spinner/spinner-utils.js';\nimport type { PkSpinnerSize, PkSpinnerTone, PkSpinnerVariant } from '../spinner/pk-spinner.js';\n\nexport type { PkSpinnerSize };\nimport '../spinner/pk-spinner.js';\nimport { pkButtonStyles } from './pk-button.styles.js';\n\nexport type PkButtonVariant =\n    | 'default'\n    | 'primary'\n    | 'secondary'\n    | 'outline'\n    | 'transparent'\n    | 'link'\n    | 'dashed'\n    | 'none';\n\nexport type PkButtonSize = 'default' | 'xxs' | 'xs' | 'sm' | 'lg' | 'xl' | 'none';\n\nconst CARET_ICON = iconToSvg(chevronDown);\n\n/**\n * Craft-aligned action button.\n *\n * @slot - Button label\n * @slot start - Leading icon or prefix\n * @slot end - Trailing icon or suffix\n *\n * @csspart base - The native button element\n */\n@customElement('pk-button')\nexport class PkButton extends PkElement {\n    static override shadowRootOptions: ShadowRootInit = {\n        mode: 'open',\n        delegatesFocus: true,\n    };\n\n    static override styles = pkButtonStyles;\n\n    @property({ reflect: true })\n    variant: PkButtonVariant = 'default';\n\n    @property({ reflect: true })\n    size: PkButtonSize = 'default';\n\n    @property({ type: Boolean, reflect: true })\n    disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    loading = false;\n\n    /**\n     * Override loading spinner size. When unset, derived from `size` via\n     * `getButtonSpinnerSize` — same defaults as v1 Button (xxs/xs → xxs, lg/xl → sm, else xs).\n     * Formie New Form passes `xs` on `size=\"lg\"` so the ring stays size-4 (1rem), not sm (1.5rem).\n     */\n    @property({ reflect: true, attribute: 'spinner-size' })\n    spinnerSize?: PkSpinnerSize;\n\n    @property({ reflect: true, attribute: 'spinner-variant' })\n    spinnerVariant?: PkSpinnerVariant;\n\n    @property({ reflect: true, attribute: 'spinner-tone' })\n    spinnerTone?: PkSpinnerTone;\n\n    @property({ type: Boolean, reflect: true, attribute: 'with-caret' })\n    withCaret = false;\n\n    /**\n     * Compact chevron-only trigger for grouped split actions — Craft `.menubtn`.\n     *\n     * Not a variant or size: set this boolean on the disclosure end-cap in a split group.\n     * Hides label/icons and draws a CSS `::after` chevron (0.4375rem, 2px borders).\n     * Inherits `variant`/`size` from sibling buttons; inline padding narrows to 8px.\n     * Do not pass a chevron icon — use `icon` + a start-slot icon for a padless square control.\n     */\n    @property({ type: Boolean, reflect: true, attribute: 'group-trigger' })\n    groupTrigger = false;\n\n    /**\n     * Compact icon density: padless box that hugs the glyph (no square hit target).\n     *\n     * Prefer default icon-only usage for action rows — without this flag, icon-only\n     * buttons are square (`width`/`height` = size height) with the glyph from\n     * `--pk-btn-icon-size`. Use `icon` for dense × / ⋯ in cells.\n     * For one-off dimensions use `size=\"none\"` and set `--pk-btn-*` on the host.\n     */\n    @property({ type: Boolean, reflect: true })\n    icon = false;\n\n    @property()\n    href?: string;\n\n    @property()\n    target?: string;\n\n    @property()\n    rel?: string;\n\n    @property()\n    name?: string;\n\n    @property()\n    value?: string;\n\n    @property()\n    title = '';\n\n    @property()\n    type: 'button' | 'submit' | 'reset' = 'button';\n\n    /**\n     * HTML form owner id — same as native `<button form=\"…\">`.\n     * Needed when the submit control lives outside the `<form>` (e.g. dialog footer).\n     */\n    @property({ reflect: true })\n    form?: string;\n\n    @state()\n    private hasDefaultSlotContent = false;\n\n    @state()\n    private hasStartSlotContent = false;\n\n    @state()\n    private hasEndSlotContent = false;\n\n    private defaultSlotChanged(event: Event): void {\n        const slot = event.target as HTMLSlotElement;\n        this.hasDefaultSlotContent = slot.assignedNodes({ flatten: true }).some((node) => {\n            if (node.nodeType === Node.TEXT_NODE) {\n                return node.textContent?.trim();\n            }\n\n            return node.nodeType === Node.ELEMENT_NODE;\n        });\n    }\n\n    private iconSlotChanged(event: Event, which: 'start' | 'end'): void {\n        const slot = event.target as HTMLSlotElement;\n        const hasContent = slot.assignedNodes({ flatten: true }).some((node) => {\n            if (node.nodeType === Node.TEXT_NODE) {\n                return node.textContent?.trim();\n            }\n\n            return node.nodeType === Node.ELEMENT_NODE;\n        });\n\n        if (which === 'start') {\n            this.hasStartSlotContent = hasContent;\n        } else {\n            this.hasEndSlotContent = hasContent;\n        }\n    }\n\n    private startSlotChanged = (event: Event): void => {\n        this.iconSlotChanged(event, 'start');\n    };\n\n    private endSlotChanged = (event: Event): void => {\n        this.iconSlotChanged(event, 'end');\n    };\n\n    private buttonClasses() {\n        return classMap({\n            button: true,\n            'has-label': this.hasDefaultSlotContent,\n            loading: this.loading,\n            caret: this.withCaret,\n            'group-trigger': this.groupTrigger,\n        });\n    }\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n        this.setAttribute('data-slot', 'button');\n        this.addEventListener('click', this.handleHostClick);\n    }\n\n    override disconnectedCallback(): void {\n        this.removeEventListener('click', this.handleHostClick);\n        super.disconnectedCallback();\n    }\n\n    /**\n     * Resolve the light-DOM form for submit/reset.\n     * Prefer `form` id (dialog footer submitters), then ancestor `<form>`.\n     * Never target Craft’s `#main` shell.\n     */\n    private resolveAssociatedForm(): HTMLFormElement | null {\n        const byId = (this.form || this.getAttribute('form') || '').trim();\n\n        if (byId) {\n            const el = this.ownerDocument?.getElementById(byId);\n\n            if (el instanceof HTMLFormElement && el.id !== 'main') {\n                return el;\n            }\n        }\n\n        const closest = this.closest('form');\n\n        if (closest && closest.id !== 'main') {\n            return closest;\n        }\n\n        return null;\n    }\n\n    /**\n     * Shadow inner `<button type=\"submit|reset\">` is not a form owner for an\n     * ancestor light-DOM `<form>` — bridge click → `requestSubmit` / `reset`.\n     * Skip Craft’s `#main` shell form (same guard as implicit Enter submit).\n     */\n    private handleHostClick = (event: MouseEvent): void => {\n        if (this.disabled || this.loading || this.href) {\n            return;\n        }\n\n        if (this.type !== 'submit' && this.type !== 'reset') {\n            return;\n        }\n\n        const form = this.resolveAssociatedForm();\n\n        if (!form) {\n            return;\n        }\n\n        // Stop the inner shadow button’s non-associated default; we own submit/reset.\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this.type === 'reset') {\n            form.reset();\n            return;\n        }\n\n        if (typeof form.requestSubmit === 'function') {\n            form.requestSubmit();\n            return;\n        }\n\n        form.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true }));\n    };\n\n    override render() {\n        // Explicit spinner-size wins (v1 Button `spinnerSize`); else map from button size.\n        const spinnerSize = this.spinnerSize || getButtonSpinnerSize(this.size);\n        const spinnerVariant = resolveSpinnerVariant(this.variant, this.spinnerVariant);\n        const isLink = Boolean(this.href);\n\n        return html`\n            ${isLink\n                ? html`\n                    <a\n                        part=\"base\"\n                        class=${this.buttonClasses()}\n                        href=${this.href!}\n                        target=${this.target ?? nothing}\n                        rel=${this.rel ?? nothing}\n                        title=${this.title || nothing}\n                    >\n                        ${this.renderInner(spinnerSize, spinnerVariant)}\n                    </a>\n                `\n                : html`\n                    <button\n                        part=\"base\"\n                        class=${this.buttonClasses()}\n                        type=${this.type}\n                        ?disabled=${this.disabled}\n                        aria-disabled=${this.disabled ? 'true' : nothing}\n                        aria-busy=${this.loading ? 'true' : nothing}\n                        name=${this.name ?? nothing}\n                        value=${this.value ?? nothing}\n                        title=${this.title || nothing}\n                    >\n                        ${this.renderInner(spinnerSize, spinnerVariant)}\n                    </button>\n                `}\n        `;\n    }\n\n    private renderInner(spinnerSize: PkSpinnerSize, spinnerVariant: PkSpinnerVariant) {\n        return html`\n            <span\n                class=${classMap({\n                    'icon-slot': true,\n                    'icon-slot--start': true,\n                    'icon-slot--has-content': this.hasStartSlotContent,\n                })}\n            >\n                <slot name=\"start\" @slotchange=${this.startSlotChanged}></slot>\n            </span>\n            ${this.loading\n                ? html`\n                    <pk-spinner\n                        variant=${spinnerVariant}\n                        size=${spinnerSize}\n                        tone=${this.spinnerTone ?? nothing}\n                        centered\n                    ></pk-spinner>\n                `\n                : nothing}\n            <span\n                class=${classMap({\n                    label: true,\n                    'is-empty': !this.hasDefaultSlotContent,\n                    loading: this.loading,\n                })}\n            >\n                <slot @slotchange=${this.defaultSlotChanged}></slot>\n            </span>\n            <span\n                class=${classMap({\n                    'icon-slot': true,\n                    'icon-slot--end': true,\n                    'icon-slot--has-content': this.hasEndSlotContent,\n                })}\n            >\n                <slot name=\"end\" @slotchange=${this.endSlotChanged}></slot>\n            </span>\n            ${this.withCaret || this.groupTrigger\n                ? html`<span part=\"caret\" class=\"caret\">${unsafeSVG(CARET_ICON)}</span>`\n                : nothing}\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-button': PkButton;\n    }\n}\n"],"mappings":";;;;;;;;;;AAWA,IAAa,iBAAiB;CAC1B;CACA;CACA,6BAA6B;CAC7B,8BAA8B,UAAU;CACxC,yBAAyB;CACzB,4BAA4B,UAAU;CACtC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmlBN;;;AC3kBD,IAAM,aAAa,UAAU,YAAY;AAYlC,IAAA,WAAA,MAAM,iBAAiB,UAAU;;;iBAST;cAGN;kBAGV;iBAGD;mBAiBE;sBAWG;cAWR;eAkBC;cAG8B;+BAUN;6BAGF;2BAGF;2BA8BA,UAAuB;AAC/C,QAAK,gBAAgB,OAAO,QAAQ;;yBAGd,UAAuB;AAC7C,QAAK,gBAAgB,OAAO,MAAM;;0BAsDX,UAA4B;AACnD,OAAI,KAAK,YAAY,KAAK,WAAW,KAAK,KACtC;AAGJ,OAAI,KAAK,SAAS,YAAY,KAAK,SAAS,QACxC;GAGJ,MAAM,OAAO,KAAK,uBAAuB;AAEzC,OAAI,CAAC,KACD;AAIJ,SAAM,gBAAgB;AACtB,SAAM,iBAAiB;AAEvB,OAAI,KAAK,SAAS,SAAS;AACvB,SAAK,OAAO;AACZ;;AAGJ,OAAI,OAAO,KAAK,kBAAkB,YAAY;AAC1C,SAAK,eAAe;AACpB;;AAGJ,QAAK,cAAc,IAAI,MAAM,UAAU;IAAE,SAAS;IAAM,YAAY;IAAM,CAAC,CAAC;;;;2BAnN5B;GAChD,MAAM;GACN,gBAAgB;GACnB;;;gBAEwB;;CA0FzB,mBAA2B,OAAoB;EAC3C,MAAM,OAAO,MAAM;AACnB,OAAK,wBAAwB,KAAK,cAAc,EAAE,SAAS,MAAM,CAAC,CAAC,MAAM,SAAS;AAC9E,OAAI,KAAK,aAAa,KAAK,UACvB,QAAO,KAAK,aAAa,MAAM;AAGnC,UAAO,KAAK,aAAa,KAAK;IAChC;;CAGN,gBAAwB,OAAc,OAA8B;EAEhE,MAAM,aADO,MAAM,OACK,cAAc,EAAE,SAAS,MAAM,CAAC,CAAC,MAAM,SAAS;AACpE,OAAI,KAAK,aAAa,KAAK,UACvB,QAAO,KAAK,aAAa,MAAM;AAGnC,UAAO,KAAK,aAAa,KAAK;IAChC;AAEF,MAAI,UAAU,QACV,MAAK,sBAAsB;MAE3B,MAAK,oBAAoB;;CAYjC,gBAAwB;AACpB,SAAO,SAAS;GACZ,QAAQ;GACR,aAAa,KAAK;GAClB,SAAS,KAAK;GACd,OAAO,KAAK;GACZ,iBAAiB,KAAK;GACzB,CAAC;;CAGN,oBAAmC;AAC/B,QAAM,mBAAmB;AACzB,OAAK,aAAa,aAAa,SAAS;AACxC,OAAK,iBAAiB,SAAS,KAAK,gBAAgB;;CAGxD,uBAAsC;AAClC,OAAK,oBAAoB,SAAS,KAAK,gBAAgB;AACvD,QAAM,sBAAsB;;;;;;;CAQhC,wBAAwD;EACpD,MAAM,QAAQ,KAAK,QAAQ,KAAK,aAAa,OAAO,IAAI,IAAI,MAAM;AAElE,MAAI,MAAM;GACN,MAAM,KAAK,KAAK,eAAe,eAAe,KAAK;AAEnD,OAAI,cAAc,mBAAmB,GAAG,OAAO,OAC3C,QAAO;;EAIf,MAAM,UAAU,KAAK,QAAQ,OAAO;AAEpC,MAAI,WAAW,QAAQ,OAAO,OAC1B,QAAO;AAGX,SAAO;;CAwCX,SAAkB;EAEd,MAAM,cAAc,KAAK,eAAe,qBAAqB,KAAK,KAAK;EACvE,MAAM,iBAAiB,sBAAsB,KAAK,SAAS,KAAK,eAAe;AAG/E,SAAO,IAAI;cAFI,QAAQ,KAAK,KAGtB,GACI,IAAI;;;gCAGU,KAAK,eAAe,CAAC;+BACtB,KAAK,KAAM;iCACT,KAAK,UAAU,QAAQ;8BAC1B,KAAK,OAAO,QAAQ;gCAClB,KAAK,SAAS,QAAQ;;0BAE5B,KAAK,YAAY,aAAa,eAAe,CAAC;;oBAGtD,IAAI;;;gCAGU,KAAK,eAAe,CAAC;+BACtB,KAAK,KAAK;oCACL,KAAK,SAAS;wCACV,KAAK,WAAW,SAAS,QAAQ;oCACrC,KAAK,UAAU,SAAS,QAAQ;+BACrC,KAAK,QAAQ,QAAQ;gCACpB,KAAK,SAAS,QAAQ;gCACtB,KAAK,SAAS,QAAQ;;0BAE5B,KAAK,YAAY,aAAa,eAAe,CAAC;;kBAEtD;;;CAId,YAAoB,aAA4B,gBAAkC;AAC9E,SAAO,IAAI;;wBAEK,SAAS;GACb,aAAa;GACb,oBAAoB;GACpB,0BAA0B,KAAK;GAClC,CAAC,CAAC;;iDAE8B,KAAK,iBAAiB;;cAEzD,KAAK,UACD,IAAI;;kCAEY,eAAe;+BAClB,YAAY;+BACZ,KAAK,eAAe,QAAQ;;;oBAIzC,QAAQ;;wBAEF,SAAS;GACb,OAAO;GACP,YAAY,CAAC,KAAK;GAClB,SAAS,KAAK;GACjB,CAAC,CAAC;;oCAEiB,KAAK,mBAAmB;;;wBAGpC,SAAS;GACb,aAAa;GACb,kBAAkB;GAClB,0BAA0B,KAAK;GAClC,CAAC,CAAC;;+CAE4B,KAAK,eAAe;;cAErD,KAAK,aAAa,KAAK,eACnB,IAAI,oCAAoC,UAAU,WAAW,CAAC,WAC9D,QAAQ;;;;YA9RrB,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,SAAA,WAAA,WAAA,KAAA,EAAA;YAG3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,SAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,SAAA,WAAA,WAAA,KAAA,EAAA;YAQ1C,SAAS;CAAE,SAAS;CAAM,WAAW;CAAgB,CAAC,CAAA,EAAA,SAAA,WAAA,eAAA,KAAA,EAAA;YAGtD,SAAS;CAAE,SAAS;CAAM,WAAW;CAAmB,CAAC,CAAA,EAAA,SAAA,WAAA,kBAAA,KAAA,EAAA;YAGzD,SAAS;CAAE,SAAS;CAAM,WAAW;CAAgB,CAAC,CAAA,EAAA,SAAA,WAAA,eAAA,KAAA,EAAA;YAGtD,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAc,CAAC,CAAA,EAAA,SAAA,WAAA,aAAA,KAAA,EAAA;YAWnE,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAiB,CAAC,CAAA,EAAA,SAAA,WAAA,gBAAA,KAAA,EAAA;YAWtE,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAG1C,UAAU,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,UAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,OAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,SAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,SAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAOV,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,SAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,OAAO,CAAA,EAAA,SAAA,WAAA,yBAAA,KAAA,EAAA;YAGP,OAAO,CAAA,EAAA,SAAA,WAAA,uBAAA,KAAA,EAAA;YAGP,OAAO,CAAA,EAAA,SAAA,WAAA,qBAAA,KAAA,EAAA;uBA9FX,cAAc,YAAY,CAAA,EAAA,SAAA"}

package/dist/chunks/pk-combobox-Dd1ik0Ko.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pk-combobox-Dd1ik0Ko.js","names":[],"sources":["../../src/events/pk-create.ts","../../src/components/combobox/pk-combobox.styles.ts","../../src/components/combobox/pk-combobox.ts"],"sourcesContent":["/** Fired before a combobox creates a new option — mirrors  `pk-create`. */\nexport class PkCreateEvent extends Event {\n    readonly inputValue: string;\n\n    constructor(inputValue: string) {\n        super('pk-create', { bubbles: true, cancelable: true, composed: true });\n        this.inputValue = inputValue;\n    }\n}\n\ndeclare global {\n    interface GlobalEventHandlersEventMap {\n        'pk-create': PkCreateEvent;\n    }\n}\n","import { css } from 'lit';\n\nimport { iconStyles } from '../../base/icon.styles.js';\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\n\nexport const pkComboboxStyles = [\n    popupContentAnimationStyles,\n    css`\n    ${iconStyles}\n    @layer pk-component {\n        :host {\n            display: inline-block;\n            position: relative;\n            width: fit-content;\n            max-width: 100%;\n            align-self: flex-start;\n            flex: none;\n            color: var(--pk-color-gray-700);\n            font-family: var(--pk-font-family);\n            font-size: var(--pk-font-size-base);\n            line-height: var(--pk-line-height);\n            --pk-combobox-min-height: 0;\n            --pk-combobox-trigger-min-height: var(--pk-btn-height-default);\n            --pk-combobox-padding-block: 6px;\n            --pk-combobox-padding-inline: 10px;\n            --pk-combobox-font-size: var(--pk-font-size-base);\n            --pk-combobox-line-height: var(--pk-input-control-line-height, 1.25rem);\n            --pk-combobox-decoration-size: 0.875rem;\n            --pk-select-item-min-height: 0;\n            --pk-select-item-padding-block: 6px;\n            --pk-select-item-padding-inline: 10px;\n            --pk-select-item-padding-inline-end: 2rem;\n            --pk-select-item-font-size: 14px;\n            --pk-select-item-line-height: 1.4;\n            --pk-select-item-indicator-size: 0.75rem;\n            --pk-select-item-indicator-inset: 0.5rem;\n            /* v1 ComboboxLabel default: text-xs → 12px (was 11px). */\n            --pk-select-group-label-font-size: 12px;\n        }\n\n        :host([width='full']) {\n            display: block;\n            width: 100%;\n        }\n\n        :host([width='full']) .control {\n            width: 100%;\n        }\n\n        .control {\n            display: inline-flex;\n            align-items: center;\n            --pk-combobox-control-gap: 0.5rem;\n            gap: var(--pk-combobox-control-gap);\n            /* Fill the host — consumers set min-width/width on :host; fit-content here\n               left a dead hit strip beside the painted field (same class of bug as dropdown). */\n            width: 100%;\n            max-width: 100%;\n            min-width: 0;\n            min-height: var(--pk-combobox-min-height);\n            margin: 0;\n            padding: var(--pk-combobox-padding-block) var(--pk-combobox-padding-inline);\n            border: 1px solid transparent;\n            border-radius: var(--pk-radius-lg);\n            --pk-combobox-fill: var(--pk-color-slate-250);\n            --pk-combobox-fill-hover: var(--pk-color-slate-300);\n            background: var(--pk-combobox-fill);\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-combobox-font-size);\n            line-height: var(--pk-input-control-line-height, 1.25rem);\n            white-space: nowrap;\n            cursor: text;\n            outline: none;\n            box-sizing: border-box;\n            transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;\n        }\n\n        .control[data-popup-open] {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-color-white);\n        }\n\n        :host(:not([disabled])) .control:hover:not(.is-disabled) {\n            background: var(--pk-combobox-fill-hover);\n        }\n\n        :host(:not([disabled])) .control[data-popup-open]:hover:not(.is-disabled),\n        :host(:not([disabled])) .control[data-popup-open]:focus-within:not(.is-disabled) {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-color-white);\n        }\n\n        :host(:not([invalid]):not(:state(user-invalid))) .control:focus-within,\n        :host(:not([invalid]):not(:state(user-invalid))[data-state='focus-visible']) .control {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-color-white);\n        }\n\n        .control.is-disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .control-start,\n        .control-end {\n            display: inline-flex;\n            align-items: center;\n            flex-shrink: 0;\n            line-height: 0;\n            color: var(--pk-color-gray-600);\n        }\n\n        slot[name='start']::slotted(svg),\n        slot[name='end']::slotted(svg) {\n            width: var(--pk-combobox-decoration-size);\n            height: var(--pk-combobox-decoration-size);\n        }\n\n        .combobox-input {\n            flex: 1 1 auto;\n            width: 100%;\n            min-width: 0;\n            margin: 0;\n            padding: 0;\n            border: 0;\n            background: transparent;\n            color: inherit;\n            font: inherit;\n            line-height: var(--pk-input-control-line-height, 1.25rem);\n            outline: none;\n        }\n\n        .combobox-input::placeholder {\n            color: currentColor;\n        }\n\n        :host([data-has-value]) .combobox-input::placeholder,\n        .control[data-popup-open] .combobox-input::placeholder,\n        .control:focus-within .combobox-input::placeholder {\n            color: var(--pk-color-gray-400);\n        }\n\n        /* Expand/clear: the button box IS the hit target. Negative margins cancel the\n           control padding / half-gap in layout, while matching extra width/height keeps\n           the painted (and clickable) box flush to the field edge — so flex centering\n           places the glyph in the middle of the real hit area. */\n        .icon-button,\n        .clear-button {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            align-self: stretch;\n            box-sizing: border-box;\n            width: calc(var(--pk-combobox-decoration-size) + var(--pk-combobox-control-gap));\n            height: auto;\n            min-height: var(--pk-combobox-decoration-size);\n            margin-block: calc(-1 * var(--pk-combobox-padding-block));\n            margin-inline: calc(-0.5 * var(--pk-combobox-control-gap));\n            padding: 0;\n            border: 0;\n            border-radius: 0;\n            background: transparent;\n            color: var(--pk-color-gray-600);\n            cursor: pointer;\n            outline: none;\n        }\n\n        /* Trailing control absorbs the control's inline-end padding into its hit box. */\n        .control > .expand-button,\n        .control > .clear-button:last-child {\n            width: calc(\n                var(--pk-combobox-decoration-size) + (0.5 * var(--pk-combobox-control-gap)) +\n                    var(--pk-combobox-padding-inline)\n            );\n            margin-inline-start: calc(-0.5 * var(--pk-combobox-control-gap));\n            margin-inline-end: calc(-1 * var(--pk-combobox-padding-inline));\n        }\n\n        .icon-button:disabled,\n        .clear-button:disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .icon {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            line-height: 0;\n            pointer-events: none;\n            color: var(--pk-color-gray-600);\n        }\n\n        .icon svg {\n            display: block;\n            width: 0.75rem;\n            height: 0.75rem;\n        }\n\n        .clear-button-icon {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            line-height: 0;\n            pointer-events: none;\n        }\n\n        .clear-button-icon svg {\n            display: block;\n            width: 0.75rem;\n            height: 0.75rem;\n        }\n\n        .control--multiple {\n            --pk-combobox-control-gap: 0.25rem;\n            flex-wrap: wrap;\n            align-items: center;\n            align-content: center;\n            width: 100%;\n            max-width: 100%;\n            height: auto;\n            min-height: 0;\n            padding: var(--pk-combobox-padding-block) var(--pk-combobox-padding-inline);\n            gap: var(--pk-combobox-control-gap);\n            border: var(--pk-input-border);\n            border-radius: var(--pk-input-border-radius);\n            background: var(--pk-input-bg);\n            cursor: text;\n        }\n\n        :host([multiple][width='full']) .control--multiple {\n            width: 100%;\n        }\n\n        :host([multiple]) .control:hover:not(.is-disabled) {\n            background: var(--pk-input-bg);\n        }\n\n        :host([multiple]:not([invalid]):not(:state(user-invalid))) .control[data-popup-open],\n        :host([multiple]:not([invalid]):not(:state(user-invalid))) .control:focus-within,\n        :host([multiple]:not([invalid]):not(:state(user-invalid))[data-state='focus-visible']) .control {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-input-bg);\n        }\n\n        .chips {\n            display: flex;\n            flex: 0 1 auto;\n            flex-wrap: wrap;\n            gap: 0.25rem;\n            align-items: center;\n            min-width: 0;\n        }\n\n        .tag {\n            /* v1 ComboboxChip: text-xs + py-[2px] → 20px; face color gray-700. */\n            --pk-combobox-tag-height: 20px;\n            --pk-combobox-tag-padding-inline-start: 6px;\n            --pk-combobox-tag-remove-width: 1.25rem;\n            display: inline-flex;\n            box-sizing: border-box;\n            align-items: center;\n            justify-content: center;\n            gap: 0.125rem;\n            max-width: 100%;\n            height: var(--pk-combobox-tag-height);\n            padding-block: 0;\n            padding-inline: var(--pk-combobox-tag-padding-inline-start) 0;\n            border-radius: var(--pk-radius-sm);\n            background: var(--pk-color-slate-200);\n            color: var(--pk-color-gray-700);\n            font-size: 12px;\n            font-weight: 500;\n            line-height: 1rem;\n            white-space: nowrap;\n        }\n\n        .tag-label {\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n\n        /* Chip remove: fill the chip end so the glyph centers in the real target. */\n        .tag-remove {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            align-self: stretch;\n            box-sizing: border-box;\n            width: var(--pk-combobox-tag-remove-width);\n            height: auto;\n            min-height: 0;\n            margin: 0;\n            padding: 0;\n            border: 0;\n            border-radius: 0;\n            background: transparent;\n            color: inherit;\n            cursor: pointer;\n            opacity: 0.5;\n            outline: none;\n        }\n\n        .tag-remove:hover {\n            opacity: 1;\n        }\n\n        .tag-remove-icon {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            line-height: 0;\n            pointer-events: none;\n        }\n\n        .tag-remove-icon svg {\n            display: block;\n            width: 0.625rem;\n            height: 0.625rem;\n        }\n\n        .combobox-input--inline {\n            flex: 1 1 4rem;\n            width: auto;\n            min-width: 4rem;\n            padding: 0;\n        }\n\n        :host([multiple]) .control:not([data-popup-open]):not(:focus-within) {\n            background: var(--pk-input-bg);\n        }\n\n        :host([multiple]) .combobox-input::placeholder {\n            color: var(--pk-color-gray-400);\n        }\n\n        .create-option {\n            display: flex;\n            align-items: center;\n            width: 100%;\n            margin: 0;\n            min-height: var(--pk-select-item-min-height);\n            padding-block: var(--pk-select-item-padding-block);\n            padding-inline: var(--pk-select-item-padding-inline);\n            border: 0;\n            background: transparent;\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-select-item-font-size);\n            line-height: var(--pk-select-item-line-height);\n            text-align: left;\n            cursor: pointer;\n            outline: none;\n            box-sizing: border-box;\n        }\n\n        .create-option:hover,\n        .create-option.is-highlighted {\n            background: var(--pk-color-slate-100);\n        }\n\n        .value-input {\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: 0;\n        }\n\n        .panel ::slotted(pk-separator) {\n            margin: 4px 0;\n        }\n\n        .panel {\n            width: max-content;\n            min-width: var(--pk-combobox-anchor-width, 8rem);\n            padding: 0;\n            border: 0;\n            border-radius: var(--pk-radius-md);\n            background: var(--pk-color-white);\n            box-shadow: var(--pk-shadow-popup);\n            color: var(--pk-color-gray-700);\n            outline: none;\n        }\n\n        .panel-body {\n            max-height: 16rem;\n            overflow: auto;\n        }\n\n        .panel--popup {\n            display: flex;\n            flex-direction: column;\n            overflow: hidden;\n        }\n\n        .panel--popup .panel-body {\n            flex: 1 1 auto;\n            min-height: 0;\n        }\n\n        :host([popup-mode]) .control--popup {\n            display: inline-flex;\n            width: 100%;\n            max-width: 100%;\n            min-height: 0;\n            padding: 0;\n            border: 0;\n            border-radius: 0;\n            background: transparent;\n            gap: 0;\n            cursor: default;\n        }\n\n        :host([popup-mode]) .control--popup:hover:not(.is-disabled) {\n            background: transparent;\n        }\n\n        /* Popup mode paints chrome on the trigger / panel input — do not keep the\n           shared .control[data-popup-open] focus ring around the closed-state button. */\n        :host([popup-mode]) .control--popup[data-popup-open],\n        :host([popup-mode]) .control--popup[data-popup-open]:hover:not(.is-disabled),\n        :host([popup-mode]) .control--popup[data-popup-open]:focus-within:not(.is-disabled),\n        :host([popup-mode]:not([invalid]):not(:state(user-invalid))) .control--popup:focus-within,\n        :host([popup-mode]:not([invalid]):not(:state(user-invalid))[data-state='focus-visible']) .control--popup {\n            border: 0;\n            box-shadow: none;\n            background: transparent;\n        }\n\n        .popup-trigger {\n            display: inline-flex;\n            align-items: center;\n            justify-content: space-between;\n            gap: 0.75rem;\n            width: 100%;\n            min-width: 12rem;\n            max-width: 100%;\n            min-height: var(--pk-combobox-trigger-min-height);\n            margin: 0;\n            padding: var(--pk-combobox-padding-block) var(--pk-combobox-padding-inline);\n            border: 1px solid transparent;\n            border-radius: var(--pk-input-border-radius);\n            /* Match input-mode fill / v1 default Button — not a white outlined field. */\n            background: var(--pk-combobox-fill, var(--pk-color-slate-250));\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-combobox-font-size);\n            font-weight: 400;\n            line-height: var(--pk-combobox-line-height);\n            text-align: left;\n            white-space: nowrap;\n            cursor: pointer;\n            outline: none;\n            box-sizing: border-box;\n            transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;\n        }\n\n        .popup-trigger:hover:not(:disabled) {\n            background: var(--pk-combobox-fill-hover, var(--pk-color-slate-300));\n        }\n\n        .popup-trigger:active:not(:disabled),\n        .control--popup[data-popup-open] .popup-trigger:not(:disabled) {\n            background: var(--pk-combobox-fill-hover, var(--pk-color-slate-300));\n        }\n\n        .control--popup[data-popup-open] .popup-trigger:not(:disabled) {\n            border-color: transparent;\n            box-shadow: none;\n        }\n\n        .control--popup:not([data-popup-open]) .popup-trigger:focus-visible,\n        :host([data-state='focus-visible']) .control--popup:not([data-popup-open]) .popup-trigger {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-color-white);\n        }\n\n        .popup-trigger:disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .popup-trigger-value {\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n\n        .popup-trigger-value.is-placeholder {\n            /* Trigger label is button text, not an input placeholder — keep it readable. */\n            color: var(--pk-color-gray-700);\n        }\n\n        .popup-trigger-icon {\n            flex-shrink: 0;\n            display: inline-flex;\n            align-items: center;\n            line-height: 0;\n        }\n\n        .popup-trigger-icon svg {\n            display: block;\n            width: 0.75rem;\n            height: 0.75rem;\n        }\n\n        .panel-search {\n            flex: none;\n            padding: 0.25rem;\n        }\n\n        .panel-input {\n            display: block;\n            width: 100%;\n            min-width: 0;\n            margin: 0;\n            padding: 6px 8px;\n            border: var(--pk-input-border);\n            border-radius: var(--pk-input-border-radius);\n            background: color-mix(in srgb, var(--pk-input-bg) 30%, transparent);\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-combobox-font-size);\n            line-height: 1.4;\n            outline: none;\n            box-sizing: border-box;\n        }\n\n        .panel-input::placeholder {\n            color: var(--pk-color-gray-400);\n        }\n\n        .panel-input:focus {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n            background: var(--pk-color-white);\n        }\n\n        :host([popup-mode][size='xs']) .popup-trigger-icon svg {\n            width: 0.625rem;\n            height: 0.625rem;\n        }\n\n        :host([popup-mode][size='xs']) .panel-input {\n            padding: 4px 8px;\n            font-size: 11px;\n        }\n\n        :host([popup-mode][size='sm']) .panel-input {\n            font-size: 12px;\n        }\n\n        :host([popup-mode][size='lg']) .panel-input {\n            padding-block: 8px;\n            padding-inline: 12px;\n        }\n\n        :host([popup-mode][width='full']) .popup-trigger {\n            width: 100%;\n        }\n\n        .panel:not([data-open]):not(.closing) {\n            opacity: 0;\n            pointer-events: none;\n        }\n\n        .panel[data-open]:not(.closing) {\n            opacity: 1;\n            pointer-events: auto;\n        }\n\n        .panel[hidden] {\n            display: none !important;\n        }\n\n        .empty {\n            display: flex;\n            align-items: center;\n            margin: 0;\n            min-height: var(--pk-select-item-min-height, var(--pk-input-height));\n            padding-block: var(--pk-select-item-padding-block);\n            padding-inline: var(--pk-select-item-padding-inline);\n            border: var(--pk-select-trigger-border-width, 1px) solid transparent;\n            box-sizing: border-box;\n            color: var(--pk-color-gray-500);\n            font-size: var(--pk-select-item-font-size);\n            line-height: var(--pk-select-item-line-height);\n        }\n\n        .async-status {\n            display: flex;\n            align-items: center;\n            margin: 0;\n            min-height: var(--pk-select-item-min-height, var(--pk-input-height));\n            padding-block: var(--pk-select-item-padding-block);\n            padding-inline: var(--pk-select-item-padding-inline);\n            border: var(--pk-select-trigger-border-width, 1px) solid transparent;\n            box-sizing: border-box;\n            color: var(--pk-color-gray-500);\n            font-size: var(--pk-select-item-font-size);\n            line-height: var(--pk-select-item-line-height);\n        }\n\n        :host([invalid]) .control,\n        :host(:state(user-invalid)) .control {\n            border-color: var(--pk-color-rose-600);\n        }\n\n        :host([multiple][invalid]) .control,\n        :host([multiple]:state(user-invalid)) .control {\n            border-color: var(--pk-color-rose-600);\n        }\n\n        :host([invalid]) .control:focus-within,\n        :host([invalid][data-state='focus-visible']) .control,\n        :host(:state(user-invalid)) .control:focus-within,\n        :host(:state(user-invalid)[data-state='focus-visible']) .control {\n            border-color: var(--pk-color-rose-600);\n            box-shadow: var(--pk-input-invalid-focus-shadow);\n        }\n\n        :host([size='xs']) {\n            --pk-combobox-min-height: 0;\n            --pk-combobox-trigger-min-height: var(--pk-btn-height-xs);\n            --pk-combobox-padding-block: 4px;\n            --pk-combobox-padding-inline: 8px;\n            --pk-combobox-font-size: 11px;\n            --pk-combobox-decoration-size: 0.625rem;\n            --pk-select-item-min-height: 0;\n            --pk-select-item-padding-block: 4px;\n            --pk-select-item-padding-inline: 8px;\n            --pk-select-item-padding-inline-end: 1.75rem;\n            --pk-select-item-font-size: 11px;\n            --pk-select-item-indicator-size: 0.75rem;\n            --pk-select-item-indicator-inset: 0.5rem;\n            /* v1 ComboboxLabel xs: text-[11px] */\n            --pk-select-group-label-font-size: 11px;\n        }\n\n        :host([size='xs']) .control {\n            border-radius: var(--pk-radius-sm);\n        }\n\n        :host([size='xs']) .icon svg,\n        :host([size='xs']) .clear-button-icon svg {\n            width: 0.625rem;\n            height: 0.625rem;\n        }\n\n        :host([size='sm']) {\n            --pk-combobox-min-height: 0;\n            --pk-combobox-trigger-min-height: var(--pk-btn-height-sm);\n            --pk-combobox-padding-block: 6px;\n            --pk-combobox-padding-inline: 10px;\n            --pk-combobox-font-size: 12px;\n            --pk-combobox-decoration-size: 0.6875rem;\n            --pk-select-item-min-height: 0;\n            --pk-select-item-padding-block: 6px;\n            --pk-select-item-padding-inline: 10px;\n            --pk-select-item-padding-inline-end: 1.75rem;\n            --pk-select-item-font-size: 12px;\n            --pk-select-item-indicator-inset: 0.625rem;\n            /* v1 ComboboxLabel sm: text-[12px] — empty dropzone field picker uses sm. */\n            --pk-select-group-label-font-size: 12px;\n        }\n\n        :host([size='sm']) .control {\n            border-radius: var(--pk-radius-md);\n        }\n\n        :host([size='sm']) .popup-trigger {\n            border-radius: var(--pk-radius-md);\n        }\n\n        :host([size='sm']) .icon svg,\n        :host([size='sm']) .clear-button-icon svg {\n            width: 0.6875rem;\n            height: 0.6875rem;\n        }\n\n        :host([size='lg']) {\n            --pk-combobox-trigger-min-height: var(--pk-btn-height-lg);\n            --pk-combobox-padding-block: 8px;\n            --pk-combobox-padding-inline: 12px;\n            --pk-combobox-font-size: var(--pk-font-size-base);\n            --pk-combobox-decoration-size: 1rem;\n            --pk-select-item-padding-block: 8px;\n            --pk-select-item-padding-inline: 12px;\n            --pk-select-item-font-size: 14px;\n            --pk-select-item-indicator-inset: 0.75rem;\n            /* v1 ComboboxLabel lg: text-sm → 14px */\n            --pk-select-group-label-font-size: 14px;\n        }\n\n        :host([size='xl']) {\n            --pk-combobox-trigger-min-height: var(--pk-btn-height-xl);\n            --pk-combobox-padding-block: 10px;\n            --pk-combobox-padding-inline: 14px;\n            --pk-combobox-font-size: var(--pk-font-size-base);\n            --pk-combobox-decoration-size: 1.125rem;\n            --pk-select-item-padding-block: 10px;\n            --pk-select-item-padding-inline: 14px;\n            --pk-select-item-padding-inline-end: 2.25rem;\n            --pk-select-item-font-size: 14px;\n            --pk-select-item-indicator-inset: 0.875rem;\n            /* v1 ComboboxLabel xl: text-base → 16px */\n            --pk-select-group-label-font-size: 16px;\n        }\n\n        :host([size='xl']) .icon svg,\n        :host([size='xl']) .clear-button-icon svg {\n            width: 0.875rem;\n            height: 0.875rem;\n        }\n    }\n`,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport type { PropertyValues } from 'lit';\n\nimport { chevronDown, xmark, renderIconHtml } from '../../icons/index.js';\nimport { LiveRegion, uniqueId } from '../../a11y/focus.js';\nimport { isTopDismissible, registerDismissible, unregisterDismissible } from '../../a11y/dismissible-stack.js';\nimport { scrollIntoView } from '../../a11y/scroll-lock.js';\nimport { PkFormAssociatedElement } from '../../base/pk-form-associated-element.js';\nimport { HasSlotController } from '../../internal/has-slot.js';\nimport { PkClearEvent } from '../../events/pk-clear.js';\nimport { PkCreateEvent } from '../../events/pk-create.js';\nimport {\n    PkAfterHideEvent,\n    PkAfterShowEvent,\n    PkHideEvent,\n    PkShowEvent,\n    type PkOverlaySource,\n} from '../../events/overlay-lifecycle.js';\nimport type { PkValidator } from '../../validators/types.js';\nimport { MirrorValidator } from '../../validators/mirror-validator.js';\nimport { PkPopup, type PkPopupPlacement } from '../popup/pk-popup.js';\nimport {\n    handleListboxKeyDown,\n    isListboxTypeToSelectKey,\n    LISTBOX_NAVIGATION_KEYS,\n} from '../../utils/listbox-keyboard.js';\nimport {\n    syncPopupPlacementAnimation,\n    waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\nimport { isEventInsideOverlay, isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport { syncListboxSeparators } from '../../internal/sync-listbox-separators.js';\nimport type { PkOption } from '../select/pk-option.js';\nimport type { PkOptionGroup } from '../select/pk-option-group.js';\nimport { pkComboboxStyles } from './pk-combobox.styles.js';\n\nexport type PkComboboxSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';\n\nexport type PkComboboxFilter = (option: PkOption, query: string) => boolean;\n\nexport type PkComboboxAsyncOption = {\n    value: string;\n    label: string;\n};\n\nexport type PkComboboxFetchHandler = (\n    query: string,\n    signal: AbortSignal,\n) => Promise<PkComboboxAsyncOption[]>;\n\nconst CHEVRON_ICON = renderIconHtml(chevronDown);\nconst XMARK_ICON = renderIconHtml(xmark);\n\n/**\n * Combobox — searchable select with separate input and selection state.\n *\n * @slot start - Presentational decoration before the input (e.g. icons)\n * @slot end - Presentational decoration before the expand/clear controls\n * @slot - `pk-option` and `pk-option-group` items\n *\n * @csspart control - Input control wrapper\n * @csspart start - Host start decoration container\n * @csspart end - Host end decoration container\n * @csspart input - Combobox text input\n * @csspart tags - Multiselect chip container\n * @csspart tag - Individual multiselect chip\n * @csspart tag-remove - Chip remove button\n * @csspart clear-button - Clear selection button\n * @csspart expand-button - Toggle listbox button\n * @csspart trigger - Popup-mode trigger button (shows the selected value)\n * @csspart panel-search - Popup-mode search field container\n * @csspart panel-input - Popup-mode search input\n * @csspart panel-body - Scrollable listbox region inside the popup panel\n * @csspart empty - Empty-state message\n * @csspart async-status - Async search status message\n *\n * @event pk-create - Cancelable. Fired before a new option is created when `allow-create` is enabled.\n */\n@customElement('pk-combobox')\nexport class PkCombobox extends PkFormAssociatedElement {\n    static override styles = pkComboboxStyles;\n\n    static override get validators(): PkValidator[] {\n        return [\n            ...super.validators,\n            MirrorValidator(),\n            {\n                observedAttributes: ['required'],\n                checkValidity: (element) => {\n                    const combobox = element as PkCombobox;\n                    const result = {\n                        message: 'Please select an item in the list.',\n                        isValid: true,\n                        invalidKeys: [] as ReturnType<PkValidator['checkValidity']>['invalidKeys'],\n                    };\n\n                    if (!combobox.required) {\n                        return result;\n                    }\n\n                    const missing = combobox.multiple\n                        ? combobox.values.length === 0\n                        : !combobox.value;\n\n                    if (!missing) {\n                        return result;\n                    }\n\n                    result.isValid = false;\n                    result.invalidKeys.push('valueMissing');\n                    return result;\n                },\n            },\n        ];\n    }\n\n    override assumeInteractionOn = ['blur', 'input'];\n\n    @property({ type: Boolean, reflect: true })\n    open = false;\n\n    @property({ type: Boolean, reflect: true })\n    multiple = false;\n\n    @property({ reflect: true })\n    placement: PkPopupPlacement = 'bottom-start';\n\n    /** Gap between the control and listbox panel in px (default: 6). */\n    @property({ attribute: 'side-offset', type: Number })\n    sideOffset = 6;\n\n    @property({ type: Boolean, reflect: true })\n    clearable = false;\n\n    @property({ attribute: 'with-clear', type: Boolean })\n    withClear = false;\n\n    @property({ attribute: 'allow-create', type: Boolean })\n    allowCreate = false;\n\n    @property({ attribute: 'allow-custom-value', type: Boolean })\n    allowCustomValue = false;\n\n    /** When true, the first matching option is highlighted on open or when filtering. */\n    @property({ attribute: 'auto-highlight', type: Boolean })\n    autoHighlight = false;\n\n    /** When true, the control shows a trigger button and the search field renders inside the popup. */\n    @property({ attribute: 'popup-mode', type: Boolean, reflect: true })\n    popupMode = false;\n\n    @property({ attribute: 'search-placeholder' })\n    searchPlaceholder = 'Search';\n\n    @property({ type: Boolean, reflect: true })\n    invalid = false;\n\n    @property({ reflect: true })\n    size: PkComboboxSize = 'default';\n\n    /** When `full`, the control stretches to the host width. */\n    @property({ reflect: true })\n    width?: 'full';\n\n    /** Empty by default — consumers opt in when a prompt is useful. */\n    @property()\n    placeholder = '';\n\n    @property({ attribute: 'empty-message' })\n    emptyMessage = 'No options found.';\n\n    @property()\n    value = '';\n\n    @property({ attribute: 'default-value' })\n    defaultValue = '';\n\n    @property({ type: Array, attribute: false })\n    values: string[] = [];\n\n    @property({ attribute: false })\n    defaultValues: string[] = [];\n\n    @property()\n    label = '';\n\n    @property()\n    instructions = '';\n\n    @property({ attribute: 'aria-label' })\n    ariaLabel: string | null = null;\n\n    /**\n     * Whether arrow-key focus loops from the last option back to the first (and vice versa).\n     * Mirrors Base UI `Combobox` — default: `true`.\n     */\n    @property({ attribute: 'loop-focus', type: Boolean })\n    loopFocus = true;\n\n    /** Custom filter — `(option, query) => boolean`. Defaults to label/value substring match. */\n    @property({ attribute: false })\n    filter: PkComboboxFilter | null = null;\n\n    /**\n     * When true, options are loaded via `fetchOptions` as the user types instead of\n     * filtering static `pk-option` children.\n     */\n    @property({ type: Boolean, reflect: true })\n    async = false;\n\n    /** Message shown while async results are loading. */\n    @property({ attribute: 'loading-message' })\n    loadingMessage = 'Searching…';\n\n    /** Message shown before the user types in async mode. */\n    @property({ attribute: 'start-typing-message' })\n    startTypingMessage = 'Start typing to search…';\n\n    /** Remote search handler — `(query, signal) => Promise<options>`. */\n    @property({ attribute: false })\n    fetchOptions: PkComboboxFetchHandler | null = null;\n\n    private readonly hasSlotController = new HasSlotController(this, 'start', 'end');\n\n    private readonly listboxId = uniqueId('pk-combobox-listbox');\n    private readonly inputId = uniqueId('pk-combobox-input');\n    private readonly createOptionId = uniqueId('pk-combobox-create');\n\n    @query('pk-popup')\n    private popupElement!: PkPopup;\n\n    @query('.control')\n    private controlElement!: HTMLElement;\n\n    @query('.control-input')\n    private controlInput?: HTMLInputElement;\n\n    @query('.popup-trigger')\n    private popupTrigger?: HTMLButtonElement;\n\n    @query('.create-option')\n    private createOptionElement?: HTMLButtonElement;\n\n    @query('.value-input')\n    override input!: HTMLInputElement;\n\n    private get panelElement(): HTMLDivElement | null {\n        return this.popupElement?.getContentElement() as HTMLDivElement | null ?? null;\n    }\n\n    private get panelInput(): HTMLInputElement | undefined {\n        return this.panelElement?.querySelector('.panel-input') as HTMLInputElement | undefined;\n    }\n\n    private get panelBodyElement(): HTMLDivElement | undefined {\n        return this.panelElement?.querySelector('.panel-body') as HTMLDivElement | undefined;\n    }\n\n    private get usesPopupMode(): boolean {\n        return this.popupMode && !this.multiple;\n    }\n\n    private get activeInput(): HTMLInputElement | undefined {\n        return this.usesPopupMode ? this.panelInput : this.controlInput;\n    }\n\n    /** Combobox keeps focus on the text field and uses `aria-activedescendant` for highlight. */\n    private keepsFocusOnInput(): boolean {\n        return Boolean(this.activeInput);\n    }\n\n    private maintainInputFocus(): void {\n        this.activeInput?.focus({ preventScroll: true });\n    }\n\n    private get listScrollContainer(): HTMLElement {\n        return this.panelBodyElement ?? this.panelElement ?? this;\n    }\n\n    private options: PkOption[] = [];\n\n    /** Filter text while the listbox is open — separate from `value`. */\n    @state()\n    private inputValue = '';\n\n    /** True once the user edits the input after the current open cycle (open-cycle edit tracking). */\n    private hasInputSinceOpening = false;\n\n    @state()\n    private highlightedIndex = -1;\n\n    @state()\n    private createOptionHighlighted = false;\n\n    @state()\n    private closing = false;\n\n    @state()\n    private panelAnimated = false;\n\n    private dismissRegistered = false;\n    private panelEventTarget: HTMLElement | null = null;\n    private optionsObserver?: MutationObserver;\n    private liveRegion?: LiveRegion;\n    private fetchAbortController?: AbortController;\n    private asyncFetchTimer?: number;\n    private asyncFetchRequestId = 0;\n    private selectedOptionMeta: PkComboboxAsyncOption | null = null;\n\n    @state()\n    private asyncLoading = false;\n\n    @state()\n    private asyncError: string | null = null;\n\n    override connectedCallback(): void {\n        this.instructions = this.getAttribute('hint') ?? this.instructions;\n        this.refreshOptions();\n        super.connectedCallback();\n        this.syncHasValueAttribute();\n        this.addEventListener('pk-listbox-keydown', this.handleListboxKeyDownEvent as EventListener);\n        this.optionsObserver = new MutationObserver(() => {\n            this.handleOptionsMutation({ render: true });\n        });\n        this.optionsObserver.observe(this, { childList: true, subtree: true });\n    }\n\n    override disconnectedCallback(): void {\n        this.unbindPanelEvents();\n        this.removeEventListener('pk-listbox-keydown', this.handleListboxKeyDownEvent as EventListener);\n        this.optionsObserver?.disconnect();\n        this.liveRegion?.destroy();\n        this.liveRegion = undefined;\n        window.clearTimeout(this.asyncFetchTimer);\n        this.fetchAbortController?.abort();\n        void this.closePanel('api');\n        super.disconnectedCallback();\n    }\n\n    override updated(changed: PropertyValues): void {\n        if (changed.has('value') || changed.has('values') || changed.has('multiple')) {\n            this.syncHasValueAttribute();\n            this.syncSelectedOptionMeta();\n            this.applySelection();\n        }\n\n        super.updated(changed);\n    }\n\n    protected override get validationTarget(): HTMLElement | undefined {\n        return this.activeInput ?? this.popupTrigger ?? this.controlElement;\n    }\n\n    protected override getAriaMirrorTarget(): HTMLElement | null {\n        return this.activeInput ?? this.popupTrigger ?? this.controlElement ?? null;\n    }\n\n    protected override syncFormValue(): void {\n        if (!this.name) {\n            this.setFormValue(null);\n            return;\n        }\n\n        if (this.multiple) {\n            const formData = new FormData();\n\n            for (const item of this.values) {\n                formData.append(this.name, item);\n            }\n\n            this.setFormValue(formData);\n            return;\n        }\n\n        this.setFormValue(this.value || '');\n    }\n\n    protected override resetToDefaultValue(): void {\n        if (this.multiple) {\n            this.values = [...this.defaultValues];\n        } else {\n            this.value = this.defaultValue;\n        }\n\n        this.inputValue = '';\n        this.applySelection();\n    }\n\n    protected override restoreFormState(state: string | File | FormData | null): void {\n        if (state instanceof FormData && this.name) {\n            this.values = state.getAll(this.name).map(String);\n            return;\n        }\n\n        if (typeof state === 'string') {\n            this.value = state;\n        }\n    }\n\n    private syncHasValueAttribute(): void {\n        this.toggleAttribute('data-has-value', this.hasSelection());\n    }\n\n    private getOptionElements(): PkOption[] {\n        const portaled = this.popupElement?.getContentElement()?.querySelectorAll('pk-option');\n\n        if (portaled && portaled.length > 0) {\n            return [...portaled];\n        }\n\n        return [...this.querySelectorAll('pk-option')];\n    }\n\n    private handleOptionsMutation = (options: { render?: boolean } = {}): void => {\n        const next = this.getOptionElements();\n        const changed = next.length !== this.options.length\n            || next.some((option, index) => option !== this.options[index]);\n\n        this.options = next;\n        this.applySelection();\n\n        if (options.render !== false && changed) {\n            this.requestUpdate();\n        }\n    };\n\n    private refreshOptions(): void {\n        this.handleOptionsMutation({ render: false });\n    }\n\n    private syncOptions = (): void => {\n        this.handleOptionsMutation({ render: true });\n    };\n\n    /** Portaled listbox options are outside the host tree — listen on the panel instead. */\n    private bindPanelEvents(): void {\n        const panel = this.panelElement;\n\n        if (!panel || panel === this.panelEventTarget) {\n            return;\n        }\n\n        this.unbindPanelEvents();\n        this.panelEventTarget = panel;\n        panel.addEventListener('pk-option-select', this.handleOptionSelect as EventListener);\n        panel.addEventListener('pk-option-highlight', this.handleOptionHighlight as EventListener);\n        panel.addEventListener('pk-listbox-keydown', this.handleListboxKeyDownEvent as EventListener);\n    }\n\n    private unbindPanelEvents(): void {\n        if (!this.panelEventTarget) {\n            return;\n        }\n\n        this.panelEventTarget.removeEventListener('pk-option-select', this.handleOptionSelect as EventListener);\n        this.panelEventTarget.removeEventListener('pk-option-highlight', this.handleOptionHighlight as EventListener);\n        this.panelEventTarget.removeEventListener('pk-listbox-keydown', this.handleListboxKeyDownEvent as EventListener);\n        this.panelEventTarget = null;\n    }\n\n    private isOptionInHiddenGroup(option: PkOption): boolean {\n        const group = option.closest('pk-option-group') as PkOptionGroup | null;\n\n        return Boolean(group?.hidden);\n    }\n\n    private defaultFilter(option: PkOption, query: string): boolean {\n        const label = option.getLabel().toLowerCase();\n        const value = option.value.toLowerCase();\n        // Rich options may set a short `label` for the closed input — still match subtitle text.\n        const searchText = (option.getSearchText?.() ?? label).toLowerCase();\n\n        return label.includes(query) || value.includes(query) || searchText.includes(query);\n    }\n\n    private matchesFilter(option: PkOption, query: string): boolean {\n        if (this.filter) {\n            return this.filter(option, query);\n        }\n\n        return this.defaultFilter(option, query);\n    }\n\n    private getFilterQuery(): string {\n        if (!this.open) {\n            return '';\n        }\n\n        if (!this.multiple && !this.hasInputSinceOpening && !this.usesPopupMode) {\n            return '';\n        }\n\n        return this.inputValue.trim().toLowerCase();\n    }\n\n    private getVisibleOptions(): PkOption[] {\n        if (this.usesAsyncSearch) {\n            return this.options.filter((option) => !this.isOptionInHiddenGroup(option));\n        }\n\n        const filter = this.getFilterQuery();\n\n        return this.options.filter((option) => {\n            if (this.isOptionInHiddenGroup(option)) {\n                return false;\n            }\n\n            if (!filter) {\n                return true;\n            }\n\n            return this.matchesFilter(option, filter);\n        });\n    }\n\n    private getEnabledVisibleOptions(): PkOption[] {\n        return this.getVisibleOptions().filter((option) => !option.disabled);\n    }\n\n    private getSelectedOptions(): PkOption[] {\n        if (this.multiple) {\n            const optionsByValue = new Map(this.options.map((option) => [option.value, option]));\n\n            return this.values\n                .map((value) => optionsByValue.get(value))\n                .filter((option): option is PkOption => option !== undefined);\n        }\n\n        const selected = this.options.find((option) => option.value === this.value);\n\n        return selected ? [selected] : [];\n    }\n\n    private getSelectedOption(): PkOption | undefined {\n        return this.options.find((option) => option.value === this.value);\n    }\n\n    private get usesAsyncSearch(): boolean {\n        return this.async && Boolean(this.fetchOptions) && !this.multiple && !this.usesPopupMode;\n    }\n\n    private getSelectedLabel(): string {\n        return this.getSelectedOption()?.getLabel()\n            ?? this.selectedOptionMeta?.label\n            ?? this.value;\n    }\n\n    private clearAsyncOptionNodes(): void {\n        this.querySelectorAll(':scope > pk-option, :scope > pk-option-group, :scope > pk-separator')\n            .forEach((node) => node.remove());\n    }\n\n    private renderAsyncOptionNodes(items: PkComboboxAsyncOption[]): void {\n        const merged = this.mergeAsyncItems(items);\n        this.clearAsyncOptionNodes();\n\n        for (const item of merged) {\n            const option = document.createElement('pk-option');\n            option.value = item.value;\n            option.textContent = item.label;\n            this.append(option);\n        }\n\n        this.handleOptionsMutation({ render: true });\n    }\n\n    private mergeAsyncItems(items: PkComboboxAsyncOption[]): PkComboboxAsyncOption[] {\n        if (!this.value) {\n            return items;\n        }\n\n        const selected = this.selectedOptionMeta\n            ?? { value: this.value, label: this.getSelectedOption()?.getLabel() ?? this.value };\n\n        if (items.some((item) => item.value === selected.value)) {\n            return items;\n        }\n\n        return [...items, selected];\n    }\n\n    private syncSelectedOptionMeta(): void {\n        if (!this.value) {\n            this.selectedOptionMeta = null;\n            return;\n        }\n\n        const selected = this.getSelectedOption();\n\n        if (selected) {\n            this.selectedOptionMeta = {\n                value: selected.value,\n                label: selected.getLabel(),\n            };\n        }\n    }\n\n    private scheduleAsyncFetch(query: string): void {\n        window.clearTimeout(this.asyncFetchTimer);\n\n        this.asyncFetchTimer = window.setTimeout(() => {\n            void this.runAsyncFetch(query);\n        }, 200);\n    }\n\n    private async runAsyncFetch(query: string): Promise<void> {\n        if (!this.fetchOptions) {\n            return;\n        }\n\n        const requestId = ++this.asyncFetchRequestId;\n        this.fetchAbortController?.abort();\n        this.fetchAbortController = new AbortController();\n\n        if (!query) {\n            this.asyncLoading = false;\n            this.asyncError = null;\n            this.renderAsyncOptionNodes(this.value && this.selectedOptionMeta ? [this.selectedOptionMeta] : []);\n            return;\n        }\n\n        this.asyncLoading = true;\n        this.asyncError = null;\n\n        try {\n            const results = await this.fetchOptions(query, this.fetchAbortController.signal);\n\n            if (requestId !== this.asyncFetchRequestId) {\n                return;\n            }\n\n            this.renderAsyncOptionNodes(results);\n        } catch (error) {\n            if (this.fetchAbortController?.signal.aborted || requestId !== this.asyncFetchRequestId) {\n                return;\n            }\n\n            if (error instanceof DOMException && error.name === 'AbortError') {\n                return;\n            }\n\n            console.error('Failed to load combobox options:', error);\n            this.asyncError = 'Failed to load options. Please try again.';\n            this.renderAsyncOptionNodes([]);\n        } finally {\n            if (requestId === this.asyncFetchRequestId) {\n                this.asyncLoading = false;\n            }\n        }\n    }\n\n    private getAsyncStatusMessage(): string | null {\n        if (!this.usesAsyncSearch || !this.open) {\n            return null;\n        }\n\n        if (this.asyncLoading) {\n            return this.loadingMessage;\n        }\n\n        if (this.asyncError) {\n            return this.asyncError;\n        }\n\n        const query = this.inputValue.trim();\n\n        if (!query) {\n            return this.value ? null : this.startTypingMessage;\n        }\n\n        if (this.getEnabledVisibleOptions().length === 0 && !this.shouldShowCreateOption()) {\n            return `No matches for \"${query}\".`;\n        }\n\n        return null;\n    }\n\n    private shouldShowAsyncEmpty(): boolean {\n        if (!this.usesAsyncSearch || !this.open) {\n            return false;\n        }\n\n        const query = this.inputValue.trim();\n\n        if (!query || this.asyncLoading || this.asyncError) {\n            return false;\n        }\n\n        return this.getEnabledVisibleOptions().length === 0 && !this.shouldShowCreateOption();\n    }\n\n    private isSelected(value: string): boolean {\n        if (this.multiple) {\n            return this.values.includes(value);\n        }\n\n        return this.value === value;\n    }\n\n    private getDisplayInputValue(): string {\n        if (this.usesPopupMode || this.multiple || this.open) {\n            return this.inputValue;\n        }\n\n        // Empty-string values are valid when an option declares them (e.g. \"Default (browser)\").\n        return this.hasSelection() ? this.getSelectedLabel() : '';\n    }\n\n    private getTriggerDisplayValue(): string {\n        return this.hasSelection() ? this.getSelectedLabel() : this.placeholder;\n    }\n\n    private isTriggerPlaceholder(): boolean {\n        return !this.hasSelection();\n    }\n\n    private hasSelection(): boolean {\n        if (this.multiple) {\n            return this.values.length > 0;\n        }\n\n        // Match pk-select: a matching option counts even when its value is \"\".\n        return Boolean(this.getSelectedOption() || this.selectedOptionMeta || this.value);\n    }\n\n    private shouldShowCreateOption(): boolean {\n        if (!this.allowCreate || !this.open) {\n            return false;\n        }\n\n        if (!this.multiple && !this.hasInputSinceOpening) {\n            return false;\n        }\n\n        const query = this.inputValue.trim();\n\n        if (!query) {\n            return false;\n        }\n\n        const normalized = query.toLowerCase();\n\n        return !this.options.some((option) => {\n            return option.getLabel().toLowerCase() === normalized\n                || option.value.toLowerCase() === normalized;\n        });\n    }\n\n    private getListboxNavItems(): HTMLElement[] {\n        const enabled = this.getEnabledVisibleOptions() as unknown as HTMLElement[];\n\n        if (this.shouldShowCreateOption() && this.createOptionElement) {\n            return [...enabled, this.createOptionElement];\n        }\n\n        return enabled;\n    }\n\n    private applySelection(): void {\n        const visible = this.getVisibleOptions();\n        const filterQuery = this.open ? this.getFilterQuery() : '';\n\n        for (const option of this.options) {\n            option.selected = this.isSelected(option.value);\n            option.hidden = !visible.includes(option);\n            option.optionId = `${this.listboxId}-option-${option.value}`;\n            option.matchQuery = filterQuery;\n        }\n\n        for (const group of this.querySelectorAll('pk-option-group')) {\n            const groupOptions = [...group.querySelectorAll('pk-option')];\n            // Use data-pk-filter-empty — not `hidden` — so clearing the query can\n            // resurrect options. `hidden` is reserved for intentional author hide;\n            // consulting it in getVisibleOptions would trap emptied groups forever.\n            const filterEmpty = groupOptions.length > 0\n                && groupOptions.every((option) => option.hidden);\n\n            group.toggleAttribute('data-pk-filter-empty', filterEmpty);\n        }\n\n        // Sibling <pk-separator>s stay in the light DOM when groups hide — sync them.\n        syncListboxSeparators(this);\n\n        this.syncValueInput();\n\n        if (this.open) {\n            this.syncHighlight();\n            this.announceFilterResults();\n        }\n    }\n\n    private syncValueInput(): void {\n        if (!this.input) {\n            return;\n        }\n\n        this.input.value = this.multiple ? this.values.join(',') : this.value;\n        this.input.required = this.required;\n    }\n\n    private syncHighlightedIndexToSelection(): void {\n        if (this.multiple) {\n            return;\n        }\n\n        const enabled = this.getEnabledVisibleOptions();\n\n        if (!this.value || enabled.length === 0) {\n            return;\n        }\n\n        const selectedIndex = enabled.findIndex((option) => option.value === this.value);\n\n        if (selectedIndex >= 0) {\n            this.highlightedIndex = selectedIndex;\n        }\n    }\n\n    private resetHighlightedIndexOnOpen(): void {\n        if (this.autoHighlight) {\n            if (this.value) {\n                this.syncHighlightedIndexToSelection();\n                return;\n            }\n\n            this.highlightedIndex = 0;\n            return;\n        }\n\n        this.highlightedIndex = -1;\n    }\n\n    private syncHighlight(): void {\n        const enabled = this.getEnabledVisibleOptions();\n        const showCreate = this.shouldShowCreateOption();\n        const totalItems = enabled.length + (showCreate ? 1 : 0);\n\n        for (const option of this.options) {\n            option.highlighted = false;\n            option.focusIndex = -1;\n        }\n\n        this.createOptionHighlighted = false;\n\n        if (totalItems === 0 || this.highlightedIndex < 0) {\n            return;\n        }\n\n        if (this.highlightedIndex >= totalItems) {\n            this.highlightedIndex = totalItems - 1;\n        }\n\n        if (showCreate && this.highlightedIndex === enabled.length) {\n            this.createOptionHighlighted = true;\n\n            if (!this.keepsFocusOnInput()) {\n                this.createOptionElement?.focus({ preventScroll: true });\n            }\n\n            scrollIntoView(this.createOptionElement!, this.listScrollContainer, 'vertical', 'auto');\n\n            if (this.keepsFocusOnInput()) {\n                this.maintainInputFocus();\n            }\n\n            return;\n        }\n\n        const highlighted = enabled[this.highlightedIndex];\n\n        if (highlighted) {\n            highlighted.highlighted = true;\n            highlighted.focusIndex = this.keepsFocusOnInput() ? -1 : 0;\n            scrollIntoView(highlighted, this.listScrollContainer, 'vertical', 'auto');\n\n            if (this.keepsFocusOnInput()) {\n                this.maintainInputFocus();\n            }\n        }\n    }\n\n    private getActiveDescendantId(): string | null {\n        const enabled = this.getEnabledVisibleOptions();\n\n        if (this.shouldShowCreateOption() && this.highlightedIndex === enabled.length) {\n            return this.createOptionId;\n        }\n\n        const highlighted = enabled[this.highlightedIndex];\n        return highlighted?.optionId || null;\n    }\n\n    private announceFilterResults(): void {\n        if (!this.liveRegion) {\n            this.liveRegion = new LiveRegion('polite');\n        }\n\n        const count = this.getEnabledVisibleOptions().length;\n        const filter = this.getFilterQuery();\n\n        if (!filter) {\n            return;\n        }\n\n        if (this.shouldShowCreateOption()) {\n            this.liveRegion.announce(`Create ${filter}`);\n            return;\n        }\n\n        this.liveRegion.announce(\n            count === 0\n                ? `${this.emptyMessage}`\n                : `${count} ${count === 1 ? 'result' : 'results'} available`,\n        );\n    }\n\n    private togglePanel = (event?: Event): void => {\n        event?.preventDefault();\n        event?.stopPropagation();\n\n        if (this.disabled) {\n            return;\n        }\n\n        if (this.open || this.closing) {\n            void this.closePanel('api');\n        } else {\n            void this.openPanel();\n        }\n    };\n\n    async show(): Promise<void> {\n        if (this.open || this.closing || this.disabled) {\n            return;\n        }\n\n        await this.openPanel();\n    }\n\n    async hide(source: PkOverlaySource = 'api'): Promise<void> {\n        if (!this.open || this.closing) {\n            return;\n        }\n\n        await this.closePanel(source);\n    }\n\n    private openPanel(): Promise<void> {\n        const anchor = this.controlElement;\n\n        if (!anchor) {\n            return Promise.resolve();\n        }\n\n        if (this.open) {\n            this.activeInput?.focus({ preventScroll: true });\n            return Promise.resolve();\n        }\n\n        if (this.closing) {\n            return Promise.resolve();\n        }\n\n        this.dispatchEvent(new PkShowEvent());\n        this.closing = false;\n        this.panelAnimated = false;\n        this.open = true;\n        this.hasInputSinceOpening = false;\n        this.inputValue = this.usesPopupMode\n            ? ''\n            : (!this.multiple && this.hasSelection() ? this.getSelectedLabel() : '');\n        this.applySelection();\n        this.resetHighlightedIndexOnOpen();\n\n        if (this.usesAsyncSearch) {\n            this.syncSelectedOptionMeta();\n            this.asyncError = null;\n            this.asyncLoading = false;\n            this.renderAsyncOptionNodes(this.selectedOptionMeta ? [this.selectedOptionMeta] : []);\n        }\n\n        const anchorWidth = anchor.getBoundingClientRect().width;\n        this.style.setProperty('--pk-combobox-anchor-width', `${anchorWidth}px`);\n\n        // Activate the popup synchronously (same as pk-select). Relying only on the\n        // `.active=${this.open}` binding races waitForPopupReposition's 100ms fallback\n        // and leaves popup-mode search focus failing against a still-closed popover.\n        this.popupElement.active = true;\n\n        if (this.panelElement) {\n            this.panelElement.hidden = false;\n            syncPopupPlacementAnimation(this.panelElement, this.placement);\n        }\n\n        this.registerDismissHandlers();\n        this.syncHighlight();\n\n        if (this.usesPopupMode) {\n            this.popupTrigger?.blur();\n        } else {\n            // Input mode keeps the control field focused immediately; popup mode waits\n            // until the panel is positioned so focus isn't dropped on a hidden popover.\n            this.activeInput?.focus({ preventScroll: true });\n        }\n\n        return this.updateComplete.then(async () => {\n            // requireEvent: true — same as pk-dropdown-menu. A leftover\n            // data-current-placement from the previous open would resolve immediately\n            // while .popup is still :not(.positioned) (visibility:hidden), so focus fails.\n            const placement = await waitForPopupReposition(this.popupElement, this.placement, 300, {\n                requireEvent: true,\n            });\n\n            if (this.panelElement) {\n                syncPopupPlacementAnimation(this.panelElement, placement);\n            }\n\n            this.panelAnimated = true;\n            this.bindPanelEvents();\n            this.refreshOptions();\n\n            this.activeInput?.focus({ preventScroll: true });\n\n            if (this.highlightedIndex >= 0 && !this.keepsFocusOnInput()) {\n                const enabled = this.getEnabledVisibleOptions();\n                const index = this.highlightedIndex;\n\n                if (this.shouldShowCreateOption() && index === enabled.length) {\n                    this.createOptionElement?.focus({ preventScroll: true });\n                } else {\n                    enabled[index]?.focusControl();\n                }\n            }\n\n            this.dispatchEvent(new PkAfterShowEvent());\n            this.dispatchEvent(new CustomEvent('pk-open-change', {\n                detail: { open: true },\n                bubbles: true,\n                composed: true,\n            }));\n        });\n    }\n\n    private commitCustomValueIfAllowed(): boolean {\n        if (this.multiple || !this.allowCustomValue) {\n            return false;\n        }\n\n        const query = this.inputValue.trim();\n\n        if (!query) {\n            return false;\n        }\n\n        const exactMatch = this.options.find((option) => {\n            return option.getLabel().toLowerCase() === query.toLowerCase()\n                || option.value.toLowerCase() === query.toLowerCase();\n        });\n\n        const nextValue = exactMatch?.value ?? query;\n\n        if (this.value === nextValue) {\n            return false;\n        }\n\n        this.value = nextValue;\n        return true;\n    }\n\n    private commitInputOnClose(source: PkOverlaySource): boolean {\n        if (this.multiple || this.usesPopupMode) {\n            return false;\n        }\n\n        if (!this.hasInputSinceOpening) {\n            if (this.shouldCommitCustomValueOnClose(source)) {\n                return this.commitCustomValueIfAllowed();\n            }\n\n            return false;\n        }\n\n        const query = this.inputValue.trim();\n\n        if (!query) {\n            if (!this.value) {\n                return false;\n            }\n\n            this.value = '';\n            return true;\n        }\n\n        if (this.shouldCommitCustomValueOnClose(source)) {\n            return this.commitCustomValueIfAllowed();\n        }\n\n        return false;\n    }\n\n    private shouldCommitCustomValueOnClose(source: PkOverlaySource): boolean {\n        return source === 'light-dismiss' || source === 'pointer-dismiss';\n    }\n\n    private async closePanel(source: PkOverlaySource = 'unknown'): Promise<void> {\n        if (!this.open || this.closing) {\n            return;\n        }\n\n        const hideEvent = new PkHideEvent(source);\n\n        if (!this.dispatchEvent(hideEvent)) {\n            return;\n        }\n\n        const valueChanged = this.commitInputOnClose(source);\n\n        this.unbindPanelEvents();\n        this.closing = true;\n        this.panelAnimated = false;\n        await this.waitForExitAnimation();\n\n        this.open = false;\n        this.closing = false;\n        this.panelAnimated = false;\n        this.hasInputSinceOpening = false;\n        this.inputValue = '';\n\n        if (this.panelElement) {\n            this.panelElement.hidden = true;\n            this.panelElement.removeAttribute('data-side');\n        }\n\n        this.popupElement.active = false;\n\n        this.unregisterDismissHandlers();\n        this.applySelection();\n\n        if (this.usesAsyncSearch) {\n            window.clearTimeout(this.asyncFetchTimer);\n            this.fetchAbortController?.abort();\n            this.asyncLoading = false;\n            this.asyncError = null;\n            this.renderAsyncOptionNodes(this.selectedOptionMeta ? [this.selectedOptionMeta] : []);\n        }\n\n        if (valueChanged) {\n            this.syncHasValueAttribute();\n            this.emitValueChange();\n        }\n\n        if (this.shouldReturnFocusToInput(source)) {\n            if (this.usesPopupMode) {\n                this.popupTrigger?.focus({ preventScroll: true });\n            } else {\n                this.activeInput?.focus({ preventScroll: true });\n            }\n        } else {\n            this.activeInput?.blur();\n            this.popupTrigger?.blur();\n        }\n\n        this.dispatchEvent(new PkAfterHideEvent());\n        this.dispatchEvent(new CustomEvent('pk-open-change', {\n            detail: { open: false },\n            bubbles: true,\n            composed: true,\n        }));\n    }\n\n    private waitForExitAnimation(): Promise<void> {\n        const panel = this.panelElement;\n\n        if (!panel) {\n            return Promise.resolve();\n        }\n\n        return new Promise((resolve) => {\n            let settled = false;\n\n            const finish = (): void => {\n                if (settled) {\n                    return;\n                }\n\n                settled = true;\n                panel.removeEventListener('animationend', onAnimationEnd);\n                window.clearTimeout(fallback);\n                panel.classList.remove('closing');\n                resolve();\n            };\n\n            const onAnimationEnd = (event: AnimationEvent): void => {\n                if (event.target === panel && event.animationName.startsWith('pk-popup-content-out')) {\n                    finish();\n                }\n            };\n\n            panel.classList.add('closing');\n            panel.addEventListener('animationend', onAnimationEnd);\n            const fallback = window.setTimeout(finish, 150);\n        });\n    }\n\n    private shouldReturnFocusToInput(source: PkOverlaySource): boolean {\n        return source !== 'light-dismiss' && source !== 'pointer-dismiss';\n    }\n\n    private registerDismissHandlers(): void {\n        registerDismissible(this);\n        this.dismissRegistered = true;\n        document.addEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.addEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private unregisterDismissHandlers(): void {\n        if (this.dismissRegistered) {\n            unregisterDismissible(this);\n            this.dismissRegistered = false;\n        }\n\n        document.removeEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private isPointerInside(event: PointerEvent): boolean {\n        // Anchor + panel only — do not treat empty host padding (min-width > control) as inside.\n        return isPointerInsideOverlay(event, {\n            anchor: this.controlElement,\n            panel: this.panelElement,\n        });\n    }\n\n    private onDocumentPointerDown = (event: PointerEvent): void => {\n        if (this.isPointerInside(event)) {\n            return;\n        }\n\n        void this.closePanel('light-dismiss');\n    };\n\n    private onDocumentKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open) {\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            if (!isTopDismissible(this)) {\n                return;\n            }\n\n            event.preventDefault();\n            event.stopPropagation();\n            void this.closePanel('escape');\n            return;\n        }\n\n        // Popup-mode search lives inside the panel. Capture-phase document handlers\n        // must not steal typing / Space from it — `handleInputKeyDown` already\n        // forwards Arrow/Enter to the listbox while keeping the filter editable.\n        const panelInput = this.panelInput;\n\n        if (panelInput && event.composedPath().includes(panelInput)) {\n            return;\n        }\n\n        const isListboxKey = LISTBOX_NAVIGATION_KEYS.has(event.key) || isListboxTypeToSelectKey(event);\n\n        if (!isListboxKey) {\n            return;\n        }\n\n        const panel = this.panelElement;\n        const path = event.composedPath();\n        const focusInPortaledPanel = Boolean(panel && path.includes(panel));\n\n        if (!focusInPortaledPanel) {\n            return;\n        }\n\n        if (!isEventInsideOverlay(event, {\n            anchor: this.controlElement,\n            panel,\n        })) {\n            return;\n        }\n\n        event.preventDefault();\n        event.stopPropagation();\n        this.onListboxKeyDown(event);\n    };\n\n    private handleOptionSelect = (event: CustomEvent<{ value: string }>): void => {\n        const { value } = event.detail;\n\n        if (this.multiple) {\n            this.values = this.values.includes(value)\n                ? this.values.filter((item) => item !== value)\n                : [...this.values, value];\n            this.inputValue = '';\n            this.applySelection();\n            this.emitValueChange();\n            this.activeInput?.focus({ preventScroll: true });\n            return;\n        }\n\n        this.value = value;\n        this.syncSelectedOptionMeta();\n        this.applySelection();\n        void this.closePanel('api');\n        this.emitValueChange();\n    };\n\n    private handleCreateOption(): void {\n        const query = this.inputValue.trim();\n\n        if (!query) {\n            return;\n        }\n\n        const createEvent = new PkCreateEvent(query);\n\n        if (!this.dispatchEvent(createEvent)) {\n            return;\n        }\n\n        const option = document.createElement('pk-option');\n        option.value = query;\n        option.textContent = query;\n        this.append(option);\n\n        if (this.multiple) {\n            if (!this.values.includes(query)) {\n                this.values = [...this.values, query];\n            }\n\n            this.inputValue = '';\n            this.applySelection();\n            this.emitValueChange();\n            this.activeInput?.focus({ preventScroll: true });\n            return;\n        }\n\n        this.value = query;\n        this.applySelection();\n        void this.closePanel('api');\n        this.emitValueChange();\n    };\n\n    private handleOptionHighlight = (event: CustomEvent<{ value: string }>): void => {\n        if (!this.open) {\n            return;\n        }\n\n        const enabled = this.getEnabledVisibleOptions();\n        const index = enabled.findIndex((option) => option.value === event.detail.value);\n\n        if (index === -1 || index === this.highlightedIndex) {\n            return;\n        }\n\n        this.highlightedIndex = index;\n        this.syncHighlight();\n    };\n\n    private removeTag(value: string, event: Event): void {\n        event.preventDefault();\n        event.stopPropagation();\n        this.values = this.values.filter((item) => item !== value);\n        this.applySelection();\n        this.emitValueChange();\n        this.activeInput?.focus({ preventScroll: true });\n    }\n\n    private handleClear(event: Event): void {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this.multiple) {\n            this.values = [];\n        } else {\n            this.value = '';\n        }\n\n        this.inputValue = '';\n        this.selectedOptionMeta = null;\n\n        if (this.usesAsyncSearch) {\n            this.renderAsyncOptionNodes([]);\n        }\n\n        this.applySelection();\n        this.dispatchEvent(new PkClearEvent());\n        this.emitValueChange();\n        this.activeInput?.focus();\n    }\n\n    private emitValueChange(): void {\n        this.dispatchEvent(new CustomEvent('pk-change', {\n            detail: {\n                value: this.multiple ? [...this.values] : this.value,\n            },\n            bubbles: true,\n            composed: true,\n        }));\n\n        this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n        this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n    }\n\n    private handleInput(event: Event): void {\n        this.hasInputSinceOpening = true;\n        this.inputValue = (event.target as HTMLInputElement).value;\n        this.highlightedIndex = this.autoHighlight ? 0 : -1;\n        this.applySelection();\n\n        if (this.usesAsyncSearch) {\n            this.asyncError = null;\n            this.scheduleAsyncFetch(this.inputValue.trim());\n        }\n\n        if (!this.open) {\n            void this.openPanel();\n        }\n    }\n\n    private handleControlMouseDown = (event: MouseEvent): void => {\n        if (this.disabled || this.usesPopupMode) {\n            return;\n        }\n\n        const path = event.composedPath();\n        const isInteractiveChild = path.some((node) => {\n            if (!(node instanceof HTMLElement)) {\n                return false;\n            }\n\n            return node.classList.contains('icon-button')\n                || node.classList.contains('clear-button')\n                || node.classList.contains('tag-remove');\n        });\n\n        if (isInteractiveChild) {\n            return;\n        }\n\n        const isInput = event.target === this.activeInput;\n\n        if (!this.open && !this.closing) {\n            if (!isInput) {\n                event.preventDefault();\n            }\n\n            this.activeInput?.focus({ preventScroll: true });\n            void this.openPanel();\n            return;\n        }\n\n        if (!isInput) {\n            event.preventDefault();\n            this.activeInput?.focus({ preventScroll: true });\n        }\n    };\n\n    private handleTriggerKeyDown = (event: KeyboardEvent): void => {\n        if (this.disabled) {\n            return;\n        }\n\n        if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault();\n            this.togglePanel(event);\n            return;\n        }\n\n        if (event.key === 'ArrowDown' && !this.open) {\n            event.preventDefault();\n            void this.openPanel();\n        }\n    };\n\n    private handleInputKeyDown(event: KeyboardEvent): void {\n        if (event.key === 'Backspace' && this.multiple && !this.inputValue && this.values.length > 0) {\n            event.preventDefault();\n            this.values = this.values.slice(0, -1);\n            this.applySelection();\n            this.emitValueChange();\n            return;\n        }\n\n        if (event.key === 'Escape' && this.open) {\n            event.preventDefault();\n\n            if (this.hasInputSinceOpening && this.inputValue) {\n                this.hasInputSinceOpening = false;\n                this.inputValue = this.usesPopupMode\n                    ? ''\n                    : (!this.multiple && this.hasSelection() ? this.getSelectedLabel() : '');\n                this.highlightedIndex = this.autoHighlight ? 0 : -1;\n                this.applySelection();\n                return;\n            }\n\n            void this.closePanel('escape');\n            return;\n        }\n\n        if (event.key === 'ArrowDown' && !this.open) {\n            event.preventDefault();\n            void this.openPanel();\n            return;\n        }\n\n        if (event.key === 'Tab' && this.open) {\n            let committed = false;\n\n            if (!this.multiple) {\n                committed = this.commitCustomValueIfAllowed();\n            }\n\n            void this.closePanel('api');\n\n            if (committed) {\n                this.syncHasValueAttribute();\n                this.emitValueChange();\n            }\n\n            return;\n        }\n\n        if (this.open && event.key === 'Enter' && !this.multiple) {\n            const enabled = this.getEnabledVisibleOptions();\n\n            if (enabled.length === 0 && this.allowCustomValue && this.inputValue.trim() && !this.shouldShowCreateOption()) {\n                event.preventDefault();\n                const committed = this.commitCustomValueIfAllowed();\n                void this.closePanel('api');\n\n                if (committed) {\n                    this.syncHasValueAttribute();\n                    this.emitValueChange();\n                }\n\n                return;\n            }\n        }\n\n        if (!this.open) {\n            return;\n        }\n\n        this.onListboxKeyDown(event);\n    }\n\n    private handleListboxKeyDownEvent = (event: CustomEvent<{ keyboardEvent: KeyboardEvent }>): void => {\n        if (!this.open) {\n            return;\n        }\n\n        this.onListboxKeyDown(event.detail.keyboardEvent);\n    };\n\n    private onListboxKeyDown(event: KeyboardEvent): void {\n        const navItems = this.getListboxNavItems();\n        const enabled = this.getEnabledVisibleOptions();\n\n        if (this.highlightedIndex < 0) {\n            if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n                if (enabled.length > 0 || this.shouldShowCreateOption()) {\n                    event.preventDefault();\n                    this.highlightedIndex = 0;\n                    this.syncHighlight();\n                }\n\n                return;\n            }\n\n            if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n                if (enabled.length > 0 || this.shouldShowCreateOption()) {\n                    event.preventDefault();\n                    this.highlightedIndex = this.shouldShowCreateOption()\n                        ? enabled.length\n                        : Math.max(enabled.length - 1, 0);\n                    this.syncHighlight();\n                }\n\n                return;\n            }\n\n            if (event.key === 'Enter' || event.key === ' ') {\n                return;\n            }\n        }\n\n        if (event.key === 'Enter' && this.shouldShowCreateOption() && this.highlightedIndex === enabled.length) {\n            event.preventDefault();\n            this.handleCreateOption();\n            return;\n        }\n\n        if (this.multiple && (event.key === 'Enter' || event.key === ' ')) {\n            const option = enabled[this.highlightedIndex];\n\n            if (option) {\n                event.preventDefault();\n                option.dispatchEvent(new CustomEvent('pk-option-select', {\n                    detail: { value: option.value },\n                    bubbles: true,\n                    composed: true,\n                }));\n            }\n\n            return;\n        }\n\n        this.highlightedIndex = handleListboxKeyDown(event, {\n            items: navItems,\n            currentIndex: this.highlightedIndex,\n            multiselect: this.multiple,\n            loop: this.loopFocus,\n            onSelect: (index) => {\n                this.highlightedIndex = index;\n                this.syncHighlight();\n            },\n            focusItem: (index) => {\n                if (this.keepsFocusOnInput()) {\n                    return;\n                }\n\n                if (this.shouldShowCreateOption() && index === enabled.length) {\n                    this.createOptionElement?.focus({ preventScroll: true });\n                    return;\n                }\n\n                enabled[index]?.focusControl();\n            },\n            onClose: () => { void this.closePanel('escape'); },\n        });\n    }\n\n    private handleCreateMouseEnter = (): void => {\n        if (!this.open) {\n            return;\n        }\n\n        const enabled = this.getEnabledVisibleOptions();\n        this.highlightedIndex = enabled.length;\n        this.syncHighlight();\n    };\n\n    private handleCreateKeyDown = (event: KeyboardEvent): void => {\n        event.preventDefault();\n        event.stopPropagation();\n        this.onListboxKeyDown(event);\n    };\n\n    private renderHostDecorationSlot(name: 'start' | 'end') {\n        if (!this.hasSlotController.test(name)) {\n            return html`<slot name=${name} hidden></slot>`;\n        }\n\n        const className = name === 'start' ? 'control-start' : 'control-end';\n\n        return html`\n            <span part=${name} class=${className}>\n                <slot name=${name}></slot>\n            </span>\n        `;\n    }\n\n    private renderChevronButton() {\n        return html`\n            <button\n                type=\"button\"\n                class=\"icon-button expand-button\"\n                part=\"expand-button\"\n                aria-label=\"Toggle options\"\n                ?disabled=${this.disabled}\n                @click=${this.togglePanel}\n            >\n                <span class=\"icon\" aria-hidden=\"true\">${unsafeSVG(CHEVRON_ICON)}</span>\n            </button>\n        `;\n    }\n\n    private renderTags() {\n        return this.getSelectedOptions().map((option) => html`\n            <span class=\"tag\" part=\"tag\">\n                <span class=\"tag-label\">${option.getLabel()}</span>\n                <button\n                    type=\"button\"\n                    class=\"tag-remove\"\n                    part=\"tag-remove\"\n                    aria-label=${`Remove ${option.getLabel()}`}\n                    ?disabled=${this.disabled}\n                    @click=${(event: Event) => this.removeTag(option.value, event)}\n                >\n                    <span class=\"tag-remove-icon\" aria-hidden=\"true\">${unsafeSVG(XMARK_ICON)}</span>\n                </button>\n            </span>\n        `);\n    }\n\n    private shouldShowPlaceholder(): boolean {\n        if (this.inputValue.trim()) {\n            return false;\n        }\n\n        return !this.hasSelection();\n    }\n\n    private renderInput() {\n        const activeDescendant = this.open ? this.getActiveDescendantId() : null;\n        const showPlaceholder = this.shouldShowPlaceholder();\n\n        return html`\n            <input\n                part=\"input\"\n                class=${classMap({\n                    'combobox-input': true,\n                    'control-input': true,\n                    'combobox-input--inline': this.multiple,\n                })}\n                type=\"text\"\n                role=\"combobox\"\n                id=${this.inputId}\n                .value=${this.getDisplayInputValue()}\n                placeholder=${showPlaceholder ? this.placeholder : nothing}\n                ?disabled=${this.disabled}\n                aria-label=${this.ariaLabel ?? nothing}\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-controls=${this.listboxId}\n                aria-autocomplete=\"list\"\n                aria-activedescendant=${activeDescendant ?? nothing}\n                @input=${this.handleInput}\n                @keydown=${this.handleInputKeyDown}\n            />\n        `;\n    }\n\n    private renderPanelInput() {\n        const activeDescendant = this.open ? this.getActiveDescendantId() : null;\n\n        return html`\n            <div part=\"panel-search\" class=\"panel-search\">\n                <input\n                    part=\"panel-input\"\n                    class=\"combobox-input panel-input\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    id=${this.inputId}\n                    .value=${this.inputValue}\n                    placeholder=${this.searchPlaceholder}\n                    ?disabled=${this.disabled}\n                    aria-label=${this.ariaLabel ?? this.searchPlaceholder}\n                    aria-expanded=\"true\"\n                    aria-controls=${this.listboxId}\n                    aria-autocomplete=\"list\"\n                    aria-activedescendant=${activeDescendant ?? nothing}\n                    @input=${this.handleInput}\n                    @keydown=${this.handleInputKeyDown}\n                />\n            </div>\n        `;\n    }\n\n    private renderPopupTrigger() {\n        return html`\n            <button\n                type=\"button\"\n                part=\"trigger\"\n                class=\"popup-trigger\"\n                ?disabled=${this.disabled}\n                aria-label=${this.ariaLabel ?? nothing}\n                aria-haspopup=\"listbox\"\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-controls=${this.listboxId}\n                @click=${this.togglePanel}\n                @keydown=${this.handleTriggerKeyDown}\n            >\n                <span\n                    class=${classMap({\n                        'popup-trigger-value': true,\n                        'is-placeholder': this.isTriggerPlaceholder(),\n                    })}\n                >\n                    ${this.getTriggerDisplayValue()}\n                </span>\n                <span class=\"icon popup-trigger-icon\" aria-hidden=\"true\">${unsafeSVG(CHEVRON_ICON)}</span>\n            </button>\n        `;\n    }\n\n    private renderControlContent() {\n        if (this.usesPopupMode) {\n            return this.renderPopupTrigger();\n        }\n\n        const showClear = (this.clearable || this.withClear) && this.hasSelection() && !this.disabled;\n\n        if (this.multiple) {\n            return html`\n                ${this.renderHostDecorationSlot('start')}\n                <div class=\"chips\" part=\"tags\">\n                    ${this.renderTags()}\n                    ${this.renderInput()}\n                </div>\n                ${this.renderHostDecorationSlot('end')}\n                ${showClear\n                    ? html`\n                        <button\n                            type=\"button\"\n                            class=\"clear-button\"\n                            part=\"clear-button\"\n                            aria-label=\"Clear selection\"\n                            ?disabled=${this.disabled}\n                            @click=${this.handleClear}\n                        >\n                            <span class=\"clear-button-icon\" aria-hidden=\"true\">${unsafeSVG(XMARK_ICON)}</span>\n                        </button>\n                    `\n                    : nothing}\n            `;\n        }\n\n        return html`\n            ${this.renderHostDecorationSlot('start')}\n            ${this.renderInput()}\n            ${this.renderHostDecorationSlot('end')}\n            ${showClear\n                ? html`\n                    <button\n                        type=\"button\"\n                        class=\"clear-button\"\n                        part=\"clear-button\"\n                        aria-label=\"Clear selection\"\n                        ?disabled=${this.disabled}\n                        @click=${this.handleClear}\n                    >\n                        <span class=\"clear-button-icon\" aria-hidden=\"true\">${unsafeSVG(XMARK_ICON)}</span>\n                    </button>\n                `\n                : nothing}\n            ${this.renderChevronButton()}\n        `;\n    }\n\n    override render() {\n        const visibleOptions = this.getEnabledVisibleOptions();\n        const showCreate = this.shouldShowCreateOption();\n        const showEmpty = this.open && (\n            this.usesAsyncSearch\n                ? this.shouldShowAsyncEmpty()\n                : visibleOptions.length === 0 && !showCreate\n        );\n        const asyncStatus = this.getAsyncStatusMessage();\n        const createQuery = this.inputValue.trim();\n\n        return html`\n            <input\n                class=\"value-input\"\n                part=\"value-input\"\n                tabindex=\"-1\"\n                aria-hidden=\"true\"\n                .value=${this.multiple ? this.values.join(',') : this.value}\n                ?required=${this.required}\n                @input=${() => this.updateValidity()}\n            />\n            <div\n                part=\"control\"\n                class=${classMap({\n                    control: true,\n                    'is-disabled': this.disabled,\n                    'control--multiple': this.multiple,\n                    'control--popup': this.usesPopupMode,\n                })}\n                data-popup-open=${this.open ? '' : nothing}\n                @mousedown=${this.handleControlMouseDown}\n            >\n                ${this.renderControlContent()}\n            </div>\n            <pk-popup\n                .active=${this.open || this.closing}\n                .anchor=${this.controlElement ?? ''}\n                .placement=${this.placement}\n                .distance=${this.sideOffset}\n                .sync=${'width'}\n                flip\n                shift\n            >\n                <div\n                    part=\"panel\"\n                    class=${classMap({\n                        panel: true,\n                        'pk-popup-content': true,\n                        closing: this.closing,\n                        'panel--popup': this.usesPopupMode,\n                    })}\n                    tabindex=\"-1\"\n                    ?hidden=${!this.open && !this.closing}\n                    data-open=${this.panelAnimated && !this.closing ? '' : nothing}\n                >\n                    ${this.usesPopupMode ? this.renderPanelInput() : nothing}\n                    <div\n                        part=\"panel-body\"\n                        class=\"panel-body\"\n                        id=${this.listboxId}\n                        role=\"listbox\"\n                        aria-multiselectable=${this.multiple ? 'true' : 'false'}\n                        aria-busy=${this.usesAsyncSearch && this.asyncLoading ? 'true' : nothing}\n                        @slotchange=${this.syncOptions}\n                    >\n                        <slot></slot>\n                        ${asyncStatus\n                            ? html`\n                                <div part=\"async-status\" class=\"async-status\" role=\"status\">${asyncStatus}</div>\n                            `\n                            : nothing}\n                        ${showCreate\n                            ? html`\n                                <button\n                                    type=\"button\"\n                                    part=\"create-option\"\n                                    class=${classMap({\n                                        'create-option': true,\n                                        'is-highlighted': this.createOptionHighlighted,\n                                    })}\n                                    id=${this.createOptionId}\n                                    role=\"option\"\n                                    aria-selected=\"false\"\n                                    tabindex=\"-1\"\n                                    @click=${this.handleCreateOption}\n                                    @mouseenter=${this.handleCreateMouseEnter}\n                                    @keydown=${this.handleCreateKeyDown}\n                                >\n                                    Create \"${createQuery}\"\n                                </button>\n                            `\n                            : nothing}\n                        ${showEmpty\n                            ? html`\n                                <div part=\"empty\" class=\"empty\">${this.emptyMessage}</div>\n                            `\n                            : nothing}\n                    </div>\n                </div>\n            </pk-popup>\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-combobox': PkCombobox;\n    }\n}\n"],"mappings":"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"}

package/dist/chunks/pk-date-picker-CkwU4DzD.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pk-date-picker-CkwU4DzD.js","names":[],"sources":["../../src/utils/host-date.ts","../../src/components/date-picker/pk-date-picker.styles.ts","../../src/components/date-picker/pk-date-picker.ts"],"sourcesContent":["type CraftDateApi = {\n    formatDate?: (date: Date) => string;\n    locale?: string;\n};\n\nfunction getCraft(): CraftDateApi | undefined {\n    return (globalThis as typeof globalThis & { Craft?: CraftDateApi }).Craft;\n}\n\n/** Locale chain aligned with React `hostGetLocale` / Craft CP. */\nexport function resolveHostLocale(): string {\n    return getCraft()?.locale || document.documentElement.lang || 'en-US';\n}\n\n/**\n * Display date in the host locale — mirrors React `hostFormatDate` → `Craft.formatDate`.\n * Falls back to numeric `Intl` when Craft is unavailable (e.g. playground).\n */\nexport function formatHostDate(date: Date, locale?: string): string {\n    const craftFormat = getCraft()?.formatDate;\n\n    if (typeof craftFormat === 'function') {\n        try {\n            return craftFormat(date);\n        } catch {\n            // fall through to Intl\n        }\n    }\n\n    const resolved = locale || resolveHostLocale();\n\n    return new Intl.DateTimeFormat(resolved, {\n        year: 'numeric',\n        month: 'numeric',\n        day: 'numeric',\n    }).format(date);\n}\n","import { css } from 'lit';\n\nimport { iconStyles } from '../../base/icon.styles.js';\n\nexport const pkDatePickerStyles = css`\n    ${iconStyles}\n    @layer pk-component {\n        :host {\n            display: inline-block;\n            position: relative;\n            width: fit-content;\n            max-width: 100%;\n            color: var(--pk-color-gray-700);\n            font-family: var(--pk-font-family);\n            font-size: var(--pk-font-size-base);\n            line-height: var(--pk-line-height);\n            --pk-date-picker-height: 2.125rem;\n            --pk-date-picker-min-width: 8.125rem;\n            --pk-date-picker-padding-inline: 10px;\n            --pk-date-picker-font-size: var(--pk-font-size-base);\n        }\n\n        :host([width='full']) {\n            display: block;\n            width: 100%;\n        }\n\n        :host([width='full']) .control {\n            width: 100%;\n        }\n\n        .control {\n            display: inline-flex;\n            align-items: center;\n            justify-content: flex-start;\n            gap: 0.5rem;\n            width: fit-content;\n            min-width: var(--pk-date-picker-min-width);\n            max-width: 100%;\n            height: var(--pk-date-picker-height);\n            min-height: var(--pk-date-picker-height);\n            margin: 0;\n            padding: 0 var(--pk-date-picker-padding-inline);\n            border: 1px solid var(--pk-color-slate-400);\n            border-radius: var(--pk-radius-lg);\n            background: transparent;\n            color: inherit;\n            font: inherit;\n            font-size: var(--pk-date-picker-font-size);\n            font-weight: 400;\n            line-height: 1.2;\n            cursor: default;\n            outline: none;\n            box-sizing: border-box;\n            transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;\n        }\n\n        .control[data-popup-open] {\n            background: var(--pk-color-slate-150);\n            border-color: var(--pk-color-slate-400);\n            box-shadow: none;\n        }\n\n        :host(:not([disabled])) .control:hover:not(.is-disabled) {\n            background: var(--pk-color-slate-50);\n        }\n\n        :host(:not([disabled])) .control[data-popup-open]:hover:not(.is-disabled),\n        :host(:not([disabled])) .control:active:not(.is-disabled) {\n            background: var(--pk-color-slate-150);\n        }\n\n        /* Outline-button focus — lighter than --pk-shadow-focus (see React DatePicker trigger). */\n        :host(:not([invalid]):not(:state(user-invalid))) .control:focus-visible,\n        :host(:not([invalid]):not(:state(user-invalid))[data-state='focus-visible']) .control {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n        }\n\n        :host(:not([invalid]):not(:state(user-invalid))) .control[data-popup-open]:focus-visible,\n        :host(:not([invalid]):not(:state(user-invalid))[data-state='focus-visible']) .control[data-popup-open] {\n            border-color: var(--pk-color-slate-400);\n            box-shadow: none;\n        }\n\n        :host([invalid]) .control,\n        :host(:state(user-invalid)) .control {\n            border-color: var(--pk-color-rose-600);\n        }\n\n        :host([invalid]) .control:focus-visible,\n        :host([invalid][data-state='focus-visible']) .control,\n        :host(:state(user-invalid)) .control:focus-visible,\n        :host(:state(user-invalid)[data-state='focus-visible']) .control {\n            box-shadow: var(--pk-input-invalid-focus-shadow);\n        }\n\n        .control.is-disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .display-value {\n            display: inline-flex;\n            align-items: center;\n            flex: 1;\n            min-width: 0;\n            line-height: 1.2;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            text-align: left;\n            color: inherit;\n        }\n\n        .display-value.is-placeholder {\n            color: var(--pk-color-gray-400);\n        }\n\n        .calendar-icon {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            line-height: 0;\n            color: var(--pk-color-gray-400);\n            pointer-events: none;\n        }\n\n        .calendar-icon .icon,\n        .calendar-icon svg {\n            display: block;\n            width: 14px;\n            height: 14px;\n        }\n\n        .icon-button {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            margin-inline-start: auto;\n            width: 1.25rem;\n            height: 1.25rem;\n            padding: 0;\n            border: 0;\n            border-radius: var(--pk-radius-sm);\n            background: transparent;\n            color: var(--pk-color-gray-500);\n            cursor: pointer;\n        }\n\n        .icon-button:hover:not(:disabled) {\n            color: var(--pk-color-gray-800);\n            background: var(--pk-color-slate-100);\n        }\n\n        .icon-button:disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .icon-button .icon {\n            width: 0.875rem;\n            height: 0.875rem;\n        }\n\n        .panel {\n            padding: 0;\n            border: 0;\n            border-radius: var(--pk-radius-md);\n            background: var(--pk-color-white);\n            box-shadow: var(--pk-shadow-popup);\n        }\n\n        .panel pk-calendar {\n            display: block;\n        }\n\n        :host([size='xs']) {\n            --pk-date-picker-height: 1.5rem;\n            --pk-date-picker-padding-inline: 8px;\n            --pk-date-picker-font-size: 11px;\n        }\n\n        :host([size='sm']) {\n            --pk-date-picker-height: 1.625rem;\n            --pk-date-picker-padding-inline: 9px;\n            --pk-date-picker-font-size: 12px;\n        }\n\n        :host([size='lg']) {\n            --pk-date-picker-height: 2.125rem;\n            --pk-date-picker-padding-inline: 11px;\n            --pk-date-picker-font-size: 14px;\n        }\n\n        :host([size='xl']) {\n            --pk-date-picker-height: 2.375rem;\n            --pk-date-picker-padding-inline: 12px;\n            --pk-date-picker-font-size: 15px;\n        }\n    }\n`;\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport type { PropertyValues } from 'lit';\n\nimport { calendar, xmark, renderIconHtml } from '../../icons/index.js';\nimport { isTopDismissible, registerDismissible, unregisterDismissible } from '../../a11y/dismissible-stack.js';\nimport { formControlStyles } from '../../base/form-control.styles.js';\nimport { PkFormAssociatedElement } from '../../base/pk-form-associated-element.js';\nimport { uniqueId } from '../../a11y/focus.js';\nimport { PkClearEvent } from '../../events/pk-clear.js';\nimport {\n    PkAfterHideEvent,\n    PkAfterShowEvent,\n    PkHideEvent,\n    PkShowEvent,\n    type PkOverlaySource,\n} from '../../events/overlay-lifecycle.js';\nimport { HasSlotController } from '../../internal/has-slot.js';\nimport { readLegacyInstructions } from '../../internal/field-labels.js';\nimport { MirrorValidator, RequiredValidator } from '../../validators/index.js';\nimport { PkPopup, type PkPopupPlacement } from '../popup/pk-popup.js';\nimport { PkCalendar, type PkCalendarDayContent } from '../calendar/pk-calendar.js';\nimport { coerceToDate, formatIsoDate, parseIsoDate, parseRange } from '../../utils/date.js';\nimport { formatHostDate, resolveHostLocale } from '../../utils/host-date.js';\nimport { waitForPopupReposition } from '../../utils/popup-placement-animation.js';\nimport { isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport { pkDatePickerStyles } from './pk-date-picker.styles.js';\n\nexport type PkDatePickerSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';\nexport type PkDatePickerMode = 'single' | 'range';\n\nconst CALENDAR_ICON = renderIconHtml(calendar);\nconst CLEAR_ICON = renderIconHtml(xmark);\n\n/**\n * Date picker — mirrors React `DatePicker` ( `pk-date-input` API).\n *\n * @slot label\n * @slot instructions\n * @slot hint\n * @slot start\n * @slot end\n * @slot clear-icon\n * @slot expand-icon\n * @slot footer\n *\n * @event input\n * @event change\n * @event pk-clear\n */\n@customElement('pk-date-picker')\nexport class PkDatePicker extends PkFormAssociatedElement {\n    static override styles = [formControlStyles, pkDatePickerStyles];\n\n    static override get validators() {\n        return [...super.validators, MirrorValidator(), RequiredValidator()];\n    }\n\n    override assumeInteractionOn = ['input'];\n\n    private readonly hasSlotController = new HasSlotController(\n        this,\n        'label',\n        'instructions',\n        'hint',\n        'start',\n        'end',\n        'footer',\n    );\n\n    private readonly controlId = uniqueId('pk-date-picker');\n\n    @property({ type: Boolean, reflect: true })\n    open = false;\n\n    @property({ reflect: true })\n    placement: PkPopupPlacement = 'bottom';\n\n    @property({ attribute: 'side-offset', type: Number })\n    sideOffset = 4;\n\n    @property({ reflect: true })\n    size: PkDatePickerSize = 'default';\n\n    @property({ reflect: true })\n    mode: PkDatePickerMode = 'single';\n\n    // Accept Date at the boundary (Formie/v1); willUpdate coerces to ISO string.\n    @property()\n    value: string | Date = '';\n\n    @property({ attribute: 'default-value' })\n    defaultValue = '';\n\n    @property()\n    label = '';\n\n    @property()\n    instructions = '';\n\n    @property()\n    placeholder = '';\n\n    @property({ attribute: 'with-clear', type: Boolean })\n    withClear = false;\n\n    @property({ type: Boolean, reflect: true })\n    readonly = false;\n\n    @property({ type: Boolean, reflect: true })\n    invalid = false;\n\n    @property({ reflect: true })\n    min = '';\n\n    @property({ reflect: true })\n    max = '';\n\n    @property({ reflect: true })\n    locale = '';\n\n    @property({ attribute: 'disable-past', type: Boolean, reflect: true })\n    disablePast = false;\n\n    @property({ attribute: 'disable-future', type: Boolean, reflect: true })\n    disableFuture = false;\n\n    @property({ attribute: 'disabled-dates' })\n    disabledDates = '';\n\n    @property({ attribute: 'disabled-days-of-week', reflect: true })\n    disabledDaysOfWeek = '';\n\n    @property({ attribute: 'first-day-of-week', reflect: true })\n    firstDayOfWeek: 'auto' | 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat' = 'auto';\n\n    @property({ attribute: 'with-outside-days', type: Boolean, reflect: true })\n    withOutsideDays = true;\n\n    @property({ attribute: 'with-week-numbers', type: Boolean, reflect: true })\n    withWeekNumbers = false;\n\n    @property({ attribute: 'weekday-format', reflect: true })\n    weekdayFormat?: 'narrow' | 'short' | 'long';\n\n    @property({ type: Number, reflect: true })\n    months: 1 | 2 = 1;\n\n    @property({ attribute: 'page-by', reflect: true })\n    pageBy: 'months' | 'single' = 'months';\n\n    @property({ attribute: 'min-range', type: Number })\n    minRange = 0;\n\n    @property({ attribute: 'max-range', type: Number })\n    maxRange = 0;\n\n    @property({ attribute: false })\n    isDateDisabled?: (date: Date) => boolean;\n\n    @property({ attribute: false })\n    dayContent?: PkCalendarDayContent;\n\n    @property({ attribute: 'with-label', type: Boolean })\n    withLabel = false;\n\n    @property({ attribute: 'with-instructions', type: Boolean })\n    withInstructions = false;\n\n    @property({ attribute: 'aria-label' })\n    ariaLabel: string | null = null;\n\n    /** When `full`, the control stretches to the host width. */\n    @property({ reflect: true })\n    width?: 'full';\n\n    @query('.value-input')\n    override input!: HTMLInputElement;\n\n    @query('pk-popup')\n    private popupElement!: PkPopup;\n\n    @query('pk-calendar')\n    private calendarElement?: PkCalendar;\n\n    @query('.control')\n    private controlElement!: HTMLElement;\n\n    private dismissRegistered = false;\n\n    @state()\n    private daySlotNames: string[] = [];\n\n    private childrenObserver?: MutationObserver;\n\n    override connectedCallback(): void {\n        this.instructions = readLegacyInstructions(this, this.instructions);\n\n        if (this.hasAttribute('with-hint')) {\n            this.withInstructions = true;\n        }\n\n        super.connectedCallback();\n        this.toggleAttribute('data-has-value', Boolean(this.value));\n        this.setState('blank', !this.value);\n        this.updateDaySlots();\n        this.childrenObserver = new MutationObserver(() => this.updateDaySlots());\n        this.childrenObserver.observe(this, { childList: true, attributes: true, attributeFilter: ['slot'] });\n    }\n\n    override disconnectedCallback(): void {\n        this.childrenObserver?.disconnect();\n        void this.closePanel('api');\n        super.disconnectedCallback();\n    }\n\n    protected override willUpdate(changed: PropertyValues): void {\n        if (changed.has('value')) {\n            // Normalize Date → ISO so form values and parseIsoDate stay string-typed.\n            // Formie/v1 pass `value={Date}`; assigning a Date used to throw in displayText.\n            if (this.value instanceof Date) {\n                this.value = formatIsoDate(coerceToDate(this.value));\n            }\n\n            this.toggleAttribute('data-has-value', Boolean(this.value));\n            this.setState('blank', !this.value);\n        }\n\n        if (changed.has('open')) {\n            this.setState('open', this.open);\n            this.controlElement?.toggleAttribute('data-popup-open', this.open);\n        }\n\n        if (changed.has('mode')) {\n            this.setState('range', this.mode === 'range');\n        }\n\n        super.willUpdate(changed);\n    }\n\n    private updateDaySlots(): void {\n        const names = [...this.children]\n            .map((child) => child.getAttribute('slot'))\n            .filter((name): name is string => Boolean(name?.startsWith('day-')));\n\n        if (names.join(',') !== this.daySlotNames.join(',')) {\n            this.daySlotNames = names;\n        }\n    }\n\n    protected override syncFormValue(): void {\n        this.setValue(this.value || '');\n    }\n\n    protected override resetToDefaultValue(): void {\n        this.value = this.defaultValue;\n    }\n\n    protected override restoreFormState(state: string | File | FormData | null): void {\n        if (typeof state === 'string') {\n            this.value = state;\n        }\n    }\n\n    private get resolvedLocale(): string {\n        return this.locale || this.lang || resolveHostLocale();\n    }\n\n    private get displayText(): string {\n        if (!this.value) {\n            return this.placeholder;\n        }\n\n        if (this.mode === 'range') {\n            const range = parseRange(this.value);\n\n            if (range.from && range.to) {\n                return `${formatHostDate(range.from, this.resolvedLocale)} – ${formatHostDate(range.to, this.resolvedLocale)}`;\n            }\n\n            if (range.from) {\n                return formatHostDate(range.from, this.resolvedLocale);\n            }\n\n            return this.placeholder;\n        }\n\n        const date = parseIsoDate(this.value);\n\n        return date ? formatHostDate(date, this.resolvedLocale) : this.placeholder;\n    }\n\n    get valueAsDate(): Date | null {\n        return this.mode === 'single' ? parseIsoDate(this.value) : null;\n    }\n\n    get valueAsRange() {\n        return parseRange(this.value);\n    }\n\n    async show(): Promise<void> {\n        await this.openPanel();\n    }\n\n    async hide(): Promise<void> {\n        await this.closePanel('api');\n    }\n\n    clear(): void {\n        if (this.disabled || this.readonly || !this.value) {\n            return;\n        }\n\n        this.value = '';\n        this.dispatchEvent(new PkClearEvent());\n        this.emitValueChange();\n        this.controlElement?.focus();\n    }\n\n    private emitValueChange(): void {\n        this.dispatchEvent(new CustomEvent('pk-change', {\n            detail: { value: this.value },\n            bubbles: true,\n            composed: true,\n        }));\n\n        this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n        this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n    }\n\n    private async openPanel(): Promise<void> {\n        if (this.disabled || this.open) {\n            return;\n        }\n\n        if (!this.dispatchEvent(new PkShowEvent())) {\n            return;\n        }\n\n        this.open = true;\n        this.registerDismissHandlers();\n\n        await this.updateComplete;\n        await waitForPopupReposition(this.popupElement, this.placement);\n\n        this.dispatchEvent(new PkAfterShowEvent());\n    }\n\n    private async closePanel(source: PkOverlaySource = 'unknown'): Promise<void> {\n        if (!this.open) {\n            return;\n        }\n\n        const hideEvent = new PkHideEvent(source);\n\n        if (!this.dispatchEvent(hideEvent)) {\n            return;\n        }\n\n        this.open = false;\n        this.unregisterDismissHandlers();\n        this.dispatchEvent(new PkAfterHideEvent());\n    }\n\n    private registerDismissHandlers(): void {\n        if (this.dismissRegistered) {\n            return;\n        }\n\n        registerDismissible(this);\n        document.addEventListener('pointerdown', this.handleDocumentPointerDown, true);\n        document.addEventListener('keydown', this.handleDocumentKeyDown, true);\n        this.dismissRegistered = true;\n    }\n\n    private unregisterDismissHandlers(): void {\n        if (!this.dismissRegistered) {\n            return;\n        }\n\n        unregisterDismissible(this);\n        document.removeEventListener('pointerdown', this.handleDocumentPointerDown, true);\n        document.removeEventListener('keydown', this.handleDocumentKeyDown, true);\n        this.dismissRegistered = false;\n    }\n\n    private handleDocumentPointerDown = (event: PointerEvent): void => {\n        if (!this.open || !isTopDismissible(this)) {\n            return;\n        }\n\n        if (this.isPointerInside(event)) {\n            return;\n        }\n\n        void this.closePanel('light-dismiss');\n    };\n\n    private isPointerInside(event: PointerEvent): boolean {\n        return isPointerInsideOverlay(event, {\n            host: this,\n            panel: this.popupElement?.querySelector('.panel') ?? undefined,\n        });\n    };\n\n    private handleDocumentKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open || event.key !== 'Escape') {\n            return;\n        }\n\n        event.preventDefault();\n        void this.closePanel('escape');\n    };\n\n    private handleControlClick = (): void => {\n        if (this.disabled) {\n            return;\n        }\n\n        if (this.open) {\n            void this.closePanel('api');\n            return;\n        }\n\n        void this.openPanel();\n    };\n\n    private handleControlKeyDown = (event: KeyboardEvent): void => {\n        if (this.disabled) {\n            return;\n        }\n\n        if (event.key === 'ArrowDown' && event.altKey) {\n            event.preventDefault();\n            void this.openPanel();\n            queueMicrotask(() => this.calendarElement?.focus());\n            return;\n        }\n\n        if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault();\n            this.handleControlClick();\n        }\n    };\n\n    private handleClearClick = (event: Event): void => {\n        event.preventDefault();\n        event.stopPropagation();\n        this.clear();\n    };\n\n    private handleCalendarChange = (event: Event): void => {\n        const calendar = event.target as PkCalendar;\n        this.value = calendar.value;\n        this.emitValueChange();\n\n        if (this.mode === 'single' && calendar.value) {\n            void this.closePanel('api');\n        }\n\n        if (this.mode === 'range' && parseRange(calendar.value).from && parseRange(calendar.value).to) {\n            void this.closePanel('api');\n        }\n    };\n\n    private handleCalendarInput = (event: Event): void => {\n        const calendar = event.target as PkCalendar;\n        this.value = calendar.value;\n        this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n    };\n\n    private renderClearButton() {\n        if (!this.withClear || !this.value || this.disabled) {\n            return nothing;\n        }\n\n        return html`\n            <button\n                type=\"button\"\n                class=\"icon-button clear-button\"\n                part=\"clear-button\"\n                aria-label=\"Clear date\"\n                ?disabled=${this.disabled}\n                @click=${this.handleClearClick}\n            >\n                <slot name=\"clear-icon\">\n                    <span class=\"icon\" aria-hidden=\"true\">${unsafeSVG(CLEAR_ICON)}</span>\n                </slot>\n            </button>\n        `;\n    }\n\n    private renderCalendarIcon() {\n        return html`\n            <span class=\"calendar-icon\" part=\"expand-icon\" aria-hidden=\"true\">\n                <slot name=\"expand-icon\">\n                    <span class=\"icon\">${unsafeSVG(CALENDAR_ICON)}</span>\n                </slot>\n            </span>\n        `;\n    }\n\n    override render() {\n        const hasValue = Boolean(this.value);\n        const display = this.displayText;\n        const showPlaceholder = !hasValue;\n\n        return html`\n            <div part=\"form-control\" class=\"form-control\">\n                ${this.label || this.hasSlotController.test('label')\n                    ? html`\n                        <label part=\"label\" class=\"label\" for=${this.controlId}>\n                            <slot name=\"label\">${this.label}</slot>\n                        </label>\n                    `\n                    : nothing}\n\n                <div part=\"form-control-input\" class=\"form-control-input\">\n                    <input\n                        class=\"value-input\"\n                        type=\"hidden\"\n                        .value=${this.value}\n                        ?required=${this.required}\n                    />\n\n                    <div\n                        part=\"base\"\n                        id=${this.controlId}\n                        class=${classMap({\n                            control: true,\n                            'is-disabled': this.disabled,\n                        })}\n                        role=\"combobox\"\n                        aria-expanded=${this.open ? 'true' : 'false'}\n                        aria-haspopup=\"dialog\"\n                        aria-label=${this.ariaLabel ?? nothing}\n                        tabindex=${this.disabled ? '-1' : '0'}\n                        @click=${this.handleControlClick}\n                        @keydown=${this.handleControlKeyDown}\n                    >\n                        ${this.hasSlotController.test('start')\n                            ? html`<span part=\"start\" class=\"control-start\"><slot name=\"start\"></slot></span>`\n                            : nothing}\n\n                        ${this.renderCalendarIcon()}\n\n                        <span\n                            part=\"input\"\n                            class=${classMap({\n                                'display-value': true,\n                                'is-placeholder': showPlaceholder,\n                            })}\n                        >\n                            ${display}\n                        </span>\n\n                        ${this.renderClearButton()}\n\n                        ${this.hasSlotController.test('end')\n                            ? html`<span part=\"end\" class=\"control-end\"><slot name=\"end\"></slot></span>`\n                            : nothing}\n                    </div>\n\n                    <pk-popup\n                        .active=${this.open}\n                        .anchor=${this.controlElement ?? ''}\n                        .placement=${this.placement}\n                        .distance=${this.sideOffset}\n                    >\n                        <div part=\"popup\" class=\"panel\" role=\"dialog\" aria-label=\"Choose date\">\n                            <pk-calendar\n                                part=\"calendar\"\n                                .bordered=${false}\n                                .mode=${this.mode}\n                                .value=${this.value}\n                                .min=${this.min}\n                                .max=${this.max}\n                                .locale=${this.resolvedLocale}\n                                .months=${this.months}\n                                .pageBy=${this.pageBy}\n                                .firstDayOfWeek=${this.firstDayOfWeek}\n                                .withOutsideDays=${this.withOutsideDays}\n                                .withWeekNumbers=${this.withWeekNumbers}\n                                .weekdayFormat=${this.weekdayFormat ?? nothing}\n                                .minRange=${this.minRange}\n                                .maxRange=${this.maxRange}\n                                .disablePast=${this.disablePast}\n                                .disableFuture=${this.disableFuture}\n                                .disabledDatesRaw=${this.disabledDates}\n                                .disabledDaysOfWeek=${this.disabledDaysOfWeek}\n                                .isDateDisabled=${this.isDateDisabled}\n                                .dayContent=${this.dayContent}\n                                .disabled=${this.disabled}\n                                .readonly=${this.readonly}\n                                @change=${this.handleCalendarChange}\n                                @input=${this.handleCalendarInput}\n                            >\n                                ${this.daySlotNames.map((name) => html`\n                                    <slot name=${name} slot=${name}></slot>\n                                `)}\n                                <slot name=\"footer\" slot=\"footer\"></slot>\n                            </pk-calendar>\n                        </div>\n                    </pk-popup>\n                </div>\n\n                ${this.instructions || this.hasSlotController.test('instructions') || this.hasSlotController.test('hint')\n                    ? html`\n                        <div part=\"instructions\" class=\"instructions\">\n                            <slot name=\"instructions\">\n                                <slot name=\"hint\">${this.instructions}</slot>\n                            </slot>\n                        </div>\n                    `\n                    : nothing}\n            </div>\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-date-picker': PkDatePicker;\n    }\n}\n"],"mappings":"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"}

package/dist/chunks/pk-dropdown-item-BFyjtsL5.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pk-dropdown-item-BFyjtsL5.js","names":[],"sources":["../../src/components/dropdown-menu/dropdown-menu-size.styles.ts","../../src/components/dropdown-menu/pk-dropdown-item.styles.ts","../../src/components/dropdown-menu/pk-dropdown-item.ts"],"sourcesContent":["import { css } from 'lit';\n\nconst dropdownMenuSizeTokens = {\n    default: css`\n        --pk-dropdown-item-padding-block: 8px;\n        --pk-dropdown-item-padding-inline: 12px;\n        --pk-dropdown-item-gap: 0.625rem;\n        --pk-dropdown-item-font-size: var(--pk-font-size-base);\n        --pk-dropdown-item-icon-size: 12px;\n        --pk-dropdown-label-padding-inline: 12px;\n        --pk-dropdown-label-font-size: 13px;\n        --pk-dropdown-details-font-size: var(--pk-font-size-sm);\n    `,\n    xs: css`\n        --pk-dropdown-item-padding-block: 3px;\n        --pk-dropdown-item-padding-inline: 8px;\n        --pk-dropdown-item-gap: 0.375rem;\n        --pk-dropdown-item-font-size: 12px;\n        --pk-dropdown-item-icon-size: 10px;\n        --pk-dropdown-label-padding-inline: 8px;\n        --pk-dropdown-label-font-size: 11px;\n        --pk-dropdown-details-font-size: 11px;\n    `,\n    sm: css`\n        --pk-dropdown-item-padding-block: 4px;\n        --pk-dropdown-item-padding-inline: 10px;\n        --pk-dropdown-item-gap: 0.4375rem;\n        --pk-dropdown-item-font-size: 13px;\n        --pk-dropdown-item-icon-size: 12px;\n        --pk-dropdown-label-padding-inline: 10px;\n        --pk-dropdown-label-font-size: 11px;\n        --pk-dropdown-details-font-size: 12px;\n    `,\n    lg: css`\n        --pk-dropdown-item-padding-block: 10px;\n        --pk-dropdown-item-padding-inline: 14px;\n        --pk-dropdown-item-gap: 0.75rem;\n        --pk-dropdown-item-font-size: 16px;\n        --pk-dropdown-item-icon-size: 14px;\n        --pk-dropdown-label-padding-inline: 14px;\n        --pk-dropdown-label-font-size: 14px;\n        --pk-dropdown-details-font-size: var(--pk-font-size-sm);\n    `,\n    xl: css`\n        --pk-dropdown-item-padding-block: 12px;\n        --pk-dropdown-item-padding-inline: 16px;\n        --pk-dropdown-item-gap: 0.75rem;\n        --pk-dropdown-item-font-size: 18px;\n        --pk-dropdown-item-icon-size: 16px;\n        --pk-dropdown-label-padding-inline: 16px;\n        --pk-dropdown-label-font-size: 15px;\n        --pk-dropdown-details-font-size: var(--pk-font-size-base);\n    `,\n} as const;\n\n/** Size tokens on `pk-dropdown-menu` — cascades to light-DOM menu children. */\nexport const dropdownMenuHostSizeStyles = css`\n    @layer pk-component {\n        :host {\n            ${dropdownMenuSizeTokens.default}\n        }\n\n        :host([size='xs']) {\n            ${dropdownMenuSizeTokens.xs}\n        }\n\n        :host([size='sm']) {\n            ${dropdownMenuSizeTokens.sm}\n        }\n\n        :host([size='lg']) {\n            ${dropdownMenuSizeTokens.lg}\n        }\n\n        :host([size='xl']) {\n            ${dropdownMenuSizeTokens.xl}\n        }\n    }\n`;\n\n/**\n * Size tokens on popup panels.\n * Do not include bare `:host` here; importing this in `pk-dropdown-item`\n * would reset every item back to the default size.\n */\nexport const dropdownMenuPanelSizeStyles = css`\n    @layer pk-component {\n        .panel[data-size='default'],\n        .submenu-panel[data-size='default'] {\n            ${dropdownMenuSizeTokens.default}\n        }\n\n        .panel[data-size='xs'],\n        .submenu-panel[data-size='xs'] {\n            ${dropdownMenuSizeTokens.xs}\n        }\n\n        .panel[data-size='sm'],\n        .submenu-panel[data-size='sm'] {\n            ${dropdownMenuSizeTokens.sm}\n        }\n\n        .panel[data-size='lg'],\n        .submenu-panel[data-size='lg'] {\n            ${dropdownMenuSizeTokens.lg}\n        }\n\n        .panel[data-size='xl'],\n        .submenu-panel[data-size='xl'] {\n            ${dropdownMenuSizeTokens.xl}\n        }\n    }\n`;\n\n/** @deprecated Use dropdownMenuHostSizeStyles + dropdownMenuPanelSizeStyles. */\nexport const dropdownMenuSizeStyles = css`\n    ${dropdownMenuHostSizeStyles}\n    ${dropdownMenuPanelSizeStyles}\n`;\n","import { css } from 'lit';\n\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\nimport { dropdownMenuPanelSizeStyles } from './dropdown-menu-size.styles.js';\n\nexport const pkDropdownItemStyles = [\n    popupContentAnimationStyles,\n    dropdownMenuPanelSizeStyles,\n    css`\n    @layer pk-component {\n        :host {\n            display: block;\n            position: relative;\n        }\n\n        .item {\n            display: flex;\n            align-items: center;\n            gap: var(--pk-dropdown-item-gap, 0.625rem);\n            width: 100%;\n            margin: 0;\n            padding: var(--pk-dropdown-item-padding-block, 8px) var(--pk-dropdown-item-padding-inline, 12px);\n            border: 0;\n            background: transparent;\n            color: inherit;\n            font: inherit;\n            font-size: var(--pk-dropdown-item-font-size, var(--pk-font-size-base));\n            font-weight: normal;\n            text-align: left;\n            white-space: nowrap;\n            cursor: default;\n            user-select: none;\n            outline: none;\n            box-sizing: border-box;\n        }\n\n        .item:hover:not([disabled]):not([aria-disabled='true']),\n        :host([data-highlighted]) .item,\n        :host([submenu-open]) .item {\n            background: var(--pk-color-slate-100);\n        }\n\n        .item:focus-visible {\n            background: var(--pk-color-slate-100);\n        }\n\n        .item[aria-disabled='true'] {\n            pointer-events: none;\n            opacity: 0.5;\n        }\n\n        .label {\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n\n        .prefix {\n            display: inline-flex;\n            flex: 0 0 auto;\n            align-items: center;\n            justify-content: center;\n            width: var(--pk-dropdown-item-icon-size, 12px);\n            height: var(--pk-dropdown-item-icon-size, 12px);\n            line-height: 0;\n        }\n\n        .prefix--empty {\n            display: none;\n        }\n\n        .prefix ::slotted(*) {\n            display: inline-flex;\n            flex: 0 0 auto;\n            align-items: center;\n            justify-content: center;\n            width: var(--pk-dropdown-item-icon-size, 12px);\n            height: var(--pk-dropdown-item-icon-size, 12px);\n            /* Kill pk-icon text-baseline nudge inside the padded flex row. */\n            vertical-align: 0;\n        }\n\n        .prefix ::slotted(svg),\n        .prefix ::slotted(*) svg,\n        .prefix ::slotted(.pk-dropdown-item__prefix-icon) {\n            display: block;\n            width: var(--pk-dropdown-item-icon-size, 12px) !important;\n            height: var(--pk-dropdown-item-icon-size, 12px) !important;\n            max-width: var(--pk-dropdown-item-icon-size, 12px);\n            max-height: var(--pk-dropdown-item-icon-size, 12px);\n            flex-shrink: 0;\n            pointer-events: none;\n        }\n\n        .details {\n            margin-left: auto;\n            color: var(--pk-color-gray-500);\n            font-size: var(--pk-dropdown-details-font-size, var(--pk-font-size-sm));\n            letter-spacing: 0.04em;\n        }\n\n        .details:empty {\n            display: none;\n        }\n\n        .check {\n            display: inline-flex;\n            flex: 0 0 auto;\n            align-items: center;\n            justify-content: center;\n            width: 12px;\n            height: 12px;\n            color: var(--pk-color-gray-700);\n        }\n\n        .check svg {\n            display: block;\n            width: 12px;\n            height: 12px;\n            flex-shrink: 0;\n            pointer-events: none;\n        }\n\n        .submenu-icon {\n            display: inline-flex;\n            flex: 0 0 auto;\n            align-items: center;\n            justify-content: center;\n            width: 1rem;\n            color: var(--pk-color-gray-700);\n        }\n\n        .submenu-icon svg {\n            display: block;\n            width: 1em;\n            height: 1em;\n            flex-shrink: 0;\n            pointer-events: none;\n        }\n\n        .check {\n            opacity: 0;\n        }\n\n        :host([checked]) .check {\n            opacity: 1;\n        }\n\n        :host([type='checkbox']) .check,\n        :host([type='radio']) .check {\n            margin-left: auto;\n        }\n\n        :host([type='checkbox'][checked]) .check,\n        :host([type='radio'][checked]) .check {\n            opacity: 1;\n        }\n\n        .submenu-icon:empty {\n            display: none;\n        }\n\n        :host([destructive]) .item {\n            color: var(--pk-color-error);\n        }\n\n        :host([destructive]) .item:hover:not([disabled]):not([aria-disabled='true']),\n        :host([destructive]) .item:focus-visible {\n            color: var(--pk-color-error);\n        }\n\n        .submenu-panel {\n            width: max-content;\n            min-width: 8rem;\n            overflow: hidden;\n            padding: 4px 0;\n            border-radius: var(--pk-radius-md);\n            background: var(--pk-color-white);\n            box-shadow: var(--pk-shadow-popup);\n            /* Match root menu panel — Craft body text, not gray-900. */\n            color: var(--text-color, var(--pk-color-gray-700));\n        }\n\n        .submenu-panel ::slotted(pk-dropdown-item),\n        .submenu-panel ::slotted(pk-dropdown-separator),\n        .submenu-panel ::slotted(pk-dropdown-label) {\n            display: block;\n        }\n\n        .submenu-panel[hidden] {\n            display: none !important;\n        }\n    }\n`,\n];\n","import { html, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { check, chevronRight } from '@verbb/plugin-kit-icons';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { HasSlotController } from '../../internal/has-slot.js';\nimport { renderIconHtml } from '../../icons/render.js';\nimport {\n    syncPopupPlacementAnimation,\n    waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\nimport { pkDropdownItemStyles } from './pk-dropdown-item.styles.js';\n\nconst CHECK_ICON = renderIconHtml(check);\nconst SUBMENU_ICON = renderIconHtml(chevronRight);\n\nexport type PkDropdownItemType = 'normal' | 'checkbox' | 'radio';\n\ntype PkDropdownMenuSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';\n\n/**\n * Dropdown menu item — use inside `pk-dropdown-menu`.\n *\n * @slot - Item label\n * @slot start - Leading icon (preferred; matches pk-button)\n * @slot prefix - Alias for `start` (legacy)\n * @slot details - Trailing shortcut text\n * @slot submenu - Nested menu items (`pk-dropdown-item`, separators, labels)\n *\n * @csspart item - Menu item button\n * @csspart prefix - Leading icon wrapper (hidden when empty)\n */\n@customElement('pk-dropdown-item')\nexport class PkDropdownItem extends PkElement {\n    static override styles = pkDropdownItemStyles;\n\n    @property()\n    value = '';\n\n    @property({ reflect: true })\n    type: PkDropdownItemType = 'normal';\n\n    @property({ attribute: 'radio-group' })\n    radioGroup = '';\n\n    @property({ type: Boolean, reflect: true })\n    disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    destructive = false;\n\n    @property({ type: Boolean, reflect: true })\n    checked = false;\n\n    @property({ attribute: 'submenu-open', type: Boolean, reflect: true })\n    submenuOpen = false;\n\n    /**\n     * Roving highlight index for keyboard nav (`active`).\n     * Visual chrome uses `:focus-visible` / hover — not this flag — so mouse-open\n     * does not paint the first item selected (initial open).\n     */\n    @property({ type: Boolean })\n    active = false;\n\n    @state()\n    private submenuAnimated = false;\n\n    @query('.submenu-panel')\n    private submenuPanelElement!: HTMLDivElement;\n\n    @query('pk-popup')\n    private submenuPopupElement!: HTMLElement;\n\n    private readonly hasSlotController = new HasSlotController(this, 'submenu', 'details', 'start', 'prefix');\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n        this.syncRole();\n        this.syncSubmenuAria();\n        this.addEventListener('click', this.handleHostClick);\n        // Bind mouseenter on the host — covers the whole row, not just the button.\n        this.addEventListener('mouseenter', this.handleMouseEnter);\n    }\n\n    override disconnectedCallback(): void {\n        this.removeEventListener('click', this.handleHostClick);\n        this.removeEventListener('mouseenter', this.handleMouseEnter);\n        this.closeSubmenu();\n        super.disconnectedCallback();\n    }\n\n    override updated(changed: Map<string, unknown>): void {\n        if (changed.has('type') || changed.has('checked')) {\n            this.syncRole();\n        }\n\n        if (changed.has('submenuOpen') || changed.size === 0) {\n            this.syncSubmenuAria();\n        }\n\n        // Keyboard / external callers set `submenuOpen`; mouse path goes through openSubmenu().\n        if (changed.has('submenuOpen')) {\n            if (this.submenuOpen) {\n                this.ensureSubmenuSurface();\n            } else {\n                this.submenuAnimated = false;\n            }\n        }\n    }\n\n    /** Light-DOM `slot=\"submenu\"` — public for menu keyboard (`hasSubmenu`). */\n    hasSubmenu(): boolean {\n        return this.hasSlotController.test('submenu');\n    }\n\n    private syncSubmenuAria(): void {\n        const hasSubmenu = this.hasSubmenu();\n\n        if (hasSubmenu) {\n            this.setAttribute('aria-haspopup', 'menu');\n        } else {\n            this.removeAttribute('aria-haspopup');\n        }\n\n        this.setAttribute('aria-expanded', hasSubmenu && this.submenuOpen ? 'true' : 'false');\n    }\n\n    focusControl(): void {\n        this.shadowRoot?.querySelector<HTMLButtonElement>('.item')?.focus({ preventScroll: true });\n    }\n\n    /** Callers `item.focus()` — route into the shadow control button. */\n    override focus(options?: FocusOptions): void {\n        const button = this.shadowRoot?.querySelector<HTMLButtonElement>('.item');\n\n        if (button) {\n            button.focus(options);\n            return;\n        }\n\n        super.focus(options);\n    }\n\n    /** Public for menu leave-detection (`submenuElement`). */\n    get submenuElement(): HTMLDivElement | null {\n        return this.submenuPanelElement ?? null;\n    }\n\n    closeSubmenu(): void {\n        this.submenuAnimated = false;\n        this.submenuOpen = false;\n    }\n\n    /**\n     * Opens the nested submenu panel (mouse + keyboard).\n     * notify parent first so siblings close, then set `submenuOpen`.\n     */\n    openSubmenu(): void {\n        if (!this.hasSubmenu() || this.disabled || !this.isConnected) {\n            return;\n        }\n\n        this.notifyParentOfOpening();\n        this.submenuOpen = true;\n    }\n\n    /** `notifyParentOfOpening` — sibling close + bubble to the menu. */\n    private notifyParentOfOpening(): void {\n        this.dispatchEvent(new CustomEvent('pk-submenu-open', {\n            bubbles: true,\n            composed: true,\n            detail: { item: this },\n        }));\n\n        const parent = this.parentElement;\n\n        if (!parent) {\n            return;\n        }\n\n        // Same slot + same light-DOM parent = siblings (top-level or nested submenu).\n        for (const el of parent.children) {\n            if (\n                el !== this\n                && el instanceof PkDropdownItem\n                && el.getAttribute('slot') === this.getAttribute('slot')\n                && el.submenuOpen\n            ) {\n                el.submenuOpen = false;\n            }\n        }\n    }\n\n    private ensureSubmenuSurface(): void {\n        if (!this.hasSubmenu() || this.disabled) {\n            return;\n        }\n\n        this.submenuAnimated = true;\n\n        void this.updateComplete.then(() => {\n            if (!this.submenuOpen || !this.submenuPanelElement) {\n                return;\n            }\n\n            this.submenuPanelElement.hidden = false;\n            syncPopupPlacementAnimation(this.submenuPanelElement, 'right-start');\n\n            void waitForPopupReposition(this.submenuPopupElement, 'right-start').then((placement) => {\n                syncPopupPlacementAnimation(this.submenuPanelElement, placement);\n            });\n        });\n    }\n\n    private syncRole(): void {\n        if (this.type === 'checkbox') {\n            this.setAttribute('role', 'menuitemcheckbox');\n            this.setAttribute('aria-checked', this.checked ? 'true' : 'false');\n            return;\n        }\n\n        if (this.type === 'radio') {\n            this.setAttribute('role', 'menuitemradio');\n            this.setAttribute('aria-checked', this.checked ? 'true' : 'false');\n            return;\n        }\n\n        this.setAttribute('role', 'menuitem');\n        this.removeAttribute('aria-checked');\n    }\n\n    /** `handleMouseEnter` — open on hover; siblings close via notify. */\n    private handleMouseEnter = (): void => {\n        if (!this.hasSubmenu() || this.disabled) {\n            return;\n        }\n\n        this.notifyParentOfOpening();\n        this.submenuOpen = true;\n    };\n\n    /** Host has `role=\"menuitem\"` — block disabled activation; selection is handled by `pk-dropdown-menu`. */\n    private handleHostClick = (event: Event): void => {\n        if (this.disabled) {\n            event.preventDefault();\n            event.stopImmediatePropagation();\n        }\n    };\n\n    private handleClick(event: Event): void {\n        if (this.disabled) {\n            event.preventDefault();\n            event.stopImmediatePropagation();\n            return;\n        }\n\n        if (this.hasSubmenu()) {\n            event.preventDefault();\n            this.openSubmenu();\n        }\n    }\n\n    override render() {\n        const hasSubmenu = this.hasSubmenu();\n        const showCheck = this.type === 'checkbox' || this.type === 'radio';\n        // Prefer start (button parity); prefix kept as legacy alias.\n        const hasLeadingIcon = this.hasSlotController.test('start') || this.hasSlotController.test('prefix');\n\n        return html`\n            <button\n                part=\"item\"\n                type=\"button\"\n                class=\"item\"\n                ?disabled=${this.disabled}\n                aria-disabled=${this.disabled ? 'true' : nothing}\n                @click=${this.handleClick}\n            >\n                <span\n                    part=\"prefix\"\n                    class=${hasLeadingIcon ? 'prefix' : 'prefix prefix--empty'}\n                >\n                    <slot name=\"start\"></slot>\n                    <slot name=\"prefix\"></slot>\n                </span>\n                <span class=\"label\"><slot></slot></span>\n                <span class=\"details\"><slot name=\"details\"></slot></span>\n                ${showCheck ? html`<span class=\"check\" aria-hidden=\"true\">${unsafeSVG(CHECK_ICON)}</span>` : nothing}\n                ${hasSubmenu ? html`<span class=\"submenu-icon\" aria-hidden=\"true\">${unsafeSVG(SUBMENU_ICON)}</span>` : nothing}\n            </button>\n            ${hasSubmenu ? html`\n                <pk-popup\n                    .active=${this.submenuOpen}\n                    .anchor=${this}\n                    placement=\"right-start\"\n                    .distance=${0}\n                    .skidding=${-4}\n                    flip\n                    shift\n                    hover-bridge\n                    style=\"--pk-popup-z-index: 1001\"\n                >\n                    <div\n                        part=\"submenu\"\n                        class=\"submenu-panel pk-popup-content\"\n                        role=\"menu\"\n                        data-size=${resolveMenuSize(this)}\n                        ?hidden=${!this.submenuOpen}\n                        data-open=${this.submenuAnimated ? '' : nothing}\n                        aria-orientation=\"vertical\"\n                    >\n                        <slot name=\"submenu\"></slot>\n                    </div>\n                </pk-popup>\n            ` : nothing}\n        `;\n    }\n}\n\nfunction resolveMenuSize(item: PkDropdownItem): PkDropdownMenuSize {\n    const panelSize = item.parentElement?.getAttribute('data-size');\n\n    if (panelSize === 'xs' || panelSize === 'sm' || panelSize === 'default' || panelSize === 'lg' || panelSize === 'xl') {\n        return panelSize;\n    }\n\n    const menu = item.closest('pk-dropdown-menu');\n    const menuSize = menu?.getAttribute('size');\n\n    if (menuSize === 'xs' || menuSize === 'sm' || menuSize === 'lg' || menuSize === 'xl') {\n        return menuSize;\n    }\n\n    return 'default';\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-dropdown-item': PkDropdownItem;\n    }\n}\n"],"mappings":"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"}

package/dist/chunks/pk-dropdown-label-DfACId-K.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pk-dropdown-label-DfACId-K.js","names":[],"sources":["../../src/components/dropdown-menu/pk-dropdown-label.styles.ts","../../src/components/dropdown-menu/pk-dropdown-label.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkDropdownLabelStyles = css`\n    @layer pk-component {\n        :host {\n            display: block;\n        }\n\n        /* Match v1 DropdownMenuLabel — text-slate-700, regular weight (not medium). */\n        .label {\n            margin: 0;\n            padding-block-start: 6px;\n            padding-block-end: 4px;\n            padding-inline: var(--pk-dropdown-label-padding-inline, 12px);\n            color: var(--pk-color-slate-700, rgba(96, 125, 159, 0.7));\n            font-size: var(--pk-dropdown-label-font-size, 13px);\n            font-weight: 400;\n            line-height: 1.3;\n            user-select: none;\n            pointer-events: none;\n        }\n    }\n`;\n","import { html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkDropdownLabelStyles } from './pk-dropdown-label.styles.js';\n\n/** Non-interactive group label inside `pk-dropdown-menu`. */\n@customElement('pk-dropdown-label')\nexport class PkDropdownLabel extends PkElement {\n    static override styles = pkDropdownLabelStyles;\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n        this.setAttribute('role', 'presentation');\n    }\n\n    override render() {\n        return html`\n            <div part=\"label\" class=\"label\">\n                <slot></slot>\n            </div>\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-dropdown-label': PkDropdownLabel;\n    }\n}\n"],"mappings":";;;;AAEA,IAAa,wBAAwB,GAAG;;;;;;;;;;;;;;;;;;;;;;;ACMjC,IAAA,kBAAA,MAAM,wBAAwB,UAAU;;gBAClB;;CAEzB,oBAAmC;AAC/B,QAAM,mBAAmB;AACzB,OAAK,aAAa,QAAQ,eAAe;;CAG7C,SAAkB;AACd,SAAO,IAAI;;;;;;;8BAVlB,cAAc,oBAAoB,CAAA,EAAA,gBAAA"}