@nild/components 0.0.32 → 0.0.33

package/dist/button/Button.js

@@ -1 +1 @@
-import{jsx as b}from"react/jsx-runtime";import{cnMerge as c}from"@nild/shared";import{forwardRef as q,isValidElement as N}from"react";import h from"../_shared/utils/isPlainChildren.js";import{useGroupContext as x}from"./contexts/index.js";import{buttonClassNames as y}from"./style/index.js";const v=a=>N(a)&&a.type===s,s=q((a,o)=>{const e=x(),{className:i,children:t,variant:l=e.variant,size:m=e.size,shape:n="square",equal:d=e.equal,disabled:r=e.disabled,block:p,...u}=a,f=h(t);return b("button",{type:"button",...u,disabled:r,className:c(y({variant:l,size:m,shape:n,equal:d,plain:f,block:p,disabled:r}),i),ref:o,children:t})});s.displayName="Button";export{s as default,v as isButtonElement};
+import{jsx as b}from"react/jsx-runtime";import{cnMerge as c}from"@nild/shared";import{forwardRef as f,isValidElement as q}from"react";import{useGroupContext as N}from"./contexts/index.js";import{buttonClassNames as h}from"./style/index.js";const x=a=>q(a)&&a.type===s,s=f((a,r)=>{const e=N(),{className:o,children:i,variant:l=e.variant,size:n=e.size,shape:m="square",equal:d=e.equal,disabled:t=e.disabled,block:u,...p}=a;return b("button",{type:"button",...p,disabled:t,className:c(h({variant:l,size:n,shape:m,equal:d,block:u,disabled:t}),o),ref:r,children:i})});s.displayName="Button";export{s as default,x as isButtonElement};

package/dist/button/Group.js

@@ -1 +1 @@
-import{jsxs as f,jsx as h}from"react/jsx-runtime";import{isEmpty as g,cnMerge as v}from"@nild/shared";import{forwardRef as N,Children as y,cloneElement as B}from"react";import{isButtonElement as C}from"./Button.js";import{GroupProvider as E}from"./contexts/index.js";import{groupButtonClassNames as j,groupClassNames as x}from"./style/index.js";const o=N(({className:l,children:n,variant:a="solid",size:m="medium",equal:d=!1,disabled:p,direction:e="horizontal",...c},u)=>{const s=y.toArray(n);if(g(s))return null;const r=s.filter(C);return f(E,{value:{variant:a,size:m,equal:d,disabled:p},children:[r.length===1&&r[0],r.length>1&&h("div",{...c,className:v(x({direction:e}),l),ref:u,children:r.map((t,i)=>B(t,{...t.props,className:j({first:i===0,last:i===r.length-1,direction:e,variant:a})}))})]})});o.displayName="Button.Group";export{o as default};
+import{jsxs as f,jsx as h}from"react/jsx-runtime";import{isEmpty as g,cnMerge as v}from"@nild/shared";import{forwardRef as N,Children as y,cloneElement as B}from"react";import{isButtonElement as C}from"./Button.js";import{GroupProvider as E}from"./contexts/index.js";import{groupedButtonClassNames as j,groupClassNames as x}from"./style/index.js";const o=N(({className:l,children:n,variant:a="solid",size:m="medium",equal:d=!1,disabled:p,direction:s="horizontal",...c},u)=>{const e=y.toArray(n);if(g(e))return null;const r=e.filter(C);return f(E,{value:{variant:a,size:m,equal:d,disabled:p},children:[r.length===1&&r[0],r.length>1&&h("div",{...c,className:v(x({direction:s}),l),ref:u,children:r.map((t,i)=>B(t,{...t.props,className:j({first:i===0,last:i===r.length-1,direction:s,variant:a})}))})]})});o.displayName="Button.Group";export{o as default};

package/dist/button/style/index.d.ts

@@ -1,9 +1,7 @@
 import { ButtonProps, GroupProps } from '../interfaces';
-export declare const buttonClassNames: (props?: (ButtonProps & {
-    plain?: boolean;
-}) | undefined) => string;
+export declare const buttonClassNames: (props?: ButtonProps | undefined) => string;
 export declare const groupClassNames: (props?: GroupProps | undefined) => string;
-export declare const groupButtonClassNames: (props?: (GroupProps & {
+export declare const groupedButtonClassNames: (props?: (GroupProps & {
     first?: boolean;
     last?: boolean;
 }) | undefined) => string;

package/dist/button/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const r=e(["nd-button",["font-nd","cursor-pointer","transition-colors"],a],{variants:{variant:{solid:["bg-brand","text-on-brand","enabled:hover:bg-brand-hover","enabled:active:bg-brand-active"],outlined:["bg-transparent","border-solid","border","border-brand","text-brand","enabled:hover:text-brand-hover","enabled:active:text-brand-active","enabled:hover:bg-surface-hover","enabled:active:bg-surface-active"],filled:["bg-surface","text-brand","enabled:hover:text-brand-hover","enabled:active:text-brand-active","enabled:hover:bg-surface-hover","enabled:active:bg-surface-active"],text:["bg-transparent","text-brand","enabled:hover:text-brand-hover","enabled:active:text-brand-active","enabled:hover:bg-surface-hover","enabled:active:bg-surface-active"]},shape:{round:["rounded-full"],square:["rounded-md"]},size:{small:["px-2","text-sm"],medium:["px-4","text-md"],large:["px-6","text-lg"]},plain:{true:["whitespace-nowrap","truncate"],false:""},block:{true:"w-full",false:""},disabled:{true:"disabled",false:""},equal:{true:["flex","justify-center","items-center"],false:""}},compoundVariants:[{size:"small",plain:!1,className:["py-1"]},{size:"small",plain:!0,className:["h-6"]},{size:"small",equal:!0,className:["w-6 h-6","p-1"]},{size:"medium",plain:!1,className:["py-1.5"]},{size:"medium",plain:!0,className:["h-8"]},{size:"medium",equal:!0,className:["w-8 h-8","p-1.5"]},{size:"large",plain:!1,className:["py-2"]},{size:"large",plain:!0,className:["h-10"]},{size:"large",equal:!0,className:["w-10 h-10","p-2"]}]}),t=e(["nd-button-group",["flex"]],{variants:{direction:{horizontal:"",vertical:"flex-col"}}}),s=e("",{compoundVariants:[{first:!0,direction:"horizontal",className:"rounded-r-none"},{first:!0,direction:"vertical",className:"rounded-b-none"},{last:!0,direction:"horizontal",className:"rounded-l-none"},{last:!0,direction:"vertical",className:"rounded-t-none"},{first:!1,last:!1,className:"rounded-none"},{first:!1,direction:"horizontal",className:"border-l-0"},{first:!1,direction:"vertical",className:"border-t-0"},{last:!1,direction:"horizontal",variant:"solid",className:["border-solid","border-r","border-r-brand-hover"]},{last:!1,direction:"horizontal",variant:["filled","text"],className:["border-solid","border-r","border-r-surface-hover"]},{last:!1,direction:"vertical",variant:"solid",className:["border-solid","border-b","border-b-brand-hover"]},{last:!1,direction:"vertical",variant:["filled","text"],className:["border-solid","border-b","border-b-surface-hover"]}]});export{r as buttonClassNames,s as groupButtonClassNames,t as groupClassNames};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const r=e(["nd-button",["font-nd","cursor-pointer","transition-colors"],["whitespace-nowrap","truncate"],a],{variants:{variant:{solid:["bg-brand","text-on-brand","enabled:hover:bg-brand-hover","enabled:active:bg-brand-active"],outlined:["bg-transparent","border-solid","border","border-edge","text-body","enabled:hover:border-brand-hover","enabled:hover:text-brand-hover","enabled:active:border-brand-active","enabled:active:text-brand-active"],filled:["bg-surface","text-brand","enabled:hover:text-brand-hover","enabled:active:text-brand-active","enabled:hover:bg-surface-hover","enabled:active:bg-surface-active"],text:["bg-transparent","text-brand","enabled:hover:text-brand-hover","enabled:active:text-brand-active","enabled:hover:bg-surface-hover","enabled:active:bg-surface-active"]},shape:{round:["rounded-full"],square:["rounded-md"]},size:{small:["px-2","h-6","text-sm"],medium:["px-4","h-8","text-md"],large:["px-6","h-10","text-lg"]},block:{true:"w-full",false:""},disabled:{true:"disabled",false:""},equal:{true:["flex","justify-center","items-center"],false:""}},compoundVariants:[{size:"small",equal:!0,className:["w-6 h-6","p-1"]},{size:"medium",equal:!0,className:["w-8 h-8","p-1.5"]},{size:"large",equal:!0,className:["w-10 h-10","p-2"]}]}),t=e(["nd-button-group",["flex"]],{variants:{direction:{horizontal:"",vertical:"flex-col"}}}),o=e("",{compoundVariants:[{first:!0,direction:"horizontal",className:"rounded-r-none"},{first:!0,direction:"vertical",className:"rounded-b-none"},{last:!0,direction:"horizontal",className:"rounded-l-none"},{last:!0,direction:"vertical",className:"rounded-t-none"},{first:!1,last:!1,className:"rounded-none"},{last:!1,direction:"horizontal",variant:"outlined",className:["mr-[-1px]","hover:z-1"]},{last:!1,direction:"vertical",variant:"outlined",className:["mb-[-1px]","hover:z-1"]},{last:!1,direction:"horizontal",variant:"solid",className:["border-solid","border-r","border-r-brand-hover"]},{last:!1,direction:"horizontal",variant:["filled","text"],className:["border-solid","border-r","border-r-surface-hover"]},{last:!1,direction:"vertical",variant:"solid",className:["border-solid","border-b","border-b-brand-hover"]},{last:!1,direction:"vertical",variant:["filled","text"],className:["border-solid","border-b","border-b-surface-hover"]}]});export{r as buttonClassNames,t as groupClassNames,o as groupedButtonClassNames};

package/dist/checkbox/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const r=e(["nd-checkbox","group",["flex","items-center"],"cursor-pointer",a],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),s=e(["relative",["flex","items-center","justify-center"]],{variants:{size:{small:"size-3.5 text-sm",medium:"size-4 text-md",large:"size-4.5 text-lg"}}}),t=e([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),o=e([["flex","items-center","justify-center"],["size-full","rounded-sm","border-solid","border-1","border-brand"],"transition-[background-color,color]"],{compoundVariants:[{checked:!0,variant:"solid",className:["bg-brand text-on-brand","group-enabled:group-hover:bg-brand-hover"]},{checked:!0,variant:"outlined",className:["bg-transparent text-brand","group-enabled:group-hover:bg-surface-hover"]},{checked:!1,className:["bg-transparent text-transparent","group-enabled:group-hover:bg-surface-hover"]}]}),l=e(["w-full"]),n=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),i=e(["nd-checkbox-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}});export{r as checkboxClassNames,o as defaultIndicatorBlockClassNames,l as defaultIndicatorIconClassNames,i as groupClassNames,s as indicatorClassNames,t as indicatorInputClassNames,n as labelClassNames};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const r=e(["nd-checkbox","group",["flex","items-center"],"cursor-pointer",a],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),s=e(["relative",["flex","items-center","justify-center"]],{variants:{size:{small:"size-3.5 text-sm",medium:"size-4 text-md",large:"size-4.5 text-lg"}}}),o=e([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),t=e([["flex","items-center","justify-center"],["size-full","rounded-sm","border-solid","border-1"],"transition-[background-color,color,border-color]"],{compoundVariants:[{checked:!0,variant:"solid",className:["bg-brand border-brand text-on-brand","group-enabled:group-hover:bg-brand-hover"]},{checked:!0,variant:"outlined",className:["bg-transparent border-brand text-brand","group-enabled:group-hover:border-brand-hover"]},{checked:!1,className:["bg-transparent border-edge text-transparent","group-enabled:group-hover:border-brand-hover"]}]}),l=e(["w-full"]),d=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),n=e(["nd-checkbox-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}});export{r as checkboxClassNames,t as defaultIndicatorBlockClassNames,l as defaultIndicatorIconClassNames,n as groupClassNames,s as indicatorClassNames,o as indicatorInputClassNames,d as labelClassNames};

package/dist/index.d.ts

@@ -1,10 +1,11 @@
 import { default as Button } from './button';
 import { default as Checkbox } from './checkbox';
 import { default as Divider } from './divider';
+import { default as Input } from './input';
 import { default as Popover } from './popover';
 import { default as Radio } from './radio';
 import { default as Switch } from './switch';
 import { default as Tooltip } from './tooltip';
 import { default as Transition } from './transition';
 import { default as Typography } from './typography';
-export { Button, Checkbox, Divider, Popover, Radio, Switch, Tooltip, Transition, Typography };
+export { Button, Checkbox, Divider, Popover, Radio, Switch, Tooltip, Transition, Typography, Input };

package/dist/index.js

@@ -1 +1 @@
-import{default as a}from"./button/index.js";import{default as o}from"./checkbox/index.js";import{default as t}from"./divider/Divider.js";import{default as r}from"./popover/index.js";import{default as m}from"./radio/index.js";import{default as f}from"./switch/index.js";import{default as s}from"./tooltip/index.js";import{default as i}from"./transition/Transition.js";import{default as p}from"./typography/index.js";/* empty css            */export{a as Button,o as Checkbox,t as Divider,r as Popover,m as Radio,f as Switch,s as Tooltip,i as Transition,p as Typography};
+import{default as a}from"./button/index.js";import{default as o}from"./checkbox/index.js";import{default as t}from"./divider/Divider.js";import{default as r}from"./input/index.js";import{default as s}from"./popover/index.js";import{default as f}from"./radio/index.js";import{default as m}from"./switch/index.js";import{default as i}from"./tooltip/index.js";import{default as p}from"./transition/Transition.js";import{default as e}from"./typography/index.js";/* empty css            */export{a as Button,o as Checkbox,t as Divider,r as Input,s as Popover,f as Radio,m as Switch,i as Tooltip,p as Transition,e as Typography};

package/dist/input/Append.d.ts

@@ -0,0 +1,5 @@
+import { FC, ReactElement, ReactNode } from 'react';
+import { AppendProps } from './interfaces';
+export declare const isAppendElement: (child: ReactNode) => child is ReactElement<AppendProps>;
+declare const Append: FC<AppendProps>;
+export default Append;

package/dist/input/Append.js

@@ -0,0 +1 @@
+import{jsx as d}from"react/jsx-runtime";import{isString as c,cnMerge as t}from"@nild/shared";import{isValidElement as o,Children as u,cloneElement as f}from"react";import{useCompositeContext as v}from"./contexts/index.js";import{appendClassNames as l}from"./style/index.js";const y=e=>o(e)&&e.type===i,i=({children:e})=>{var n;const{size:a,variant:r,disabled:p}=v();if(c(e))return d("span",{className:t(l({type:"string",size:a,variant:r})),children:e});const s=u.toArray(e).find(m=>o(m));return f(s,{...s?.props,className:t(l({type:"element",size:a,variant:r}),(n=s?.props)==null?void 0:n.className),size:a,disabled:p})};i.displayName="Input.Append";export{i as default,y as isAppendElement};

package/dist/input/Composite.d.ts

@@ -0,0 +1,3 @@
+import { CompositeProps } from './interfaces';
+declare const Composite: import('react').ForwardRefExoticComponent<CompositeProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Composite;

package/dist/input/Composite.js

@@ -0,0 +1 @@
+import{jsx as f,jsxs as u}from"react/jsx-runtime";import{cnMerge as v}from"@nild/shared";import{forwardRef as N,Children as C,cloneElement as E}from"react";import{isAppendElement as b}from"./Append.js";import{CompositeProvider as h}from"./contexts/index.js";import{isInputElement as x}from"./Input.js";import{isPrependElement as I}from"./Prepend.js";import{compositedInputWrapperClassNames as j,compositeClassNames as k}from"./style/index.js";const m=N(({className:p,children:l,variant:r="outlined",size:t="medium",block:i=!1,disabled:n=!1,...d},c)=>{let a,o,s;return C.forEach(l,e=>{I(e)?a=e:b(e)?o=e:x(e)&&(s=e)}),s?f(h,{value:{variant:r,size:t,block:i,disabled:n},children:u("span",{ref:c,className:v(k({block:i}),p),...d,children:[a,E(s,{...s?.props,className:j({variant:r,prepended:!!a,appended:!!o})}),o]})}):null});m.displayName="Input.Composite";export{m as default};

package/dist/input/Input.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement, ReactNode } from 'react';
+import { InputProps } from './interfaces';
+export declare const isInputElement: (child: ReactNode) => child is ReactElement<InputProps>;
+declare const Input: import('react').ForwardRefExoticComponent<InputProps & import('react').RefAttributes<HTMLInputElement>>;
+export default Input;

package/dist/input/Input.js

@@ -0,0 +1 @@
+import{jsx as p,jsxs as z}from"react/jsx-runtime";import{useControllableState as E}from"@nild/hooks";import{cnMerge as y}from"@nild/shared";import{forwardRef as k,Children as I,isValidElement as j}from"react";import{useCompositeContext as P,InputProvider as S}from"./contexts/index.js";import{isPrefixElement as V}from"./Prefix.js";import{inputClassNames as w,inputWrapperClassNames as M}from"./style/index.js";import{isSuffixElement as R}from"./Suffix.js";const J=e=>j(e)&&e.type===r,r=k((e,d)=>{const s=P(),{className:u,children:f,variant:i=s.variant,size:t=s.size,block:c=s.block,disabled:l=s.disabled,type:v="text",value:b,defaultValue:C="",onChange:n,...h}=e;let o=null,m=null;I.forEach(f,a=>{V(a)?o=a:R(a)&&(m=a)});const[x,N]=E(b,C),g=a=>{N(a.target.value),n?.(a.target.value,a)};return p(S,{value:{size:t,disabled:l,variant:i},children:z("span",{className:y(M({variant:i,size:t,block:c,disabled:l}),u),children:[o,p("input",{ref:d,type:v,value:x,onChange:g,disabled:l,className:w({size:t}),...h}),m]})})});r.displayName="Input";export{r as default,J as isInputElement};

package/dist/input/Number.d.ts

@@ -0,0 +1,3 @@
+import { NumberProps } from './interfaces';
+declare const Number: import('react').ForwardRefExoticComponent<NumberProps & import('react').RefAttributes<HTMLInputElement>>;
+export default Number;

package/dist/input/Number.js

@@ -0,0 +1 @@
+import{jsxs as j,jsx as r}from"react/jsx-runtime";import{useControllableState as k}from"@nild/hooks";import{Icon as d}from"@nild/icons";import y from"@nild/icons/Minus";import w from"@nild/icons/Plus";import{isUndefined as f,isNumeric as I}from"@nild/shared";import{forwardRef as S}from"react";import u from"../button/index.js";import V from"./Append.js";import A from"./Composite.js";import B from"./Input.js";import D from"./Prepend.js";const c=S(({min:n=-1/0,max:i=1/0,step:a=1,value:h,defaultValue:b,onChange:t,...v},x)=>{const[e,l]=k(h,b),C=!f(e)&&e<=n,N=!f(e)&&e>=i,g=(m,o)=>{const p=I(m)?globalThis.Number(m):void 0;l(p),t?.(p,o)},s=m=>{let o=(e??0)+m;o<n&&(o=n),o>i&&(o=i),l(o),t?.(o)};return j(A,{children:[r(D,{children:r(u,{variant:"outlined",disabled:C,onClick:()=>s(-a),children:r(d,{component:y})})}),r(B,{ref:x,type:"number",value:e,onChange:g,...v}),r(V,{children:r(u,{variant:"outlined",disabled:N,onClick:()=>s(a),children:r(d,{component:w})})})]})});c.displayName="Input.Number";export{c as default};

package/dist/input/OTP.d.ts

@@ -0,0 +1,3 @@
+import { OTPProps, OTPRef } from './interfaces';
+declare const OTP: import('react').ForwardRefExoticComponent<OTPProps & import('react').RefAttributes<OTPRef>>;
+export default OTP;

package/dist/input/OTP.js

@@ -0,0 +1 @@
+import{jsx as A,jsxs as P}from"react/jsx-runtime";import{useControllableState as q}from"@nild/hooks";import{isNumber as G,cnMerge as J,isFunction as K,isEmpty as v}from"@nild/shared";import{forwardRef as Q,useRef as F,useImperativeHandle as U,Fragment as V}from"react";import X from"./Input.js";import{otpInputWrapperClassNames as Y,otpWrapperClassNames as Z}from"./style/index.js";const z=Q(({className:B,placeholder:y,length:u=6,separator:d,block:k=!1,size:x="medium",type:b,value:I,defaultValue:R,onFocus:C,onBlur:D,onChange:N,onComplete:M,...w},S)=>{const[g,T]=q(I,R??[]),o=F([]),h=F(g);h.current=g;const p=()=>Array.from({length:u},(e,n)=>h.current[n]??""),m=(e,n)=>{h.current=e,T(e),N?.(e,n),e.every(a=>!v(a))&&M?.(e,n)},W=(e,n,a)=>{var l;const t=String(n??"");if(!t)return;const r=p(),c=t.split("");for(let s=0;s<c.length;s++)e+s<u&&(r[e+s]=c[s]);m(r,a);const f=Math.min(e+c.length,u-1);(l=o.current[f])==null||l.focus()},j=(e,n)=>{var a;const l=p(),t=l.findIndex(r=>r==="");v(l[e])&&t!==-1&&e>t?(n.preventDefault(),(a=o.current[t])==null||a.focus()):(n.target.select(),C?.(e,n))},E=e=>{e.currentTarget.contains(e.relatedTarget)||D==null||D(e)},H=(e,n)=>{var a,l,t;if(n.key==="Backspace"||n.keyCode===8){n.preventDefault();const r=p();v(r[e])?e>0&&(r[e-1]="",m(r,n),(a=o.current[e-1])==null||a.focus()):(r[e]="",m(r,n))}else n.key==="ArrowLeft"?(n.preventDefault(),(l=o.current[Math.max(0,e-1)])==null||l.focus()):n.key==="ArrowRight"&&(n.preventDefault(),(t=o.current[Math.min(u-1,e+1)])==null||t.focus())},L=e=>{var n,a,l;e.preventDefault();const t=((a=(n=e.clipboardData)==null?void 0:n.getData)==null?void 0:a.call(n,"text"))??"",r=b==="number"?t.replace(/\D/g,""):t.replace(/\s/g,"");if(!r)return;const c=Math.max(0,o.current.findIndex(i=>i===document.activeElement)),f=p(),s=r.split("");for(let i=0;i<s.length;i++)c+i<u&&(f[c+i]=s[i]);m(f,e);const O=Math.min(c+s.length,u-1);(l=o.current[O])==null||l.focus()};return U(S,()=>({focus:e=>{var n,a;if(G(e))(n=o.current[e])==null||n.focus();else{const l=p().findIndex(r=>r===""),t=l!==-1?l:0;(a=o.current[t])==null||a.focus()}},blur:()=>{o.current.forEach(e=>e?.blur())}})),A("span",{className:J(Z({block:k}),B),onPasteCapture:L,onBlur:E,children:Array.from({length:u}).map((e,n)=>P(V,{children:[A(X,{className:Y({block:k,size:x}),type:b,size:x,placeholder:y?.[n],value:g[n]??"",autoComplete:"one-time-code",ref:a=>{o.current[n]=a},onChange:(a,l)=>W(n,a,l),onFocus:a=>j(n,a),onKeyDown:a=>H(n,a),...w}),n<u-1&&(K(d)?d(n):d)]},n))})});z.displayName="Input.OTP";export{z as default};

package/dist/input/Password.d.ts

@@ -0,0 +1,3 @@
+import { PasswordProps } from './interfaces';
+declare const Password: import('react').ForwardRefExoticComponent<PasswordProps & import('react').RefAttributes<HTMLInputElement>>;
+export default Password;

package/dist/input/Password.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{useControllableState as a}from"@nild/hooks";import{Icon as g}from"@nild/icons";import v from"@nild/icons/PreviewCloseOne";import x from"@nild/icons/PreviewOpen";import{forwardRef as C}from"react";import w from"./Input.js";import S from"./Suffix.js";const s=C(({value:i,defaultValue:l="",visible:m,defaultVisible:f=!1,onChange:t,onVisibleChange:n,...p},u)=>{const[r,c]=a(m,f),[d,h]=a(i,l);return e(w,{ref:u,type:r?"text":"password",value:d,onChange:(o,b)=>{h(String(o)),t?.(String(o),b)},...p,children:e(S,{onClick:()=>{const o=!r;c(o),n?.(o)},className:"cursor-pointer flex items-center hover:text-brand transition-colors",children:e(g,{component:r?x:v})})})});s.displayName="Input.Password";export{s as default};

package/dist/input/Prefix.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement, ReactNode } from 'react';
+import { PrefixProps } from './interfaces';
+export declare const isPrefixElement: (child: ReactNode) => child is ReactElement<PrefixProps>;
+declare const Prefix: import('react').ForwardRefExoticComponent<PrefixProps & import('react').RefAttributes<HTMLSpanElement>>;
+export default Prefix;

package/dist/input/Prefix.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";import{cnMerge as f}from"@nild/shared";import{forwardRef as n,isValidElement as p}from"react";import{useInputContext as l}from"./contexts/index.js";import{prefixClassNames as c}from"./style/index.js";const d=s=>p(s)&&s.type===e,e=n((s,r)=>{const{size:a}=l(),{className:t,children:i,...m}=s;return o("span",{...m,className:f(c({size:a}),t),ref:r,children:i})});e.displayName="Input.Prefix";export{e as default,d as isPrefixElement};

package/dist/input/Prepend.d.ts

@@ -0,0 +1,5 @@
+import { FC, ReactElement, ReactNode } from 'react';
+import { PrependProps } from './interfaces';
+export declare const isPrependElement: (child: ReactNode) => child is ReactElement<PrependProps>;
+declare const Prepend: FC<PrependProps>;
+export default Prepend;

package/dist/input/Prepend.js

@@ -0,0 +1 @@
+import{jsx as d}from"react/jsx-runtime";import{isString as c,cnMerge as t}from"@nild/shared";import{isValidElement as o,Children as u,cloneElement as f}from"react";import{useCompositeContext as v}from"./contexts/index.js";import{prependClassNames as l}from"./style/index.js";const y=e=>o(e)&&e.type===r,r=({children:e})=>{var i;const{size:a,variant:n,disabled:p}=v();if(c(e))return d("span",{className:t(l({type:"string",size:a,variant:n})),children:e});const s=u.toArray(e).find(m=>o(m));return f(s,{...s?.props,className:t(l({type:"element",size:a,variant:n}),(i=s?.props)==null?void 0:i.className),size:a,disabled:p})};r.displayName="Input.Prepend";export{r as default,y as isPrependElement};

package/dist/input/Search.d.ts

@@ -0,0 +1,3 @@
+import { SearchProps } from './interfaces';
+declare const Search: import('react').ForwardRefExoticComponent<SearchProps & import('react').RefAttributes<HTMLInputElement>>;
+export default Search;

package/dist/input/Search.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";import{useControllableState as c}from"@nild/hooks";import{Icon as d}from"@nild/icons";import h from"@nild/icons/Search";import{forwardRef as S}from"react";import g from"./Input.js";import w from"./Prefix.js";import{searchIconClassNames as y}from"./style/index.js";const e=S(({value:t,defaultValue:m="",keyword:n,defaultKeyword:s,onChange:r,...l},f)=>{const[i,p]=c(n??t,s??m);return o(g,{ref:f,value:i,onChange:(a,u)=>{p(String(a)),r?.(String(a),u)},...l,children:o(w,{children:o(d,{component:h,className:y()})})})});e.displayName="Input.Search";export{e as default};

package/dist/input/Suffix.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement, ReactNode } from 'react';
+import { SuffixProps } from './interfaces';
+export declare const isSuffixElement: (child: ReactNode) => child is ReactElement<SuffixProps>;
+declare const Suffix: import('react').ForwardRefExoticComponent<SuffixProps & import('react').RefAttributes<HTMLSpanElement>>;
+export default Suffix;

package/dist/input/Suffix.js

@@ -0,0 +1 @@
+import{jsx as f}from"react/jsx-runtime";import{cnMerge as o}from"@nild/shared";import{forwardRef as n,isValidElement as p}from"react";import{useInputContext as l}from"./contexts/index.js";import{suffixClassNames as u}from"./style/index.js";const c=s=>p(s)&&s.type===e,e=n((s,a)=>{const{size:r}=l(),{className:t,children:i,...m}=s;return f("span",{...m,className:o(u({size:r}),t),ref:a,children:i})});e.displayName="Input.Suffix";export{e as default,c as isSuffixElement};

package/dist/input/contexts/index.d.ts

@@ -0,0 +1,4 @@
+import { CompositeProps, InputProps } from '../interfaces';
+declare const CompositeProvider: import('react').Provider<Pick<CompositeProps, "variant" | "size" | "disabled" | "block">>, useCompositeContext: () => Pick<CompositeProps, "variant" | "size" | "disabled" | "block">;
+declare const InputProvider: import('react').Provider<Pick<InputProps, "variant" | "size" | "disabled" | "block">>, useInputContext: () => Pick<InputProps, "variant" | "size" | "disabled" | "block">;
+export { CompositeProvider, useCompositeContext, InputProvider, useInputContext };

package/dist/input/contexts/index.js

@@ -0,0 +1 @@
+import{createContextSuite as e}from"@nild/shared";const[t,o]=e({defaultValue:{variant:"outlined",size:"medium",block:!1,disabled:!1}}),[a,i]=e({defaultValue:{variant:"outlined",size:"medium",block:!1,disabled:!1}});export{t as CompositeProvider,a as InputProvider,o as useCompositeContext,i as useInputContext};

package/dist/input/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @category Components
+ */
+declare const Input: import('react').ForwardRefExoticComponent<import('./interfaces').InputProps & import('react').RefAttributes<HTMLInputElement>> & {
+    Composite: import('react').ForwardRefExoticComponent<import('./interfaces').CompositeProps & import('react').RefAttributes<HTMLDivElement>>;
+    Prepend: import('react').FC<import('./interfaces').PrependProps>;
+    Append: import('react').FC<import('./interfaces').AppendProps>;
+    Prefix: import('react').ForwardRefExoticComponent<import('./interfaces').PrefixProps & import('react').RefAttributes<HTMLSpanElement>>;
+    Suffix: import('react').ForwardRefExoticComponent<import('./interfaces').SuffixProps & import('react').RefAttributes<HTMLSpanElement>>;
+    Search: import('react').ForwardRefExoticComponent<import('./interfaces').SearchProps & import('react').RefAttributes<HTMLInputElement>>;
+    Password: import('react').ForwardRefExoticComponent<import('./interfaces').PasswordProps & import('react').RefAttributes<HTMLInputElement>>;
+    OTP: import('react').ForwardRefExoticComponent<import('./interfaces').OTPProps & import('react').RefAttributes<import('./interfaces').OTPRef>>;
+    Number: import('react').ForwardRefExoticComponent<import('./interfaces').NumberProps & import('react').RefAttributes<HTMLInputElement>>;
+};
+export type * from './interfaces';
+export default Input;

package/dist/input/index.js

@@ -0,0 +1 @@
+import r from"./Append.js";import o from"./Composite.js";import m from"./Input.js";import p from"./Number.js";import t from"./OTP.js";import f from"./Password.js";import i from"./Prefix.js";import e from"./Prepend.js";import s from"./Search.js";import a from"./Suffix.js";const n=Object.assign(m,{Composite:o,Prepend:e,Append:r,Prefix:i,Suffix:a,Search:s,Password:f,OTP:t,Number:p});export{n as default};

package/dist/input/style/index.d.ts

@@ -0,0 +1,24 @@
+import { InputProps, OTPProps } from '../interfaces';
+export declare const compositeClassNames: (props?: {
+    block?: boolean;
+} | undefined) => string;
+export declare const compositedInputWrapperClassNames: (props?: (Pick<InputProps, "variant"> & {
+    prepended?: boolean;
+    appended?: boolean;
+}) | undefined) => string;
+export declare const inputWrapperClassNames: (props?: InputProps | undefined) => string;
+export declare const inputClassNames: (props?: InputProps | undefined) => string;
+export declare const prefixClassNames: (props?: InputProps | undefined) => string;
+export declare const suffixClassNames: (props?: InputProps | undefined) => string;
+export declare const prependClassNames: (props?: (Pick<InputProps, "variant" | "size"> & {
+    type: "string" | "element";
+}) | undefined) => string;
+export declare const appendClassNames: (props?: (Pick<InputProps, "variant" | "size"> & {
+    type: "string" | "element";
+}) | undefined) => string;
+/**
+ * Preset component styles
+ */
+export declare const searchIconClassNames: (props?: InputProps | undefined) => string;
+export declare const otpWrapperClassNames: (props?: Pick<OTPProps, "block"> | undefined) => string;
+export declare const otpInputWrapperClassNames: (props?: Pick<InputProps, "size" | "block"> | undefined) => string;

package/dist/input/style/index.js

@@ -0,0 +1 @@
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as t}from"../../_shared/style/index.js";const s=e(["nd-input-composite","inline-flex","items-stretch"],{variants:{block:{true:["flex","w-full"],false:""}}}),a=e(["flex-auto"],{variants:{prepended:{true:["rounded-l-none"],false:""},appended:{true:["rounded-r-none"],false:""}},compoundVariants:[{variant:"outlined",appended:!0,className:["mr-[-1px]","hover:z-1","focus-within:z-1"]}]}),r=e(["nd-input-wrapper","group",["inline-flex","items-center","box-border","font-nd","transition-colors","overflow-hidden"],["border-solid","border","enabled:focus-within:border-brand"],t],{variants:{variant:{outlined:["bg-transparent","border-edge","enabled:hover:border-brand-hover"],filled:["bg-surface","border-surface","enabled:[&:hover:not(:focus-within)]:bg-surface-hover","enabled:[&:hover:not(:focus-within)]:border-surface-hover"]},size:{small:["h-6","text-sm","rounded-sm"],medium:["h-8","text-md","rounded-md"],large:["h-10","text-lg","rounded-md"]},block:{true:["flex","w-full"],false:""},disabled:{true:"disabled",false:""}}}),n=e(["nd-input","flex-auto","h-full","bg-transparent","border-none","outline-none","p-0","m-0","text-body","placeholder:text-subtle","disabled:cursor-not-allowed","[&::-ms-reveal]:hidden","[&::-ms-clear]:hidden","[&::-webkit-inner-spin-button]:appearance-none","[&::-webkit-outer-spin-button]:appearance-none","[&::-webkit-inner-spin-button]:m-0","[&::-webkit-outer-spin-button]:m-0","[-moz-appearance:textfield]"],{variants:{size:{small:["px-2","text-sm"],medium:["px-3","text-md"],large:["px-4","text-lg"]}}}),l=e(["nd-input-prefix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["pl-2","text-sm"],medium:["pl-3","text-md"],large:["pl-4","text-lg"]}}}),i=e(["nd-input-suffix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["pr-2","text-sm"],medium:["pr-3","text-md"],large:["pr-4","text-lg"]}}}),d=e(["shrink-0"],{variants:{variant:{outlined:["mr-[-1px]","hover:z-1","focus:z-1","focus-within:z-1"],filled:[]},type:{string:["inline-flex","items-center","border-solid","border"],element:["rounded-r-none"]},size:{small:["h-6","text-sm","rounded-l-sm"],medium:["h-8","text-md","rounded-l-md"],large:["h-10","text-lg","rounded-l-md"]}},compoundVariants:[{type:"string",variant:"outlined",className:["bg-surface","border-edge","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-on-brand"]},{type:"string",size:"small",className:["px-2"]},{type:"string",size:"medium",className:["px-3"]},{type:"string",size:"large",className:["px-4"]}]}),o=e(["shrink-0"],{variants:{type:{string:["inline-flex","items-center","border-solid","border"],element:["rounded-l-none","h-auto"]},size:{small:["h-6","text-sm","rounded-r-sm"],medium:["h-8","text-md","rounded-r-md"],large:["h-10","text-lg","rounded-r-md"]}},compoundVariants:[{type:"string",variant:"outlined",className:["bg-surface","border-edge","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-on-brand"]},{type:"string",size:"small",className:["px-2"]},{type:"string",size:"medium",className:["px-3"]},{type:"string",size:"large",className:["px-4"]}]}),m=e(["group-focus-within:text-brand"]),p=e(["gap-2","items-center"],{variants:{block:{true:["flex","w-full"],false:["inline-flex"]}}}),u=e(["flex-auto","min-w-0","text-center"],{compoundVariants:[{size:"small",block:!1,className:["w-6"]},{size:"medium",block:!1,className:["w-8"]},{size:"large",block:!1,className:["w-10"]}]});export{o as appendClassNames,s as compositeClassNames,a as compositedInputWrapperClassNames,n as inputClassNames,r as inputWrapperClassNames,u as otpInputWrapperClassNames,p as otpWrapperClassNames,l as prefixClassNames,d as prependClassNames,m as searchIconClassNames,i as suffixClassNames};

package/dist/radio/style/index.js

@@ -1 +1 @@
-import{cva as a}from"@nild/shared";import{DISABLED_CLS as e}from"../../_shared/style/index.js";const r=a(["nd-radio","group",["flex","items-center"],"cursor-pointer",e],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),s=a(["relative",["flex","items-center","justify-center"]],{variants:{size:{small:"size-3.5 text-sm",medium:"size-4 text-md",large:"size-4.5 text-lg"}}}),l=a([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),t=a(["stroke-brand","stroke-1","r-9","transition-[stroke,fill]"],{compoundVariants:[{checked:!0,variant:"solid",className:["fill-brand","group-enabled:group-hover:fill-brand-hover"]},{checked:!0,variant:"outlined",className:["fill-transparent","group-enabled:group-hover:fill-surface-hover"]},{checked:!1,className:["fill-transparent","group-enabled:group-hover:fill-surface-hover"]}]}),i=a(["transition-[fill]"],{variants:{variant:{solid:"r-4.5",outlined:"r-5.5"}},compoundVariants:[{checked:!0,variant:"solid",className:["fill-on-brand"]},{checked:!0,variant:"outlined",className:["fill-brand"]},{checked:!1,className:["fill-transparent"]}]}),o=a(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),n=a(["nd-radio-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}});export{i as defaultIndicatorInnerCircleClassNames,t as defaultIndicatorOuterCircleClassNames,n as groupClassNames,s as indicatorClassNames,l as indicatorInputClassNames,o as labelClassNames,r as radioClassNames};
+import{cva as a}from"@nild/shared";import{DISABLED_CLS as e}from"../../_shared/style/index.js";const s=a(["nd-radio","group",["flex","items-center"],"cursor-pointer",e],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),r=a(["relative",["flex","items-center","justify-center"]],{variants:{size:{small:"size-3.5 text-sm",medium:"size-4 text-md",large:"size-4.5 text-lg"}}}),l=a([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),t=a(["stroke-1","r-9","transition-[stroke,fill]"],{compoundVariants:[{checked:!0,variant:"solid",className:["fill-brand stroke-brand","group-enabled:group-hover:fill-brand-hover"]},{checked:!0,variant:"outlined",className:["fill-transparent stroke-brand"]},{checked:!1,className:["fill-transparent stroke-edge","group-enabled:group-hover:stroke-brand-hover"]}]}),i=a(["transition-[fill]"],{variants:{variant:{solid:"r-4.5",outlined:"r-5.5"}},compoundVariants:[{checked:!0,variant:"solid",className:["fill-on-brand"]},{checked:!0,variant:"outlined",className:["fill-brand"]},{checked:!1,className:["fill-transparent"]}]}),o=a(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),n=a(["nd-radio-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}});export{i as defaultIndicatorInnerCircleClassNames,t as defaultIndicatorOuterCircleClassNames,n as groupClassNames,r as indicatorClassNames,l as indicatorInputClassNames,o as labelClassNames,s as radioClassNames};

package/dist/switch/Switch.js

@@ -1 +1 @@
-import{jsx as a,jsxs as j}from"react/jsx-runtime";import{useControllableState as E}from"@nild/hooks";import{cnMerge as V}from"@nild/shared";import{forwardRef as z,Children as M,isValidElement as P}from"react";import{SwitchProvider as R}from"./contexts/index.js";import{switchClassNames as q}from"./style/index.js";import n from"./Thumb.js";import s from"./Track.js";const p=z(({className:h,children:f,variant:t="solid",size:r="medium",shape:c="round",checked:u,defaultChecked:v,value:y,defaultValue:g,disabled:k,onChange:i,style:C,...w},b)=>{let l,o,d;M.forEach(f,e=>{P(e)&&(e.type===s?e.props.type==="checked"?l=e:o=e:e.type===n&&(d=e))});const N={"--nd-switch-height":{small:"calc(var(--spacing) * 4)",medium:"calc(var(--spacing) * 6)",large:"calc(var(--spacing) * 8)"}[r]},[m,x]=E(u??y,v??g??!1),S=()=>{x(e=>(i?.(!e),!e))};return a(R,{value:{variant:t,shape:c,checked:m},children:j("button",{...w,type:"button",role:"switch","aria-checked":m,disabled:k,className:V(q({variant:t,size:r,shape:c}),h),style:{...N,...C},ref:b,onClick:S,children:[l||a(s,{type:"checked"}),o||a(s,{type:"unchecked"}),d||a(n,{})]})})});p.displayName="Switch";export{p as default};
+import{jsx as a,jsxs as j}from"react/jsx-runtime";import{useControllableState as E}from"@nild/hooks";import{cnMerge as V}from"@nild/shared";import{forwardRef as z,Children as M,isValidElement as P}from"react";import{SwitchProvider as R}from"./contexts/index.js";import{switchClassNames as q}from"./style/index.js";import n from"./Thumb.js";import t from"./Track.js";const h=z(({className:p,children:f,variant:r="solid",size:c="medium",shape:i="round",checked:u,defaultChecked:k,value:v,defaultValue:y,disabled:g,onChange:l,style:C,...w},b)=>{let o,d,m;M.forEach(f,e=>{P(e)&&(e.type===t?e.props.type==="checked"?o=e:d=e:e.type===n&&(m=e))});const N={"--nd-switch-height":{small:"calc(var(--spacing) * 4)",medium:"calc(var(--spacing) * 6)",large:"calc(var(--spacing) * 8)"}[c]},[s,x]=E(u??v,k??y??!1),S=()=>{x(e=>(l?.(!e),!e))};return a(R,{value:{variant:r,shape:i,checked:s},children:j("button",{...w,type:"button",role:"switch","aria-checked":s,disabled:g,className:V(q({variant:r,size:c,shape:i,checked:s}),p),style:{...N,...C},ref:b,onClick:S,children:[o||a(t,{type:"checked"}),d||a(t,{type:"unchecked"}),m||a(n,{})]})})});h.displayName="Switch";export{h as default};

package/dist/switch/style/index.d.ts

@@ -1,4 +1,6 @@
 import { SwitchProps, TrackProps } from '../interfaces';
-export declare const switchClassNames: (props?: SwitchProps | undefined) => string;
+export declare const switchClassNames: (props?: (SwitchProps & {
+    checked: boolean;
+}) | undefined) => string;
 export declare const trackClassNames: (props?: (Pick<SwitchProps, "variant" | "checked"> & Pick<TrackProps, "type">) | undefined) => string;
 export declare const thumbClassNames: (props?: Pick<SwitchProps, "variant" | "shape" | "checked"> | undefined) => string;

package/dist/switch/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const t=e(["nd-switch","group","h-[var(--nd-switch-height)]",["relative","inline-block","font-nd","overflow-hidden","cursor-pointer"],a],{variants:{variant:{solid:"",outlined:["outline-solid","outline","outline-brand"]},size:{small:["min-w-8","text-sm"],medium:["min-w-10","text-md"],large:["min-w-12","text-lg"]},shape:{round:"rounded-full",square:"rounded-md"}}}),r=e(["h-[var(--nd-switch-height)]","transition-[margin-inline,background-color]",["flex","justify-center","items-center"],["text-center","text-on-brand"]],{variants:{type:{checked:["ps-[calc(var(--nd-switch-height)/3)]","pe-[calc(var(--nd-switch-height)*1.1)]"],unchecked:["ps-[calc(var(--nd-switch-height)*1.1)]","pe-[calc(var(--nd-switch-height)/3)]","-mt-[var(--nd-switch-height)]"]}},compoundVariants:[{type:"checked",checked:!0,className:["ms-0","me-0"]},{type:"checked",checked:!1,className:["-ms-[100%]","me-[100%]"]},{type:"unchecked",checked:!0,className:["ms-[100%]","-me-[100%]"]},{type:"unchecked",checked:!1,className:["ms-0","me-0"]},{variant:"solid",checked:!0,className:["bg-brand","group-enabled:group-hover:bg-brand-hover"]},{variant:"solid",checked:!1,className:["bg-fill","group-enabled:group-hover:bg-fill-hover"]},{variant:"outlined",className:["bg-transparent","group-enabled:group-hover:bg-surface-hover"]}]}),n=e(["h-[var(--nd-switch-height)]",["flex","justify-center","items-center"],["absolute","aspect-square","scale-80"],["text-on-brand","transition-[left,background-color]"]],{variants:{variant:{solid:["bg-on-brand","top-0"],outlined:["bg-brand","top-0","group-enabled:group-hover:bg-brand-hover"]},shape:{round:"rounded-full",square:"rounded-md"},checked:{true:"left-[calc(100%-var(--nd-switch-height))]",false:"left-0"}}});export{t as switchClassNames,n as thumbClassNames,r as trackClassNames};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const t=e(["nd-switch","group","h-[var(--nd-switch-height)]","transition-[outline-color]",["relative","inline-block","font-nd","overflow-hidden","cursor-pointer"],a],{variants:{variant:{solid:"",outlined:["outline-solid","outline"]},size:{small:["min-w-8","text-sm"],medium:["min-w-10","text-md"],large:["min-w-12","text-lg"]},shape:{round:"rounded-full",square:"rounded-md"}},compoundVariants:[{checked:!0,variant:"outlined",className:["outline-brand"]},{checked:!1,variant:"outlined",className:["outline-edge","enabled:hover:outline-brand-hover"]}]}),n=e(["h-[var(--nd-switch-height)]","transition-[margin-inline,background-color]",["flex","justify-center","items-center"],["text-center","text-on-brand"]],{variants:{type:{checked:["ps-[calc(var(--nd-switch-height)/3)]","pe-[calc(var(--nd-switch-height)*1.1)]"],unchecked:["ps-[calc(var(--nd-switch-height)*1.1)]","pe-[calc(var(--nd-switch-height)/3)]","-mt-[var(--nd-switch-height)]"]}},compoundVariants:[{type:"checked",checked:!0,className:["ms-0","me-0"]},{type:"checked",checked:!1,className:["-ms-[100%]","me-[100%]"]},{type:"unchecked",checked:!0,className:["ms-[100%]","-me-[100%]"]},{type:"unchecked",checked:!1,className:["ms-0","me-0"]},{variant:"solid",checked:!0,className:["bg-brand","group-enabled:group-hover:bg-brand-hover"]},{variant:"solid",checked:!1,className:["bg-fill","group-enabled:group-hover:bg-fill-hover"]},{variant:"outlined",className:["bg-transparent"]}]}),r=e(["h-[var(--nd-switch-height)]",["flex","justify-center","items-center"],["absolute","aspect-square","scale-80"],["text-on-brand","transition-[left,background-color]"]],{variants:{variant:{solid:["bg-on-brand","top-0"],outlined:["bg-brand","top-0","group-enabled:group-hover:bg-brand-hover"]},shape:{round:"rounded-full",square:"rounded-md"},checked:{true:"left-[calc(100%-var(--nd-switch-height))]",false:"left-0"}}});export{t as switchClassNames,r as thumbClassNames,n as trackClassNames};

package/dist/tailwind.css

@@ -1 +1 @@
-@theme static{ --nd-brand-h: 158; --nd-brand-c: .14; --nd-neutral-c: .003; --nd-color-brand-0: light-dark( oklch(99% var(--nd-brand-c) var(--nd-brand-h)), oklch(14% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-5: light-dark( oklch(97% var(--nd-brand-c) var(--nd-brand-h)), oklch(17% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-10: light-dark( oklch(94% var(--nd-brand-c) var(--nd-brand-h)), oklch(21% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-15: light-dark( oklch(90% var(--nd-brand-c) var(--nd-brand-h)), oklch(26% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-20: light-dark( oklch(85% var(--nd-brand-c) var(--nd-brand-h)), oklch(32% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-30: light-dark( oklch(76% var(--nd-brand-c) var(--nd-brand-h)), oklch(42% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-40: light-dark( oklch(67% var(--nd-brand-c) var(--nd-brand-h)), oklch(50% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-50: light-dark( oklch(58% var(--nd-brand-c) var(--nd-brand-h)), oklch(58% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-60: light-dark( oklch(50% var(--nd-brand-c) var(--nd-brand-h)), oklch(67% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-70: light-dark( oklch(42% var(--nd-brand-c) var(--nd-brand-h)), oklch(76% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-80: light-dark( oklch(35% var(--nd-brand-c) var(--nd-brand-h)), oklch(85% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-90: light-dark( oklch(25% var(--nd-brand-c) var(--nd-brand-h)), oklch(93% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-100: light-dark( oklch(15% var(--nd-brand-c) var(--nd-brand-h)), oklch(98% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-neutral-0: light-dark( oklch(99% var(--nd-neutral-c) var(--nd-brand-h)), oklch(14% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-5: light-dark( oklch(97% var(--nd-neutral-c) var(--nd-brand-h)), oklch(17% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-10: light-dark( oklch(94% var(--nd-neutral-c) var(--nd-brand-h)), oklch(21% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-15: light-dark( oklch(90% var(--nd-neutral-c) var(--nd-brand-h)), oklch(26% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-20: light-dark( oklch(85% var(--nd-neutral-c) var(--nd-brand-h)), oklch(32% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-30: light-dark( oklch(76% var(--nd-neutral-c) var(--nd-brand-h)), oklch(42% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-40: light-dark( oklch(67% var(--nd-neutral-c) var(--nd-brand-h)), oklch(50% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-50: light-dark( oklch(58% var(--nd-neutral-c) var(--nd-brand-h)), oklch(58% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-60: light-dark( oklch(50% var(--nd-neutral-c) var(--nd-brand-h)), oklch(67% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-70: light-dark( oklch(42% var(--nd-neutral-c) var(--nd-brand-h)), oklch(76% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-80: light-dark( oklch(35% var(--nd-neutral-c) var(--nd-brand-h)), oklch(85% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-90: light-dark( oklch(25% var(--nd-neutral-c) var(--nd-brand-h)), oklch(93% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-100: light-dark( oklch(15% var(--nd-neutral-c) var(--nd-brand-h)), oklch(98% var(--nd-neutral-c) var(--nd-brand-h)) ); }@theme{ --color-brand: var(--nd-color-brand-60); --color-brand-hover: var(--nd-color-brand-70); --color-brand-active: var(--nd-color-brand-80); --color-brand-subtle: var(--nd-color-brand-10); --color-brand-subtle-hover: var(--nd-color-brand-15); --color-brand-subtle-active: var(--nd-color-brand-20); --color-surface: var(--nd-color-neutral-5); --color-surface-hover: var(--nd-color-neutral-10); --color-surface-active: var(--nd-color-neutral-15); --color-on-brand: var(--nd-color-neutral-0); --background-color-page: var(--nd-color-neutral-0); --background-color-container: var(--nd-color-neutral-5); --background-color-fill: var(--nd-color-neutral-20); --background-color-fill-hover: var(--nd-color-neutral-30); --border-color-edge: var(--nd-color-neutral-30); --border-color-split: var(--nd-color-neutral-20); --outline-color-edge: var(--nd-color-neutral-30); --text-color-body: var(--nd-color-neutral-100); --text-color-muted: var(--nd-color-neutral-70); --text-color-subtle: var(--nd-color-neutral-50); --text-color-link: var(--color-brand); --text-color-link-hover: var(--color-brand-hover); --text-color-link-active: var(--color-brand-active); --text-sm: .75rem; --text-sm--line-height: 1.25rem; --text-md: .875rem; --text-md--line-height: 1.375rem; --text-lg: 1rem; --text-lg--line-height: 1.5rem; --text-xl: 1.125rem; --text-xl--line-height: 1.625rem; --text-2xl: 1.25rem; --text-2xl--line-height: 1.75rem; --text-3xl: 1.5rem; --text-3xl--line-height: 2rem; --text-4xl: 1.875rem; --text-4xl--line-height: 2.375rem; --text-5xl: 2.375rem; --text-5xl--line-height: 2.875rem; --text-6xl: 2.875rem; --text-6xl--line-height: 3.375rem; --radius-sm: .125rem; --radius-md: .25rem; --radius-lg: .375rem; --font-nd: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --default-transition-duration: .2s; }@utility underline{text-decoration: underline; text-underline-offset: .125rem;}@utility r-*{r: --value(number);}@custom-variant disabled{&.disabled,&:disabled {@slot;}}@custom-variant enabled{&:not(.disabled,:disabled) {@slot;}}
+@theme static{ --nd-brand-h: 158; --nd-brand-c: .14; --nd-neutral-c: .003; --nd-color-brand-0: light-dark( oklch(99% var(--nd-brand-c) var(--nd-brand-h)), oklch(14% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-5: light-dark( oklch(97% var(--nd-brand-c) var(--nd-brand-h)), oklch(17% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-10: light-dark( oklch(94% var(--nd-brand-c) var(--nd-brand-h)), oklch(21% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-15: light-dark( oklch(90% var(--nd-brand-c) var(--nd-brand-h)), oklch(26% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-20: light-dark( oklch(85% var(--nd-brand-c) var(--nd-brand-h)), oklch(32% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-30: light-dark( oklch(76% var(--nd-brand-c) var(--nd-brand-h)), oklch(42% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-40: light-dark( oklch(67% var(--nd-brand-c) var(--nd-brand-h)), oklch(50% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-50: light-dark( oklch(58% var(--nd-brand-c) var(--nd-brand-h)), oklch(58% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-60: light-dark( oklch(50% var(--nd-brand-c) var(--nd-brand-h)), oklch(67% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-70: light-dark( oklch(42% var(--nd-brand-c) var(--nd-brand-h)), oklch(76% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-80: light-dark( oklch(35% var(--nd-brand-c) var(--nd-brand-h)), oklch(85% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-90: light-dark( oklch(25% var(--nd-brand-c) var(--nd-brand-h)), oklch(93% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-100: light-dark( oklch(15% var(--nd-brand-c) var(--nd-brand-h)), oklch(98% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-neutral-0: light-dark( oklch(99% var(--nd-neutral-c) var(--nd-brand-h)), oklch(14% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-5: light-dark( oklch(97% var(--nd-neutral-c) var(--nd-brand-h)), oklch(17% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-10: light-dark( oklch(94% var(--nd-neutral-c) var(--nd-brand-h)), oklch(21% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-15: light-dark( oklch(90% var(--nd-neutral-c) var(--nd-brand-h)), oklch(26% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-20: light-dark( oklch(85% var(--nd-neutral-c) var(--nd-brand-h)), oklch(32% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-30: light-dark( oklch(76% var(--nd-neutral-c) var(--nd-brand-h)), oklch(42% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-40: light-dark( oklch(67% var(--nd-neutral-c) var(--nd-brand-h)), oklch(50% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-50: light-dark( oklch(58% var(--nd-neutral-c) var(--nd-brand-h)), oklch(58% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-60: light-dark( oklch(50% var(--nd-neutral-c) var(--nd-brand-h)), oklch(67% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-70: light-dark( oklch(42% var(--nd-neutral-c) var(--nd-brand-h)), oklch(76% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-80: light-dark( oklch(35% var(--nd-neutral-c) var(--nd-brand-h)), oklch(85% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-90: light-dark( oklch(25% var(--nd-neutral-c) var(--nd-brand-h)), oklch(93% var(--nd-neutral-c) var(--nd-brand-h)) ); --nd-color-neutral-100: light-dark( oklch(15% var(--nd-neutral-c) var(--nd-brand-h)), oklch(98% var(--nd-neutral-c) var(--nd-brand-h)) ); }@theme{ --color-brand: var(--nd-color-brand-60); --color-brand-hover: var(--nd-color-brand-70); --color-brand-active: var(--nd-color-brand-80); --color-brand-subtle: var(--nd-color-brand-10); --color-brand-subtle-hover: var(--nd-color-brand-15); --color-brand-subtle-active: var(--nd-color-brand-20); --color-surface: var(--nd-color-neutral-5); --color-surface-hover: var(--nd-color-neutral-10); --color-surface-active: var(--nd-color-neutral-15); --color-edge: var(--nd-color-neutral-30); --color-split: var(--nd-color-neutral-20); --color-on-brand: var(--nd-color-neutral-0); --background-color-page: var(--nd-color-neutral-0); --background-color-container: var(--nd-color-neutral-5); --background-color-fill: var(--nd-color-neutral-20); --background-color-fill-hover: var(--nd-color-neutral-30); --text-color-body: var(--nd-color-neutral-100); --text-color-muted: var(--nd-color-neutral-70); --text-color-subtle: var(--nd-color-neutral-50); --text-color-link: var(--color-brand); --text-color-link-hover: var(--color-brand-hover); --text-color-link-active: var(--color-brand-active); --text-sm: .75rem; --text-sm--line-height: 1.25rem; --text-md: .875rem; --text-md--line-height: 1.375rem; --text-lg: 1rem; --text-lg--line-height: 1.5rem; --text-xl: 1.125rem; --text-xl--line-height: 1.625rem; --text-2xl: 1.25rem; --text-2xl--line-height: 1.75rem; --text-3xl: 1.5rem; --text-3xl--line-height: 2rem; --text-4xl: 1.875rem; --text-4xl--line-height: 2.375rem; --text-5xl: 2.375rem; --text-5xl--line-height: 2.875rem; --text-6xl: 2.875rem; --text-6xl--line-height: 3.375rem; --radius-sm: .125rem; --radius-md: .25rem; --radius-lg: .375rem; --font-nd: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --default-transition-duration: .2s; }@utility underline{text-decoration: underline; text-underline-offset: .125rem;}@utility r-*{r: --value(number);}@custom-variant disabled{&.disabled,&:disabled {@slot;}}@custom-variant enabled{&:not(.disabled,:disabled) {@slot;}}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nild/components",
   "private": false,
-  "version": "0.0.32",
+  "version": "0.0.33",
   "type": "module",
   "module": "./dist/index.js",
   "exports": {
@@ -31,9 +31,9 @@
   "peerDependencies": {
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "@nild/hooks": "0.0.16",
     "@nild/shared": "0.0.14",
-    "@nild/icons": "0.0.15"
+    "@nild/icons": "0.0.16",
+    "@nild/hooks": "0.0.16"
   },
   "scripts": {
     "build": "vite build --mode PROD",

package/dist/_shared/utils/isPlainChildren.js

@@ -1 +0,0 @@
-import{isNil as e,isString as t,isNumber as o,isArray as r}from"@nild/shared";const i=s=>e(s)?!1:t(s)||o(s)?!0:r(s)?s.every(a=>i(a)):!1;export{i as default};