@solid-design-system/components 3.17.1 → 3.17.3

package/dist/components/es/input.js

@@ -1 +1 @@
-import"./icon.js";import{S as t,L as e,x as s,t as i,c as l,i as a,e as o,n as r,a as n}from"./solid-components2.js";import{d as p}from"./default-value.js";import{F as h}from"./form.js";import{H as d}from"./slot.js";import{o as u}from"./if-defined.js";import{l as c}from"./live.js";import{r as y}from"./state.js";import{w as m}from"./watch.js";var b,v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,g=(t,e,s,i)=>{for(var l,a=i>1?void 0:i?f(e,s):e,o=t.length-1;o>=0;o--)(l=t[o])&&(a=(i?l(e,s,a):l(a))||a);return i&&a&&v(e,s,a),a};const w=!(null==(b=navigator.userAgentData)?void 0:b.brands.some((t=>t.brand.includes("Chromium"))))&&navigator.userAgent.includes("Firefox");let x=class extends t{constructor(){super(...arguments),this.formControlController=new h(this),this.hasSlotController=new d(this,"help-text","label","left","right","message","placeholder"),this.localize=new e(this),this.hasFocus=!1,this.showValidStyle=!1,this.showInvalidStyle=!1,this.type="text",this.size="lg",this.value="",this.defaultValue="",this.placeholder="",this.label="",this.helpText="",this.clearable=!1,this.disabled=!1,this.readonly=!1,this.passwordToggle=!1,this.passwordVisible=!1,this.noSpinButtons=!1,this.form="",this.name="",this.title="",this.required=!1,this.styleOnValid=!1,this.spellcheck=!0}get valueAsDate(){var t;return(null==(t=this.input)?void 0:t.valueAsDate)??null}set valueAsDate(t){const e=document.createElement("input");e.type="date",e.valueAsDate=t,this.value=e.value}get valueAsNumber(){var t;return(null==(t=this.input)?void 0:t.valueAsNumber)??parseFloat(this.value)}set valueAsNumber(t){const e=document.createElement("input");e.type="number",e.valueAsNumber=t,this.value=e.value}get validity(){return this.input.validity}firstUpdated(){this.formControlController.updateValidity()}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleChange(){this.value=this.input.value,this.emit("sd-change")}handleClearClick(t){this.value="",this.emit("sd-clear"),this.emit("sd-input"),this.emit("sd-change"),this.input.focus(),t.stopPropagation()}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleInput(){this.value=this.input.value,this.formControlController.updateValidity(),this.emit("sd-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t),this.invalidMessage.textContent=t.target.validationMessage}handleKeyDown(t){const e=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;"Enter"===t.key&&!e&&setTimeout((()=>{!t.defaultPrevented&&!t.isComposing&&this.formControlController.submit()}))}handlePasswordToggle(){this.passwordVisible=!this.passwordVisible}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleStepChange(){this.input.step=String(this.step),this.formControlController.updateValidity()}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}setSelectionRange(t,e,s="none"){this.input.setSelectionRange(t,e,s)}setRangeText(t,e,s,i){this.input.setRangeText(t,e,s,i),this.value!==this.input.value&&(this.value=this.input.value)}showPicker(){"showPicker"in HTMLInputElement.prototype&&this.input.showPicker()}stepUp(){this.input.stepUp(),this.value!==this.input.value&&(this.value=this.input.value)}stepDown(){this.input.stepDown(),this.value!==this.input.value&&(this.value=this.input.value)}checkValidity(){var t;return null==(t=this.input)?void 0:t.checkValidity()}reportValidity(){return this.formControlController.fakeUserInteraction(),this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),l=(this.hasSlotController.test("description"),this.hasSlotController.test("left")),a=this.hasSlotController.test("right"),o=!!this.label||!!t,r=!!this.helpText||!!e,n=this.clearable&&!this.readonly&&("number"==typeof this.value||this.value.length>0),p=this.disabled?"disabled":this.readonly?"readonly":this.hasFocus&&this.showInvalidStyle?"activeInvalid":this.hasFocus&&this.styleOnValid&&this.showValidStyle?"activeValid":this.hasFocus?"active":this.showInvalidStyle?"invalid":this.styleOnValid&&this.showValidStyle?"valid":"default",h="sm"===this.size?"text-sm":"text-base",d={disabled:"text-neutral-500",readonly:"text-black",activeInvalid:"text-error",activeValid:"text-black",active:"text-black",invalid:"text-error",valid:"text-black",default:"text-black"}[p],y={disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[p],m=this.disabled?"text-neutral-500":"text-primary",b={sm:"ml-1",md:"ml-2",lg:"ml-2"}[this.size],v={sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size];return s`<div part="form-control" class="${i(this.disabled&&"pointer-events-none")}"><label part="form-control-label" id="label" class="${i("mb-2",o?"inline-block":"hidden",h)}" for="input" aria-hidden="${o?"false":"true"}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="relative w-full"><div part="border" class="${i("absolute w-full h-full pointer-events-none border rounded-default",y)}"></div><div part="base" class="${i("px-4 flex flex-row items-center rounded-default transition-all bg-white","lg"===this.size?"py-2":"py-1",this.disabled||this.readonly?"":"hover:bg-neutral-200",this.readonly&&"bg-neutral-100",d)}">${l?s`<slot name="left" part="left" class="${i("inline-flex","sm"===this.size?"mr-1":"mr-2",m,v)}"></slot>`:""} <input part="input" id="input" class="${i("min-w-0 flex-grow focus:outline-none bg-transparent placeholder-neutral-700","sm"===this.size?"h-6":"h-8",h)}" type="${"password"===this.type&&this.passwordVisible?"text":this.type}" title="${this.title}" name="${u(this.name)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${u(this.placeholder)}" minlength="${u(this.minlength)}" maxlength="${u(this.maxlength)}" min="${u(this.min)}" max="${u(this.max)}" step="${u(this.step)}" .value="${c(this.value)}" autocapitalize="${u("password"===this.type?"off":this.autocapitalize)}" autocomplete="${u("password"===this.type?"off":this.autocomplete)}" autocorrect="${u("password"===this.type?"off":this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${this.spellcheck}" pattern="${u(this.pattern)}" enterkeyhint="${u(this.enterkeyhint)}" inputmode="${u(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${n?s`<button part="clear-button" class="${i("flex justify-center ",b)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-icon class="${i("icon-fill-neutral-800",v)}" library="system" name="closing-round"></sd-icon></slot></button>`:""} ${this.passwordToggle&&"password"===this.type?s`<button aria-label="${this.localize.term(this.passwordVisible?"hidePassword":"showPassword")}" part="password-toggle-button" class="flex items-center" type="button" @click="${this.handlePasswordToggle}" tabindex="-1">${this.passwordVisible?s`<slot name="show-password-icon"><sd-icon class="${i(m,b,v)}" library="system" name="eye"></sd-icon></slot>`:s`<slot name="hide-password-icon"><sd-icon class="${i(m,b,v)}" library="system" name="eye-crossed-out"></sd-icon></slot>`}</button>`:""} ${"date"!==this.type&&"datetime-local"!==this.type||w?"":s`<sd-icon class="${i(m,b,v)}" library="system" name="calendar"></sd-icon>`} ${"time"===this.type?s`<sd-icon class="${i(m,b,v)}" library="system" name="clock"></sd-icon>`:""} ${"search"===this.type?s`<button class="flex items-center" type="button" tabindex="-1"><sd-icon class="${i(m,b,v)}" library="system" name="magnifying-glass"></sd-icon></button>`:""} ${this.showInvalidStyle?s`<sd-icon part="invalid-icon" class="${i("text-error",b,v)}" library="system" name="risk"></sd-icon>`:""} ${this.showValidStyle&&this.styleOnValid?s`<sd-icon class="${i("text-success flex-shrink-0",b,v)}" library="system" name="status-check" part="valid-icon"></sd-icon>`:""} ${a?s`<slot name="right" part="right" class="${i("inline-flex",m,b,v)}"></slot>`:""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${i("text-sm text-neutral-700",r?"block":"hidden")}" aria-hidden="${!r}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`}};x.styles=[l,t.styles,a`:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) #label::after{content:' *'}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}`],g([o("#input")],x.prototype,"input",2),g([o("#invalid-message")],x.prototype,"invalidMessage",2),g([y()],x.prototype,"hasFocus",2),g([y()],x.prototype,"showValidStyle",2),g([y()],x.prototype,"showInvalidStyle",2),g([r({reflect:!0})],x.prototype,"type",2),g([r({reflect:!0})],x.prototype,"size",2),g([r()],x.prototype,"inputmode",2),g([r()],x.prototype,"value",2),g([p()],x.prototype,"defaultValue",2),g([r()],x.prototype,"placeholder",2),g([r()],x.prototype,"label",2),g([r({attribute:"help-text"})],x.prototype,"helpText",2),g([r({type:Boolean})],x.prototype,"clearable",2),g([r({type:Boolean,reflect:!0})],x.prototype,"disabled",2),g([r({type:Boolean,reflect:!0})],x.prototype,"readonly",2),g([r({attribute:"password-toggle",type:Boolean})],x.prototype,"passwordToggle",2),g([r({attribute:"password-visible",type:Boolean})],x.prototype,"passwordVisible",2),g([r({attribute:"no-spin-buttons",type:Boolean})],x.prototype,"noSpinButtons",2),g([r({type:Number})],x.prototype,"minlength",2),g([r({type:Number})],x.prototype,"maxlength",2),g([r()],x.prototype,"min",2),g([r()],x.prototype,"max",2),g([r({reflect:!0})],x.prototype,"form",2),g([r()],x.prototype,"name",2),g([r()],x.prototype,"title",2),g([r({type:Boolean,reflect:!0})],x.prototype,"required",2),g([r()],x.prototype,"pattern",2),g([r()],x.prototype,"step",2),g([r()],x.prototype,"autocapitalize",2),g([r()],x.prototype,"autocorrect",2),g([r()],x.prototype,"autocomplete",2),g([r({type:Boolean})],x.prototype,"autofocus",2),g([r()],x.prototype,"enterkeyhint",2),g([r({type:Boolean,reflect:!0,attribute:"style-on-valid"})],x.prototype,"styleOnValid",2),g([r({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],x.prototype,"spellcheck",2),g([m("disabled",{waitUntilFirstUpdate:!0})],x.prototype,"handleDisabledChange",1),g([m("step",{waitUntilFirstUpdate:!0})],x.prototype,"handleStepChange",1),g([m("value",{waitUntilFirstUpdate:!0})],x.prototype,"handleValueChange",1),x=g([n("sd-input")],x);export{x as default};
+import"./icon.js";import{S as t,L as e,x as s,t as i,c as l,i as a,e as o,n as r,a as n}from"./solid-components2.js";import{d as p}from"./default-value.js";import{F as h}from"./form.js";import{H as d}from"./slot.js";import{o as u}from"./if-defined.js";import{l as c}from"./live.js";import{r as y}from"./state.js";import{w as m}from"./watch.js";var b,v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,g=(t,e,s,i)=>{for(var l,a=i>1?void 0:i?f(e,s):e,o=t.length-1;o>=0;o--)(l=t[o])&&(a=(i?l(e,s,a):l(a))||a);return i&&a&&v(e,s,a),a};const w=!(null==(b=navigator.userAgentData)?void 0:b.brands.some((t=>t.brand.includes("Chromium"))))&&navigator.userAgent.includes("Firefox");let x=class extends t{constructor(){super(...arguments),this.formControlController=new h(this),this.hasSlotController=new d(this,"help-text","label","left","right","message","placeholder"),this.localize=new e(this),this.hasFocus=!1,this.showValidStyle=!1,this.showInvalidStyle=!1,this.type="text",this.size="lg",this.value="",this.defaultValue="",this.placeholder="",this.label="",this.helpText="",this.clearable=!1,this.disabled=!1,this.readonly=!1,this.passwordToggle=!1,this.passwordVisible=!1,this.noSpinButtons=!1,this.form="",this.name="",this.title="",this.required=!1,this.styleOnValid=!1,this.spellcheck=!0}get valueAsDate(){var t;return(null==(t=this.input)?void 0:t.valueAsDate)??null}set valueAsDate(t){const e=document.createElement("input");e.type="date",e.valueAsDate=t,this.value=e.value}get valueAsNumber(){var t;return(null==(t=this.input)?void 0:t.valueAsNumber)??parseFloat(this.value)}set valueAsNumber(t){const e=document.createElement("input");e.type="number",e.valueAsNumber=t,this.value=e.value}get validity(){return this.input.validity}firstUpdated(){this.formControlController.updateValidity()}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleChange(){this.value=this.input.value,this.emit("sd-change")}handleClearClick(t){this.value="",this.emit("sd-clear"),this.emit("sd-input"),this.emit("sd-change"),this.input.focus(),t.stopPropagation()}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleInput(){this.value=this.input.value,this.formControlController.updateValidity(),this.emit("sd-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t),this.invalidMessage.textContent=t.target.validationMessage}handleKeyDown(t){const e=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;"Enter"===t.key&&!e&&setTimeout((()=>{!t.defaultPrevented&&!t.isComposing&&this.formControlController.submit()}))}handlePasswordToggle(){this.passwordVisible=!this.passwordVisible}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleStepChange(){this.input.step=String(this.step),this.formControlController.updateValidity()}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}setSelectionRange(t,e,s="none"){this.input.setSelectionRange(t,e,s)}setRangeText(t,e,s,i){this.input.setRangeText(t,e,s,i),this.value!==this.input.value&&(this.value=this.input.value)}showPicker(){"showPicker"in HTMLInputElement.prototype&&this.input.showPicker()}stepUp(){this.input.stepUp(),this.value!==this.input.value&&(this.value=this.input.value)}stepDown(){this.input.stepDown(),this.value!==this.input.value&&(this.value=this.input.value)}checkValidity(){var t;return null==(t=this.input)?void 0:t.checkValidity()}reportValidity(){return this.formControlController.fakeUserInteraction(),this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){const t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),l=(this.hasSlotController.test("description"),this.hasSlotController.test("left")),a=this.hasSlotController.test("right"),o=!!this.label||!!t,r=!!this.helpText||!!e,n=this.clearable&&!this.readonly&&("number"==typeof this.value||this.value.length>0),p=this.disabled?"disabled":this.readonly?"readonly":this.hasFocus&&this.showInvalidStyle?"activeInvalid":this.hasFocus&&this.styleOnValid&&this.showValidStyle?"activeValid":this.hasFocus?"active":this.showInvalidStyle?"invalid":this.styleOnValid&&this.showValidStyle?"valid":"default",h="sm"===this.size?"text-sm":"text-base",d={disabled:"text-neutral-500",readonly:"text-black",activeInvalid:"text-error",activeValid:"text-black",active:"text-black",invalid:"text-error",valid:"text-black",default:"text-black"}[p],y={disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[p],m=this.disabled?"text-neutral-500":"text-primary",b={sm:"ml-1",md:"ml-2",lg:"ml-2"}[this.size],v={sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size];return s`<div part="form-control" class="${i(this.disabled&&"pointer-events-none")}"><label part="form-control-label" id="label" class="${i("mb-2",o?"inline-block":"hidden",h)}" for="input" aria-hidden="${o?"false":"true"}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="relative w-full"><div part="border" class="${i("absolute w-full h-full pointer-events-none border rounded-default",y)}"></div><div part="base" class="${i("px-4 flex flex-row items-center rounded-default transition-all","lg"===this.size?"py-2":"py-1",this.disabled||this.readonly?"":"hover:bg-neutral-200",this.readonly?"bg-neutral-100":"bg-white",d)}">${l?s`<slot name="left" part="left" class="${i("inline-flex","sm"===this.size?"mr-1":"mr-2",m,v)}"></slot>`:""} <input part="input" id="input" class="${i("min-w-0 flex-grow focus:outline-none bg-transparent placeholder-neutral-700","sm"===this.size?"h-6":"h-8",h)}" type="${"password"===this.type&&this.passwordVisible?"text":this.type}" title="${this.title}" name="${u(this.name)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${u(this.placeholder)}" minlength="${u(this.minlength)}" maxlength="${u(this.maxlength)}" min="${u(this.min)}" max="${u(this.max)}" step="${u(this.step)}" .value="${c(this.value)}" autocapitalize="${u("password"===this.type?"off":this.autocapitalize)}" autocomplete="${u("password"===this.type?"off":this.autocomplete)}" autocorrect="${u("password"===this.type?"off":this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${this.spellcheck}" pattern="${u(this.pattern)}" enterkeyhint="${u(this.enterkeyhint)}" inputmode="${u(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${n?s`<button part="clear-button" class="${i("flex justify-center ",b)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-icon class="${i("icon-fill-neutral-800",v)}" library="system" name="closing-round"></sd-icon></slot></button>`:""} ${this.passwordToggle&&"password"===this.type?s`<button aria-label="${this.localize.term(this.passwordVisible?"hidePassword":"showPassword")}" part="password-toggle-button" class="flex items-center" type="button" @click="${this.handlePasswordToggle}" tabindex="-1">${this.passwordVisible?s`<slot name="show-password-icon"><sd-icon class="${i(m,b,v)}" library="system" name="eye"></sd-icon></slot>`:s`<slot name="hide-password-icon"><sd-icon class="${i(m,b,v)}" library="system" name="eye-crossed-out"></sd-icon></slot>`}</button>`:""} ${"date"!==this.type&&"datetime-local"!==this.type||w?"":s`<sd-icon class="${i(m,b,v)}" library="system" name="calendar"></sd-icon>`} ${"time"===this.type?s`<sd-icon class="${i(m,b,v)}" library="system" name="clock"></sd-icon>`:""} ${"search"===this.type?s`<button class="flex items-center" type="button" tabindex="-1"><sd-icon class="${i(m,b,v)}" library="system" name="magnifying-glass"></sd-icon></button>`:""} ${this.showInvalidStyle?s`<sd-icon part="invalid-icon" class="${i("text-error",b,v)}" library="system" name="risk"></sd-icon>`:""} ${this.showValidStyle&&this.styleOnValid?s`<sd-icon class="${i("text-success flex-shrink-0",b,v)}" library="system" name="status-check" part="valid-icon"></sd-icon>`:""} ${a?s`<slot name="right" part="right" class="${i("inline-flex",m,b,v)}"></slot>`:""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${i("text-sm text-neutral-700",r?"block":"hidden")}" aria-hidden="${!r}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`}};x.styles=[l,t.styles,a`:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) #label::after{content:' *'}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}`],g([o("#input")],x.prototype,"input",2),g([o("#invalid-message")],x.prototype,"invalidMessage",2),g([y()],x.prototype,"hasFocus",2),g([y()],x.prototype,"showValidStyle",2),g([y()],x.prototype,"showInvalidStyle",2),g([r({reflect:!0})],x.prototype,"type",2),g([r({reflect:!0})],x.prototype,"size",2),g([r()],x.prototype,"inputmode",2),g([r()],x.prototype,"value",2),g([p()],x.prototype,"defaultValue",2),g([r()],x.prototype,"placeholder",2),g([r()],x.prototype,"label",2),g([r({attribute:"help-text"})],x.prototype,"helpText",2),g([r({type:Boolean})],x.prototype,"clearable",2),g([r({type:Boolean,reflect:!0})],x.prototype,"disabled",2),g([r({type:Boolean,reflect:!0})],x.prototype,"readonly",2),g([r({attribute:"password-toggle",type:Boolean})],x.prototype,"passwordToggle",2),g([r({attribute:"password-visible",type:Boolean})],x.prototype,"passwordVisible",2),g([r({attribute:"no-spin-buttons",type:Boolean})],x.prototype,"noSpinButtons",2),g([r({type:Number})],x.prototype,"minlength",2),g([r({type:Number})],x.prototype,"maxlength",2),g([r()],x.prototype,"min",2),g([r()],x.prototype,"max",2),g([r({reflect:!0})],x.prototype,"form",2),g([r()],x.prototype,"name",2),g([r()],x.prototype,"title",2),g([r({type:Boolean,reflect:!0})],x.prototype,"required",2),g([r()],x.prototype,"pattern",2),g([r()],x.prototype,"step",2),g([r()],x.prototype,"autocapitalize",2),g([r()],x.prototype,"autocorrect",2),g([r()],x.prototype,"autocomplete",2),g([r({type:Boolean})],x.prototype,"autofocus",2),g([r()],x.prototype,"enterkeyhint",2),g([r({type:Boolean,reflect:!0,attribute:"style-on-valid"})],x.prototype,"styleOnValid",2),g([r({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],x.prototype,"spellcheck",2),g([m("disabled",{waitUntilFirstUpdate:!0})],x.prototype,"handleDisabledChange",1),g([m("step",{waitUntilFirstUpdate:!0})],x.prototype,"handleStepChange",1),g([m("value",{waitUntilFirstUpdate:!0})],x.prototype,"handleValueChange",1),x=g([n("sd-input")],x);export{x as default};

package/dist/components/es/radio-button.js

@@ -1 +1 @@
-import{S as t,x as e,t as s,c as r,i as o,e as i,n as a,a as n}from"./solid-components2.js";import{H as d}from"./slot.js";import{o as l}from"./if-defined.js";import{r as h}from"./state.js";import{w as u}from"./watch.js";var b=Object.defineProperty,c=Object.getOwnPropertyDescriptor,p=(t,e,s,r)=>{for(var o,i=r>1?void 0:r?c(e,s):e,a=t.length-1;a>=0;a--)(o=t[a])&&(i=(r?o(e,s,i):o(i))||i);return r&&i&&b(e,s,i),i};let m=class extends t{constructor(){super(...arguments),this.hasSlotController=new d(this,"[default]","icon"),this.hasFocus=!1,this.checked=!1,this.disabled=!1,this.size="lg"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","presentation")}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleClick(t){if(this.disabled)return t.preventDefault(),void t.stopPropagation();this.checked=!0}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleDisabledChange(){this.setAttribute("aria-disabled",this.disabled?"true":"false")}focus(t){this.input.focus(t)}blur(){this.input.blur()}render(){const t=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("icon"),o=`${this.size}-${t?"label":"no-label"}`;return e`<div part="base" role="presentation" class="relative"><button part="${"button"+(this.checked?" button--checked":"")}" role="radio" aria-checked="${this.checked}" class="${s("relative text-center border rounded-default transition-all ease-in-out duration-100 items-center justify-center focus-visible:focus-outline","sm"===this.size?"text-sm":"text-base",this.checked&&!this.disabled?"bg-primary border-primary text-white hover:bg-primary-500 hover:border-primary-500":this.disabled&&!this.checked?"border-neutral-500 text-neutral-500 hover:cursor-not-allowed":this.disabled&&this.checked?"bg-neutral-500 text-white hover:cursor-not-allowed":"bg-transparent text-primary border-primary hover:bg-primary-100 hover:border-primary-500 hover:text-primary-500 cursor-pointer",t&&"px-4",this.hasFocus&&"focused-class",t&&"button--has-label",r&&"button--has-icon flex gap-2",o)}" aria-disabled="${this.disabled}" type="button" value="${l(this.value)}" tabindex="${this.checked?"0":"-1"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @click="${this.handleClick}"><slot name="icon" part="icon" class="${s(r&&"inline-flex relative items-center",{sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size])}" ?hidden="${!r}"></slot>${t?e`<slot part="label" class="button__label inline-flex relative items-center whitespace-nowrap"></slot>`:null}</button></div>`}};m.styles=[t.styles,r,o`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:var(--sd-spacing-0,0);z-index:-10;opacity:var(--sd-opacity-0,0);outline-style:dotted;outline-width:1px;outline-color:rgb(var(--sd-color-error,204 25 55) / 1)}.lg-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{height:var(--sd-spacing-12,3rem);width:var(--sd-spacing-12,3rem)}.md-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{height:var(--sd-spacing-10,2.5rem);width:var(--sd-spacing-10,2.5rem)}.sm-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{height:var(--sd-spacing-8,2rem);width:var(--sd-spacing-8,2rem)}:host(.sd-button-group__button--first:not(.sd-button-group__button--last)) button{border-top-right-radius:var(--sd-border-radius-none,0);border-bottom-right-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button--inner) button{border-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button--last:not(.sd-button-group__button--first)) button{border-top-left-radius:var(--sd-border-radius-none,0);border-bottom-left-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button:not(.sd-button-group__button--first)){margin-inline-start:-1px}:host(.sd-button-group__button--hover){z-index:10}:host(.sd-button-group__button--focus),:host(.sd-button-group__button[checked]){z-index:20}`],p([i(".button")],m.prototype,"input",2),p([i(".hidden-input")],m.prototype,"hiddenInput",2),p([h()],m.prototype,"hasFocus",2),p([a({type:Boolean,reflect:!0})],m.prototype,"checked",2),p([a()],m.prototype,"value",2),p([a({type:Boolean,reflect:!0})],m.prototype,"disabled",2),p([a({reflect:!0})],m.prototype,"size",2),p([u("disabled",{waitUntilFirstUpdate:!0})],m.prototype,"handleDisabledChange",1),m=p([n("sd-radio-button")],m);export{m as default};
+import{S as t,x as e,t as s,c as r,i as o,e as i,n as a,a as n}from"./solid-components2.js";import{H as d}from"./slot.js";import{o as l}from"./if-defined.js";import{r as u}from"./state.js";import{w as h}from"./watch.js";var b=Object.defineProperty,c=Object.getOwnPropertyDescriptor,p=(t,e,s,r)=>{for(var o,i=r>1?void 0:r?c(e,s):e,a=t.length-1;a>=0;a--)(o=t[a])&&(i=(r?o(e,s,i):o(i))||i);return r&&i&&b(e,s,i),i};let m=class extends t{constructor(){super(...arguments),this.hasSlotController=new d(this,"[default]","icon"),this.hasFocus=!1,this.checked=!1,this.disabled=!1,this.size="lg"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","presentation")}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleClick(t){if(this.disabled)return t.preventDefault(),void t.stopPropagation();this.checked=!0}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleDisabledChange(){this.setAttribute("aria-disabled",this.disabled?"true":"false")}focus(t){this.input.focus(t)}blur(){this.input.blur()}render(){const t=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("icon"),o=`${this.size}-${t?"label":"no-label"}`;return e`<div part="base" role="presentation" class="relative"><button part="${"button"+(this.checked?" button--checked":"")}" role="radio" aria-checked="${this.checked}" class="${s("relative text-center border rounded-default transition-all ease-in-out duration-100 items-center justify-center focus-visible:focus-outline","sm"===this.size?"text-sm":"text-base",this.checked&&!this.disabled?"bg-primary border-primary text-white hover:bg-primary-500 hover:border-primary-500":this.disabled&&!this.checked?"border-neutral-500 text-neutral-500 hover:cursor-not-allowed":this.disabled&&this.checked?"bg-neutral-500 border-neutral-500 text-white hover:cursor-not-allowed":"bg-transparent text-primary border-primary hover:bg-primary-100 hover:border-primary-500 hover:text-primary-500 cursor-pointer",t&&"px-4",this.hasFocus&&"focused-class",t&&"button--has-label",r&&"button--has-icon flex gap-2",o)}" aria-disabled="${this.disabled}" type="button" value="${l(this.value)}" tabindex="${this.checked?"0":"-1"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @click="${this.handleClick}"><slot name="icon" part="icon" class="${s(r&&"inline-flex relative items-center",{sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size])}" ?hidden="${!r}"></slot>${t?e`<slot part="label" class="button__label inline-flex relative items-center whitespace-nowrap"></slot>`:null}</button></div>`}};m.styles=[t.styles,r,o`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:var(--sd-spacing-0,0);z-index:-10;opacity:var(--sd-opacity-0,0);outline-style:dotted;outline-width:1px;outline-color:rgb(var(--sd-color-error,204 25 55) / 1)}.lg-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{height:var(--sd-spacing-12,3rem);width:var(--sd-spacing-12,3rem)}.md-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{height:var(--sd-spacing-10,2.5rem);width:var(--sd-spacing-10,2.5rem)}.sm-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{height:var(--sd-spacing-8,2rem);width:var(--sd-spacing-8,2rem)}:host(.sd-button-group__button--first:not(.sd-button-group__button--last)) button{border-top-right-radius:var(--sd-border-radius-none,0);border-bottom-right-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button--inner) button{border-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button--last:not(.sd-button-group__button--first)) button{border-top-left-radius:var(--sd-border-radius-none,0);border-bottom-left-radius:var(--sd-border-radius-none,0)}:host(.sd-button-group__button:not(.sd-button-group__button--first)){margin-inline-start:-1px}:host(.sd-button-group__button--hover){z-index:10}:host(.sd-button-group__button--focus),:host(.sd-button-group__button[checked]){z-index:20}`],p([i(".button")],m.prototype,"input",2),p([i(".hidden-input")],m.prototype,"hiddenInput",2),p([u()],m.prototype,"hasFocus",2),p([a({type:Boolean,reflect:!0})],m.prototype,"checked",2),p([a()],m.prototype,"value",2),p([a({type:Boolean,reflect:!0})],m.prototype,"disabled",2),p([a({reflect:!0})],m.prototype,"size",2),p([h("disabled",{waitUntilFirstUpdate:!0})],m.prototype,"handleDisabledChange",1),m=p([n("sd-radio-button")],m);export{m as default};