@nysds/components 1.15.0 → 1.16.0-alpha-2

package/dist/nysds.js

@@ -1,5 +1,5 @@
 (function(b,me){typeof exports=="object"&&typeof module<"u"?me(exports):typeof define=="function"&&define.amd?define(["exports"],me):(b=typeof globalThis<"u"?globalThis:b||self,me(b.NYSDS={}))})(this,(function(b){"use strict";/*!
-   * New York State Design System (v1.15.0)
+   * New York State Design System v1.16.0-alpha-2
    * Description: A design system for New York State's digital products.
    * Repository: https://github.com/its-hcd/nysds
    * License: MIT
@@ -530,7 +530,7 @@
       <nys-errormessage
         ?showError=${this.showError}
         errorMessage=${this._internals.validationMessage||this.errorMessage}
-      ></nys-errormessage>`}},Ee.styles=_(Or),Ee.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0},Ee.formAssociated=!0,Ee);V([a({type:String,reflect:!0})],A.prototype,"id"),V([a({type:String,reflect:!0})],A.prototype,"name"),V([a({type:String,reflect:!0})],A.prototype,"width"),V([a({type:Boolean})],A.prototype,"hideTodayButton"),V([a({type:Boolean})],A.prototype,"hideClearButton"),V([a({type:Boolean,reflect:!0})],A.prototype,"disabled"),V([a({type:Boolean,reflect:!0})],A.prototype,"required"),V([a({type:Boolean,reflect:!0})],A.prototype,"optional"),V([a({type:Boolean,reflect:!0})],A.prototype,"showError"),V([a({type:String})],A.prototype,"errorMessage"),V([a({type:String,reflect:!0})],A.prototype,"form"),V([a({type:String})],A.prototype,"tooltip"),V([a({type:String})],A.prototype,"type"),V([a({type:String})],A.prototype,"label"),V([a({type:String})],A.prototype,"description"),V([a({type:String})],A.prototype,"startDate"),V([a({type:Boolean,reflect:!0})],A.prototype,"inverted"),V([a({type:Object,converter:{fromAttribute:r=>r?A.prototype._parseLocalDate(r):void 0,toAttribute:r=>r?typeof r=="string"?r:r.toISOString().split("T")[0]:""}})],A.prototype,"value"),V([m()],A.prototype,"datepickerIsOpen");let Ao=A;customElements.get("nys-datepicker")||customElements.define("nys-datepicker",Ao);const Bn=":host{--_nys-divider-size: var(--nys-size-1px, 1px);--_nys-divider-color: var(--nys-color-neutral-500, #797c7f);--_nys-divider-width: 100%}:host([inverted]){--_nys-divider-color: var(--nys-color-ink-reverse, #ffffff)}.nys-divider{width:var(--_nys-divider-width);height:var(--_nys-divider-size);background-color:var(--_nys-divider-color);flex:1 0 0;margin:0;border:none}";var On=Object.defineProperty,Hn=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&On(e,t,o),o};let Vn=0;const fs=class fs extends f{constructor(){super(),this.inverted=!1}connectedCallback(){super.connectedCallback(),this.id||(this.id=this._generateUniqueId())}_generateUniqueId(){return`nys-divider-${Date.now()}-${Vn++}`}render(){return h`<hr class="nys-divider" />`}};fs.styles=_(Bn);let dt=fs;Hn([a({type:Boolean,reflect:!0})],dt.prototype,"inverted"),customElements.get("nys-divider")||customElements.define("nys-divider",dt);const zo=':host{--_nys-dropdownmenu-width: 180px;--_nys-dropdownmenu-height: 100%;--_nys-dropdownmenu-radius: var(--nys-radius-md, 4px);--_nys-dropdownmenu-border-width: var(--nys-border-width-sm, 1px);--_nys-dropdownmenu-border-color: var(--nys-color-neutral-100, #d0d0ce);--_nys-dropdownmenu-background-color: var(--nys-color-ink-reverse, #ffffff);--_nys-dropdownmenu-boxshadow-color-100: var( --nys-color-black-transparent-100, rgba(27, 27, 27, .1) );--_nys-dropdownmenu-boxshadow-color-50: var( --nys-color-black-transparent-50, rgba(27, 27, 27, .01) );--_nys-dropdownmenu-gap: var(--nys-space-2px, 2px);--_nys-dropdownmenu-padding: var(--nys-space-100, 8px);--_nys-dropdownmenu-font-size: var(--nys-font-size-ui-md, 16px);--_nys-dropdownmenu-font-weight: var(font-weight: 400);--_nys-dropdownmenu-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-dropdownmenu-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-dropdownmenuitem-color: var(--nys-color-text, #1b1b1b);--_nys-dropdownmenuitem-gap: var(--nys-space-100, 8px);--_nys-dropdownmenuitem-padding: var(--nys-space-200, 16px) var(--nys-space-100, 8px);--_nys-dropdownmenuitem-border-radius: var(--nys-radius-md, 4px);--_nys-dropdownmenuitem-background-color: var(--nys-color-white, #ffffff);--_nys-dropdownmenuitem-background-color--hover: var( --nys-color-neutral-10, #f6f6f6 );--_nys-dropdownmenuitem-background-color--active: var( --nys-color-neutral-50, #ededed );--_nys-dropdownmenuitem-color--disabled: var( --nys-color-text-disabled, #bec0c1 );--_nys-dropdownmenuitem-outline-width: var(--nys-border-width-md, 2px);--_nys-dropdownmenuitem-outline-color: var(--nys-color-focus, #004dd1)}.nys-dropdownmenu{position:fixed;top:0;left:0}.nys-dropdownmenu.active ul{display:flex}.nys-dropdownmenu ul{display:none;align-items:flex-start;flex-direction:column;gap:var(--_nys-dropdownmenu-gap);width:var(--_nys-dropdownmenu-width);height:var(--_nys-dropdownmenu-height);border-radius:var(--_nys-dropdownmenu-radius);border:var(--_nys-dropdownmenu-border-width) solid var(--_nys-dropdownmenu-border-color);background-color:var(--_nys-dropdownmenu-background-color);box-shadow:0 4px 6px -1px var(--_nys-dropdownmenu-boxshadow-color-100),0 4px 6px -1px var(--_nys-dropdownmenu-boxshadow-color-50);padding:var(--_nys-dropdownmenu-padding);font-family:var(--_nys-dropdownmenu-font-family);font-size:var(--_nys-dropdownmenu-font-size);font-weight:var(--_nys-dropdownmenu-font-weight);line-height:var(--_nys-dropdownmenu-line-height);overflow:hidden;margin:0}.nys-dropdownmenuitem{list-style:none;width:var(--_nys-dropdownmenu-width);padding:0;margin:0}.nys-dropdownmenuitem a,.nys-dropdownmenuitem button{display:flex;gap:var(--_nys-dropdownmenuitem-gap);padding:var(--_nys-dropdownmenuitem-padding);border-radius:var(--_nys-dropdownmenuitem-border-radius);background-color:var(--_nys-dropdownmenuitem-background-color);width:100%;box-sizing:border-box;text-decoration:none;text-wrap:wrap;color:var(--_nys-dropdownmenuitem-color);transition:.05s ease-in-out all;border:none;font-family:var(--_nys-dropdownmenu-font-family);font-size:var(--_nys-dropdownmenu-font-size);font-weight:var(--_nys-dropdownmenu-font-weight);line-height:var(--_nys-dropdownmenu-line-height);cursor:pointer}.nys-dropdownmenuitem a nys-icon,.nys-dropdownmenuitem button nys-icon{margin-top:2px}.nys-dropdownmenuitem a:hover:not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:hover:not(.disabled):not([aria-disabled=true]){background-color:var(--_nys-dropdownmenuitem-background-color--hover)}.nys-dropdownmenuitem a:active:not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:active:not(.disabled):not([aria-disabled=true]){background-color:var(--_nys-dropdownmenuitem-background-color--active)}.nys-dropdownmenuitem a:focus-visible:not(:focus):not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:focus-visible:not(:focus):not(.disabled):not([aria-disabled=true]){outline:var(--_nys-dropdownmenuitem-outline-width) solid var(--_nys-dropdownmenuitem-outline-color)}.nys-dropdownmenuitem a.disabled,.nys-dropdownmenuitem a[aria-disabled=true],.nys-dropdownmenuitem button.disabled,.nys-dropdownmenuitem button[aria-disabled=true]{color:var(--_nys-dropdownmenuitem-color--disabled);pointer-events:none;cursor:default}';var In=Object.defineProperty,We=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&In(e,t,o),o};let Rn=0;const Zt=class Zt extends f{constructor(){super(...arguments),this.label="",this.href="",this.disabled=!1,this.target="_self",this.prefixIcon="",this.divider=""}connectedCallback(){super.connectedCallback(),this.id||(this.id=`nys-fileinput-${Date.now()}-${Rn++}`)}_handleClick(e){if(this.disabled){e.preventDefault();return}this.dispatchEvent(new CustomEvent("nys-click",{bubbles:!0,composed:!0,detail:{label:this.label,href:this.href?this.href:void 0}}))}render(){const e=!!this.href;return h`<li class="nys-dropdownmenuitem" role="presentation">
+      ></nys-errormessage>`}},Ee.styles=_(Or),Ee.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0},Ee.formAssociated=!0,Ee);V([a({type:String,reflect:!0})],A.prototype,"id"),V([a({type:String,reflect:!0})],A.prototype,"name"),V([a({type:String,reflect:!0})],A.prototype,"width"),V([a({type:Boolean})],A.prototype,"hideTodayButton"),V([a({type:Boolean})],A.prototype,"hideClearButton"),V([a({type:Boolean,reflect:!0})],A.prototype,"disabled"),V([a({type:Boolean,reflect:!0})],A.prototype,"required"),V([a({type:Boolean,reflect:!0})],A.prototype,"optional"),V([a({type:Boolean,reflect:!0})],A.prototype,"showError"),V([a({type:String})],A.prototype,"errorMessage"),V([a({type:String,reflect:!0})],A.prototype,"form"),V([a({type:String})],A.prototype,"tooltip"),V([a({type:String})],A.prototype,"type"),V([a({type:String})],A.prototype,"label"),V([a({type:String})],A.prototype,"description"),V([a({type:String})],A.prototype,"startDate"),V([a({type:Boolean,reflect:!0})],A.prototype,"inverted"),V([a({type:Object,converter:{fromAttribute:r=>r?A.prototype._parseLocalDate(r):void 0,toAttribute:r=>r?typeof r=="string"?r:r.toISOString().split("T")[0]:""}})],A.prototype,"value"),V([m()],A.prototype,"datepickerIsOpen");let Ao=A;customElements.get("nys-datepicker")||customElements.define("nys-datepicker",Ao);const Bn=":host{--_nys-divider-size: var(--nys-size-1px, 1px);--_nys-divider-color: var(--nys-color-neutral-500, #797c7f);--_nys-divider-width: 100%}:host([inverted]){--_nys-divider-color: var(--nys-color-ink-reverse, #ffffff)}.nys-divider{width:var(--_nys-divider-width);height:var(--_nys-divider-size);background-color:var(--_nys-divider-color);flex:1 0 0;margin:0;border:none}";var On=Object.defineProperty,Hn=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&On(e,t,o),o};let Vn=0;const fs=class fs extends f{constructor(){super(),this.inverted=!1}connectedCallback(){super.connectedCallback(),this.id||(this.id=this._generateUniqueId())}_generateUniqueId(){return`nys-divider-${Date.now()}-${Vn++}`}render(){return h`<hr class="nys-divider" />`}};fs.styles=_(Bn);let dt=fs;Hn([a({type:Boolean,reflect:!0})],dt.prototype,"inverted"),customElements.get("nys-divider")||customElements.define("nys-divider",dt);const zo=':host{--_nys-dropdownmenu-width: 180px;--_nys-dropdownmenu-height: 100%;--_nys-dropdownmenu-radius: var(--nys-radius-md, 4px);--_nys-dropdownmenu-border-width: var(--nys-border-width-sm, 1px);--_nys-dropdownmenu-border-color: var(--nys-color-neutral-100, #d0d0ce);--_nys-dropdownmenu-background-color: var(--nys-color-ink-reverse, #ffffff);--_nys-dropdownmenu-boxshadow-color-100: var( --nys-color-black-transparent-100, rgba(27, 27, 27, .1) );--_nys-dropdownmenu-boxshadow-color-50: var( --nys-color-black-transparent-50, rgba(27, 27, 27, .01) );--_nys-dropdownmenu-gap: var(--nys-space-2px, 2px);--_nys-dropdownmenu-padding: var(--nys-space-100, 8px);--_nys-dropdownmenu-font-size: var(--nys-font-size-ui-md, 16px);--_nys-dropdownmenu-font-weight: var(font-weight: 400);--_nys-dropdownmenu-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-dropdownmenu-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-dropdownmenuitem-color: var(--nys-color-text, #1b1b1b);--_nys-dropdownmenuitem-gap: var(--nys-space-100, 8px);--_nys-dropdownmenuitem-padding: var(--nys-space-200, 16px) var(--nys-space-100, 8px);--_nys-dropdownmenuitem-border-radius: var(--nys-radius-md, 4px);--_nys-dropdownmenuitem-background-color: var(--nys-color-white, #ffffff);--_nys-dropdownmenuitem-background-color--hover: var( --nys-color-neutral-10, #f6f6f6 );--_nys-dropdownmenuitem-background-color--active: var( --nys-color-neutral-50, #ededed );--_nys-dropdownmenuitem-color--disabled: var( --nys-color-text-disabled, #bec0c1 );--_nys-dropdownmenuitem-outline-width: var(--nys-border-width-md, 2px);--_nys-dropdownmenuitem-outline-color: var(--nys-color-focus, #004dd1)}.nys-dropdownmenu{position:fixed;top:0;left:0;z-index:1776}.nys-dropdownmenu.active ul{display:flex}.nys-dropdownmenu ul{display:none;align-items:flex-start;flex-direction:column;gap:var(--_nys-dropdownmenu-gap);width:var(--_nys-dropdownmenu-width);height:var(--_nys-dropdownmenu-height);border-radius:var(--_nys-dropdownmenu-radius);border:var(--_nys-dropdownmenu-border-width) solid var(--_nys-dropdownmenu-border-color);background-color:var(--_nys-dropdownmenu-background-color);box-shadow:0 4px 6px -1px var(--_nys-dropdownmenu-boxshadow-color-100),0 4px 6px -1px var(--_nys-dropdownmenu-boxshadow-color-50);padding:var(--_nys-dropdownmenu-padding);font-family:var(--_nys-dropdownmenu-font-family);font-size:var(--_nys-dropdownmenu-font-size);font-weight:var(--_nys-dropdownmenu-font-weight);line-height:var(--_nys-dropdownmenu-line-height);overflow:hidden;margin:0}.nys-dropdownmenuitem{list-style:none;width:var(--_nys-dropdownmenu-width);padding:0;margin:0}.nys-dropdownmenuitem a,.nys-dropdownmenuitem button{display:flex;gap:var(--_nys-dropdownmenuitem-gap);padding:var(--_nys-dropdownmenuitem-padding);border-radius:var(--_nys-dropdownmenuitem-border-radius);background-color:var(--_nys-dropdownmenuitem-background-color);width:100%;box-sizing:border-box;text-decoration:none;text-wrap:wrap;color:var(--_nys-dropdownmenuitem-color);transition:.05s ease-in-out all;border:none;font-family:var(--_nys-dropdownmenu-font-family);font-size:var(--_nys-dropdownmenu-font-size);font-weight:var(--_nys-dropdownmenu-font-weight);line-height:var(--_nys-dropdownmenu-line-height);cursor:pointer}.nys-dropdownmenuitem a nys-icon,.nys-dropdownmenuitem button nys-icon{margin-top:2px}.nys-dropdownmenuitem a:hover:not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:hover:not(.disabled):not([aria-disabled=true]){background-color:var(--_nys-dropdownmenuitem-background-color--hover)}.nys-dropdownmenuitem a:active:not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:active:not(.disabled):not([aria-disabled=true]){background-color:var(--_nys-dropdownmenuitem-background-color--active)}.nys-dropdownmenuitem a:focus-visible:not(:focus):not(.disabled):not([aria-disabled=true]),.nys-dropdownmenuitem button:focus-visible:not(:focus):not(.disabled):not([aria-disabled=true]){outline:var(--_nys-dropdownmenuitem-outline-width) solid var(--_nys-dropdownmenuitem-outline-color)}.nys-dropdownmenuitem a.disabled,.nys-dropdownmenuitem a[aria-disabled=true],.nys-dropdownmenuitem button.disabled,.nys-dropdownmenuitem button[aria-disabled=true]{color:var(--_nys-dropdownmenuitem-color--disabled);pointer-events:none;cursor:default}';var In=Object.defineProperty,We=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&In(e,t,o),o};let Rn=0;const Zt=class Zt extends f{constructor(){super(...arguments),this.label="",this.href="",this.disabled=!1,this.target="_self",this.prefixIcon="",this.divider=""}connectedCallback(){super.connectedCallback(),this.id||(this.id=`nys-dropdownmenuitem-${Date.now()}-${Rn++}`)}_handleClick(e){if(this.disabled){e.preventDefault();return}this.dispatchEvent(new CustomEvent("nys-click",{bubbles:!0,composed:!0,detail:{id:this.id,label:this.label,...this.href&&{href:this.href}}}))}render(){const e=!!this.href;return h`<li class="nys-dropdownmenuitem" role="presentation">
       ${e?h` <a
             class=${this.disabled?"disabled":""}
             href=${this.disabled?"":this.href}
@@ -1633,7 +1633,7 @@
           errorMessage=${this._internals.validationMessage||this.errorMessage}
         ></nys-errormessage>
       </div>
-    `}};Ct.styles=_(x1),Ct.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0},Ct.formAssociated=!0;let L=Ct;R([a({type:String,reflect:!0})],L.prototype,"id"),R([a({type:String,reflect:!0})],L.prototype,"name"),R([a({type:String})],L.prototype,"label"),R([a({type:String})],L.prototype,"description"),R([a({type:String})],L.prototype,"placeholder"),R([a({type:String})],L.prototype,"value"),R([a({type:Boolean,reflect:!0})],L.prototype,"disabled"),R([a({type:Boolean,reflect:!0})],L.prototype,"readonly"),R([a({type:Boolean,reflect:!0})],L.prototype,"required"),R([a({type:Boolean,reflect:!0})],L.prototype,"optional"),R([a({type:String})],L.prototype,"tooltip"),R([a({type:Boolean,reflect:!0})],L.prototype,"inverted"),R([a({type:String,reflect:!0})],L.prototype,"form"),R([a({type:Number})],L.prototype,"maxlength"),R([a({type:String,reflect:!0})],L.prototype,"width"),R([a({type:Number})],L.prototype,"rows"),R([a({type:String,reflect:!0})],L.prototype,"resize"),R([a({type:Boolean,reflect:!0})],L.prototype,"showError"),R([a({type:String})],L.prototype,"errorMessage"),customElements.get("nys-textarea")||customElements.define("nys-textarea",L);const E1=':host{--_nys-textinput-width: 100%;--_nys-textinput-height: var(--nys-size-500, 40px);--_nys-textinput-border-radius: var(--nys-radius-md, 4px);--_nys-textinput-border-width: var(--nys-border-width-sm, 1px);--_nys-textinput-border-color: var(--nys-color-neutral-400, #909395);--_nys-textinput-color: var( --nys-color-text, var(--nys-color-neutral-900, #1b1b1b) );--_nys-textinput-color--placeholder: var( --nys-color-text-weaker, var(--nys-color-neutral-500, #797c7f) );--_nys-textinput-padding: var(--nys-space-100, 8px);--_nys-textinput-gap: var(--nys-space-50, 4px);--_nys-textinput-background-color: var( --nys-color-ink-reverse, var(--nys-color-white, #ffffff) );--_nys-textinput-outline-color--hover: var( --nys-color-neutral-900, #1b1b1b );--_nys-textinput-outline-width: var(--nys-border-width-sm, 1px);--_nys-textinput-outline-color--focus: var(--nys-color-focus, #004dd1);--_nys-textinput-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-textinput-border-color--disabled: var( --nys-color-neutral-200, #bec0c1 );--_nys-textinput-color--disabled: var( --nys-color-text-disabled, var(--nys-color-neutral-200, #bec0c1) );--_nys-textinput-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-textinput-font-size: var(--nys-font-size-ui-md, 16px);--_nys-textinput-font-weight: var(--nys-font-weight-regular, 400);--_nys-textinput-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-textinput-letter-spacing: var( --nys-font-letterspacing-ui-md, var(--nys-font-letterspacing-400, .044px) )}:host([width=sm]){--_nys-textinput-width: var(--nys-form-width-sm, 88px)}:host([width=md]){--_nys-textinput-width: var(--nys-form-width-md, 200px)}:host([width=lg]){--_nys-textinput-width: var(--nys-form-width-lg, 384px)}:host([width=full]){--_nys-textinput-width: 100%;flex:1}:host([showError]){--_nys-textinput-border-color: var(--nys-color-danger, #b52c2c)}.nys-textinput{font-weight:var(--_nys-textinput-font-weight);font-family:var(--_nys-textinput-font-family);font-size:var(--_nys-textinput-font-size);line-height:var(--_nys-textinput-line-height);letter-spacing:var(--_nys-textinput-letter-spacing);color:var(--_nys-textinput-color);gap:var(--_nys-textinput-gap);display:flex;flex-direction:column}.nys-textinput__mask-overlay{position:absolute;margin:calc(var(--_nys-textinput-padding) + var(--_nys-textinput-border-width));color:var(--nys-color-text-weaker, #797c7f);display:inline;overflow:hidden;white-space:nowrap;font:inherit;letter-spacing:normal}.nys-textinput__input{color:var(--_nys-textinput-color);border-radius:var(--_nys-textinput-border-radius);border:solid var(--_nys-textinput-border-color) var(--_nys-textinput-border-width);outline:transparent solid var(--_nys-textinput-outline-width);padding:var(--_nys-textinput-padding);width:100%;height:var(--_nys-textinput-height);box-sizing:border-box;background-color:transparent;position:relative;font:inherit}.nys-textinput__input::placeholder{color:var(--_nys-textinput-color--placeholder)}.nys-textinput__buttoncontainer{width:var(--_nys-textinput-width);max-width:100%;display:flex}.nys-textinput__buttoncontainer.has-end-button .nys-textinput__input{border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none}.nys-textinput__buttoncontainer.has-start-button .nys-textinput__input{border-start-start-radius:0;border-end-start-radius:0;border-inline-start:none}.nys-textinput__container{position:relative;display:flex;align-items:center;width:100%;background-color:var(--_nys-textinput-background-color);border-radius:var(--_nys-textinput-border-radius)}::slotted(nys-button){--_nys-button-height: var(--_nys-textinput-height);--_nys-button-border-radius--start: var(--_nys-textinput-border-radius);--_nys-button-border-radius--end: var(--_nys-textinput-border-radius);--_nys-button-background-color--disabled: var( --_nys-textinput-background-color--disabled );--_nys-button-border-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-border-width: var(--_nys-textinput-border-width);z-index:1}.nys-textinput__buttoncontainer.has-start-button ::slotted(nys-button){--_nys-button-border-radius--end: 0}.nys-textinput__buttoncontainer.has-end-button ::slotted(nys-button){--_nys-button-border-radius--start: 0}.eye-icon{position:absolute;right:var(--nys-space-50, 4px);top:50%;transform:translateY(-50%);cursor:pointer;color:var(--_nys-textinput-color--icon);--nys-button-background-color: var(--_nys-textinput-background-color);--nys-button-background-color--hover: var( --_nys-textinput-background-color );--nys-button-background-color--active: var( --_nys-textinput-background-color );--_nys-button-outline-focus: calc( var(--_nys-button-outline-width) * -1 );--_nys-button-padding--y: var(--nys-space-50, 4px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-height: var(--nys-size-300, 32px);--_nys-button-width: var(--nys-size-400, 32px)}.nys-textinput__input:hover:not(:disabled):not(:focus):not([readonly]){outline-color:var(--_nys-textinput-outline-color--hover);border-color:var(--_nys-textinput-outline-color--hover)}.nys-textinput__input:focus:not([readonly]){outline-color:var(--_nys-textinput-outline-color--focus);border-color:var(--_nys-textinput-outline-color--focus);caret-color:var(--_nys-textinput-outline-color--focus)}.nys-textinput__input:disabled,.nys-textinput__input:disabled::placeholder,.nys-textinput__input:disabled+.eye-icon{background-color:var(--_nys-textinput-background-color--disabled);border-color:var(--_nys-textinput-border-color--disabled);color:var(--_nys-textinput-color--disabled);cursor:not-allowed}';var S1=Object.defineProperty,$=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&S1(e,t,o),o};let L1=0;const wt=class wt extends f{constructor(){super(),this.id="",this.name="",this.type="text",this.label="",this.description="",this.placeholder="",this.value="",this.disabled=!1,this.readonly=!1,this.required=!1,this.optional=!1,this.tooltip="",this.form=null,this.pattern="",this.maxlength=null,this.ariaLabel="",this.width="full",this.step=null,this.min=null,this.max=null,this.inverted=!1,this.showError=!1,this.errorMessage="",this.showPassword=!1,this._originalErrorMessage="",this._hasUserInteracted=!1,this._maskPatterns={tel:"(___) ___-____"},this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.id||(this.id=`nys-textinput-${Date.now()}-${L1++}`),this._originalErrorMessage=this.errorMessage??"",this.addEventListener("invalid",this._handleInvalid)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("invalid",this._handleInvalid)}firstUpdated(){this._setValue()}async updated(e){if(e.has("disabled")&&(this._validateButtonSlot("startButton"),this._validateButtonSlot("endButton")),e.has("type")){const t=this._maskPatterns[this.type],s=this.shadowRoot?.querySelector("input");if(s)if(t)s.maxLength=t.length,this._updateOverlay(s.value,t);else{s.removeAttribute("maxLength");const o=this.shadowRoot?.querySelector(".nys-textinput__mask-overlay");o&&(o.textContent="")}}if(e.has("readonly")||e.has("required")){const t=this.shadowRoot?.querySelector("input");t&&(t.required=this.required&&!this.readonly)}}_setValue(){this._internals.setFormValue(this.value),this._manageRequire()}_manageRequire(){const e=this.shadowRoot?.querySelector("input");if(!e)return;const t=this.errorMessage||"This field is required";this.required&&(!this.value||this.value?.trim()==="")?(this._internals.ariaRequired="true",this._internals.setValidity({valueMissing:!0},t,e)):(this._internals.ariaRequired="false",this._internals.setValidity({}),this._hasUserInteracted=!1)}_setValidityMessage(e=""){const t=this.shadowRoot?.querySelector("input");if(!t)return;this.showError=!!e,this._originalErrorMessage?.trim()&&e!==""?this.errorMessage=this._originalErrorMessage:this.errorMessage=e;const s=e?{customError:!0}:{};this._internals.setValidity(s,this.errorMessage,t)}_validate(){const e=this.shadowRoot?.querySelector("input");if(!e)return;const t=e.validity;let s="";t.valueMissing?s="This field is required":t.typeMismatch?s="Invalid format for this type":t.patternMismatch?s="Invalid format":t.tooShort?s=`Value is too short. Minimum length is ${e.minLength}`:t.tooLong?s=`Value is too long. Maximum length is ${e.maxLength}`:t.rangeUnderflow?s=`Value must be at least ${e.min}`:t.rangeOverflow?s=`Value must be at most ${e.max}`:t.stepMismatch?s="Invalid step value":s=e.validationMessage,this._setValidityMessage(s)}formResetCallback(){this.value="";const e=this.shadowRoot?.querySelector("input");e&&(e.value=""),this._internals.setFormValue(""),this.showError=!1,this.errorMessage="",this._internals.setValidity({}),this.showPassword=!1,this.requestUpdate()}checkValidity(){const e=this.shadowRoot?.querySelector("input");return e?e.checkValidity():!0}_handleInvalid(e){e.preventDefault(),this._hasUserInteracted=!0,this._validate();const t=this.shadowRoot?.querySelector("input");if(t){const s=this._internals.form;s?Array.from(s.elements).find(i=>typeof i.checkValidity=="function"&&!i.checkValidity())===this&&t.focus():t.focus()}}_togglePasswordVisibility(){this.showPassword=!this.showPassword}_updateOverlay(e,t){const s=this.shadowRoot?.querySelector(".nys-textinput__mask-overlay");if(!s)return;const o=e,n=t.slice(o.length);s.textContent=o+n}_applyMask(e,t){const s=e.replace(/\D/g,"");let o="";if(this.type==="tel")return s.length>0&&(o="("+s.substring(0,3)),s.length>=4&&(o+=") "+s.substring(3,6)),s.length>6&&(o+="-"+s.substring(6,10)),o;let n=0;for(let i=0;i<t.length;i++)if(t[i]==="_"||t[i].match(/[d9]/i))if(n<s.length)o+=s[n++];else break;else o+=t[i];return o}_handleInput(e){const t=e.target;let s=t.value;const o=this._maskPatterns[this.type];o&&(s=this._applyMask(s,o),t.value=s,this._updateOverlay(s,o)),this.value=s,this._internals.setFormValue(this.value),this._hasUserInteracted&&this._validate(),this.dispatchEvent(new CustomEvent("nys-input",{detail:{id:this.id,value:this.value},bubbles:!0,composed:!0}))}_handleFocus(){this.dispatchEvent(new Event("nys-focus"))}_handleBlur(){this._hasUserInteracted||(this._hasUserInteracted=!0),this._validate(),this.dispatchEvent(new Event("nys-blur"))}_validateButtonSlot(e){const t=this.shadowRoot?.querySelector('slot[name="'+e+'"]'),s=this.shadowRoot?.querySelector(".nys-textinput__buttoncontainer");if(!t||!s)return;const o=t.assignedElements();let n=!1;o.forEach(i=>{i instanceof HTMLElement&&i.tagName.toLowerCase()==="nys-button"&&!n?(n=!0,i.setAttribute("size","sm"),i.setAttribute("variant","primary"),this.disabled?i.setAttribute("disabled","true"):i.removeAttribute("disabled")):(console.warn("The '"+e+"' slot only accepts a single <nys-button> element. Removing invalid or extra node:",i),i.remove())}),e==="startButton"?s.classList.toggle("has-start-button",n):e==="endButton"&&s.classList.toggle("has-end-button",n)}render(){return h`
+    `}};Ct.styles=_(x1),Ct.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0},Ct.formAssociated=!0;let L=Ct;R([a({type:String,reflect:!0})],L.prototype,"id"),R([a({type:String,reflect:!0})],L.prototype,"name"),R([a({type:String})],L.prototype,"label"),R([a({type:String})],L.prototype,"description"),R([a({type:String})],L.prototype,"placeholder"),R([a({type:String})],L.prototype,"value"),R([a({type:Boolean,reflect:!0})],L.prototype,"disabled"),R([a({type:Boolean,reflect:!0})],L.prototype,"readonly"),R([a({type:Boolean,reflect:!0})],L.prototype,"required"),R([a({type:Boolean,reflect:!0})],L.prototype,"optional"),R([a({type:String})],L.prototype,"tooltip"),R([a({type:Boolean,reflect:!0})],L.prototype,"inverted"),R([a({type:String,reflect:!0})],L.prototype,"form"),R([a({type:Number})],L.prototype,"maxlength"),R([a({type:String,reflect:!0})],L.prototype,"width"),R([a({type:Number})],L.prototype,"rows"),R([a({type:String,reflect:!0})],L.prototype,"resize"),R([a({type:Boolean,reflect:!0})],L.prototype,"showError"),R([a({type:String})],L.prototype,"errorMessage"),customElements.get("nys-textarea")||customElements.define("nys-textarea",L);const E1=':host{--_nys-textinput-width: 100%;--_nys-textinput-height: var(--nys-size-500, 40px);--_nys-textinput-border-radius: var(--nys-radius-md, 4px);--_nys-textinput-border-width: var(--nys-border-width-sm, 1px);--_nys-textinput-border-color: var(--nys-color-neutral-400, #909395);--_nys-textinput-color: var( --nys-color-text, var(--nys-color-neutral-900, #1b1b1b) );--_nys-textinput-color--placeholder: var( --nys-color-text-weaker, var(--nys-color-neutral-500, #797c7f) );--_nys-textinput-padding: var(--nys-space-100, 8px);--_nys-textinput-gap: var(--nys-space-50, 4px);--_nys-textinput-background-color: var( --nys-color-ink-reverse, var(--nys-color-white, #ffffff) );--_nys-textinput-outline-color--hover: var( --nys-color-neutral-900, #1b1b1b );--_nys-textinput-outline-width: var(--nys-border-width-sm, 1px);--_nys-textinput-outline-color--focus: var(--nys-color-focus, #004dd1);--_nys-textinput-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-textinput-border-color--disabled: var( --nys-color-neutral-200, #bec0c1 );--_nys-textinput-color--disabled: var( --nys-color-text-disabled, var(--nys-color-neutral-200, #bec0c1) );--_nys-textinput-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-textinput-font-size: var(--nys-font-size-ui-md, 16px);--_nys-textinput-font-weight: var(--nys-font-weight-regular, 400);--_nys-textinput-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-textinput-letter-spacing: var( --nys-font-letterspacing-ui-md, var(--nys-font-letterspacing-400, .044px) )}:host([width=sm]){--_nys-textinput-width: var(--nys-form-width-sm, 88px)}:host([width=md]){--_nys-textinput-width: var(--nys-form-width-md, 200px)}:host([width=lg]){--_nys-textinput-width: var(--nys-form-width-lg, 384px)}:host([width=full]){--_nys-textinput-width: 100%;flex:1}:host([showError]){--_nys-textinput-border-color: var(--nys-color-danger, #b52c2c)}.nys-textinput{font-weight:var(--_nys-textinput-font-weight);font-family:var(--_nys-textinput-font-family);font-size:var(--_nys-textinput-font-size);line-height:var(--_nys-textinput-line-height);letter-spacing:var(--_nys-textinput-letter-spacing);color:var(--_nys-textinput-color);gap:var(--_nys-textinput-gap);display:flex;flex-direction:column}.nys-textinput__mask-overlay{position:absolute;margin:calc(var(--_nys-textinput-padding) + var(--_nys-textinput-border-width));color:var(--nys-color-text-weaker, #797c7f);display:inline;overflow:hidden;white-space:nowrap;font:inherit;letter-spacing:normal}.nys-textinput__input{color:var(--_nys-textinput-color);border-radius:var(--_nys-textinput-border-radius);border:solid var(--_nys-textinput-border-color) var(--_nys-textinput-border-width);outline:transparent solid var(--_nys-textinput-outline-width);padding:var(--_nys-textinput-padding);width:100%;height:var(--_nys-textinput-height);box-sizing:border-box;background-color:transparent;position:relative;font:inherit}.nys-textinput__input::placeholder{color:var(--_nys-textinput-color--placeholder)}.nys-textinput__buttoncontainer{width:var(--_nys-textinput-width);max-width:100%;display:flex}.nys-textinput__buttoncontainer.has-end-button .nys-textinput__input{border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none}.nys-textinput__buttoncontainer.has-start-button .nys-textinput__input{border-start-start-radius:0;border-end-start-radius:0;border-inline-start:none}.nys-textinput__container{position:relative;display:flex;align-items:center;width:100%;background-color:var(--_nys-textinput-background-color);border-radius:var(--_nys-textinput-border-radius)}::slotted(nys-button){--_nys-button-height: var(--_nys-textinput-height);--_nys-button-border-radius--start: var(--_nys-textinput-border-radius);--_nys-button-border-radius--end: var(--_nys-textinput-border-radius);--_nys-button-background-color--disabled: var( --_nys-textinput-background-color--disabled );--_nys-button-border-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-color--disabled: var(--_nys-textinput-color--disabled);--_nys-button-border-width: var(--_nys-textinput-border-width);z-index:1}.nys-textinput__buttoncontainer.has-start-button ::slotted(nys-button){--_nys-button-border-radius--end: 0}.nys-textinput__buttoncontainer.has-end-button ::slotted(nys-button){--_nys-button-border-radius--start: 0}.eye-icon{position:absolute;right:var(--nys-space-50, 4px);top:50%;transform:translateY(-50%);cursor:pointer;color:var(--_nys-textinput-color--icon);--nys-button-background-color: var(--_nys-textinput-background-color);--nys-button-background-color--hover: var( --_nys-textinput-background-color );--nys-button-background-color--active: var( --_nys-textinput-background-color );--_nys-button-outline-focus: calc( var(--_nys-button-outline-width) * -1 );--_nys-button-padding--y: var(--nys-space-50, 4px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-height: var(--nys-size-300, 32px);--_nys-button-width: var(--nys-size-400, 32px)}.nys-textinput__input:hover:not(:disabled):not(:focus):not([readonly]){outline-color:var(--_nys-textinput-outline-color--hover);border-color:var(--_nys-textinput-outline-color--hover)}.nys-textinput__input:focus:not([readonly]){outline-color:var(--_nys-textinput-outline-color--focus);border-color:var(--_nys-textinput-outline-color--focus);caret-color:var(--_nys-textinput-outline-color--focus)}.nys-textinput__input:disabled,.nys-textinput__input:disabled::placeholder,.nys-textinput__input:disabled+.eye-icon{background-color:var(--_nys-textinput-background-color--disabled);border-color:var(--_nys-textinput-border-color--disabled);color:var(--_nys-textinput-color--disabled);cursor:not-allowed}';var S1=Object.defineProperty,$=(r,e,t,s)=>{for(var o=void 0,n=r.length-1,i;n>=0;n--)(i=r[n])&&(o=i(e,t,o)||o);return o&&S1(e,t,o),o};let L1=0;const wt=class wt extends f{constructor(){super(),this.id="",this.name="",this.type="text",this.label="",this.description="",this.placeholder="",this.value="",this.disabled=!1,this.readonly=!1,this.required=!1,this.optional=!1,this.tooltip="",this.form=null,this.pattern="",this.maxlength=null,this.ariaLabel="",this.width="full",this.step=null,this.min=null,this.max=null,this.inverted=!1,this.showError=!1,this.errorMessage="",this.showPassword=!1,this._originalErrorMessage="",this._hasUserInteracted=!1,this._maskPatterns={tel:"(___) ___-____"},this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.id||(this.id=`nys-textinput-${Date.now()}-${L1++}`),this._originalErrorMessage=this.errorMessage??"",this.addEventListener("invalid",this._handleInvalid)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("invalid",this._handleInvalid)}firstUpdated(){this._setValue()}async updated(e){if(e.has("disabled")&&(this._validateButtonSlot("startButton"),this._validateButtonSlot("endButton")),e.has("type")){const t=this._maskPatterns[this.type],s=this.shadowRoot?.querySelector("input");if(s)if(t)this.maxlength===null&&(s.maxLength=t.length),this._updateOverlay(s.value,t);else{this.maxlength===null&&s.removeAttribute("maxLength");const o=this.shadowRoot?.querySelector(".nys-textinput__mask-overlay");o&&(o.textContent="")}}if(e.has("readonly")||e.has("required")){const t=this.shadowRoot?.querySelector("input");t&&(t.required=this.required&&!this.readonly)}}_setValue(){this._internals.setFormValue(this.value),this._manageRequire()}_manageRequire(){const e=this.shadowRoot?.querySelector("input");if(!e)return;const t=this.errorMessage||"This field is required";this.required&&(!this.value||this.value?.trim()==="")?(this._internals.ariaRequired="true",this._internals.setValidity({valueMissing:!0},t,e)):(this._internals.ariaRequired="false",this._internals.setValidity({}),this._hasUserInteracted=!1)}_setValidityMessage(e=""){const t=this.shadowRoot?.querySelector("input");if(!t)return;this.showError=!!e,this._originalErrorMessage?.trim()&&e!==""?this.errorMessage=this._originalErrorMessage:this.errorMessage=e;const s=e?{customError:!0}:{};this._internals.setValidity(s,this.errorMessage,t)}_validate(){const e=this.shadowRoot?.querySelector("input");if(!e)return;const t=e.validity;let s="";t.valueMissing?s="This field is required":t.typeMismatch?s="Invalid format for this type":t.patternMismatch?s="Invalid format":t.tooShort?s=`Value is too short. Minimum length is ${e.minLength}`:t.tooLong?s=`Value is too long. Maximum length is ${e.maxLength}`:t.rangeUnderflow?s=`Value must be at least ${e.min}`:t.rangeOverflow?s=`Value must be at most ${e.max}`:t.stepMismatch?s="Invalid step value":s=e.validationMessage,this._setValidityMessage(s)}formResetCallback(){this.value="";const e=this.shadowRoot?.querySelector("input");e&&(e.value=""),this._internals.setFormValue(""),this.showError=!1,this.errorMessage="",this._internals.setValidity({}),this.showPassword=!1,this.requestUpdate()}checkValidity(){const e=this.shadowRoot?.querySelector("input");return e?e.checkValidity():!0}_handleInvalid(e){e.preventDefault(),this._hasUserInteracted=!0,this._validate();const t=this.shadowRoot?.querySelector("input");if(t){const s=this._internals.form;s?Array.from(s.elements).find(i=>typeof i.checkValidity=="function"&&!i.checkValidity())===this&&t.focus():t.focus()}}_togglePasswordVisibility(){this.showPassword=!this.showPassword}_updateOverlay(e,t){const s=this.shadowRoot?.querySelector(".nys-textinput__mask-overlay");if(!s)return;const o=e,n=t.slice(o.length);s.textContent=o+n}_applyMask(e,t){const s=e.replace(/\D/g,"");let o="";if(this.type==="tel")return s.length>0&&(o="("+s.substring(0,3)),s.length>=4&&(o+=") "+s.substring(3,6)),s.length>6&&(o+="-"+s.substring(6,10)),o;let n=0;for(let i=0;i<t.length;i++)if(t[i]==="_"||t[i].match(/[d9]/i))if(n<s.length)o+=s[n++];else break;else o+=t[i];return o}_handleInput(e){const t=e.target;let s=t.value;const o=this._maskPatterns[this.type];o&&(s=this._applyMask(s,o),t.value=s,this._updateOverlay(s,o)),this.value=s,this._internals.setFormValue(this.value),this._hasUserInteracted&&this._validate(),this.dispatchEvent(new CustomEvent("nys-input",{detail:{id:this.id,value:this.value},bubbles:!0,composed:!0}))}_handleFocus(){this.dispatchEvent(new Event("nys-focus"))}_handleBlur(){this._hasUserInteracted||(this._hasUserInteracted=!0),this._validate(),this.dispatchEvent(new Event("nys-blur"))}_validateButtonSlot(e){const t=this.shadowRoot?.querySelector('slot[name="'+e+'"]'),s=this.shadowRoot?.querySelector(".nys-textinput__buttoncontainer");if(!t||!s)return;const o=t.assignedElements();let n=!1;o.forEach(i=>{i instanceof HTMLElement&&i.tagName.toLowerCase()==="nys-button"&&!n?(n=!0,i.setAttribute("size","sm"),i.setAttribute("variant","primary"),this.disabled?i.setAttribute("disabled","true"):i.removeAttribute("disabled")):(console.warn("The '"+e+"' slot only accepts a single <nys-button> element. Removing invalid or extra node:",i),i.remove())}),e==="startButton"?s.classList.toggle("has-start-button",n):e==="endButton"&&s.classList.toggle("has-end-button",n)}render(){return h`
       <div class="nys-textinput">
         <nys-label
           for=${this.id+"--native"}