@verbb/plugin-kit-web 2.0.20 → 2.0.21

package/dist/chunks/{pk-form-associated-element-CCQALRGB.js → pk-form-associated-element-GxX5lbnk.js}

@@ -98,7 +98,7 @@ var PkFormAssociatedElement = class extends PkElement {
 	updated(changed) {
 		if (changed.has("customError")) this.setCustomValidity(this.customError ?? "");
 		if (changed.has("disabled")) this.setState("disabled", Boolean(this.disabled));
-		if (changed.has("value") || changed.has("disabled") || changed.has("required") || changed.has("name")) this.syncFormValue();
+		if (changed.has("value") || changed.has("checked") || changed.has("disabled") || changed.has("required") || changed.has("name")) this.syncFormValue();
 		this.updateValidity();
 		super.updated(changed);
 		this.syncHostAriaMirror();
@@ -269,4 +269,4 @@ __decorate([property({
 //#endregion
 export { CustomErrorValidator as n, PkInvalidEvent as r, PkFormAssociatedElement as t };
 
-//# sourceMappingURL=pk-form-associated-element-CCQALRGB.js.map
+//# sourceMappingURL=pk-form-associated-element-GxX5lbnk.js.map

package/dist/chunks/pk-form-associated-element-GxX5lbnk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pk-form-associated-element-GxX5lbnk.js","names":[],"sources":["../../src/events/pk-invalid.ts","../../src/validators/custom-error-validator.ts","../../src/base/pk-form-associated-element.ts"],"sourcesContent":["/** Fired when a form control fails constraint validation — mirrors  `pk-invalid`. */\nexport class PkInvalidEvent extends Event {\n    constructor() {\n        super('pk-invalid', { bubbles: true, cancelable: false, composed: true });\n    }\n}\n\ndeclare global {\n    interface GlobalEventHandlersEventMap {\n        'pk-invalid': PkInvalidEvent;\n    }\n}\n","import type { PkValidator } from './types.js';\n\nexport function CustomErrorValidator(): PkValidator {\n    return {\n        observedAttributes: ['custom-error'],\n        checkValidity(element) {\n            const result = {\n                message: '',\n                isValid: true,\n                invalidKeys: [] as ReturnType<PkValidator['checkValidity']>['invalidKeys'],\n            };\n\n            if (element.customError) {\n                result.message = element.customError;\n                result.isValid = false;\n                result.invalidKeys.push('customError');\n            }\n\n            return result;\n        },\n    };\n}\n","import type { PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { HostAriaMirror } from '../internal/control-aria.js';\nimport { PkInvalidEvent } from '../events/pk-invalid.js';\nimport { CustomErrorValidator, type PkValidator } from '../validators/index.js';\nimport { PkElement } from './pk-element.js';\n\n/**\n * Form-associated custom element base — ElementInternals + shared validity helpers.\n *\n * @cssstate disabled - The control is disabled.\n * @cssstate required - The control is required.\n * @cssstate optional - The control is not required.\n * @cssstate invalid - The control currently fails constraint validation.\n * @cssstate valid - The control currently passes constraint validation.\n * @cssstate user-invalid - Invalid after the user has interacted with the control.\n * @cssstate user-valid - Valid after the user has interacted with the control.\n */\nexport abstract class PkFormAssociatedElement extends PkElement {\n    static formAssociated = true;\n\n    static get validators(): PkValidator[] {\n        return [CustomErrorValidator()];\n    }\n\n    static get observedAttributes(): string[] {\n        const attrs = new Set(super.observedAttributes ?? []);\n\n        for (const validator of this.validators) {\n            for (const attr of validator.observedAttributes ?? []) {\n                attrs.add(attr);\n            }\n        }\n\n        return [...attrs];\n    }\n\n    protected readonly internals = this.attachInternals();\n\n    /** Shadow native control for `MirrorValidator`. */\n    input?: HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n\n    /** Events that must all fire before `:user-invalid` applies — override per component. */\n    assumeInteractionOn: string[] = ['input'];\n\n    validators: PkValidator[] = [];\n\n    /** Name submitted with form data. */\n    @property({ reflect: true })\n    name: string | null = null;\n\n    /** Disables the control and excludes it from constraint validation. */\n    @property({ type: Boolean, reflect: true })\n    disabled = false;\n\n    /** Marks the control as required for form submission. */\n    @property({ type: Boolean, reflect: true })\n    required = false;\n\n    /** Custom validation message; also settable via `setCustomValidity()`. */\n    @property({ attribute: 'custom-error', reflect: true })\n    customError: string | null = null;\n\n    @property({ attribute: false, state: true })\n    valueHasChanged = false;\n\n    @property({ attribute: false, state: true })\n    hasInteracted = false;\n\n    private emittedEvents: string[] = [];\n\n    private hostAriaMirror?: HostAriaMirror;\n\n    constructor() {\n        super();\n        this.addEventListener('invalid', this.emitInvalid as EventListener);\n    }\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n\n        for (const eventName of this.assumeInteractionOn) {\n            this.addEventListener(eventName, this.handleInteraction);\n        }\n\n        this.updateValidity();\n    }\n\n    override disconnectedCallback(): void {\n        this.hostAriaMirror?.disconnect();\n        this.hostAriaMirror = undefined;\n\n        for (const eventName of this.assumeInteractionOn) {\n            this.removeEventListener(eventName, this.handleInteraction);\n        }\n\n        this.removeEventListener('invalid', this.emitInvalid as EventListener);\n        super.disconnectedCallback();\n    }\n\n    override updated(changed: PropertyValues): void {\n        if (changed.has('customError')) {\n            this.setCustomValidity(this.customError ?? '');\n        }\n\n        if (changed.has('disabled')) {\n            // Do not toggleAttribute(`disabled`, this.disabled): when React/@lit/react\n            // assigns `disabled = undefined`, force is undefined and toggleAttribute\n            // *adds* the attribute (boolean presence → disabled=true → FACE\n            // formDisabledCallback). Reflection on this Boolean property already syncs\n            // the attribute; only Custom State API needs an explicit update here.\n            this.setState('disabled', Boolean(this.disabled));\n        }\n\n        if (\n            changed.has('value') ||\n            changed.has('checked') ||\n            changed.has('disabled') ||\n            changed.has('required') ||\n            changed.has('name')\n        ) {\n            this.syncFormValue();\n        }\n\n        this.updateValidity();\n        super.updated(changed);\n        this.syncHostAriaMirror();\n    }\n\n    override firstUpdated(_changed: PropertyValues): void {\n        super.firstUpdated(_changed);\n        this.connectHostAriaMirror();\n    }\n\n    /** Focusable native control that receives mirrored field-shell ARIA. */\n    protected getAriaMirrorTarget(): HTMLElement | null {\n        return this.input ?? null;\n    }\n\n    /** Standalone label/instructions wiring when no external field shell is present. */\n    protected syncStandaloneAria(): void {}\n\n    protected connectHostAriaMirror(): void {\n        this.hostAriaMirror?.disconnect();\n        this.hostAriaMirror = new HostAriaMirror(\n            this,\n            () => this.getAriaMirrorTarget(),\n            () => this.syncStandaloneAria(),\n        );\n        this.hostAriaMirror.connect();\n    }\n\n    protected syncHostAriaMirror(): void {\n        this.hostAriaMirror?.sync();\n    }\n\n    formResetCallback(): void {\n        this.resetValidity();\n        this.hasInteracted = false;\n        this.valueHasChanged = false;\n        this.emittedEvents = [];\n        this.resetToDefaultValue();\n        this.syncFormValue();\n        this.updateValidity();\n    }\n\n    formDisabledCallback(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n        this.updateValidity();\n    }\n\n    formStateRestoreCallback(state: string | File | FormData | null, _reason?: 'restore' | 'autocomplete'): void {\n        this.restoreFormState(state);\n        this.syncFormValue();\n        this.updateValidity();\n    }\n\n    set form(value: string) {\n        if (value) {\n            this.setAttribute('form', value);\n        } else {\n            this.removeAttribute('form');\n        }\n    }\n\n    get form(): HTMLFormElement | null {\n        return this.internals.form;\n    }\n\n    get labels(): NodeList {\n        return this.internals.labels;\n    }\n\n    get validity(): ValidityState {\n        return this.internals.validity;\n    }\n\n    get willValidate(): boolean {\n        return this.internals.willValidate;\n    }\n\n    get validationMessage(): string {\n        return this.internals.validationMessage;\n    }\n\n    getForm(): HTMLFormElement | null {\n        return this.internals.form;\n    }\n\n    /** Runs constraint validation without showing the browser UI. */\n    checkValidity(): boolean {\n        this.updateValidity();\n        return this.internals.checkValidity();\n    }\n\n    /** Runs constraint validation and shows the browser UI when invalid. */\n    reportValidity(): boolean {\n        this.updateValidity();\n        this.hasInteracted = true;\n        return this.internals.reportValidity();\n    }\n\n    /** Clears custom errors and re-syncs validity state. */\n    resetValidity(): void {\n        this.setCustomValidity('');\n        this.internals.setValidity({});\n        this.syncCustomStates();\n    }\n\n    /** Sets or clears a custom validation message. */\n    setCustomValidity(message: string): void {\n        if (!message) {\n            this.customError = null;\n            this.internals.setValidity({});\n            this.syncCustomStates();\n            return;\n        }\n\n        this.customError = message;\n        const anchor = this.validationTarget;\n\n        if (anchor instanceof HTMLElement) {\n            this.internals.setValidity({ customError: true }, message, anchor);\n        } else {\n            this.internals.setValidity({ customError: true }, message);\n        }\n\n        this.syncCustomStates();\n    }\n\n    protected get validationTarget(): HTMLElement | undefined {\n        return this.input;\n    }\n\n    protected get allValidators(): PkValidator[] {\n        const ctor = this.constructor as typeof PkFormAssociatedElement;\n        return [...(ctor.validators ?? []), ...(this.validators ?? [])];\n    }\n\n    protected setFormValue(\n        value: string | File | FormData | null,\n        state?: string | File | FormData | null,\n    ): void {\n        this.internals.setFormValue(value, state ?? value);\n    }\n\n    protected setValue(\n        value: string | File | FormData | null,\n        state?: string | File | FormData | null,\n    ): void {\n        this.setFormValue(value, state ?? value);\n    }\n\n    protected updateValidity(): void {\n        if (this.disabled || this.hasAttribute('disabled') || !this.willValidate) {\n            this.internals.setValidity({});\n            this.syncCustomStates();\n            return;\n        }\n\n        const validators = this.allValidators;\n\n        if (!validators.length) {\n            return;\n        }\n\n        const flags: Partial<Record<keyof ValidityState, boolean>> = {\n            customError: Boolean(this.customError),\n        };\n\n        let finalMessage = '';\n        const anchor = this.validationTarget;\n\n        for (const validator of validators) {\n            const { isValid, message, invalidKeys } = validator.checkValidity(this);\n\n            if (isValid) {\n                continue;\n            }\n\n            if (!finalMessage) {\n                finalMessage = message;\n            }\n\n            for (const key of invalidKeys) {\n                flags[key] = true;\n            }\n        }\n\n        if (!finalMessage) {\n            finalMessage = this.validationMessage;\n        }\n\n        if (anchor instanceof HTMLElement) {\n            this.internals.setValidity(flags, finalMessage, anchor);\n        } else {\n            this.internals.setValidity(flags, finalMessage);\n        }\n\n        this.syncCustomStates();\n    }\n\n    protected syncCustomStates(): void {\n        const isValid = this.internals.validity.valid;\n\n        this.setState('required', this.required);\n        this.setState('optional', !this.required);\n        this.setState('invalid', !isValid);\n        this.setState('valid', isValid);\n        this.setState('user-invalid', !isValid && this.hasInteracted);\n        this.setState('user-valid', isValid && this.hasInteracted);\n    }\n\n    protected setState(name: string, active: boolean): void {\n        const states = this.internals.states;\n\n        if (!states) {\n            return;\n        }\n\n        if (active) {\n            states.add(name);\n        } else {\n            states.delete(name);\n        }\n    }\n\n    protected syncFormValue(): void {}\n\n    protected resetToDefaultValue(): void {}\n\n    protected restoreFormState(_state: string | File | FormData | null): void {}\n\n    private emitInvalid = (event: Event): void => {\n        if (event.target !== this) {\n            return;\n        }\n\n        this.hasInteracted = true;\n        this.dispatchEvent(new PkInvalidEvent());\n    };\n\n    private handleInteraction = (event: Event): void => {\n        if (!this.emittedEvents.includes(event.type)) {\n            this.emittedEvents.push(event.type);\n        }\n\n        if (this.emittedEvents.length >= this.assumeInteractionOn.length) {\n            this.hasInteracted = true;\n            this.updateValidity();\n        }\n    };\n}\n"],"mappings":"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"}

package/dist/chunks/{pk-image-browser-DP-9Eyk8.js → pk-image-browser-Bj8LhWfk.js}

@@ -2,7 +2,7 @@ import { t as icons_exports } from "./icons-BR8JcQj2.js";
 import { a as query, i as property, o as state, s as customElement, t as __decorate } from "./decorate-R0X811qp.js";
 import "./pk-spinner-DweuYJ_Z.js";
 import { t as iconStyles } from "./icon.styles-BLTWLqYp.js";
-import { t as PkFormAssociatedElement } from "./pk-form-associated-element-CCQALRGB.js";
+import { t as PkFormAssociatedElement } from "./pk-form-associated-element-GxX5lbnk.js";
 import { t as MirrorValidator } from "./mirror-validator-DCjNYrrx.js";
 import { t as RequiredValidator } from "./required-validator-CEg8dvjS.js";
 import { n as renderIconHtml } from "./render-Dvc3MHQR.js";
@@ -1360,4 +1360,4 @@ PkImageBrowser = __decorate([customElement("pk-image-browser")], PkImageBrowser)
 //#endregion
 export { PkImageBrowser as t };
 
-//# sourceMappingURL=pk-image-browser-DP-9Eyk8.js.map
+//# sourceMappingURL=pk-image-browser-Bj8LhWfk.js.map

package/dist/chunks/{pk-image-browser-DP-9Eyk8.js.map → pk-image-browser-Bj8LhWfk.js.map}

@@ -1 +1 @@
-{"version":3,"file":"pk-image-browser-DP-9Eyk8.js","names":[],"sources":["../../src/components/image-browser/pk-image-browser.styles.ts","../../src/components/image-browser/pk-image-browser.ts"],"sourcesContent":["import { css } from 'lit';\n\nimport { iconStyles } from '../../base/icon.styles.js';\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\n\n/**\n * Presentational static image / icon browser.\n * Trigger chrome mirrors combobox popup-mode; panel grid mirrors Vizy icon picker.\n */\nexport const pkImageBrowserStyles = [\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            vertical-align: top;\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-image-browser-trigger-min-height: var(--pk-btn-height-default);\n            --pk-image-browser-padding-block: 6px;\n            --pk-image-browser-padding-inline: 10px;\n            --pk-image-browser-font-size: var(--pk-font-size-base);\n            --pk-image-browser-line-height: var(--pk-input-control-line-height, 1.25rem);\n            --pk-image-browser-glyph-size: 1rem;\n            --pk-image-browser-panel-width: 26.25rem;\n            /* Hit target larger than the glyph so the select ring has breathing room. */\n            --pk-image-browser-cell-min: 2.25rem;\n            --pk-image-browser-glyph-tile: 1.375rem;\n            --pk-image-browser-fill: var(--pk-color-slate-250);\n            --pk-image-browser-fill-hover: var(--pk-color-slate-300);\n        }\n\n        /* Caption under each cell — wider tracks; glyph size stays put. */\n        :host([label-mode='inline']) {\n            --pk-image-browser-cell-min: 3.75rem;\n        }\n\n        :host([size='xs']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-xs);\n            --pk-image-browser-padding-block: 2px;\n            --pk-image-browser-padding-inline: 6px;\n            --pk-image-browser-font-size: var(--pk-font-size-xs, 0.75rem);\n            --pk-image-browser-glyph-size: 0.875rem;\n        }\n\n        :host([size='sm']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-sm);\n            --pk-image-browser-padding-block: 4px;\n            --pk-image-browser-padding-inline: 8px;\n            --pk-image-browser-font-size: var(--pk-font-size-sm, 0.8125rem);\n            --pk-image-browser-glyph-size: 0.875rem;\n        }\n\n        :host([size='lg']),\n        :host([size='xl']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-lg);\n            --pk-image-browser-padding-block: 8px;\n            --pk-image-browser-padding-inline: 12px;\n            --pk-image-browser-font-size: var(--pk-font-size-lg, 1rem);\n            --pk-image-browser-glyph-size: 1.125rem;\n        }\n\n        /* Image mode — roomier photo tiles; captions still opt-in via label-mode=\"inline\". */\n        :host([mode='image']) {\n            --pk-image-browser-panel-width: 34rem;\n            --pk-image-browser-cell-min: 7.5rem;\n        }\n\n        :host([mode='image'][label-mode='inline']) {\n            /* Captions reclaim a little width; preview stays the hero. */\n            --pk-image-browser-cell-min: 6.5rem;\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        .value-input {\n            position: absolute;\n            width: 1px;\n            height: 1px;\n            margin: -1px;\n            padding: 0;\n            overflow: hidden;\n            clip: rect(0, 0, 0, 0);\n            white-space: nowrap;\n            border: 0;\n            opacity: 0;\n            pointer-events: none;\n        }\n\n        /* Combobox-style chrome: label + clear + chevron share one filled control.\n         * 0.5rem gap keeps ellipsized filenames from kissing the clear glyph. */\n        .control {\n            display: inline-flex;\n            align-items: stretch;\n            gap: 0.5rem;\n            min-width: 12.5rem;\n            max-width: 100%;\n            height: var(--pk-image-browser-trigger-min-height);\n            min-height: var(--pk-image-browser-trigger-min-height);\n            margin: 0;\n            padding: 0 0 0 var(--pk-image-browser-padding-inline);\n            border: 1px solid transparent;\n            border-radius: var(--pk-input-border-radius, var(--pk-radius-lg));\n            background: var(--pk-image-browser-fill);\n            color: inherit;\n            box-sizing: border-box;\n            overflow: hidden;\n            transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;\n        }\n\n        .control:hover:not(.is-disabled) {\n            background: var(--pk-image-browser-fill-hover);\n        }\n\n        .control.is-open:not(.is-disabled) {\n            background: var(--pk-image-browser-fill-hover);\n        }\n\n        .control: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([invalid]) .control,\n        :host(:state(user-invalid)) .control {\n            border-color: var(--pk-color-rose-500, #f43f5e);\n        }\n\n        .control.is-disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .trigger {\n            display: inline-flex;\n            align-items: center;\n            flex: 1 1 auto;\n            min-width: 0;\n            margin: 0;\n            padding: var(--pk-image-browser-padding-block) 0;\n            border: 0;\n            border-radius: 0;\n            background: transparent;\n            color: inherit;\n            font: inherit;\n            font-size: var(--pk-image-browser-font-size);\n            font-weight: 400;\n            line-height: var(--pk-image-browser-line-height);\n            text-align: left;\n            white-space: nowrap;\n            cursor: pointer;\n            outline: none;\n            box-sizing: border-box;\n        }\n\n        .trigger:disabled {\n            cursor: not-allowed;\n        }\n\n        .trigger-main {\n            display: inline-flex;\n            align-items: center;\n            gap: 0.5rem;\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        .trigger-preview {\n            display: inline-flex;\n            flex-shrink: 0;\n            align-items: center;\n            justify-content: center;\n            width: var(--pk-image-browser-glyph-size);\n            height: var(--pk-image-browser-glyph-size);\n            overflow: hidden;\n        }\n\n        .trigger-preview svg,\n        .trigger-preview img {\n            display: block;\n            width: 100%;\n            height: 100%;\n            object-fit: contain;\n        }\n\n        .trigger-preview svg {\n            fill: currentColor;\n        }\n\n        .trigger-label {\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n\n        .trigger-label.is-placeholder {\n            color: var(--pk-color-gray-500);\n        }\n\n        .clear-button,\n        .expand-button {\n            display: inline-flex;\n            flex-shrink: 0;\n            align-items: center;\n            justify-content: center;\n            align-self: stretch;\n            box-sizing: border-box;\n            width: calc(0.75rem + 0.5rem);\n            margin: 0;\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        .expand-button {\n            width: calc(0.75rem + 0.5rem + var(--pk-image-browser-padding-inline));\n            padding-inline-end: var(--pk-image-browser-padding-inline);\n        }\n\n        .clear-button:hover:not(:disabled),\n        .expand-button:hover:not(:disabled) {\n            color: var(--pk-color-gray-800);\n        }\n\n        .clear-button:disabled,\n        .expand-button:disabled {\n            cursor: not-allowed;\n        }\n\n        .clear-button-icon,\n        .expand-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        .expand-button-icon svg {\n            display: block;\n            width: 0.75rem;\n            height: 0.75rem;\n        }\n\n        .panel {\n            position: relative;\n            box-sizing: border-box;\n            display: flex;\n            flex-direction: column;\n            width: var(--pk-image-browser-panel-width);\n            max-width: min(100vw - 1.5rem, var(--pk-image-browser-panel-width));\n            max-height: min(28.75rem, 60vh);\n            border-radius: var(--pk-radius-lg);\n            background: var(--pk-color-white);\n            box-shadow:\n                0 0 0 1px rgba(31, 41, 51, 0.1),\n                0 5px 20px rgba(31, 41, 51, 0.25);\n            overflow: hidden;\n        }\n\n        .panel[hidden] {\n            display: none !important;\n        }\n\n        .panel-search {\n            flex: none;\n            /* Same inline inset as panel-body so search + grid share one vertical edge. */\n            padding: 0.625rem 0.625rem 0.5rem;\n            border-bottom: 1px solid var(--pk-color-gray-150, rgba(51, 64, 77, 0.1));\n        }\n\n        .panel-input {\n            display: block;\n            width: 100%;\n            box-sizing: border-box;\n            margin: 0;\n            padding: 0.375rem 0.625rem;\n            border: 1px solid var(--pk-color-gray-200, #d4dce4);\n            border-radius: var(--pk-input-border-radius, var(--pk-radius-md));\n            background: var(--pk-color-white);\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-font-size-sm, 0.8125rem);\n            line-height: 1.25rem;\n            outline: none;\n        }\n\n        .panel-input:focus {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n        }\n\n        .panel-body {\n            flex: 1 1 auto;\n            min-height: 0;\n            overflow-y: auto;\n            /* Match search field inset so the grid lines up with the input. */\n            padding: 0.5rem 0.625rem 0.625rem;\n        }\n\n        :host([mode='image']) .panel-body {\n            padding: 0.5rem 0.625rem 0.625rem;\n        }\n\n        .group + .group {\n            margin-top: 0.875rem;\n        }\n\n        .group-heading {\n            display: flex;\n            justify-content: space-between;\n            gap: 0.5rem;\n            margin: 0 0 0.375rem;\n            color: var(--pk-color-gray-500);\n            font-size: 0.6875rem;\n            font-weight: 600;\n            letter-spacing: 0.04em;\n            line-height: 1.25;\n            text-transform: uppercase;\n        }\n\n        .group-heading-count {\n            font-weight: 400;\n            letter-spacing: 0;\n            text-transform: none;\n        }\n\n        /* Fixed column width (not 1fr) so sparse catalogs stay dense instead of stretching. */\n        .grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fill, var(--pk-image-browser-cell-min));\n            gap: 0.375rem;\n            justify-content: start;\n            /* Don’t stretch short single-line cells to match taller wrapped neighbors in the row. */\n            align-items: start;\n        }\n\n        :host([mode='image']) .grid {\n            grid-template-columns: repeat(auto-fill, minmax(var(--pk-image-browser-cell-min), 1fr));\n            gap: 0.375rem;\n        }\n\n        .option {\n            box-sizing: border-box;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n            gap: 0;\n            width: var(--pk-image-browser-cell-min);\n            height: var(--pk-image-browser-cell-min);\n            margin: 0;\n            /* Square hit target; glyph is smaller so the ring doesn’t clip tips. */\n            padding: 0;\n            border: 1px solid transparent;\n            border-radius: var(--pk-radius-sm);\n            background: none;\n            color: inherit;\n            cursor: pointer;\n            outline: none;\n            overflow: hidden;\n        }\n\n        /* With captions, height hugs glyph + label instead of a fixed square. */\n        :host([label-mode='inline']) .option {\n            justify-content: flex-start;\n            gap: 0.125rem;\n            height: auto;\n            /* Keep glyph + caption inside the inset highlight ring. */\n            padding: 0.25rem 0.125rem 0.3125rem;\n        }\n\n        :host([mode='image']) .option {\n            position: relative;\n            width: auto;\n            height: auto;\n            min-height: 0;\n            gap: 0;\n            padding: 0;\n            overflow: hidden;\n            border-radius: var(--pk-radius-md);\n        }\n\n        :host([mode='image'][label-mode='inline']) .option {\n            gap: 0.375rem;\n            padding: 0.375rem 0.375rem 0.5rem;\n            overflow: visible;\n        }\n\n        .option:hover,\n        .option:focus-visible,\n        .option.is-highlighted {\n            background: var(--pk-color-gray-050, #f3f7fc);\n        }\n\n        /* Selected is the durable chrome; highlight/hover share the same ring for keyboard parity. */\n        .option.is-selected,\n        .option.is-highlighted,\n        .option:hover {\n            box-shadow: inset 0 0 0 2px var(--pk-color-sky-600);\n        }\n\n        /*\n         * Flush photo tiles paint over inset box-shadow (descendants sit above it).\n         * Overlay the same ring so tooltip/none match inline chrome.\n         */\n        :host([mode='image']) .option.is-selected,\n        :host([mode='image']) .option.is-highlighted,\n        :host([mode='image']) .option:hover {\n            box-shadow: none;\n        }\n\n        :host([mode='image']) .option.is-selected::after,\n        :host([mode='image']) .option.is-highlighted::after,\n        :host([mode='image']) .option:hover::after {\n            content: '';\n            position: absolute;\n            inset: 0;\n            z-index: 1;\n            border-radius: inherit;\n            box-shadow: inset 0 0 0 2px var(--pk-color-sky-600);\n            pointer-events: none;\n        }\n\n        .option:focus-visible {\n            outline: none;\n        }\n\n        .option-preview {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 0 0 auto;\n            width: var(--pk-image-browser-glyph-tile);\n            height: var(--pk-image-browser-glyph-tile);\n            margin: 0;\n            overflow: hidden;\n        }\n\n        :host([mode='image']) .option-preview {\n            width: 100%;\n            height: auto;\n            aspect-ratio: 4 / 3;\n            margin: 0;\n            border-radius: inherit;\n        }\n\n        .option-preview svg,\n        .option-preview img {\n            display: block;\n            width: 100%;\n            height: 100%;\n            object-fit: contain;\n        }\n\n        /* Photo tiles crop to fill — previews, not faithful aspect viewers. */\n        :host([mode='image']) .option-preview svg,\n        :host([mode='image']) .option-preview img {\n            object-fit: cover;\n        }\n\n        .option-preview svg {\n            fill: currentColor;\n        }\n\n        .option-label {\n            display: -webkit-box;\n            box-sizing: border-box;\n            width: 100%;\n            max-width: 100%;\n            padding-inline: 2px;\n            overflow: hidden;\n            color: var(--pk-color-gray-700);\n            font-size: 0.625rem;\n            line-height: 0.75rem;\n            text-align: center;\n            overflow-wrap: anywhere;\n            word-break: break-word;\n            -webkit-box-orient: vertical;\n            -webkit-line-clamp: 3;\n            line-clamp: 3;\n        }\n\n        :host([mode='image']) .option-label {\n            display: block;\n            color: var(--pk-color-gray-600);\n            font-size: 0.6875rem;\n            line-height: 1.2;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            overflow-wrap: normal;\n            word-break: normal;\n            -webkit-line-clamp: unset;\n            line-clamp: unset;\n        }\n\n        .notice {\n            margin: 0.375rem 0;\n            color: var(--pk-color-gray-500);\n            font-size: var(--pk-font-size-sm, 0.8125rem);\n        }\n\n        .notice.is-error {\n            color: var(--pk-color-rose-600, #e11d48);\n        }\n\n        /* Host-driven catalog warm — spinner only (no loading copy). */\n        .loading {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            box-sizing: border-box;\n            min-height: 6rem;\n            padding: 1.25rem 0.75rem;\n            color: var(--pk-color-gray-500);\n        }\n\n        .panel-input:disabled {\n            cursor: not-allowed;\n            opacity: 0.6;\n        }\n\n        /* Host is inert layout chrome; the floating tip lives in pk-popup. */\n        .option-tooltip {\n            position: absolute;\n            width: 0;\n            height: 0;\n            margin: 0;\n            padding: 0;\n            overflow: hidden;\n            pointer-events: none;\n        }\n    }\n    `,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { customElement, property, query, state } from '../../decorators.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 { 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 { MirrorValidator, RequiredValidator } from '../../validators/index.js';\nimport { isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport {\n    syncPopupPlacementAnimation,\n    waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\n// Keep the internal element registered when production builds erase type-only imports.\nimport '../popup/pk-popup.js';\nimport type { PkPopup, PkPopupPlacement } from '../popup/pk-popup.js';\nimport '../spinner/pk-spinner.js';\nimport '../tooltip/pk-tooltip.js';\nimport type { PkTooltip } from '../tooltip/pk-tooltip.js';\nimport { pkImageBrowserStyles } from './pk-image-browser.styles.js';\n\nexport type PkImageBrowserSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';\n\n/** Grid preview kind — compact glyphs vs larger photo tiles. */\nexport type PkImageBrowserMode = 'icon' | 'image';\n\n/**\n * How option names appear in the grid.\n * - `tooltip` (default) — shared `pk-tooltip` on hover; `aria-label` always\n * - `inline` — caption under each cell\n * - `none` — `aria-label` only (no tooltip, no caption)\n *\n * Named `labelMode` (not `labels`) to avoid clashing with the native\n * form-associated `HTMLElement.labels` NodeList getter.\n */\nexport type PkImageBrowserLabelMode = 'tooltip' | 'inline' | 'none';\n\nexport type PkImageBrowserWidth = 'auto' | 'full';\n\n/**\n * One browsable entry. Plugins own filtering / filesystem scanning and pass\n * already-resolved preview URLs or inline SVG markup.\n */\nexport type PkImageBrowserItem = {\n    value: string;\n    label: string;\n    /** Public URL for `<img>`, or inline `<svg>…</svg>` markup. */\n    preview?: string;\n};\n\nexport type PkImageBrowserGroup = {\n    name: string;\n    items: PkImageBrowserItem[];\n};\n\nconst CHEVRON_ICON = renderIconHtml(chevronDown);\nconst XMARK_ICON = renderIconHtml(xmark);\n\n/** How many matched items per group are painted before scroll reveals more. */\nconst DEFAULT_PAGE_SIZE = 96;\n\nfunction isInlineSvg(preview: string): boolean {\n    return /^\\s*<svg[\\s>]/i.test(preview);\n}\n\n/**\n * Image browser — presentational picker for static filesystem icons/images.\n *\n * Plugins supply `items` / `groups` (and optional `selected-label` /\n * `selected-preview` for the closed trigger before the catalog is ready). The\n * kit does not scan disks or filter extensions.\n *\n * Keyboard: trigger opens with Enter / Space / ArrowDown; search owns focus with\n * `aria-activedescendant`; arrows move the highlight (2D in the grid); Enter\n * selects; Escape closes.\n *\n * @csspart root - Filled control surface (trigger + clear + chevron)\n * @csspart trigger - Opens the panel (preview + label)\n * @csspart clear-button - Clear selection button (inside the control)\n * @csspart panel - Popup panel shell\n * @csspart panel-search - Search field container\n * @csspart panel-input - Search input\n * @csspart panel-body - Scrollable results region\n * @csspart loading - Catalog-loading status region (spinner)\n * @csspart option - Grid cell button\n *\n * @dependency pk-popup - Positioned panel host.\n * @dependency pk-spinner - Shown in the panel while `loading` is set.\n * @dependency pk-tooltip - Hover label when `label-mode=\"tooltip\"`.\n */\n@customElement('pk-image-browser')\nexport class PkImageBrowser extends PkFormAssociatedElement {\n    static override styles = pkImageBrowserStyles;\n\n    static override get validators() {\n        return [...super.validators, MirrorValidator(), RequiredValidator()];\n    }\n\n    override assumeInteractionOn = ['pk-change'];\n\n    @property({ reflect: true })\n    size: PkImageBrowserSize = 'default';\n\n    /** `icon` = compact glyph tiles; `image` = larger photo tiles. */\n    @property({ reflect: true })\n    mode: PkImageBrowserMode = 'icon';\n\n    @property({ reflect: true })\n    width: PkImageBrowserWidth = 'auto';\n\n    /**\n     * How option names appear in the grid: `tooltip` (default), `inline` under\n     * each cell, or `none` (`aria-label` only).\n     */\n    @property({ reflect: true, attribute: 'label-mode' })\n    labelMode: PkImageBrowserLabelMode = 'tooltip';\n\n    @property({ type: Boolean, reflect: true })\n    invalid = false;\n\n    @property({ type: Boolean, reflect: true })\n    readonly = false;\n\n    @property()\n    value = '';\n\n    @property({ attribute: 'default-value' })\n    defaultValue = '';\n\n    @property()\n    placeholder = 'Choose…';\n\n    @property({ attribute: 'search-placeholder' })\n    searchPlaceholder = 'Search…';\n\n    @property({ attribute: 'empty-message' })\n    emptyMessage = 'No items match your query.';\n\n    @property({ attribute: 'aria-label' })\n    ariaLabel: string | null = null;\n\n    /**\n     * Host-driven catalog warm / refresh. Shows a centered `pk-spinner` in the\n     * panel (no loading copy). Prefer this over inferring from empty `items` /\n     * `groups` — empty can also mean a filter miss or a genuinely empty catalog.\n     */\n    @property({ type: Boolean, reflect: true })\n    loading = false;\n\n    /** Show a clear control when a value is selected. */\n    @property({ type: Boolean, reflect: true, attribute: 'with-clear' })\n    withClear = true;\n\n    @property({ attribute: false })\n    items: PkImageBrowserItem[] = [];\n\n    @property({ attribute: false })\n    groups: PkImageBrowserGroup[] = [];\n\n    /**\n     * Closed-trigger label when `value` is set but not yet found in `items` /\n     * `groups` (e.g. catalog still loading).\n     */\n    @property({ attribute: 'selected-label' })\n    selectedLabel = '';\n\n    /** Closed-trigger preview for the same pre-catalog case as `selected-label`. */\n    @property({ attribute: 'selected-preview' })\n    selectedPreview = '';\n\n    @property({ reflect: true })\n    placement: PkPopupPlacement = 'bottom-start';\n\n    @property({ type: Number, attribute: 'side-offset' })\n    sideOffset = 4;\n\n    /** Items drawn per group before scroll reveals the next page. */\n    @property({ type: Number, attribute: 'page-size' })\n    pageSize = DEFAULT_PAGE_SIZE;\n\n    @property({ type: Boolean, reflect: true })\n    open = false;\n\n    @state()\n    private query = '';\n\n    /** Render budget shared across groups — raised by scrolling, reset on query/open. */\n    @state()\n    private limit = DEFAULT_PAGE_SIZE;\n\n    @state()\n    private closing = false;\n\n    @state()\n    private panelAnimated = false;\n\n    /** Flat index into `flatVisibleItems()` for aria-activedescendant navigation. */\n    @state()\n    private highlightedIndex = -1;\n\n    /** Shared hover tooltip target when `labelMode=\"tooltip\"`. */\n    @state()\n    private tooltipFor = '';\n\n    @state()\n    private tooltipContent = '';\n\n    @query('.value-input')\n    override input!: HTMLInputElement;\n\n    @query('.trigger')\n    private triggerElement!: HTMLButtonElement;\n\n    @query('.control')\n    private controlElement!: HTMLDivElement;\n\n    @query('pk-popup')\n    private popupElement!: PkPopup;\n\n    @query('.panel')\n    private panelElement!: HTMLDivElement;\n\n    @query('.panel-input')\n    private searchInput!: HTMLInputElement | null;\n\n    @query('.panel-body')\n    private panelBody!: HTMLDivElement | null;\n\n    @query('.option-tooltip')\n    private optionTooltip!: PkTooltip | null;\n\n    private readonly listboxId = uniqueId('pk-image-browser-listbox');\n    private readonly searchId = uniqueId('pk-image-browser-search');\n    private closeTimer: number | null = null;\n    private tooltipOpenTimer: number | null = null;\n    private liveRegion: LiveRegion | null = null;\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n        this.limit = this.normalizedPageSize();\n    }\n\n    override disconnectedCallback(): void {\n        this.teardownDismissListeners();\n        this.clearCloseTimer();\n        this.clearTooltipOpenTimer();\n        this.liveRegion?.destroy();\n        this.liveRegion = null;\n        super.disconnectedCallback();\n    }\n\n    protected override willUpdate(changed: PropertyValues): void {\n        if (changed.has('pageSize') && !this.open) {\n            this.limit = this.normalizedPageSize();\n        }\n\n        super.willUpdate(changed);\n    }\n\n    override updated(changed: PropertyValues): void {\n        super.updated(changed);\n\n        if (changed.has('open')) {\n            if (this.open) {\n                this.attachDismissListeners();\n            } else if (!this.closing) {\n                this.teardownDismissListeners();\n            }\n        }\n\n        if ((changed.has('open') || changed.has('closing')) && (this.open || this.closing)) {\n            void this.syncPanelPlacement();\n        }\n\n        if (this.open && (changed.has('highlightedIndex') || changed.has('query') || changed.has('limit'))) {\n            this.scrollHighlightedIntoView();\n        }\n\n        // Catalog arrived while the panel is open — restore the selected cell when available.\n        if (this.open && changed.has('loading') && !this.loading) {\n            this.resetHighlightForOpenCatalog();\n        }\n    }\n\n    protected override get validationTarget(): HTMLElement {\n        return this.triggerElement ?? this;\n    }\n\n    protected override syncFormValue(): void {\n        this.setFormValue(this.value, 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    async show(): Promise<void> {\n        if (this.open || this.closing || this.disabled || this.readonly) {\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 optionId(index: number): string {\n        return `${this.listboxId}-opt-${index}`;\n    }\n\n    private groupHeadingId(groupIndex: number): string {\n        return `${this.listboxId}-group-${groupIndex}`;\n    }\n\n    private normalizedPageSize(): number {\n        return this.pageSize > 0 ? this.pageSize : DEFAULT_PAGE_SIZE;\n    }\n\n    private resolveGroups(): PkImageBrowserGroup[] {\n        if (this.groups.length > 0) {\n            return this.groups;\n        }\n\n        if (this.items.length > 0) {\n            return [{ name: '', items: this.items }];\n        }\n\n        return [];\n    }\n\n    private findItem(value: string): PkImageBrowserItem | null {\n        if (value === '') {\n            return null;\n        }\n\n        for (const group of this.resolveGroups()) {\n            const found = group.items.find((item) => item.value === value);\n            if (found) {\n                return found;\n            }\n        }\n\n        return null;\n    }\n\n    private selectedItem(): PkImageBrowserItem | null {\n        return this.findItem(this.value);\n    }\n\n    private triggerDisplay(): { label: string; preview?: string; isPlaceholder: boolean } {\n        const selected = this.selectedItem();\n        if (selected) {\n            return {\n                label: selected.label,\n                preview: selected.preview,\n                isPlaceholder: false,\n            };\n        }\n\n        if (this.value !== '') {\n            return {\n                label: this.selectedLabel || this.value,\n                preview: this.selectedPreview || undefined,\n                isPlaceholder: false,\n            };\n        }\n\n        return {\n            label: this.placeholder,\n            isPlaceholder: true,\n        };\n    }\n\n    /** Groups matching the query, each truncated to the current render budget. */\n    private visibleGroups(): Array<PkImageBrowserGroup & { total: number }> {\n        const query = this.query.trim().toLowerCase();\n\n        return this.resolveGroups().reduce<Array<PkImageBrowserGroup & { total: number }>>((acc, group) => {\n            const matched = query === ''\n                ? group.items\n                : group.items.filter((item) => (\n                    item.label.toLowerCase().includes(query)\n                    || item.value.toLowerCase().includes(query)\n                ));\n\n            if (matched.length === 0) {\n                return acc;\n            }\n\n            acc.push({\n                name: group.name,\n                total: matched.length,\n                items: matched.slice(0, this.limit),\n            });\n            return acc;\n        }, []);\n    }\n\n    private flatVisibleItems(): PkImageBrowserItem[] {\n        return this.visibleGroups().flatMap((group) => group.items);\n    }\n\n    private isTruncated(): boolean {\n        return this.visibleGroups().some((group) => group.items.length < group.total);\n    }\n\n    private activeDescendantId(): string | null {\n        if (!this.open || this.highlightedIndex < 0) {\n            return null;\n        }\n\n        return this.optionId(this.highlightedIndex);\n    }\n\n    private triggerAccessibleName(): string {\n        if (this.ariaLabel) {\n            const display = this.triggerDisplay();\n            if (display.isPlaceholder) {\n                return this.ariaLabel;\n            }\n            return `${this.ariaLabel}, ${display.label}`;\n        }\n\n        return this.triggerDisplay().label;\n    }\n\n    private announceResults(): void {\n        // Skip while the host is still warming — empty would read as \"no matches\".\n        if (this.loading) {\n            return;\n        }\n\n        const items = this.flatVisibleItems();\n        const filter = this.query.trim();\n\n        if (!filter) {\n            return;\n        }\n\n        if (!this.liveRegion) {\n            this.liveRegion = new LiveRegion('polite');\n        }\n\n        this.liveRegion.announce(\n            items.length === 0\n                ? this.emptyMessage\n                : `${items.length} ${items.length === 1 ? 'result' : 'results'} available`,\n        );\n    }\n\n    private resetHighlightForOpenCatalog(): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        this.highlightedIndex = items.findIndex((item) => item.value === this.value);\n    }\n\n    private setHighlightedIndex(index: number): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        const next = Math.max(0, Math.min(index, items.length - 1));\n        this.highlightedIndex = next;\n\n        // Navigating near the end of a truncated catalog should reveal more, same as scroll.\n        if (next >= items.length - 4 && this.isTruncated()) {\n            this.limit += this.normalizedPageSize();\n        }\n    }\n\n    private scrollHighlightedIntoView(): void {\n        if (this.highlightedIndex < 0 || !this.panelBody) {\n            return;\n        }\n\n        const option = this.renderRoot.querySelector<HTMLElement>(\n            `#${CSS.escape(this.optionId(this.highlightedIndex))}`,\n        );\n        if (!option) {\n            return;\n        }\n\n        scrollIntoView(option, this.panelBody, 'vertical', 'auto');\n    }\n\n    /** Column count of the CSS grid that owns the highlighted option (for 2D arrows). */\n    private columnCountNear(index: number): number {\n        const option = this.renderRoot.querySelector<HTMLElement>(\n            `#${CSS.escape(this.optionId(index))}`,\n        );\n        const grid = option?.closest('.grid');\n        if (!grid) {\n            return 1;\n        }\n\n        const options = [...grid.querySelectorAll<HTMLElement>('.option')];\n        if (options.length === 0) {\n            return 1;\n        }\n\n        const firstTop = options[0]!.offsetTop;\n        let cols = 0;\n        for (const candidate of options) {\n            if (candidate.offsetTop !== firstTop) {\n                break;\n            }\n            cols += 1;\n        }\n\n        return Math.max(1, cols);\n    }\n\n    private moveHighlight(key: string): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        let next = this.highlightedIndex;\n\n        if (next < 0) {\n            next = (key === 'ArrowUp' || key === 'ArrowLeft' || key === 'End')\n                ? items.length - 1\n                : 0;\n            this.setHighlightedIndex(next);\n            return;\n        }\n\n        const cols = this.columnCountNear(next);\n\n        switch (key) {\n            case 'ArrowRight':\n                next = Math.min(next + 1, items.length - 1);\n                break;\n            case 'ArrowLeft':\n                next = Math.max(next - 1, 0);\n                break;\n            case 'ArrowDown':\n                next = Math.min(next + cols, items.length - 1);\n                break;\n            case 'ArrowUp':\n                next = Math.max(next - cols, 0);\n                break;\n            case 'Home':\n                next = 0;\n                break;\n            case 'End':\n                next = items.length - 1;\n                break;\n            default:\n                return;\n        }\n\n        this.setHighlightedIndex(next);\n    }\n\n    private emitChange(next: string): void {\n        this.value = next;\n        this.syncFormValue();\n        this.updateValidity();\n\n        this.dispatchEvent(new CustomEvent('pk-change', {\n            detail: { value: next },\n            bubbles: true,\n            composed: true,\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 selectValue(next: string): void {\n        if (this.disabled || this.readonly) {\n            return;\n        }\n\n        const previous = this.value;\n        void this.closePanel('api');\n        this.query = '';\n        this.limit = this.normalizedPageSize();\n        this.highlightedIndex = -1;\n\n        // Re-clicking the active option clears it (same as the trigger clear control).\n        if (previous === next) {\n            if (this.withClear && previous !== '') {\n                this.emitChange('');\n                this.dispatchEvent(new PkClearEvent());\n            }\n            return;\n        }\n\n        this.emitChange(next);\n    }\n\n    private handleClear = (event: Event): void => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this.disabled || this.readonly || this.value === '') {\n            return;\n        }\n\n        this.emitChange('');\n        this.dispatchEvent(new PkClearEvent());\n        this.triggerElement?.focus({ preventScroll: true });\n    };\n\n    private togglePanel = (event?: Event): void => {\n        event?.preventDefault();\n        event?.stopPropagation();\n\n        if (this.disabled || this.readonly) {\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    private handleTriggerKeyDown = (event: KeyboardEvent): void => {\n        if (this.disabled || this.readonly) {\n            return;\n        }\n\n        if (\n            event.key === 'ArrowDown'\n            || event.key === 'ArrowUp'\n            || event.key === 'Enter'\n            || event.key === ' '\n        ) {\n            event.preventDefault();\n            if (!this.open && !this.closing) {\n                void this.openPanel();\n            }\n        }\n    };\n\n    private async openPanel(): Promise<void> {\n        if (this.open || this.closing || this.disabled || this.readonly) {\n            return;\n        }\n\n        this.dispatchEvent(new PkShowEvent());\n        this.closing = false;\n        this.panelAnimated = false;\n        this.query = '';\n        this.limit = this.normalizedPageSize();\n        this.open = true;\n        this.resetHighlightForOpenCatalog();\n\n        await this.updateComplete;\n        await this.syncPanelPlacement();\n        this.panelAnimated = true;\n        this.dispatchEvent(new PkAfterShowEvent());\n        await this.focusSearchWhenReady();\n        this.scrollHighlightedIntoView();\n    }\n\n    private async closePanel(source: PkOverlaySource): Promise<void> {\n        if (!this.open || this.closing) {\n            return;\n        }\n\n        const hideEvent = new PkHideEvent(source);\n        this.dispatchEvent(hideEvent);\n        if (hideEvent.defaultPrevented) {\n            return;\n        }\n\n        this.closing = true;\n        this.open = false;\n        this.highlightedIndex = -1;\n        this.clearOptionTooltip();\n        this.teardownDismissListeners();\n        this.triggerElement?.focus({ preventScroll: true });\n\n        this.clearCloseTimer();\n        this.closeTimer = window.setTimeout(() => {\n            this.closing = false;\n            this.panelAnimated = false;\n            this.query = '';\n            this.limit = this.normalizedPageSize();\n            this.closeTimer = null;\n            this.dispatchEvent(new PkAfterHideEvent());\n        }, 100);\n    }\n\n    private clearCloseTimer(): void {\n        if (this.closeTimer != null) {\n            window.clearTimeout(this.closeTimer);\n            this.closeTimer = null;\n        }\n    }\n\n    private async syncPanelPlacement(): Promise<void> {\n        if (!this.popupElement || !this.panelElement) {\n            return;\n        }\n\n        syncPopupPlacementAnimation(this.panelElement, this.placement);\n        const placement = await waitForPopupReposition(this.popupElement, this.placement, 300, {\n            requireEvent: true,\n        });\n        syncPopupPlacementAnimation(this.panelElement, placement);\n    }\n\n    private attachDismissListeners(): void {\n        registerDismissible(this);\n        document.addEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.addEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private teardownDismissListeners(): void {\n        unregisterDismissible(this);\n        document.removeEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private onDocumentPointerDown = (event: PointerEvent): void => {\n        if (!this.open || this.closing || !isTopDismissible(this)) {\n            return;\n        }\n\n        if (isPointerInsideOverlay(event, {\n            host: this,\n            anchor: this.controlElement ?? this.triggerElement,\n            panel: this.panelElement,\n        })) {\n            return;\n        }\n\n        void this.closePanel('pointer-dismiss');\n    };\n\n    private onDocumentKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open || this.closing || !isTopDismissible(this)) {\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            event.preventDefault();\n            event.stopPropagation();\n            void this.closePanel('escape');\n        }\n    };\n\n    private handleSearchInput = (event: Event): void => {\n        if (this.loading) {\n            return;\n        }\n\n        this.query = (event.target as HTMLInputElement).value;\n        // New query = new set; don't keep a tall scroll budget from the previous browse.\n        this.limit = this.normalizedPageSize();\n        this.resetHighlightForOpenCatalog();\n        this.announceResults();\n    };\n\n    private handleSearchKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open || this.closing || this.loading) {\n            return;\n        }\n\n        switch (event.key) {\n            case 'ArrowDown':\n            case 'ArrowUp':\n            case 'ArrowLeft':\n            case 'ArrowRight':\n            case 'Home':\n            case 'End':\n                event.preventDefault();\n                event.stopPropagation();\n                this.moveHighlight(event.key);\n                return;\n            case 'Enter': {\n                event.preventDefault();\n                event.stopPropagation();\n                const items = this.flatVisibleItems();\n                const item = items[this.highlightedIndex];\n                if (item) {\n                    this.selectValue(item.value);\n                }\n                return;\n            }\n            default:\n                break;\n        }\n    };\n\n    private handleResultsScroll = (): void => {\n        // Tip can trail a scrolled-away cell; drop it and let hover re-open.\n        this.clearOptionTooltip();\n\n        const results = this.panelBody;\n        if (!results || !this.isTruncated()) {\n            return;\n        }\n\n        if (results.scrollTop + results.clientHeight < results.scrollHeight - 200) {\n            return;\n        }\n\n        const anchor = results.scrollTop;\n        this.limit += this.normalizedPageSize();\n        void this.updateComplete.then(() => {\n            if (this.panelBody) {\n                this.panelBody.scrollTop = anchor;\n            }\n        });\n    };\n\n    private async focusSearchWhenReady(): Promise<void> {\n        const started = performance.now();\n        while (this.open && performance.now() - started < 2000) {\n            const input = this.searchInput;\n            if (input && getComputedStyle(input).visibility !== 'hidden') {\n                input.focus({ preventScroll: true });\n                if (document.activeElement === input) {\n                    return;\n                }\n            }\n            await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()));\n        }\n    }\n\n    private renderPreview(preview: string | undefined, className: string) {\n        if (!preview) {\n            return nothing;\n        }\n\n        if (isInlineSvg(preview)) {\n            return html`<span class=${className} aria-hidden=\"true\">${unsafeSVG(preview)}</span>`;\n        }\n\n        return html`<img class=${className} src=${preview} alt=\"\" />`;\n    }\n\n    private usesInlineLabels(): boolean {\n        return this.labelMode === 'inline';\n    }\n\n    private usesTooltipLabels(): boolean {\n        return this.labelMode === 'tooltip';\n    }\n\n    /** Hover caption via one shared tooltip — avoids N×pk-tooltip in large catalogs. */\n    private showOptionTooltip(optionId: string, label: string): void {\n        if (!this.usesTooltipLabels()) {\n            return;\n        }\n\n        // Already tracking a cell → re-anchor immediately; first hover waits so scans don’t flash.\n        const alreadyTracking = this.tooltipFor !== '';\n        this.tooltipFor = optionId;\n        this.tooltipContent = label;\n        this.clearTooltipOpenTimer();\n\n        const openNow = (): void => {\n            this.tooltipOpenTimer = null;\n            void this.updateComplete.then(() => {\n                void this.optionTooltip?.show();\n            });\n        };\n\n        if (alreadyTracking) {\n            openNow();\n            return;\n        }\n\n        this.tooltipOpenTimer = window.setTimeout(openNow, 280);\n    }\n\n    private clearOptionTooltip(): void {\n        this.clearTooltipOpenTimer();\n        this.tooltipFor = '';\n        this.tooltipContent = '';\n        void this.optionTooltip?.hide();\n    }\n\n    private clearTooltipOpenTimer(): void {\n        if (this.tooltipOpenTimer != null) {\n            window.clearTimeout(this.tooltipOpenTimer);\n            this.tooltipOpenTimer = null;\n        }\n    }\n\n    private handleOptionPointerEnter(index: number, label: string): void {\n        this.highlightedIndex = index;\n        this.showOptionTooltip(this.optionId(index), label);\n    }\n\n    private handleOptionPointerLeave = (event: MouseEvent): void => {\n        const next = event.relatedTarget;\n        const movingToNeighbor = next instanceof Node\n            && this.panelBody?.contains(next)\n            && Boolean(\n                next instanceof Element\n                    ? next.closest('.option')\n                    : next.parentElement?.closest('.option'),\n            );\n\n        if (movingToNeighbor) {\n            return;\n        }\n\n        // Leave the grid — drop sticky hover chrome back onto the selected cell (or none).\n        this.resetHighlightToSelected();\n        this.clearOptionTooltip();\n    };\n\n    private resetHighlightToSelected(): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        const selectedIdx = items.findIndex((item) => item.value === this.value);\n        this.highlightedIndex = selectedIdx;\n    }\n\n    private renderTriggerContents() {\n        const display = this.triggerDisplay();\n\n        return html`\n            <span class=\"trigger-main\">\n                ${this.renderPreview(display.preview, 'trigger-preview')}\n                <span\n                    class=${classMap({\n                        'trigger-label': true,\n                        'is-placeholder': display.isPlaceholder,\n                    })}\n                    aria-hidden=\"true\"\n                >${display.label}</span>\n            </span>\n        `;\n    }\n\n    private renderResults() {\n        if (this.loading) {\n            return html`\n                <div\n                    id=${this.listboxId}\n                    role=\"listbox\"\n                    aria-label=${this.ariaLabel || 'Options'}\n                    aria-busy=\"true\"\n                >\n                    <div part=\"loading\" class=\"loading\" role=\"status\" aria-label=\"Loading\">\n                        <pk-spinner size=\"sm\" centered></pk-spinner>\n                    </div>\n                </div>\n            `;\n        }\n\n        const groups = this.visibleGroups();\n\n        if (groups.length === 0) {\n            return html`\n                <div\n                    id=${this.listboxId}\n                    role=\"listbox\"\n                    aria-label=${this.ariaLabel || 'Options'}\n                >\n                    <p class=\"notice\" part=\"empty\" role=\"status\">${this.emptyMessage}</p>\n                </div>\n            `;\n        }\n\n        let flatIndex = 0;\n\n        return html`\n            <div\n                id=${this.listboxId}\n                role=\"listbox\"\n                aria-label=${this.ariaLabel || 'Options'}\n            >\n                ${groups.map((group, groupIndex) => {\n                    const headingId = this.groupHeadingId(groupIndex);\n                    const groupStart = flatIndex;\n\n                    const options = group.items.map((item, itemIndex) => {\n                        const index = groupStart + itemIndex;\n                        flatIndex = index + 1;\n                        const selected = item.value === this.value;\n                        const highlighted = index === this.highlightedIndex;\n\n                        return html`\n                            <button\n                                type=\"button\"\n                                part=\"option\"\n                                id=${this.optionId(index)}\n                                class=${classMap({\n                                    option: true,\n                                    'is-highlighted': highlighted,\n                                    'is-selected': selected,\n                                })}\n                                role=\"option\"\n                                tabindex=\"-1\"\n                                aria-label=${item.label}\n                                aria-selected=${selected ? 'true' : 'false'}\n                                @click=${() => this.selectValue(item.value)}\n                                @mouseenter=${() => this.handleOptionPointerEnter(index, item.label)}\n                                @mouseleave=${this.handleOptionPointerLeave}\n                            >\n                                ${this.renderPreview(item.preview, 'option-preview')}\n                                ${this.usesInlineLabels()\n                                    ? html`<span class=\"option-label\" aria-hidden=\"true\">${item.label}</span>`\n                                    : nothing}\n                            </button>\n                        `;\n                    });\n\n                    return html`\n                        <div\n                            class=\"group\"\n                            role=${group.name ? 'group' : nothing}\n                            aria-labelledby=${group.name ? headingId : nothing}\n                        >\n                            ${group.name\n                                ? html`\n                                    <h6 class=\"group-heading\" id=${headingId}>\n                                        <span>${group.name}</span>\n                                        ${group.items.length < group.total\n                                            ? html`\n                                                <span class=\"group-heading-count\">\n                                                    Showing ${group.items.length} of ${group.total}\n                                                </span>\n                                            `\n                                            : nothing}\n                                    </h6>\n                                `\n                                : nothing}\n                            <div class=\"grid\">\n                                ${options}\n                            </div>\n                        </div>\n                    `;\n                })}\n            </div>\n        `;\n    }\n\n    override render() {\n        const showClear = this.withClear && this.value !== '' && !this.disabled && !this.readonly;\n        const panelActive = this.open || this.closing;\n        const activeDescendant = this.activeDescendantId();\n\n        return html`\n            <input\n                class=\"value-input\"\n                part=\"value-input\"\n                tabindex=\"-1\"\n                aria-hidden=\"true\"\n                .value=${this.value}\n                ?required=${this.required}\n                @input=${() => this.updateValidity()}\n            />\n            <div\n                part=\"root\"\n                class=${classMap({\n                    control: true,\n                    'is-disabled': this.disabled || this.readonly,\n                    'is-open': this.open,\n                })}\n            >\n                <button\n                    type=\"button\"\n                    part=\"trigger\"\n                    class=\"trigger\"\n                    ?disabled=${this.disabled || this.readonly}\n                    aria-label=${this.triggerAccessibleName()}\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                    ${this.renderTriggerContents()}\n                </button>\n                ${showClear\n                    ? html`\n                        <button\n                            type=\"button\"\n                            part=\"clear-button\"\n                            class=\"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                <button\n                    type=\"button\"\n                    class=\"expand-button\"\n                    tabindex=\"-1\"\n                    aria-hidden=\"true\"\n                    ?disabled=${this.disabled || this.readonly}\n                    @click=${this.togglePanel}\n                >\n                    <span class=\"expand-button-icon\">${unsafeSVG(CHEVRON_ICON)}</span>\n                </button>\n            </div>\n            <pk-popup\n                .active=${panelActive}\n                .anchor=${this.controlElement ?? this.triggerElement ?? ''}\n                .placement=${this.placement}\n                .distance=${this.sideOffset}\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                    })}\n                    tabindex=\"-1\"\n                    ?hidden=${!panelActive}\n                    data-open=${this.panelAnimated && !this.closing ? '' : nothing}\n                >\n                    <div part=\"panel-search\" class=\"panel-search\">\n                        <input\n                            part=\"panel-input\"\n                            class=\"panel-input\"\n                            id=${this.searchId}\n                            type=\"text\"\n                            role=\"combobox\"\n                            .value=${this.query}\n                            placeholder=${this.searchPlaceholder}\n                            aria-label=${this.searchPlaceholder}\n                            aria-autocomplete=\"list\"\n                            aria-expanded=${this.open ? 'true' : 'false'}\n                            aria-controls=${this.listboxId}\n                            aria-activedescendant=${activeDescendant ?? nothing}\n                            ?disabled=${this.loading}\n                            @input=${this.handleSearchInput}\n                            @keydown=${this.handleSearchKeyDown}\n                        />\n                    </div>\n                    <div\n                        part=\"panel-body\"\n                        class=\"panel-body\"\n                        @scroll=${this.handleResultsScroll}\n                    >\n                        ${this.renderResults()}\n                    </div>\n                    ${this.usesTooltipLabels() && panelActive\n                        ? html`\n                            <pk-tooltip\n                                class=\"option-tooltip\"\n                                for=${this.tooltipFor}\n                                content=${this.tooltipContent}\n                                placement=\"top\"\n                                trigger=\"manual\"\n                            ></pk-tooltip>\n                        `\n                        : nothing}\n                </div>\n            </pk-popup>\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-image-browser': PkImageBrowser;\n    }\n}\n"],"mappings":"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"}
+{"version":3,"file":"pk-image-browser-Bj8LhWfk.js","names":[],"sources":["../../src/components/image-browser/pk-image-browser.styles.ts","../../src/components/image-browser/pk-image-browser.ts"],"sourcesContent":["import { css } from 'lit';\n\nimport { iconStyles } from '../../base/icon.styles.js';\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\n\n/**\n * Presentational static image / icon browser.\n * Trigger chrome mirrors combobox popup-mode; panel grid mirrors Vizy icon picker.\n */\nexport const pkImageBrowserStyles = [\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            vertical-align: top;\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-image-browser-trigger-min-height: var(--pk-btn-height-default);\n            --pk-image-browser-padding-block: 6px;\n            --pk-image-browser-padding-inline: 10px;\n            --pk-image-browser-font-size: var(--pk-font-size-base);\n            --pk-image-browser-line-height: var(--pk-input-control-line-height, 1.25rem);\n            --pk-image-browser-glyph-size: 1rem;\n            --pk-image-browser-panel-width: 26.25rem;\n            /* Hit target larger than the glyph so the select ring has breathing room. */\n            --pk-image-browser-cell-min: 2.25rem;\n            --pk-image-browser-glyph-tile: 1.375rem;\n            --pk-image-browser-fill: var(--pk-color-slate-250);\n            --pk-image-browser-fill-hover: var(--pk-color-slate-300);\n        }\n\n        /* Caption under each cell — wider tracks; glyph size stays put. */\n        :host([label-mode='inline']) {\n            --pk-image-browser-cell-min: 3.75rem;\n        }\n\n        :host([size='xs']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-xs);\n            --pk-image-browser-padding-block: 2px;\n            --pk-image-browser-padding-inline: 6px;\n            --pk-image-browser-font-size: var(--pk-font-size-xs, 0.75rem);\n            --pk-image-browser-glyph-size: 0.875rem;\n        }\n\n        :host([size='sm']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-sm);\n            --pk-image-browser-padding-block: 4px;\n            --pk-image-browser-padding-inline: 8px;\n            --pk-image-browser-font-size: var(--pk-font-size-sm, 0.8125rem);\n            --pk-image-browser-glyph-size: 0.875rem;\n        }\n\n        :host([size='lg']),\n        :host([size='xl']) {\n            --pk-image-browser-trigger-min-height: var(--pk-btn-height-lg);\n            --pk-image-browser-padding-block: 8px;\n            --pk-image-browser-padding-inline: 12px;\n            --pk-image-browser-font-size: var(--pk-font-size-lg, 1rem);\n            --pk-image-browser-glyph-size: 1.125rem;\n        }\n\n        /* Image mode — roomier photo tiles; captions still opt-in via label-mode=\"inline\". */\n        :host([mode='image']) {\n            --pk-image-browser-panel-width: 34rem;\n            --pk-image-browser-cell-min: 7.5rem;\n        }\n\n        :host([mode='image'][label-mode='inline']) {\n            /* Captions reclaim a little width; preview stays the hero. */\n            --pk-image-browser-cell-min: 6.5rem;\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        .value-input {\n            position: absolute;\n            width: 1px;\n            height: 1px;\n            margin: -1px;\n            padding: 0;\n            overflow: hidden;\n            clip: rect(0, 0, 0, 0);\n            white-space: nowrap;\n            border: 0;\n            opacity: 0;\n            pointer-events: none;\n        }\n\n        /* Combobox-style chrome: label + clear + chevron share one filled control.\n         * 0.5rem gap keeps ellipsized filenames from kissing the clear glyph. */\n        .control {\n            display: inline-flex;\n            align-items: stretch;\n            gap: 0.5rem;\n            min-width: 12.5rem;\n            max-width: 100%;\n            height: var(--pk-image-browser-trigger-min-height);\n            min-height: var(--pk-image-browser-trigger-min-height);\n            margin: 0;\n            padding: 0 0 0 var(--pk-image-browser-padding-inline);\n            border: 1px solid transparent;\n            border-radius: var(--pk-input-border-radius, var(--pk-radius-lg));\n            background: var(--pk-image-browser-fill);\n            color: inherit;\n            box-sizing: border-box;\n            overflow: hidden;\n            transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;\n        }\n\n        .control:hover:not(.is-disabled) {\n            background: var(--pk-image-browser-fill-hover);\n        }\n\n        .control.is-open:not(.is-disabled) {\n            background: var(--pk-image-browser-fill-hover);\n        }\n\n        .control: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([invalid]) .control,\n        :host(:state(user-invalid)) .control {\n            border-color: var(--pk-color-rose-500, #f43f5e);\n        }\n\n        .control.is-disabled {\n            cursor: not-allowed;\n            opacity: 0.5;\n        }\n\n        .trigger {\n            display: inline-flex;\n            align-items: center;\n            flex: 1 1 auto;\n            min-width: 0;\n            margin: 0;\n            padding: var(--pk-image-browser-padding-block) 0;\n            border: 0;\n            border-radius: 0;\n            background: transparent;\n            color: inherit;\n            font: inherit;\n            font-size: var(--pk-image-browser-font-size);\n            font-weight: 400;\n            line-height: var(--pk-image-browser-line-height);\n            text-align: left;\n            white-space: nowrap;\n            cursor: pointer;\n            outline: none;\n            box-sizing: border-box;\n        }\n\n        .trigger:disabled {\n            cursor: not-allowed;\n        }\n\n        .trigger-main {\n            display: inline-flex;\n            align-items: center;\n            gap: 0.5rem;\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        .trigger-preview {\n            display: inline-flex;\n            flex-shrink: 0;\n            align-items: center;\n            justify-content: center;\n            width: var(--pk-image-browser-glyph-size);\n            height: var(--pk-image-browser-glyph-size);\n            overflow: hidden;\n        }\n\n        .trigger-preview svg,\n        .trigger-preview img {\n            display: block;\n            width: 100%;\n            height: 100%;\n            object-fit: contain;\n        }\n\n        .trigger-preview svg {\n            fill: currentColor;\n        }\n\n        .trigger-label {\n            flex: 1 1 auto;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n\n        .trigger-label.is-placeholder {\n            color: var(--pk-color-gray-500);\n        }\n\n        .clear-button,\n        .expand-button {\n            display: inline-flex;\n            flex-shrink: 0;\n            align-items: center;\n            justify-content: center;\n            align-self: stretch;\n            box-sizing: border-box;\n            width: calc(0.75rem + 0.5rem);\n            margin: 0;\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        .expand-button {\n            width: calc(0.75rem + 0.5rem + var(--pk-image-browser-padding-inline));\n            padding-inline-end: var(--pk-image-browser-padding-inline);\n        }\n\n        .clear-button:hover:not(:disabled),\n        .expand-button:hover:not(:disabled) {\n            color: var(--pk-color-gray-800);\n        }\n\n        .clear-button:disabled,\n        .expand-button:disabled {\n            cursor: not-allowed;\n        }\n\n        .clear-button-icon,\n        .expand-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        .expand-button-icon svg {\n            display: block;\n            width: 0.75rem;\n            height: 0.75rem;\n        }\n\n        .panel {\n            position: relative;\n            box-sizing: border-box;\n            display: flex;\n            flex-direction: column;\n            width: var(--pk-image-browser-panel-width);\n            max-width: min(100vw - 1.5rem, var(--pk-image-browser-panel-width));\n            max-height: min(28.75rem, 60vh);\n            border-radius: var(--pk-radius-lg);\n            background: var(--pk-color-white);\n            box-shadow:\n                0 0 0 1px rgba(31, 41, 51, 0.1),\n                0 5px 20px rgba(31, 41, 51, 0.25);\n            overflow: hidden;\n        }\n\n        .panel[hidden] {\n            display: none !important;\n        }\n\n        .panel-search {\n            flex: none;\n            /* Same inline inset as panel-body so search + grid share one vertical edge. */\n            padding: 0.625rem 0.625rem 0.5rem;\n            border-bottom: 1px solid var(--pk-color-gray-150, rgba(51, 64, 77, 0.1));\n        }\n\n        .panel-input {\n            display: block;\n            width: 100%;\n            box-sizing: border-box;\n            margin: 0;\n            padding: 0.375rem 0.625rem;\n            border: 1px solid var(--pk-color-gray-200, #d4dce4);\n            border-radius: var(--pk-input-border-radius, var(--pk-radius-md));\n            background: var(--pk-color-white);\n            color: var(--pk-color-gray-700);\n            font: inherit;\n            font-size: var(--pk-font-size-sm, 0.8125rem);\n            line-height: 1.25rem;\n            outline: none;\n        }\n\n        .panel-input:focus {\n            border-color: var(--pk-color-sky-600);\n            box-shadow: var(--pk-input-focus-shadow);\n        }\n\n        .panel-body {\n            flex: 1 1 auto;\n            min-height: 0;\n            overflow-y: auto;\n            /* Match search field inset so the grid lines up with the input. */\n            padding: 0.5rem 0.625rem 0.625rem;\n        }\n\n        :host([mode='image']) .panel-body {\n            padding: 0.5rem 0.625rem 0.625rem;\n        }\n\n        .group + .group {\n            margin-top: 0.875rem;\n        }\n\n        .group-heading {\n            display: flex;\n            justify-content: space-between;\n            gap: 0.5rem;\n            margin: 0 0 0.375rem;\n            color: var(--pk-color-gray-500);\n            font-size: 0.6875rem;\n            font-weight: 600;\n            letter-spacing: 0.04em;\n            line-height: 1.25;\n            text-transform: uppercase;\n        }\n\n        .group-heading-count {\n            font-weight: 400;\n            letter-spacing: 0;\n            text-transform: none;\n        }\n\n        /* Fixed column width (not 1fr) so sparse catalogs stay dense instead of stretching. */\n        .grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fill, var(--pk-image-browser-cell-min));\n            gap: 0.375rem;\n            justify-content: start;\n            /* Don’t stretch short single-line cells to match taller wrapped neighbors in the row. */\n            align-items: start;\n        }\n\n        :host([mode='image']) .grid {\n            grid-template-columns: repeat(auto-fill, minmax(var(--pk-image-browser-cell-min), 1fr));\n            gap: 0.375rem;\n        }\n\n        .option {\n            box-sizing: border-box;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n            gap: 0;\n            width: var(--pk-image-browser-cell-min);\n            height: var(--pk-image-browser-cell-min);\n            margin: 0;\n            /* Square hit target; glyph is smaller so the ring doesn’t clip tips. */\n            padding: 0;\n            border: 1px solid transparent;\n            border-radius: var(--pk-radius-sm);\n            background: none;\n            color: inherit;\n            cursor: pointer;\n            outline: none;\n            overflow: hidden;\n        }\n\n        /* With captions, height hugs glyph + label instead of a fixed square. */\n        :host([label-mode='inline']) .option {\n            justify-content: flex-start;\n            gap: 0.125rem;\n            height: auto;\n            /* Keep glyph + caption inside the inset highlight ring. */\n            padding: 0.25rem 0.125rem 0.3125rem;\n        }\n\n        :host([mode='image']) .option {\n            position: relative;\n            width: auto;\n            height: auto;\n            min-height: 0;\n            gap: 0;\n            padding: 0;\n            overflow: hidden;\n            border-radius: var(--pk-radius-md);\n        }\n\n        :host([mode='image'][label-mode='inline']) .option {\n            gap: 0.375rem;\n            padding: 0.375rem 0.375rem 0.5rem;\n            overflow: visible;\n        }\n\n        .option:hover,\n        .option:focus-visible,\n        .option.is-highlighted {\n            background: var(--pk-color-gray-050, #f3f7fc);\n        }\n\n        /* Selected is the durable chrome; highlight/hover share the same ring for keyboard parity. */\n        .option.is-selected,\n        .option.is-highlighted,\n        .option:hover {\n            box-shadow: inset 0 0 0 2px var(--pk-color-sky-600);\n        }\n\n        /*\n         * Flush photo tiles paint over inset box-shadow (descendants sit above it).\n         * Overlay the same ring so tooltip/none match inline chrome.\n         */\n        :host([mode='image']) .option.is-selected,\n        :host([mode='image']) .option.is-highlighted,\n        :host([mode='image']) .option:hover {\n            box-shadow: none;\n        }\n\n        :host([mode='image']) .option.is-selected::after,\n        :host([mode='image']) .option.is-highlighted::after,\n        :host([mode='image']) .option:hover::after {\n            content: '';\n            position: absolute;\n            inset: 0;\n            z-index: 1;\n            border-radius: inherit;\n            box-shadow: inset 0 0 0 2px var(--pk-color-sky-600);\n            pointer-events: none;\n        }\n\n        .option:focus-visible {\n            outline: none;\n        }\n\n        .option-preview {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 0 0 auto;\n            width: var(--pk-image-browser-glyph-tile);\n            height: var(--pk-image-browser-glyph-tile);\n            margin: 0;\n            overflow: hidden;\n        }\n\n        :host([mode='image']) .option-preview {\n            width: 100%;\n            height: auto;\n            aspect-ratio: 4 / 3;\n            margin: 0;\n            border-radius: inherit;\n        }\n\n        .option-preview svg,\n        .option-preview img {\n            display: block;\n            width: 100%;\n            height: 100%;\n            object-fit: contain;\n        }\n\n        /* Photo tiles crop to fill — previews, not faithful aspect viewers. */\n        :host([mode='image']) .option-preview svg,\n        :host([mode='image']) .option-preview img {\n            object-fit: cover;\n        }\n\n        .option-preview svg {\n            fill: currentColor;\n        }\n\n        .option-label {\n            display: -webkit-box;\n            box-sizing: border-box;\n            width: 100%;\n            max-width: 100%;\n            padding-inline: 2px;\n            overflow: hidden;\n            color: var(--pk-color-gray-700);\n            font-size: 0.625rem;\n            line-height: 0.75rem;\n            text-align: center;\n            overflow-wrap: anywhere;\n            word-break: break-word;\n            -webkit-box-orient: vertical;\n            -webkit-line-clamp: 3;\n            line-clamp: 3;\n        }\n\n        :host([mode='image']) .option-label {\n            display: block;\n            color: var(--pk-color-gray-600);\n            font-size: 0.6875rem;\n            line-height: 1.2;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            overflow-wrap: normal;\n            word-break: normal;\n            -webkit-line-clamp: unset;\n            line-clamp: unset;\n        }\n\n        .notice {\n            margin: 0.375rem 0;\n            color: var(--pk-color-gray-500);\n            font-size: var(--pk-font-size-sm, 0.8125rem);\n        }\n\n        .notice.is-error {\n            color: var(--pk-color-rose-600, #e11d48);\n        }\n\n        /* Host-driven catalog warm — spinner only (no loading copy). */\n        .loading {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            box-sizing: border-box;\n            min-height: 6rem;\n            padding: 1.25rem 0.75rem;\n            color: var(--pk-color-gray-500);\n        }\n\n        .panel-input:disabled {\n            cursor: not-allowed;\n            opacity: 0.6;\n        }\n\n        /* Host is inert layout chrome; the floating tip lives in pk-popup. */\n        .option-tooltip {\n            position: absolute;\n            width: 0;\n            height: 0;\n            margin: 0;\n            padding: 0;\n            overflow: hidden;\n            pointer-events: none;\n        }\n    }\n    `,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { customElement, property, query, state } from '../../decorators.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 { 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 { MirrorValidator, RequiredValidator } from '../../validators/index.js';\nimport { isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport {\n    syncPopupPlacementAnimation,\n    waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\n// Keep the internal element registered when production builds erase type-only imports.\nimport '../popup/pk-popup.js';\nimport type { PkPopup, PkPopupPlacement } from '../popup/pk-popup.js';\nimport '../spinner/pk-spinner.js';\nimport '../tooltip/pk-tooltip.js';\nimport type { PkTooltip } from '../tooltip/pk-tooltip.js';\nimport { pkImageBrowserStyles } from './pk-image-browser.styles.js';\n\nexport type PkImageBrowserSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';\n\n/** Grid preview kind — compact glyphs vs larger photo tiles. */\nexport type PkImageBrowserMode = 'icon' | 'image';\n\n/**\n * How option names appear in the grid.\n * - `tooltip` (default) — shared `pk-tooltip` on hover; `aria-label` always\n * - `inline` — caption under each cell\n * - `none` — `aria-label` only (no tooltip, no caption)\n *\n * Named `labelMode` (not `labels`) to avoid clashing with the native\n * form-associated `HTMLElement.labels` NodeList getter.\n */\nexport type PkImageBrowserLabelMode = 'tooltip' | 'inline' | 'none';\n\nexport type PkImageBrowserWidth = 'auto' | 'full';\n\n/**\n * One browsable entry. Plugins own filtering / filesystem scanning and pass\n * already-resolved preview URLs or inline SVG markup.\n */\nexport type PkImageBrowserItem = {\n    value: string;\n    label: string;\n    /** Public URL for `<img>`, or inline `<svg>…</svg>` markup. */\n    preview?: string;\n};\n\nexport type PkImageBrowserGroup = {\n    name: string;\n    items: PkImageBrowserItem[];\n};\n\nconst CHEVRON_ICON = renderIconHtml(chevronDown);\nconst XMARK_ICON = renderIconHtml(xmark);\n\n/** How many matched items per group are painted before scroll reveals more. */\nconst DEFAULT_PAGE_SIZE = 96;\n\nfunction isInlineSvg(preview: string): boolean {\n    return /^\\s*<svg[\\s>]/i.test(preview);\n}\n\n/**\n * Image browser — presentational picker for static filesystem icons/images.\n *\n * Plugins supply `items` / `groups` (and optional `selected-label` /\n * `selected-preview` for the closed trigger before the catalog is ready). The\n * kit does not scan disks or filter extensions.\n *\n * Keyboard: trigger opens with Enter / Space / ArrowDown; search owns focus with\n * `aria-activedescendant`; arrows move the highlight (2D in the grid); Enter\n * selects; Escape closes.\n *\n * @csspart root - Filled control surface (trigger + clear + chevron)\n * @csspart trigger - Opens the panel (preview + label)\n * @csspart clear-button - Clear selection button (inside the control)\n * @csspart panel - Popup panel shell\n * @csspart panel-search - Search field container\n * @csspart panel-input - Search input\n * @csspart panel-body - Scrollable results region\n * @csspart loading - Catalog-loading status region (spinner)\n * @csspart option - Grid cell button\n *\n * @dependency pk-popup - Positioned panel host.\n * @dependency pk-spinner - Shown in the panel while `loading` is set.\n * @dependency pk-tooltip - Hover label when `label-mode=\"tooltip\"`.\n */\n@customElement('pk-image-browser')\nexport class PkImageBrowser extends PkFormAssociatedElement {\n    static override styles = pkImageBrowserStyles;\n\n    static override get validators() {\n        return [...super.validators, MirrorValidator(), RequiredValidator()];\n    }\n\n    override assumeInteractionOn = ['pk-change'];\n\n    @property({ reflect: true })\n    size: PkImageBrowserSize = 'default';\n\n    /** `icon` = compact glyph tiles; `image` = larger photo tiles. */\n    @property({ reflect: true })\n    mode: PkImageBrowserMode = 'icon';\n\n    @property({ reflect: true })\n    width: PkImageBrowserWidth = 'auto';\n\n    /**\n     * How option names appear in the grid: `tooltip` (default), `inline` under\n     * each cell, or `none` (`aria-label` only).\n     */\n    @property({ reflect: true, attribute: 'label-mode' })\n    labelMode: PkImageBrowserLabelMode = 'tooltip';\n\n    @property({ type: Boolean, reflect: true })\n    invalid = false;\n\n    @property({ type: Boolean, reflect: true })\n    readonly = false;\n\n    @property()\n    value = '';\n\n    @property({ attribute: 'default-value' })\n    defaultValue = '';\n\n    @property()\n    placeholder = 'Choose…';\n\n    @property({ attribute: 'search-placeholder' })\n    searchPlaceholder = 'Search…';\n\n    @property({ attribute: 'empty-message' })\n    emptyMessage = 'No items match your query.';\n\n    @property({ attribute: 'aria-label' })\n    ariaLabel: string | null = null;\n\n    /**\n     * Host-driven catalog warm / refresh. Shows a centered `pk-spinner` in the\n     * panel (no loading copy). Prefer this over inferring from empty `items` /\n     * `groups` — empty can also mean a filter miss or a genuinely empty catalog.\n     */\n    @property({ type: Boolean, reflect: true })\n    loading = false;\n\n    /** Show a clear control when a value is selected. */\n    @property({ type: Boolean, reflect: true, attribute: 'with-clear' })\n    withClear = true;\n\n    @property({ attribute: false })\n    items: PkImageBrowserItem[] = [];\n\n    @property({ attribute: false })\n    groups: PkImageBrowserGroup[] = [];\n\n    /**\n     * Closed-trigger label when `value` is set but not yet found in `items` /\n     * `groups` (e.g. catalog still loading).\n     */\n    @property({ attribute: 'selected-label' })\n    selectedLabel = '';\n\n    /** Closed-trigger preview for the same pre-catalog case as `selected-label`. */\n    @property({ attribute: 'selected-preview' })\n    selectedPreview = '';\n\n    @property({ reflect: true })\n    placement: PkPopupPlacement = 'bottom-start';\n\n    @property({ type: Number, attribute: 'side-offset' })\n    sideOffset = 4;\n\n    /** Items drawn per group before scroll reveals the next page. */\n    @property({ type: Number, attribute: 'page-size' })\n    pageSize = DEFAULT_PAGE_SIZE;\n\n    @property({ type: Boolean, reflect: true })\n    open = false;\n\n    @state()\n    private query = '';\n\n    /** Render budget shared across groups — raised by scrolling, reset on query/open. */\n    @state()\n    private limit = DEFAULT_PAGE_SIZE;\n\n    @state()\n    private closing = false;\n\n    @state()\n    private panelAnimated = false;\n\n    /** Flat index into `flatVisibleItems()` for aria-activedescendant navigation. */\n    @state()\n    private highlightedIndex = -1;\n\n    /** Shared hover tooltip target when `labelMode=\"tooltip\"`. */\n    @state()\n    private tooltipFor = '';\n\n    @state()\n    private tooltipContent = '';\n\n    @query('.value-input')\n    override input!: HTMLInputElement;\n\n    @query('.trigger')\n    private triggerElement!: HTMLButtonElement;\n\n    @query('.control')\n    private controlElement!: HTMLDivElement;\n\n    @query('pk-popup')\n    private popupElement!: PkPopup;\n\n    @query('.panel')\n    private panelElement!: HTMLDivElement;\n\n    @query('.panel-input')\n    private searchInput!: HTMLInputElement | null;\n\n    @query('.panel-body')\n    private panelBody!: HTMLDivElement | null;\n\n    @query('.option-tooltip')\n    private optionTooltip!: PkTooltip | null;\n\n    private readonly listboxId = uniqueId('pk-image-browser-listbox');\n    private readonly searchId = uniqueId('pk-image-browser-search');\n    private closeTimer: number | null = null;\n    private tooltipOpenTimer: number | null = null;\n    private liveRegion: LiveRegion | null = null;\n\n    override connectedCallback(): void {\n        super.connectedCallback();\n        this.limit = this.normalizedPageSize();\n    }\n\n    override disconnectedCallback(): void {\n        this.teardownDismissListeners();\n        this.clearCloseTimer();\n        this.clearTooltipOpenTimer();\n        this.liveRegion?.destroy();\n        this.liveRegion = null;\n        super.disconnectedCallback();\n    }\n\n    protected override willUpdate(changed: PropertyValues): void {\n        if (changed.has('pageSize') && !this.open) {\n            this.limit = this.normalizedPageSize();\n        }\n\n        super.willUpdate(changed);\n    }\n\n    override updated(changed: PropertyValues): void {\n        super.updated(changed);\n\n        if (changed.has('open')) {\n            if (this.open) {\n                this.attachDismissListeners();\n            } else if (!this.closing) {\n                this.teardownDismissListeners();\n            }\n        }\n\n        if ((changed.has('open') || changed.has('closing')) && (this.open || this.closing)) {\n            void this.syncPanelPlacement();\n        }\n\n        if (this.open && (changed.has('highlightedIndex') || changed.has('query') || changed.has('limit'))) {\n            this.scrollHighlightedIntoView();\n        }\n\n        // Catalog arrived while the panel is open — restore the selected cell when available.\n        if (this.open && changed.has('loading') && !this.loading) {\n            this.resetHighlightForOpenCatalog();\n        }\n    }\n\n    protected override get validationTarget(): HTMLElement {\n        return this.triggerElement ?? this;\n    }\n\n    protected override syncFormValue(): void {\n        this.setFormValue(this.value, 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    async show(): Promise<void> {\n        if (this.open || this.closing || this.disabled || this.readonly) {\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 optionId(index: number): string {\n        return `${this.listboxId}-opt-${index}`;\n    }\n\n    private groupHeadingId(groupIndex: number): string {\n        return `${this.listboxId}-group-${groupIndex}`;\n    }\n\n    private normalizedPageSize(): number {\n        return this.pageSize > 0 ? this.pageSize : DEFAULT_PAGE_SIZE;\n    }\n\n    private resolveGroups(): PkImageBrowserGroup[] {\n        if (this.groups.length > 0) {\n            return this.groups;\n        }\n\n        if (this.items.length > 0) {\n            return [{ name: '', items: this.items }];\n        }\n\n        return [];\n    }\n\n    private findItem(value: string): PkImageBrowserItem | null {\n        if (value === '') {\n            return null;\n        }\n\n        for (const group of this.resolveGroups()) {\n            const found = group.items.find((item) => item.value === value);\n            if (found) {\n                return found;\n            }\n        }\n\n        return null;\n    }\n\n    private selectedItem(): PkImageBrowserItem | null {\n        return this.findItem(this.value);\n    }\n\n    private triggerDisplay(): { label: string; preview?: string; isPlaceholder: boolean } {\n        const selected = this.selectedItem();\n        if (selected) {\n            return {\n                label: selected.label,\n                preview: selected.preview,\n                isPlaceholder: false,\n            };\n        }\n\n        if (this.value !== '') {\n            return {\n                label: this.selectedLabel || this.value,\n                preview: this.selectedPreview || undefined,\n                isPlaceholder: false,\n            };\n        }\n\n        return {\n            label: this.placeholder,\n            isPlaceholder: true,\n        };\n    }\n\n    /** Groups matching the query, each truncated to the current render budget. */\n    private visibleGroups(): Array<PkImageBrowserGroup & { total: number }> {\n        const query = this.query.trim().toLowerCase();\n\n        return this.resolveGroups().reduce<Array<PkImageBrowserGroup & { total: number }>>((acc, group) => {\n            const matched = query === ''\n                ? group.items\n                : group.items.filter((item) => (\n                    item.label.toLowerCase().includes(query)\n                    || item.value.toLowerCase().includes(query)\n                ));\n\n            if (matched.length === 0) {\n                return acc;\n            }\n\n            acc.push({\n                name: group.name,\n                total: matched.length,\n                items: matched.slice(0, this.limit),\n            });\n            return acc;\n        }, []);\n    }\n\n    private flatVisibleItems(): PkImageBrowserItem[] {\n        return this.visibleGroups().flatMap((group) => group.items);\n    }\n\n    private isTruncated(): boolean {\n        return this.visibleGroups().some((group) => group.items.length < group.total);\n    }\n\n    private activeDescendantId(): string | null {\n        if (!this.open || this.highlightedIndex < 0) {\n            return null;\n        }\n\n        return this.optionId(this.highlightedIndex);\n    }\n\n    private triggerAccessibleName(): string {\n        if (this.ariaLabel) {\n            const display = this.triggerDisplay();\n            if (display.isPlaceholder) {\n                return this.ariaLabel;\n            }\n            return `${this.ariaLabel}, ${display.label}`;\n        }\n\n        return this.triggerDisplay().label;\n    }\n\n    private announceResults(): void {\n        // Skip while the host is still warming — empty would read as \"no matches\".\n        if (this.loading) {\n            return;\n        }\n\n        const items = this.flatVisibleItems();\n        const filter = this.query.trim();\n\n        if (!filter) {\n            return;\n        }\n\n        if (!this.liveRegion) {\n            this.liveRegion = new LiveRegion('polite');\n        }\n\n        this.liveRegion.announce(\n            items.length === 0\n                ? this.emptyMessage\n                : `${items.length} ${items.length === 1 ? 'result' : 'results'} available`,\n        );\n    }\n\n    private resetHighlightForOpenCatalog(): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        this.highlightedIndex = items.findIndex((item) => item.value === this.value);\n    }\n\n    private setHighlightedIndex(index: number): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        const next = Math.max(0, Math.min(index, items.length - 1));\n        this.highlightedIndex = next;\n\n        // Navigating near the end of a truncated catalog should reveal more, same as scroll.\n        if (next >= items.length - 4 && this.isTruncated()) {\n            this.limit += this.normalizedPageSize();\n        }\n    }\n\n    private scrollHighlightedIntoView(): void {\n        if (this.highlightedIndex < 0 || !this.panelBody) {\n            return;\n        }\n\n        const option = this.renderRoot.querySelector<HTMLElement>(\n            `#${CSS.escape(this.optionId(this.highlightedIndex))}`,\n        );\n        if (!option) {\n            return;\n        }\n\n        scrollIntoView(option, this.panelBody, 'vertical', 'auto');\n    }\n\n    /** Column count of the CSS grid that owns the highlighted option (for 2D arrows). */\n    private columnCountNear(index: number): number {\n        const option = this.renderRoot.querySelector<HTMLElement>(\n            `#${CSS.escape(this.optionId(index))}`,\n        );\n        const grid = option?.closest('.grid');\n        if (!grid) {\n            return 1;\n        }\n\n        const options = [...grid.querySelectorAll<HTMLElement>('.option')];\n        if (options.length === 0) {\n            return 1;\n        }\n\n        const firstTop = options[0]!.offsetTop;\n        let cols = 0;\n        for (const candidate of options) {\n            if (candidate.offsetTop !== firstTop) {\n                break;\n            }\n            cols += 1;\n        }\n\n        return Math.max(1, cols);\n    }\n\n    private moveHighlight(key: string): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        let next = this.highlightedIndex;\n\n        if (next < 0) {\n            next = (key === 'ArrowUp' || key === 'ArrowLeft' || key === 'End')\n                ? items.length - 1\n                : 0;\n            this.setHighlightedIndex(next);\n            return;\n        }\n\n        const cols = this.columnCountNear(next);\n\n        switch (key) {\n            case 'ArrowRight':\n                next = Math.min(next + 1, items.length - 1);\n                break;\n            case 'ArrowLeft':\n                next = Math.max(next - 1, 0);\n                break;\n            case 'ArrowDown':\n                next = Math.min(next + cols, items.length - 1);\n                break;\n            case 'ArrowUp':\n                next = Math.max(next - cols, 0);\n                break;\n            case 'Home':\n                next = 0;\n                break;\n            case 'End':\n                next = items.length - 1;\n                break;\n            default:\n                return;\n        }\n\n        this.setHighlightedIndex(next);\n    }\n\n    private emitChange(next: string): void {\n        this.value = next;\n        this.syncFormValue();\n        this.updateValidity();\n\n        this.dispatchEvent(new CustomEvent('pk-change', {\n            detail: { value: next },\n            bubbles: true,\n            composed: true,\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 selectValue(next: string): void {\n        if (this.disabled || this.readonly) {\n            return;\n        }\n\n        const previous = this.value;\n        void this.closePanel('api');\n        this.query = '';\n        this.limit = this.normalizedPageSize();\n        this.highlightedIndex = -1;\n\n        // Re-clicking the active option clears it (same as the trigger clear control).\n        if (previous === next) {\n            if (this.withClear && previous !== '') {\n                this.emitChange('');\n                this.dispatchEvent(new PkClearEvent());\n            }\n            return;\n        }\n\n        this.emitChange(next);\n    }\n\n    private handleClear = (event: Event): void => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this.disabled || this.readonly || this.value === '') {\n            return;\n        }\n\n        this.emitChange('');\n        this.dispatchEvent(new PkClearEvent());\n        this.triggerElement?.focus({ preventScroll: true });\n    };\n\n    private togglePanel = (event?: Event): void => {\n        event?.preventDefault();\n        event?.stopPropagation();\n\n        if (this.disabled || this.readonly) {\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    private handleTriggerKeyDown = (event: KeyboardEvent): void => {\n        if (this.disabled || this.readonly) {\n            return;\n        }\n\n        if (\n            event.key === 'ArrowDown'\n            || event.key === 'ArrowUp'\n            || event.key === 'Enter'\n            || event.key === ' '\n        ) {\n            event.preventDefault();\n            if (!this.open && !this.closing) {\n                void this.openPanel();\n            }\n        }\n    };\n\n    private async openPanel(): Promise<void> {\n        if (this.open || this.closing || this.disabled || this.readonly) {\n            return;\n        }\n\n        this.dispatchEvent(new PkShowEvent());\n        this.closing = false;\n        this.panelAnimated = false;\n        this.query = '';\n        this.limit = this.normalizedPageSize();\n        this.open = true;\n        this.resetHighlightForOpenCatalog();\n\n        await this.updateComplete;\n        await this.syncPanelPlacement();\n        this.panelAnimated = true;\n        this.dispatchEvent(new PkAfterShowEvent());\n        await this.focusSearchWhenReady();\n        this.scrollHighlightedIntoView();\n    }\n\n    private async closePanel(source: PkOverlaySource): Promise<void> {\n        if (!this.open || this.closing) {\n            return;\n        }\n\n        const hideEvent = new PkHideEvent(source);\n        this.dispatchEvent(hideEvent);\n        if (hideEvent.defaultPrevented) {\n            return;\n        }\n\n        this.closing = true;\n        this.open = false;\n        this.highlightedIndex = -1;\n        this.clearOptionTooltip();\n        this.teardownDismissListeners();\n        this.triggerElement?.focus({ preventScroll: true });\n\n        this.clearCloseTimer();\n        this.closeTimer = window.setTimeout(() => {\n            this.closing = false;\n            this.panelAnimated = false;\n            this.query = '';\n            this.limit = this.normalizedPageSize();\n            this.closeTimer = null;\n            this.dispatchEvent(new PkAfterHideEvent());\n        }, 100);\n    }\n\n    private clearCloseTimer(): void {\n        if (this.closeTimer != null) {\n            window.clearTimeout(this.closeTimer);\n            this.closeTimer = null;\n        }\n    }\n\n    private async syncPanelPlacement(): Promise<void> {\n        if (!this.popupElement || !this.panelElement) {\n            return;\n        }\n\n        syncPopupPlacementAnimation(this.panelElement, this.placement);\n        const placement = await waitForPopupReposition(this.popupElement, this.placement, 300, {\n            requireEvent: true,\n        });\n        syncPopupPlacementAnimation(this.panelElement, placement);\n    }\n\n    private attachDismissListeners(): void {\n        registerDismissible(this);\n        document.addEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.addEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private teardownDismissListeners(): void {\n        unregisterDismissible(this);\n        document.removeEventListener('pointerdown', this.onDocumentPointerDown, true);\n        document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n\n    private onDocumentPointerDown = (event: PointerEvent): void => {\n        if (!this.open || this.closing || !isTopDismissible(this)) {\n            return;\n        }\n\n        if (isPointerInsideOverlay(event, {\n            host: this,\n            anchor: this.controlElement ?? this.triggerElement,\n            panel: this.panelElement,\n        })) {\n            return;\n        }\n\n        void this.closePanel('pointer-dismiss');\n    };\n\n    private onDocumentKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open || this.closing || !isTopDismissible(this)) {\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            event.preventDefault();\n            event.stopPropagation();\n            void this.closePanel('escape');\n        }\n    };\n\n    private handleSearchInput = (event: Event): void => {\n        if (this.loading) {\n            return;\n        }\n\n        this.query = (event.target as HTMLInputElement).value;\n        // New query = new set; don't keep a tall scroll budget from the previous browse.\n        this.limit = this.normalizedPageSize();\n        this.resetHighlightForOpenCatalog();\n        this.announceResults();\n    };\n\n    private handleSearchKeyDown = (event: KeyboardEvent): void => {\n        if (!this.open || this.closing || this.loading) {\n            return;\n        }\n\n        switch (event.key) {\n            case 'ArrowDown':\n            case 'ArrowUp':\n            case 'ArrowLeft':\n            case 'ArrowRight':\n            case 'Home':\n            case 'End':\n                event.preventDefault();\n                event.stopPropagation();\n                this.moveHighlight(event.key);\n                return;\n            case 'Enter': {\n                event.preventDefault();\n                event.stopPropagation();\n                const items = this.flatVisibleItems();\n                const item = items[this.highlightedIndex];\n                if (item) {\n                    this.selectValue(item.value);\n                }\n                return;\n            }\n            default:\n                break;\n        }\n    };\n\n    private handleResultsScroll = (): void => {\n        // Tip can trail a scrolled-away cell; drop it and let hover re-open.\n        this.clearOptionTooltip();\n\n        const results = this.panelBody;\n        if (!results || !this.isTruncated()) {\n            return;\n        }\n\n        if (results.scrollTop + results.clientHeight < results.scrollHeight - 200) {\n            return;\n        }\n\n        const anchor = results.scrollTop;\n        this.limit += this.normalizedPageSize();\n        void this.updateComplete.then(() => {\n            if (this.panelBody) {\n                this.panelBody.scrollTop = anchor;\n            }\n        });\n    };\n\n    private async focusSearchWhenReady(): Promise<void> {\n        const started = performance.now();\n        while (this.open && performance.now() - started < 2000) {\n            const input = this.searchInput;\n            if (input && getComputedStyle(input).visibility !== 'hidden') {\n                input.focus({ preventScroll: true });\n                if (document.activeElement === input) {\n                    return;\n                }\n            }\n            await new Promise<void>((resolve) => requestAnimationFrame(() => resolve()));\n        }\n    }\n\n    private renderPreview(preview: string | undefined, className: string) {\n        if (!preview) {\n            return nothing;\n        }\n\n        if (isInlineSvg(preview)) {\n            return html`<span class=${className} aria-hidden=\"true\">${unsafeSVG(preview)}</span>`;\n        }\n\n        return html`<img class=${className} src=${preview} alt=\"\" />`;\n    }\n\n    private usesInlineLabels(): boolean {\n        return this.labelMode === 'inline';\n    }\n\n    private usesTooltipLabels(): boolean {\n        return this.labelMode === 'tooltip';\n    }\n\n    /** Hover caption via one shared tooltip — avoids N×pk-tooltip in large catalogs. */\n    private showOptionTooltip(optionId: string, label: string): void {\n        if (!this.usesTooltipLabels()) {\n            return;\n        }\n\n        // Already tracking a cell → re-anchor immediately; first hover waits so scans don’t flash.\n        const alreadyTracking = this.tooltipFor !== '';\n        this.tooltipFor = optionId;\n        this.tooltipContent = label;\n        this.clearTooltipOpenTimer();\n\n        const openNow = (): void => {\n            this.tooltipOpenTimer = null;\n            void this.updateComplete.then(() => {\n                void this.optionTooltip?.show();\n            });\n        };\n\n        if (alreadyTracking) {\n            openNow();\n            return;\n        }\n\n        this.tooltipOpenTimer = window.setTimeout(openNow, 280);\n    }\n\n    private clearOptionTooltip(): void {\n        this.clearTooltipOpenTimer();\n        this.tooltipFor = '';\n        this.tooltipContent = '';\n        void this.optionTooltip?.hide();\n    }\n\n    private clearTooltipOpenTimer(): void {\n        if (this.tooltipOpenTimer != null) {\n            window.clearTimeout(this.tooltipOpenTimer);\n            this.tooltipOpenTimer = null;\n        }\n    }\n\n    private handleOptionPointerEnter(index: number, label: string): void {\n        this.highlightedIndex = index;\n        this.showOptionTooltip(this.optionId(index), label);\n    }\n\n    private handleOptionPointerLeave = (event: MouseEvent): void => {\n        const next = event.relatedTarget;\n        const movingToNeighbor = next instanceof Node\n            && this.panelBody?.contains(next)\n            && Boolean(\n                next instanceof Element\n                    ? next.closest('.option')\n                    : next.parentElement?.closest('.option'),\n            );\n\n        if (movingToNeighbor) {\n            return;\n        }\n\n        // Leave the grid — drop sticky hover chrome back onto the selected cell (or none).\n        this.resetHighlightToSelected();\n        this.clearOptionTooltip();\n    };\n\n    private resetHighlightToSelected(): void {\n        const items = this.flatVisibleItems();\n        if (items.length === 0) {\n            this.highlightedIndex = -1;\n            return;\n        }\n\n        const selectedIdx = items.findIndex((item) => item.value === this.value);\n        this.highlightedIndex = selectedIdx;\n    }\n\n    private renderTriggerContents() {\n        const display = this.triggerDisplay();\n\n        return html`\n            <span class=\"trigger-main\">\n                ${this.renderPreview(display.preview, 'trigger-preview')}\n                <span\n                    class=${classMap({\n                        'trigger-label': true,\n                        'is-placeholder': display.isPlaceholder,\n                    })}\n                    aria-hidden=\"true\"\n                >${display.label}</span>\n            </span>\n        `;\n    }\n\n    private renderResults() {\n        if (this.loading) {\n            return html`\n                <div\n                    id=${this.listboxId}\n                    role=\"listbox\"\n                    aria-label=${this.ariaLabel || 'Options'}\n                    aria-busy=\"true\"\n                >\n                    <div part=\"loading\" class=\"loading\" role=\"status\" aria-label=\"Loading\">\n                        <pk-spinner size=\"sm\" centered></pk-spinner>\n                    </div>\n                </div>\n            `;\n        }\n\n        const groups = this.visibleGroups();\n\n        if (groups.length === 0) {\n            return html`\n                <div\n                    id=${this.listboxId}\n                    role=\"listbox\"\n                    aria-label=${this.ariaLabel || 'Options'}\n                >\n                    <p class=\"notice\" part=\"empty\" role=\"status\">${this.emptyMessage}</p>\n                </div>\n            `;\n        }\n\n        let flatIndex = 0;\n\n        return html`\n            <div\n                id=${this.listboxId}\n                role=\"listbox\"\n                aria-label=${this.ariaLabel || 'Options'}\n            >\n                ${groups.map((group, groupIndex) => {\n                    const headingId = this.groupHeadingId(groupIndex);\n                    const groupStart = flatIndex;\n\n                    const options = group.items.map((item, itemIndex) => {\n                        const index = groupStart + itemIndex;\n                        flatIndex = index + 1;\n                        const selected = item.value === this.value;\n                        const highlighted = index === this.highlightedIndex;\n\n                        return html`\n                            <button\n                                type=\"button\"\n                                part=\"option\"\n                                id=${this.optionId(index)}\n                                class=${classMap({\n                                    option: true,\n                                    'is-highlighted': highlighted,\n                                    'is-selected': selected,\n                                })}\n                                role=\"option\"\n                                tabindex=\"-1\"\n                                aria-label=${item.label}\n                                aria-selected=${selected ? 'true' : 'false'}\n                                @click=${() => this.selectValue(item.value)}\n                                @mouseenter=${() => this.handleOptionPointerEnter(index, item.label)}\n                                @mouseleave=${this.handleOptionPointerLeave}\n                            >\n                                ${this.renderPreview(item.preview, 'option-preview')}\n                                ${this.usesInlineLabels()\n                                    ? html`<span class=\"option-label\" aria-hidden=\"true\">${item.label}</span>`\n                                    : nothing}\n                            </button>\n                        `;\n                    });\n\n                    return html`\n                        <div\n                            class=\"group\"\n                            role=${group.name ? 'group' : nothing}\n                            aria-labelledby=${group.name ? headingId : nothing}\n                        >\n                            ${group.name\n                                ? html`\n                                    <h6 class=\"group-heading\" id=${headingId}>\n                                        <span>${group.name}</span>\n                                        ${group.items.length < group.total\n                                            ? html`\n                                                <span class=\"group-heading-count\">\n                                                    Showing ${group.items.length} of ${group.total}\n                                                </span>\n                                            `\n                                            : nothing}\n                                    </h6>\n                                `\n                                : nothing}\n                            <div class=\"grid\">\n                                ${options}\n                            </div>\n                        </div>\n                    `;\n                })}\n            </div>\n        `;\n    }\n\n    override render() {\n        const showClear = this.withClear && this.value !== '' && !this.disabled && !this.readonly;\n        const panelActive = this.open || this.closing;\n        const activeDescendant = this.activeDescendantId();\n\n        return html`\n            <input\n                class=\"value-input\"\n                part=\"value-input\"\n                tabindex=\"-1\"\n                aria-hidden=\"true\"\n                .value=${this.value}\n                ?required=${this.required}\n                @input=${() => this.updateValidity()}\n            />\n            <div\n                part=\"root\"\n                class=${classMap({\n                    control: true,\n                    'is-disabled': this.disabled || this.readonly,\n                    'is-open': this.open,\n                })}\n            >\n                <button\n                    type=\"button\"\n                    part=\"trigger\"\n                    class=\"trigger\"\n                    ?disabled=${this.disabled || this.readonly}\n                    aria-label=${this.triggerAccessibleName()}\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                    ${this.renderTriggerContents()}\n                </button>\n                ${showClear\n                    ? html`\n                        <button\n                            type=\"button\"\n                            part=\"clear-button\"\n                            class=\"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                <button\n                    type=\"button\"\n                    class=\"expand-button\"\n                    tabindex=\"-1\"\n                    aria-hidden=\"true\"\n                    ?disabled=${this.disabled || this.readonly}\n                    @click=${this.togglePanel}\n                >\n                    <span class=\"expand-button-icon\">${unsafeSVG(CHEVRON_ICON)}</span>\n                </button>\n            </div>\n            <pk-popup\n                .active=${panelActive}\n                .anchor=${this.controlElement ?? this.triggerElement ?? ''}\n                .placement=${this.placement}\n                .distance=${this.sideOffset}\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                    })}\n                    tabindex=\"-1\"\n                    ?hidden=${!panelActive}\n                    data-open=${this.panelAnimated && !this.closing ? '' : nothing}\n                >\n                    <div part=\"panel-search\" class=\"panel-search\">\n                        <input\n                            part=\"panel-input\"\n                            class=\"panel-input\"\n                            id=${this.searchId}\n                            type=\"text\"\n                            role=\"combobox\"\n                            .value=${this.query}\n                            placeholder=${this.searchPlaceholder}\n                            aria-label=${this.searchPlaceholder}\n                            aria-autocomplete=\"list\"\n                            aria-expanded=${this.open ? 'true' : 'false'}\n                            aria-controls=${this.listboxId}\n                            aria-activedescendant=${activeDescendant ?? nothing}\n                            ?disabled=${this.loading}\n                            @input=${this.handleSearchInput}\n                            @keydown=${this.handleSearchKeyDown}\n                        />\n                    </div>\n                    <div\n                        part=\"panel-body\"\n                        class=\"panel-body\"\n                        @scroll=${this.handleResultsScroll}\n                    >\n                        ${this.renderResults()}\n                    </div>\n                    ${this.usesTooltipLabels() && panelActive\n                        ? html`\n                            <pk-tooltip\n                                class=\"option-tooltip\"\n                                for=${this.tooltipFor}\n                                content=${this.tooltipContent}\n                                placement=\"top\"\n                                trigger=\"manual\"\n                            ></pk-tooltip>\n                        `\n                        : nothing}\n                </div>\n            </pk-popup>\n        `;\n    }\n}\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'pk-image-browser': PkImageBrowser;\n    }\n}\n"],"mappings":"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"}

package/dist/chunks/{pk-input-CF_icEtR.js → pk-input-BywmK5n2.js}

@@ -1,7 +1,7 @@
 import { a as query, i as property, o as state, s as customElement, t as __decorate } from "./decorate-R0X811qp.js";
 import { n as buttonGroupCornerRadiusStyles, r as buttonGroupCornerRoleStyles, t as buttonGroupBorderJoinStyles } from "./button-group-item.styles-DYmBR28a.js";
 import { n as syncStandaloneControlAria } from "./control-aria-B2QMq4ji.js";
-import { t as PkFormAssociatedElement } from "./pk-form-associated-element-CCQALRGB.js";
+import { t as PkFormAssociatedElement } from "./pk-form-associated-element-GxX5lbnk.js";
 import { t as MirrorValidator } from "./mirror-validator-DCjNYrrx.js";
 import { t as RequiredValidator } from "./required-validator-CEg8dvjS.js";
 import { t as HasSlotController } from "./has-slot-8BvCt_qo.js";
@@ -765,4 +765,4 @@ PkInput = __decorate([customElement("pk-input")], PkInput);
 //#endregion
 export { PkInput as t };
 
-//# sourceMappingURL=pk-input-CF_icEtR.js.map
+//# sourceMappingURL=pk-input-BywmK5n2.js.map