npm - @verbb/plugin-kit-web - Versions diffs - 2.0.15 → 2.0.16 - Mend

@verbb/plugin-kit-web 2.0.15 → 2.0.16

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

Files changed (353) hide show

package/dist/chunks/{pk-input-group-input-mllffsjQ.js.map → pk-input-group-input-oNnqMBGU.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-input-group-input-~~mllffsjQ~~.js","names":[],"sources":["../../src/components/input-group/pk-input-group-input.styles.ts","../../src/components/input-group/pk-input-group-input.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupInputStyles = css`\n @layer pk-component {\n :host {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n align-self: stretch;\n }\n\n .input {\n display: block;\n width: 100%;\n min-width: 0;\n margin: 0;\n padding: 6px 8px;\n border: 0;\n border-radius: 0;\n background: transparent;\n color: var(--pk-color-gray-700);\n font: inherit;\n line-height: 1.4;\n appearance: none;\n box-sizing: border-box;\n box-shadow: none;\n outline: none;\n }\n\n .input::placeholder {\n color: var(--pk-input-placeholder-color, var(--pk-color-gray-400));\n }\n\n .input:disabled {\n cursor: not-allowed;\n }\n\n :host([size='xs']) .input {\n padding: 4px 6px;\n font-size: 11px;\n }\n\n :host([size='sm']) .input {\n padding: 4px 8px;\n font-size: 12px;\n }\n\n :host([size='lg']) .input {\n padding: 8px 12px;\n font-size: var(--pk-font-size-base);\n }\n\n :host([size='xl']) .input {\n padding: 10px 16px;\n font-size: 16px;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupInputStyles } from './pk-input-group-input.styles.js';\n\nexport type PkInputGroupInputSize = 'xs' \| 'sm' \| 'default' \| 'lg' \| 'xl';\n\n/*\n Borderless input for use inside `pk-input-group`.\n \n @csspart input - Native input element\n */\n@customElement('pk-input-group-input')\nexport class PkInputGroupInput extends PkElement {\n static override styles = pkInputGroupInputStyles;\n\n @query('.input')\n inputElement!: HTMLInputElement;\n\n @property({ reflect: true })\n type = 'text';\n\n @property({ reflect: true })\n size: PkInputGroupInputSize = 'default';\n\n @property()\n placeholder = '';\n\n @property({ attribute: 'value', reflect: true })\n value = '';\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n readonly = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property()\n autocomplete?: string;\n\n focus(options?: FocusOptions): void {\n this.inputElement?.focus(options);\n }\n\n override render() {\n return html`\n <input\n part=\"input\"\n class=\"input\"\n data-slot=\"input-group-control\"\n type=${this.type}\n .value=${this.value}\n placeholder=${this.placeholder}\n autocomplete=${ifDefined(this.autocomplete)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @input=${this.handleInput}\n />\n `;\n }\n\n private handleInput(event: Event): void {\n const target = event.target as HTMLInputElement;\n this.value = target.value;\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-input': PkInputGroupInput;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,0BAA0B,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACanC,IAAA,oBAAA,MAAM,0BAA0B,UAAU;;;cAOtC;cAGuB;qBAGhB;eAGN;kBAGG;kBAGA;iBAGD;;;gBAxBe;;CA6BzB,MAAM,SAA8B;AAChC,OAAK,cAAc,MAAM,QAAQ;;CAGrC,SAAkB;AACd,SAAO,IAAI;;;;;uBAKI,KAAK,KAAK;yBACR,KAAK,MAAM;8BACN,KAAK,YAAY;+BAChB,UAAU,KAAK,aAAa,CAAC;4BAChC,KAAK,SAAS;4BACd,KAAK,SAAS;+BACX,KAAK,UAAU,SAAS,QAAQ;yBACtC,KAAK,YAAY;;;;CAKtC,YAAoB,OAAoB;EACpC,MAAM,SAAS,MAAM;AACrB,OAAK,QAAQ,OAAO;AACpB,OAAK,cAAc,IAAI,MAAM,SAAS;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;AACzE,OAAK,cAAc,IAAI,MAAM,UAAU;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;;;YArD7E,MAAM,SAAS,CAAA,EAAA,kBAAA,WAAA,gBAAA,KAAA,EAAA;YAGf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,UAAU,CAAA,EAAA,kBAAA,WAAA,eAAA,KAAA,EAAA;YAGV,SAAS;CAAE,WAAW;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,SAAA,KAAA,EAAA;YAG/C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,UAAU,CAAA,EAAA,kBAAA,WAAA,gBAAA,KAAA,EAAA;gCA5Bd,cAAc,uBAAuB,CAAA,EAAA,kBAAA"}
1	+ {"version":3,"file":"pk-input-group-input-oNnqMBGU.js","names":[],"sources":["../../src/components/input-group/pk-input-group-input.styles.ts","../../src/components/input-group/pk-input-group-input.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupInputStyles = css`\n @layer pk-component {\n :host {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n align-self: stretch;\n }\n\n .input {\n display: block;\n width: 100%;\n min-width: 0;\n margin: 0;\n padding: 6px 8px;\n border: 0;\n border-radius: 0;\n background: transparent;\n color: var(--pk-color-gray-700);\n font: inherit;\n line-height: 1.4;\n appearance: none;\n box-sizing: border-box;\n box-shadow: none;\n outline: none;\n }\n\n .input::placeholder {\n color: var(--pk-input-placeholder-color, var(--pk-color-gray-400));\n }\n\n .input:disabled {\n cursor: not-allowed;\n }\n\n :host([size='xs']) .input {\n padding: 4px 6px;\n font-size: 11px;\n }\n\n :host([size='sm']) .input {\n padding: 4px 8px;\n font-size: 12px;\n }\n\n :host([size='lg']) .input {\n padding: 8px 12px;\n font-size: var(--pk-font-size-base);\n }\n\n :host([size='xl']) .input {\n padding: 10px 16px;\n font-size: 16px;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupInputStyles } from './pk-input-group-input.styles.js';\n\nexport type PkInputGroupInputSize = 'xs' \| 'sm' \| 'default' \| 'lg' \| 'xl';\n\n/*\n Borderless input for use inside `pk-input-group`.\n \n @csspart input - Native input element\n */\n@customElement('pk-input-group-input')\nexport class PkInputGroupInput extends PkElement {\n static override styles = pkInputGroupInputStyles;\n\n @query('.input')\n inputElement!: HTMLInputElement;\n\n @property({ reflect: true })\n type = 'text';\n\n @property({ reflect: true })\n size: PkInputGroupInputSize = 'default';\n\n @property()\n placeholder = '';\n\n @property({ attribute: 'value', reflect: true })\n value = '';\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n readonly = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property()\n autocomplete?: string;\n\n focus(options?: FocusOptions): void {\n this.inputElement?.focus(options);\n }\n\n override render() {\n return html`\n <input\n part=\"input\"\n class=\"input\"\n data-slot=\"input-group-control\"\n type=${this.type}\n .value=${this.value}\n placeholder=${this.placeholder}\n autocomplete=${ifDefined(this.autocomplete)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @input=${this.handleInput}\n />\n `;\n }\n\n private handleInput(event: Event): void {\n const target = event.target as HTMLInputElement;\n this.value = target.value;\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-input': PkInputGroupInput;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,0BAA0B,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACanC,IAAA,oBAAA,MAAM,0BAA0B,UAAU;;;cAOtC;cAGuB;qBAGhB;eAGN;kBAGG;kBAGA;iBAGD;;;gBAxBe;;CA6BzB,MAAM,SAA8B;AAChC,OAAK,cAAc,MAAM,QAAQ;;CAGrC,SAAkB;AACd,SAAO,IAAI;;;;;uBAKI,KAAK,KAAK;yBACR,KAAK,MAAM;8BACN,KAAK,YAAY;+BAChB,UAAU,KAAK,aAAa,CAAC;4BAChC,KAAK,SAAS;4BACd,KAAK,SAAS;+BACX,KAAK,UAAU,SAAS,QAAQ;yBACtC,KAAK,YAAY;;;;CAKtC,YAAoB,OAAoB;EACpC,MAAM,SAAS,MAAM;AACrB,OAAK,QAAQ,OAAO;AACpB,OAAK,cAAc,IAAI,MAAM,SAAS;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;AACzE,OAAK,cAAc,IAAI,MAAM,UAAU;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;;;YArD7E,MAAM,SAAS,CAAA,EAAA,kBAAA,WAAA,gBAAA,KAAA,EAAA;YAGf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,UAAU,CAAA,EAAA,kBAAA,WAAA,eAAA,KAAA,EAAA;YAGV,SAAS;CAAE,WAAW;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,SAAA,KAAA,EAAA;YAG/C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,UAAU,CAAA,EAAA,kBAAA,WAAA,gBAAA,KAAA,EAAA;gCA5Bd,cAAc,uBAAuB,CAAA,EAAA,kBAAA"}

package/dist/chunks/{pk-input-group-text-DvaPJvh2.js → pk-input-group-text-HUxlXROB.js} RENAMED Viewed

@@ -36,4 +36,4 @@ PkInputGroupText = __decorate([customElement("pk-input-group-text")], PkInputGro
 //#endregion
 export { PkInputGroupText as t };
-//# sourceMappingURL=pk-input-group-text-DvaPJvh2.js.map
+//# sourceMappingURL=pk-input-group-text-HUxlXROB.js.map

package/dist/chunks/{pk-input-group-text-DvaPJvh2.js.map → pk-input-group-text-HUxlXROB.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-input-group-text-~~DvaPJvh2~~.js","names":[],"sources":["../../src/components/input-group/pk-input-group-text.styles.ts","../../src/components/input-group/pk-input-group-text.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupTextStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n font-size: var(--pk-font-size-sm);\n color: var(--pk-color-gray-500);\n }\n\n .text ::slotted(svg) {\n width: 0.75rem;\n height: 0.75rem;\n pointer-events: none;\n }\n }\n`;\n","import { html } from 'lit';\nimport { customElement } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupTextStyles } from './pk-input-group-text.styles.js';\n\n/*\n Muted label text inside an input-group addon.\n \n @slot - Text content\n \n @csspart base - Text container\n */\n@customElement('pk-input-group-text')\nexport class PkInputGroupText extends PkElement {\n static override styles = pkInputGroupTextStyles;\n\n override render() {\n return html`\n <span part=\"base\" class=\"text\">\n <slot></slot>\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-text': PkInputGroupText;\n }\n}\n"],"mappings":";;;AAEA,IAAa,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;ACYlC,IAAA,mBAAA,MAAM,yBAAyB,UAAU;;gBACnB;;CAEzB,SAAkB;AACd,SAAO,IAAI;;;;;;;+BALlB,cAAc,sBAAsB,CAAA,EAAA,iBAAA"}
1	+ {"version":3,"file":"pk-input-group-text-HUxlXROB.js","names":[],"sources":["../../src/components/input-group/pk-input-group-text.styles.ts","../../src/components/input-group/pk-input-group-text.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupTextStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n font-size: var(--pk-font-size-sm);\n color: var(--pk-color-gray-500);\n }\n\n .text ::slotted(svg) {\n width: 0.75rem;\n height: 0.75rem;\n pointer-events: none;\n }\n }\n`;\n","import { html } from 'lit';\nimport { customElement } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupTextStyles } from './pk-input-group-text.styles.js';\n\n/*\n Muted label text inside an input-group addon.\n \n @slot - Text content\n \n @csspart base - Text container\n */\n@customElement('pk-input-group-text')\nexport class PkInputGroupText extends PkElement {\n static override styles = pkInputGroupTextStyles;\n\n override render() {\n return html`\n <span part=\"base\" class=\"text\">\n <slot></slot>\n </span>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-text': PkInputGroupText;\n }\n}\n"],"mappings":";;;AAEA,IAAa,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;ACYlC,IAAA,mBAAA,MAAM,yBAAyB,UAAU;;gBACnB;;CAEzB,SAAkB;AACd,SAAO,IAAI;;;;;;;+BALlB,cAAc,sBAAsB,CAAA,EAAA,iBAAA"}

package/dist/chunks/{pk-input-group-textarea-CqYv8tUQ.js → pk-input-group-textarea-Cl2FNuw-.js} RENAMED Viewed

@@ -109,4 +109,4 @@ PkInputGroupTextarea = __decorate([customElement("pk-input-group-textarea")], Pk
 //#endregion
 export { PkInputGroupTextarea as t };
-//# sourceMappingURL=pk-input-group-textarea-CqYv8tUQ.js.map
+//# sourceMappingURL=pk-input-group-textarea-Cl2FNuw-.js.map

package/dist/chunks/{pk-input-group-textarea-CqYv8tUQ.js.map → pk-input-group-textarea-Cl2FNuw-.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-input-group-textarea-~~CqYv8tUQ.~~js","names":[],"sources":["../../src/components/input-group/pk-input-group-textarea.styles.ts","../../src/components/input-group/pk-input-group-textarea.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupTextareaStyles = css`\n @layer pk-component {\n :host {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n align-self: stretch;\n }\n\n .textarea {\n display: block;\n width: 100%;\n min-width: 0;\n min-height: 5rem;\n margin: 0;\n padding: 7px 10px;\n border: 0;\n border-radius: 0;\n background: transparent;\n color: var(--pk-color-gray-700);\n font: inherit;\n line-height: 1.4;\n appearance: none;\n box-sizing: border-box;\n box-shadow: none;\n outline: none;\n resize: none;\n }\n\n .textarea::placeholder {\n color: var(--pk-color-gray-400);\n }\n\n .textarea:disabled {\n cursor: not-allowed;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupTextareaStyles } from './pk-input-group-textarea.styles.js';\n\n/*\n Borderless textarea for use inside `pk-input-group`.\n \n @csspart textarea - Native textarea element\n */\n@customElement('pk-input-group-textarea')\nexport class PkInputGroupTextarea extends PkElement {\n static override styles = pkInputGroupTextareaStyles;\n\n @query('.textarea')\n textareaElement!: HTMLTextAreaElement;\n\n @property()\n placeholder = '';\n\n @property({ attribute: 'value', reflect: true })\n value = '';\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n readonly = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ type: Number })\n rows = 3;\n\n focus(options?: FocusOptions): void {\n this.textareaElement?.focus(options);\n }\n\n override render() {\n return html`\n <textarea\n part=\"textarea\"\n class=\"textarea\"\n data-slot=\"input-group-control\"\n rows=${this.rows}\n .value=${this.value}\n placeholder=${this.placeholder}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @input=${this.handleInput}\n ></textarea>\n `;\n }\n\n private handleInput(event: Event): void {\n const target = event.target as HTMLTextAreaElement;\n this.value = target.value;\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-textarea': PkInputGroupTextarea;\n }\n}\n"],"mappings":";;;AAEA,IAAa,6BAA6B,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACUtC,IAAA,uBAAA,MAAM,6BAA6B,UAAU;;;qBAOlC;eAGN;kBAGG;kBAGA;iBAGD;cAGH;;;gBArBkB;;CAuBzB,MAAM,SAA8B;AAChC,OAAK,iBAAiB,MAAM,QAAQ;;CAGxC,SAAkB;AACd,SAAO,IAAI;;;;;uBAKI,KAAK,KAAK;yBACR,KAAK,MAAM;8BACN,KAAK,YAAY;4BACnB,KAAK,SAAS;4BACd,KAAK,SAAS;+BACX,KAAK,UAAU,SAAS,QAAQ;yBACtC,KAAK,YAAY;;;;CAKtC,YAAoB,OAAoB;EACpC,MAAM,SAAS,MAAM;AACrB,OAAK,QAAQ,OAAO;AACpB,OAAK,cAAc,IAAI,MAAM,SAAS;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;AACzE,OAAK,cAAc,IAAI,MAAM,UAAU;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;;;YA9C7E,MAAM,YAAY,CAAA,EAAA,qBAAA,WAAA,mBAAA,KAAA,EAAA;YAGlB,UAAU,CAAA,EAAA,qBAAA,WAAA,eAAA,KAAA,EAAA;YAGV,SAAS;CAAE,WAAW;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,SAAA,KAAA,EAAA;YAG/C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,qBAAA,WAAA,QAAA,KAAA,EAAA;mCAtB9B,cAAc,0BAA0B,CAAA,EAAA,qBAAA"}
1	+ {"version":3,"file":"pk-input-group-textarea-Cl2FNuw-.js","names":[],"sources":["../../src/components/input-group/pk-input-group-textarea.styles.ts","../../src/components/input-group/pk-input-group-textarea.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkInputGroupTextareaStyles = css`\n @layer pk-component {\n :host {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n align-self: stretch;\n }\n\n .textarea {\n display: block;\n width: 100%;\n min-width: 0;\n min-height: 5rem;\n margin: 0;\n padding: 7px 10px;\n border: 0;\n border-radius: 0;\n background: transparent;\n color: var(--pk-color-gray-700);\n font: inherit;\n line-height: 1.4;\n appearance: none;\n box-sizing: border-box;\n box-shadow: none;\n outline: none;\n resize: none;\n }\n\n .textarea::placeholder {\n color: var(--pk-color-gray-400);\n }\n\n .textarea:disabled {\n cursor: not-allowed;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkInputGroupTextareaStyles } from './pk-input-group-textarea.styles.js';\n\n/*\n Borderless textarea for use inside `pk-input-group`.\n \n @csspart textarea - Native textarea element\n */\n@customElement('pk-input-group-textarea')\nexport class PkInputGroupTextarea extends PkElement {\n static override styles = pkInputGroupTextareaStyles;\n\n @query('.textarea')\n textareaElement!: HTMLTextAreaElement;\n\n @property()\n placeholder = '';\n\n @property({ attribute: 'value', reflect: true })\n value = '';\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n readonly = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ type: Number })\n rows = 3;\n\n focus(options?: FocusOptions): void {\n this.textareaElement?.focus(options);\n }\n\n override render() {\n return html`\n <textarea\n part=\"textarea\"\n class=\"textarea\"\n data-slot=\"input-group-control\"\n rows=${this.rows}\n .value=${this.value}\n placeholder=${this.placeholder}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @input=${this.handleInput}\n ></textarea>\n `;\n }\n\n private handleInput(event: Event): void {\n const target = event.target as HTMLTextAreaElement;\n this.value = target.value;\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-input-group-textarea': PkInputGroupTextarea;\n }\n}\n"],"mappings":";;;AAEA,IAAa,6BAA6B,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACUtC,IAAA,uBAAA,MAAM,6BAA6B,UAAU;;;qBAOlC;eAGN;kBAGG;kBAGA;iBAGD;cAGH;;;gBArBkB;;CAuBzB,MAAM,SAA8B;AAChC,OAAK,iBAAiB,MAAM,QAAQ;;CAGxC,SAAkB;AACd,SAAO,IAAI;;;;;uBAKI,KAAK,KAAK;yBACR,KAAK,MAAM;8BACN,KAAK,YAAY;4BACnB,KAAK,SAAS;4BACd,KAAK,SAAS;+BACX,KAAK,UAAU,SAAS,QAAQ;yBACtC,KAAK,YAAY;;;;CAKtC,YAAoB,OAAoB;EACpC,MAAM,SAAS,MAAM;AACrB,OAAK,QAAQ,OAAO;AACpB,OAAK,cAAc,IAAI,MAAM,SAAS;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;AACzE,OAAK,cAAc,IAAI,MAAM,UAAU;GAAE,SAAS;GAAM,UAAU;GAAM,CAAC,CAAC;;;YA9C7E,MAAM,YAAY,CAAA,EAAA,qBAAA,WAAA,mBAAA,KAAA,EAAA;YAGlB,UAAU,CAAA,EAAA,qBAAA,WAAA,eAAA,KAAA,EAAA;YAGV,SAAS;CAAE,WAAW;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,SAAA,KAAA,EAAA;YAG/C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,qBAAA,WAAA,QAAA,KAAA,EAAA;mCAtB9B,cAAc,0BAA0B,CAAA,EAAA,qBAAA"}

package/dist/chunks/{pk-lightswitch-DI1BeCmA.js → pk-lightswitch-D1qEFRxK.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 import { a as query, i as property, s as customElement, t as __decorate } from "./decorate-R0X811qp.js";
-import { t as PkFormAssociatedElement } from "./pk-form-associated-element-9M2NzOE2.js";
+import { t as PkFormAssociatedElement } from "./pk-form-associated-element-CCQALRGB.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";
 import { t as formControlStyles } from "./form-control.styles-BQdimE5o.js";
-import { n as readLegacyInstructions, t as hasInstructionContent } from "./field-labels-CoU9dnNq.js";
+import { n as readLegacyInstructions, t as hasInstructionContent } from "./field-labels-CmuAW8Cl.js";
 import { css, html, nothing } from "lit";
 //#region src/components/lightswitch/pk-lightswitch.styles.ts
 var pkLightswitchStyles = css`
@@ -428,4 +428,4 @@ PkLightswitch = __decorate([customElement("pk-lightswitch")], PkLightswitch);
 //#endregion
 export { PkLightswitch as t };
-//# sourceMappingURL=pk-lightswitch-DI1BeCmA.js.map
+//# sourceMappingURL=pk-lightswitch-D1qEFRxK.js.map

package/dist/chunks/{pk-lightswitch-DI1BeCmA.js.map → pk-lightswitch-D1qEFRxK.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-lightswitch-DI1BeCmA.js","names":[],"sources":["../../src/components/lightswitch/pk-lightswitch.styles.ts","../../src/components/lightswitch/pk-lightswitch.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkLightswitchStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n vertical-align: middle;\n font-family: var(--pk-font-family);\n font-size: var(--pk-font-size-sm);\n line-height: var(--pk-line-height);\n --pk-lightswitch-border-color: var(--pk-color-slate-800);\n --pk-lightswitch-track-off: var(--pk-color-gray-200);\n --pk-lightswitch-track-on: var(--pk-color-teal-550);\n --pk-lightswitch-track-on-border: var(--pk-color-teal-550-border);\n --pk-lightswitch-focus-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--pk-color-sky-600),\n 0 0 6px 1px hsl(from var(--pk-color-sky-600) h s l / 0.8);\n --pk-lightswitch-invalid-shadow: 0 0 0 1px #fff, 0 0 0 2.5px var(--pk-color-rose-600);\n --pk-lightswitch-invalid-focus-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--pk-color-rose-600),\n 0 0 6px 1px hsl(from var(--pk-color-rose-600) h s l / 0.8);\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n }\n\n .base {\n display: inline-flex;\n align-items: flex-start;\n gap: 0.5rem;\n }\n\n :host([disabled]) .base {\n opacity: 0.5;\n }\n\n .content {\n min-width: 0;\n cursor: pointer;\n user-select: none;\n }\n\n :host([disabled]) .content {\n cursor: not-allowed;\n }\n\n .label {\n display: block;\n /* Match checkbox / radio option labels (gray-700), not gray-900. /\n color: var(--pk-color-gray-700);\n line-height: 1rem;\n }\n\n .label:empty {\n display: none;\n }\n\n .instructions:empty,\n .hint:empty {\n display: none;\n }\n\n .switch {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: 11px;\n background: var(--pk-lightswitch-track-off, #d8dee7);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-border-color, #667c92);\n cursor: pointer;\n user-select: none;\n appearance: none;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n }\n\n .switch:focus {\n outline: none;\n }\n\n .switch:focus-visible {\n box-shadow: var(--pk-lightswitch-focus-shadow);\n }\n\n .switch[aria-checked='true'] {\n background: var(--pk-lightswitch-track-on, #0f9d8a);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border, #007d6f);\n }\n\n .switch[aria-checked='true']:focus-visible {\n box-shadow: var(--pk-lightswitch-focus-shadow);\n }\n\n :host([invalid]) .switch,\n :host(:state(user-invalid)) .switch,\n .switch[aria-invalid='true'] {\n box-shadow: var(--pk-lightswitch-invalid-shadow);\n }\n\n :host([invalid]) .switch[aria-checked='true'],\n :host(:state(user-invalid)) .switch[aria-checked='true'],\n .switch[aria-invalid='true'][aria-checked='true'] {\n background: var(--pk-lightswitch-track-on);\n }\n\n :host([invalid]) .switch:focus-visible,\n :host(:state(user-invalid)) .switch:focus-visible,\n .switch[aria-invalid='true']:focus-visible {\n box-shadow: var(--pk-lightswitch-invalid-focus-shadow);\n }\n\n .switch:disabled {\n cursor: not-allowed;\n }\n\n :host([size='default']) .switch {\n width: 34px;\n height: 22px;\n }\n\n :host([size='sm']) .switch {\n width: 28px;\n height: 18px;\n border-radius: 9px;\n }\n\n :host([size='xs']) .switch {\n width: 24px;\n height: 16px;\n border-radius: 8px;\n }\n\n :host([size='xxs']) .switch {\n width: 24px;\n height: 14px;\n border-radius: 7px;\n }\n\n .thumb {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background: var(--pk-color-white, #fff);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-border-color, #667c92);\n pointer-events: none;\n transition: transform 0.15s ease, box-shadow 0.15s ease;\n }\n\n :host([size='default']) .thumb {\n width: 18px;\n height: 18px;\n transform: translateX(2px);\n }\n\n :host([size='default']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 4px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='sm']) .thumb {\n width: 14px;\n height: 14px;\n transform: translateX(2px);\n }\n\n :host([size='sm']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 2px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='xs']) .thumb {\n width: 12px;\n height: 12px;\n transform: translateX(2px);\n }\n\n :host([size='xs']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 2px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='xxs']) .thumb {\n width: 10px;\n height: 10px;\n transform: translateX(2px);\n }\n\n :host([size='xxs']) .switch[aria-checked='true'] .thumb {\n transform: translateX(12px);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border, #007d6f);\n }\n\n .thumb svg {\n width: 14px;\n height: 14px;\n color: var(--pk-lightswitch-track-on);\n opacity: 0;\n transform: translateY(1px);\n transition: opacity 0.15s ease;\n }\n\n .switch[aria-checked='true'] .thumb svg {\n opacity: 1;\n }\n\n :host([size='sm']) .thumb svg {\n width: 10px;\n height: 10px;\n }\n\n :host([size='xs']) .thumb svg,\n :host([size='xxs']) .thumb svg {\n display: none;\n }\n\n .input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n opacity: 0;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { formControlStyles } from '../../base/form-control.styles.js';\nimport { PkFormAssociatedElement } from '../../base/pk-form-associated-element.js';\nimport { HasSlotController } from '../../internal/has-slot.js';\nimport { hasInstructionContent, readLegacyInstructions } from '../../internal/field-labels.js';\nimport { MirrorValidator, RequiredValidator } from '../../validators/index.js';\nimport { pkLightswitchStyles } from './pk-lightswitch.styles.js';\n\nconst CHECK_ICON = html`\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 640 640\" aria-hidden=\"true\">\n <path fill=\"currentColor\" d=\"M557.5 192L534.9 214.6L278.9 470.6C266.4 483.1 246.1 483.1 233.6 470.6L105.6 342.6L83 320L128.3 274.7C129.6 276 172.3 318.7 256.3 402.7L489.7 169.3L512.3 146.7L557.6 192z\" />\n </svg>\n`;\n\nexport type PkLightswitchSize = 'default' \| 'sm' \| 'xs' \| 'xxs';\n\n/\n Craft lightswitch — switch API (`role=\"switch\"`), form-associated.\n \n @slot - Switch label\n * @slot instructions - Instructions text (or use `instructions` attribute)\n * @slot hint - Alias for `instructions`\n \n @csspart base - Root wrapper\n * @csspart switch - Switch button\n * @csspart thumb - Thumb element\n * @csspart label - Label text\n * @csspart instructions - Instructions text\n * @csspart input - Hidden checkbox input\n */\n@customElement('pk-lightswitch')\nexport class PkLightswitch extends PkFormAssociatedElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n };\n\n static override styles = [formControlStyles, pkLightswitchStyles];\n\n static override get validators() {\n return [...super.validators, MirrorValidator(), RequiredValidator({ validationProperty: 'checked' })];\n }\n\n override assumeInteractionOn = ['change'];\n\n private readonly hasSlotController = new HasSlotController(this, 'instructions', 'hint');\n\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n @property({ attribute: 'default-checked', type: Boolean })\n defaultChecked = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ reflect: true })\n size: PkLightswitchSize = 'default';\n\n @property()\n value = 'on';\n\n @property()\n label = '';\n\n @property()\n instructions = '';\n\n @query('.input')\n override input!: HTMLInputElement;\n\n @query('[part=\"switch\"]')\n private switchElement!: HTMLButtonElement;\n\n override connectedCallback(): void {\n this.instructions = readLegacyInstructions(this, this.instructions);\n super.connectedCallback();\n }\n\n protected override get validationTarget(): HTMLElement {\n return this.input;\n }\n\n protected override syncFormValue(): void {\n this.setFormValue(this.checked ? this.value : null, this.checked ? 'on' : 'off');\n }\n\n protected override resetToDefaultValue(): void {\n this.checked = this.defaultChecked;\n }\n\n protected override restoreFormState(state: string \| File \| FormData \| null): void {\n if (state === 'on' \|\| state === this.value) {\n this.checked = true;\n } else {\n this.checked = false;\n }\n }\n\n override updated(changed: PropertyValues): void {\n if (this.input && changed.has('checked')) {\n this.input.checked = this.checked;\n }\n\n super.updated(changed);\n }\n\n click(): void {\n this.switchElement?.click();\n }\n\n override focus(options?: FocusOptions): void {\n this.switchElement?.focus(options);\n }\n\n override blur(): void {\n this.switchElement?.blur();\n }\n\n private toggle(): void {\n if (this.disabled) {\n return;\n }\n\n this.checked = !this.checked;\n this.emitCheckedChange();\n }\n\n private handleKeyDown(event: KeyboardEvent): void {\n const isRtl = this.matches(':dir(rtl)');\n\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.toggle();\n return;\n }\n\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n this.checked = isRtl;\n this.emitCheckedChange();\n return;\n }\n\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n this.checked = !isRtl;\n this.emitCheckedChange();\n }\n }\n\n private emitCheckedChange(): void {\n this.hasInteracted = true;\n\n this.dispatchEvent(new CustomEvent('pk-change', {\n detail: { checked: this.checked },\n bubbles: true,\n composed: true,\n }));\n\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n\n private handleLabelClick(event: Event): void {\n if (this.disabled \|\| event.target === this.switchElement) {\n return;\n }\n\n this.toggle();\n }\n\n private hasLabelContent(): boolean {\n if (this.label) {\n return true;\n }\n\n const slot = this.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement \| null;\n\n if (!slot) {\n return false;\n }\n\n return slot.assignedNodes({ flatten: true }).some((node) => {\n if (node.nodeType === Node.TEXT_NODE) {\n return Boolean(node.textContent?.trim());\n }\n\n return node.nodeType === Node.ELEMENT_NODE;\n });\n }\n\n override render() {\n const hasInstructions = hasInstructionContent(\n (name, flag) => this.hasSlotController.test(name, flag),\n this.instructions,\n );\n const hasLabel = this.hasLabelContent();\n\n return html`\n <div part=\"base\" class=\"base\">\n <button\n part=\"switch\"\n class=\"switch\"\n type=\"button\"\n role=\"switch\"\n ?disabled=${this.disabled}\n aria-checked=${this.checked ? 'true' : 'false'}\n aria-invalid=${this.invalid ? 'true' : nothing}\n aria-describedby=${hasInstructions ? 'instructions' : nothing}\n aria-labelledby=${hasLabel ? 'label' : nothing}\n @click=${this.toggle}\n @keydown=${this.handleKeyDown}\n >\n <span part=\"thumb\" class=\"thumb\">${CHECK_ICON}</span>\n </button>\n <input\n part=\"input\"\n class=\"input\"\n type=\"checkbox\"\n tabindex=\"-1\"\n .checked=${this.checked}\n ?disabled=${this.disabled}\n ?required=${this.required}\n value=${this.value}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @change=${(event: Event) => event.stopPropagation()}\n />\n ${hasLabel \|\| hasInstructions\n ? html`\n <div class=\"content\" @click=${this.handleLabelClick}>\n ${hasLabel\n ? html`\n <span part=\"label\" class=\"label\" id=\"label\">\n <slot></slot>${this.label}\n </span>\n `\n : nothing}\n ${hasInstructions\n ? html`\n <span part=\"instructions\" class=\"instructions form-control__instructions\" id=\"instructions\">\n <slot name=\"instructions\">${this.instructions}</slot>\n <slot name=\"hint\"></slot>\n </span>\n `\n : nothing}\n </div>\n `\n : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-lightswitch': PkLightswitch;\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"pk-lightswitch-D1qEFRxK.js","names":[],"sources":["../../src/components/lightswitch/pk-lightswitch.styles.ts","../../src/components/lightswitch/pk-lightswitch.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkLightswitchStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n vertical-align: middle;\n font-family: var(--pk-font-family);\n font-size: var(--pk-font-size-sm);\n line-height: var(--pk-line-height);\n --pk-lightswitch-border-color: var(--pk-color-slate-800);\n --pk-lightswitch-track-off: var(--pk-color-gray-200);\n --pk-lightswitch-track-on: var(--pk-color-teal-550);\n --pk-lightswitch-track-on-border: var(--pk-color-teal-550-border);\n --pk-lightswitch-focus-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--pk-color-sky-600),\n 0 0 6px 1px hsl(from var(--pk-color-sky-600) h s l / 0.8);\n --pk-lightswitch-invalid-shadow: 0 0 0 1px #fff, 0 0 0 2.5px var(--pk-color-rose-600);\n --pk-lightswitch-invalid-focus-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--pk-color-rose-600),\n 0 0 6px 1px hsl(from var(--pk-color-rose-600) h s l / 0.8);\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n }\n\n .base {\n display: inline-flex;\n align-items: flex-start;\n gap: 0.5rem;\n }\n\n :host([disabled]) .base {\n opacity: 0.5;\n }\n\n .content {\n min-width: 0;\n cursor: pointer;\n user-select: none;\n }\n\n :host([disabled]) .content {\n cursor: not-allowed;\n }\n\n .label {\n display: block;\n /* Match checkbox / radio option labels (gray-700), not gray-900. /\n color: var(--pk-color-gray-700);\n line-height: 1rem;\n }\n\n .label:empty {\n display: none;\n }\n\n .instructions:empty,\n .hint:empty {\n display: none;\n }\n\n .switch {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: 11px;\n background: var(--pk-lightswitch-track-off, #d8dee7);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-border-color, #667c92);\n cursor: pointer;\n user-select: none;\n appearance: none;\n transition: background-color 0.15s ease, box-shadow 0.15s ease;\n }\n\n .switch:focus {\n outline: none;\n }\n\n .switch:focus-visible {\n box-shadow: var(--pk-lightswitch-focus-shadow);\n }\n\n .switch[aria-checked='true'] {\n background: var(--pk-lightswitch-track-on, #0f9d8a);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border, #007d6f);\n }\n\n .switch[aria-checked='true']:focus-visible {\n box-shadow: var(--pk-lightswitch-focus-shadow);\n }\n\n :host([invalid]) .switch,\n :host(:state(user-invalid)) .switch,\n .switch[aria-invalid='true'] {\n box-shadow: var(--pk-lightswitch-invalid-shadow);\n }\n\n :host([invalid]) .switch[aria-checked='true'],\n :host(:state(user-invalid)) .switch[aria-checked='true'],\n .switch[aria-invalid='true'][aria-checked='true'] {\n background: var(--pk-lightswitch-track-on);\n }\n\n :host([invalid]) .switch:focus-visible,\n :host(:state(user-invalid)) .switch:focus-visible,\n .switch[aria-invalid='true']:focus-visible {\n box-shadow: var(--pk-lightswitch-invalid-focus-shadow);\n }\n\n .switch:disabled {\n cursor: not-allowed;\n }\n\n :host([size='default']) .switch {\n width: 34px;\n height: 22px;\n }\n\n :host([size='sm']) .switch {\n width: 28px;\n height: 18px;\n border-radius: 9px;\n }\n\n :host([size='xs']) .switch {\n width: 24px;\n height: 16px;\n border-radius: 8px;\n }\n\n :host([size='xxs']) .switch {\n width: 24px;\n height: 14px;\n border-radius: 7px;\n }\n\n .thumb {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background: var(--pk-color-white, #fff);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-border-color, #667c92);\n pointer-events: none;\n transition: transform 0.15s ease, box-shadow 0.15s ease;\n }\n\n :host([size='default']) .thumb {\n width: 18px;\n height: 18px;\n transform: translateX(2px);\n }\n\n :host([size='default']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 4px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='sm']) .thumb {\n width: 14px;\n height: 14px;\n transform: translateX(2px);\n }\n\n :host([size='sm']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 2px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='xs']) .thumb {\n width: 12px;\n height: 12px;\n transform: translateX(2px);\n }\n\n :host([size='xs']) .switch[aria-checked='true'] .thumb {\n transform: translateX(calc(100% - 2px));\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border);\n }\n\n :host([size='xxs']) .thumb {\n width: 10px;\n height: 10px;\n transform: translateX(2px);\n }\n\n :host([size='xxs']) .switch[aria-checked='true'] .thumb {\n transform: translateX(12px);\n box-shadow: inset 0 0 0 1px var(--pk-lightswitch-track-on-border, #007d6f);\n }\n\n .thumb svg {\n width: 14px;\n height: 14px;\n color: var(--pk-lightswitch-track-on);\n opacity: 0;\n transform: translateY(1px);\n transition: opacity 0.15s ease;\n }\n\n .switch[aria-checked='true'] .thumb svg {\n opacity: 1;\n }\n\n :host([size='sm']) .thumb svg {\n width: 10px;\n height: 10px;\n }\n\n :host([size='xs']) .thumb svg,\n :host([size='xxs']) .thumb svg {\n display: none;\n }\n\n .input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n opacity: 0;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property, query } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { formControlStyles } from '../../base/form-control.styles.js';\nimport { PkFormAssociatedElement } from '../../base/pk-form-associated-element.js';\nimport { HasSlotController } from '../../internal/has-slot.js';\nimport { hasInstructionContent, readLegacyInstructions } from '../../internal/field-labels.js';\nimport { MirrorValidator, RequiredValidator } from '../../validators/index.js';\nimport { pkLightswitchStyles } from './pk-lightswitch.styles.js';\n\nconst CHECK_ICON = html`\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 640 640\" aria-hidden=\"true\">\n <path fill=\"currentColor\" d=\"M557.5 192L534.9 214.6L278.9 470.6C266.4 483.1 246.1 483.1 233.6 470.6L105.6 342.6L83 320L128.3 274.7C129.6 276 172.3 318.7 256.3 402.7L489.7 169.3L512.3 146.7L557.6 192z\" />\n </svg>\n`;\n\nexport type PkLightswitchSize = 'default' \| 'sm' \| 'xs' \| 'xxs';\n\n/\n Craft lightswitch — switch API (`role=\"switch\"`), form-associated.\n \n @slot - Switch label\n * @slot instructions - Instructions text (or use `instructions` attribute)\n * @slot hint - Alias for `instructions`\n \n @csspart base - Root wrapper\n * @csspart switch - Switch button\n * @csspart thumb - Thumb element\n * @csspart label - Label text\n * @csspart instructions - Instructions text\n * @csspart input - Hidden checkbox input\n */\n@customElement('pk-lightswitch')\nexport class PkLightswitch extends PkFormAssociatedElement {\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n };\n\n static override styles = [formControlStyles, pkLightswitchStyles];\n\n static override get validators() {\n return [...super.validators, MirrorValidator(), RequiredValidator({ validationProperty: 'checked' })];\n }\n\n override assumeInteractionOn = ['change'];\n\n private readonly hasSlotController = new HasSlotController(this, 'instructions', 'hint');\n\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n @property({ attribute: 'default-checked', type: Boolean })\n defaultChecked = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ reflect: true })\n size: PkLightswitchSize = 'default';\n\n @property()\n value = 'on';\n\n @property()\n label = '';\n\n @property()\n instructions = '';\n\n @query('.input')\n override input!: HTMLInputElement;\n\n @query('[part=\"switch\"]')\n private switchElement!: HTMLButtonElement;\n\n override connectedCallback(): void {\n this.instructions = readLegacyInstructions(this, this.instructions);\n super.connectedCallback();\n }\n\n protected override get validationTarget(): HTMLElement {\n return this.input;\n }\n\n protected override syncFormValue(): void {\n this.setFormValue(this.checked ? this.value : null, this.checked ? 'on' : 'off');\n }\n\n protected override resetToDefaultValue(): void {\n this.checked = this.defaultChecked;\n }\n\n protected override restoreFormState(state: string \| File \| FormData \| null): void {\n if (state === 'on' \|\| state === this.value) {\n this.checked = true;\n } else {\n this.checked = false;\n }\n }\n\n override updated(changed: PropertyValues): void {\n if (this.input && changed.has('checked')) {\n this.input.checked = this.checked;\n }\n\n super.updated(changed);\n }\n\n click(): void {\n this.switchElement?.click();\n }\n\n override focus(options?: FocusOptions): void {\n this.switchElement?.focus(options);\n }\n\n override blur(): void {\n this.switchElement?.blur();\n }\n\n private toggle(): void {\n if (this.disabled) {\n return;\n }\n\n this.checked = !this.checked;\n this.emitCheckedChange();\n }\n\n private handleKeyDown(event: KeyboardEvent): void {\n const isRtl = this.matches(':dir(rtl)');\n\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.toggle();\n return;\n }\n\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n this.checked = isRtl;\n this.emitCheckedChange();\n return;\n }\n\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n this.checked = !isRtl;\n this.emitCheckedChange();\n }\n }\n\n private emitCheckedChange(): void {\n this.hasInteracted = true;\n\n this.dispatchEvent(new CustomEvent('pk-change', {\n detail: { checked: this.checked },\n bubbles: true,\n composed: true,\n }));\n\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n }\n\n private handleLabelClick(event: Event): void {\n if (this.disabled \|\| event.target === this.switchElement) {\n return;\n }\n\n this.toggle();\n }\n\n private hasLabelContent(): boolean {\n if (this.label) {\n return true;\n }\n\n const slot = this.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement \| null;\n\n if (!slot) {\n return false;\n }\n\n return slot.assignedNodes({ flatten: true }).some((node) => {\n if (node.nodeType === Node.TEXT_NODE) {\n return Boolean(node.textContent?.trim());\n }\n\n return node.nodeType === Node.ELEMENT_NODE;\n });\n }\n\n override render() {\n const hasInstructions = hasInstructionContent(\n (name, flag) => this.hasSlotController.test(name, flag),\n this.instructions,\n );\n const hasLabel = this.hasLabelContent();\n\n return html`\n <div part=\"base\" class=\"base\">\n <button\n part=\"switch\"\n class=\"switch\"\n type=\"button\"\n role=\"switch\"\n ?disabled=${this.disabled}\n aria-checked=${this.checked ? 'true' : 'false'}\n aria-invalid=${this.invalid ? 'true' : nothing}\n aria-describedby=${hasInstructions ? 'instructions' : nothing}\n aria-labelledby=${hasLabel ? 'label' : nothing}\n @click=${this.toggle}\n @keydown=${this.handleKeyDown}\n >\n <span part=\"thumb\" class=\"thumb\">${CHECK_ICON}</span>\n </button>\n <input\n part=\"input\"\n class=\"input\"\n type=\"checkbox\"\n tabindex=\"-1\"\n .checked=${this.checked}\n ?disabled=${this.disabled}\n ?required=${this.required}\n value=${this.value}\n aria-invalid=${this.invalid ? 'true' : nothing}\n @change=${(event: Event) => event.stopPropagation()}\n />\n ${hasLabel \|\| hasInstructions\n ? html`\n <div class=\"content\" @click=${this.handleLabelClick}>\n ${hasLabel\n ? html`\n <span part=\"label\" class=\"label\" id=\"label\">\n <slot></slot>${this.label}\n </span>\n `\n : nothing}\n ${hasInstructions\n ? html`\n <span part=\"instructions\" class=\"instructions form-control__instructions\" id=\"instructions\">\n <slot name=\"instructions\">${this.instructions}</slot>\n <slot name=\"hint\"></slot>\n </span>\n `\n : nothing}\n </div>\n `\n : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-lightswitch': PkLightswitch;\n }\n}\n"],"mappings":"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"}

package/dist/chunks/{pk-option-MGj9SKOK.js → pk-option-DQZHV9jL.js} RENAMED Viewed

@@ -169,6 +169,7 @@ var PkOption = class PkOption extends PkElement {
 	static {
 		this.styles = pkOptionStyles;
 	}
+	/** Focus the option’s inner control (listbox keyboard navigation). */
 	focusControl(preventScroll = true) {
 		this.shadowRoot?.querySelector(".option")?.focus({ preventScroll });
 	}
@@ -235,7 +236,7 @@ var PkOption = class PkOption extends PkElement {
 			" ",
 			"Escape"
 		]).has(event.key)) return;
-		const owner = this.closest("pk-select, pk-combobox");
+		const owner = this.closest("pk-select, pk-combobox, pk-autocomplete");
 		const panel = owner ? null : this.closest("[role=\"listbox\"]");
 		if (!owner && !panel) return;
 		event.preventDefault();
@@ -316,4 +317,4 @@ PkOption = __decorate([customElement("pk-option")], PkOption);
 //#endregion
 export { PkOption as t };
-//# sourceMappingURL=pk-option-MGj9SKOK.js.map
+//# sourceMappingURL=pk-option-DQZHV9jL.js.map

package/dist/chunks/pk-option-DQZHV9jL.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"pk-option-DQZHV9jL.js","names":[],"sources":["../../src/utils/highlight-text.ts","../../src/components/select/pk-option.styles.ts","../../src/components/select/pk-option.ts"],"sourcesContent":["export type HighlightPart = {\n text: string;\n match: boolean;\n};\n\n/** Split label text into matched/unmatched segments for typeahead highlighting. */\nexport function splitHighlightParts(text: string, search: string): HighlightPart[] {\n const label = String(text ?? '');\n const query = String(search ?? '').trim();\n\n if (!query) {\n return [{ text: label, match: false }];\n }\n\n const lowerLabel = label.toLowerCase();\n const lowerQuery = query.toLowerCase();\n const parts: HighlightPart[] = [];\n let cursor = 0;\n let matchIndex = lowerLabel.indexOf(lowerQuery);\n\n while (matchIndex !== -1) {\n if (matchIndex > cursor) {\n parts.push({\n text: label.slice(cursor, matchIndex),\n match: false,\n });\n }\n\n parts.push({\n text: label.slice(matchIndex, matchIndex + query.length),\n match: true,\n });\n\n cursor = matchIndex + query.length;\n matchIndex = lowerLabel.indexOf(lowerQuery, cursor);\n }\n\n if (cursor < label.length) {\n parts.push({\n text: label.slice(cursor),\n match: false,\n });\n }\n\n return parts.length > 0 ? parts : [{ text: label, match: false }];\n}\n","import { css } from 'lit';\n\nexport const pkOptionStyles = css`\n @layer pk-component {\n :host {\n display: block;\n /*\n * Slotted option labels inherit type metrics from this host (same\n * Craft-vs-Tailwind trap as pk-dropdown-item). Size tokens arrive via\n * pk-select ::slotted(pk-option) custom properties.\n */\n font-family: var(--pk-font-family);\n font-size: var(--pk-select-item-font-size, var(--pk-font-size-base));\n line-height: var(--pk-select-item-line-height, 1.4);\n color: var(--pk-color-gray-700);\n }\n\n .option {\n position: relative;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n width: 100%;\n margin: 0;\n min-height: var(--pk-select-item-min-height, var(--pk-input-height));\n padding-block: var(--pk-select-item-padding-block, 6px);\n padding-inline-start: var(--pk-select-item-padding-inline, 10px);\n padding-inline-end: var(--pk-select-item-padding-inline-end, 2rem);\n border: var(--pk-select-trigger-border-width, 1px) solid transparent;\n background: transparent;\n color: inherit;\n font: inherit;\n font-family: var(--pk-font-family);\n font-size: var(--pk-select-item-font-size, var(--pk-font-size-base));\n line-height: var(--pk-select-item-line-height, 1.4);\n text-align: left;\n white-space: nowrap;\n cursor: default;\n user-select: none;\n outline: none;\n box-sizing: border-box;\n }\n\n .start {\n display: none;\n flex: 0 0 auto;\n align-items: center;\n }\n\n :host([data-has-start]) .start {\n display: inline-flex;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n .option:focus-visible,\n :host([highlighted]) .option {\n background: var(--pk-color-slate-100);\n }\n\n :host([disabled]) .option,\n .option[aria-disabled='true'] {\n pointer-events: none;\n opacity: 0.5;\n }\n\n .check {\n position: absolute;\n inset-inline-end: var(--pk-select-item-indicator-inset, 0.5rem);\n top: 50%;\n display: none;\n align-items: center;\n justify-content: center;\n width: var(--pk-select-item-indicator-size, 0.75rem);\n height: var(--pk-select-item-indicator-size, 0.75rem);\n color: var(--pk-color-gray-700);\n pointer-events: none;\n transform: translateY(-50%);\n line-height: 0;\n }\n\n :host([selected]) .check {\n display: inline-flex;\n }\n\n .check svg {\n display: block;\n width: var(--pk-select-item-indicator-size, 0.75rem);\n height: var(--pk-select-item-indicator-size, 0.75rem);\n flex-shrink: 0;\n pointer-events: none;\n }\n\n .label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n /* Allow custom multi-line option layouts (title + subtitle) to stack. */\n white-space: normal;\n }\n\n .match {\n padding: 0;\n border-radius: 2px;\n background: var(--pk-color-blue-100);\n color: inherit;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { customElement, property } from '../../decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\n\nimport { check, renderIconHtml } from '../../icons/index.js';\nimport { PkElement } from '../../base/pk-element.js';\nimport { splitHighlightParts } from '../../utils/highlight-text.js';\nimport { pkOptionStyles } from './pk-option.styles.js';\n\nconst CHECK_ICON = renderIconHtml(check);\n\n/**\n * Select option — use inside `pk-select`, `pk-combobox`, or `pk-autocomplete`.\n *\n * @slot start - Presentational decoration before the label (e.g. `pk-status`).\n * @slot - Option label\n *\n * @csspart start - Start decoration container\n * @csspart option - Option button\n * @csspart label - Option label\n * @csspart check - Selected-state check indicator\n *\n * @event pk-option-select - Emitted when the option is activated (click / Enter).\n * @event pk-option-highlight - Emitted when the option becomes the highlighted item.\n */\n@customElement('pk-option')\nexport class PkOption extends PkElement {\n static override styles = pkOptionStyles;\n\n /** Option value submitted / emitted when selected. */\n @property()\n value = '';\n\n /**\n * Optional short label for the closed trigger / filter identity (v1 itemToStringLabel).\n * When set, preferred over concatenating rich default-slot text (title + subtitle).\n */\n @property()\n label = '';\n\n /** Disables the option so it cannot be selected. */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Whether this option is currently selected. */\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n /** Keyboard / pointer highlight within the listbox. */\n @property({ type: Boolean, reflect: true })\n highlighted = false;\n\n /** Hides the option from the list (e.g. filtered combobox results). */\n @property({ type: Boolean, reflect: true })\n hidden = false;\n\n @property({ type: Number, attribute: 'focus-index' })\n focusIndex = -1;\n\n @property()\n optionId = '';\n\n /** When set, the label renders with matching query text highlighted (combobox filter). */\n @property({ attribute: false })\n matchQuery = '';\n\n /** Focus the option’s inner control (listbox keyboard navigation). */\n focusControl(preventScroll = true): void {\n this.shadowRoot?.querySelector<HTMLButtonElement>('.option')?.focus({ preventScroll });\n }\n\n /**\n * Label for the closed combobox/select value.\n * Prefers the `label` attribute when set; otherwise default-slot text\n * (excluding `slot=\"start\"`), joined with spaces for multi-node layouts.\n */\n getLabel(): string {\n if (this.label.trim()) {\n return this.label.trim();\n }\n\n const labelSlot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n\n if (!labelSlot) {\n return this.textContent?.trim() ?? this.value;\n }\n\n // Join with spaces so multi-line custom labels (\"Link\" + \"Craft CMS\") do not\n // concatenate into \"LinkCraft CMS\" when no explicit `label` is set.\n return labelSlot.assignedNodes()\n .map((node) => (node.textContent ?? '').trim())\n .filter(Boolean)\n .join(' ')\n .trim();\n }\n\n /** Full default-slot text for typeahead matching (includes subtitle lines). */\n getSearchText(): string {\n const labelSlot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n\n if (!labelSlot) {\n return this.getLabel();\n }\n\n const fromSlot = labelSlot.assignedNodes()\n .map((node) => (node.textContent ?? '').trim())\n .filter(Boolean)\n .join(' ')\n .trim();\n\n return fromSlot || this.getLabel();\n }\n\n /** True when the default slot has element children (custom multi-line / rich layouts). */\n private hasRichLabelContent(): boolean {\n return [...this.children].some((node) => {\n if (!(node instanceof HTMLElement)) {\n return false;\n }\n\n // Named slots (e.g. start) are not part of the label.\n return !node.slot || node.slot === '';\n });\n }\n\n /** Light-DOM elements assigned to the start decoration slot. */\n getStartElements(): HTMLElement[] {\n return [...this.querySelectorAll(':scope > [slot=\"start\"]')].filter(\n (node): node is HTMLElement => node instanceof HTMLElement,\n );\n }\n\n override firstUpdated(): void {\n const startSlot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"start\"]');\n\n startSlot?.addEventListener('slotchange', () => this.syncStartDecoration());\n this.syncStartDecoration();\n }\n\n private syncStartDecoration(): void {\n this.toggleAttribute('data-has-start', this.getStartElements().length > 0);\n }\n\n private handleClick(): void {\n if (this.disabled) {\n return;\n }\n\n this.dispatchEvent(new CustomEvent('pk-option-select', {\n detail: { value: this.value },\n bubbles: true,\n composed: true,\n }));\n }\n\n private handleMouseEnter(): void {\n if (this.disabled || this.hidden) {\n return;\n }\n\n this.dispatchEvent(new CustomEvent('pk-option-highlight', {\n detail: { value: this.value },\n bubbles: true,\n composed: true,\n }));\n }\n\n private handleKeyDown(event: KeyboardEvent): void {\n const navKeys = new Set([\n 'ArrowDown',\n 'ArrowUp',\n 'ArrowLeft',\n 'ArrowRight',\n 'Home',\n 'End',\n 'Enter',\n ' ',\n 'Escape',\n ]);\n\n if (!navKeys.has(event.key)) {\n return;\n }\n\n const owner = this.closest('pk-select, pk-combobox, pk-autocomplete');\n const panel = owner ? null : this.closest('[role=\"listbox\"]');\n\n if (!owner && !panel) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const keydownEvent = new CustomEvent('pk-listbox-keydown', {\n detail: { keyboardEvent: event },\n bubbles: true,\n });\n\n if (owner) {\n owner.dispatchEvent(keydownEvent);\n return;\n }\n\n panel!.dispatchEvent(keydownEvent);\n }\n\n private renderLabel() {\n const query = this.matchQuery.trim();\n // Flat highlight replaces the default slot — that collapses custom layouts\n // (title + subtitle) into one run when filtering. Keep the slot for rich content.\n if (!query || this.hasRichLabelContent()) {\n return html`\n \n <slot></slot>\n \n `;\n }\n\n const label = this.getLabel();\n const parts = splitHighlightParts(label, query);\n\n return html`\n \n ${parts.map((part) => part.match\n ? html`${part.text}`\n : html`${part.text}`)}\n \n `;\n }\n\n override render() {\n return html`\n <button\n part=\"option\"\n type=\"button\"\n class=\"option\"\n role=\"option\"\n id=${this.optionId || nothing}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-selected=${this.selected ? 'true' : 'false'}\n tabindex=${this.focusIndex}\n @click=${this.handleClick}\n @mouseenter=${this.handleMouseEnter}\n @keydown=${this.handleKeyDown}\n >\n \n <slot name=\"start\"></slot>\n \n ${this.renderLabel()}\n ${unsafeSVG(CHECK_ICON)}\n </button>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-option': PkOption;\n }\n}\n"],"mappings":"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"}

package/dist/chunks/{pk-option-group-Cs6N7mlP.js → pk-option-group-CCzJkBFp.js} RENAMED Viewed

@@ -68,4 +68,4 @@ PkOptionGroup = __decorate([customElement("pk-option-group")], PkOptionGroup);
 //#endregion
 export { PkOptionGroup as t };
-//# sourceMappingURL=pk-option-group-Cs6N7mlP.js.map
+//# sourceMappingURL=pk-option-group-CCzJkBFp.js.map

package/dist/chunks/{pk-option-group-Cs6N7mlP.js.map → pk-option-group-CCzJkBFp.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-option-group-~~Cs6N7mlP~~.js","names":[],"sources":["../../src/components/select/pk-option-group.styles.ts","../../src/components/select/pk-option-group.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkOptionGroupStyles = css`\n @layer pk-component {\n :host {\n display: block;\n }\n\n /* Hard hex fallbacks: when groups portal outside pk-select, size-token\n * vars / theme tokens may be absent and invalid color inherits option black.\n * Weight/color match v1 ComboboxLabel / SelectLabel (text-slate-700, no font-medium). /\n .label {\n padding-block-start: var(--pk-select-group-label-padding-block-start, 8px);\n padding-block-end: var(--pk-select-group-label-padding-block-end, 2px);\n padding-inline: var(--pk-select-item-padding-inline, 10px);\n color: var(--pk-select-group-label-color, var(--pk-color-slate-700, rgba(96, 125, 159, 0.7)));\n font-family: var(--pk-font-family);\n / Default matches v1 ComboboxLabel/SelectLabel text-xs (12px). /\n font-size: var(--pk-select-group-label-font-size, 12px);\n font-weight: 400;\n line-height: 1.3;\n / Light-DOM ancestors (e.g. Formie empty dropzone text-center) must not center labels. /\n text-align: left;\n user-select: none;\n pointer-events: none;\n }\n\n :host([hidden]),\n :host([data-pk-filter-empty]) {\n display: none !important;\n }\n }\n`;\n","import { html } from 'lit';\nimport { customElement, property } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { uniqueId } from '../../a11y/focus.js';\nimport { pkOptionGroupStyles } from './pk-option-group.styles.js';\n\n/\n Visual option group for `pk-select` — listbox grouping pattern.\n \n @slot - `pk-option` items in this group\n \n @csspart label - Group label\n */\n@customElement('pk-option-group')\nexport class PkOptionGroup extends PkElement {\n static override styles = pkOptionGroupStyles;\n\n @property({ reflect: true })\n label = '';\n\n @property({ type: Boolean, reflect: true })\n hidden = false;\n\n private readonly labelId = uniqueId('pk-option-group-label');\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.setAttribute('role', 'group');\n this.setAttribute('aria-labelledby', this.labelId);\n }\n\n override render() {\n return html`\n <div part=\"label\" class=\"label\" id=${this.labelId}>${this.label}</div>\n <div role=\"presentation\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-option-group': PkOptionGroup;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,sBAAsB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACa/B,IAAA,gBAAA,MAAM,sBAAsB,UAAU;;;~~eAIjC~~;~~gBAGC~~;iBAEkB,SAAS,wBAAwB;;;~~gBARnC~~;;~~CAUzB~~,oBAAmC;AAC/B,QAAM,mBAAmB;AACzB,OAAK,aAAa,QAAQ,QAAQ;AAClC,OAAK,aAAa,mBAAmB,KAAK,QAAQ;;CAGtD,SAAkB;AACd,SAAO,IAAI;iDAC8B,KAAK,QAAQ,GAAG,KAAK,MAAM;;;;;;;~~YAhBvE~~,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,cAAA,WAAA,SAAA,KAAA,EAAA;~~YAG3B~~,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,cAAA,WAAA,UAAA,KAAA,EAAA;~~4BAP9C~~,cAAc,kBAAkB,CAAA,EAAA,cAAA"}
1	+ {"version":3,"file":"pk-option-group-CCzJkBFp.js","names":[],"sources":["../../src/components/select/pk-option-group.styles.ts","../../src/components/select/pk-option-group.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkOptionGroupStyles = css`\n @layer pk-component {\n :host {\n display: block;\n }\n\n /* Hard hex fallbacks: when groups portal outside pk-select, size-token\n * vars / theme tokens may be absent and invalid color inherits option black.\n * Weight/color match v1 ComboboxLabel / SelectLabel (text-slate-700, no font-medium). /\n .label {\n padding-block-start: var(--pk-select-group-label-padding-block-start, 8px);\n padding-block-end: var(--pk-select-group-label-padding-block-end, 2px);\n padding-inline: var(--pk-select-item-padding-inline, 10px);\n color: var(--pk-select-group-label-color, var(--pk-color-slate-700, rgba(96, 125, 159, 0.7)));\n font-family: var(--pk-font-family);\n / Default matches v1 ComboboxLabel/SelectLabel text-xs (12px). /\n font-size: var(--pk-select-group-label-font-size, 12px);\n font-weight: 400;\n line-height: 1.3;\n / Light-DOM ancestors (e.g. Formie empty dropzone text-center) must not center labels. /\n text-align: left;\n user-select: none;\n pointer-events: none;\n }\n\n :host([hidden]),\n :host([data-pk-filter-empty]) {\n display: none !important;\n }\n }\n`;\n","import { html } from 'lit';\nimport { customElement, property } from '../../decorators.js';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { uniqueId } from '../../a11y/focus.js';\nimport { pkOptionGroupStyles } from './pk-option-group.styles.js';\n\n/\n Visual option group for `pk-select` — listbox grouping pattern.\n \n @slot - `pk-option` items in this group\n \n @csspart label - Group label\n /\n@customElement('pk-option-group')\nexport class PkOptionGroup extends PkElement {\n static override styles = pkOptionGroupStyles;\n\n /* Visible group heading above the options. /\n @property({ reflect: true })\n label = '';\n\n /* Hides the group and its options. */\n @property({ type: Boolean, reflect: true })\n hidden = false;\n\n private readonly labelId = uniqueId('pk-option-group-label');\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.setAttribute('role', 'group');\n this.setAttribute('aria-labelledby', this.labelId);\n }\n\n override render() {\n return html`\n <div part=\"label\" class=\"label\" id=${this.labelId}>${this.label}</div>\n <div role=\"presentation\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-option-group': PkOptionGroup;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,sBAAsB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACa/B,IAAA,gBAAA,MAAM,sBAAsB,UAAU;;;eAKjC;gBAIC;iBAEkB,SAAS,wBAAwB;;;gBAVnC;;CAYzB,oBAAmC;AAC/B,QAAM,mBAAmB;AACzB,OAAK,aAAa,QAAQ,QAAQ;AAClC,OAAK,aAAa,mBAAmB,KAAK,QAAQ;;CAGtD,SAAkB;AACd,SAAO,IAAI;iDAC8B,KAAK,QAAQ,GAAG,KAAK,MAAM;;;;;;;YAjBvE,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,cAAA,WAAA,SAAA,KAAA,EAAA;YAI3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,cAAA,WAAA,UAAA,KAAA,EAAA;4BAT9C,cAAc,kBAAkB,CAAA,EAAA,cAAA"}

package/dist/chunks/{pk-popover-duyNosk2.js → pk-popover-KSIOYlbs.js} RENAMED Viewed

@@ -5,8 +5,8 @@ import { i as unregisterDismissible, n as isTopDismissible, r as registerDismiss
 import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-D0pkTQyI.js";
 import { r as resolveElementById } from "./pk-popup-B9AgBC2V.js";
 import { i as waitForPopupReposition, r as syncPopupPlacementAnimation } from "./popup-placement-animation-WlEXnS85.js";
-import { n as isPointerInsideOverlay } from "./popup-pointer-DMnuZDQl.js";
-import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-Dc6d9quJ.js";
+import { n as isPointerInsideOverlay } from "./popup-pointer-CuLjk1th.js";
+import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-BnNiguJo.js";
 import { css, html, nothing } from "lit";
 import { classMap } from "lit/directives/class-map.js";
 //#region src/components/popover/pk-popover.styles.ts
@@ -373,4 +373,4 @@ PkPopover = __decorate([customElement("pk-popover")], PkPopover);
 //#endregion
 export { PkPopover as t };
-//# sourceMappingURL=pk-popover-duyNosk2.js.map
+//# sourceMappingURL=pk-popover-KSIOYlbs.js.map

package/dist/chunks/{pk-popover-duyNosk2.js.map → pk-popover-KSIOYlbs.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-popover-duyNosk2.js","names":[],"sources":["../../src/components/popover/pk-popover.styles.ts","../../src/components/popover/pk-popover.ts"],"sourcesContent":["import { css } from 'lit';\n\nimport { buttonGroupCornerRoleStyles } from '../button-group/button-group-item.styles.js';\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\n\nexport const pkPopoverStyles = [\n buttonGroupCornerRoleStyles(),\n popupContentAnimationStyles,\n css`\n @layer pk-component {\n :host {\n /* Flex column parents stretch cross-axis size — pin to content.\n (inline-block + align-self; same class of fix as dialog / dropdown.) /\n display: inline-block;\n max-width: 100%;\n align-self: flex-start;\n flex: none;\n vertical-align: middle;\n }\n\n :host([data-pk-group-orientation]) {\n display: inline-flex;\n vertical-align: middle;\n flex: 0 0 auto;\n align-self: auto;\n }\n\n :host([data-pk-group-orientation]) ::slotted([slot='trigger']) {\n --pk-bg-start-start-radius: inherit;\n --pk-bg-start-end-radius: inherit;\n --pk-bg-end-start-radius: inherit;\n --pk-bg-end-end-radius: inherit;\n }\n\n :host([data-pk-group-orientation='horizontal'][data-pk-group-join]) {\n margin-inline-start: var(--pk-bg-horizontal-indent, 0);\n }\n\n :host([data-pk-group-orientation='vertical'][data-pk-group-join]) {\n margin-block-start: var(--pk-bg-vertical-indent, 0);\n }\n\n :host([data-pk-group-orientation='horizontal'][data-pk-group-join]:has([slot='trigger'][variant='outline'], [slot='trigger'][variant='dashed'])) {\n margin-inline-start: var(--pk-bg-horizontal-indent-outlined, 0);\n }\n\n :host([data-pk-group-orientation='vertical'][data-pk-group-join]:has([slot='trigger'][variant='outline'], [slot='trigger'][variant='dashed'])) {\n margin-block-start: var(--pk-bg-vertical-indent-outlined, 0);\n }\n\n / Match pk-popup's arrow fill to the panel surface when with-arrow is on. /\n :host([with-arrow]) {\n --pk-popup-arrow-color: var(--pk-color-white);\n --pk-popup-arrow-size: 8px;\n }\n\n .panel {\n box-sizing: border-box;\n width: 18rem;\n padding: 1rem;\n border-radius: var(--pk-radius-md);\n background: var(--pk-color-white);\n box-shadow: var(--pk-shadow-popover);\n / Craft CP body text (~gray-700), not gray-900. /\n color: var(--pk-color-gray-700);\n }\n\n / Flush panels for command/menu chrome that owns its own inset (variable picker, etc.).\n Match kit v1 PopoverContent min-w 260px / max-w 360px: without min-width,\n width max-content shrinks to short labels and looks narrower than the old picker. /\n :host([flush]) .panel {\n width: max-content;\n min-width: var(--pk-popover-flush-min-width, 16.25rem);\n max-width: min(var(--pk-popover-flush-max-width, 22.5rem), 100vw - 1rem);\n padding: 0;\n }\n\n .panel[hidden] {\n display: none !important;\n }\n }\n `,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { isTopDismissible, registerDismissible, unregisterDismissible } from '../../a11y/dismissible-stack.js';\nimport { uniqueId } from '../../a11y/focus.js';\nimport { PkElement } from '../../base/pk-element.js';\nimport { resolveElementById } from '../../internal/resolve-element-by-id.js';\nimport {\n PkAfterHideEvent,\n PkAfterShowEvent,\n PkHideEvent,\n PkShowEvent,\n type PkOverlaySource,\n} from '../../events/overlay-lifecycle.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 {\n syncPopupPlacementAnimation,\n waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\nimport { isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport { pkPopoverStyles } from './pk-popover.styles.js';\n\n/\n Popover — pattern: trigger toggles a floating panel.\n \n @slot trigger - Popover trigger\n * @slot - Popover content\n \n @csspart panel - Floating content panel\n \n @attr with-arrow - Show a pointing arrow toward the trigger (default: off)\n /\n@customElement('pk-popover')\nexport class PkPopover extends PkElement {\n static override styles = pkPopoverStyles;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ reflect: true })\n placement: PkPopupPlacement = 'bottom';\n\n @property({ attribute: 'side-offset', type: Number })\n sideOffset = 4;\n\n /\n Drop default panel padding/fixed width so slotted chrome (command lists, etc.)\n * can control its own inset. Consumer outer `p-0` alone cannot reach `.panel`.\n /\n @property({ type: Boolean, reflect: true })\n flush = false;\n\n /\n Show a floating-ui arrow on the panel (off by default).\n * Named like other optional chrome (`with-clear`, `with-caret`) — tooltip always\n * paints its own arrow and has no toggle.\n /\n @property({ attribute: 'with-arrow', type: Boolean, reflect: true })\n withArrow = false;\n\n /* Anchor element id — alternative to the trigger slot. /\n @property({ reflect: true })\n for = '';\n\n /\n Live element anchor — use when the target lives in another shadow tree\n * (e.g. TipTap chips). Preferred over `for` / trigger slot when set.\n * Stays in the consumer tree so modal `showModal()` inert does not apply\n * (unlike portaling the panel to a root outside the dialog).\n /\n @property({ attribute: false })\n anchor: Element \| null = null;\n\n @query('pk-popup')\n private popupElement!: PkPopup;\n\n private get panelElement(): HTMLDivElement \| null {\n return this.popupElement?.getContentElement() as HTMLDivElement \| null ?? null;\n }\n\n @state()\n private triggerElement: HTMLElement \| null = null;\n\n /* True while the shared popup-content exit animation is running. /\n @state()\n private closing = false;\n\n /* Gates `data-open` so enter motion starts after Floating UI places the panel. /\n @state()\n private panelAnimated = false;\n\n private readonly triggerId = uniqueId('pk-popover-trigger');\n private dismissRegistered = false;\n /* Guard re-entry while openPopover/closePopover mutate `open`. /\n private syncingOpenSideEffects = false;\n /* Coalesce overlapping close calls (updated + light-dismiss) onto one exit. /\n private exitAnimationPromise: Promise<void> \| null = null;\n\n override disconnectedCallback(): void {\n // Skip exit motion on teardown — demote immediately.\n void this.closePopover('api', true);\n super.disconnectedCallback();\n }\n\n /\n When controlled/toggle `open` flips false, arm `closing` in the same update so the\n * panel is not `hidden` for a frame before the exit animation starts.\n /\n override willUpdate(changed: PropertyValues): void {\n if (\n changed.has('open')\n && this.open === false\n && changed.get('open') === true\n && !this.syncingOpenSideEffects\n && !this.closing\n ) {\n this.closing = true;\n this.panelAnimated = false;\n }\n }\n\n /\n Controlled `open` (e.g. React) must arm/disarm light-dismiss the same way as\n * trigger toggles. Without this, programmatic open shows the panel but click-away\n * never fires.\n /\n override async updated(changed: PropertyValues): Promise<void> {\n super.updated(changed);\n\n if (!changed.has('open') \|\| this.syncingOpenSideEffects) {\n return;\n }\n\n const previousOpen = changed.get('open');\n\n if (previousOpen === this.open) {\n return;\n }\n\n // Initial connect with open=false — nothing to tear down.\n if (previousOpen === undefined && this.open === false) {\n return;\n }\n\n if (this.open) {\n await this.openPopover();\n } else {\n await this.closePopover('api');\n }\n }\n\n private onTriggerSlotChange(event: Event): void {\n const slot = event.target as HTMLSlotElement;\n const [trigger] = slot.assignedElements({ flatten: true }) as HTMLElement[];\n\n this.unbindTrigger(this.triggerElement);\n this.triggerElement = trigger ?? null;\n this.bindTrigger(this.triggerElement);\n }\n\n private bindTrigger(trigger: HTMLElement \| null): void {\n if (!trigger) {\n return;\n }\n\n if (!trigger.id) {\n trigger.id = this.triggerId;\n }\n\n trigger.setAttribute('aria-haspopup', 'dialog');\n trigger.addEventListener('click', this.handleToggleClick);\n this.syncExpanded();\n }\n\n private unbindTrigger(trigger: HTMLElement \| null): void {\n trigger?.removeEventListener('click', this.handleToggleClick);\n }\n\n private handleToggleClick = (event: Event): void => {\n event.preventDefault();\n event.stopPropagation();\n\n if (this.closing) {\n return;\n }\n\n // Flip `open` only — side effects run from `updated()` (same as dropdown-menu).\n this.open = !this.open;\n };\n\n private async openPopover(): Promise<void> {\n if (!this.getAnchor()) {\n return;\n }\n\n // Finish any in-flight exit before arming a new open.\n if (this.exitAnimationPromise) {\n await this.exitAnimationPromise;\n }\n\n // Already armed from a prior controlled/toggle open.\n if (this.dismissRegistered && this.open) {\n if (this.panelElement) {\n this.panelElement.hidden = false;\n }\n this.syncExpanded();\n return;\n }\n\n if (!this.dispatchEvent(new PkShowEvent())) {\n this.syncingOpenSideEffects = true;\n this.open = false;\n this.syncingOpenSideEffects = false;\n return;\n }\n\n this.syncingOpenSideEffects = true;\n this.open = true;\n this.syncingOpenSideEffects = false;\n this.closing = false;\n this.panelAnimated = false;\n\n if (this.panelElement) {\n this.panelElement.hidden = false;\n // Seed side before first paint so enter keyframes pick a direction.\n syncPopupPlacementAnimation(this.panelElement, this.placement);\n }\n\n this.syncExpanded();\n this.registerDismissHandlers();\n\n await this.updateComplete;\n const placement = await waitForPopupReposition(this.popupElement, this.placement);\n\n if (this.panelElement) {\n syncPopupPlacementAnimation(this.panelElement, placement);\n }\n\n // Flip data-open after placement so the shared enter animation can run.\n this.panelAnimated = true;\n\n this.dispatchEvent(new PkAfterShowEvent());\n this.dispatchEvent(new CustomEvent('pk-open-change', {\n detail: { open: true },\n bubbles: true,\n composed: true,\n }));\n }\n\n /\n @param immediate Skip exit animation (disconnect / forced teardown).\n */\n async closePopover(source: PkOverlaySource = 'unknown', immediate = false): Promise<void> {\n if (this.exitAnimationPromise) {\n return this.exitAnimationPromise;\n }\n\n if (!this.dismissRegistered && !this.closing && !this.open) {\n return;\n }\n\n const hideEvent = new PkHideEvent(source);\n\n if (!this.dispatchEvent(hideEvent)) {\n // Controlled close was cancelled — restore open and cancel exit arming.\n this.syncingOpenSideEffects = true;\n this.open = true;\n this.syncingOpenSideEffects = false;\n this.closing = false;\n this.panelAnimated = true;\n return;\n }\n\n this.unregisterDismissHandlers();\n this.closing = true;\n this.panelAnimated = false;\n\n if (this.open) {\n this.syncingOpenSideEffects = true;\n this.open = false;\n this.syncingOpenSideEffects = false;\n }\n\n const finishClose = async (): Promise<void> => {\n if (!immediate) {\n await this.updateComplete;\n await this.waitForExitAnimation();\n }\n\n this.closing = false;\n this.panelAnimated = false;\n\n if (this.panelElement) {\n this.panelElement.hidden = true;\n this.panelElement.removeAttribute('data-side');\n }\n\n this.syncExpanded();\n\n this.dispatchEvent(new PkAfterHideEvent());\n this.dispatchEvent(new CustomEvent('pk-open-change', {\n detail: { open: false },\n bubbles: true,\n composed: true,\n }));\n };\n\n this.exitAnimationPromise = finishClose().finally(() => {\n this.exitAnimationPromise = null;\n });\n\n return this.exitAnimationPromise;\n }\n\n private waitForExitAnimation(): Promise<void> {\n const panel = this.panelElement;\n\n if (!panel) {\n return Promise.resolve();\n }\n\n return new Promise((resolve) => {\n let settled = false;\n\n const finish = (): void => {\n if (settled) {\n return;\n }\n\n settled = true;\n panel.removeEventListener('animationend', onAnimationEnd);\n window.clearTimeout(fallback);\n panel.classList.remove('closing');\n resolve();\n };\n\n const onAnimationEnd = (event: AnimationEvent): void => {\n if (event.target === panel && event.animationName.startsWith('pk-popup-content-out')) {\n finish();\n }\n };\n\n panel.classList.add('closing');\n panel.addEventListener('animationend', onAnimationEnd);\n const fallback = window.setTimeout(finish, 150);\n });\n }\n\n private getAnchor(): Element \| string \| null {\n if (this.anchor) {\n return this.anchor;\n }\n\n if (this.for) {\n return resolveElementById(this, this.for);\n }\n\n if (this.triggerElement) {\n return this.triggerElement;\n }\n\n return null;\n }\n\n private registerDismissHandlers(): void {\n if (this.dismissRegistered) {\n return;\n }\n\n registerDismissible(this);\n this.dismissRegistered = true;\n document.addEventListener('pointerdown', this.onDocumentPointerDown, true);\n document.addEventListener('keydown', this.onDocumentKeyDown, true);\n }\n\n private unregisterDismissHandlers(): void {\n if (this.dismissRegistered) {\n unregisterDismissible(this);\n this.dismissRegistered = false;\n }\n\n document.removeEventListener('pointerdown', this.onDocumentPointerDown, true);\n document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n }\n\n private onDocumentPointerDown = (event: PointerEvent): void => {\n if (this.isPointerInside(event) \|\| this.closing) {\n return;\n }\n\n void this.closePopover('light-dismiss');\n };\n\n private isPointerInside(event: PointerEvent): boolean {\n return isPointerInsideOverlay(event, {\n host: this,\n anchor: this.getAnchorElement(),\n panel: this.panelElement,\n });\n };\n\n private onDocumentKeyDown = (event: KeyboardEvent): void => {\n if (event.key !== 'Escape' \|\| !isTopDismissible(this) \|\| this.closing) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n void this.closePopover('escape');\n };\n\n private getAnchorElement(): HTMLElement \| null {\n if (this.anchor instanceof HTMLElement) {\n return this.anchor;\n }\n\n if (this.triggerElement) {\n return this.triggerElement;\n }\n\n if (this.for) {\n return resolveElementById(this, this.for);\n }\n\n return null;\n }\n\n private syncExpanded(): void {\n this.triggerElement?.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n }\n\n override render() {\n const anchor = this.getAnchor();\n\n return html`\n <slot name=\"trigger\" @slotchange=${this.onTriggerSlotChange}></slot>\n <pk-popup\n .active=${this.open \|\| this.closing}\n .anchor=${anchor ?? ''}\n .placement=${this.placement}\n .distance=${this.sideOffset}\n .arrow=${this.withArrow}\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 ?hidden=${!this.open && !this.closing}\n data-open=${this.panelAnimated && !this.closing ? '' : nothing}\n tabindex=${this.open ? '-1' : nothing}\n >\n <slot></slot>\n </div>\n </pk-popup>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-popover': PkPopover;\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"pk-popover-KSIOYlbs.js","names":[],"sources":["../../src/components/popover/pk-popover.styles.ts","../../src/components/popover/pk-popover.ts"],"sourcesContent":["import { css } from 'lit';\n\nimport { buttonGroupCornerRoleStyles } from '../button-group/button-group-item.styles.js';\nimport { popupContentAnimationStyles } from '../../styles/popup-content-animation.styles.js';\n\nexport const pkPopoverStyles = [\n buttonGroupCornerRoleStyles(),\n popupContentAnimationStyles,\n css`\n @layer pk-component {\n :host {\n /* Flex column parents stretch cross-axis size — pin to content.\n (inline-block + align-self; same class of fix as dialog / dropdown.) /\n display: inline-block;\n max-width: 100%;\n align-self: flex-start;\n flex: none;\n vertical-align: middle;\n }\n\n :host([data-pk-group-orientation]) {\n display: inline-flex;\n vertical-align: middle;\n flex: 0 0 auto;\n align-self: auto;\n }\n\n :host([data-pk-group-orientation]) ::slotted([slot='trigger']) {\n --pk-bg-start-start-radius: inherit;\n --pk-bg-start-end-radius: inherit;\n --pk-bg-end-start-radius: inherit;\n --pk-bg-end-end-radius: inherit;\n }\n\n :host([data-pk-group-orientation='horizontal'][data-pk-group-join]) {\n margin-inline-start: var(--pk-bg-horizontal-indent, 0);\n }\n\n :host([data-pk-group-orientation='vertical'][data-pk-group-join]) {\n margin-block-start: var(--pk-bg-vertical-indent, 0);\n }\n\n :host([data-pk-group-orientation='horizontal'][data-pk-group-join]:has([slot='trigger'][variant='outline'], [slot='trigger'][variant='dashed'])) {\n margin-inline-start: var(--pk-bg-horizontal-indent-outlined, 0);\n }\n\n :host([data-pk-group-orientation='vertical'][data-pk-group-join]:has([slot='trigger'][variant='outline'], [slot='trigger'][variant='dashed'])) {\n margin-block-start: var(--pk-bg-vertical-indent-outlined, 0);\n }\n\n / Match pk-popup's arrow fill to the panel surface when with-arrow is on. /\n :host([with-arrow]) {\n --pk-popup-arrow-color: var(--pk-color-white);\n --pk-popup-arrow-size: 8px;\n }\n\n .panel {\n box-sizing: border-box;\n width: 18rem;\n padding: 1rem;\n border-radius: var(--pk-radius-md);\n background: var(--pk-color-white);\n box-shadow: var(--pk-shadow-popover);\n / Craft CP body text (~gray-700), not gray-900. /\n color: var(--pk-color-gray-700);\n }\n\n / Flush panels for command/menu chrome that owns its own inset (variable picker, etc.).\n Match kit v1 PopoverContent min-w 260px / max-w 360px: without min-width,\n width max-content shrinks to short labels and looks narrower than the old picker. /\n :host([flush]) .panel {\n width: max-content;\n min-width: var(--pk-popover-flush-min-width, 16.25rem);\n max-width: min(var(--pk-popover-flush-max-width, 22.5rem), 100vw - 1rem);\n padding: 0;\n }\n\n .panel[hidden] {\n display: none !important;\n }\n }\n `,\n];\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { isTopDismissible, registerDismissible, unregisterDismissible } from '../../a11y/dismissible-stack.js';\nimport { uniqueId } from '../../a11y/focus.js';\nimport { PkElement } from '../../base/pk-element.js';\nimport { resolveElementById } from '../../internal/resolve-element-by-id.js';\nimport {\n PkAfterHideEvent,\n PkAfterShowEvent,\n PkHideEvent,\n PkShowEvent,\n type PkOverlaySource,\n} from '../../events/overlay-lifecycle.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 {\n syncPopupPlacementAnimation,\n waitForPopupReposition,\n} from '../../utils/popup-placement-animation.js';\nimport { isPointerInsideOverlay } from '../../utils/popup-pointer.js';\nimport { pkPopoverStyles } from './pk-popover.styles.js';\n\n/\n Popover — pattern: trigger toggles a floating panel.\n \n @slot trigger - Popover trigger\n * @slot - Popover content\n \n @csspart panel - Floating content panel\n \n @attr with-arrow - Show a pointing arrow toward the trigger (default: off)\n /\n@customElement('pk-popover')\nexport class PkPopover extends PkElement {\n static override styles = pkPopoverStyles;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ reflect: true })\n placement: PkPopupPlacement = 'bottom';\n\n @property({ attribute: 'side-offset', type: Number })\n sideOffset = 4;\n\n /\n Drop default panel padding/fixed width so slotted chrome (command lists, etc.)\n * can control its own inset. Consumer outer `p-0` alone cannot reach `.panel`.\n /\n @property({ type: Boolean, reflect: true })\n flush = false;\n\n /\n Show a floating-ui arrow on the panel (off by default).\n * Named like other optional chrome (`with-clear`, `with-caret`) — tooltip always\n * paints its own arrow and has no toggle.\n /\n @property({ attribute: 'with-arrow', type: Boolean, reflect: true })\n withArrow = false;\n\n /* Anchor element id — alternative to the trigger slot. /\n @property({ reflect: true })\n for = '';\n\n /\n Live element anchor — use when the target lives in another shadow tree\n * (e.g. TipTap chips). Preferred over `for` / trigger slot when set.\n * Stays in the consumer tree so modal `showModal()` inert does not apply\n * (unlike portaling the panel to a root outside the dialog).\n /\n @property({ attribute: false })\n anchor: Element \| null = null;\n\n @query('pk-popup')\n private popupElement!: PkPopup;\n\n private get panelElement(): HTMLDivElement \| null {\n return this.popupElement?.getContentElement() as HTMLDivElement \| null ?? null;\n }\n\n @state()\n private triggerElement: HTMLElement \| null = null;\n\n /* True while the shared popup-content exit animation is running. /\n @state()\n private closing = false;\n\n /* Gates `data-open` so enter motion starts after Floating UI places the panel. /\n @state()\n private panelAnimated = false;\n\n private readonly triggerId = uniqueId('pk-popover-trigger');\n private dismissRegistered = false;\n /* Guard re-entry while openPopover/closePopover mutate `open`. /\n private syncingOpenSideEffects = false;\n /* Coalesce overlapping close calls (updated + light-dismiss) onto one exit. /\n private exitAnimationPromise: Promise<void> \| null = null;\n\n override disconnectedCallback(): void {\n // Skip exit motion on teardown — demote immediately.\n void this.closePopover('api', true);\n super.disconnectedCallback();\n }\n\n /\n When controlled/toggle `open` flips false, arm `closing` in the same update so the\n * panel is not `hidden` for a frame before the exit animation starts.\n /\n override willUpdate(changed: PropertyValues): void {\n if (\n changed.has('open')\n && this.open === false\n && changed.get('open') === true\n && !this.syncingOpenSideEffects\n && !this.closing\n ) {\n this.closing = true;\n this.panelAnimated = false;\n }\n }\n\n /\n Controlled `open` (e.g. React) must arm/disarm light-dismiss the same way as\n * trigger toggles. Without this, programmatic open shows the panel but click-away\n * never fires.\n /\n override async updated(changed: PropertyValues): Promise<void> {\n super.updated(changed);\n\n if (!changed.has('open') \|\| this.syncingOpenSideEffects) {\n return;\n }\n\n const previousOpen = changed.get('open');\n\n if (previousOpen === this.open) {\n return;\n }\n\n // Initial connect with open=false — nothing to tear down.\n if (previousOpen === undefined && this.open === false) {\n return;\n }\n\n if (this.open) {\n await this.openPopover();\n } else {\n await this.closePopover('api');\n }\n }\n\n private onTriggerSlotChange(event: Event): void {\n const slot = event.target as HTMLSlotElement;\n const [trigger] = slot.assignedElements({ flatten: true }) as HTMLElement[];\n\n this.unbindTrigger(this.triggerElement);\n this.triggerElement = trigger ?? null;\n this.bindTrigger(this.triggerElement);\n }\n\n private bindTrigger(trigger: HTMLElement \| null): void {\n if (!trigger) {\n return;\n }\n\n if (!trigger.id) {\n trigger.id = this.triggerId;\n }\n\n trigger.setAttribute('aria-haspopup', 'dialog');\n trigger.addEventListener('click', this.handleToggleClick);\n this.syncExpanded();\n }\n\n private unbindTrigger(trigger: HTMLElement \| null): void {\n trigger?.removeEventListener('click', this.handleToggleClick);\n }\n\n private handleToggleClick = (event: Event): void => {\n event.preventDefault();\n event.stopPropagation();\n\n if (this.closing) {\n return;\n }\n\n // Flip `open` only — side effects run from `updated()` (same as dropdown-menu).\n this.open = !this.open;\n };\n\n private async openPopover(): Promise<void> {\n if (!this.getAnchor()) {\n return;\n }\n\n // Finish any in-flight exit before arming a new open.\n if (this.exitAnimationPromise) {\n await this.exitAnimationPromise;\n }\n\n // Already armed from a prior controlled/toggle open.\n if (this.dismissRegistered && this.open) {\n if (this.panelElement) {\n this.panelElement.hidden = false;\n }\n this.syncExpanded();\n return;\n }\n\n if (!this.dispatchEvent(new PkShowEvent())) {\n this.syncingOpenSideEffects = true;\n this.open = false;\n this.syncingOpenSideEffects = false;\n return;\n }\n\n this.syncingOpenSideEffects = true;\n this.open = true;\n this.syncingOpenSideEffects = false;\n this.closing = false;\n this.panelAnimated = false;\n\n if (this.panelElement) {\n this.panelElement.hidden = false;\n // Seed side before first paint so enter keyframes pick a direction.\n syncPopupPlacementAnimation(this.panelElement, this.placement);\n }\n\n this.syncExpanded();\n this.registerDismissHandlers();\n\n await this.updateComplete;\n const placement = await waitForPopupReposition(this.popupElement, this.placement);\n\n if (this.panelElement) {\n syncPopupPlacementAnimation(this.panelElement, placement);\n }\n\n // Flip data-open after placement so the shared enter animation can run.\n this.panelAnimated = true;\n\n this.dispatchEvent(new PkAfterShowEvent());\n this.dispatchEvent(new CustomEvent('pk-open-change', {\n detail: { open: true },\n bubbles: true,\n composed: true,\n }));\n }\n\n /\n @param immediate Skip exit animation (disconnect / forced teardown).\n */\n async closePopover(source: PkOverlaySource = 'unknown', immediate = false): Promise<void> {\n if (this.exitAnimationPromise) {\n return this.exitAnimationPromise;\n }\n\n if (!this.dismissRegistered && !this.closing && !this.open) {\n return;\n }\n\n const hideEvent = new PkHideEvent(source);\n\n if (!this.dispatchEvent(hideEvent)) {\n // Controlled close was cancelled — restore open and cancel exit arming.\n this.syncingOpenSideEffects = true;\n this.open = true;\n this.syncingOpenSideEffects = false;\n this.closing = false;\n this.panelAnimated = true;\n return;\n }\n\n this.unregisterDismissHandlers();\n this.closing = true;\n this.panelAnimated = false;\n\n if (this.open) {\n this.syncingOpenSideEffects = true;\n this.open = false;\n this.syncingOpenSideEffects = false;\n }\n\n const finishClose = async (): Promise<void> => {\n if (!immediate) {\n await this.updateComplete;\n await this.waitForExitAnimation();\n }\n\n this.closing = false;\n this.panelAnimated = false;\n\n if (this.panelElement) {\n this.panelElement.hidden = true;\n this.panelElement.removeAttribute('data-side');\n }\n\n this.syncExpanded();\n\n this.dispatchEvent(new PkAfterHideEvent());\n this.dispatchEvent(new CustomEvent('pk-open-change', {\n detail: { open: false },\n bubbles: true,\n composed: true,\n }));\n };\n\n this.exitAnimationPromise = finishClose().finally(() => {\n this.exitAnimationPromise = null;\n });\n\n return this.exitAnimationPromise;\n }\n\n private waitForExitAnimation(): Promise<void> {\n const panel = this.panelElement;\n\n if (!panel) {\n return Promise.resolve();\n }\n\n return new Promise((resolve) => {\n let settled = false;\n\n const finish = (): void => {\n if (settled) {\n return;\n }\n\n settled = true;\n panel.removeEventListener('animationend', onAnimationEnd);\n window.clearTimeout(fallback);\n panel.classList.remove('closing');\n resolve();\n };\n\n const onAnimationEnd = (event: AnimationEvent): void => {\n if (event.target === panel && event.animationName.startsWith('pk-popup-content-out')) {\n finish();\n }\n };\n\n panel.classList.add('closing');\n panel.addEventListener('animationend', onAnimationEnd);\n const fallback = window.setTimeout(finish, 150);\n });\n }\n\n private getAnchor(): Element \| string \| null {\n if (this.anchor) {\n return this.anchor;\n }\n\n if (this.for) {\n return resolveElementById(this, this.for);\n }\n\n if (this.triggerElement) {\n return this.triggerElement;\n }\n\n return null;\n }\n\n private registerDismissHandlers(): void {\n if (this.dismissRegistered) {\n return;\n }\n\n registerDismissible(this);\n this.dismissRegistered = true;\n document.addEventListener('pointerdown', this.onDocumentPointerDown, true);\n document.addEventListener('keydown', this.onDocumentKeyDown, true);\n }\n\n private unregisterDismissHandlers(): void {\n if (this.dismissRegistered) {\n unregisterDismissible(this);\n this.dismissRegistered = false;\n }\n\n document.removeEventListener('pointerdown', this.onDocumentPointerDown, true);\n document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n }\n\n private onDocumentPointerDown = (event: PointerEvent): void => {\n if (this.isPointerInside(event) \|\| this.closing) {\n return;\n }\n\n void this.closePopover('light-dismiss');\n };\n\n private isPointerInside(event: PointerEvent): boolean {\n return isPointerInsideOverlay(event, {\n host: this,\n anchor: this.getAnchorElement(),\n panel: this.panelElement,\n });\n };\n\n private onDocumentKeyDown = (event: KeyboardEvent): void => {\n if (event.key !== 'Escape' \|\| !isTopDismissible(this) \|\| this.closing) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n void this.closePopover('escape');\n };\n\n private getAnchorElement(): HTMLElement \| null {\n if (this.anchor instanceof HTMLElement) {\n return this.anchor;\n }\n\n if (this.triggerElement) {\n return this.triggerElement;\n }\n\n if (this.for) {\n return resolveElementById(this, this.for);\n }\n\n return null;\n }\n\n private syncExpanded(): void {\n this.triggerElement?.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n }\n\n override render() {\n const anchor = this.getAnchor();\n\n return html`\n <slot name=\"trigger\" @slotchange=${this.onTriggerSlotChange}></slot>\n <pk-popup\n .active=${this.open \|\| this.closing}\n .anchor=${anchor ?? ''}\n .placement=${this.placement}\n .distance=${this.sideOffset}\n .arrow=${this.withArrow}\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 ?hidden=${!this.open && !this.closing}\n data-open=${this.panelAnimated && !this.closing ? '' : nothing}\n tabindex=${this.open ? '-1' : nothing}\n >\n <slot></slot>\n </div>\n </pk-popup>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-popover': PkPopover;\n }\n}\n"],"mappings":"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"}

package/dist/chunks/{pk-radio-BK4D2Htu.js → pk-radio-B5XkMHy3.js} RENAMED Viewed

@@ -229,4 +229,4 @@ PkRadio = __decorate([customElement("pk-radio")], PkRadio);
 //#endregion
 export { PkRadio as t };
-//# sourceMappingURL=pk-radio-BK4D2Htu.js.map
+//# sourceMappingURL=pk-radio-B5XkMHy3.js.map

package/dist/chunks/{pk-radio-BK4D2Htu.js.map → pk-radio-B5XkMHy3.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pk-radio-~~BK4D2Htu~~.js","names":[],"sources":["../../src/components/radio-group/pk-radio.styles.ts","../../src/components/radio-group/pk-radio.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkRadioStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n vertical-align: middle;\n font-family: var(--pk-font-family);\n font-size: var(--pk-font-size-base);\n line-height: var(--pk-line-height);\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n .item {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n position: relative;\n margin: 0;\n }\n\n :host([disabled]) .item {\n cursor: not-allowed;\n }\n\n .item--with-label {\n gap: 0.5rem;\n }\n\n .control {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n border: 1px solid var(--pk-color-slate-400);\n border-radius: 9999px;\n background: var(--pk-color-white);\n transition: border-color 0.12s ease, box-shadow 0.12s ease;\n }\n\n .item:focus-visible .control,\n :host([data-focus-visible]) .control {\n border-color: var(--pk-color-sky-600);\n box-shadow: 0 0 0 1px var(--pk-color-sky-600), 0 0 4px 0 hsl(from var(--pk-color-sky-600) h s l / 0.7);\n }\n\n :host([invalid]) .control {\n border-color: var(--pk-color-rose-600);\n }\n\n :host([invalid]:focus-visible) .control,\n :host([invalid][data-focus-visible]) .control {\n box-shadow: 0 0 0 1px var(--pk-color-rose-600), 0 0 4px 0 hsl(from var(--pk-color-rose-600) h s l / 0.7);\n }\n\n :host([checked]) .control {\n background: var(--pk-color-gray-50);\n color: #1f2933;\n }\n\n .indicator {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n color: currentcolor;\n }\n\n .indicator-dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 9999px;\n background: currentcolor;\n transition: opacity 0.12s ease, transform 0.12s ease;\n }\n\n :host(:not([checked])) .indicator-dot {\n opacity: 0;\n transform: scale(0);\n }\n\n .input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n opacity: 0;\n appearance: none;\n }\n\n .label {\n line-height: var(--pk-line-height);\n /* Match checkbox / form-control labels (gray-700). /\n color: var(--pk-color-gray-700);\n }\n\n .label.is-empty {\n display: none;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkRadioStyles } from './pk-radio.styles.js';\n\n/\n Radio button — use inside `pk-radio-group`.\n \n @slot - Visible label text\n \n @csspart base - Root label element\n * @csspart input - Native radio input\n * @csspart control - Visual radio circle\n * @csspart indicator - Indicator container\n /\n@customElement('pk-radio')\nexport class PkRadio extends PkElement {\n static override styles = pkRadioStyles;\n\n @property()\n value = '';\n\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ type: Boolean, reflect: true })\n required = false;\n\n @property({ type: Number })\n tabIndex = -1;\n\n @property({ attribute: 'aria-label' })\n ariaLabel: string \| null = null;\n\n /* Set by `pk-radio-group` when the group is disabled. */\n @property({ type: Boolean, attribute: false })\n forceDisabled = false;\n\n @query('.input')\n private input!: HTMLInputElement;\n\n @state()\n private hasDefaultSlotContent = false;\n\n override updated(changed: PropertyValues): void {\n if (this.input && changed.has('checked')) {\n this.input.checked = this.checked;\n }\n\n if (this.input && changed.has('tabIndex')) {\n this.input.tabIndex = this.tabIndex;\n }\n }\n\n focusControl(options?: FocusOptions): void {\n this.input.focus(options);\n }\n\n private defaultSlotChanged(event: Event): void {\n const slot = event.target as HTMLSlotElement;\n this.hasDefaultSlotContent = slot.assignedNodes({ flatten: true }).some((node) => {\n if (node.nodeType === Node.TEXT_NODE) {\n return node.textContent?.trim();\n }\n\n return node.nodeType === Node.ELEMENT_NODE;\n });\n }\n\n private handleChange(event: Event): void {\n event.stopPropagation();\n const input = event.target as HTMLInputElement;\n\n if (this.disabled \|\| this.forceDisabled \|\| !input.checked) {\n return;\n }\n\n this.dispatchEvent(new CustomEvent('pk-radio-select', {\n detail: { value: this.value },\n bubbles: true,\n composed: true,\n }));\n }\n\n override render() {\n const isDisabled = this.disabled \|\| this.forceDisabled;\n\n return html`\n <label\n part=\"base\"\n class=${classMap({\n item: true,\n 'pk-radio-group__item': true,\n 'item--with-label': this.hasDefaultSlotContent,\n })}\n data-state=${this.checked ? 'checked' : nothing}\n ?data-disabled=${isDisabled}\n aria-disabled=${isDisabled ? 'true' : nothing}\n >\n <span part=\"control\" class=\"control pk-radio-group__control\">\n <span part=\"indicator\" class=\"indicator pk-radio-group__indicator\">\n <span class=\"indicator-dot pk-radio-group__indicator-dot\"></span>\n </span>\n </span>\n <input\n part=\"input\"\n class=\"input\"\n type=\"radio\"\n .checked=${this.checked}\n ?disabled=${isDisabled}\n ?required=${this.required}\n value=${this.value}\n tabindex=${this.tabIndex}\n aria-label=${this.ariaLabel ?? nothing}\n aria-invalid=${this.invalid ? 'true' : nothing}\n aria-checked=${this.checked ? 'true' : 'false'}\n @change=${this.handleChange}\n />\n <span\n class=${classMap({\n label: true,\n 'is-empty': !this.hasDefaultSlotContent,\n })}\n >\n <slot @slotchange=${this.defaultSlotChanged}></slot>\n </span>\n </label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-radio': PkRadio;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACiBzB,IAAA,UAAA,MAAM,gBAAgB,UAAU;;;eAI3B;iBAGE;kBAGC;iBAGD;kBAGC;kBAGA;mBAGgB;uBAIX;+BAMgB;;;gBA/BP;;CAiCzB,QAAiB,SAA+B;AAC5C,MAAI,KAAK,SAAS,QAAQ,IAAI,UAAU,CACpC,MAAK,MAAM,UAAU,KAAK;AAG9B,MAAI,KAAK,SAAS,QAAQ,IAAI,WAAW,CACrC,MAAK,MAAM,WAAW,KAAK;;CAInC,aAAa,SAA8B;AACvC,OAAK,MAAM,MAAM,QAAQ;;CAG7B,mBAA2B,OAAoB;EAC3C,MAAM,OAAO,MAAM;AACnB,OAAK,wBAAwB,KAAK,cAAc,EAAE,SAAS,MAAM,CAAC,CAAC,MAAM,SAAS;AAC9E,OAAI,KAAK,aAAa,KAAK,UACvB,QAAO,KAAK,aAAa,MAAM;AAGnC,UAAO,KAAK,aAAa,KAAK;IAChC;;CAGN,aAAqB,OAAoB;AACrC,QAAM,iBAAiB;EACvB,MAAM,QAAQ,MAAM;AAEpB,MAAI,KAAK,YAAY,KAAK,iBAAiB,CAAC,MAAM,QAC9C;AAGJ,OAAK,cAAc,IAAI,YAAY,mBAAmB;GAClD,QAAQ,EAAE,OAAO,KAAK,OAAO;GAC7B,SAAS;GACT,UAAU;GACb,CAAC,CAAC;;CAGP,SAAkB;EACd,MAAM,aAAa,KAAK,YAAY,KAAK;AAEzC,SAAO,IAAI;;;wBAGK,SAAS;GACb,MAAM;GACN,wBAAwB;GACxB,oBAAoB,KAAK;GAC5B,CAAC,CAAC;6BACU,KAAK,UAAU,YAAY,QAAQ;iCAC/B,WAAW;gCACZ,aAAa,SAAS,QAAQ;;;;;;;;;;;+BAW/B,KAAK,QAAQ;gCACZ,WAAW;gCACX,KAAK,SAAS;4BAClB,KAAK,MAAM;+BACR,KAAK,SAAS;iCACZ,KAAK,aAAa,QAAQ;mCACxB,KAAK,UAAU,SAAS,QAAQ;mCAChC,KAAK,UAAU,SAAS,QAAQ;8BACrC,KAAK,aAAa;;;4BAGpB,SAAS;GACb,OAAO;GACP,YAAY,CAAC,KAAK;GACrB,CAAC,CAAC;;wCAEiB,KAAK,mBAAmB;;;;;;YA/G3D,UAAU,CAAA,EAAA,QAAA,WAAA,SAAA,KAAA,EAAA;YAGV,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1B,SAAS,EAAE,WAAW,cAAc,CAAC,CAAA,EAAA,QAAA,WAAA,aAAA,KAAA,EAAA;YAIrC,SAAS;CAAE,MAAM;CAAS,WAAW;CAAO,CAAC,CAAA,EAAA,QAAA,WAAA,iBAAA,KAAA,EAAA;YAG7C,MAAM,SAAS,CAAA,EAAA,QAAA,WAAA,SAAA,KAAA,EAAA;YAGf,OAAO,CAAA,EAAA,QAAA,WAAA,yBAAA,KAAA,EAAA;sBAhCX,cAAc,WAAW,CAAA,EAAA,QAAA"}
1	+ {"version":3,"file":"pk-radio-B5XkMHy3.js","names":[],"sources":["../../src/components/radio-group/pk-radio.styles.ts","../../src/components/radio-group/pk-radio.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const pkRadioStyles = css`\n @layer pk-component {\n :host {\n display: inline-flex;\n vertical-align: middle;\n font-family: var(--pk-font-family);\n font-size: var(--pk-font-size-base);\n line-height: var(--pk-line-height);\n }\n\n :host([disabled]) {\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n .item {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n position: relative;\n margin: 0;\n }\n\n :host([disabled]) .item {\n cursor: not-allowed;\n }\n\n .item--with-label {\n gap: 0.5rem;\n }\n\n .control {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n border: 1px solid var(--pk-color-slate-400);\n border-radius: 9999px;\n background: var(--pk-color-white);\n transition: border-color 0.12s ease, box-shadow 0.12s ease;\n }\n\n .item:focus-visible .control,\n :host([data-focus-visible]) .control {\n border-color: var(--pk-color-sky-600);\n box-shadow: 0 0 0 1px var(--pk-color-sky-600), 0 0 4px 0 hsl(from var(--pk-color-sky-600) h s l / 0.7);\n }\n\n :host([invalid]) .control {\n border-color: var(--pk-color-rose-600);\n }\n\n :host([invalid]:focus-visible) .control,\n :host([invalid][data-focus-visible]) .control {\n box-shadow: 0 0 0 1px var(--pk-color-rose-600), 0 0 4px 0 hsl(from var(--pk-color-rose-600) h s l / 0.7);\n }\n\n :host([checked]) .control {\n background: var(--pk-color-gray-50);\n color: #1f2933;\n }\n\n .indicator {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n color: currentcolor;\n }\n\n .indicator-dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 9999px;\n background: currentcolor;\n transition: opacity 0.12s ease, transform 0.12s ease;\n }\n\n :host(:not([checked])) .indicator-dot {\n opacity: 0;\n transform: scale(0);\n }\n\n .input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n opacity: 0;\n appearance: none;\n }\n\n .label {\n line-height: var(--pk-line-height);\n /* Match checkbox / form-control labels (gray-700). /\n color: var(--pk-color-gray-700);\n }\n\n .label.is-empty {\n display: none;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from '../../decorators.js';\nimport type { PropertyValues } from 'lit';\n\nimport { PkElement } from '../../base/pk-element.js';\nimport { pkRadioStyles } from './pk-radio.styles.js';\n\n/\n Radio button — use inside `pk-radio-group`.\n \n @slot - Visible label text\n \n @csspart base - Root label element\n * @csspart input - Native radio input\n * @csspart control - Visual radio circle\n * @csspart indicator - Indicator container\n /\n@customElement('pk-radio')\nexport class PkRadio extends PkElement {\n static override styles = pkRadioStyles;\n\n @property()\n value = '';\n\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: Boolean, reflect: true })\n invalid = false;\n\n @property({ type: Boolean, reflect: true })\n required = false;\n\n @property({ type: Number })\n tabIndex = -1;\n\n @property({ attribute: 'aria-label' })\n ariaLabel: string \| null = null;\n\n /* Set by `pk-radio-group` when the group is disabled. */\n @property({ type: Boolean, attribute: false })\n forceDisabled = false;\n\n @query('.input')\n private input!: HTMLInputElement;\n\n @state()\n private hasDefaultSlotContent = false;\n\n override updated(changed: PropertyValues): void {\n if (this.input && changed.has('checked')) {\n this.input.checked = this.checked;\n }\n\n if (this.input && changed.has('tabIndex')) {\n this.input.tabIndex = this.tabIndex;\n }\n }\n\n focusControl(options?: FocusOptions): void {\n this.input.focus(options);\n }\n\n private defaultSlotChanged(event: Event): void {\n const slot = event.target as HTMLSlotElement;\n this.hasDefaultSlotContent = slot.assignedNodes({ flatten: true }).some((node) => {\n if (node.nodeType === Node.TEXT_NODE) {\n return node.textContent?.trim();\n }\n\n return node.nodeType === Node.ELEMENT_NODE;\n });\n }\n\n private handleChange(event: Event): void {\n event.stopPropagation();\n const input = event.target as HTMLInputElement;\n\n if (this.disabled \|\| this.forceDisabled \|\| !input.checked) {\n return;\n }\n\n this.dispatchEvent(new CustomEvent('pk-radio-select', {\n detail: { value: this.value },\n bubbles: true,\n composed: true,\n }));\n }\n\n override render() {\n const isDisabled = this.disabled \|\| this.forceDisabled;\n\n return html`\n <label\n part=\"base\"\n class=${classMap({\n item: true,\n 'pk-radio-group__item': true,\n 'item--with-label': this.hasDefaultSlotContent,\n })}\n data-state=${this.checked ? 'checked' : nothing}\n ?data-disabled=${isDisabled}\n aria-disabled=${isDisabled ? 'true' : nothing}\n >\n <span part=\"control\" class=\"control pk-radio-group__control\">\n <span part=\"indicator\" class=\"indicator pk-radio-group__indicator\">\n <span class=\"indicator-dot pk-radio-group__indicator-dot\"></span>\n </span>\n </span>\n <input\n part=\"input\"\n class=\"input\"\n type=\"radio\"\n .checked=${this.checked}\n ?disabled=${isDisabled}\n ?required=${this.required}\n value=${this.value}\n tabindex=${this.tabIndex}\n aria-label=${this.ariaLabel ?? nothing}\n aria-invalid=${this.invalid ? 'true' : nothing}\n aria-checked=${this.checked ? 'true' : 'false'}\n @change=${this.handleChange}\n />\n <span\n class=${classMap({\n label: true,\n 'is-empty': !this.hasDefaultSlotContent,\n })}\n >\n <slot @slotchange=${this.defaultSlotChanged}></slot>\n </span>\n </label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'pk-radio': PkRadio;\n }\n}\n"],"mappings":";;;;AAEA,IAAa,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACiBzB,IAAA,UAAA,MAAM,gBAAgB,UAAU;;;eAI3B;iBAGE;kBAGC;iBAGD;kBAGC;kBAGA;mBAGgB;uBAIX;+BAMgB;;;gBA/BP;;CAiCzB,QAAiB,SAA+B;AAC5C,MAAI,KAAK,SAAS,QAAQ,IAAI,UAAU,CACpC,MAAK,MAAM,UAAU,KAAK;AAG9B,MAAI,KAAK,SAAS,QAAQ,IAAI,WAAW,CACrC,MAAK,MAAM,WAAW,KAAK;;CAInC,aAAa,SAA8B;AACvC,OAAK,MAAM,MAAM,QAAQ;;CAG7B,mBAA2B,OAAoB;EAC3C,MAAM,OAAO,MAAM;AACnB,OAAK,wBAAwB,KAAK,cAAc,EAAE,SAAS,MAAM,CAAC,CAAC,MAAM,SAAS;AAC9E,OAAI,KAAK,aAAa,KAAK,UACvB,QAAO,KAAK,aAAa,MAAM;AAGnC,UAAO,KAAK,aAAa,KAAK;IAChC;;CAGN,aAAqB,OAAoB;AACrC,QAAM,iBAAiB;EACvB,MAAM,QAAQ,MAAM;AAEpB,MAAI,KAAK,YAAY,KAAK,iBAAiB,CAAC,MAAM,QAC9C;AAGJ,OAAK,cAAc,IAAI,YAAY,mBAAmB;GAClD,QAAQ,EAAE,OAAO,KAAK,OAAO;GAC7B,SAAS;GACT,UAAU;GACb,CAAC,CAAC;;CAGP,SAAkB;EACd,MAAM,aAAa,KAAK,YAAY,KAAK;AAEzC,SAAO,IAAI;;;wBAGK,SAAS;GACb,MAAM;GACN,wBAAwB;GACxB,oBAAoB,KAAK;GAC5B,CAAC,CAAC;6BACU,KAAK,UAAU,YAAY,QAAQ;iCAC/B,WAAW;gCACZ,aAAa,SAAS,QAAQ;;;;;;;;;;;+BAW/B,KAAK,QAAQ;gCACZ,WAAW;gCACX,KAAK,SAAS;4BAClB,KAAK,MAAM;+BACR,KAAK,SAAS;iCACZ,KAAK,aAAa,QAAQ;mCACxB,KAAK,UAAU,SAAS,QAAQ;mCAChC,KAAK,UAAU,SAAS,QAAQ;8BACrC,KAAK,aAAa;;;4BAGpB,SAAS;GACb,OAAO;GACP,YAAY,CAAC,KAAK;GACrB,CAAC,CAAC;;wCAEiB,KAAK,mBAAmB;;;;;;YA/G3D,UAAU,CAAA,EAAA,QAAA,WAAA,SAAA,KAAA,EAAA;YAGV,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,WAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,EAAA,QAAA,WAAA,YAAA,KAAA,EAAA;YAG1B,SAAS,EAAE,WAAW,cAAc,CAAC,CAAA,EAAA,QAAA,WAAA,aAAA,KAAA,EAAA;YAIrC,SAAS;CAAE,MAAM;CAAS,WAAW;CAAO,CAAC,CAAA,EAAA,QAAA,WAAA,iBAAA,KAAA,EAAA;YAG7C,MAAM,SAAS,CAAA,EAAA,QAAA,WAAA,SAAA,KAAA,EAAA;YAGf,OAAO,CAAA,EAAA,QAAA,WAAA,yBAAA,KAAA,EAAA;sBAhCX,cAAc,WAAW,CAAA,EAAA,QAAA"}

package/dist/chunks/{pk-radio-group-BRJIjOsR.js → pk-radio-group-ByrxGLdX.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 import { a as query, i as property, o as state, s as customElement, t as __decorate } from "./decorate-R0X811qp.js";
-import { t as PkFormAssociatedElement } from "./pk-form-associated-element-9M2NzOE2.js";
+import { t as PkFormAssociatedElement } from "./pk-form-associated-element-CCQALRGB.js";
 import { t as RequiredValidator } from "./required-validator-CEg8dvjS.js";
 import { t as HasSlotController } from "./has-slot-8BvCt_qo.js";
 import { t as formControlStyles } from "./form-control.styles-BQdimE5o.js";
-import { n as readLegacyInstructions, t as hasInstructionContent } from "./field-labels-CoU9dnNq.js";
+import { n as readLegacyInstructions, t as hasInstructionContent } from "./field-labels-CmuAW8Cl.js";
 import { css, html, nothing } from "lit";
 import { classMap } from "lit/directives/class-map.js";
 //#region src/components/radio-group/pk-radio-group.styles.ts
@@ -249,4 +249,4 @@ PkRadioGroup = __decorate([customElement("pk-radio-group")], PkRadioGroup);
 //#endregion
 export { PkRadioGroup as t };
-//# sourceMappingURL=pk-radio-group-BRJIjOsR.js.map
+//# sourceMappingURL=pk-radio-group-ByrxGLdX.js.map