@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS
3 lines • 2.99 kB
JavaScript
'use client';
import{a as t}from"./chunk-KDHHAASG.js";import{c as u}from"./chunk-LYTTDLE2.js";import{a as f}from"./chunk-AOLTZ2WJ.js";import{b as e}from"./chunk-CMFNILWJ.js";import{a as l,b as S}from"./chunk-XYM7TA65.js";import{Label as N}from"@radix-ui/react-label";import*as m from"@radix-ui/react-switch";import{forwardRef as E,useId as I}from"react";import s from"lodash/fp/isEmpty";import B from"lodash/fp/isFunction";import p from"lodash/fp/isString";import M from"lodash/fp/omit";import{jsx as i,jsxs as H}from"react/jsx-runtime";var k=E(({checked:w,children:n,defaultChecked:x,disabled:o=!1,id:L,label:a,labelElement:g,labels:r=[],name:q,onToggle:$,required:c=!1,switchPosition:F="left",value:P="on",...b},T)=>{let _=!!n;!s(r)&&r.length!==2&&console.warn("You must provide exactly two value when using `labels` in the `Switch` component");let y=I(),d=(L??y)||y,h=!s(r)&&r.length===2,R=!s(r)&&r.length===2?"center":F,v=p(a)?a:s(a)?u(n):u(a);return H("div",{className:S(`${e}-${t}`,`${e}-${t}--${R}`,"flex items-center gap-1",R==="right"?"flex-row-reverse":"",o?`${e}-${t}--disabled`:"",b.className),children:[h&&i(N,{asChild:!0,className:l(`${e}-${t}__label`,`${e}-${t}__label--left`,"h-full max-h-full w-fit max-w-full overflow-hidden text-ellipsis whitespace-nowrap align-middle",o?"cursor-not-allowed text-disabled":"cursor-pointer text-dark",c?`${e}-${t}__label--required ${e}-${t}__label--left--required after:text-feedback-danger-50 after:content-required`:""),htmlFor:d,children:i(f,{element:g||(p(r[0])?"label":"div"),variant:"body-2",children:r[0]})}),i(m.Root,{id:d,ref:T,"aria-label":v,...w===void 0?{}:{checked:w},className:l(`${e}-${t}__toggle`,"relative h-1 max-h-1 w-5 max-w-4 rounded-full border-1 border-normal bg-body-light px-unset py-unset text-left text-color-unset [display:unset]","",o?`${e}-${t}__toggle--disabled cursor-not-allowed !border-disabled`:"cursor-pointer data-state-checked:bg-highlight"),...x===void 0?{}:{defaultChecked:x},disabled:o,name:q||d,required:c,title:v,value:P,...B($)?{onCheckedChange:C=>$(C)}:{},...M(["className"],b),children:i(m.Thumb,{className:l(`${e}-${t}__toggle__thumb`,"block h-2 w-2 -translate-x-quarter translate-y-[-5.5px] rounded-full border-1 border-normal bg-white transition-transform duration-100","data-state-checked:translate-x-[15px]",o?"!border-disabled data-state-checked:bg-highlight":"border-normal data-state-checked:bg-primary")})}),i(N,{asChild:!0,className:l(`${e}-${t}__label`,`${e}-${t}__label--right`,"h-full max-h-full w-fit max-w-full overflow-hidden text-ellipsis whitespace-nowrap align-middle",o?"cursor-not-allowed text-disabled":"cursor-pointer text-dark",c?`${e}-${t}__label--required ${e}-${t}__label--right--required after:text-feedback-danger-50 after:content-required`:""),htmlFor:d,children:i(f,{element:g||(p(_&&!h?n:r?.[1]||a)?"label":"div"),variant:"body-2",children:_&&!h?n:r?.[1]||a})})]})});k.displayName="Switch";var Q=k;export{k as a,Q as b};
//# sourceMappingURL=chunk-JWMAAKSI.js.map