npm - @pine-ds/core - Versions diffs - 3.4.0 → 3.4.1 - Mend

@pine-ds/core 3.4.0 → 3.4.1

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

package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsDropdownMenuSeparatorCss = ":host hr{border:1px solid var(--pine-color-border);margin-block:var(--pine-dimension-xs)}";

package/dist/cjs/pds-dropdown-menu.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 var floatingUi_dom = require('./floating-ui.dom-Bz4BD-cr.js');
 const pdsDropdownMenuCss = ":host{display:block}.is-hidden{display:none}.pds-dropdown-menu--panel{background-color:var(--pine-color-background-container);left:var(--pine-dimension-none);min-width:170px;padding:var(--pine-dimension-xs);position:absolute;z-index:9999}";

package/dist/cjs/pds-icon.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 let missingAssetPathWarning = false;
 /**

package/dist/cjs/pds-image.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsImageCss = ":host{--dimension-aspect-ratio:auto;display:inline-block}img{aspect-ratio:var(--dimension-aspect-ratio);display:block;height:auto;max-width:100%}";

package/dist/cjs/pds-input.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 var form = require('./form-Bx4nzJBo.js');
 var attributes = require('./attributes-oNMnBEnP.js');
 var utils = require('./utils-jWx-Mf12.js');
@@ -10,7 +10,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:var(--pine-dimension-xs);--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-active);--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:calc(var(--pine-dimension-450) + 2px);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 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:1}: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}: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-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-min-height:var(--pine-dimension-450)}: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-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-min-height:var(--pine-dimension-450)}: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:var(--pine-dimension-450)}: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:var(--pine-dimension-450)}: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([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)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs)}.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-active);-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)}.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)}: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)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-input__error-message,.pds-input__helper-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{-ms-flex-align:center;align-items:center;color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";
+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-active);--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 #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 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:1}: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}: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-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-min-height:var(--pine-dimension-450)}: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-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-min-height:var(--pine-dimension-450)}: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)}.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-active);-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)}.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)}: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)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm);-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{-ms-flex-align:center;align-items:center;color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";
 const PdsInput = class {
     constructor(hostRef) {
@@ -154,9 +154,17 @@ const PdsInput = class {
         // Store the original pdsInput event emitter
         this.originalPdsInput = this.pdsInput;
     }
+    connectedCallback() {
+        // Initialize ElementInternals for form association
+        if (this.el.attachInternals) {
+            this.internals = this.el.attachInternals();
+        }
+    }
     componentDidLoad() {
         this.debounceChanged();
         this.updateAddonWidths();
+        // Set initial form value
+        this.updateFormValue();
     }
     componentDidUpdate() {
         this.updateAddonWidths();
@@ -175,6 +183,8 @@ const PdsInput = class {
         if (nativeInput && nativeInput.value !== value && !this.isComposing) {
             nativeInput.value = value;
         }
+        // Update form value when value changes
+        this.updateFormValue();
     }
     getValue() {
         return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();
@@ -197,6 +207,47 @@ const PdsInput = class {
         const newValue = value == null ? value : value.toString();
         this.pdsInput.emit({ value: newValue, event });
     }
+    /**
+     * Updates the form value using ElementInternals API
+     */
+    updateFormValue() {
+        if (this.internals && this.internals.setFormValue) {
+            const value = this.getValue();
+            this.internals.setFormValue(value || null);
+            // Set validity based on native input validation
+            if (this.nativeInput && this.internals && this.internals.setValidity) {
+                this.internals.setValidity(this.nativeInput.validity, this.nativeInput.validationMessage, this.nativeInput);
+            }
+        }
+    }
+    /**
+     * Form Associated Custom Elements API: Called when the form is reset
+     */
+    formResetCallback() {
+        this.value = '';
+        this.updateFormValue();
+    }
+    /**
+     * Form Associated Custom Elements API: Called when the form is disabled
+     */
+    formDisabledCallback(disabled) {
+        this.disabled = disabled;
+    }
+    /**
+     * Form Associated Custom Elements API: Called to restore form state
+     */
+    formStateRestoreCallback(state) {
+        if (typeof state === 'string') {
+            this.value = state;
+        }
+        else if (state instanceof FormData && this.name) {
+            // Extract value from FormData using the input's name
+            const value = state.get(this.name);
+            if (typeof value === 'string') {
+                this.value = value;
+            }
+        }
+    }
     render() {
         const { componentId, disabled, errorMessage, helperMessage, invalid = false, label, } = this;
         const value = this.getValue();
@@ -210,8 +261,9 @@ const PdsInput = class {
             'has-prepend': this.hasPrepend,
             'has-append': this.hasAppend,
         };
-        return (index.h(index.Host, { key: 'a8cf9aaa6dc90cb0790a7cad75603a2ebf48451a', "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 ? 'true' : null }, index.h("div", { key: '355f87099825b4db4d97500dac2b94a5892a3981', class: "pds-input" }, label && (index.h("div", { key: 'ee7bdec715478f0945cd1bf6ba435c50e885ebda', class: "pds-input__label-wrapper" }, index.h("label", { key: '56622a09c8f7313f8c2276363ded8efd2e985fb7', htmlFor: componentId, class: "pds-input__label" }, label, this.required && index.h("span", { key: 'fb95186cd446e4d338822840423566110ac9dbd0', class: "pds-input__required-indicator" }, " *")), this.renderAction())), index.h("div", { key: 'c7b209515121ab4e44f054eb817f61e6d9241323', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), index.h("input", Object.assign({ key: '02f8238ee2b87b7484da0b4b5282ce22c7dd3de1', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": form.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, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (index.h("p", { key: 'b93e6b54755d300e9093ac78854b52d296703a00', class: "pds-input__helper-message", id: form.messageId(componentId, 'helper') }, helperMessage)), errorMessage && (index.h("p", { key: 'bc16a204c2ad99b28759cde1f066b6ba790a5c80', class: "pds-input__error-message", id: form.messageId(componentId, 'error') }, index.h("pds-icon", { key: '354293fa6512ff16603e7190a4131096f58ca819', icon: index$1.danger, size: "small" }), errorMessage)))));
+        return (index.h(index.Host, { key: 'eac6a9c04f98b10e4eb6cb3eee49c7ecf4e2d8a2', "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 ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, index.h("div", { key: 'f67b518f3debb5f21cf48bd573126962d81deff5', class: "pds-input" }, label && (index.h("div", { key: 'a45a7bd41f7d3f8009d2bbf6bcc432c45c0fc733', class: "pds-input__label-wrapper" }, index.h("label", { key: '31b41266335a5197313d6aa44c277de57afe2f54', htmlFor: componentId, class: "pds-input__label" }, label, this.required && index.h("span", { key: '4113f0e0e85cb81c5a501e52b3489b125fdb1cbf', class: "pds-input__required-indicator" }, " *")), this.renderAction())), index.h("div", { key: 'ea99ed08f755dc72517fb1594054250a492340d0', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), index.h("input", Object.assign({ key: 'b48f1ccb88fdaa96b9e81cb1c459d3bfd1b512e0', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": form.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, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (index.h("p", { key: '3f84a41082d20917d9ab85051cdfbb7c2a6407ee', class: "pds-input__helper-message", id: form.messageId(componentId, 'helper') }, helperMessage)), errorMessage && (index.h("p", { key: 'd991dfdfc44a41640ef0070ce17e52b3f86b7782', class: "pds-input__error-message", id: form.messageId(componentId, 'error') }, index.h("pds-icon", { key: '5ea499d7d2f5ff2602dbf39f81df59c06116c6d2', icon: index$1.danger, size: "small" }), errorMessage)))));
     }
+    static get formAssociated() { return true; }
     get el() { return index.getElement(this); }
     static get watchers() { return {
         "debounce": ["debounceChanged"],

package/dist/cjs/pds-input.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pds-input.entry.cjs.js","mappings":"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","names":["h","inheritAriaAttributes","debounceEvent","Host","assignDescription","messageId","danger"],"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: var(--pine-dimension-xs);\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-active);\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: calc(var(--pine-dimension-450) + 2px);\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 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: 1;\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 }\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-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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: var(--pine-dimension-450);\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: var(--pine-dimension-450);\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([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.pds-input {\n display: flex;\n flex-direction: column;\n gap: var(--pine-dimension-2xs);\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-active);\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\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\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 .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-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 align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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})\nexport class PdsInput {\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\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 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 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 if the input has focus.\n /\n @State() hasFocus = false;\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 componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\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\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 /\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 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 ? '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 {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </label>\n {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 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.entry.cjs.js","mappings":"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","names":["h","inheritAriaAttributes","debounceEvent","Host","assignDescription","messageId","danger"],"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-active);\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 #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 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: 1;\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 }\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-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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.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-active);\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\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\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 .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\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);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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\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 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 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 Determines if the input has focus.\n /\n @State() hasFocus = false;\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\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n // Set initial form value\n this.updateFormValue();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\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 /\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 (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 ? '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 {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </label>\n {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 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}

package/dist/cjs/pds-input.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-input.entry.cjs.js","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: var(--pine-dimension-xs);\n --pds-input-font: var(--pine-typography-body);\n --pds-input-text-color: var(--pine-color-text-active);\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: calc(var(--pine-dimension-450) + 2px);\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 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: 1;\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 }\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-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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: var(--pine-dimension-450);\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: var(--pine-dimension-450);\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([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.pds-input {\n display: flex;\n flex-direction: column;\n gap: var(--pine-dimension-2xs);\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-active);\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\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\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 .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-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 align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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})\nexport class PdsInput {\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\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 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 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 if the input has focus.\n /\n @State() hasFocus = false;\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 componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\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\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 /\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 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 ? '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 {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </label>\n {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 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"],"names":["h","inheritAriaAttributes","debounceEvent","Host","assignDescription","messageId","danger"],"mappings":"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"}
1	+ {"version":3,"file":"pds-input.entry.cjs.js","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-active);\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 #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 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: 1;\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 }\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-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-min-height: var(--pine-dimension-450);\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.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-active);\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\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\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 .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\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);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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\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 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 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 Determines if the input has focus.\n /\n @State() hasFocus = false;\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\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n this.updateAddonWidths();\n // Set initial form value\n this.updateFormValue();\n }\n\n componentDidUpdate() {\n this.updateAddonWidths();\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 /\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 (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 ? '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 {label}\n {this.required && <span class=\"pds-input__required-indicator\"> </span>}\n </label>\n {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 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"],"names":["h","inheritAriaAttributes","debounceEvent","Host","assignDescription","messageId","danger"],"mappings":"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"}

package/dist/cjs/pds-link.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 var utils = require('./utils-jWx-Mf12.js');
 var index$1 = require('./index-BfqrB2cC.js');

package/dist/cjs/pds-loader.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsLoaderCss = ":host{--loader-color:var(--pine-color-brand);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-xs)}:host(.pds-loader--hidden),.pds-loader--hidden{border-width:0;clip:rect(0, 0, 0, 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-loader--spinner svg{--number-spinner-timing:2s;--number-spinner-path-timing:1.5s;-webkit-animation:rotate var(--number-spinner-timing) linear infinite;animation:rotate var(--number-spinner-timing) linear infinite;color:var(--loader-color)}.pds-loader__spinner-path{stroke-width:8px}@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.pds-loader--typing{--number-typing-timing:1s;--opacity-typing-dot-default:0.4;--opacity-typing-dot-active:1;-ms-flex-align:center;align-items:center;background-color:var(--pine-color-background-container-disabled);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-2xs);margin-block:var(--pine-dimension-none);margin-inline:auto;padding-block:15px;padding-inline:20px;position:relative}.pds-loader--typing span{background-color:var(--pine-color-border-hover);block-size:6px;border-radius:var(--pine-border-radius-full);inline-size:6px;opacity:var(--opacity-typing-dot-default)}.pds-loader--typing span:nth-of-type(1){-webkit-animation:var(--number-typing-timing) typing infinite 0.3333s;animation:var(--number-typing-timing) typing infinite 0.3333s}.pds-loader--typing span:nth-of-type(2){-webkit-animation:var(--number-typing-timing) typing infinite 0.6666s;animation:var(--number-typing-timing) typing infinite 0.6666s}.pds-loader--typing span:nth-of-type(3){-webkit-animation:var(--number-typing-timing) typing infinite 0.9999s;animation:var(--number-typing-timing) typing infinite 0.9999s}@-webkit-keyframes typing{50%{opacity:var(--opacity-typing-dot-active);-webkit-transform:scale(1.25);transform:scale(1.25)}}@keyframes typing{50%{opacity:var(--opacity-typing-dot-active);-webkit-transform:scale(1.25);transform:scale(1.25)}}.pds-loader__label{--typography-label-default:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-body);font:var(--typography-label-default)}";

package/dist/cjs/pds-modal-content.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsModalContentCss = "pds-modal-content{display:block;-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;width:100%}pds-modal-content:has(.pds-modal-content--border-none){border:0}pds-modal-content:has(.pds-modal-content--border-both){-webkit-border-after:1px solid var(--pine-color-grey-200);border-block-end:1px solid var(--pine-color-grey-200);-webkit-border-before:1px solid var(--pine-color-grey-200);border-block-start:1px solid var(--pine-color-grey-200)}pds-modal-content:has(.pds-modal-content--border-top){-webkit-border-before:1px solid var(--pine-color-grey-200);border-block-start:1px solid var(--pine-color-grey-200)}pds-modal-content:has(.pds-modal-content--border-bottom){-webkit-border-after:1px solid var(--pine-color-grey-200);border-block-end:1px solid var(--pine-color-grey-200)}.pds-modal-content{display:block;-ms-flex:1 1 auto;flex:1 1 auto;min-height:0;overflow-y:auto;width:100%}";

package/dist/cjs/pds-modal-footer.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsModalFooterCss = "pds-modal-footer{display:block;width:100%}.pds-modal__footer{width:100%}";

package/dist/cjs/pds-modal-header.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
 const pdsModalHeaderCss = "pds-modal-header{display:block;width:100%}.pds-modal__header{width:100%}";

package/dist/cjs/pds-modal.cjs.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
-var index = require('./index-CxX7ua5d.js');
+var index = require('./index-g-uSeICs.js');
-const pdsModalCss = ".pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity 0.2s ease, visibility 0.2s ease;transition:opacity 0.2s ease, visibility 0.2s ease;visibility:hidden;width:100%;z-index:1000}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:1001}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop.open{opacity:1;visibility:visible}.pds-modal{background:var(--pine-color-background-container);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:calc(100vh - (6vh + 96px));width:100%}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}";
+const pdsModalCss = ".pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity 0.2s ease, visibility 0.2s ease;transition:opacity 0.2s ease, visibility 0.2s ease;visibility:hidden;width:100%;z-index:1000}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:1001}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop.open{opacity:1;visibility:visible}.pds-modal{background:var(--pine-color-background-container);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:calc(100vh - (5vh + 96px));width:100%}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}";
 const PdsModal = class {
     constructor(hostRef) {