finpro/dist/chunk-JARACDDB.js

Design System

import{a as p}from"./chunk-ZO5WDGDN.js";import{a as d}from"./chunk-23UFIOHV.js";import{a as l,b as c,f as n,g as h,h as a}from"./chunk-GBPY57YZ.js";import{a as r}from"./chunk-NZ3RGSR6.js";var u=l`:host{display:inline-block;cursor:pointer}span{display:inline-block}.switch{--track-height:var(--fp-size-3xl);--track-width:var(--fp-size-xxl);--thumb-offset:var(--fp-size-5xs);--thumb-height:calc(var(--track-height) - calc(2 * var(--thumb-offset)));--thumb-width:var(--thumb-height);--animation-duration:var(--fp-switch-animation-duration,300ms);--switch-color:var(--fp-switch-color,var(--fp-color-primary));background-color:var(--fp-color-content-passive);border-radius:var(--fp-border-radius-pill);height:var(--track-height);transition-property:background-color;transition-duration:var(--animation-duration);width:var(--track-width)}.switch::before{content:"";display:inline-block;background-color:white;border-radius:var(--fp-border-radius-circle);height:var(--thumb-height);left:var(--thumb-offset);position:relative;top:var(--thumb-offset);transition:transform;transition-duration:var(--animation-duration);width:var(--thumb-width)}:host([checked]) .switch{background-color:var(--switch-color)}:host([checked]) .switch::before{transform:translateX(calc(var(--track-width) - var(--thumb-width) - calc(2 * var(--thumb-offset))))}:host([disabled]) .switch{opacity:.5}:host([disabled]){cursor:not-allowed}.switch:focus-visible{position:relative;outline:0}.switch:focus-visible::after{border:2px solid var(--switch-color);border-radius:var(--fp-border-radius-pill);content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px}`,f=u;var b="fp-switch",t=class extends n{constructor(){super(...arguments);this.checked=!1;this.disabled=!1}static get styles(){return[f]}toggle(){this.disabled||(this.checked=!this.checked,this.onToggle(this.checked))}handleKeyDown(e){(e.code==="Enter"||e.code==="Space")&&(this.toggle(),e.preventDefault())}render(){var i,o,s;let e=(s=(o=this.ariaLabel)!=null?o:(i=this.attributes.getNamedItem("aria-label"))==null?void 0:i.value)!=null?s:void 0;return c`
      <span
        class="switch"
        role="switch"
        aria-checked=${this.checked}
        aria-readonly=${!!this.disabled}
        @click=${this.toggle}
        @keydown=${this.handleKeyDown}
        aria-label=${p(e)}
        tabindex="0"
      >
      </span>
    `}};r([a({type:Boolean,reflect:!0})],t.prototype,"checked",2),r([a({type:Boolean,reflect:!0})],t.prototype,"disabled",2),r([d("fp-switch-toggle")],t.prototype,"onToggle",2),t=r([h(b)],t);export{b as a,t as b};
//# sourceMappingURL=chunk-JARACDDB.js.map