@pine-ds/core 3.16.1 → 3.16.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/form.js +2 -0
- package/components/form.js.map +1 -1
- package/components/pds-button2.js +10 -16
- package/components/pds-button2.js.map +1 -1
- package/components/pds-dropdown-menu-item.js +2 -2
- package/components/pds-dropdown-menu-item.js.map +1 -1
- package/components/pds-dropdown-menu.js +1 -1
- package/components/pds-dropdown-menu.js.map +1 -1
- package/dist/cjs/{form-hmpgbT1I.js → form-DUqlzovE.js} +4 -2
- package/dist/{esm-es5/form-DwjNklzi.js.map → cjs/form-DUqlzovE.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +10 -16
- package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu-item.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-input.cjs.entry.js +1 -1
- package/dist/cjs/pds-multiselect.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +1 -1
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/collection/components/pds-button/pds-button.css +3 -0
- package/dist/collection/components/pds-button/pds-button.js +9 -15
- package/dist/collection/components/pds-button/pds-button.js.map +1 -1
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js +2 -2
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js.map +1 -1
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.css +4 -4
- package/dist/collection/utils/form.js +2 -0
- package/dist/collection/utils/form.js.map +1 -1
- package/dist/docs.json +2 -2
- package/dist/esm/{form-DwjNklzi.js → form-CN-lL5QG.js} +4 -2
- package/dist/esm/{form-DwjNklzi.js.map → form-CN-lL5QG.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pds-button.entry.js +10 -16
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu-item.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu-item.entry.js.map +1 -1
- package/dist/esm/pds-dropdown-menu.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu.entry.js.map +1 -1
- package/dist/esm/pds-input.entry.js +1 -1
- package/dist/esm/pds-multiselect.entry.js +1 -1
- package/dist/esm/pds-radio-group.entry.js +1 -1
- package/dist/esm/pds-radio.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js +1 -1
- package/dist/esm/pds-textarea.entry.js +1 -1
- package/dist/esm/pine-core.js +1 -1
- package/dist/esm-es5/form-CN-lL5QG.js +2 -0
- package/dist/{cjs/form-hmpgbT1I.js.map → esm-es5/form-CN-lL5QG.js.map} +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu-item.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu-item.entry.js.map +1 -1
- package/dist/esm-es5/pds-dropdown-menu.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu.entry.js.map +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-multiselect.entry.js +1 -1
- package/dist/esm-es5/pds-radio-group.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/pine-core/{p-f94ae58d.system.entry.js → p-01aec1ad.system.entry.js} +2 -2
- package/dist/pine-core/{p-f03f4602.system.entry.js → p-0b52923b.system.entry.js} +2 -2
- package/dist/pine-core/{p-bfac5114.entry.js → p-15e554ae.entry.js} +2 -2
- package/dist/pine-core/{p-09ff71ad.system.entry.js → p-23111b1c.system.entry.js} +2 -2
- package/dist/pine-core/p-29266dcd.system.entry.js +2 -0
- package/dist/pine-core/{p-8b4f76e4.system.entry.js.map → p-29266dcd.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-0270ebee.system.entry.js → p-2aac4495.system.entry.js} +2 -2
- package/dist/pine-core/{p-7a6f11bd.system.entry.js → p-36e5e9f4.system.entry.js} +2 -2
- package/dist/pine-core/p-36e5e9f4.system.entry.js.map +1 -0
- package/dist/pine-core/{p-9d9a5ca8.system.entry.js → p-3f05d72e.system.entry.js} +2 -2
- package/dist/pine-core/{p-7ecfe996.entry.js → p-49c4f34a.entry.js} +2 -2
- package/dist/pine-core/{p-bc4b1749.system.entry.js → p-5abc5d82.system.entry.js} +2 -2
- package/dist/pine-core/{p-bcebce69.entry.js → p-6748d7b4.entry.js} +2 -2
- package/dist/pine-core/{p-ad8fe96c.entry.js → p-73bce0bf.entry.js} +2 -2
- package/dist/pine-core/{p-8eb29dbd.entry.js → p-78246e05.entry.js} +2 -2
- package/dist/pine-core/{p-d0366fba.entry.js → p-7a11a6c7.entry.js} +2 -2
- package/dist/pine-core/{p-694cfe69.entry.js → p-94c73d98.entry.js} +2 -2
- package/dist/pine-core/p-94c73d98.entry.js.map +1 -0
- package/dist/pine-core/{p-CCKncKbB.system.js.map → p-BJPmPVaF.system.js.map} +1 -1
- package/dist/pine-core/{p-BHavepTY.system.js → p-Bch44a-T.system.js} +2 -2
- package/dist/pine-core/{p-BHavepTY.system.js.map → p-Bch44a-T.system.js.map} +1 -1
- package/dist/pine-core/{p-DXoBK65z.system.js.map → p-BnJypAy2.system.js.map} +1 -1
- package/dist/pine-core/p-CN-lL5QG.js +2 -0
- package/dist/pine-core/{p-DwjNklzi.js.map → p-CN-lL5QG.js.map} +1 -1
- package/dist/pine-core/{p-igLtCO20.system.js.map → p-CQtQQn3_.system.js.map} +1 -1
- package/dist/pine-core/p-CjnIO2Ro.system.js.map +1 -0
- package/dist/pine-core/{p-DFY2-W9M.system.js.map → p-D4YdQDsG.system.js.map} +1 -1
- package/dist/pine-core/{p-EnxcYko8.system.js.map → p-DJYyo0MJ.system.js.map} +1 -1
- package/dist/pine-core/p-DR2CskUb.system.js.map +1 -0
- package/dist/pine-core/p-DdTbt4lH.system.js.map +1 -0
- package/dist/pine-core/p-JAVnELnm.system.js +1 -1
- package/dist/pine-core/{p-BssHFst4.system.js.map → p-N-jt0_Yl.system.js.map} +1 -1
- package/dist/pine-core/{p-1e77124d.system.entry.js → p-b1820970.system.entry.js} +2 -2
- package/dist/pine-core/{p-caff29fb.entry.js → p-b1a7a0b2.entry.js} +2 -2
- package/dist/pine-core/{p-9eQIEVii.system.js.map → p-c2oMjk1r.system.js.map} +1 -1
- package/dist/pine-core/{p-bce9f17d.system.entry.js → p-c9965216.system.entry.js} +2 -2
- package/dist/pine-core/{p-5162baee.entry.js → p-ce069162.entry.js} +2 -2
- package/dist/pine-core/{p-b61669b4.system.entry.js → p-ef9c539e.system.entry.js} +2 -2
- package/dist/pine-core/p-f5fb71f6.entry.js +2 -0
- package/dist/pine-core/{p-d456c898.entry.js.map → p-f5fb71f6.entry.js.map} +1 -1
- package/dist/pine-core/{p-563b640d.entry.js → p-fbd8ae50.entry.js} +2 -2
- package/dist/pine-core/{p-CJ4Gf3Nx.system.js.map → p-gcCcHox5.system.js.map} +1 -1
- package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-dropdown-menu-item.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-dropdown-menu.entry.esm.js.map +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/types/components/pds-button/pds-button.d.ts +0 -1
- package/hydrate/index.js +16 -20
- package/hydrate/index.mjs +16 -20
- package/package.json +2 -2
- package/dist/esm-es5/form-DwjNklzi.js +0 -2
- package/dist/pine-core/p-694cfe69.entry.js.map +0 -1
- package/dist/pine-core/p-7a6f11bd.system.entry.js.map +0 -1
- package/dist/pine-core/p-8b4f76e4.system.entry.js +0 -2
- package/dist/pine-core/p-BRn0ywk1.system.js.map +0 -1
- package/dist/pine-core/p-C7XKS9nY.system.js.map +0 -1
- package/dist/pine-core/p-DsJJz9LK.system.js.map +0 -1
- package/dist/pine-core/p-DwjNklzi.js +0 -2
- package/dist/pine-core/p-d456c898.entry.js +0 -2
- /package/dist/pine-core/{p-f94ae58d.system.entry.js.map → p-01aec1ad.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f03f4602.system.entry.js.map → p-0b52923b.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bfac5114.entry.js.map → p-15e554ae.entry.js.map} +0 -0
- /package/dist/pine-core/{p-09ff71ad.system.entry.js.map → p-23111b1c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0270ebee.system.entry.js.map → p-2aac4495.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9d9a5ca8.system.entry.js.map → p-3f05d72e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-7ecfe996.entry.js.map → p-49c4f34a.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bc4b1749.system.entry.js.map → p-5abc5d82.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bcebce69.entry.js.map → p-6748d7b4.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ad8fe96c.entry.js.map → p-73bce0bf.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8eb29dbd.entry.js.map → p-78246e05.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d0366fba.entry.js.map → p-7a11a6c7.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1e77124d.system.entry.js.map → p-b1820970.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-caff29fb.entry.js.map → p-b1a7a0b2.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bce9f17d.system.entry.js.map → p-c9965216.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5162baee.entry.js.map → p-ce069162.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b61669b4.system.entry.js.map → p-ef9c539e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-563b640d.entry.js.map → p-fbd8ae50.entry.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as i,c as s,h as e,H as r,a as o}from"./p-DHPhrb5T.js";import{m as a}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as i,c as s,h as e,H as r,a as o}from"./p-DHPhrb5T.js";import{m as a}from"./p-CN-lL5QG.js";import{b as d}from"./p-D094LgxJ.js";const p=".sc-pds-radio-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-sm)}.is-invalid.sc-pds-radio-group-h .pds-radio-group__message--error.sc-pds-radio-group{color:var(--pine-color-text-message-danger)}.pds-radio-group__label.sc-pds-radio-group{color:var(--pine-color-text-label);font:var(--pine-typography-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-radio-group__radios.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pds-radio-group-gap, var(--pine-dimension-xs))}.pds-radio-group__radios--row.sc-pds-radio-group{-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.pds-radio-group__radios--column.sc-pds-radio-group{-ms-flex-direction:column;flex-direction:column}.pds-radio-group__message.sc-pds-radio-group{color:var(--pine-color-text-message);font:var(--pine-typography-body);width:100%}.pds-radio-group__message--error.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio-group__message--error.sc-pds-radio-group pds-icon.sc-pds-radio-group{-webkit-margin-before:var(--pine-dimension-050);margin-block-start:var(--pine-dimension-050)}";const n=class{constructor(e){i(this,e);this.pdsRadioGroupChange=s(this,"pdsRadioGroupChange");this.direction="column";this.gap="xs";this.disabled=false;this.invalid=false;this.required=false}handlePropsChange(){this.updateChildRadios()}handleRadioChange(i){const s=i.target;if(s.type!=="radio"){return}if(s.checked){const i=s.closest("pds-radio");if(i){this.pdsRadioGroupChange.emit({checked:true,value:i.value,componentId:i.componentId})}}}updateChildRadios(){const i=this.el.querySelectorAll("pds-radio");i.forEach((i=>{if(this.name){i.setAttribute("name",this.name)}else{i.removeAttribute("name")}if(this.disabled){i.setAttribute("disabled","true")}else{i.removeAttribute("disabled")}if(this.invalid){i.setAttribute("invalid","true")}else{i.removeAttribute("invalid")}if(this.required){i.setAttribute("required","true")}else{i.removeAttribute("required")}}))}componentWillLoad(){if(this.componentId){this._groupId=this.componentId}else{const i=typeof crypto!=="undefined"&&crypto.randomUUID?crypto.randomUUID():`${Date.now()}-${Math.random().toString(36).substring(2,9)}`;this._groupId=`radio-group-${i}`}}componentDidLoad(){if(!this.name){console.warn("pds-radio-group: name prop is required for proper radio group functionality")}this.updateChildRadios()}classNames(){const i=[];if(this.invalid){i.push("is-invalid")}return i.join(" ")}getGapValue(){const i={none:"0",xxs:"var(--pine-dimension-xxs)",xs:"var(--pine-dimension-xs)",sm:"var(--pine-dimension-sm)",md:"var(--pine-dimension-md)",lg:"var(--pine-dimension-lg)",xl:"var(--pine-dimension-xl)",xxl:"var(--pine-dimension-xxl)"};if(i[this.gap]){return i[this.gap]}return`var(--pine-dimension-${this.gap})`}getAriaDescribedBy(){const i=[];if(this.errorMessage){i.push(a(this._groupId,"error"))}if(this.helperMessage){i.push(a(this._groupId,"helper"))}return i.length>0?i.join(" "):undefined}render(){const i=this.getGapValue();const s=this.getAriaDescribedBy();return e(r,{key:"53949e8e878887189482a13e0402402b8ee79c46",class:this.classNames(),id:this._groupId,role:"group","aria-describedby":s,style:{"--pds-radio-group-gap":i}},this.groupLabel&&e("div",{key:"9aa547ff0b60d1eb78ab6806c552391c119c6511",class:"pds-radio-group__label"},this.groupLabel),e("div",{key:"5bad4f6d4c685eca8a97b574511f21b93bdf4821",class:{"pds-radio-group__radios":true,"pds-radio-group__radios--row":this.direction==="row","pds-radio-group__radios--column":this.direction==="column"}},e("slot",{key:"ffd76f30b308f124e1df925b2fe354ffb80f59bc",onSlotchange:()=>this.updateChildRadios()})),this.helperMessage&&e("div",{key:"ea8995384b1e1c1e98d01d704bd969a97bfd2b2a",class:"pds-radio-group__message",id:a(this._groupId,"helper")},this.helperMessage),this.errorMessage&&e("div",{key:"30726bc368c7ad2820ae4cb43faf0a45e94a51e8",class:"pds-radio-group__message pds-radio-group__message--error",id:a(this._groupId,"error"),"aria-live":"assertive"},e("pds-icon",{key:"acc00b6e36ead10cc5cc01033ad0f619bd75f5da",icon:d,size:"small"}),this.errorMessage))}get el(){return o(this)}static get watchers(){return{name:["handlePropsChange"],disabled:["handlePropsChange"],invalid:["handlePropsChange"],required:["handlePropsChange"]}}};n.style=p;export{n as pds_radio_group};
|
|
2
|
+
//# sourceMappingURL=p-73bce0bf.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as r,h as i,H as t,a as n}from"./p-DHPhrb5T.js";import{a as s,m as d}from"./p-DwjNklzi.js";import{i as o}from"./p-C0M1gTKv.js";import{d as a}from"./p-tJa4KYNO.js";import{b as p}from"./p-D094LgxJ.js";const l=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const u=":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 c=":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);left:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);right:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([disabled=true])::part(prepend),:host([disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}";const h=class{constructor(i){e(this,i);this.pdsBlur=r(this,"pdsBlur");this.pdsChange=r(this,"pdsChange");this.pdsFocus=r(this,"pdsFocus");this.pdsInput=r(this,"pdsInput");this.pdsKeyDown=r(this,"pdsKeyDown");this.inheritedAttributes={};this.isComposing=false;this.hasPrefix=false;this.hasSuffix=false;this.hasPrepend=false;this.hasAppend=false;this.hasAction=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=e=>{const r=e.target;if(r){this.value=r.value||""}this.emitInputChange(e)};this.onChangeEvent=e=>{this.emitValueChange(e)};this.onBlurEvent=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocusEvent=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onCompositionStart=()=>{this.isComposing=true};this.onCompositionEnd=()=>{this.isComposing=false};this.onKeyDownEvent=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){if(this.nativeInput){this.nativeInput.focus()}}updateAddonWidths(){requestAnimationFrame((()=>{if(this.prefixEl){const e=this.prefixEl.offsetWidth;this.el.style.setProperty("--prefix-width",`${e}px`)}if(this.suffixEl){const e=this.suffixEl.offsetWidth;this.el.style.setProperty("--suffix-width",`${e}px`)}}))}renderPrefix(){const e=this.el.querySelector('[slot="prefix"]')!==null;if(e){return i("div",{class:"pds-input__prefix",part:"prefix",ref:e=>this.prefixEl=e},i("slot",{name:"prefix",onSlotchange:()=>this.updateAddonWidths()}))}return null}renderSuffix(){const e=this.el.querySelector('[slot="suffix"]')!==null;if(e){return i("div",{class:"pds-input__suffix",part:"suffix",ref:e=>this.suffixEl=e},i("slot",{name:"suffix",onSlotchange:()=>this.updateAddonWidths()}))}return null}renderPrepend(){const e=this.el.querySelector('[slot="prepend"]')!==null;if(e){return i("div",{class:"pds-input__prepend",part:"prepend"},i("slot",{name:"prepend"}))}return null}renderAppend(){const e=this.el.querySelector('[slot="append"]')!==null;if(e){return i("div",{class:"pds-input__append",part:"append"},i("slot",{name:"append"}))}return null}renderAction(){const e=this.el.querySelector('[slot="action"]')!==null;if(e){return i("div",{class:"pds-input__action",part:"action"},i("slot",{name:"action"}))}return null}componentWillLoad(){this.inheritedAttributes=Object.assign({},o(this.el));this.hasPrefix=this.el.querySelector('[slot="prefix"]')!==null;this.hasSuffix=this.el.querySelector('[slot="suffix"]')!==null;this.hasPrepend=this.el.querySelector('[slot="prepend"]')!==null;this.hasAppend=this.el.querySelector('[slot="append"]')!==null;this.hasAction=this.el.querySelector('[slot="action"]')!==null;this.originalPdsInput=this.pdsInput}connectedCallback(){if(this.el.attachInternals&&!this.internals){this.internals=this.el.attachInternals()}}componentDidLoad(){this.debounceChanged();this.updateAddonWidths();this.updateFormValue()}componentDidUpdate(){this.updateAddonWidths()}debounceChanged(){const{pdsInput:e,debounce:r,originalPdsInput:i}=this;this.pdsInput=r===undefined?i!==null&&i!==void 0?i:e:a(e,r)}valueChanged(){const e=this.nativeInput;const r=this.getValue();if(e&&e.value!==r&&!this.isComposing){e.value=r}this.updateFormValue()}getValue(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:r}=this;const i=r==null?r:r.toString();this.focusedValue=i;this.pdsChange.emit({value:i,event:e})}emitInputChange(e){const{value:r}=this;const i=r==null?r:r.toString();this.pdsInput.emit({value:i,event:e})}updateFormValue(){if(this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null);if(this.nativeInput&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}}formResetCallback(){this.value="";this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){const r=e.get(this.name);if(typeof r==="string"){this.value=r}}}render(){const{componentId:e,disabled:r,errorMessage:n,helperMessage:o,invalid:a=false,label:l}=this;const u=this.getValue();const c={"pds-input__field-wrapper":true,"has-focus":this.hasFocus,"has-error":a||!!n,"is-disabled":r,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return i(t,{key:"ff25f2310e8d1755534fe3f27b391447d6014f76","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},i("div",{key:"e337c4a828eb7641a41caffec2508fa9b12a2eeb",class:"pds-input"},l&&i("div",{key:"8df0800a08156e1755ae7460ad7ddd51a1301f27",class:"pds-input__label-wrapper"},i("label",{key:"ed2978d0c9b841bfa8f929ab7072461b231ab5b2",htmlFor:e,class:"pds-input__label"},i("span",{key:"23ab3abd0ecff326110cbde065d3a3cb733ec832",class:this.hideLabel?"visually-hidden":""},l,this.required&&i("span",{key:"1bdafb028b48e37c9999db0c8f2d1718f8566e05",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),i("div",{key:"e06ba19e8d40271345e27f791efb79817cc723f7",class:c},this.renderPrepend(),this.renderPrefix(),i("input",Object.assign({key:"d7a2d70a03130a431b527f5bf75888d1db55bd5e",ref:e=>this.nativeInput=e,class:"pds-input__field","aria-describedby":s(e,a,o),"aria-invalid":a?"true":undefined,autocomplete:this.autocomplete,disabled:r,id:e,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:u,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onKeyDown:this.onKeyDownEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),o&&i("p",{key:"d0f58791f013578fc34f36711a95b4f2e655bcda",class:"pds-input__helper-message",id:d(e,"helper")},o),n&&i("p",{key:"b511338e9c05cfb4c9363a9227c8e208b9f645e1",class:"pds-input__error-message",id:d(e,"error")},i("pds-icon",{key:"4eaaf16d77e23486aad12369919cd4e03768ff3a",icon:p,size:"small"}),n)))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};h.style=l+(u+c);export{h as pds_input};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as r,h as i,H as t,a as n}from"./p-DHPhrb5T.js";import{a as s,m as d}from"./p-CN-lL5QG.js";import{i as o}from"./p-C0M1gTKv.js";import{d as a}from"./p-tJa4KYNO.js";import{b as p}from"./p-D094LgxJ.js";const l=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const u=":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 c=":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);left:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);right:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([disabled=true])::part(prepend),:host([disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}";const h=class{constructor(i){e(this,i);this.pdsBlur=r(this,"pdsBlur");this.pdsChange=r(this,"pdsChange");this.pdsFocus=r(this,"pdsFocus");this.pdsInput=r(this,"pdsInput");this.pdsKeyDown=r(this,"pdsKeyDown");this.inheritedAttributes={};this.isComposing=false;this.hasPrefix=false;this.hasSuffix=false;this.hasPrepend=false;this.hasAppend=false;this.hasAction=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=e=>{const r=e.target;if(r){this.value=r.value||""}this.emitInputChange(e)};this.onChangeEvent=e=>{this.emitValueChange(e)};this.onBlurEvent=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocusEvent=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onCompositionStart=()=>{this.isComposing=true};this.onCompositionEnd=()=>{this.isComposing=false};this.onKeyDownEvent=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){if(this.nativeInput){this.nativeInput.focus()}}updateAddonWidths(){requestAnimationFrame((()=>{if(this.prefixEl){const e=this.prefixEl.offsetWidth;this.el.style.setProperty("--prefix-width",`${e}px`)}if(this.suffixEl){const e=this.suffixEl.offsetWidth;this.el.style.setProperty("--suffix-width",`${e}px`)}}))}renderPrefix(){const e=this.el.querySelector('[slot="prefix"]')!==null;if(e){return i("div",{class:"pds-input__prefix",part:"prefix",ref:e=>this.prefixEl=e},i("slot",{name:"prefix",onSlotchange:()=>this.updateAddonWidths()}))}return null}renderSuffix(){const e=this.el.querySelector('[slot="suffix"]')!==null;if(e){return i("div",{class:"pds-input__suffix",part:"suffix",ref:e=>this.suffixEl=e},i("slot",{name:"suffix",onSlotchange:()=>this.updateAddonWidths()}))}return null}renderPrepend(){const e=this.el.querySelector('[slot="prepend"]')!==null;if(e){return i("div",{class:"pds-input__prepend",part:"prepend"},i("slot",{name:"prepend"}))}return null}renderAppend(){const e=this.el.querySelector('[slot="append"]')!==null;if(e){return i("div",{class:"pds-input__append",part:"append"},i("slot",{name:"append"}))}return null}renderAction(){const e=this.el.querySelector('[slot="action"]')!==null;if(e){return i("div",{class:"pds-input__action",part:"action"},i("slot",{name:"action"}))}return null}componentWillLoad(){this.inheritedAttributes=Object.assign({},o(this.el));this.hasPrefix=this.el.querySelector('[slot="prefix"]')!==null;this.hasSuffix=this.el.querySelector('[slot="suffix"]')!==null;this.hasPrepend=this.el.querySelector('[slot="prepend"]')!==null;this.hasAppend=this.el.querySelector('[slot="append"]')!==null;this.hasAction=this.el.querySelector('[slot="action"]')!==null;this.originalPdsInput=this.pdsInput}connectedCallback(){if(this.el.attachInternals&&!this.internals){this.internals=this.el.attachInternals()}}componentDidLoad(){this.debounceChanged();this.updateAddonWidths();this.updateFormValue()}componentDidUpdate(){this.updateAddonWidths()}debounceChanged(){const{pdsInput:e,debounce:r,originalPdsInput:i}=this;this.pdsInput=r===undefined?i!==null&&i!==void 0?i:e:a(e,r)}valueChanged(){const e=this.nativeInput;const r=this.getValue();if(e&&e.value!==r&&!this.isComposing){e.value=r}this.updateFormValue()}getValue(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:r}=this;const i=r==null?r:r.toString();this.focusedValue=i;this.pdsChange.emit({value:i,event:e})}emitInputChange(e){const{value:r}=this;const i=r==null?r:r.toString();this.pdsInput.emit({value:i,event:e})}updateFormValue(){if(this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null);if(this.nativeInput&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}}formResetCallback(){this.value="";this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){const r=e.get(this.name);if(typeof r==="string"){this.value=r}}}render(){const{componentId:e,disabled:r,errorMessage:n,helperMessage:o,invalid:a=false,label:l}=this;const u=this.getValue();const c={"pds-input__field-wrapper":true,"has-focus":this.hasFocus,"has-error":a||!!n,"is-disabled":r,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return i(t,{key:"ff25f2310e8d1755534fe3f27b391447d6014f76","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},i("div",{key:"e337c4a828eb7641a41caffec2508fa9b12a2eeb",class:"pds-input"},l&&i("div",{key:"8df0800a08156e1755ae7460ad7ddd51a1301f27",class:"pds-input__label-wrapper"},i("label",{key:"ed2978d0c9b841bfa8f929ab7072461b231ab5b2",htmlFor:e,class:"pds-input__label"},i("span",{key:"23ab3abd0ecff326110cbde065d3a3cb733ec832",class:this.hideLabel?"visually-hidden":""},l,this.required&&i("span",{key:"1bdafb028b48e37c9999db0c8f2d1718f8566e05",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),i("div",{key:"e06ba19e8d40271345e27f791efb79817cc723f7",class:c},this.renderPrepend(),this.renderPrefix(),i("input",Object.assign({key:"d7a2d70a03130a431b527f5bf75888d1db55bd5e",ref:e=>this.nativeInput=e,class:"pds-input__field","aria-describedby":s(e,a,o),"aria-invalid":a?"true":undefined,autocomplete:this.autocomplete,disabled:r,id:e,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:u,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onKeyDown:this.onKeyDownEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),o&&i("p",{key:"d0f58791f013578fc34f36711a95b4f2e655bcda",class:"pds-input__helper-message",id:d(e,"helper")},o),n&&i("p",{key:"b511338e9c05cfb4c9363a9227c8e208b9f645e1",class:"pds-input__error-message",id:d(e,"error")},i("pds-icon",{key:"4eaaf16d77e23486aad12369919cd4e03768ff3a",icon:p,size:"small"}),n)))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};h.style=l+(u+c);export{h as pds_input};
|
|
2
|
+
//# sourceMappingURL=p-78246e05.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as s,h as i,H as t,a as r}from"./p-DHPhrb5T.js";import{e as o,m as a}from"./p-DwjNklzi.js";import{b as n,e as l}from"./p-D094LgxJ.js";const d=":host{--pine-select-color-background-danger:var(--pine-color-red-050)}";const c=":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 p=':host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{color:var(--pine-color-text);display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__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)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-radius:var(--pds-select-border-radius);border-bottom-left-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-bottom-right-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-top-left-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));border-top-right-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));color:var(--pine-color-text);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-color-red-950)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) :host(.is-invalid) select{background-color:var(--pine-color-red-950)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:hover:not(:disabled){border-color:var(--pine-color-accent-hover)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not(.is-disabled):not(.is-invalid)) .pds-select__select-icon{color:var(--pine-color-text-accent)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:var(--pine-z-index-raised)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}';const h=class{constructor(i){e(this,i);this.pdsSelectChange=s(this,"pdsSelectChange");this.pdsBlur=s(this,"pdsBlur");this.pdsFocus=s(this,"pdsFocus");this.pdsKeyDown=s(this,"pdsKeyDown");this._type="select-one";this.disabled=false;this.multiple=false;this.required=false;this.onSelectUpdate=e=>{const s=e.target;const i=Array.from(s.options).filter((e=>e.selected)).map((e=>e.value));if(i.length===1&&!this.multiple){this.value=i[0]}else{this.value=i}this.pdsSelectChange.emit(e)};this.onBlur=e=>{this.pdsBlur.emit(e)};this.onFocus=e=>{this.pdsFocus.emit(e)};this.onKeyDown=e=>{this.pdsKeyDown.emit(e)};this.handleSlotChange=()=>{const e=this.slotContainer.querySelector("slot");this.selectEl.innerHTML="";const s=e.assignedElements({flatten:true});s.forEach((e=>{if(["OPTION","OPTGROUP"].includes(e.tagName)){const s=e.cloneNode(true);if(s.tagName==="OPTION"&&s.value===this.value){s.selected=true}this.selectEl.appendChild(s)}}));this.updateSelectedOption()}}valueChanged(){this.updateSelectedOption();this.updateFormValue()}multipleChanged(){this.updateType()}updateType(){this._type=this.multiple?"select-multiple":"select-one"}connectedCallback(){if(this.el.attachInternals&&!this.internals){this.internals=this.el.attachInternals()}o(this.el,(()=>this._type))}componentWillLoad(){this.updateType();this.updateSelectedOption()}componentDidLoad(){this.updateFormValue()}updateSelectedOption(){if(this.selectEl){const e=this.selectEl.options;Array.from(e).map((e=>{if(Array.isArray(this.value)){e.selected=this.value.includes(e.value)}else{e.selected=this.value===e.value}}))}}getHelperMessage(){return this.helperMessage&&i("p",{class:"pds-select__helper-message",id:a(this.componentId,"helper")},this.helperMessage)}getErrorMessage(){return this.errorMessage&&i("p",{class:"pds-select__error-message",id:a(this.componentId,"error"),"aria-live":"assertive"},i("pds-icon",{icon:n,size:"small"}),this.errorMessage)}renderMessages(){if(!this.helperMessage&&!this.errorMessage)return null;return i("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage())}classNames(){const e=[];if(this.invalid){e.push("is-invalid")}if(this.disabled){e.push("is-disabled")}return e.join(" ")}renderAction(){const e=this.el.querySelector('[slot="action"]')!==null;if(e){return i("div",{class:"pds-select__action",part:"action"},i("slot",{name:"action"}))}return null}updateFormValue(){if(this.internals&&this.internals.setFormValue){const e=this.value;if(Array.isArray(e)){if(e.length>1){const s=new FormData;e.forEach((e=>s.append(this.name||"",e)));this.internals.setFormValue(s)}else{this.internals.setFormValue(e[0]||null)}}else{this.internals.setFormValue(e||null)}if(this.selectEl&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.selectEl.validity,this.selectEl.validationMessage,this.selectEl)}}}formResetCallback(){this.value="";this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){const s=e.getAll(this.name);if(s.length>1){this.value=s.filter((e=>typeof e==="string"))}else if(s.length===1&&typeof s[0]==="string"){this.value=s[0]}}}render(){const e=this.el.querySelector('[slot="action"]')!==null;return i(t,{key:"d36bddf20910ae21ba2209bbf7e3f13b1ce9c3bf","aria-disabled":this.disabled?"true":null,class:this.classNames(),"has-action":e&&!this.hideLabel?"true":null},i("div",{key:"72fe6ee352834fbd6e8f5f9d9e96b1be232f2988",class:"pds-select"},!this.hideLabel&&i("div",{key:"c2894f7ec00402425f74f1145d449da13d870161",class:"pds-select__label-wrapper"},i("label",{key:"4f6277c3f7b40f3d52995231cb49824e58ebae1b",htmlFor:this.componentId},i("span",{key:"f1b0cf90091843c1a994699263905f811888d4bd",class:this.hideLabel?"visually-hidden":""},this.label)),e&&this.renderAction()),i("select",{key:"727c1644e8ea5afc194e33e29e9730d6b08c3784","aria-label":this.hideLabel?this.label:undefined,autocomplete:this.autocomplete||undefined,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onBlur:this.onBlur,onChange:this.onSelectUpdate,onFocus:this.onFocus,onKeyDown:this.onKeyDown,part:"select",required:this.required,ref:e=>this.selectEl=e}),i("div",{key:"d7c0c3f3b765b13c6dc34a9c5c13bbcfd081a274","aria-hidden":"true",class:"hidden",ref:e=>this.slotContainer=e},i("slot",{key:"2305afcacb082c0d5faca8b77295919f8d9c9e0b",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&i("pds-icon",{key:"4a1d6ced0ffc14ae17763d116a85324e5a6c7ce5",class:"pds-select__select-icon",icon:l})))}static get formAssociated(){return true}get el(){return r(this)}static get watchers(){return{value:["valueChanged"],multiple:["multipleChanged"]}}};h.style=d+(c+p);export{h as pds_select};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as s,h as i,H as t,a as r}from"./p-DHPhrb5T.js";import{e as o,m as a}from"./p-CN-lL5QG.js";import{b as n,e as l}from"./p-D094LgxJ.js";const d=":host{--pine-select-color-background-danger:var(--pine-color-red-050)}";const c=":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 p=':host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{color:var(--pine-color-text);display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__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)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-radius:var(--pds-select-border-radius);border-bottom-left-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-bottom-right-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-top-left-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));border-top-right-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));color:var(--pine-color-text);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-color-red-950)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) :host(.is-invalid) select{background-color:var(--pine-color-red-950)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:hover:not(:disabled){border-color:var(--pine-color-accent-hover)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not(.is-disabled):not(.is-invalid)) .pds-select__select-icon{color:var(--pine-color-text-accent)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:var(--pine-z-index-raised)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}';const h=class{constructor(i){e(this,i);this.pdsSelectChange=s(this,"pdsSelectChange");this.pdsBlur=s(this,"pdsBlur");this.pdsFocus=s(this,"pdsFocus");this.pdsKeyDown=s(this,"pdsKeyDown");this._type="select-one";this.disabled=false;this.multiple=false;this.required=false;this.onSelectUpdate=e=>{const s=e.target;const i=Array.from(s.options).filter((e=>e.selected)).map((e=>e.value));if(i.length===1&&!this.multiple){this.value=i[0]}else{this.value=i}this.pdsSelectChange.emit(e)};this.onBlur=e=>{this.pdsBlur.emit(e)};this.onFocus=e=>{this.pdsFocus.emit(e)};this.onKeyDown=e=>{this.pdsKeyDown.emit(e)};this.handleSlotChange=()=>{const e=this.slotContainer.querySelector("slot");this.selectEl.innerHTML="";const s=e.assignedElements({flatten:true});s.forEach((e=>{if(["OPTION","OPTGROUP"].includes(e.tagName)){const s=e.cloneNode(true);if(s.tagName==="OPTION"&&s.value===this.value){s.selected=true}this.selectEl.appendChild(s)}}));this.updateSelectedOption()}}valueChanged(){this.updateSelectedOption();this.updateFormValue()}multipleChanged(){this.updateType()}updateType(){this._type=this.multiple?"select-multiple":"select-one"}connectedCallback(){if(this.el.attachInternals&&!this.internals){this.internals=this.el.attachInternals()}o(this.el,(()=>this._type))}componentWillLoad(){this.updateType();this.updateSelectedOption()}componentDidLoad(){this.updateFormValue()}updateSelectedOption(){if(this.selectEl){const e=this.selectEl.options;Array.from(e).map((e=>{if(Array.isArray(this.value)){e.selected=this.value.includes(e.value)}else{e.selected=this.value===e.value}}))}}getHelperMessage(){return this.helperMessage&&i("p",{class:"pds-select__helper-message",id:a(this.componentId,"helper")},this.helperMessage)}getErrorMessage(){return this.errorMessage&&i("p",{class:"pds-select__error-message",id:a(this.componentId,"error"),"aria-live":"assertive"},i("pds-icon",{icon:n,size:"small"}),this.errorMessage)}renderMessages(){if(!this.helperMessage&&!this.errorMessage)return null;return i("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage())}classNames(){const e=[];if(this.invalid){e.push("is-invalid")}if(this.disabled){e.push("is-disabled")}return e.join(" ")}renderAction(){const e=this.el.querySelector('[slot="action"]')!==null;if(e){return i("div",{class:"pds-select__action",part:"action"},i("slot",{name:"action"}))}return null}updateFormValue(){if(this.internals&&this.internals.setFormValue){const e=this.value;if(Array.isArray(e)){if(e.length>1){const s=new FormData;e.forEach((e=>s.append(this.name||"",e)));this.internals.setFormValue(s)}else{this.internals.setFormValue(e[0]||null)}}else{this.internals.setFormValue(e||null)}if(this.selectEl&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.selectEl.validity,this.selectEl.validationMessage,this.selectEl)}}}formResetCallback(){this.value="";this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){const s=e.getAll(this.name);if(s.length>1){this.value=s.filter((e=>typeof e==="string"))}else if(s.length===1&&typeof s[0]==="string"){this.value=s[0]}}}render(){const e=this.el.querySelector('[slot="action"]')!==null;return i(t,{key:"d36bddf20910ae21ba2209bbf7e3f13b1ce9c3bf","aria-disabled":this.disabled?"true":null,class:this.classNames(),"has-action":e&&!this.hideLabel?"true":null},i("div",{key:"72fe6ee352834fbd6e8f5f9d9e96b1be232f2988",class:"pds-select"},!this.hideLabel&&i("div",{key:"c2894f7ec00402425f74f1145d449da13d870161",class:"pds-select__label-wrapper"},i("label",{key:"4f6277c3f7b40f3d52995231cb49824e58ebae1b",htmlFor:this.componentId},i("span",{key:"f1b0cf90091843c1a994699263905f811888d4bd",class:this.hideLabel?"visually-hidden":""},this.label)),e&&this.renderAction()),i("select",{key:"727c1644e8ea5afc194e33e29e9730d6b08c3784","aria-label":this.hideLabel?this.label:undefined,autocomplete:this.autocomplete||undefined,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onBlur:this.onBlur,onChange:this.onSelectUpdate,onFocus:this.onFocus,onKeyDown:this.onKeyDown,part:"select",required:this.required,ref:e=>this.selectEl=e}),i("div",{key:"d7c0c3f3b765b13c6dc34a9c5c13bbcfd081a274","aria-hidden":"true",class:"hidden",ref:e=>this.slotContainer=e},i("slot",{key:"2305afcacb082c0d5faca8b77295919f8d9c9e0b",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&i("pds-icon",{key:"4a1d6ced0ffc14ae17763d116a85324e5a6c7ce5",class:"pds-select__select-icon",icon:l})))}static get formAssociated(){return true}get el(){return r(this)}static get watchers(){return{value:["valueChanged"],multiple:["multipleChanged"]}}};h.style=d+(c+p);export{h as pds_select};
|
|
2
|
+
//# sourceMappingURL=p-7a11a6c7.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as o,c as r,h as t,H as e,a as n}from"./p-DHPhrb5T.js";import{h as i}from"./p-tJa4KYNO.js";import{f as d,g as a}from"./p-D094LgxJ.js";const s=":host{--pds-button-background:var(--color-background-default);--pds-button-border:var(--pine-border);--pds-button-border-radius:var(--pine-border-radius-full);--pds-button-border-radius-start-end:var(--pine-border-radius-full);--pds-button-border-radius-start-start:var(--pine-border-radius-full);--pds-button-border-radius-end-end:var(--pine-border-radius-full);--pds-button-border-radius-end-start:var(--pine-border-radius-full);--pds-button-min-height:var(--pine-dimension-450);--pds-button-outline-offset:var(--pine-border-width);--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;--button-loader-color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}:host([full-width=true]){display:-ms-flexbox;display:flex;width:100%}:host([full-width=true]) a,:host([full-width=true]) button{-ms-flex-pack:center;justify-content:center;width:100%}:host([full-width=true]) .pds-button__content{-ms-flex-pack:center;justify-content:center;text-align:center}:host([loading=true]){cursor:wait;pointer-events:none}:host([disabled=true]){pointer-events:none}.pds-button{--pds-loader-color:var(--color-text-default);-ms-flex-align:center;align-items:center;background-color:var(--pds-button-background, var(--color-background-default));border:var(--pds-button-border);border-color:var(--color-border-default);border-radius:var(--pds-button-border-radius);border-end-end-radius:var(--pds-button-border-radius-end-end, var(--pds-button-border-radius));border-end-start-radius:var(--pds-button-border-radius-end-start, var(--pds-button-border-radius));border-start-end-radius:var(--pds-button-border-radius-start-end, var(--pds-button-border-radius));border-start-start-radius:var(--pds-button-border-radius-start-start, var(--pds-button-border-radius));-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-button-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-sm);position:relative;text-decoration:none}.pds-button pds-icon{color:currentColor;fill:currentColor}.pds-button:hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover)}.pds-button:focus-visible{border-color:var(--color-border-focus);-webkit-box-shadow:var(--pds-button-box-shadow-focus, none);box-shadow:var(--pds-button-box-shadow-focus, none);outline:var(--pds-button-outline-focus, var(--pine-outline-focus));outline-offset:var(--pds-button-outline-offset)}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled);pointer-events:none}.pds-button--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-button--secondary,.pds-button--disclosure{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-default:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--tertiary{--color-background-default:transparent;--color-background-hover:var(--pine-color-background-muted);--color-background-disabled:transparent;--color-border-default:transparent;--color-border-hover:var(--pine-color-background-muted);--color-border-disabled:transparent;--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--filter{--color-background-default:var(--pine-color-background-container);--color-background-hover:var(--pine-color-background-subtle);--color-background-disabled:var(--pine-color-white);--color-border-default:transparent;--color-border-hover:transparent;--color-border-focus:transparent;--color-text-default:var(--pine-color-text-secondary);--color-text-hover:var(--pine-color-text-hover);--color-text-disabled:var(--pine-color-text-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary);--pds-button-border-radius:var(--pine-dimension-125);--pds-button-border-radius-start-end:var(--pine-dimension-125);--pds-button-border-radius-start-start:var(--pine-dimension-125);--pds-button-border-radius-end-end:var(--pine-dimension-125);--pds-button-border-radius-end-start:var(--pine-dimension-125);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-button--filter:disabled{background-color:var(--pine-color-background-container)}.pds-button--filter:hover{color:var(--color-text-hover)}.pds-button--unstyled{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-text-default:var(--pine-color-text);--button-loader-color:var(--pine-color-text);border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}.pds-button__content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-xs);position:relative;width:100%}.pds-button__icon{display:-ms-inline-flexbox;display:inline-flex}.pds-button__text{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;white-space:nowrap}.pds-button__icon--hidden,.pds-button__text--hidden{opacity:0}.pds-button__loader{height:var(--pine-dimension-250);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--pine-dimension-250)}.pds-button--loading{cursor:wait;pointer-events:none}.pds-button--loading .pds-button__loader pds-loader{--loader-color:var(--button-loader-color)}.pds-button--small{min-height:var(--pine-dimension-400);padding:calc(var(--pine-dimension-2xs) - var(--pine-border-width)) var(--pine-dimension-sm)}.pds-button--micro{font-size:var(--pine-font-size-085);min-height:var(--pine-dimension-300);padding:var(--pine-dimension-025) var(--pine-dimension-xs)}.pds-button--icon-only{-ms-flex-align:center;align-items:center;border-radius:var(--pine-border-radius-full);height:var(--button-dimension);-ms-flex-pack:center;justify-content:center;min-height:var(--button-dimension);min-width:var(--button-dimension);padding:var(--pine-dimension-xs);width:var(--button-dimension)}.pds-button--icon-only .pds-button__content{height:100%;-ms-flex-pack:center;justify-content:center;width:100%}.pds-button--icon-only .pds-button__text--hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-button--icon-only.pds-button--small{height:var(--pine-dimension-400);min-height:var(--pine-dimension-400);min-width:var(--pine-dimension-400);padding:var(--pine-dimension-2xs);width:var(--pine-dimension-400)}.pds-button--icon-only.pds-button--micro{height:var(--pine-dimension-300);min-height:var(--pine-dimension-300);min-width:var(--pine-dimension-300);padding:var(--pine-dimension-3xs);width:var(--pine-dimension-300)}";const l=class{constructor(t){o(this,t);this.pdsClick=r(this,"pdsClick");this.disabled=false;this.fullWidth=false;this.icon=null;this.iconOnly=false;this.loading=false;this.type="button";this.size="default";this.variant="primary";this.handleClick=o=>{if(this.loading){o.preventDefault();return}if(this.disabled){o.preventDefault();return}if(!this.href&&this.type!="button"){if(i(this.el)){const r=this.el.closest("form");if(r){o.preventDefault();const t=document.createElement("button");t.type=this.type;t.style.display="none";r.appendChild(t);t.click();t.remove()}}}this.pdsClick.emit(o)}}handleFormKeyDown(o){if(o.key!=="Enter"||this.type!=="submit"||this.href||this.disabled){return}const r=o.target;if(!r||typeof r.matches!=="function"){return}const t=this.el.closest("form");if(!t||!r||!t.contains(r)){return}const e=r.matches('input:not([type="submit"]):not([type="button"]):not([type="reset"])')||r.matches("pds-input")||r.matches("pds-select")||r.matches("pds-switch")||r.matches("pds-checkbox")||r.matches("pds-radio");if(e){const r=Array.from(t.querySelectorAll('pds-button, button[type="submit"], input[type="submit"]'));const e=r.filter((o=>{if(o.tagName.toLowerCase()==="pds-button"){const r=o;return r.type==="submit"&&!r.disabled}else{return!o.hasAttribute("disabled")}}));if(e.length>0&&e[0]===this.el){o.preventDefault();this.el.click()}}}classNames(){const o=["pds-button"];if(this.variant){o.push("pds-button--"+this.variant)}if(this.size&&this.size!=="default"){o.push("pds-button--"+this.size)}if(this.iconOnly){o.push("pds-button--icon-only")}if(this.loading){o.push("pds-button--loading")}return o.join(" ")}hasSlotContent(o){const r=this.el.querySelectorAll(`[slot="${o}"]`);return r.length>0}renderStartContent(){const o=this.icon&&this.variant!=="disclosure"&&this.variant!=="filter";const r=this.hasSlotContent("start");if(this.variant==="filter"){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:d,part:"icon","aria-hidden":"true"})}else if(Boolean(o)){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",name:this.icon,part:"icon","aria-hidden":"true"})}else if(Boolean(r)){return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"start"}))}return null}renderEndContent(){if(this.iconOnly){return null}if(this.variant==="disclosure"){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:a,part:"caret","aria-hidden":"true"})}else if(this.hasSlotContent("end")){return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"end"}))}return null}render(){const o={class:this.classNames(),part:"button"};const r=()=>{if(this.href){return Object.assign(Object.assign({},o),{href:this.disabled?null:this.href,target:this.target})}return Object.assign(Object.assign({},o),{"aria-busy":this.loading?"true":null,"aria-live":this.loading?"polite":null,disabled:this.disabled,name:this.name,type:this.type,value:this.value})};const n=this.href?"a":"button";const i=this.loading||this.iconOnly;const d=t("div",{class:"pds-button__content",part:"button-content"},this.renderStartContent(),t("span",{class:`pds-button__text ${i?"pds-button__text--hidden":""}`,part:"button-text"},t("slot",null)),this.loading&&t("span",{class:"pds-button__loader"},t("pds-loader",{"is-loading":true,size:"var(--pine-font-size-body-2xl)",variant:"spinner",exportparts:"loader-svg"},"Loading...")),this.renderEndContent());return t(e,{"aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},t(n,Object.assign({},r()),d))}get el(){return n(this)}};l.style=s;export{l as pds_button};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as o,c as r,h as t,H as e,a as n}from"./p-DHPhrb5T.js";import{h as i}from"./p-tJa4KYNO.js";import{f as d,g as a}from"./p-D094LgxJ.js";const s=":host{--pds-button-background:var(--color-background-default);--pds-button-border:var(--pine-border);--pds-button-border-radius:var(--pine-border-radius-full);--pds-button-border-radius-start-end:var(--pine-border-radius-full);--pds-button-border-radius-start-start:var(--pine-border-radius-full);--pds-button-border-radius-end-end:var(--pine-border-radius-full);--pds-button-border-radius-end-start:var(--pine-border-radius-full);--pds-button-min-height:var(--pine-dimension-450);--pds-button-outline-offset:var(--pine-border-width);--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;--button-loader-color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}:host([full-width=true]){display:-ms-flexbox;display:flex;width:100%}:host([full-width=true]) a,:host([full-width=true]) button{-ms-flex-pack:center;justify-content:center;width:100%}:host([full-width=true]) .pds-button__content{-ms-flex-pack:center;justify-content:center;text-align:center}:host([loading=true]){cursor:wait;pointer-events:none}:host([disabled=true]){pointer-events:none}.pds-button{--pds-loader-color:var(--color-text-default);-ms-flex-align:center;align-items:center;background-color:var(--pds-button-background, var(--color-background-default));border:var(--pds-button-border);border-color:var(--color-border-default);border-radius:var(--pds-button-border-radius);border-end-end-radius:var(--pds-button-border-radius-end-end, var(--pds-button-border-radius));border-end-start-radius:var(--pds-button-border-radius-end-start, var(--pds-button-border-radius));border-start-end-radius:var(--pds-button-border-radius-start-end, var(--pds-button-border-radius));border-start-start-radius:var(--pds-button-border-radius-start-start, var(--pds-button-border-radius));-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-button-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-sm);position:relative;text-decoration:none}.pds-button pds-icon{color:currentColor;fill:currentColor}.pds-button:hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover)}.pds-button:focus-visible{border-color:var(--color-border-focus);-webkit-box-shadow:var(--pds-button-box-shadow-focus, none);box-shadow:var(--pds-button-box-shadow-focus, none);outline:var(--pds-button-outline-focus, var(--pine-outline-focus));outline-offset:var(--pds-button-outline-offset)}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled);pointer-events:none}.pds-button--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-button--secondary,.pds-button--disclosure{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-default:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--tertiary{--color-background-default:transparent;--color-background-hover:var(--pine-color-background-muted);--color-background-disabled:transparent;--color-border-default:transparent;--color-border-hover:var(--pine-color-background-muted);--color-border-disabled:transparent;--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--filter{--color-background-default:var(--pine-color-background-container);--color-background-hover:var(--pine-color-background-subtle);--color-background-disabled:var(--pine-color-white);--color-border-default:transparent;--color-border-hover:transparent;--color-border-focus:transparent;--color-text-default:var(--pine-color-text-secondary);--color-text-hover:var(--pine-color-text-hover);--color-text-disabled:var(--pine-color-text-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary);--pds-button-border-radius:var(--pine-dimension-125);--pds-button-border-radius-start-end:var(--pine-dimension-125);--pds-button-border-radius-start-start:var(--pine-dimension-125);--pds-button-border-radius-end-end:var(--pine-dimension-125);--pds-button-border-radius-end-start:var(--pine-dimension-125);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-button--filter:disabled{background-color:var(--pine-color-background-container)}.pds-button--filter:hover{color:var(--color-text-hover)}.pds-button--unstyled{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-text-default:var(--pine-color-text);--button-loader-color:var(--pine-color-text);border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}.pds-button__content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-xs);position:relative;width:100%}.pds-button__icon{display:-ms-inline-flexbox;display:inline-flex}.pds-button__icon:not(:has(::slotted(*))){display:none}.pds-button__text{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;white-space:nowrap}.pds-button__icon--hidden,.pds-button__text--hidden{opacity:0}.pds-button__loader{height:var(--pine-dimension-250);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--pine-dimension-250)}.pds-button--loading{cursor:wait;pointer-events:none}.pds-button--loading .pds-button__loader pds-loader{--loader-color:var(--button-loader-color)}.pds-button--small{min-height:var(--pine-dimension-400);padding:calc(var(--pine-dimension-2xs) - var(--pine-border-width)) var(--pine-dimension-sm)}.pds-button--micro{font-size:var(--pine-font-size-085);min-height:var(--pine-dimension-300);padding:var(--pine-dimension-025) var(--pine-dimension-xs)}.pds-button--icon-only{-ms-flex-align:center;align-items:center;border-radius:var(--pine-border-radius-full);height:var(--button-dimension);-ms-flex-pack:center;justify-content:center;min-height:var(--button-dimension);min-width:var(--button-dimension);padding:var(--pine-dimension-xs);width:var(--button-dimension)}.pds-button--icon-only .pds-button__content{height:100%;-ms-flex-pack:center;justify-content:center;width:100%}.pds-button--icon-only .pds-button__text--hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-button--icon-only.pds-button--small{height:var(--pine-dimension-400);min-height:var(--pine-dimension-400);min-width:var(--pine-dimension-400);padding:var(--pine-dimension-2xs);width:var(--pine-dimension-400)}.pds-button--icon-only.pds-button--micro{height:var(--pine-dimension-300);min-height:var(--pine-dimension-300);min-width:var(--pine-dimension-300);padding:var(--pine-dimension-3xs);width:var(--pine-dimension-300)}";const l=class{constructor(t){o(this,t);this.pdsClick=r(this,"pdsClick");this.disabled=false;this.fullWidth=false;this.icon=null;this.iconOnly=false;this.loading=false;this.type="button";this.size="default";this.variant="primary";this.handleClick=o=>{if(this.loading){o.preventDefault();return}if(this.disabled){o.preventDefault();return}if(!this.href&&this.type!="button"){if(i(this.el)){const r=this.el.closest("form");if(r){o.preventDefault();const t=document.createElement("button");t.type=this.type;t.style.display="none";r.appendChild(t);t.click();t.remove()}}}this.pdsClick.emit(o)}}handleFormKeyDown(o){if(o.key!=="Enter"||this.type!=="submit"||this.href||this.disabled){return}const r=o.target;if(!r||typeof r.matches!=="function"){return}const t=this.el.closest("form");if(!t||!r||!t.contains(r)){return}const e=r.matches('input:not([type="submit"]):not([type="button"]):not([type="reset"])')||r.matches("pds-input")||r.matches("pds-select")||r.matches("pds-switch")||r.matches("pds-checkbox")||r.matches("pds-radio");if(e){const r=Array.from(t.querySelectorAll('pds-button, button[type="submit"], input[type="submit"]'));const e=r.filter((o=>{if(o.tagName.toLowerCase()==="pds-button"){const r=o;return r.type==="submit"&&!r.disabled}else{return!o.hasAttribute("disabled")}}));if(e.length>0&&e[0]===this.el){o.preventDefault();this.el.click()}}}classNames(){const o=["pds-button"];if(this.variant){o.push("pds-button--"+this.variant)}if(this.size&&this.size!=="default"){o.push("pds-button--"+this.size)}if(this.iconOnly){o.push("pds-button--icon-only")}if(this.loading){o.push("pds-button--loading")}return o.join(" ")}renderStartContent(){if(this.variant==="filter"){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:d,part:"icon","aria-hidden":"true"})}const o=this.icon&&this.variant!=="disclosure";if(Boolean(o)){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",name:this.icon,part:"icon","aria-hidden":"true"})}return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"start"}))}renderEndContent(){if(this.iconOnly){return null}if(this.variant==="disclosure"){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:a,part:"caret","aria-hidden":"true"})}return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"end"}))}render(){const o={class:this.classNames(),part:"button"};const r=()=>{if(this.href){return Object.assign(Object.assign({},o),{href:this.disabled?null:this.href,target:this.target})}return Object.assign(Object.assign({},o),{"aria-busy":this.loading?"true":null,"aria-live":this.loading?"polite":null,disabled:this.disabled,name:this.name,type:this.type,value:this.value})};const n=this.href?"a":"button";const i=this.loading||this.iconOnly;const d=t("div",{class:"pds-button__content",part:"button-content"},this.renderStartContent(),t("span",{class:`pds-button__text ${i?"pds-button__text--hidden":""}`,part:"button-text"},t("slot",null)),this.loading&&t("span",{class:"pds-button__loader"},t("pds-loader",{"is-loading":true,size:"var(--pine-font-size-body-2xl)",variant:"spinner",exportparts:"loader-svg"},"Loading...")),this.renderEndContent());return t(e,{"aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},t(n,Object.assign({},r()),d))}get el(){return n(this)}};l.style=s;export{l as pds_button};
|
|
2
|
+
//# sourceMappingURL=p-94c73d98.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","createEvent","h","Host","getElement","hasShadowDom","addCircle","caretDown","pdsButtonCss","PdsButton","constructor","hostRef","this","pdsClick","disabled","fullWidth","icon","iconOnly","loading","type","size","variant","handleClick","ev","preventDefault","href","el","form","closest","fakeButton","document","createElement","style","display","appendChild","click","remove","emit","handleFormKeyDown","event","key","target","matches","contains","isFormInput","allSubmitButtons","Array","from","querySelectorAll","enabledSubmitButtons","filter","button","tagName","toLowerCase","pdsButton","hasAttribute","length","classNames","push","join","renderStartContent","class","part","hasIcon","Boolean","name","renderEndContent","render","commonProps","attributes","Object","assign","value","ContentElement","hideText","content","exportparts","id","componentId","onClick"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-CCKncKbB.system.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-strong);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n left: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n right: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n --pds-input-background: var(--pine-color-accent-disabled);\n --pds-input-border-color: var(--pine-color-accent);\n --pds-input-border-color-hover: var(--pine-color-accent-hover);\n --pds-input-text-color: var(--pine-color-text-accent);\n\n &::part(prefix),\n &::part(suffix) {\n color: var(--pine-color-text-accent);\n }\n\n .pds-input__field:focus-visible {\n outline-color: var(--pine-color-focus-ring);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-strong);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n\n :host-context([data-theme=\"dark\"]) & {\n border-color: var(--pine-color-red-950);\n }\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n :host-context([data-theme=\"dark\"]) & {\n background-color: var(--pine-color-red-950);\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Custom styling for the search clear (x) button\n.pds-input__field::-webkit-search-cancel-button {\n appearance: none;\n background-color: var(--pds-input-placeholder-color);\n cursor: pointer;\n height: var(--pine-dimension-sm);\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");\n mask-size: contain;\n width: var(--pine-dimension-sm);\n}\n\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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 * Emitted when a key is pressed down in the input.\n */\n @Event() pdsKeyDown!: EventEmitter<KeyboardEvent>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Specifies the maximum value for the input field.\n */\n @Prop() max?: string;\n\n /**\n * Specifies the maximum number of characters allowed in the input field.\n */\n @Prop() maxlength?: string;\n\n /**\n * Specifies the minimum value for the input field.\n */\n @Prop() min?: string;\n\n /**\n * Specifies the minimum number of characters allowed in the input field.\n */\n @Prop() minlength?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the regular expression that the input value is checked against.\n */\n @Prop() pattern?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Works with the `min` and `max` attributes to define increments for the input field.\n */\n @Prop() step?: string;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines whether or not the input field takes full width of its container.\n */\n @Prop() fullWidth?: boolean;\n\n /**\n * Applies highlight styling to the input field.\n */\n @Prop({ reflect: true }) highlight?: boolean;\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n }\n\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 private onKeyDownEvent = (ev: KeyboardEvent) => {\n this.pdsKeyDown.emit(ev);\n };\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /**\n * Updates the form value using ElementInternals API\n */\n private updateFormValue() {\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value || null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is reset\n */\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is disabled\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /**\n * Form Associated Custom Elements API: Called to restore form state\n */\n formStateRestoreCallback(state: string | FormData | null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid || !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div class=\"pds-input__label-wrapper\">\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onKeyDown={this.onKeyDownEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-BJPmPVaF.system.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-strong);\n --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n --pds-input-icon-color: var(--pine-color-text-secondary);\n --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n --pds-input-error-color: var(--pine-color-text-message-danger);\n --pds-input-error-background: var(--pine-input-color-background-danger);\n --pds-input-error-border: var(--pine-color-border-danger);\n --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n --pds-input-addon-background: var(--pine-color-background-subtle);\n --pds-input-addon-color: var(--pine-color-text-secondary);\n --pds-input-field-min-height: var(--pine-dimension-450);\n --box-shadow-focus: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n\n pds-select::part(select) {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n }\n\n &::part(prefix),\n &::part(suffix) {\n align-items: center;\n color: var(--pine-color-text-label-readonly);\n display: flex;\n height: 100%;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n white-space: nowrap;\n z-index: var(--pine-z-index-raised);\n }\n\n &::part(prefix) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n left: var(--pds-input-padding-x);\n }\n\n &::part(suffix) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n right: var(--pds-input-padding-x);\n }\n\n &::part(prepend),\n &::part(append) {\n align-items: center;\n background-color: var(--pds-input-addon-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n color: var(--pds-input-addon-color);\n display: flex;\n overflow: visible;\n }\n\n &::part(prepend) {\n border-end-start-radius: var(--pds-input-border-radius);\n border-inline-end: var(--pine-border-width-none);\n border-start-start-radius: var(--pds-input-border-radius);\n }\n\n &::part(append) {\n border-end-end-radius: var(--pds-input-border-radius);\n border-inline-start: var(--pine-border-width-none);\n border-start-end-radius: var(--pds-input-border-radius);\n }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n --pds-button-background: var(--pds-input-addon-background);\n --pds-button-border: var(--pine-border-width-none);\n --pds-button-border-radius: var(--pine-dimension-none);\n --pds-button-border-radius-end-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-start: var(--pine-dimension-none);\n --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-end: var(--pine-dimension-none);\n --pds-select-border-radius-start-end: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n --pds-select-background: var(--pds-input-addon-background);\n --pds-select-border: var(--pine-border-width-none);\n --pds-select-border-radius-end-start: var(--pine-dimension-none);\n --pds-select-border-radius-start-start: var(--pine-dimension-none);\n --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n:host([disabled=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-disabled-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n }\n}\n\n:host([full-width=\"true\"]) {\n width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n &::part(prepend),\n &::part(append) {\n background-color: var(--pds-input-error-background);\n border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n --pds-input-background: var(--pine-color-accent-disabled);\n --pds-input-border-color: var(--pine-color-accent);\n --pds-input-border-color-hover: var(--pine-color-accent-hover);\n --pds-input-text-color: var(--pine-color-text-accent);\n\n &::part(prefix),\n &::part(suffix) {\n color: var(--pine-color-text-accent);\n }\n\n .pds-input__field:focus-visible {\n outline-color: var(--pine-color-focus-ring);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n color: var(--pine-color-text-strong);\n margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n margin-block-end: 0;\n}\n\n.pds-input__action {\n align-items: center;\n display: flex;\n gap: var(--pine-dimension-xs);\n margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n align-items: center;\n display: flex;\n position: relative;\n width: 100%;\n\n &.has-prefix .pds-input__field {\n padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n }\n\n &.has-suffix .pds-input__field {\n padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n }\n\n &.has-prepend .pds-input__field {\n border-end-start-radius: var(--pine-dimension-none);\n border-start-start-radius: var(--pine-dimension-none);\n }\n\n &.has-append .pds-input__field {\n border-end-end-radius: var(--pine-dimension-none);\n border-start-end-radius: var(--pine-dimension-none);\n }\n}\n\n.pds-input__field {\n background: var(--pds-input-background);\n border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n border-radius: var(--pds-input-border-radius);\n box-sizing: border-box;\n color: var(--pds-input-text-color);\n flex: 1;\n font: var(--pds-input-font);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-input-field-min-height);\n min-width: var(--pine-dimension-none);\n padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n transition: border-color 0.2s ease;\n width: 100%;\n\n &:hover:not(:disabled) {\n border-color: var(--pds-input-border-color-hover);\n }\n\n &:disabled {\n background: var(--pds-input-disabled-background);\n border-color: var(--pine-color-border-disabled);\n color: var(--pds-input-disabled-text-color);\n cursor: not-allowed;\n\n &::placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n }\n\n .has-error &:hover:not(:disabled) {\n border-color: var(--pds-input-error-border-hover);\n\n :host-context([data-theme=\"dark\"]) & {\n border-color: var(--pine-color-red-950);\n }\n }\n\n &:focus-visible:not(.has-error) {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n position: relative;\n z-index: 1;\n\n :host([has-prepend]) &,\n :host([has-append]) &,\n :host([has-prefix]) &,\n :host([has-suffix]) & {\n outline-offset: var(--pine-dimension-none);\n }\n }\n\n &::placeholder {\n color: var(--pds-input-placeholder-color);\n }\n\n .has-error & {\n background-color: var(--pds-input-error-background);\n border-color: var(--pds-input-error-border);\n\n :host-context([data-theme=\"dark\"]) & {\n background-color: var(--pine-color-red-950);\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n position: relative;\n z-index: 1;\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: var(--pine-dimension-none);\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n color: var(--pds-input-error-color);\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Custom styling for the search clear (x) button\n.pds-input__field::-webkit-search-cancel-button {\n appearance: none;\n background-color: var(--pds-input-placeholder-color);\n cursor: pointer;\n height: var(--pine-dimension-sm);\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");\n mask-size: contain;\n width: var(--pine-dimension-sm);\n}\n\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, 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 * Emitted when a key is pressed down in the input.\n */\n @Event() pdsKeyDown!: EventEmitter<KeyboardEvent>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if (this.nativeInput) {\n this.nativeInput.focus();\n }\n }\n\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n * Note: When true, the action slot is also hidden to maintain a minimal UI.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Specifies the maximum value for the input field.\n */\n @Prop() max?: string;\n\n /**\n * Specifies the maximum number of characters allowed in the input field.\n */\n @Prop() maxlength?: string;\n\n /**\n * Specifies the minimum value for the input field.\n */\n @Prop() min?: string;\n\n /**\n * Specifies the minimum number of characters allowed in the input field.\n */\n @Prop() minlength?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the regular expression that the input value is checked against.\n */\n @Prop() pattern?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Works with the `min` and `max` attributes to define increments for the input field.\n */\n @Prop() step?: string;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines whether or not the input field takes full width of its container.\n */\n @Prop() fullWidth?: boolean;\n\n /**\n * Applies highlight styling to the input field.\n */\n @Prop({ reflect: true }) highlight?: boolean;\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n private updateAddonWidths() {\n requestAnimationFrame(() => {\n if (this.prefixEl) {\n const prefixWidth = this.prefixEl.offsetWidth;\n this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n }\n\n if (this.suffixEl) {\n const suffixWidth = this.suffixEl.offsetWidth;\n this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n }\n });\n }\n\n private renderPrefix() {\n const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n if (hasPrefix) {\n return (\n <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderSuffix() {\n const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n if (hasSuffix) {\n return (\n <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderPrepend() {\n const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n if (hasPrepend) {\n return (\n <div class=\"pds-input__prepend\" part=\"prepend\">\n <slot name=\"prepend\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAppend() {\n const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n if (hasAppend) {\n return (\n <div class=\"pds-input__append\" part=\"append\">\n <slot name=\"append\"></slot>\n </div>\n );\n }\n return null;\n }\n\n private renderAction() {\n const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n if (hasAction) {\n return (\n <div class=\"pds-input__action\" part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n );\n }\n return null;\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n };\n this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n // Store the original pdsInput event emitter\n this.originalPdsInput = this.pdsInput;\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n }\n\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 private onKeyDownEvent = (ev: KeyboardEvent) => {\n this.pdsKeyDown.emit(ev);\n };\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n /**\n * Updates the form value using ElementInternals API\n */\n private updateFormValue() {\n if (this.internals && this.internals.setFormValue) {\n const value = this.getValue();\n this.internals.setFormValue(value || null);\n\n // Set validity based on native input validation\n if (this.nativeInput && this.internals && this.internals.setValidity) {\n this.internals.setValidity(\n this.nativeInput.validity,\n this.nativeInput.validationMessage,\n this.nativeInput\n );\n }\n }\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is reset\n */\n formResetCallback() {\n this.value = '';\n this.updateFormValue();\n }\n\n /**\n * Form Associated Custom Elements API: Called when the form is disabled\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n /**\n * Form Associated Custom Elements API: Called to restore form state\n */\n formStateRestoreCallback(state: string | FormData | null) {\n if (typeof state === 'string') {\n this.value = state;\n } else if (state instanceof FormData && this.name) {\n // Extract value from FormData using the input's name\n const value = state.get(this.name);\n if (typeof value === 'string') {\n this.value = value;\n }\n }\n }\n\n render() {\n const {\n componentId,\n disabled,\n errorMessage,\n helperMessage,\n invalid = false,\n label,\n } = this;\n\n const value = this.getValue();\n\n const inputWrapperClasses = {\n 'pds-input__field-wrapper': true,\n 'has-focus': this.hasFocus,\n 'has-error': invalid || !!errorMessage,\n 'is-disabled': disabled,\n 'has-prefix': this.hasPrefix,\n 'has-suffix': this.hasSuffix,\n 'has-prepend': this.hasPrepend,\n 'has-append': this.hasAppend,\n };\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n has-prefix={this.hasPrefix ? 'true' : null}\n has-suffix={this.hasSuffix ? 'true' : null}\n has-prepend={this.hasPrepend ? 'true' : null}\n has-append={this.hasAppend ? 'true' : null}\n has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n full-width={this.fullWidth ? 'true' : null}\n >\n <div class=\"pds-input\">\n {label && (\n <div class=\"pds-input__label-wrapper\">\n <label htmlFor={componentId} class=\"pds-input__label\">\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {label}\n {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n </span>\n </label>\n {!this.hideLabel && this.renderAction()}\n </div>\n )}\n\n <div class={inputWrapperClasses}>\n {this.renderPrepend()}\n {this.renderPrefix()}\n <input\n ref={(input) => (this.nativeInput = input)}\n class=\"pds-input__field\"\n aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n aria-invalid={invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={disabled}\n id={componentId}\n max={this.max}\n maxlength={this.maxlength}\n min={this.min}\n minlength={this.minlength}\n name={this.name}\n pattern={this.pattern}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n step={this.step}\n type={this.type}\n value={value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onKeyDown={this.onKeyDownEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.renderSuffix()}\n {this.renderAppend()}\n </div>\n\n {helperMessage && (\n <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n {helperMessage}\n </p>\n )}\n\n {errorMessage && (\n <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n <pds-icon icon={danger} size=\"small\" />\n {errorMessage}\n </p>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;MAAA,MAAM,iBAAiB,GAAG,uEAAuE;;MCAjG,MAAM,QAAQ,GAAG,oTAAoT;;MCArU,MAAM,WAAW,GAAG,2lZAA2lZ;;YCqBlmZ,QAAQ,wBAAA,MAAA;MANrB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;;;MASU,QAAA,IAAmB,CAAA,mBAAA,GAAe,EAAE;MACpC,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;MAS3B;;MAEG;MACM,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAE1B;;MAEG;MACM,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAE1B;;MAEG;MACM,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK;MAE3B;;MAEG;MACM,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAE1B;;MAEG;MACM,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAyI1B;;;;MAIG;MACK,QAAA,IAAI,CAAA,IAAA,GAAG,MAAM;MAErB;;MAEG;MACoB,QAAA,IAAK,CAAA,KAAA,GAA4B,EAAE;MAY1D;;MAEG;MACM,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;MAwIjB,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,EAAS,KAAI;MACnC,YAAA,MAAM,KAAK,GAAG,EAAE,CAAC,MAAiC;kBAClD,IAAI,KAAK,EAAE;sBACT,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE;;MAEhC,YAAA,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC;MAC1B,SAAC;MAEO,QAAA,IAAA,CAAA,aAAa,GAAG,CAAC,EAAS,KAAI;MACpC,YAAA,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC;MAC1B,SAAC;MAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,EAAc,KAAI;MACvC,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;kBAErB,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,EAAE;MACpC;;;MAGG;MACH,gBAAA,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC;;MAG1B,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;MACvB,SAAC;MAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,EAAc,KAAI;MACxC,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;MACpB,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK;MAE9B,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;MACxB,SAAC;MAEO,QAAA,IAAkB,CAAA,kBAAA,GAAG,MAAK;MAChC,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI;MACzB,SAAC;MAEO,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;MAC9B,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK;MAC1B,SAAC;MAEO,QAAA,IAAA,CAAA,cAAc,GAAG,CAAC,EAAiB,KAAI;MAC7C,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;MAC1B,SAAC;MA6KF;MAreC;;;MAGG;MAEH,IAAA,MAAM,QAAQ,GAAA;MACZ,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE;MACpB,YAAA,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;;;UAgIpB,iBAAiB,GAAA;cACvB,qBAAqB,CAAC,MAAK;MACzB,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,gBAAA,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW;MAC7C,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAA,EAAG,WAAW,CAAA,EAAA,CAAI,CAAC;;MAGjE,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,gBAAA,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW;MAC7C,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAA,EAAG,WAAW,CAAA,EAAA,CAAI,CAAC;;MAEnE,SAAC,CAAC;;UAGI,YAAY,GAAA;MAClB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;cACnE,IAAI,SAAS,EAAE;kBACb,QACE,WAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAiB,EAAA,EACzF,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,MAAM,IAAI,CAAC,iBAAiB,EAAE,EAAS,CAAA,CACrE;;MAGV,QAAA,OAAO,IAAI;;UAGL,YAAY,GAAA;MAClB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;cACnE,IAAI,SAAS,EAAE;kBACb,QACE,WAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAiB,EAAA,EACzF,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,MAAM,IAAI,CAAC,iBAAiB,EAAE,EAAS,CAAA,CACrE;;MAGV,QAAA,OAAO,IAAI;;UAGL,aAAa,GAAA;MACnB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,kBAAkB,CAAC,KAAK,IAAI;cACrE,IAAI,UAAU,EAAE;kBACd,QACE,WAAK,KAAK,EAAC,oBAAoB,EAAC,IAAI,EAAC,SAAS,EAAA,EAC5C,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,SAAS,EAAQ,CAAA,CACxB;;MAGV,QAAA,OAAO,IAAI;;UAGL,YAAY,GAAA;MAClB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;cACnE,IAAI,SAAS,EAAE;kBACb,QACE,WAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC1C,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,QAAQ,EAAQ,CAAA,CACvB;;MAGV,QAAA,OAAO,IAAI;;UAGL,YAAY,GAAA;MAClB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;cACnE,IAAI,SAAS,EAAE;kBACb,QACE,WAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC1C,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,QAAQ,EAAQ,CAAA,CACvB;;MAGV,QAAA,OAAO,IAAI;;UAGb,iBAAiB,GAAA;MACf,QAAA,IAAI,CAAC,mBAAmB,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACnB,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAClC;MACD,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;MAClE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;MAClE,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,kBAAkB,CAAC,KAAK,IAAI;MACpE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;MAClE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI;;MAGlE,QAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ;;UAGvC,iBAAiB,GAAA;;cAEf,IAAI,IAAI,CAAC,EAAE,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;kBAC9C,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,eAAe,EAAE;;;UAI9C,gBAAgB,GAAA;cACd,IAAI,CAAC,eAAe,EAAE;cACtB,IAAI,CAAC,iBAAiB,EAAE;;cAExB,IAAI,CAAC,eAAe,EAAE;;UAGxB,kBAAkB,GAAA;cAChB,IAAI,CAAC,iBAAiB,EAAE;;UAIhB,eAAe,GAAA;cACvB,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,IAAI;MAErD;;;MAGG;MACH,QAAA,IAAI,CAAC,QAAQ,GAAG,QAAQ,KAAK,SAAS,GAAG,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,cAAhB,gBAAgB,GAAI,QAAQ,GAAG,aAAa,CAAC,QAAQ,EAAE,QAAQ,CAAC;;UAIjG,YAAY,GAAA;MACpB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW;MACpC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;MAE7B,QAAA,IAAI,WAAW,IAAI,WAAW,CAAC,KAAK,KAAK,KAAK,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;MACnE,YAAA,WAAW,CAAC,KAAK,GAAG,KAAK;;;cAI3B,IAAI,CAAC,eAAe,EAAE;;UAGhB,QAAQ,GAAA;MACd,QAAA,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,EAAE,QAAQ,EAAE;;MAgD/F;;MAEG;MACK,IAAA,eAAe,CAAC,KAAa,EAAA;MACnC,QAAA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI;MACtB,QAAA,MAAM,QAAQ,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAE;MAEzD,QAAA,IAAI,CAAC,YAAY,GAAG,QAAQ;MAC5B,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;;MAGjD;;MAEG;MACK,IAAA,eAAe,CAAC,KAAa,EAAA;MACnC,QAAA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI;;MAGtB,QAAA,MAAM,QAAQ,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAE;MAEzD,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;;MAGhD;;MAEG;UACK,eAAe,GAAA;cACrB,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE;MACjD,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;kBAC7B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,KAAK,IAAI,IAAI,CAAC;;MAG1C,YAAA,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE;sBACpE,IAAI,CAAC,SAAS,CAAC,WAAW,CACxB,IAAI,CAAC,WAAW,CAAC,QAAQ,EACzB,IAAI,CAAC,WAAW,CAAC,iBAAiB,EAClC,IAAI,CAAC,WAAW,CACjB;;;;MAKP;;MAEG;UACH,iBAAiB,GAAA;MACf,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;cACf,IAAI,CAAC,eAAe,EAAE;;MAGxB;;MAEG;MACH,IAAA,oBAAoB,CAAC,QAAiB,EAAA;MACpC,QAAA,IAAI,CAAC,QAAQ,GAAG,QAAQ;;MAG1B;;MAEG;MACH,IAAA,wBAAwB,CAAC,KAA+B,EAAA;MACtD,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;MAC7B,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;mBACb,IAAI,KAAK,YAAY,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;;kBAEjD,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;MAClC,YAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;MAC7B,gBAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;;;UAKxB,MAAM,GAAA;MACJ,QAAA,MAAM,EACJ,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,OAAO,GAAG,KAAK,EACf,KAAK,GACN,GAAG,IAAI;MAER,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;MAE7B,QAAA,MAAM,mBAAmB,GAAG;MAC1B,YAAA,0BAA0B,EAAE,IAAI;kBAChC,WAAW,EAAE,IAAI,CAAC,QAAQ;MAC1B,YAAA,WAAW,EAAE,OAAO,IAAI,CAAC,CAAC,YAAY;MACtC,YAAA,aAAa,EAAE,QAAQ;kBACvB,YAAY,EAAE,IAAI,CAAC,SAAS;kBAC5B,YAAY,EAAE,IAAI,CAAC,SAAS;kBAC5B,aAAa,EAAE,IAAI,CAAC,UAAU;kBAC9B,YAAY,EAAE,IAAI,CAAC,SAAS;eAC7B;MAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,eAAA,EACY,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,EAC7B,eAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,gBAChC,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,IAAI,EAAA,YAAA,EAC9B,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,IAAI,iBAC7B,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,IAAI,EAAA,YAAA,EAChC,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,IAAI,EAAA,YAAA,EAC9B,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,IAAI,EACjD,YAAA,EAAA,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,IAAI,EAAA,EAE1C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACnB,KAAK,KACJ,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EACnC,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,WAAW,EAAE,KAAK,EAAC,kBAAkB,EAAA,EACnD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,IAAI,CAAC,SAAS,GAAG,iBAAiB,GAAG,EAAE,EAAA,EACjD,KAAK,EACL,IAAI,CAAC,QAAQ,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,+BAA+B,EAAU,EAAA,IAAA,CAAA,CAClE,CACD,EACP,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,YAAY,EAAE,CACnC,CACP,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,mBAAmB,EAAA,EAC5B,IAAI,CAAC,aAAa,EAAE,EACpB,IAAI,CAAC,YAAY,EAAE,EACpB,CAAA,CAAA,OAAA,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,EAC1C,KAAK,EAAC,kBAAkB,EAAA,kBAAA,EACN,iBAAiB,CAAC,WAAW,EAAE,OAAO,EAAE,aAAa,CAAC,EAC1D,cAAA,EAAA,OAAO,GAAG,MAAM,GAAG,SAAS,EAC1C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,WAAW,EACf,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,SAAS,EAAE,IAAI,CAAC,cAAc,EAC9B,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,EAC3C,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,IACnC,IAAI,CAAC,mBAAmB,CAC5B,CAAA,EACD,IAAI,CAAC,YAAY,EAAE,EACnB,IAAI,CAAC,YAAY,EAAE,CAChB,EAEL,aAAa,KACZ,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,2BAA2B,EAAC,EAAE,EAAE,SAAS,CAAC,WAAW,EAAE,QAAQ,CAAC,EACtE,EAAA,aAAa,CACZ,CACL,EAEA,YAAY,KACX,CAAG,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAC,EAAE,EAAE,SAAS,CAAC,WAAW,EAAE,OAAO,CAAC,EAAA,EACrE,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,OAAO,EAAG,CAAA,EACtC,YAAY,CACX,CACL,CACG,CACD;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register([],(function(e){"use strict";return{execute:function(){e("e",u);var r=e("m",(function(e,r){return"".concat(e,"__").concat(r,"-message")}));var t=e("a",(function(e,t,n){if(!n)return;var u=r(e,"helper");if(t)u=r(e,"error");return u}));var n=e("i",(function(e,r){if(!e||!r)return;if(r.required===true){e.checkValidity()===false?r.invalid=true:r.invalid=false}}));function u(e,r){Object.defineProperty(e,"type",{get:typeof r==="function"?r:function(){return r},enumerable:true,configurable:false})}}}}));
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
System.register([],(function(e){"use strict";return{execute:function(){e("e",u);var r=e("m",(function(e,r){return"".concat(e,"__").concat(r,"-message")}));var t=e("a",(function(e,t,n){if(!n)return;var u=r(e,"helper");if(t)u=r(e,"error");return u}));var n=e("i",(function(e,r){if(!e||!r)return;if(r.required===true){e.checkValidity()===false?r.invalid=true:r.invalid=false}}));function u(e,r){if(Object.getOwnPropertyDescriptor(e,"type"))return;Object.defineProperty(e,"type",{get:typeof r==="function"?r:function(){return r},enumerable:true,configurable:false})}}}}));
|
|
2
|
+
//# sourceMappingURL=p-Bch44a-T.system.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-
|
|
1
|
+
{"version":3,"file":"p-Bch44a-T.system.js","sources":["src/utils/form.ts"],"sourcesContent":["/**\n * Create id for messaging\n */\nexport const messageId = (id: string, messageType: string) => {\n return `${id}__${messageType}-message`;\n};\n\n/**\n * Assign aria-description id to relate messages with form element\n */\nexport const assignDescription = (id: string, invalid: boolean, helperMessage: string) => {\n if (!helperMessage) return\n\n let relatedId = messageId(id, 'helper')\n\n if (invalid) relatedId = messageId(id, 'error');\n\n return relatedId;\n};\n\n/**\n * Updates the `invalid` prop of a form element based on it's values validity\n */\nexport const isRequired = (target, component) => {\n if ( !target || !component ) return;\n if (component.required === true) {\n (target.checkValidity() === false) ? component.invalid = true : component.invalid = false;\n }\n}\n\n/**\n * Exposes a readonly type property on a custom form element to match native form element behavior.\n * This makes the type property enumerable and accessible via element.type, matching native HTML elements.\n * The property is non-configurable, preventing it from being redefined or deleted at runtime.\n *\n * @param element - The custom element to add the type property to\n * @param type - The type value (string literal) or a getter function that returns the type\n */\nexport function exposeTypeProperty(element: Element, type: string | (() => string)) {\n if (Object.getOwnPropertyDescriptor(element, 'type')) return;\n\n Object.defineProperty(element, 'type', {\n get: typeof type === 'function' ? type : () => type,\n enumerable: true,\n configurable: false\n });\n}\n"],"names":[],"mappings":";;;;;;;YAAA;;YAEG;kBACU,SAAS,gBAAG,CAAC,EAAU,EAAE,WAAmB,KAAI;YAC3D,IAAA,OAAO,CAAG,EAAA,EAAE,CAAK,EAAA,EAAA,WAAW,UAAU;YACxC;YAEA;;YAEG;AACU,kBAAA,iBAAiB,gBAAG,CAAC,EAAU,EAAE,OAAgB,EAAE,aAAqB,KAAI;YACvF,IAAA,IAAI,CAAC,aAAa;oBAAE;gBAEpB,IAAI,SAAS,GAAG,SAAS,CAAC,EAAE,EAAE,QAAQ,CAAC;YAEvC,IAAA,IAAI,OAAO;YAAE,QAAA,SAAS,GAAG,SAAS,CAAC,EAAE,EAAE,OAAO,CAAC;YAE/C,IAAA,OAAO,SAAS;YAClB;YAEA;;YAEG;kBACU,UAAU,gBAAG,CAAC,MAAM,EAAE,SAAS,KAAI;YAC9C,IAAA,IAAK,CAAC,MAAM,IAAI,CAAC,SAAS;oBAAG;YAC7B,IAAA,IAAI,SAAS,CAAC,QAAQ,KAAK,IAAI,EAAE;oBAC/B,CAAC,MAAM,CAAC,aAAa,EAAE,KAAK,KAAK,IAAI,SAAS,CAAC,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,OAAO,GAAG,KAAK;;YAE7F;YAEA;;;;;;;YAOG;YACa,SAAA,kBAAkB,CAAC,OAAgB,EAAE,IAA6B,EAAA;YAChF,IAAA,IAAI,MAAM,CAAC,wBAAwB,CAAC,OAAO,EAAE,MAAM,CAAC;oBAAE;YAEtD,IAAA,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE;YACrC,QAAA,GAAG,EAAE,OAAO,IAAI,KAAK,UAAU,GAAG,IAAI,GAAG,MAAM,IAAI;YACnD,QAAA,UAAU,EAAE,IAAI;YAChB,QAAA,YAAY,EAAE;YACf,KAAA,CAAC;YACJ;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-DXoBK65z.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-border);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, Element, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId, exposeTypeProperty } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsCheckbox {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsCheckboxElement;\n\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.updateFormValue();\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n componentDidLoad() {\n this.updateFormValue();\n }\n\n @Watch('checked')\n checkedChanged() {\n this.updateFormValue();\n }\n\n private updateFormValue() {\n if (typeof jest !== 'undefined' || typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {\n return;\n }\n\n if (this.internals && this.internals.setFormValue) {\n // For checkboxes, only send the value when checked, otherwise send null\n const formValue = this.checked ? (this.value || 'on') : null;\n this.internals.setFormValue(formValue);\n }\n\n if (this.internals && this.internals.setValidity) {\n this.internals.setValidity({});\n }\n }\n\n formStateRestoreCallback(state: string | FormData | null) {\n if (state instanceof FormData) {\n // For checkboxes, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name as string) === value;\n } else if (typeof state === 'string') {\n // Restore from string state\n this.checked = state === (this.value || 'on');\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n {...this.inheritedAttributes}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-BnJypAy2.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-border);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, Element, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId, exposeTypeProperty } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsCheckbox {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsCheckboxElement;\n\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.updateFormValue();\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\n this.internals = this.el.attachInternals();\n }\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n componentDidLoad() {\n this.updateFormValue();\n }\n\n @Watch('checked')\n checkedChanged() {\n this.updateFormValue();\n }\n\n private updateFormValue() {\n if (typeof jest !== 'undefined' || typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {\n return;\n }\n\n if (this.internals && this.internals.setFormValue) {\n // For checkboxes, only send the value when checked, otherwise send null\n const formValue = this.checked ? (this.value || 'on') : null;\n this.internals.setFormValue(formValue);\n }\n\n if (this.internals && this.internals.setValidity) {\n this.internals.setValidity({});\n }\n }\n\n formStateRestoreCallback(state: string | FormData | null) {\n if (state instanceof FormData) {\n // For checkboxes, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name as string) === value;\n } else if (typeof state === 'string') {\n // Restore from string state\n this.checked = state === (this.value || 'on');\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n {...this.inheritedAttributes}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const e=(e,t)=>`${e}__${t}-message`;const t=(t,r,n)=>{if(!n)return;let f=e(t,"helper");if(r)f=e(t,"error");return f};const r=(e,t)=>{if(!e||!t)return;if(t.required===true){e.checkValidity()===false?t.invalid=true:t.invalid=false}};function n(e,t){if(Object.getOwnPropertyDescriptor(e,"type"))return;Object.defineProperty(e,"type",{get:typeof t==="function"?t:()=>t,enumerable:true,configurable:false})}export{t as a,n as e,r as i,e as m};
|
|
2
|
+
//# sourceMappingURL=p-CN-lL5QG.js.map
|