npm - @pine-ds/core - Versions diffs - 3.26.0 → 3.26.3 - Mend

@pine-ds/core 3.26.0 → 3.26.3

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 (610) hide show

package/components/pds-filter.js CHANGED Viewed

@@ -1,8 +1,9 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { a as isRtlDirection } from './scroll.js';
 import { t as trash, g as enlarge } from './index2.js';
 import { d as defineCustomElement$2 } from './pds-icon2.js';
-const pdsFilterCss = ":host{--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);display:inline-block;position:relative}.pds-filter__trigger{-ms-flex-align:center;align-items:center;anchor-name:--filter-trigger;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-050);box-shadow:var(--pine-box-shadow-050);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-tertiary);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-inter);font-size:var(--pine-font-size-100);font-weight:var(--pine-font-weight-400);gap:var(--pine-dimension-050);letter-spacing:var(--pine-letter-spacing-114);line-height:var(--pine-line-height-150);padding:var(--pine-dimension-025) var(--pine-dimension-125);position:relative;-webkit-transition:all 0.2s ease;transition:all 0.2s ease}.pds-filter__trigger pds-icon{block-size:var(--pine-font-size-100);color:var(--pine-color-text-secondary);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-font-size-100)}.pds-filter__trigger:hover,.pds-filter__trigger.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger:hover pds-icon,.pds-filter__trigger.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger:disabled{cursor:not-allowed;opacity:0.5}.pds-filter__trigger--selected{background-color:var(--pine-color-purple-050);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover,.pds-filter__trigger--selected.pds-filter__trigger--open{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover pds-icon,.pds-filter__trigger--selected.pds-filter__trigger--open pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--more{background-color:var(--pine-color-background-container-hover);border:var(--pine-border-width-thin) dashed var(--pine-color-border);color:var(--pine-color-text-tertiary)}.pds-filter__trigger--more pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:hover,.pds-filter__trigger--more.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger--more:hover pds-icon,.pds-filter__trigger--more.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--clear{background:transparent;border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-100);-webkit-box-shadow:none;box-shadow:none;color:var(--pine-color-purple-600)}.pds-filter__trigger--clear pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-100);color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__button-content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-050);max-inline-size:148px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__button-text{line-height:var(--pine-line-height-150);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__dropdown-icon{block-size:var(--pine-dimension-200);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-200)}.pds-filter__popover{background-color:var(--pine-color-background-container);border:0;border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);display:none;inline-size:228px;inset:unset;padding:var(--pine-dimension-100);z-index:var(--pine-z-index-overlay);}.pds-filter__popover:popover-open,.pds-filter__popover.is-open{display:block}.pds-filter__popover{}@supports (anchor-name: --test){.pds-filter__popover{inset-block-start:calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));inset-inline-start:anchor(--filter-trigger left);position:fixed;position-anchor:--filter-trigger;}.pds-filter__popover.popover-flip-horizontal{inset-inline-start:anchor(--filter-trigger right);-webkit-transform:translateX(-100%);transform:translateX(-100%)}.pds-filter__popover.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-start:anchor(--filter-trigger right);-webkit-transform:translate(-100%, calc(-100% - var(--pine-dimension-100)));transform:translate(-100%, calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover{}.pds-filter__popover.is-open.popover-flip-horizontal{inset-inline-start:anchor(--filter-trigger right);-webkit-transform:translateX(-100%);transform:translateX(-100%)}.pds-filter__popover.is-open.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.is-open.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-start:anchor(--filter-trigger right);-webkit-transform:translate(-100%, calc(-100% - var(--pine-dimension-100)));transform:translate(-100%, calc(-100% - var(--pine-dimension-100)))}}";
+const pdsFilterCss = ":host{--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);display:inline-block;position:relative}.pds-filter__trigger{-ms-flex-align:center;align-items:center;anchor-name:--filter-trigger;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-050);box-shadow:var(--pine-box-shadow-050);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-tertiary);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-inter);font-size:var(--pine-font-size-100);font-weight:var(--pine-font-weight-400);gap:var(--pine-dimension-050);letter-spacing:var(--pine-letter-spacing-114);line-height:var(--pine-line-height-150);padding:var(--pine-dimension-025) var(--pine-dimension-125);position:relative;-webkit-transition:all 0.2s ease;transition:all 0.2s ease}.pds-filter__trigger pds-icon{block-size:var(--pine-font-size-100);color:var(--pine-color-text-secondary);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-font-size-100)}.pds-filter__trigger:hover,.pds-filter__trigger.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger:hover pds-icon,.pds-filter__trigger.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger:disabled{cursor:not-allowed;opacity:0.5}.pds-filter__trigger--selected{background-color:var(--pine-color-purple-050);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover,.pds-filter__trigger--selected.pds-filter__trigger--open{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover pds-icon,.pds-filter__trigger--selected.pds-filter__trigger--open pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--more{background-color:var(--pine-color-background-container-hover);border:var(--pine-border-width-thin) dashed var(--pine-color-border);color:var(--pine-color-text-tertiary)}.pds-filter__trigger--more pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:hover,.pds-filter__trigger--more.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger--more:hover pds-icon,.pds-filter__trigger--more.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--clear{background:transparent;border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-100);-webkit-box-shadow:none;box-shadow:none;color:var(--pine-color-purple-600)}.pds-filter__trigger--clear pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-100);color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__button-content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-050);max-inline-size:148px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__button-text{line-height:var(--pine-line-height-150);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__dropdown-icon{block-size:var(--pine-dimension-200);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-200)}.pds-filter__popover{background-color:var(--pine-color-background-container);border:0;border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);display:none;inline-size:228px;inset:unset;padding:var(--pine-dimension-100);z-index:var(--pine-z-index-overlay);}.pds-filter__popover:popover-open,.pds-filter__popover.is-open{display:block}.pds-filter__popover{}@supports (anchor-name: --test){.pds-filter__popover{inset-block-start:calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));inset-inline-start:anchor(--filter-trigger start);position:fixed;position-anchor:--filter-trigger;}.pds-filter__popover.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover{}.pds-filter__popover.is-open.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.is-open.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.is-open.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}}";
 const PdsFilter$1 = /*@__PURE__*/ proxyCustomElement(class PdsFilter extends HTMLElement {
     constructor(registerHost) {
@@ -243,14 +244,17 @@ const PdsFilter$1 = /*@__PURE__*/ proxyCustomElement(class PdsFilter extends HTM
         // Get dimensions for boundary detection
         const popoverWidth = 228;
         const popoverHeight = this.popoverEl.getBoundingClientRect().height || 200;
-        // Boundary detection for flipping
+        // Boundary detection for flipping (inline-end overflow respects document direction)
         const bufferSpace = 20;
-        const wouldOverflowRight = (triggerRect.left + popoverWidth + bufferSpace) > viewportWidth;
+        const isRtl = isRtlDirection(this.el);
+        const wouldOverflowInlineEnd = isRtl
+            ? (triggerRect.right - popoverWidth - bufferSpace) < 0
+            : (triggerRect.left + popoverWidth + bufferSpace) > viewportWidth;
         const wouldOverflowBottom = (triggerRect.bottom + 8 + popoverHeight + bufferSpace) > viewportHeight;
         if (supportsAnchorPositioning) {
             // Modern browsers: CSS anchor positioning + JavaScript-controlled flipping
             this.popoverEl.classList.remove('popover-flip-horizontal', 'popover-flip-vertical');
-            if (wouldOverflowRight) {
+            if (wouldOverflowInlineEnd) {
                 this.popoverEl.classList.add('popover-flip-horizontal');
             }
             if (wouldOverflowBottom) {
@@ -259,14 +263,14 @@ const PdsFilter$1 = /*@__PURE__*/ proxyCustomElement(class PdsFilter extends HTM
         }
         else {
             // Fallback browsers: JavaScript positioning with boundary detection
-            let left = triggerRect.left;
+            let left = isRtl ? triggerRect.right - popoverWidth : triggerRect.left;
             let top = triggerRect.bottom + 8;
-            let transformOrigin = 'top left';
+            let transformOrigin = isRtl ? 'top right' : 'top left';
             // Apply horizontal flipping if needed
-            if (wouldOverflowRight) {
+            if (wouldOverflowInlineEnd) {
                 const actualPopoverWidth = this.popoverEl.getBoundingClientRect().width || popoverWidth;
-                left = triggerRect.right - actualPopoverWidth;
-                transformOrigin = 'top right';
+                left = isRtl ? triggerRect.left : triggerRect.right - actualPopoverWidth;
+                transformOrigin = isRtl ? 'top left' : 'top right';
             }
             // Apply vertical flipping if needed
             if (wouldOverflowBottom) {
@@ -479,7 +483,7 @@ const PdsFilter$1 = /*@__PURE__*/ proxyCustomElement(class PdsFilter extends HTM
         return null;
     }
     render() {
-        return (h(Host, { key: 'e70f7bf3612c5c8abe7445ba3a4e53391a68de9e', id: this.componentId }, h("button", { key: '2cba723795c43509762f75cb4b6607ce547f7c39', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, h("span", { key: '8244dd35cc74c6f0138be2d3495d94b97f60474f', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (h("span", { key: 'd97c085d1df1ca13ccaf1f26ca2dac81bdfb105a', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (h("div", { key: '0b9daf4591ea20db06813ce4c39442d69af3fda1', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, h("slot", { key: 'f4499fe2d5a6a169318fe65cbbc558565c8644f9' })))));
+        return (h(Host, { key: '620b1e6b9ab4a16af9cf601381e3b3bc625677a9', id: this.componentId }, h("button", { key: '6c27edb5a9584e223f0716ae2c95cf07488a041b', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, h("span", { key: 'ef9970dc8d453d170703e90ba8690b652e11fa5c', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (h("span", { key: '8e71b9d19327117dbce1cf50d169699ab771d362', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (h("div", { key: 'e1eb24326d93b0247db0e11700286af74b6b19c1', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, h("slot", { key: '374f65b6dab21601c1bbd86cf661971a5c6d1d43' })))));
     }
     get el() { return this; }
     static get style() { return pdsFilterCss; }

package/components/pds-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pds-filter.js","mappings":"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","names":["PdsFilter","__stencil_proxyCustomElement"],"sources":["src/components/pds-filters/pds-filter/pds-filter.scss?tag=pds-filter&encapsulation=shadow","src/components/pds-filters/pds-filter/pds-filter.tsx"],"sourcesContent":[":host {\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n\n display: inline-block;\n position: relative;\n}\n\n.pds-filter__trigger {\n align-items: center;\n /* stylelint-disable-next-line property-no-unknown /\n anchor-name: --filter-trigger;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-100);\n box-shadow: var(--pine-box-shadow-050);\n box-sizing: border-box;\n color: var(--pine-color-text-tertiary);\n cursor: pointer;\n display: inline-flex;\n font-family: var(--pine-font-family-inter);\n font-size: var(--pine-font-size-100);\n font-weight: var(--pine-font-weight-400);\n gap: var(--pine-dimension-050);\n letter-spacing: var(--pine-letter-spacing-114);\n line-height: var(--pine-line-height-150);\n padding: var(--pine-dimension-025) var(--pine-dimension-125);\n position: relative;\n transition: all 0.2s ease;\n\n pds-icon {\n block-size: var(--pine-font-size-100);\n color: var(--pine-color-text-secondary);\n flex-shrink: 0;\n inline-size: var(--pine-font-size-100);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-background-subtle);\n border-color: var(--pine-color-border-hover);\n color: var(--pine-color-text-hover);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n}\n\n.pds-filter__trigger--selected {\n background-color: var(--pine-color-purple-050);\n border-color: var(--pine-color-purple-500);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-purple-100);\n border-color: var(--pine-color-purple-500);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__trigger--more {\n background-color: var(--pine-color-background-container-hover);\n border: var(--pine-border-width-thin) dashed var(--pine-color-border);\n color: var(--pine-color-text-tertiary);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-background-subtle);\n border-color: var(--pine-color-border-hover);\n color: var(--pine-color-text-hover);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__trigger--clear {\n background: transparent;\n border: var(--pine-border-width-thin) solid transparent;\n border-radius: var(--pine-dimension-100);\n box-shadow: none;\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n\n &:hover {\n background-color: var(--pine-color-purple-100);\n border-color: var(--pine-color-purple-100);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__button-content {\n align-items: center;\n display: inline-flex;\n gap: var(--pine-dimension-050);\n max-inline-size: 148px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-filter__button-text {\n line-height: var(--pine-line-height-150);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-filter__dropdown-icon {\n block-size: var(--pine-dimension-200);\n flex-shrink: 0;\n inline-size: var(--pine-dimension-200);\n}\n\n\n.pds-filter__popover {\n background-color: var(--pine-color-background-container);\n border: 0;\n border-radius: var(--pine-dimension-100);\n box-shadow: var(--pine-box-shadow-100);\n display: none;\n inline-size: 228px;\n inset: unset;\n padding: var(--pine-dimension-100);\n z-index: var(--pine-z-index-overlay);\n\n / stylelint-disable-next-line selector-pseudo-class-no-unknown /\n &:popover-open,\n &.is-open {\n display: block;\n }\n\n / Modern browsers: CSS anchor positioning with JavaScript-controlled flipping /\n @supports (anchor-name: --test) {\n inset-block-start: calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));\n inset-inline-start: anchor(--filter-trigger left);\n position: fixed; / Anchor positioning requires fixed positioning /\n / stylelint-disable-next-line property-no-unknown /\n position-anchor: --filter-trigger;\n\n / CSS position-try disabled for precise JavaScript-controlled flipping /\n\n / Flipping classes applied by JavaScript for precise control /\n &.popover-flip-horizontal {\n inset-inline-start: anchor(--filter-trigger right);\n transform: translateX(-100%);\n }\n\n &.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n &.popover-flip-horizontal.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n inset-inline-start: anchor(--filter-trigger right);\n transform: translate(-100%, calc(-100% - var(--pine-dimension-100)));\n }\n\n / Ensure fallback class works with flipping in modern browsers /\n &.is-open.popover-flip-horizontal {\n inset-inline-start: anchor(--filter-trigger right);\n transform: translateX(-100%);\n }\n\n &.is-open.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n &.is-open.popover-flip-horizontal.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n inset-inline-start: anchor(--filter-trigger right);\n transform: translate(-100%, calc(-100% - var(--pine-dimension-100)));\n }\n\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, State, Method, Listen } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\nimport type { PdsFilterOpenEventDetail, PdsFilterCloseEventDetail, PdsFilterClearEventDetail, PdsFilterVariant } from './filter-interface';\n\nimport { enlarge, trash } from '@pine-ds/icons/icons';\n\n/\n Individual filter component with cross-browser popover positioning.\n \n Uses a hybrid approach for optimal cross-browser compatibility:\n * - Modern browsers: CSS anchor positioning + JavaScript flip classes\n * - Fallback browsers: JavaScript positioning with viewport boundary detection\n \n @part button - Exposes the trigger button element for styling.\n * @part button-content - Exposes the button content container for styling.\n * @part button-text - Exposes the button text for styling.\n * @part icon - Exposes the icon component for styling.\n * @part popover - Exposes the popover container for styling.\n * @slot (default) - Popover content that will be displayed when the filter is open.\n /\n\n@Component({\n tag: 'pds-filter',\n styleUrl: 'pds-filter.scss',\n shadow: true,\n})\nexport class PdsFilter implements BasePdsProps {\n @Element() el!: HTMLPdsFilterElement;\n\n private popoverEl: HTMLElement;\n private scrollRAF: number \| null = null;\n private lastScrollTime = 0;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n The variant style of the filter trigger.\n * @defaultValue 'default'\n /\n @Prop() variant: PdsFilterVariant = 'default';\n\n /\n The name of the icon to display in the trigger button.\n * For 'clear' variant, this is ignored as it always shows trash icon.\n /\n @Prop() icon?: string;\n\n /\n The text content displayed in the trigger button.\n /\n @Prop() text?: string;\n\n\n /\n State to track if the popover is open.\n /\n @State() isOpen = false;\n\n /\n Event emitted when the filter popover is opened.\n /\n @Event() pdsFilterOpen: EventEmitter<PdsFilterOpenEventDetail>;\n\n /\n Event emitted when the filter popover is closed.\n /\n @Event() pdsFilterClose: EventEmitter<PdsFilterCloseEventDetail>;\n\n /\n Event emitted when the clear variant is clicked.\n /\n @Event() pdsFilterClear: EventEmitter<PdsFilterClearEventDetail>;\n\n\n /\n Component lifecycle: Clean up when disconnected from DOM.\n * Prevents memory leaks by canceling pending operations and closing popovers.\n /\n disconnectedCallback() {\n // Cancel pending animation frames\n if (this.scrollRAF) {\n cancelAnimationFrame(this.scrollRAF);\n this.scrollRAF = null;\n }\n\n this.lastScrollTime = 0;\n\n // Clean up native popover event listeners\n if (this.popoverEl) {\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n if (supportsPopoverAPI) {\n this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n }\n }\n\n // Ensure popover is closed\n if (this.isOpen && this.popoverEl) {\n try {\n this.popoverEl.hidePopover();\n } catch (error) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n }\n }\n\n\n componentDidRender() {\n // Note: popoverEl is set via ref callback in render method\n // For browsers with native popover API, we need direct element listeners\n // since the document listener may not capture native popover toggle events\n if (this.popoverEl) {\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n if (supportsPopoverAPI) {\n // Remove any existing listeners to avoid duplicates\n this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n // Add direct listener for native popover events\n this.popoverEl.addEventListener('toggle', this.handleNativePopoverToggle);\n }\n }\n }\n\n /\n Handle native popover toggle events directly on the element\n * This is needed for browsers with native Popover API support\n /\n private handleNativePopoverToggle = (event: Event) => {\n const target = event.target as HTMLElement;\n\n if (target && target.id === `${this.componentId}-popover`) {\n // Check current popover state\n let isCurrentlyOpen = false;\n try {\n isCurrentlyOpen = target.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isCurrentlyOpen = target.style.display === 'block';\n }\n\n // Update state\n this.isOpen = isCurrentlyOpen;\n\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 0);\n\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n };\n\n /\n Reposition popovers on window resize.\n /\n @Listen('resize', { target: 'window' })\n handleWindowResize() {\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 16);\n }\n }\n\n /\n Reposition popovers on scroll with performance throttling.\n /\n @Listen('scroll', { target: 'window', passive: true })\n handleWindowScroll() {\n if (this.isOpen) {\n const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n const now = performance.now();\n\n const throttleMs = supportsAnchorPositioning ? 66 : 33;\n if (now - this.lastScrollTime < throttleMs) {\n return;\n }\n\n this.lastScrollTime = now;\n\n if (this.scrollRAF) {\n cancelAnimationFrame(this.scrollRAF);\n }\n\n this.scrollRAF = requestAnimationFrame(() => {\n if (this.isOpen && this.popoverEl && this.el.isConnected) {\n this.adjustPopoverPosition();\n }\n this.scrollRAF = null;\n });\n }\n }\n\n /\n Closes other open filter popovers to ensure only one is open at a time.\n /\n private closeOtherPopovers() {\n const allFilters = document.querySelectorAll('pds-filter');\n\n allFilters.forEach((filter) => {\n if (filter === this.el) return;\n\n const popover = filter.shadowRoot?.querySelector('.pds-filter__popover') as HTMLElement;\n\n if (popover) {\n // Check for popover API support to avoid crashes\n let isPopoverOpen = false;\n try {\n isPopoverOpen = popover.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isPopoverOpen = popover.style.display === 'block';\n }\n\n if (isPopoverOpen) {\n try {\n popover.hidePopover();\n } catch (error) {\n popover.style.display = 'none';\n popover.classList.remove('is-open');\n }\n }\n }\n });\n }\n\n /\n Adjusts popover position to keep it within viewport bounds.\n * Uses CSS anchor positioning for modern browsers, JavaScript for fallback browsers.\n /\n private adjustPopoverPosition() {\n if (!this.popoverEl \|\| this.variant === 'clear') return;\n\n const triggerEl = this.el.shadowRoot?.querySelector('.pds-filter__trigger') as HTMLElement;\n if (!triggerEl) return;\n\n const triggerRect = triggerEl.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n\n // Get dimensions for boundary detection\n const popoverWidth = 228;\n const popoverHeight = this.popoverEl.getBoundingClientRect().height \|\| 200;\n\n // Boundary detection for flipping\n const bufferSpace = 20;\n const wouldOverflowRight = (triggerRect.left + popoverWidth + bufferSpace) > viewportWidth;\n const wouldOverflowBottom = (triggerRect.bottom + 8 + popoverHeight + bufferSpace) > viewportHeight;\n\n if (supportsAnchorPositioning) {\n // Modern browsers: CSS anchor positioning + JavaScript-controlled flipping\n this.popoverEl.classList.remove('popover-flip-horizontal', 'popover-flip-vertical');\n\n if (wouldOverflowRight) {\n this.popoverEl.classList.add('popover-flip-horizontal');\n }\n\n if (wouldOverflowBottom) {\n this.popoverEl.classList.add('popover-flip-vertical');\n }\n\n } else {\n // Fallback browsers: JavaScript positioning with boundary detection\n let left = triggerRect.left;\n let top = triggerRect.bottom + 8;\n let transformOrigin = 'top left';\n\n // Apply horizontal flipping if needed\n if (wouldOverflowRight) {\n const actualPopoverWidth = this.popoverEl.getBoundingClientRect().width \|\| popoverWidth;\n left = triggerRect.right - actualPopoverWidth;\n transformOrigin = 'top right';\n }\n\n // Apply vertical flipping if needed\n if (wouldOverflowBottom) {\n top = triggerRect.top - popoverHeight - 8;\n transformOrigin = transformOrigin.replace('top', 'bottom');\n }\n\n // Apply positioning in single DOM write for performance\n this.popoverEl.style.cssText = `\n position: fixed;\n left: ${left}px;\n top: ${top}px;\n z-index: var(--pine-z-index-overlay);\n transform-origin: ${transformOrigin};\n `;\n }\n }\n\n /\n Opens the filter popover programmatically.\n * Note: Clear variant does not support popover functionality.\n /\n @Method()\n async showFilter() {\n if (this.variant === 'clear') {\n console.warn('Clear variant does not support showFilter method');\n return;\n }\n\n if (this.popoverEl != null) {\n try {\n this.popoverEl.showPopover();\n } catch (error) {\n // Fallback for testing environment where showPopover is not available\n this.popoverEl.style.display = 'block';\n this.popoverEl.classList.add('is-open');\n }\n }\n }\n\n /\n Closes the filter popover programmatically.\n * Note: Clear variant does not support popover functionality.\n /\n @Method()\n async hideFilter() {\n if (this.variant === 'clear') {\n console.warn('Clear variant does not support hideFilter method');\n return;\n }\n\n if (this.popoverEl != null) {\n try {\n this.popoverEl.hidePopover();\n } catch (error) {\n // Fallback for testing environment where hidePopover is not available\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n }\n }\n\n /\n Listen for popover toggle events for browsers without native Popover API (fallback).\n * Native API browsers use direct element listeners to avoid conflicts.\n /\n @Listen('toggle', { target: 'document' })\n handlePopoverToggle(event: Event) {\n const target = event.target as HTMLElement;\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n // Only handle events for fallback browsers (Firefox) to avoid duplicate handling\n if (!supportsPopoverAPI && target && target.id === `${this.componentId}-popover`) {\n // Check for popover API support to avoid crashes\n let isCurrentlyOpen = false;\n try {\n isCurrentlyOpen = target.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isCurrentlyOpen = target.style.display === 'block';\n }\n\n // Update state\n this.isOpen = isCurrentlyOpen;\n\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 0);\n\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }\n\n /\n Listen for clicks to detect outside dismissal.\n /\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: Event) {\n // Check if click is outside and popover gets closed\n if (!this.el.contains(event.target as Node) && this.isOpen && this.variant !== 'clear') {\n setTimeout(() => {\n if (this.popoverEl && this.isOpen) {\n // Check for popover API support to avoid crashes\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n let popoverIsClosed = false;\n if (supportsPopoverAPI) {\n try {\n popoverIsClosed = !this.popoverEl.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n popoverIsClosed = this.popoverEl.style.display !== 'block';\n }\n } else {\n // Manual fallback - assume popover was closed by outside click\n popoverIsClosed = true;\n }\n\n if (popoverIsClosed) {\n this.isOpen = false;\n if (!supportsPopoverAPI) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n }\n\n /\n Listen for Escape key to ensure close event fires.\n /\n @Listen('keydown', { target: 'document' })\n handleEscapeKey(event: KeyboardEvent) {\n if (event.key === 'Escape' && this.isOpen && this.variant !== 'clear') {\n // Check if popover was closed by Escape\n setTimeout(() => {\n if (this.popoverEl && this.isOpen) {\n // Check for popover API support to avoid crashes\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n let popoverIsClosed = false;\n if (supportsPopoverAPI) {\n try {\n popoverIsClosed = !this.popoverEl.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n popoverIsClosed = this.popoverEl.style.display !== 'block';\n }\n } else {\n // Manual fallback - assume popover was closed by Escape\n popoverIsClosed = true;\n }\n\n if (popoverIsClosed) {\n this.isOpen = false;\n if (!supportsPopoverAPI) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n }\n\n /\n Handle keyboard interactions for clear variant only.\n /\n private handleKeyDown = (event: KeyboardEvent) => {\n // Only handle clear variant manually, let native API handle everything else\n if (this.variant === 'clear' && (event.key === 'Enter' \|\| event.key === ' ')) {\n event.preventDefault();\n this.handleClick();\n }\n };\n\n /\n Handle trigger button click. Clear variant emits event, others toggle popover.\n /\n private handleClick = (event?: Event) => {\n if (this.variant === 'clear') {\n this.pdsFilterClear.emit({\n componentId: this.componentId,\n text: this.text,\n });\n return;\n }\n\n this.closeOtherPopovers();\n\n // Check for popover API support\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n if (!supportsPopoverAPI) {\n // Manual fallback for browsers without popover API support\n // Prevent default to avoid conflicts with any native behavior\n if (event) {\n event.preventDefault();\n }\n\n setTimeout(() => {\n if (this.popoverEl != null) {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.popoverEl.style.display = 'block';\n this.popoverEl.classList.add('is-open');\n this.adjustPopoverPosition();\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n // For browsers with native popover API, let the native behavior handle the toggle\n // The toggle event listener will capture the state change and emit events\n };\n\n /\n Get the appropriate icon for the variant.\n /\n private getIcon() {\n if (this.variant === 'clear') {\n return trash;\n }\n return this.icon;\n }\n\n /\n Get CSS classes for the trigger button.\n /\n private getTriggerClasses() {\n const classes = ['pds-filter__trigger'];\n classes.push(`pds-filter__trigger--${this.variant}`);\n\n if (this.isOpen && this.variant !== 'clear') {\n classes.push('pds-filter__trigger--open');\n }\n\n return classes.join(' ');\n }\n\n /\n Render the trigger icon.\n /\n private renderIcon() {\n const iconToRender = this.getIcon();\n if (iconToRender == null \|\| iconToRender === '') return null;\n\n return (\n <pds-icon\n icon={iconToRender}\n size=\"var(--pine-font-size-100)\"\n aria-hidden=\"true\"\n part=\"icon\"\n />\n );\n }\n\n /\n Render the dropdown icon for selected variant.\n */\n private renderDropdownIcon() {\n if (this.variant === 'selected') {\n return (\n <pds-icon\n icon={enlarge}\n size=\"var(--pine-dimension-200)\"\n aria-hidden=\"true\"\n class=\"pds-filter__dropdown-icon\"\n part=\"icon\"\n />\n );\n }\n return null;\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <button\n class={this.getTriggerClasses()}\n type=\"button\"\n popoverTarget={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n popoverTargetAction={this.variant !== 'clear' ? 'toggle' : undefined}\n onKeyDown={this.variant === 'clear' ? this.handleKeyDown : undefined}\n onClick={(event) => this.handleClick(event)}\n part=\"button\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-haspopup={this.variant !== 'clear' ? 'true' : undefined}\n aria-controls={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n >\n <span class=\"pds-filter__button-content\" part=\"button-content\">\n {this.renderIcon()}\n {this.text && (\n <span class=\"pds-filter__button-text\" part=\"button-text\">\n {this.text}\n </span>\n )}\n {this.renderDropdownIcon()}\n </span>\n </button>\n\n {this.variant !== 'clear' && (\n <div\n ref={el => this.popoverEl = el}\n id={`${this.componentId}-popover`}\n class=\"pds-filter__popover\"\n popover=\"auto\"\n part=\"popover\"\n >\n <slot />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pds-filter.js","mappings":"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","names":["PdsFilter","__stencil_proxyCustomElement"],"sources":["src/components/pds-filters/pds-filter/pds-filter.scss?tag=pds-filter&encapsulation=shadow","src/components/pds-filters/pds-filter/pds-filter.tsx"],"sourcesContent":[":host {\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n\n display: inline-block;\n position: relative;\n}\n\n.pds-filter__trigger {\n align-items: center;\n /* stylelint-disable-next-line property-no-unknown /\n anchor-name: --filter-trigger;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-100);\n box-shadow: var(--pine-box-shadow-050);\n box-sizing: border-box;\n color: var(--pine-color-text-tertiary);\n cursor: pointer;\n display: inline-flex;\n font-family: var(--pine-font-family-inter);\n font-size: var(--pine-font-size-100);\n font-weight: var(--pine-font-weight-400);\n gap: var(--pine-dimension-050);\n letter-spacing: var(--pine-letter-spacing-114);\n line-height: var(--pine-line-height-150);\n padding: var(--pine-dimension-025) var(--pine-dimension-125);\n position: relative;\n transition: all 0.2s ease;\n\n pds-icon {\n block-size: var(--pine-font-size-100);\n color: var(--pine-color-text-secondary);\n flex-shrink: 0;\n inline-size: var(--pine-font-size-100);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-background-subtle);\n border-color: var(--pine-color-border-hover);\n color: var(--pine-color-text-hover);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n}\n\n.pds-filter__trigger--selected {\n background-color: var(--pine-color-purple-050);\n border-color: var(--pine-color-purple-500);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-purple-100);\n border-color: var(--pine-color-purple-500);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__trigger--more {\n background-color: var(--pine-color-background-container-hover);\n border: var(--pine-border-width-thin) dashed var(--pine-color-border);\n color: var(--pine-color-text-tertiary);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n\n &:hover,\n &.pds-filter__trigger--open {\n background-color: var(--pine-color-background-subtle);\n border-color: var(--pine-color-border-hover);\n color: var(--pine-color-text-hover);\n\n pds-icon {\n color: var(--pine-color-text-secondary);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__trigger--clear {\n background: transparent;\n border: var(--pine-border-width-thin) solid transparent;\n border-radius: var(--pine-dimension-100);\n box-shadow: none;\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n\n &:hover {\n background-color: var(--pine-color-purple-100);\n border-color: var(--pine-color-purple-100);\n color: var(--pine-color-purple-600);\n\n pds-icon {\n color: var(--pine-color-purple-600);\n }\n }\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n.pds-filter__button-content {\n align-items: center;\n display: inline-flex;\n gap: var(--pine-dimension-050);\n max-inline-size: 148px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-filter__button-text {\n line-height: var(--pine-line-height-150);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-filter__dropdown-icon {\n block-size: var(--pine-dimension-200);\n flex-shrink: 0;\n inline-size: var(--pine-dimension-200);\n}\n\n\n.pds-filter__popover {\n background-color: var(--pine-color-background-container);\n border: 0;\n border-radius: var(--pine-dimension-100);\n box-shadow: var(--pine-box-shadow-100);\n display: none;\n inline-size: 228px;\n inset: unset;\n padding: var(--pine-dimension-100);\n z-index: var(--pine-z-index-overlay);\n\n / stylelint-disable-next-line selector-pseudo-class-no-unknown /\n &:popover-open,\n &.is-open {\n display: block;\n }\n\n / Modern browsers: CSS anchor positioning with JavaScript-controlled flipping /\n @supports (anchor-name: --test) {\n inset-block-start: calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));\n inset-inline-start: anchor(--filter-trigger start);\n position: fixed; / Anchor positioning requires fixed positioning /\n / stylelint-disable-next-line property-no-unknown /\n position-anchor: --filter-trigger;\n\n / CSS position-try disabled for precise JavaScript-controlled flipping /\n\n / Flipping classes applied by JavaScript for precise control /\n &.popover-flip-horizontal {\n inset-inline-end: anchor(--filter-trigger end);\n inset-inline-start: auto;\n }\n\n &.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n &.popover-flip-horizontal.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n inset-inline-end: anchor(--filter-trigger end);\n inset-inline-start: auto;\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n / Ensure fallback class works with flipping in modern browsers /\n &.is-open.popover-flip-horizontal {\n inset-inline-end: anchor(--filter-trigger end);\n inset-inline-start: auto;\n }\n\n &.is-open.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n &.is-open.popover-flip-horizontal.popover-flip-vertical {\n inset-block-start: anchor(--filter-trigger top);\n inset-inline-end: anchor(--filter-trigger end);\n inset-inline-start: auto;\n transform: translateY(calc(-100% - var(--pine-dimension-100)));\n }\n\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, State, Method, Listen } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\nimport { isRtlDirection } from '@utils/scroll';\nimport type { PdsFilterOpenEventDetail, PdsFilterCloseEventDetail, PdsFilterClearEventDetail, PdsFilterVariant } from './filter-interface';\n\nimport { enlarge, trash } from '@pine-ds/icons/icons';\n\n/\n Individual filter component with cross-browser popover positioning.\n \n Uses a hybrid approach for optimal cross-browser compatibility:\n * - Modern browsers: CSS anchor positioning + JavaScript flip classes\n * - Fallback browsers: JavaScript positioning with viewport boundary detection\n \n @part button - Exposes the trigger button element for styling.\n * @part button-content - Exposes the button content container for styling.\n * @part button-text - Exposes the button text for styling.\n * @part icon - Exposes the icon component for styling.\n * @part popover - Exposes the popover container for styling.\n * @slot (default) - Popover content that will be displayed when the filter is open.\n /\n\n@Component({\n tag: 'pds-filter',\n styleUrl: 'pds-filter.scss',\n shadow: true,\n})\nexport class PdsFilter implements BasePdsProps {\n @Element() el!: HTMLPdsFilterElement;\n\n private popoverEl: HTMLElement;\n private scrollRAF: number \| null = null;\n private lastScrollTime = 0;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n The variant style of the filter trigger.\n * @defaultValue 'default'\n /\n @Prop() variant: PdsFilterVariant = 'default';\n\n /\n The name of the icon to display in the trigger button.\n * For 'clear' variant, this is ignored as it always shows trash icon.\n /\n @Prop() icon?: string;\n\n /\n The text content displayed in the trigger button.\n /\n @Prop() text?: string;\n\n\n /\n State to track if the popover is open.\n /\n @State() isOpen = false;\n\n /\n Event emitted when the filter popover is opened.\n /\n @Event() pdsFilterOpen: EventEmitter<PdsFilterOpenEventDetail>;\n\n /\n Event emitted when the filter popover is closed.\n /\n @Event() pdsFilterClose: EventEmitter<PdsFilterCloseEventDetail>;\n\n /\n Event emitted when the clear variant is clicked.\n /\n @Event() pdsFilterClear: EventEmitter<PdsFilterClearEventDetail>;\n\n\n /\n Component lifecycle: Clean up when disconnected from DOM.\n * Prevents memory leaks by canceling pending operations and closing popovers.\n /\n disconnectedCallback() {\n // Cancel pending animation frames\n if (this.scrollRAF) {\n cancelAnimationFrame(this.scrollRAF);\n this.scrollRAF = null;\n }\n\n this.lastScrollTime = 0;\n\n // Clean up native popover event listeners\n if (this.popoverEl) {\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n if (supportsPopoverAPI) {\n this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n }\n }\n\n // Ensure popover is closed\n if (this.isOpen && this.popoverEl) {\n try {\n this.popoverEl.hidePopover();\n } catch (error) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n }\n }\n\n\n componentDidRender() {\n // Note: popoverEl is set via ref callback in render method\n // For browsers with native popover API, we need direct element listeners\n // since the document listener may not capture native popover toggle events\n if (this.popoverEl) {\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n if (supportsPopoverAPI) {\n // Remove any existing listeners to avoid duplicates\n this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n // Add direct listener for native popover events\n this.popoverEl.addEventListener('toggle', this.handleNativePopoverToggle);\n }\n }\n }\n\n /\n Handle native popover toggle events directly on the element\n * This is needed for browsers with native Popover API support\n /\n private handleNativePopoverToggle = (event: Event) => {\n const target = event.target as HTMLElement;\n\n if (target && target.id === `${this.componentId}-popover`) {\n // Check current popover state\n let isCurrentlyOpen = false;\n try {\n isCurrentlyOpen = target.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isCurrentlyOpen = target.style.display === 'block';\n }\n\n // Update state\n this.isOpen = isCurrentlyOpen;\n\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 0);\n\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n };\n\n /\n Reposition popovers on window resize.\n /\n @Listen('resize', { target: 'window' })\n handleWindowResize() {\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 16);\n }\n }\n\n /\n Reposition popovers on scroll with performance throttling.\n /\n @Listen('scroll', { target: 'window', passive: true })\n handleWindowScroll() {\n if (this.isOpen) {\n const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n const now = performance.now();\n\n const throttleMs = supportsAnchorPositioning ? 66 : 33;\n if (now - this.lastScrollTime < throttleMs) {\n return;\n }\n\n this.lastScrollTime = now;\n\n if (this.scrollRAF) {\n cancelAnimationFrame(this.scrollRAF);\n }\n\n this.scrollRAF = requestAnimationFrame(() => {\n if (this.isOpen && this.popoverEl && this.el.isConnected) {\n this.adjustPopoverPosition();\n }\n this.scrollRAF = null;\n });\n }\n }\n\n /\n Closes other open filter popovers to ensure only one is open at a time.\n /\n private closeOtherPopovers() {\n const allFilters = document.querySelectorAll('pds-filter');\n\n allFilters.forEach((filter) => {\n if (filter === this.el) return;\n\n const popover = filter.shadowRoot?.querySelector('.pds-filter__popover') as HTMLElement;\n\n if (popover) {\n // Check for popover API support to avoid crashes\n let isPopoverOpen = false;\n try {\n isPopoverOpen = popover.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isPopoverOpen = popover.style.display === 'block';\n }\n\n if (isPopoverOpen) {\n try {\n popover.hidePopover();\n } catch (error) {\n popover.style.display = 'none';\n popover.classList.remove('is-open');\n }\n }\n }\n });\n }\n\n /\n Adjusts popover position to keep it within viewport bounds.\n * Uses CSS anchor positioning for modern browsers, JavaScript for fallback browsers.\n /\n private adjustPopoverPosition() {\n if (!this.popoverEl \|\| this.variant === 'clear') return;\n\n const triggerEl = this.el.shadowRoot?.querySelector('.pds-filter__trigger') as HTMLElement;\n if (!triggerEl) return;\n\n const triggerRect = triggerEl.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n\n // Get dimensions for boundary detection\n const popoverWidth = 228;\n const popoverHeight = this.popoverEl.getBoundingClientRect().height \|\| 200;\n\n // Boundary detection for flipping (inline-end overflow respects document direction)\n const bufferSpace = 20;\n const isRtl = isRtlDirection(this.el);\n const wouldOverflowInlineEnd = isRtl\n ? (triggerRect.right - popoverWidth - bufferSpace) < 0\n : (triggerRect.left + popoverWidth + bufferSpace) > viewportWidth;\n const wouldOverflowBottom = (triggerRect.bottom + 8 + popoverHeight + bufferSpace) > viewportHeight;\n\n if (supportsAnchorPositioning) {\n // Modern browsers: CSS anchor positioning + JavaScript-controlled flipping\n this.popoverEl.classList.remove('popover-flip-horizontal', 'popover-flip-vertical');\n\n if (wouldOverflowInlineEnd) {\n this.popoverEl.classList.add('popover-flip-horizontal');\n }\n\n if (wouldOverflowBottom) {\n this.popoverEl.classList.add('popover-flip-vertical');\n }\n\n } else {\n // Fallback browsers: JavaScript positioning with boundary detection\n let left = isRtl ? triggerRect.right - popoverWidth : triggerRect.left;\n let top = triggerRect.bottom + 8;\n let transformOrigin = isRtl ? 'top right' : 'top left';\n\n // Apply horizontal flipping if needed\n if (wouldOverflowInlineEnd) {\n const actualPopoverWidth = this.popoverEl.getBoundingClientRect().width \|\| popoverWidth;\n left = isRtl ? triggerRect.left : triggerRect.right - actualPopoverWidth;\n transformOrigin = isRtl ? 'top left' : 'top right';\n }\n\n // Apply vertical flipping if needed\n if (wouldOverflowBottom) {\n top = triggerRect.top - popoverHeight - 8;\n transformOrigin = transformOrigin.replace('top', 'bottom');\n }\n\n // Apply positioning in single DOM write for performance\n this.popoverEl.style.cssText = `\n position: fixed;\n left: ${left}px;\n top: ${top}px;\n z-index: var(--pine-z-index-overlay);\n transform-origin: ${transformOrigin};\n `;\n }\n }\n\n /\n Opens the filter popover programmatically.\n * Note: Clear variant does not support popover functionality.\n /\n @Method()\n async showFilter() {\n if (this.variant === 'clear') {\n console.warn('Clear variant does not support showFilter method');\n return;\n }\n\n if (this.popoverEl != null) {\n try {\n this.popoverEl.showPopover();\n } catch (error) {\n // Fallback for testing environment where showPopover is not available\n this.popoverEl.style.display = 'block';\n this.popoverEl.classList.add('is-open');\n }\n }\n }\n\n /\n Closes the filter popover programmatically.\n * Note: Clear variant does not support popover functionality.\n /\n @Method()\n async hideFilter() {\n if (this.variant === 'clear') {\n console.warn('Clear variant does not support hideFilter method');\n return;\n }\n\n if (this.popoverEl != null) {\n try {\n this.popoverEl.hidePopover();\n } catch (error) {\n // Fallback for testing environment where hidePopover is not available\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n }\n }\n\n /\n Listen for popover toggle events for browsers without native Popover API (fallback).\n * Native API browsers use direct element listeners to avoid conflicts.\n /\n @Listen('toggle', { target: 'document' })\n handlePopoverToggle(event: Event) {\n const target = event.target as HTMLElement;\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n // Only handle events for fallback browsers (Firefox) to avoid duplicate handling\n if (!supportsPopoverAPI && target && target.id === `${this.componentId}-popover`) {\n // Check for popover API support to avoid crashes\n let isCurrentlyOpen = false;\n try {\n isCurrentlyOpen = target.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n isCurrentlyOpen = target.style.display === 'block';\n }\n\n // Update state\n this.isOpen = isCurrentlyOpen;\n\n if (this.isOpen) {\n setTimeout(() => this.adjustPopoverPosition(), 0);\n\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }\n\n /\n Listen for clicks to detect outside dismissal.\n /\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: Event) {\n // Check if click is outside and popover gets closed\n if (!this.el.contains(event.target as Node) && this.isOpen && this.variant !== 'clear') {\n setTimeout(() => {\n if (this.popoverEl && this.isOpen) {\n // Check for popover API support to avoid crashes\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n let popoverIsClosed = false;\n if (supportsPopoverAPI) {\n try {\n popoverIsClosed = !this.popoverEl.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n popoverIsClosed = this.popoverEl.style.display !== 'block';\n }\n } else {\n // Manual fallback - assume popover was closed by outside click\n popoverIsClosed = true;\n }\n\n if (popoverIsClosed) {\n this.isOpen = false;\n if (!supportsPopoverAPI) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n }\n\n /\n Listen for Escape key to ensure close event fires.\n /\n @Listen('keydown', { target: 'document' })\n handleEscapeKey(event: KeyboardEvent) {\n if (event.key === 'Escape' && this.isOpen && this.variant !== 'clear') {\n // Check if popover was closed by Escape\n setTimeout(() => {\n if (this.popoverEl && this.isOpen) {\n // Check for popover API support to avoid crashes\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n let popoverIsClosed = false;\n if (supportsPopoverAPI) {\n try {\n popoverIsClosed = !this.popoverEl.matches(':popover-open');\n } catch (error) {\n // Fallback if :popover-open selector isn't supported\n popoverIsClosed = this.popoverEl.style.display !== 'block';\n }\n } else {\n // Manual fallback - assume popover was closed by Escape\n popoverIsClosed = true;\n }\n\n if (popoverIsClosed) {\n this.isOpen = false;\n if (!supportsPopoverAPI) {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n }\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n }\n\n /\n Handle keyboard interactions for clear variant only.\n /\n private handleKeyDown = (event: KeyboardEvent) => {\n // Only handle clear variant manually, let native API handle everything else\n if (this.variant === 'clear' && (event.key === 'Enter' \|\| event.key === ' ')) {\n event.preventDefault();\n this.handleClick();\n }\n };\n\n /\n Handle trigger button click. Clear variant emits event, others toggle popover.\n /\n private handleClick = (event?: Event) => {\n if (this.variant === 'clear') {\n this.pdsFilterClear.emit({\n componentId: this.componentId,\n text: this.text,\n });\n return;\n }\n\n this.closeOtherPopovers();\n\n // Check for popover API support\n const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n if (!supportsPopoverAPI) {\n // Manual fallback for browsers without popover API support\n // Prevent default to avoid conflicts with any native behavior\n if (event) {\n event.preventDefault();\n }\n\n setTimeout(() => {\n if (this.popoverEl != null) {\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n this.popoverEl.style.display = 'block';\n this.popoverEl.classList.add('is-open');\n this.adjustPopoverPosition();\n this.pdsFilterOpen.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n } else {\n this.popoverEl.style.display = 'none';\n this.popoverEl.classList.remove('is-open');\n this.pdsFilterClose.emit({\n componentId: this.componentId,\n variant: this.variant,\n text: this.text,\n });\n }\n }\n }, 0);\n }\n // For browsers with native popover API, let the native behavior handle the toggle\n // The toggle event listener will capture the state change and emit events\n };\n\n /\n Get the appropriate icon for the variant.\n /\n private getIcon() {\n if (this.variant === 'clear') {\n return trash;\n }\n return this.icon;\n }\n\n /\n Get CSS classes for the trigger button.\n /\n private getTriggerClasses() {\n const classes = ['pds-filter__trigger'];\n classes.push(`pds-filter__trigger--${this.variant}`);\n\n if (this.isOpen && this.variant !== 'clear') {\n classes.push('pds-filter__trigger--open');\n }\n\n return classes.join(' ');\n }\n\n /\n Render the trigger icon.\n /\n private renderIcon() {\n const iconToRender = this.getIcon();\n if (iconToRender == null \|\| iconToRender === '') return null;\n\n return (\n <pds-icon\n icon={iconToRender}\n size=\"var(--pine-font-size-100)\"\n aria-hidden=\"true\"\n part=\"icon\"\n />\n );\n }\n\n /\n Render the dropdown icon for selected variant.\n */\n private renderDropdownIcon() {\n if (this.variant === 'selected') {\n return (\n <pds-icon\n icon={enlarge}\n size=\"var(--pine-dimension-200)\"\n aria-hidden=\"true\"\n class=\"pds-filter__dropdown-icon\"\n part=\"icon\"\n />\n );\n }\n return null;\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <button\n class={this.getTriggerClasses()}\n type=\"button\"\n popoverTarget={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n popoverTargetAction={this.variant !== 'clear' ? 'toggle' : undefined}\n onKeyDown={this.variant === 'clear' ? this.handleKeyDown : undefined}\n onClick={(event) => this.handleClick(event)}\n part=\"button\"\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-haspopup={this.variant !== 'clear' ? 'true' : undefined}\n aria-controls={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n >\n <span class=\"pds-filter__button-content\" part=\"button-content\">\n {this.renderIcon()}\n {this.text && (\n <span class=\"pds-filter__button-text\" part=\"button-text\">\n {this.text}\n </span>\n )}\n {this.renderDropdownIcon()}\n </span>\n </button>\n\n {this.variant !== 'clear' && (\n <div\n ref={el => this.popoverEl = el}\n id={`${this.componentId}-popover`}\n class=\"pds-filter__popover\"\n popover=\"auto\"\n part=\"popover\"\n >\n <slot />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/components/pds-input.js CHANGED Viewed

@@ -9,7 +9,7 @@ const pdsInputTokensCss = ":host{--pine-input-color-background-danger:var(--pine
 const labelCss = ":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";
-const pdsInputCss = ":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);left:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);right:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([disabled=true])::part(prepend),:host([disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-moz-placeholder-shown{text-overflow:ellipsis}.pds-input__field:-ms-input-placeholder{text-overflow:ellipsis}.pds-input__field:placeholder-shown{text-overflow:ellipsis}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}";
+const pdsInputCss = ":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);inset-inline-start:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);inset-inline-end:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-end-start:var(--pds-input-border-radius);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pds-input-border-radius);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pds-input-border-radius);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pds-input-border-radius);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([aria-disabled=true])::part(prepend),:host([aria-disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-moz-placeholder-shown{text-overflow:ellipsis}.pds-input__field:-ms-input-placeholder{text-overflow:ellipsis}.pds-input__field:placeholder-shown{text-overflow:ellipsis}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}";
 const PdsInput$1 = /*@__PURE__*/ proxyCustomElement(class PdsInput extends HTMLElement {
     constructor(registerHost) {
@@ -297,7 +297,10 @@ const PdsInput$1 = /*@__PURE__*/ proxyCustomElement(class PdsInput extends HTMLE
             'has-prepend': this.hasPrepend,
             'has-append': this.hasAppend,
         };
-        return (h(Host, { key: 'ecf4cc212e5c3ebc18082b790803e6b2ccb8ca77', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, h("div", { key: 'acdf92a30068fc04a17816ec6d85295b47e512ee', class: "pds-input" }, label && (h("div", { key: 'cc804ec7ec9bb1e588863bdb636f2cc9d61108e0', class: "pds-input__label-wrapper" }, h("label", { key: 'c6d8e54070422bb9856978d17dc99e6633e98e23', htmlFor: componentId, class: "pds-input__label" }, h("span", { key: 'beee330abe246af7e256c42237d061b1e3ed34fe', class: this.hideLabel ? 'visually-hidden' : '' }, label, this.required && h("span", { key: 'd4b6792646b18514f9c5ab008467ebd8e009efa8', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), h("div", { key: '0c147663fad34fc1fd3b294dbe93dc0618f32664', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), h("input", Object.assign({ key: 'fcf07f3facc9494a9422ac5a54bbcd1dc083ce28', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": assignDescription(componentId, invalid, helperMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (h("p", { key: 'dbed2e91b2431beaf630460b5d042f4aa7532665', class: "pds-input__helper-message", id: messageId(componentId, 'helper') }, helperMessage)), errorMessage && (h("p", { key: 'ad14be8e2280b58742486cddba591355ed7d3df6', class: "pds-input__error-message", id: messageId(componentId, 'error') }, h("pds-icon", { key: '0badd7b84d29e826f3ca9bd1ad108823c24e3996', icon: danger, size: "small" }), errorMessage)))));
+        return (h(Host, { key: 'ecf4cc212e5c3ebc18082b790803e6b2ccb8ca77', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, h("div", { key: 'acdf92a30068fc04a17816ec6d85295b47e512ee', class: "pds-input" }, label && (h("div", { key: '4569f0b3761db89e85a090eff6af1c47cb562115', class: {
+                'pds-input__label-wrapper': true,
+                'visually-hidden': this.hideLabel,
+            } }, h("label", { key: '90b0a863d78115fa158429db11548fc2a9ee5ae6', htmlFor: componentId, class: "pds-input__label" }, h("span", { key: '3d440aaafc4daeffe45152cd23d27472d7ebf85a' }, label, this.required && h("span", { key: 'c7bf6ef6191e961a106b8885cab604aa89730eba', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), h("div", { key: '81f0b8a347bc9a06c753b9f31f5e30ac78e45adb', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), h("input", Object.assign({ key: '3785b396bf9174766973e8b19028e4dcecde19d9', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": assignDescription(componentId, invalid, helperMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (h("p", { key: 'e9e4aa936346811e0a5ca0fa5107f548b52fcc99', class: "pds-input__helper-message", id: messageId(componentId, 'helper') }, helperMessage)), errorMessage && (h("p", { key: 'ef3694246fa3d8f818da438e7ec4411dd56b084c', class: "pds-input__error-message", id: messageId(componentId, 'error') }, h("pds-icon", { key: '0e52079db701ca720cfa4d474107e55c85df5052', icon: danger, size: "small" }), errorMessage)))));
     }
     static get formAssociated() { return true; }
     get el() { return this; }

package/components/pds-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pds-input.js","mappings":"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","names":["PdsInput","__stencil_proxyCustomElement"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --pds-input-background: var(--pine-color-background-container);\n --pds-input-border-color: var(--pine-color-border);\n --pds-input-border-color-hover: var(--pine-color-border-hover);\n --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n --pds-input-border-radius: var(--pine-dimension-125);\n --pds-input-border-width: var(--pine-border-width-thin);\n --pds-input-padding-x: var(--pine-dimension-150);\n --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-strong);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n left: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n right: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line /\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line /\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line /\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line /\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n --pds-input-background: var(--pine-color-accent-disabled);\n --pds-input-border-color: var(--pine-color-accent);\n --pds-input-border-color-hover: var(--pine-color-accent-hover);\n --pds-input-text-color: var(--pine-color-text-accent);\n\n &::part(prefix),\n &::part(suffix) {\n color: var(--pine-color-text-accent);\n }\n\n .pds-input__field:focus-visible {\n outline-color: var(--pine-color-focus-ring);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-strong);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n\n :host-context([data-theme=\"dark\"]) & {\n border-color: var(--pine-color-red-950);\n }\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n &:placeholder-shown {\n text-overflow: ellipsis;\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n :host-context([data-theme=\"dark\"]) & {\n background-color: var(--pine-color-red-950);\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Custom styling for the search clear (x) button\n.pds-input__field::-webkit-search-cancel-button {\n appearance: none;\n background-color: var(--pds-input-placeholder-color);\n cursor: pointer;\n height: var(--pine-dimension-sm);\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");\n mask-size: contain;\n width: var(--pine-dimension-sm);\n}\n\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, isSpecTest, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/*\n @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n /\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsInput {\n\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n private prefixEl?: HTMLElement;\n private suffixEl?: HTMLElement;\n private focusedValue?: string \| number \| null;\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n private internals?: ElementInternals;\n private resizeObserver?: ResizeObserver;\n private hasLoaded = false;\n\n @Element() el!: HTMLPdsInputElement;\n\n /\n If true, the input has prefix content (non-focusable)\n /\n @State() hasPrefix = false;\n\n /\n If true, the input has suffix content (non-focusable)\n /\n @State() hasSuffix = false;\n\n /\n If true, the input has prepend content (focusable)\n /\n @State() hasPrepend = false;\n\n /\n If true, the input has append content (focusable)\n /\n @State() hasAppend = false;\n\n /\n If true, the input has action content in the label area\n /\n @State() hasAction = false;\n\n /\n Emitted when the input loses focus.\n /\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /\n Emitted when the value has changed.\n \n This event will not emit when programmatically setting the `value` property.\n /\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /\n Emitted when the input has focus.\n /\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when a keyboard input occurs.\n /\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /\n Emitted when a key is pressed down in the input.\n /\n @Event() pdsKeyDown!: EventEmitter<KeyboardEvent>;\n\n /\n Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n /\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /\n Specifies if and how the browser provides `autocomplete` assistance for the field.\n /\n @Prop() autocomplete: string;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n Sets the number of milliseconds to wait before updating the value.\n /\n @Prop() debounce?: number;\n\n /\n Determines whether or not the input field is disabled.\n /\n @Prop() disabled?: boolean;\n\n /\n Specifies the error message and provides an error-themed treatment to the field.\n /\n @Prop() errorMessage?: string;\n\n /\n Displays a message or hint below the input field.\n /\n @Prop() helperMessage?: string;\n\n /\n Determines whether or not the input field is invalid or throws an error.\n /\n @Prop() invalid?: boolean;\n\n /\n Text to be displayed as the input label.\n /\n @Prop() label?: string;\n\n /\n Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n /\n @Prop() hideLabel: boolean;\n\n /\n Specifies the maximum value for the input field.\n /\n @Prop() max?: string;\n\n /\n Specifies the maximum number of characters allowed in the input field.\n /\n @Prop() maxlength?: string;\n\n /\n Specifies the minimum value for the input field.\n /\n @Prop() min?: string;\n\n /\n Specifies the minimum number of characters allowed in the input field.\n /\n @Prop() minlength?: string;\n\n /\n Specifies the name. Submitted with the form name/value pair.\n /\n @Prop() name?: string;\n\n /\n Specifies the regular expression that the input value is checked against.\n /\n @Prop() pattern?: string;\n\n /\n Specifies a short hint that describes the expected value of the input field.\n /\n @Prop() placeholder?: string;\n\n /\n Determines whether or not the input field is readonly.\n /\n @Prop() readonly?: boolean;\n\n /\n Determines whether or not the input field is required.\n /\n @Prop() required?: boolean;\n\n /\n Works with the `min` and `max` attributes to define increments for the input field.\n /\n @Prop() step?: string;\n\n /\n Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n /\n @Prop() type = 'text';\n\n /\n The value of the input.\n /\n @Prop({mutable: true}) value?: string \| number \| null = '';\n\n /\n Determines whether or not the input field takes full width of its container.\n /\n @Prop() fullWidth?: boolean;\n\n /\n Applies highlight styling to the input field.\n /\n @Prop({ reflect: true }) highlight?: boolean;\n\n /\n Determines if the input has focus.\n /\n @State() hasFocus = false;\n\n private observeAddonResize() {\n if (typeof ResizeObserver === 'undefined') return;\n\n // Disconnect existing observer before creating a new one\n this.resizeObserver?.disconnect();\n\n this.resizeObserver = new ResizeObserver(() => {\n this.updateAddonWidths();\n });\n\n if (this.prefixEl) {\n this.resizeObserver.observe(this.prefixEl);\n }\n\n if (this.suffixEl) {\n this.resizeObserver.observe(this.suffixEl);\n }\n }\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n\n // Re-establish ResizeObserver after DOM reconnection\n // Only run if component has already loaded (refs are available)\n if (this.hasLoaded && !this.resizeObserver) {\n this.updateAddonWidths();\n this.observeAddonResize();\n }\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = undefined;\n }\n\n componentDidLoad() {\n this.hasLoaded = true;\n this.debounceChanged();\n this.updateAddonWidths();\n this.observeAddonResize();\n // Set initial form value\n this.updateFormValue();\n }\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /\n If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n /\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n\n // Update form value when value changes\n this.updateFormValue();\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value \|\| '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement \| null;\n if (input) {\n this.value = input.value \|\| '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /\n Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n /\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n private onKeyDownEvent = (ev: KeyboardEvent) => {\n this.pdsKeyDown.emit(ev);\n };\n\n /\n Emits a pdsChange event\n /\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /\n Emits a `pdsInput` event\n /\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /\n Updates the form value using ElementInternals API\n /\n private updateFormValue() {\n if (isSpecTest()) return;\n\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value \|\| null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /\n Form Associated Custom Elements API: Called when the form is reset\n /\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /\n Form Associated Custom Elements API: Called when the form is disabled\n /\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /\n Form Associated Custom Elements API: Called to restore form state\n /\n formStateRestoreCallback(state: string \| FormData \| null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid \|\| !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div class=\"pds-input__label-wrapper\">\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onKeyDown={this.onKeyDownEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pds-input.js","mappings":"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","names":["PdsInput","__stencil_proxyCustomElement"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --pds-input-background: var(--pine-color-background-container);\n --pds-input-border-color: var(--pine-color-border);\n --pds-input-border-color-hover: var(--pine-color-border-hover);\n --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n --pds-input-border-radius: var(--pine-dimension-125);\n --pds-input-border-width: var(--pine-border-width-thin);\n --pds-input-padding-x: var(--pine-dimension-150);\n --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-strong);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n inset-inline-start: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n inset-inline-end: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line /\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line /\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line /\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-end-start: var(--pds-input-border-radius);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pds-input-border-radius);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line /\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pds-input-border-radius);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pds-input-border-radius);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([aria-disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n --pds-input-background: var(--pine-color-accent-disabled);\n --pds-input-border-color: var(--pine-color-accent);\n --pds-input-border-color-hover: var(--pine-color-accent-hover);\n --pds-input-text-color: var(--pine-color-text-accent);\n\n &::part(prefix),\n &::part(suffix) {\n color: var(--pine-color-text-accent);\n }\n\n .pds-input__field:focus-visible {\n outline-color: var(--pine-color-focus-ring);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-strong);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n\n :host-context([data-theme=\"dark\"]) & {\n border-color: var(--pine-color-red-950);\n }\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n &:placeholder-shown {\n text-overflow: ellipsis;\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n :host-context([data-theme=\"dark\"]) & {\n background-color: var(--pine-color-red-950);\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Custom styling for the search clear (x) button\n.pds-input__field::-webkit-search-cancel-button {\n appearance: none;\n background-color: var(--pds-input-placeholder-color);\n cursor: pointer;\n height: var(--pine-dimension-sm);\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");\n mask-size: contain;\n width: var(--pine-dimension-sm);\n}\n\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, isSpecTest, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/*\n @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n /\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsInput {\n\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n private prefixEl?: HTMLElement;\n private suffixEl?: HTMLElement;\n private focusedValue?: string \| number \| null;\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n private internals?: ElementInternals;\n private resizeObserver?: ResizeObserver;\n private hasLoaded = false;\n\n @Element() el!: HTMLPdsInputElement;\n\n /\n If true, the input has prefix content (non-focusable)\n /\n @State() hasPrefix = false;\n\n /\n If true, the input has suffix content (non-focusable)\n /\n @State() hasSuffix = false;\n\n /\n If true, the input has prepend content (focusable)\n /\n @State() hasPrepend = false;\n\n /\n If true, the input has append content (focusable)\n /\n @State() hasAppend = false;\n\n /\n If true, the input has action content in the label area\n /\n @State() hasAction = false;\n\n /\n Emitted when the input loses focus.\n /\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /\n Emitted when the value has changed.\n \n This event will not emit when programmatically setting the `value` property.\n /\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /\n Emitted when the input has focus.\n /\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when a keyboard input occurs.\n /\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /\n Emitted when a key is pressed down in the input.\n /\n @Event() pdsKeyDown!: EventEmitter<KeyboardEvent>;\n\n /\n Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n /\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /\n Specifies if and how the browser provides `autocomplete` assistance for the field.\n /\n @Prop() autocomplete: string;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n Sets the number of milliseconds to wait before updating the value.\n /\n @Prop() debounce?: number;\n\n /\n Determines whether or not the input field is disabled.\n /\n @Prop() disabled?: boolean;\n\n /\n Specifies the error message and provides an error-themed treatment to the field.\n /\n @Prop() errorMessage?: string;\n\n /\n Displays a message or hint below the input field.\n /\n @Prop() helperMessage?: string;\n\n /\n Determines whether or not the input field is invalid or throws an error.\n /\n @Prop() invalid?: boolean;\n\n /\n Text to be displayed as the input label.\n /\n @Prop() label?: string;\n\n /\n Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n /\n @Prop() hideLabel: boolean;\n\n /\n Specifies the maximum value for the input field.\n /\n @Prop() max?: string;\n\n /\n Specifies the maximum number of characters allowed in the input field.\n /\n @Prop() maxlength?: string;\n\n /\n Specifies the minimum value for the input field.\n /\n @Prop() min?: string;\n\n /\n Specifies the minimum number of characters allowed in the input field.\n /\n @Prop() minlength?: string;\n\n /\n Specifies the name. Submitted with the form name/value pair.\n /\n @Prop() name?: string;\n\n /\n Specifies the regular expression that the input value is checked against.\n /\n @Prop() pattern?: string;\n\n /\n Specifies a short hint that describes the expected value of the input field.\n /\n @Prop() placeholder?: string;\n\n /\n Determines whether or not the input field is readonly.\n /\n @Prop() readonly?: boolean;\n\n /\n Determines whether or not the input field is required.\n /\n @Prop() required?: boolean;\n\n /\n Works with the `min` and `max` attributes to define increments for the input field.\n /\n @Prop() step?: string;\n\n /\n Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n /\n @Prop() type = 'text';\n\n /\n The value of the input.\n /\n @Prop({mutable: true}) value?: string \| number \| null = '';\n\n /\n Determines whether or not the input field takes full width of its container.\n /\n @Prop() fullWidth?: boolean;\n\n /\n Applies highlight styling to the input field.\n /\n @Prop({ reflect: true }) highlight?: boolean;\n\n /\n Determines if the input has focus.\n /\n @State() hasFocus = false;\n\n private observeAddonResize() {\n if (typeof ResizeObserver === 'undefined') return;\n\n // Disconnect existing observer before creating a new one\n this.resizeObserver?.disconnect();\n\n this.resizeObserver = new ResizeObserver(() => {\n this.updateAddonWidths();\n });\n\n if (this.prefixEl) {\n this.resizeObserver.observe(this.prefixEl);\n }\n\n if (this.suffixEl) {\n this.resizeObserver.observe(this.suffixEl);\n }\n }\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n\n // Re-establish ResizeObserver after DOM reconnection\n // Only run if component has already loaded (refs are available)\n if (this.hasLoaded && !this.resizeObserver) {\n this.updateAddonWidths();\n this.observeAddonResize();\n }\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = undefined;\n }\n\n componentDidLoad() {\n this.hasLoaded = true;\n this.debounceChanged();\n this.updateAddonWidths();\n this.observeAddonResize();\n // Set initial form value\n this.updateFormValue();\n }\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /\n If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n /\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n\n // Update form value when value changes\n this.updateFormValue();\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value \|\| '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement \| null;\n if (input) {\n this.value = input.value \|\| '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /\n Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n /\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n private onKeyDownEvent = (ev: KeyboardEvent) => {\n this.pdsKeyDown.emit(ev);\n };\n\n /\n Emits a pdsChange event\n /\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /\n Emits a `pdsInput` event\n /\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /\n Updates the form value using ElementInternals API\n /\n private updateFormValue() {\n if (isSpecTest()) return;\n\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value \|\| null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /\n Form Associated Custom Elements API: Called when the form is reset\n /\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /\n Form Associated Custom Elements API: Called when the form is disabled\n /\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /\n Form Associated Custom Elements API: Called to restore form state\n /\n formStateRestoreCallback(state: string \| FormData \| null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid \|\| !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div\n class={{\n 'pds-input__label-wrapper': true,\n 'visually-hidden': this.hideLabel,\n }}\n >\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onKeyDown={this.onKeyDownEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}