@solid-design-system/components 3.17.2 → 3.17.3

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};