@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and TailwindCSS
2 lines • 2.77 kB
JavaScript
"use client";import{a as e}from"../constants-CW2-utNH.js";import{n as t,r as n}from"../helpers-DBEwVIlX.js";import{Typography as r}from"../Typography/Typography.js";import{r as i}from"../utils-K22C_6qC.js";import{GROUP_NAME as a}from"./InputRadio.constants.js";import{InputRadioContext as o}from"./InputRadioContext.js";import{forwardRef as s,startTransition as c,useContext as l,useId as u,useImperativeHandle as d,useRef as f}from"react";import p from"lodash/fp/isEmpty.js";import m from"lodash/fp/isString.js";import h from"lodash/fp/omit.js";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{Label as v}from"@radix-ui/react-label";import{UilCheck as y}from"@tooni/iconscout-unicons-react";import*as b from"@radix-ui/react-radio-group";const x=s(({children:s,condensed:x=!1,disabled:S=!1,fullWidth:C=!1,id:w,label:T,labelElement:E,value:D,...O},k)=>{let A=!!s;!A&&!T&&console.warn("You must provide a `label` or `children` to the `InputRadio` component");let j=m(T)?T:p(T)?i(s):i(T),M={primary:`bg-white shadow-subtle border-1 border-normal`,secondary:`bg-white border-1 border-normal`,tertiary:`bg-transparent`},N=u(),P=(w??N)||N,F=f(null);d(k,()=>F.current);let{condensed:I,disabled:L,required:R=!1,variant:z}=l(o),B=S||L,V=x||I,H=E||(m(A?s:T)?`label`:`div`),U=()=>{c(()=>{F.current?.blur()})};return _(r,{className:n(`${e}-${a}`,`${e}-${a}--${z}`,`group/radio`,`flex w-full max-w-full cursor-default rounded-sm`,M[z],B?`${e}-${a}--disabled text-disabled`:`text-dark`,C?`${e}-${a}--full-width`:`sm:w-fit`,R?`${e}-${a}--required`:``,O.className),element:`div`,onClick:H===`label`?void 0:e=>{if(B){e.preventDefault();return}e.target!==F.current&&e.target.parentElement!==F.current&&F.current?.click(),U()},children:[g(b.Item,{id:P,ref:F,"aria-label":j,className:t(`${e}-${a}__radio`,`flex min-h-6 rounded-xs border-none bg-unset p-unset pt-2 focus-visible:outline-none`,B?`cursor-not-allowed`:`cursor-pointer [&>:first-child]:data-state-checked:bg-primary group-hover/radio:[&>:first-child]:data-state-unchecked:bg-highlight`),disabled:B,required:R,title:j,value:D,onFocus:U,...h([`className`],O),children:g(`div`,{className:t(`${e}-${a}__radio__mark`,`mx-2 flex h-3 max-h-3 min-h-3 w-3 min-w-3 max-w-3 items-center justify-center rounded-full border-2 pt-half`,B?`border-disabled bg-transparent`:`border-normal`),children:g(b.Indicator,{children:g(y,{})})})}),g(v,{asChild:!0,className:t(`${e}-${a}__radio__label`,`flex-1 overflow-auto break-words py-2 pr-2`,V?`py-1`:`py-2`,B?`cursor-not-allowed`:`cursor-pointer`,R?`${e}-${a}__label--required after:text-feedback-danger-50 after:content-required`:``),htmlFor:P,children:g(r,{element:H,children:A?s:T})})]})});x.displayName=`InputRadio`;export{x as InputRadio,x as default};
//# sourceMappingURL=InputRadio.js.map