@nild/components 0.0.37 → 0.0.39

package/dist/_shared/utils/get-global-state/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/get-global-state/index.d.ts

@@ -0,0 +1,5 @@
+export declare enum GlobalStateKey {
+    Modal = "@nild/components/modal-global-state"
+}
+declare const getGlobalState: <State>(key: GlobalStateKey | string, createState: () => State) => State;
+export default getGlobalState;

package/dist/_shared/utils/get-global-state/index.js

@@ -0,0 +1 @@
+var t=(l=>(l.Modal="@nild/components/modal-global-state",l))(t||{});const n=(l,e)=>{const a=Symbol.for(l),o=globalThis;return a in o||(o[a]=e()),o[a]};export{t as GlobalStateKey,n as default};

package/dist/_shared/utils/get-owner-document/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/get-owner-document/index.d.ts

@@ -0,0 +1,2 @@
+declare const getOwnerDocument: (...nodes: Array<Node | null | undefined>) => Document | null;
+export default getOwnerDocument;

package/dist/_shared/utils/get-owner-document/index.js

@@ -0,0 +1 @@
+import{isBrowser as e}from"@nild/shared";const r=(...t)=>{var o;return((o=t.find(n=>n?.ownerDocument))==null?void 0:o.ownerDocument)||(e()?document:null)};export{r as default};

package/dist/_shared/utils/index.d.ts

@@ -1,2 +1,8 @@
-import { default as isPlainChildren } from './isPlainChildren';
-export { isPlainChildren };
+import { default as getGlobalState, GlobalStateKey } from './get-global-state';
+import { default as getOwnerDocument } from './get-owner-document';
+import { default as isPlainChildren } from './is-plain-children';
+import { default as lockDocumentScroll } from './lock-document-scroll';
+import { default as mergeHandlers } from './merge-handlers';
+import { default as mergeProps } from './merge-props';
+import { default as registerSlots } from './register-slots';
+export { getGlobalState, getOwnerDocument, GlobalStateKey, isPlainChildren, lockDocumentScroll, registerSlots, mergeHandlers, mergeProps, };

package/dist/_shared/utils/is-plain-children/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/lock-document-scroll/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/lock-document-scroll/index.d.ts

@@ -0,0 +1,2 @@
+declare const lockDocumentScroll: (doc: Document) => () => void;
+export default lockDocumentScroll;

package/dist/_shared/utils/lock-document-scroll/index.js

@@ -0,0 +1 @@
+import{isBrowser as r}from"@nild/shared";let t=0,n="",i="";const a=e=>{const o=e.defaultView??(r()?window:null);return o?[e.documentElement,e.body].some(d=>{const l=o.getComputedStyle(d),s=l.getPropertyValue("scrollbar-gutter")||l.scrollbarGutter||"";return/\bstable\b/.test(s)}):!1},y=e=>{if(!r())return()=>{};if(t===0){n=e.body.style.overflow,i=e.body.style.paddingRight;const o=Number.parseFloat(window.getComputedStyle(e.body).paddingRight||"0")||0,d=e.documentElement.clientWidth>0?window.innerWidth-e.documentElement.clientWidth:0,l=!a(e);e.body.style.overflow="hidden",l&&d>0&&(e.body.style.paddingRight=`${o+d}px`)}return t+=1,()=>{t=Math.max(0,t-1),t===0&&(e.body.style.overflow=n,e.body.style.paddingRight=i)}};export{y as default};

package/dist/_shared/utils/merge-handlers/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/merge-handlers/index.d.ts

@@ -0,0 +1,3 @@
+type Handler<Args extends unknown[] = unknown[]> = ((...args: Args) => unknown) | undefined;
+declare const mergeHandlers: <Args extends unknown[]>(...handlers: Array<Handler<Args>>) => (...args: Args) => void;
+export default mergeHandlers;

package/dist/_shared/utils/merge-handlers/index.js

@@ -0,0 +1 @@
+const n=e=>typeof e=="object"&&e!==null&&"defaultPrevented"in e,r=(...e)=>(...t)=>{const[o]=t;for(const f of e)if(f&&(f(...t),n(o)&&o.defaultPrevented))break};export{r as default};

package/dist/_shared/utils/merge-props/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/merge-props/index.d.ts

@@ -0,0 +1,3 @@
+type PropsRecord = Record<string, unknown>;
+declare const mergeProps: <OriginalProps extends PropsRecord, ExtraProps extends PropsRecord>(originalProps: OriginalProps, extraProps: ExtraProps) => OriginalProps & ExtraProps;
+export default mergeProps;

package/dist/_shared/utils/merge-props/index.js

@@ -0,0 +1 @@
+import{cnMerge as a}from"@nild/shared";import i from"../merge-handlers/index.js";const l=(o,n)=>{const c={...o,...n},f=new Set([...Object.keys(o),...Object.keys(n)]);for(const s of f){if(s==="className"){const t=o.className,e=n.className;(t||e)&&(c.className=a(e,t));continue}if(s==="style"){const t=o.style,e=n.style;(t||e)&&(c.style={...e,...t});continue}if(/^on[A-Z]/.test(s)){const t=o[s],e=n[s];(typeof t=="function"||typeof e=="function")&&(c[s]=i(t,e))}}return c};export{l as default};

package/dist/_shared/utils/register-slots/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/_shared/utils/register-slots/index.d.ts

@@ -0,0 +1,28 @@
+import { ReactElement, ReactNode } from 'react';
+interface SlotDefinition {
+    isMatched: (child: ReactElement) => boolean;
+    multiple?: boolean;
+    strategy?: 'first' | 'last';
+}
+type SlotSchema = Record<string, SlotDefinition>;
+interface SingleSlot {
+    el: ReactElement | null;
+    seq: number;
+}
+interface MultipleSlot {
+    el: ReactElement[];
+    seq: number[];
+}
+interface PlainChild {
+    content: string | number;
+    seq: number;
+}
+type SlotValue<T extends SlotDefinition> = T['multiple'] extends true ? MultipleSlot : SingleSlot;
+interface CollectSlotsResult<Schema extends SlotSchema> {
+    slots: {
+        [K in keyof Schema]: SlotValue<Schema[K]>;
+    };
+    plainChildren: PlainChild[];
+}
+declare const registerSlots: <Schema extends SlotSchema>(schema: Schema) => (children: ReactNode) => CollectSlotsResult<Schema>;
+export default registerSlots;

package/dist/_shared/utils/register-slots/index.js

@@ -0,0 +1 @@
+import{Children as c,isValidElement as a,Fragment as h}from"react";const m=f=>{const o=Object.entries(f);return p=>{const l=o.reduce((n,[t,e])=>(n[t]=e.multiple?{el:[],seq:[]}:{el:null,seq:-1},n),{}),i=[];let r=0;const u=n=>{c.forEach(n,t=>{if(!(t==null||typeof t=="boolean")){if(a(t)&&t.type===h){u(t.props.children);return}if(typeof t=="string"||typeof t=="number"){i.push({content:t,seq:r}),r+=1;return}if(!a(t)){r+=1;return}for(const[e,s]of o)if(s.isMatched(t)){s.multiple?(l[e].el.push(t),l[e].seq.push(r)):(l[e].el===null||(s.strategy??"last")==="last")&&(l[e].el=t,l[e].seq=r);break}r+=1}})};return u(p),{slots:l,plainChildren:i}}};export{m as default};

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"],["whitespace-nowrap","truncate"],a],{variants:{variant:{solid:["bg-brand","text-brand-contrast","enabled:hover:bg-brand-hover","enabled:active:bg-brand-active"],outlined:["bg-transparent","border","border-main","text-main","enabled:hover:border-brand-hover","enabled:hover:text-brand-hover","enabled:active:border-brand-active","enabled:active:text-brand-active"],filled:["bg-muted","text-main","enabled:hover:bg-muted-hover","enabled:active:bg-muted-active"],text:["bg-transparent","text-main","enabled:hover:bg-muted-hover","enabled:active:bg-muted-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"}}}),n=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-r","border-r-brand-hover"]},{last:!1,direction:"horizontal",variant:["filled","text"],className:["border-r","border-r-muted"]},{last:!1,direction:"vertical",variant:"solid",className:["border-b","border-b-brand-hover"]},{last:!1,direction:"vertical",variant:["filled","text"],className:["border-b","border-b-muted"]}]}),o={button:r,group:t,groupedButton:n};export{o as default};
+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"],"focus-visible:ring-focused",a],{variants:{variant:{solid:["bg-brand","text-brand-contrast","enabled:hover:bg-brand-hover","enabled:active:bg-brand-active"],outlined:["bg-transparent","border","border-main","text-main","enabled:hover:border-brand-hover","enabled:hover:text-brand-hover","enabled:active:border-brand-active","enabled:active:text-brand-active"],filled:["bg-muted","text-main","enabled:hover:bg-muted-hover","enabled:active:bg-muted-active"],text:["bg-transparent","text-main","enabled:hover:bg-muted-hover","enabled:active:bg-muted-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"}}}),n=e("focus-visible:z-1",{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-r","border-r-brand-hover"]},{last:!1,direction:"horizontal",variant:["filled","text"],className:["border-r","border-r-muted"]},{last:!1,direction:"vertical",variant:"solid",className:["border-b","border-b-brand-hover"]},{last:!1,direction:"vertical",variant:["filled","text"],className:["border-b","border-b-muted"]}]}),o={button:r,group:t,groupedButton:n};export{o as default};

package/dist/checkbox/Checkbox.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{useControllableState as E,useEffectCallback as g}from"@nild/hooks";import{isString as w,cnMerge as M}from"@nild/shared";import{forwardRef as S,Children as V,isValidElement as j,cloneElement as G}from"react";import{useGroupContext as P,CheckboxProvider as R}from"./contexts/index.js";import r from"./Indicator.js";import a from"./Label.js";import I from"./style/index.js";const m=S((u,p)=>{const i=[],l=new Map,s=P(),{className:f,children:h,variant:v=s?.variant??"solid",size:d=s?.size??"medium",disabled:n=s?.disabled??!1,checked:b,defaultChecked:k,value:o,onChange:c,...C}=u,[x,y]=E(s?s.value.includes(o):b,k??!1),z=g(()=>{n||y(e=>(s?s.setValue(e?s.value.filter(N=>N!==o):s.value.concat(o)):c?.(!e),!e))});return V.forEach(h,e=>{j(e)?e.type===r?(l.delete(r),l.set(r,e)):e.type===a&&(l.delete(a),l.set(a,e)):w(e)&&(l.has(a)||l.set(a,t(a,{children:e})))}),i.push(...l.values()),l.has(r)||i.unshift(t(r,{})),t(R,{value:{variant:v,size:d,checked:x,setChecked:z},children:t("label",{...C,className:M(I.checkbox({size:d,disabled:n}),f),ref:p,children:i.map(e=>G(e,{key:e.type.displayName,...e.props}))})})});m.displayName="Checkbox";export{m as default};
+import{jsx as d,jsxs as E}from"react/jsx-runtime";import{useControllableState as G,useEffectCallback as P}from"@nild/hooks";import{cnMerge as R}from"@nild/shared";import{forwardRef as S}from"react";import V from"../_shared/utils/register-slots/index.js";import{useGroupContext as A,CheckboxProvider as B}from"./contexts/index.js";import h from"./Indicator.js";import b from"./Label.js";import F from"./style/index.js";const I=V({indicator:{isMatched:a=>a.type===h},label:{isMatched:a=>a.type===b}}),p=S((a,v)=>{var n;const e=A(),{className:C,children:k,variant:x=e?.variant??"solid",size:c=e?.size??"medium",disabled:i=e?.disabled??!1,checked:q,defaultChecked:y,value:r,onChange:m,...z}=a,{slots:l,plainChildren:s}=I(k),[M,N]=G(e?e.value.includes(r):q,y??!1),g=P(()=>{i||N(t=>(e?e.setValue(t?e.value.filter(w=>w!==r):e.value.concat(r)):m?.(!t),!t))}),u=l.indicator.el??d(h,{}),o=l.label.el??(s.length>0?d(b,{children:s[0].content}):null),j=l.label.el?l.label.seq:((n=s[0])==null?void 0:n.seq)??-1,f=!!l.indicator.el&&!!o&&j<l.indicator.seq;return d(B,{value:{variant:x,size:c,checked:M,disabled:i,setChecked:g},children:E("label",{...z,className:R(F.checkbox({size:c,disabled:i}),C),ref:v,children:[f?o:u,f?u:o]})})});p.displayName="Checkbox";export{p as default};

package/dist/checkbox/Indicator.js

@@ -1 +1 @@
-import{jsxs as l,jsx as o}from"react/jsx-runtime";import{Icon as h}from"@nild/icons";import k from"@nild/icons/CheckSmall";import{cnMerge as u}from"@nild/shared";import{forwardRef as x}from"react";import{useCheckboxContext as I}from"./contexts/index.js";import e from"./style/index.js";const r=x(({className:c,children:s,...t},i)=>{const{variant:n,size:m,checked:a,setChecked:d}=I(),f=s??(p=>o("div",{className:e.defaultIndicatorBlock({variant:n,checked:p}),children:o(h,{className:e.defaultIndicatorIcon(),component:k})}));return l("div",{...t,className:u(e.indicator({size:m}),c),ref:i,children:[f(!!a),o("input",{type:"checkbox",className:e.indicatorInput(),checked:a,onChange:d})]})});r.displayName="Checkbox.Indicator";export{r as default};
+import{jsxs as k,jsx as a}from"react/jsx-runtime";import{Icon as u}from"@nild/icons";import x from"@nild/icons/CheckSmall";import{cnMerge as I}from"@nild/shared";import{forwardRef as N}from"react";import{useCheckboxContext as C}from"./contexts/index.js";import e from"./style/index.js";const c=N(({className:s,children:o,...i},t)=>{const{variant:d,size:n,checked:r,disabled:m,setChecked:l}=C(),f=!o,p=o??(h=>a("div",{className:e.defaultIndicatorBlock({variant:d,checked:h}),children:a(u,{className:e.defaultIndicatorIcon(),component:x})}));return k("div",{...i,className:I(e.indicator({size:n,default:f}),s),ref:t,children:[p(!!r),a("input",{type:"checkbox",className:e.indicatorInput(),checked:r,disabled:m,onChange:l})]})});c.displayName="Checkbox.Indicator";export{c as default};

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

@@ -1,7 +1,7 @@
 import { CheckboxProps, GroupProps } from '../interfaces';
-declare const CheckboxProvider: import('react').Provider<Pick<CheckboxProps, "variant" | "size" | "checked"> & {
+declare const CheckboxProvider: import('react').Provider<Pick<CheckboxProps, "variant" | "size" | "disabled" | "checked"> & {
     setChecked?: () => void;
-}>, useCheckboxContext: () => Pick<CheckboxProps, "variant" | "size" | "checked"> & {
+}>, useCheckboxContext: () => Pick<CheckboxProps, "variant" | "size" | "disabled" | "checked"> & {
     setChecked?: () => void;
 };
 declare const GroupProvider: import('react').Provider<(Pick<GroupProps<unknown>, "variant" | "size" | "disabled"> & {

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

@@ -1,7 +1,9 @@
 import { CheckboxProps, GroupProps } from '../interfaces';
 declare const _default: {
     checkbox: (props?: Pick<CheckboxProps, "size" | "disabled"> | undefined) => string;
-    indicator: (props?: Pick<CheckboxProps, "size"> | undefined) => string;
+    indicator: (props?: (Pick<CheckboxProps, "size"> & {
+        default?: boolean;
+    }) | undefined) => string;
     indicatorInput: (props?: object | undefined) => string;
     defaultIndicatorBlock: (props?: Pick<CheckboxProps, "variant" | "checked"> | undefined) => string;
     defaultIndicatorIcon: (props?: object | undefined) => string;

package/dist/checkbox/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as r}from"../../_shared/style/index.js";const a=e(["nd-checkbox","group",["flex","items-center"],"cursor-pointer",r],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),t=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"]]),n=e([["flex","items-center","justify-center"],["size-full","rounded-sm","border"],"transition-[background-color,color,border-color]"],{compoundVariants:[{checked:!0,variant:"solid",className:["bg-brand border-brand text-brand-contrast","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","group-enabled:group-hover:text-brand-hover"]},{checked:!1,className:["bg-transparent border-main text-transparent","group-enabled:group-hover:border-brand-hover"]}]}),d=e(["w-full"]),l=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),s=e(["nd-checkbox-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}}),i={checkbox:a,indicator:t,indicatorInput:o,defaultIndicatorBlock:n,defaultIndicatorIcon:d,label:l,group:s};export{i as default};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as r}from"../../_shared/style/index.js";const a=e(["nd-checkbox","group",["flex","items-center"],"cursor-pointer",r],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),t=e(["nd-checkbox-indicator","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"},default:{true:["rounded-sm","transition-[box-shadow]","group-enabled:focus-visible-within:ring-focused"],false:""}}}),o=e([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),n=e([["flex","items-center","justify-center"],["size-full","rounded-sm","border"],"transition-[background-color,color,border-color]","group-enabled:group-hover:border-brand-hover"],{compoundVariants:[{checked:!0,variant:"solid",className:["bg-brand border-brand text-brand-contrast","group-enabled:group-hover:bg-brand-hover"]},{checked:!0,variant:"outlined",className:["bg-transparent border-brand text-brand","group-enabled:group-hover:text-brand-hover"]},{checked:!1,className:["bg-transparent border-main text-transparent"]}]}),d=e(["w-full"]),i=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),s=e(["nd-checkbox-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}}),l={checkbox:a,indicator:t,indicatorInput:o,defaultIndicatorBlock:n,defaultIndicatorIcon:d,label:i,group:s};export{l as default};

package/dist/index.d.ts

@@ -2,10 +2,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 Modal } from './modal';
 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 Transition, TransitionStatus } from './transition';
 import { default as Typography } from './typography';
-export { Button, Checkbox, Divider, Popover, Radio, Switch, Tooltip, Transition, Typography, Input };
+export { Button, Checkbox, Divider, Input, Modal, Popover, Radio, Switch, Tooltip, Transition, TransitionStatus, Typography, };

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"./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};
+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"./modal/index.js";import{default as m}from"./popover/index.js";import{default as i}from"./radio/index.js";import{default as f}from"./switch/index.js";import{default as p}from"./tooltip/index.js";import{default as u}from"./transition/Transition.js";import{TransitionStatus as d}from"./transition/interfaces/index.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 Modal,m as Popover,i as Radio,f as Switch,p as Tooltip,u as Transition,d as TransitionStatus,e as Typography};

package/dist/input/Composite.js

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

package/dist/input/Input.js

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

package/dist/input/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as t}from"../../_shared/style/index.js";const n=e(["nd-input-composite","inline-flex","items-stretch"],{variants:{block:{true:["flex","w-full"],false:""}}}),r=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"]}]}),a=e(["nd-input-wrapper","group",["inline-flex","items-center","box-border","font-nd","transition-colors","overflow-hidden"],["border","enabled:focus-within:border-brand"],t],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover"],filled:["bg-muted","border-subtle","enabled:[&:hover:not(:focus-within)]:bg-muted-hover","enabled:[&:hover:not(:focus-within)]:border-muted"]},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:""}}}),i=e(["nd-input","flex-auto","h-full","bg-transparent","border-none","outline-none","p-0","m-0","text-main","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"]}}}),s=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"]}}}),l=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"],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-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{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"],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-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{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"]}]}),x={composite:n,compositedInputWrapper:r,inputWrapper:a,input:i,prefix:s,suffix:l,prepend:d,append:o,searchIcon:m,otpWrapper:p,otpInputWrapper:u};export{x as default};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as t}from"../../_shared/style/index.js";const n=e(["nd-input-composite","inline-flex","items-stretch"],{variants:{block:{true:["flex","w-full"],false:""}}}),r=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"]}]}),a=e(["nd-input-wrapper","group",["inline-flex","items-center","box-border","font-nd","transition-colors","overflow-hidden"],["border","enabled:focus-within:border-brand","enabled:focus-within:z-1"],"enabled:focus-visible-within:ring-focused",t],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover"],filled:["bg-muted","border-subtle","enabled:[&:hover:not(:focus-within)]:bg-muted-hover","enabled:[&:hover:not(:focus-within)]:border-muted"]},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:""}}}),i=e(["nd-input","flex-auto","h-full","bg-transparent","border-none","outline-none","p-0","m-0","text-main","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"]}}}),s=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"]}}}),l=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"],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-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{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"],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-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{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"]}]}),x={composite:n,compositedInputWrapper:r,inputWrapper:a,input:i,prefix:s,suffix:l,prepend:d,append:o,searchIcon:m,otpWrapper:p,otpInputWrapper:u};export{x as default};

package/dist/modal/Body.d.ts

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

package/dist/modal/Body.js

@@ -0,0 +1 @@
+import{jsx as m}from"react/jsx-runtime";import{cnMerge as d}from"@nild/shared";import{forwardRef as i,isValidElement as l}from"react";import t from"./style/index.js";const f=a=>l(a)&&a.type===e,e=i(({className:a,children:r,...s},o)=>m("div",{...s,className:d(t.body(),a),ref:o,children:r}));e.displayName="Modal.Body";export{e as default,f as isBodyElement};

package/dist/modal/Close.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement, ReactNode } from 'react';
+import { CloseProps } from './interfaces';
+export declare const isCloseElement: (child: ReactNode) => child is ReactElement<CloseProps>;
+declare const Close: import('react').ForwardRefExoticComponent<import('../button').ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+export default Close;

package/dist/modal/Close.js

@@ -0,0 +1 @@
+import{jsx as o}from"react/jsx-runtime";import{Icon as C}from"@nild/icons";import x from"@nild/icons/Close";import{cnMerge as h}from"@nild/shared";import{forwardRef as M,isValidElement as N}from"react";import q from"../_shared/utils/merge-handlers/index.js";import y from"../button/index.js";import{useModalContext as z}from"./contexts/index.js";import E from"./style/index.js";const g=e=>N(e)&&e.type===a,a=M(({children:e,variant:r="text",shape:s="square",size:l="small",equal:i=!0,"aria-label":m="Close",onClick:t,className:n,disabled:p,...c},d)=>{const{disabled:f,close:u}=z();return o(y,{...c,"aria-label":m,className:h(E.close(),n),disabled:f||p,equal:i,onClick:q(t,b=>(u(),b)),ref:d,shape:s,size:l,variant:r,children:e??o(C,{component:x})})});a.displayName="Modal.Close";export{a as default,g as isCloseElement};

package/dist/modal/Footer.d.ts

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

package/dist/modal/Footer.js

@@ -0,0 +1 @@
+import{jsx as m}from"react/jsx-runtime";import{cnMerge as t}from"@nild/shared";import{forwardRef as i,isValidElement as f}from"react";import l from"./style/index.js";const d=e=>f(e)&&e.type===r,r=i(({className:e,children:a,...o},s)=>m("div",{...o,className:t(l.footer(),e),ref:s,children:a}));r.displayName="Modal.Footer";export{r as default,d as isFooterElement};

package/dist/modal/Header.d.ts

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

package/dist/modal/Header.js

@@ -0,0 +1 @@
+import{jsx as d}from"react/jsx-runtime";import{cnMerge as i}from"@nild/shared";import{forwardRef as o,isValidElement as l}from"react";import t from"./style/index.js";const f=e=>l(e)&&e.type===a,a=o(({className:e,children:r,...s},m)=>d("div",{...s,className:i(t.header(),e),ref:m,children:r}));a.displayName="Modal.Header";export{a as default,f as isHeaderElement};

package/dist/modal/Modal.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ModalProps } from './interfaces';
+declare const Modal: FC<ModalProps>;
+export default Modal;

package/dist/modal/Modal.js

@@ -0,0 +1 @@
+import{jsxs as X,jsx as T}from"react/jsx-runtime";import{useControllableState as w,useEffectCallback as x}from"@nild/hooks";import{isFunction as G,cnJoin as B}from"@nild/shared";import{useRef as s,useEffect as H,useMemo as K,cloneElement as L}from"react";import Q from"../_shared/utils/get-owner-document/index.js";import V from"../_shared/utils/register-slots/index.js";import W from"../transition/Transition.js";import{TransitionStatus as P}from"../transition/interfaces/index.js";import{resolvePlacement as Y}from"./_shared/index.js";import{ModalProvider as Z}from"./contexts/index.js";import{isPortalElement as j}from"./Portal.js";import z from"./style/index.js";import _,{isTriggerElement as D}from"./Trigger.js";const $=V({trigger:{isMatched:a=>D(a)},portal:{isMatched:a=>j(a)},firstBare:{isMatched:a=>!D(a)&&!j(a),strategy:"first"}}),U=a=>{const{children:q,variant:o="dialog",size:u="medium",open:A,defaultOpen:I=!1,disabled:i=!1,closeOnEscape:p=!0,closeOnOverlayClick:f=!0,trapFocus:d=!0,restoreFocus:b=!0,lockScroll:v=!0,"aria-label":y,"aria-labelledby":E,"aria-describedby":g,onOpen:O,onClose:C}=a,{slots:l}=$(q),[e,J]=w(A,I),n=s(e),M=s(null),h=s(null),N=s(null),k=s(e),c=Y(o,a.placement);n.current=e;const m=x(r=>{if(i)return;const S=n.current,t=G(r)?r(S):r;t!==S&&(n.current=t,J(t),t?O?.():C?.())}),F=x(()=>{m(!1)});H(()=>{if(e&&!k.current){const r=Q(M.current,h.current);N.current=r?.activeElement}k.current=e},[e]);const R=K(()=>({open:e,variant:o,placement:c,size:u,disabled:i,closeOnEscape:p,closeOnOverlayClick:f,trapFocus:d,restoreFocus:b,lockScroll:v,accessibility:{"aria-label":y,"aria-labelledby":E,"aria-describedby":g},refs:{trigger:M,surface:h,lastActiveEl:N},requestOpen:m,close:F}),[g,y,E,F,p,f,i,v,e,c,m,b,u,d,o]);return X(Z,{value:R,children:[l.trigger.el??(l.firstBare.el&&T(_,{children:l.firstBare.el})),l.portal.el&&T(W,{visible:e,children:r=>!e&&[P.UNMOUNTED,P.EXITED].includes(r)?null:L(l.portal.el,{...l.portal.el.props,overlayClassName:B(z.overlayMotion({status:r}),l.portal.el.props.overlayClassName),surfaceClassName:B(z.surfaceMotion({status:r,variant:o,placement:c}),l.portal.el.props.surfaceClassName)})})]})};U.displayName="Modal";export{U as default};

package/dist/modal/Portal.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+import { PortalProps } from './interfaces';
+export declare const isPortalElement: (child: unknown) => child is ReactElement<PortalProps>;
+declare const Portal: import('react').ForwardRefExoticComponent<PortalProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Portal;

package/dist/modal/Portal.js

@@ -0,0 +1 @@
+import{jsxs as F,jsx as D}from"react/jsx-runtime";import{useEffectCallback as p,useIsomorphicLayoutEffect as J,useEventListener as I}from"@nild/hooks";import{cnMerge as y,mergeRefs as Q}from"@nild/shared";import{forwardRef as U,useRef as X,useEffect as z,isValidElement as Y}from"react";import{createPortal as Z}from"react-dom";import _ from"../_shared/utils/get-owner-document/index.js";import $ from"../_shared/utils/lock-document-scroll/index.js";import ee from"../_shared/utils/register-slots/index.js";import{getFocusableElements as te,focusWithin as v,restoreFocusTo as re}from"./_shared/index.js";import{isBodyElement as ae}from"./Body.js";import se,{isCloseElement as oe}from"./Close.js";import{useModalContext as le}from"./contexts/index.js";import{isFooterElement as ne}from"./Footer.js";import{isHeaderElement as ie}from"./Header.js";import{useModalStack as ce}from"./hooks/useModalStack.js";import E from"./style/index.js";const fe=a=>Y(a)&&a.type===b,ue=ee({header:{isMatched:a=>ie(a)},body:{isMatched:a=>ae(a)},footer:{isMatched:a=>ne(a)},close:{isMatched:a=>oe(a)}}),b=U(({className:a,style:K,children:O,container:h,overlayless:g=!1,overlayClassName:w,surfaceClassName:L,onTransitionEnd:P,...R},S)=>{const{open:l,variant:j,placement:k,size:A,closeOnEscape:B,closeOnOverlayClick:H,trapFocus:M,lockScroll:x,restoreFocus:C,accessibility:u,refs:s,close:T}=le(),N=X(l),t=_(h,s.surface.current,s.trigger.current),n=h??t?.body??null,{zIndex:V,topmost:i}=ce(t,!!n);N.current=l;const W=p(()=>{g||!l||!H||!i||T()}),q=p(e=>{const r=s.surface.current;if(!r||!l||!i)return;if(e.key==="Escape"&&B){e.preventDefault(),T();return}if(e.key!=="Tab"||!M)return;const o=te(r),f=t?.activeElement;if(o.length===0){e.preventDefault(),r.focus();return}if(!f||!r.contains(f)){e.preventDefault(),v(r,e.shiftKey);return}const m=o[0],d=o.at(-1);e.shiftKey&&f===m?(e.preventDefault(),d?.focus()):!e.shiftKey&&f===d&&(e.preventDefault(),m?.focus())}),G=p(e=>{const r=s.surface.current,o=e.target;!r||!M||!l||!i||!o||r.contains(o)||v(r)});if(z(()=>{if(!(!n||!x||!t))return $(t)},[x,t,n]),z(()=>()=>{!C||N.current||re(s.lastActiveEl.current,s.trigger.current)},[s.lastActiveEl,s.trigger,C]),J(()=>{if(!l)return;const e=setTimeout(()=>{const r=s.surface.current;if(!r||!i)return;const o=t?.activeElement;(!o||!r.contains(o))&&v(r)},0);return()=>{clearTimeout(e)}},[l,t,s.surface,i]),I(t,"keydown",q),I(t,"focusin",G),!n)return null;const{slots:c}=ue(O);return Z(F("div",{className:y(E.portal({placement:k}),a),style:{zIndex:V,...K},...R,children:[!g&&D("div",{className:y(E.overlay(),w),onClick:W}),F("div",{ref:Q(s.surface,S),className:y(E.surface({variant:j,placement:k,size:A}),L),"aria-describedby":u["aria-describedby"],"aria-label":u["aria-label"],"aria-labelledby":u["aria-labelledby"],"aria-modal":"true",role:"dialog",tabIndex:-1,onTransitionEnd:P,children:[c.header.el,c.body.el,c.footer.el,c.close.el??D(se,{})]})]}),n)});b.displayName="Modal.Portal";export{b as default,fe as isPortalElement};

package/dist/modal/Trigger.d.ts

@@ -0,0 +1,5 @@
+import { FC, ReactElement } from 'react';
+import { TriggerProps } from './interfaces';
+export declare const isTriggerElement: (child: unknown) => child is ReactElement<TriggerProps>;
+declare const Trigger: FC<TriggerProps>;
+export default Trigger;

package/dist/modal/Trigger.js

@@ -0,0 +1 @@
+import{useEffectCallback as m}from"@nild/hooks";import{mergeRefs as f}from"@nild/shared";import{isValidElement as s,Children as n,cloneElement as p}from"react";import g from"../_shared/utils/merge-props/index.js";import{useModalContext as c}from"./contexts/index.js";import d from"./style/index.js";const u=e=>s(e)&&e.type===o,o=({children:e})=>{const{refs:t,requestOpen:a}=c(),r=n.toArray(e).find(l=>s(l)),i=m(()=>{a(!0)});return r?p(r,g(r.props,{className:d.trigger(),onClick:i,ref:f(t.trigger,r.props.ref)})):null};o.displayName="Modal.Trigger";export{o as default,u as isTriggerElement};

package/dist/modal/_shared/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/modal/_shared/index.d.ts

@@ -0,0 +1,5 @@
+import { ModalPlacement, ModalVariant } from '../interfaces';
+export declare const resolvePlacement: (variant: ModalVariant, placement?: ModalPlacement) => ModalPlacement;
+export declare const getFocusableElements: (container: HTMLElement) => HTMLElement[];
+export declare const focusWithin: (container: HTMLElement, fromEnd?: boolean) => HTMLElement;
+export declare const restoreFocusTo: (target?: HTMLElement | null, fallback?: HTMLElement | null) => void;

package/dist/modal/_shared/index.js

@@ -0,0 +1 @@
+const a=(t,e)=>t==="drawer"?e&&e!=="center"?e:"right":"center",o=["a[href]","area[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])","iframe","summary",'[contenteditable="true"]','[tabindex]:not([tabindex="-1"])'].join(","),d=t=>{const e=window.getComputedStyle(t);return e.display!=="none"&&e.visibility!=="hidden"&&!t.hidden},r=t=>Array.from(t.querySelectorAll(o)).filter(e=>!e.hasAttribute("disabled")&&e.getAttribute("aria-hidden")!=="true"&&e.tabIndex>=0&&d(e)),l=(t,e=!1)=>{const n=r(t).at(e?-1:0)??t;return n.focus(),n},s=(t,e)=>{var n;const i=t!=null&&t.isConnected?t:e!=null&&e.isConnected?e:null;(n=i?.focus)==null||n.call(i)};export{l as focusWithin,r as getFocusableElements,a as resolvePlacement,s as restoreFocusTo};

package/dist/modal/_shared/stack.d.ts

@@ -0,0 +1,7 @@
+export declare const EMPTY_MODAL_STACK: readonly symbol[];
+export interface ModalStackStore {
+    getSnapshot: () => readonly symbol[];
+    mount: (token: symbol) => VoidFunction;
+    subscribe: (listener: VoidFunction) => VoidFunction;
+}
+export declare const getModalStackStore: (ownerDocument: Document) => ModalStackStore;

package/dist/modal/_shared/stack.js

@@ -0,0 +1 @@
+import c,{GlobalStateKey as i}from"../../_shared/utils/get-global-state/index.js";import"@nild/shared";import"react";const a=[],l=()=>{const t=[],o=new Set;let s=a;const n=()=>{s=[...t],o.forEach(e=>{e()})};return{getSnapshot:()=>s,mount:e=>(t.includes(e)||(t.push(e),n()),()=>{const r=t.indexOf(e);r!==-1&&(t.splice(r,1),n())}),subscribe:e=>(o.add(e),()=>{o.delete(e)})}},p=t=>{const o=c(i.Modal,()=>new WeakMap),s=o.get(t);if(s)return s;const n=l();return o.set(t,n),n};export{a as EMPTY_MODAL_STACK,p as getModalStackStore};

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

@@ -0,0 +1,24 @@
+import { Dispatch, RefObject, SetStateAction } from 'react';
+import { ModalAccessibility, ModalPlacement, ModalSize, ModalVariant } from '../interfaces';
+export interface ModalContextValue {
+    open: boolean;
+    variant: ModalVariant;
+    placement: ModalPlacement;
+    size: ModalSize;
+    disabled: boolean;
+    closeOnEscape: boolean;
+    closeOnOverlayClick: boolean;
+    trapFocus: boolean;
+    restoreFocus: boolean;
+    lockScroll: boolean;
+    accessibility: ModalAccessibility;
+    refs: {
+        trigger: RefObject<Element>;
+        surface: RefObject<HTMLDivElement>;
+        lastActiveEl: RefObject<HTMLElement | null>;
+    };
+    requestOpen: Dispatch<SetStateAction<boolean>>;
+    close: () => void;
+}
+declare const ModalProvider: import('react').Provider<ModalContextValue>, useModalContext: () => ModalContextValue;
+export { ModalProvider, useModalContext };

package/dist/modal/contexts/index.js

@@ -0,0 +1 @@
+import{createContextSuite as e}from"@nild/shared";const[l,r]=e({defaultValue:{open:!1,variant:"dialog",placement:"center",size:"medium",disabled:!1,closeOnEscape:!0,closeOnOverlayClick:!0,trapFocus:!0,restoreFocus:!0,lockScroll:!0,accessibility:{"aria-label":void 0,"aria-labelledby":void 0,"aria-describedby":void 0},refs:{trigger:{current:null},surface:{current:null},lastActiveEl:{current:null}},requestOpen:()=>{},close:()=>{}}});export{l as ModalProvider,r as useModalContext};

package/dist/modal/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useModalStack } from './useModalStack';

package/dist/modal/hooks/useModalStack.d.ts

@@ -0,0 +1,4 @@
+export declare const useModalStack: (ownerDocument: Document | null, present: boolean) => {
+    zIndex: number;
+    topmost: boolean;
+};

package/dist/modal/hooks/useModalStack.js

@@ -0,0 +1 @@
+import{useRef as l,useEffect as m,useSyncExternalStore as S}from"react";import{getModalStackStore as d,EMPTY_MODAL_STACK as u}from"../_shared/stack.js";const f=40,i=(e,o)=>{const r=l(Symbol("modal")),t=e?d(e):null;m(()=>{if(!(!o||!t))return t.mount(r.current)},[o,t]);const n=S(c=>t?.subscribe(c)??(()=>{}),()=>t?.getSnapshot()??u,()=>u),s=n.indexOf(r.current),a=n.at(-1)===r.current;return{zIndex:f+(s===-1?0:s),topmost:a}};export{i as useModalStack};

package/dist/modal/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @category Components
+ */
+declare const Modal: import('react').FC<import('./interfaces').ModalProps> & {
+    Trigger: import('react').FC<import('./interfaces').TriggerProps>;
+    Portal: import('react').ForwardRefExoticComponent<import('./interfaces').PortalProps & import('react').RefAttributes<HTMLDivElement>>;
+    Header: import('react').ForwardRefExoticComponent<import('./interfaces').HeaderProps & import('react').RefAttributes<HTMLDivElement>>;
+    Body: import('react').ForwardRefExoticComponent<import('./interfaces').BodyProps & import('react').RefAttributes<HTMLDivElement>>;
+    Footer: import('react').ForwardRefExoticComponent<import('./interfaces').FooterProps & import('react').RefAttributes<HTMLDivElement>>;
+    Close: import('react').ForwardRefExoticComponent<import('../button').ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+};
+export type * from './interfaces';
+export default Modal;

package/dist/modal/index.js

@@ -0,0 +1 @@
+import o from"./Body.js";import r from"./Close.js";import m from"./Footer.js";import t from"./Header.js";import i from"./Modal.js";import e from"./Portal.js";import f from"./Trigger.js";const p=Object.assign(i,{Trigger:f,Portal:e,Header:t,Body:o,Footer:m,Close:r});export{p as default};

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

@@ -0,0 +1,27 @@
+import { TransitionStatus } from '../../transition/interfaces';
+import { ModalPlacement, ModalSize, ModalVariant } from '../interfaces';
+declare const _default: {
+    trigger: (props?: object | undefined) => string;
+    portal: (props?: {
+        placement: ModalPlacement;
+    } | undefined) => string;
+    overlay: (props?: object | undefined) => string;
+    overlayMotion: (props?: {
+        status: TransitionStatus;
+    } | undefined) => string;
+    surfaceMotion: (props?: {
+        status: TransitionStatus;
+        variant: ModalVariant;
+        placement: ModalPlacement;
+    } | undefined) => string;
+    header: (props?: object | undefined) => string;
+    body: (props?: object | undefined) => string;
+    footer: (props?: object | undefined) => string;
+    close: (props?: object | undefined) => string;
+    surface: (props?: {
+        variant: ModalVariant;
+        placement: ModalPlacement;
+        size: ModalSize;
+    } | undefined) => string;
+};
+export default _default;

package/dist/modal/style/index.js

@@ -0,0 +1 @@
+import{cva as e}from"@nild/shared";import{TransitionStatus as a}from"../../transition/interfaces/index.js";const t=[a.UNMOUNTED,a.ENTERING,a.EXITING,a.EXITED],r=e(["nd-modal-trigger"]),s=e(["nd-modal-portal","fixed","inset-0","flex","pointer-events-auto"],{variants:{placement:{center:["items-center","justify-center","p-4"],left:["items-stretch","justify-start"],right:["items-stretch","justify-end"],top:["items-start","justify-center"],bottom:["items-end","justify-center"]}}}),l=e(["nd-modal-overlay","absolute","inset-0","transition-opacity","duration-[var(--default-transition-duration)]","ease-out","bg-[color-mix(in_oklch,var(--background-color-page-inverse)_18%,transparent)]"]),n=e([],{variants:{status:{[a.UNMOUNTED]:"",[a.ENTERING]:"",[a.ENTERED]:"",[a.EXITING]:"",[a.EXITED]:""}},compoundVariants:[{status:t,className:"opacity-0"},{status:a.ENTERED,className:"opacity-100"}]}),o=e(["nd-modal-header","shrink-0","px-6","pt-6","pb-4","pr-16","text-lg","font-semibold"]),i=e(["nd-modal-body","min-h-0","flex-auto","overflow-auto","px-6","pb-6"]),m=e(["nd-modal-footer","shrink-0","flex","justify-end","gap-3","border-t","border-subtle","px-6","py-4"]),c=e(["nd-modal-close","absolute","top-4","right-6","z-1"]),d=e(["nd-modal-surface","relative","pointer-events-auto","flex","min-h-0","flex-col","overflow-hidden","bg-panel","text-main","shadow-2xl","outline-none","transition-[opacity,translate,scale]","duration-[var(--default-transition-duration)]","ease-out"],{variants:{variant:{dialog:"",drawer:""},placement:{center:["w-full","max-h-[calc(100vh-2rem)]"],left:["h-full","max-h-screen"],right:["h-full","max-h-screen"],top:["w-full","max-w-screen"],bottom:["w-full","max-w-screen"]},size:{small:"",medium:"",large:"",full:""}},compoundVariants:[{variant:"dialog",placement:"center",size:"small",className:["max-w-96","rounded-xl"]},{variant:"dialog",placement:"center",size:"medium",className:["max-w-[36rem]","rounded-xl"]},{variant:"dialog",placement:"center",size:"large",className:["max-w-[48rem]","rounded-xl"]},{variant:"dialog",placement:"center",size:"full",className:["h-[calc(100vh-2rem)]","w-[calc(100vw-2rem)]","max-w-none","rounded-xl"]},{variant:"drawer",placement:["left","right"],size:"small",className:"w-80"},{variant:"drawer",placement:["left","right"],size:"medium",className:"w-[28rem]"},{variant:"drawer",placement:["left","right"],size:"large",className:"w-[36rem]"},{variant:"drawer",placement:["left","right"],size:"full",className:"w-screen"},{variant:"drawer",placement:["top","bottom"],size:"small",className:"h-64"},{variant:"drawer",placement:["top","bottom"],size:"medium",className:"h-96"},{variant:"drawer",placement:["top","bottom"],size:"large",className:"h-[32rem]"},{variant:"drawer",placement:["top","bottom"],size:"full",className:"h-screen"}]}),u=e([],{variants:{status:{[a.UNMOUNTED]:"",[a.ENTERING]:"",[a.ENTERED]:"",[a.EXITING]:"",[a.EXITED]:""},variant:{dialog:"",drawer:""},placement:{center:"",left:"",right:"",top:"",bottom:""}},compoundVariants:[{status:t,variant:"dialog",className:["opacity-0","scale-95"]},{status:a.ENTERED,variant:"dialog",className:["opacity-100","scale-100"]},{status:t,variant:"drawer",placement:"left",className:"-translate-x-full"},{status:a.ENTERED,variant:"drawer",placement:"left",className:"translate-x-0"},{status:t,variant:"drawer",placement:"right",className:"translate-x-full"},{status:a.ENTERED,variant:"drawer",placement:"right",className:"translate-x-0"},{status:t,variant:"drawer",placement:"top",className:"-translate-y-full"},{status:a.ENTERED,variant:"drawer",placement:"top",className:"translate-y-0"},{status:t,variant:"drawer",placement:"bottom",className:"translate-y-full"},{status:a.ENTERED,variant:"drawer",placement:"bottom",className:"translate-y-0"}]}),p={trigger:r,portal:s,overlay:l,overlayMotion:n,surfaceMotion:u,header:o,body:i,footer:m,close:c,surface:d};export{p as default};

package/dist/popup/Popup.js

@@ -1 +1 @@
-import{jsxs as J,jsx as i}from"react/jsx-runtime";import{useControllableState as K,useEffectCallback as f,useIsomorphicLayoutEffect as M}from"@nild/hooks";import{isArray as Q,makeArray as W,isFunction as X}from"@nild/shared";import{Children as Y,isValidElement as Z,useState as _,useMemo as P,useRef as $}from"react";import G from"../transition/Transition.js";import{PopupProvider as ee,PortalProvider as re,ArrowProvider as te}from"./contexts/index.js";import ae from"./hooks/usePopup.js";import oe from"./Portal.js";import x from"./Trigger.js";const A=({children:E,placement:O,offset:R,action:p="click",size:d="medium",arrowed:h=!0,inverse:v=!1,delay:t=100,open:S,defaultOpen:w=!1,disabled:g,onOpen:b,onClose:k})=>{let n,y,l;Y.forEach(E,e=>{if(Z(e))switch(e.type){case x:y=e;break;case oe:l=e;break;default:n=e;break}});const[a,j]=_(w),[o,z]=K(S,w),[T,F=100]=Q(t)?t:[t,t],s=P(()=>new Set(W(p)),[p]),r=$(),[{triggerRef:u,portalRef:c,portalContext:I,arrowRef:L,arrowContext:N},{update:U,autoUpdate:V}]=ae({placement:O,offset:R}),m=f(e=>{g||z(H=>{const C=X(e)?e(H):e;return C?b?.():k?.(),C})}),q=f(()=>{s.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{m(!0)},T))}),B=f(()=>{s.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{m(!1)},F))}),D=P(()=>({actions:s,size:d,arrowed:h,inverse:v,refs:{trigger:u,portal:c,arrow:L},setOpen:m,enter:q,leave:B}),[s,d,h,v]);return M(()=>{if(o&&!a)j(!0);else if(o&&a&&u.current&&c.current)return V(u.current,c.current,U)},[o,a]),J(ee,{value:D,children:[y||n&&i(x,{children:n}),i(re,{value:I,children:i(te,{value:N,children:l&&i(G,{visible:o,children:a&&l})})})]})};A.displayName="Popup";export{A as default};
+import{jsxs as H,jsx as l}from"react/jsx-runtime";import{useControllableState as J,useEffectCallback as f,useIsomorphicLayoutEffect as K}from"@nild/hooks";import{isArray as Q,makeArray as V,isFunction as W}from"@nild/shared";import{useState as X,useMemo as P,useRef as Y}from"react";import Z from"../_shared/utils/register-slots/index.js";import _ from"../transition/Transition.js";import{PopupProvider as $,PortalProvider as G,ArrowProvider as ee}from"./contexts/index.js";import re from"./hooks/usePopup.js";import R from"./Portal.js";import m from"./Trigger.js";const te=Z({trigger:{isMatched:e=>e.type===m},portal:{isMatched:e=>e.type===R},firstBare:{isMatched:e=>e.type!==m&&e.type!==R,strategy:"first"}}),T=({children:e,placement:b,offset:x,action:d="click",size:h="medium",arrowed:v=!0,inverse:y=!1,delay:a=100,open:A,defaultOpen:g=!1,disabled:B,onOpen:w,onClose:C})=>{const{slots:t}=te(e),[o,O]=X(g),[s,j]=J(A,g),[k,z=100]=Q(a)?a:[a,a],i=P(()=>new Set(V(d)),[d]),r=Y(),[{triggerRef:n,portalRef:u,portalContext:E,arrowRef:S,arrowContext:F},{update:I,autoUpdate:L}]=re({placement:b,offset:x}),p=f(c=>{B||j(D=>{const M=W(c)?c(D):c;return M?w?.():C?.(),M})}),N=f(()=>{i.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{p(!0)},k))}),U=f(()=>{i.has("hover")&&(r.current&&clearTimeout(r.current),r.current=setTimeout(()=>{p(!1)},z))}),q=P(()=>({actions:i,size:h,arrowed:v,inverse:y,refs:{trigger:n,portal:u,arrow:S},setOpen:p,enter:N,leave:U}),[i,h,v,y]);return K(()=>{if(s&&!o)O(!0);else if(s&&o&&n.current&&u.current)return L(n.current,u.current,I)},[s,o]),H($,{value:q,children:[t.trigger.el??(t.firstBare.el&&l(m,{children:t.firstBare.el})),l(G,{value:E,children:l(ee,{value:F,children:t.portal.el&&l(_,{visible:s,children:o&&t.portal.el})})})]})};T.displayName="Popup";export{T as default};

package/dist/popup/style/index.js

@@ -1 +1 @@
-import{cva as r}from"@nild/shared";const e=r(["nd-popup-trigger"]),a=r(["nd-popup-portal",["absolute","top-0","left-0"]]),t=r(["rounded-md","shadow-lg"],{variants:{size:{small:["px-2","py-1"],medium:["px-4","py-3"],large:["px-6","py-5"]},inverse:{true:["bg-page-inverse","text-main-inverse"],false:["bg-panel","text-main"]}}}),o=r(["nd-popup-arrow","absolute"],{variants:{size:{small:["w-1.5","h-1.5"],medium:["w-3","h-3"],large:["w-4.5","h-4.5"]},arrowed:{true:"",false:["opacity-0","invisible"]},inverse:{true:["bg-page-inverse"],false:["bg-panel"]},orientation:{up:["transform-[translateY(-50%)_rotate(45deg)]","rounded-tl-sm"],down:["transform-[translateY(50%)_rotate(45deg)]","rounded-br-sm"],left:["transform-[translateX(-50%)_rotate(45deg)]","rounded-bl-sm"],right:["transform-[translateX(50%)_rotate(45deg)]","rounded-tr-sm"]}},compoundVariants:[{orientation:"up",className:["shadow-[-1px_-1px_0_0_var(--border-color-subtle)]"]},{orientation:"down",className:["shadow-[1px_1px_0_0_var(--border-color-subtle)]"]},{orientation:"left",className:["shadow-[-1px_1px_0_0_var(--border-color-subtle)]"]},{orientation:"right",className:["shadow-[1px_-1px_0_0_var(--border-color-subtle)]"]}]}),s={trigger:e,portal:a,portalContent:t,arrow:o};export{s as default};
+import{cva as r}from"@nild/shared";const e=r(["nd-popup-trigger"]),a=r(["nd-popup-portal",["absolute","top-0","left-0"]]),t=r(["rounded-md","shadow-lg"],{variants:{size:{small:["px-2","py-1"],medium:["px-4","py-3"],large:["px-6","py-5"]},inverse:{true:["bg-page-inverse","text-main-inverse"],false:["bg-panel","text-main"]}}}),o=r(["nd-popup-arrow","absolute"],{variants:{size:{small:["w-1.5","h-1.5"],medium:["w-3","h-3"],large:["w-4.5","h-4.5"]},arrowed:{true:"",false:["opacity-0","invisible"]},inverse:{true:["bg-page-inverse"],false:["bg-panel"]},orientation:{up:["transform-[translateY(-50%)_rotate(45deg)]","rounded-tl-sm"],down:["transform-[translateY(50%)_rotate(45deg)]","rounded-br-sm"],left:["transform-[translateX(-50%)_rotate(45deg)]","rounded-bl-sm"],right:["transform-[translateX(50%)_rotate(45deg)]","rounded-tr-sm"]}},compoundVariants:[{orientation:"up",className:["shadow-[-1px_-1px_0_0_var(--border-color-muted)]"]},{orientation:"down",className:["shadow-[1px_1px_0_0_var(--border-color-muted)]"]},{orientation:"left",className:["shadow-[-1px_1px_0_0_var(--border-color-muted)]"]},{orientation:"right",className:["shadow-[1px_-1px_0_0_var(--border-color-muted)]"]}]}),s={trigger:e,portal:a,portalContent:t,arrow:o};export{s as default};

package/dist/radio/Indicator.js

@@ -1 +1 @@
-import{jsxs as s,jsx as a}from"react/jsx-runtime";import{cnMerge as o}from"@nild/shared";import{forwardRef as u}from"react";import{useRadioContext as x}from"./contexts/index.js";import e from"./style/index.js";const t=u(({className:n,children:d,...l},m)=>{const{variant:r,size:f,checked:c,setChecked:p}=x(),h=d??(i=>s("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[a("circle",{cx:"10",cy:"10",className:o(e.defaultIndicatorOuterCircle({variant:r,checked:i}))}),a("circle",{cx:"10",cy:"10",className:e.defaultIndicatorInnerCircle({variant:r,checked:i})})]}));return s("div",{...l,className:o(e.indicator({size:f}),n),ref:m,children:[h(!!c),a("input",{type:"radio",className:e.indicatorInput(),checked:c,onChange:p})]})});t.displayName="Radio.Indicator";export{t as default};
+import{jsxs as t,jsx as a}from"react/jsx-runtime";import{cnMerge as d}from"@nild/shared";import{forwardRef as x}from"react";import{useRadioContext as g}from"./contexts/index.js";import e from"./style/index.js";const o=x(({className:n,children:c,...l},m)=>{const{variant:r,size:f,checked:i,disabled:p,setChecked:u}=g(),h=!c,v=c??(s=>t("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.defaultIndicatorSvg(),children:[a("circle",{cx:"10",cy:"10",className:d(e.defaultIndicatorOuterCircle({variant:r,checked:s}))}),a("circle",{cx:"10",cy:"10",className:e.defaultIndicatorInnerCircle({variant:r,checked:s})})]}));return t("div",{...l,className:d(e.indicator({size:f,default:h}),n),ref:m,children:[v(!!i),a("input",{type:"radio",className:e.indicatorInput(),checked:i,disabled:p,onChange:u})]})});o.displayName="Radio.Indicator";export{o as default};

package/dist/radio/Radio.js

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{useControllableState as N,useEffectCallback as R}from"@nild/hooks";import{isString as g,cnMerge as w}from"@nild/shared";import{forwardRef as x,Children as M,isValidElement as S,cloneElement as V}from"react";import{useGroupContext as j,RadioProvider as G}from"./contexts/index.js";import i from"./Indicator.js";import l from"./Label.js";import P from"./style/index.js";const c=x((p,u)=>{const t=[],s=new Map,a=j(),{className:f,children:h,variant:v=a?.variant??"solid",size:o=a?.size??"medium",disabled:d=a?.disabled??!1,checked:C,defaultChecked:b,value:n,onChange:m,...k}=p,[y,z]=N(a?a.value===n:C,b??!1),E=R(()=>{d||z(e=>e||(a?a.setValue(n):m?.(!e),!e))});return M.forEach(h,e=>{S(e)?e.type===i?(s.delete(i),s.set(i,e)):e.type===l&&(s.delete(l),s.set(l,e)):g(e)&&(s.has(l)||s.set(l,r(l,{children:e})))}),t.push(...s.values()),s.has(i)||t.unshift(r(i,{})),r(G,{value:{variant:v,size:o,checked:y,setChecked:E},children:r("label",{...k,className:w(P.radio({size:o,disabled:d}),f),ref:u,children:t.map(e=>V(e,{key:e.type.displayName,...e.props}))})})});c.displayName="Radio";export{c as default};
+import{jsx as t,jsxs as j}from"react/jsx-runtime";import{useControllableState as w,useEffectCallback as E}from"@nild/hooks";import{cnMerge as G}from"@nild/shared";import{forwardRef as P}from"react";import S from"../_shared/utils/register-slots/index.js";import{useGroupContext as V,RadioProvider as A}from"./contexts/index.js";import p from"./Indicator.js";import h from"./Label.js";import F from"./style/index.js";const I=S({indicator:{isMatched:a=>a.type===p},label:{isMatched:a=>a.type===h}}),v=P((a,b)=>{var d;const e=V(),{className:C,children:k,variant:x=e?.variant??"solid",size:n=e?.size??"medium",disabled:i=e?.disabled??!1,checked:z,defaultChecked:q,value:c,onChange:m,...y}=a,{slots:l,plainChildren:o}=I(k),[M,N]=w(e?e.value===c:z,q??!1),R=E(()=>{i||N(s=>s||(e?e.setValue(c):m?.(!s),!s))}),u=l.indicator.el??t(p,{}),r=l.label.el??(o.length>0?t(h,{children:o[0].content}):null),g=l.label.el?l.label.seq:((d=o[0])==null?void 0:d.seq)??-1,f=!!l.indicator.el&&!!r&&g<l.indicator.seq;return t(A,{value:{variant:x,size:n,checked:M,disabled:i,setChecked:R},children:j("label",{...y,className:G(F.radio({size:n,disabled:i}),C),ref:b,children:[f?r:u,f?u:r]})})});v.displayName="Radio";export{v as default};

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

@@ -1,7 +1,7 @@
 import { RadioProps, GroupProps } from '../interfaces';
-declare const RadioProvider: import('react').Provider<Pick<RadioProps, "variant" | "size" | "checked"> & {
+declare const RadioProvider: import('react').Provider<Pick<RadioProps, "variant" | "size" | "disabled" | "checked"> & {
     setChecked?: () => void;
-}>, useRadioContext: () => Pick<RadioProps, "variant" | "size" | "checked"> & {
+}>, useRadioContext: () => Pick<RadioProps, "variant" | "size" | "disabled" | "checked"> & {
     setChecked?: () => void;
 };
 declare const GroupProvider: import('react').Provider<(Pick<GroupProps<unknown>, "variant" | "size" | "disabled"> & {

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

@@ -1,8 +1,11 @@
 import { RadioProps, GroupProps } from '../interfaces';
 declare const _default: {
     radio: (props?: Pick<RadioProps, "size" | "disabled"> | undefined) => string;
-    indicator: (props?: Pick<RadioProps, "size"> | undefined) => string;
+    indicator: (props?: (Pick<RadioProps, "size"> & {
+        default?: boolean;
+    }) | undefined) => string;
     indicatorInput: (props?: object | undefined) => string;
+    defaultIndicatorSvg: (props?: object | undefined) => string;
     defaultIndicatorOuterCircle: (props?: Pick<RadioProps, "variant" | "checked"> | undefined) => string;
     defaultIndicatorInnerCircle: (props?: Pick<RadioProps, "variant" | "checked"> | undefined) => string;
     label: (props?: Pick<RadioProps, "size"> | undefined) => string;

package/dist/radio/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-radio","group",["flex","items-center"],"cursor-pointer",a],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),t=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"}}}),l=e([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),i=e(["stroke-1","r-9","transition-[stroke,fill]","group-enabled:group-hover:stroke-brand-hover"],{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-main"]}]}),o=e(["transition-[fill]"],{variants:{variant:{solid:"r-4.5",outlined:"r-5.5"}},compoundVariants:[{checked:!0,variant:"solid",className:["fill-brand-contrast"]},{checked:!0,variant:"outlined",className:["fill-brand","group-enabled:group-hover:fill-brand-hover"]},{checked:!1,className:["fill-transparent"]}]}),s=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),n=e(["nd-radio-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}}),d={radio:r,indicator:t,indicatorInput:l,defaultIndicatorOuterCircle:i,defaultIndicatorInnerCircle:o,label:s,group:n};export{d as default};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as a}from"../../_shared/style/index.js";const r=e(["nd-radio","group",["flex","items-center"],"cursor-pointer",a],{variants:{size:{small:"gap-1.5",medium:"gap-2",large:"gap-2.5"},disabled:{true:"disabled",false:""}}}),t=e(["nd-radio-indicator","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"},default:{true:["rounded-full","transition-[box-shadow]","group-enabled:focus-visible-within:ring-focused"],false:""}}}),i=e([["absolute","inset-0","opacity-0"],["group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"]]),l=e(["size-full"]),o=e(["stroke-1","r-9","transition-[stroke,fill]","group-enabled:group-hover:stroke-brand-hover"],{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-main"]}]}),n=e(["transition-[fill]"],{variants:{variant:{solid:"r-4.5",outlined:"r-5.5"}},compoundVariants:[{checked:!0,variant:"solid",className:["fill-brand-contrast"]},{checked:!0,variant:"outlined",className:["fill-brand","group-enabled:group-hover:fill-brand-hover"]},{checked:!1,className:["fill-transparent"]}]}),s=e(["text-sm"],{variants:{size:{small:"text-sm",medium:"text-md",large:"text-lg"}}}),d=e(["nd-radio-group",["flex","gap-x-4","gap-y-2"]],{variants:{direction:{horizontal:"flex-row flex-wrap",vertical:"flex-col"}}}),c={radio:r,indicator:t,indicatorInput:i,defaultIndicatorSvg:l,defaultIndicatorOuterCircle:o,defaultIndicatorInnerCircle:n,label:s,group:d};export{c as default};

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

package/dist/switch/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import{DISABLED_CLS as t}from"../../_shared/style/index.js";const a=e(["nd-switch","group","h-[var(--nd-switch-height)]","transition-[outline-color]",["relative","inline-block","font-nd","overflow-hidden","cursor-pointer"],t],{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-main","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-brand-contrast"]],{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-emphasized","group-enabled:group-hover:bg-emphasized-hover"]},{variant:"outlined",className:["bg-transparent"]}]}),r=e(["h-[var(--nd-switch-height)]",["flex","justify-center","items-center"],["absolute","aspect-square","scale-80"],["text-brand-contrast","transition-[left,background-color]"]],{variants:{variant:{solid:["bg-brand-contrast","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"}}}),c={switch:a,track:n,thumb:r};export{c as default};
+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"],"transition-[outline-color,box-shadow]",a],{variants:{variant:{solid:"focus-visible:ring-focused",outlined:["outline","focus-visible:ring-focused-with-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-main","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-brand-contrast"]],{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-emphasized","group-enabled:group-hover:bg-emphasized-hover"]},{variant:"outlined",className:["bg-transparent"]}]}),r=e(["h-[var(--nd-switch-height)]",["flex","justify-center","items-center"],["absolute","top-0","aspect-square","scale-80"],["text-brand-contrast","transition-[left,background-color]"]],{variants:{variant:{solid:["bg-brand-contrast"],outlined:["bg-emphasized","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"}},compoundVariants:[{variant:"outlined",checked:!0,className:["bg-brand"]}]}),c={switch:t,track:n,thumb:r};export{c as default};

package/dist/tailwind.css

@@ -1 +1 @@
-@theme static{ --nd-brand-h: 158; --nd-brand-c: .14; --nd-neutral-c: .001; --nd-shadow-l: 15%; --nd-shadow-c: .008; --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.5% 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(98% 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(96.5% 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(94% 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(91% 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(84% 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(73% 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(60% 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(40% 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(30% 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(20% 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)) ); --nd-color-shadow-key: light-dark( oklch(var(--nd-shadow-l) var(--nd-shadow-c) var(--nd-brand-h) / 16%), oklch(0% 0 0deg / 65%) ); --nd-color-shadow-ambient: light-dark( oklch(var(--nd-shadow-l) var(--nd-shadow-c) var(--nd-brand-h) / 4%), oklch(0% 0 0deg / 30%) ); --nd-font-family: -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"; }@theme{ --color-brand: var(--nd-color-brand-60); --color-brand-hover: var(--nd-color-brand-50); --color-brand-active: var(--nd-color-brand-60); --color-brand-subtle: var(--nd-color-brand-15); --color-brand-subtle-hover: var(--nd-color-brand-20); --color-brand-subtle-active: var(--nd-color-brand-30); --color-brand-contrast: light-dark(var(--nd-color-neutral-0), var(--nd-color-neutral-100)); --border-color-main: var(--nd-color-neutral-20); --border-color-muted: var(--nd-color-neutral-15); --border-color-subtle: var(--nd-color-neutral-10); --outline-color-main: var(--border-color-main); --outline-color-muted: var(--border-color-muted); --outline-color-subtle: var(--border-color-subtle); --background-color-page: var(--nd-color-neutral-0); --background-color-page-inverse: var(--nd-color-neutral-100); --background-color-subtle: var(--nd-color-neutral-5); --background-color-subtle-hover: var(--nd-color-neutral-10); --background-color-muted: var(--nd-color-neutral-10); --background-color-muted-hover: var(--nd-color-neutral-15); --background-color-muted-active: var(--nd-color-neutral-20); --background-color-emphasized: var(--nd-color-neutral-20); --background-color-emphasized-hover: var(--nd-color-neutral-30); --background-color-panel: light-dark( var(--background-color-page), var(--background-color-muted) ); --text-color-main: var(--nd-color-neutral-100); --text-color-main-inverse: var(--nd-color-neutral-0); --text-color-muted: var(--nd-color-neutral-70); --text-color-subtle: var(--nd-color-neutral-50); --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; --radius-xl: .5rem; --shadow-sm: 0 0 0 1px var(--border-color-subtle), 0 1px 2px 0 var(--nd-color-shadow-key); --shadow-md: 0 0 0 1px var(--border-color-subtle), 0 3px 6px -1px var(--nd-color-shadow-key), 0 1px 3px -1px var(--nd-color-shadow-ambient); --shadow-lg: 0 0 0 1px var(--border-color-subtle), 0 8px 16px -2px var(--nd-color-shadow-key), 0 3px 6px -2px var(--nd-color-shadow-ambient); --shadow-xl: 0 0 0 1px var(--border-color-subtle), 0 16px 24px -4px var(--nd-color-shadow-key), 0 6px 12px -4px var(--nd-color-shadow-ambient); --shadow-2xl: 0 0 0 1px var(--border-color-subtle), 0 24px 36px -6px var(--nd-color-shadow-key), 0 10px 16px -6px var(--nd-color-shadow-ambient); --font-nd: var(--nd-font-family); --default-transition-duration: .2s; }@utility stroke-main{stroke: var(--border-color-main);}@utility stroke-muted{stroke: var(--border-color-muted);}@utility stroke-subtle{stroke: var(--border-color-subtle);}@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: .001; --nd-shadow-l: 15%; --nd-shadow-c: .008; --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(95% var(--nd-brand-c) var(--nd-brand-h)), oklch(20% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-15: light-dark( oklch(92% var(--nd-brand-c) var(--nd-brand-h)), oklch(25% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-20: light-dark( oklch(88% var(--nd-brand-c) var(--nd-brand-h)), oklch(30% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-30: light-dark( oklch(80% var(--nd-brand-c) var(--nd-brand-h)), oklch(38% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-40: light-dark( oklch(72% var(--nd-brand-c) var(--nd-brand-h)), oklch(46% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-50: light-dark( oklch(64% var(--nd-brand-c) var(--nd-brand-h)), oklch(52% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-60: oklch(58% var(--nd-brand-c) var(--nd-brand-h)); --nd-color-brand-70: light-dark( oklch(50% var(--nd-brand-c) var(--nd-brand-h)), oklch(66% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-80: light-dark( oklch(40% var(--nd-brand-c) var(--nd-brand-h)), oklch(76% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-90: light-dark( oklch(30% var(--nd-brand-c) var(--nd-brand-h)), oklch(88% var(--nd-brand-c) var(--nd-brand-h)) ); --nd-color-brand-100: light-dark( oklch(20% var(--nd-brand-c) var(--nd-brand-h)), oklch(96% 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.5% 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(95.5% 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(92.5% 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(89% 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(81% 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(72% 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(60% 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(40% 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(32% 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(22% 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)) ); --nd-color-shadow-key: light-dark( oklch(var(--nd-shadow-l) var(--nd-shadow-c) var(--nd-brand-h) / 16%), oklch(0% 0 0deg / 65%) ); --nd-color-shadow-ambient: light-dark( oklch(var(--nd-shadow-l) var(--nd-shadow-c) var(--nd-brand-h) / 4%), oklch(0% 0 0deg / 30%) ); --nd-font-family: -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"; }@theme{ --color-brand: var(--nd-color-brand-60); --color-brand-hover: light-dark(var(--nd-color-brand-50), var(--nd-color-brand-70)); --color-brand-active: var(--nd-color-brand-60); --color-brand-subtle: var(--nd-color-brand-15); --color-brand-subtle-hover: var(--nd-color-brand-20); --color-brand-subtle-active: var(--nd-color-brand-30); --color-brand-contrast: light-dark(var(--nd-color-neutral-0), var(--nd-color-neutral-100)); --color-brand-ring: light-dark( color-mix(in oklch, var(--nd-color-brand-60) 28%, transparent), color-mix(in oklch, var(--nd-color-brand-60) 36%, transparent) ); --border-color-main: var(--nd-color-neutral-20); --border-color-muted: var(--nd-color-neutral-15); --border-color-subtle: var(--nd-color-neutral-10); --outline-color-main: var(--border-color-main); --outline-color-muted: var(--border-color-muted); --outline-color-subtle: var(--border-color-subtle); --background-color-page: var(--nd-color-neutral-0); --background-color-page-inverse: var(--nd-color-neutral-100); --background-color-subtle: var(--nd-color-neutral-5); --background-color-subtle-hover: var(--nd-color-neutral-10); --background-color-muted: var(--nd-color-neutral-10); --background-color-muted-hover: var(--nd-color-neutral-15); --background-color-muted-active: var(--nd-color-neutral-20); --background-color-emphasized: var(--nd-color-neutral-20); --background-color-emphasized-hover: var(--nd-color-neutral-30); --background-color-panel: light-dark( var(--background-color-page), var(--background-color-muted) ); --text-color-main: var(--nd-color-neutral-100); --text-color-main-inverse: var(--nd-color-neutral-0); --text-color-muted: var(--nd-color-neutral-70); --text-color-subtle: var(--nd-color-neutral-50); --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-xs: .125rem; --radius-sm: .25rem; --radius-md: .375rem; --radius-lg: .5rem; --radius-xl: .75rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --shadow-sm: 0 0 0 .8px var(--border-color-muted), 0 1px 2px 0 var(--nd-color-shadow-key); --shadow-md: 0 0 0 .8px var(--border-color-muted), 0 4px 6px -1px var(--nd-color-shadow-key), 0 2px 4px -2px var(--nd-color-shadow-ambient); --shadow-lg: 0 0 0 .8px var(--border-color-muted), 0 10px 15px -3px var(--nd-color-shadow-key), 0 4px 6px -4px var(--nd-color-shadow-ambient); --shadow-xl: 0 0 0 .8px var(--border-color-muted), 0 20px 25px -5px var(--nd-color-shadow-key), 0 8px 10px -6px var(--nd-color-shadow-ambient); --shadow-2xl: 0 0 0 .8px var(--border-color-muted), 0 25px 50px -12px var(--nd-color-shadow-key), 0 12px 24px -12px var(--nd-color-shadow-ambient); --font-nd: var(--nd-font-family); --default-transition-duration: .2s; }@utility stroke-main{stroke: var(--border-color-main);}@utility stroke-muted{stroke: var(--border-color-muted);}@utility stroke-subtle{stroke: var(--border-color-subtle);}@utility underline{text-decoration: underline; text-underline-offset: .125rem;}@utility ring-focused{outline: none; box-shadow: 0 0 0 .2rem var(--color-brand-ring),var(--tw-shadow, 0 0 #00000000);}@utility ring-focused-with-outline{box-shadow: 0 0 0 .2rem var(--color-brand-ring),var(--tw-shadow, 0 0 #00000000);}@utility r-*{r: --value(number);}@custom-variant focus-visible-within{&:has(:focus-visible) {@slot;}}@custom-variant disabled{&.disabled,&:disabled {@slot;}}@custom-variant enabled{&:not(.disabled,:disabled) {@slot;}}

package/dist/transition/Transition.js

@@ -1 +1 @@
-import{useEffectCallback as N}from"@nild/hooks";import{cnMerge as R}from"@nild/shared";import{Children as X,isValidElement as M,useState as O,useRef as m,useEffect as D,cloneElement as b}from"react";import{Status as r}from"./interfaces/index.js";import G from"./style/index.js";const I=({className:U,children:f,visible:i=!0})=>{const s=X.toArray(f).find(o=>M(o)),a=s?i?r.ENTERED:r.EXITED:r.UNMOUNTED,[t,E]=O(a),e=m(),n=m(s);n.current=t===r.UNMOUNTED?s:s??n.current;const c=N(o=>{u();let T=!0;const l=()=>{T&&(T=!1,e.current=void 0,o?.())};l.cancel=()=>{T=!1},e.current=l}),d=N(()=>{e.current&&(e.current(),e.current=void 0)}),u=N(()=>{e.current&&(e.current.cancel(),e.current=void 0)}),p=N(()=>{a===r.UNMOUNTED&&t===r.EXITED&&E(r.UNMOUNTED)});return D(()=>{d()},[t]),D(()=>{switch(a){case r.ENTERED:t!==r.ENTERING&&t!==r.ENTERED&&(t===r.UNMOUNTED?E(r.EXITED):(u(),E(r.ENTERING),c(()=>{c(()=>{E(r.ENTERED)}),e.current&&setTimeout(e.current,0)})));break;case r.EXITED:(t===r.ENTERING||t===r.ENTERED)&&(u(),E(r.EXITING),c(()=>{c(()=>{E(r.EXITED)}),e.current&&setTimeout(e.current,0)}));break;case r.UNMOUNTED:default:t!==r.EXITED&&t!==r.UNMOUNTED&&(u(),E(r.EXITING),c(()=>{c(()=>{E(r.EXITED)}),e.current&&setTimeout(e.current,0)}));break}},[i,a,t]),n.current?b(n.current,{...n.current.props,className:R(n.current.props.className,G.transition({status:t}),U),onTransitionEnd:p}):null};I.displayName="Transition";export{I as default};
+import{cnMerge as M,isFunction as I}from"@nild/shared";import{useState as O,useRef as U,useEffect as f,cloneElement as G,Children as v,isValidElement as g}from"react";import h from"../_shared/utils/merge-handlers/index.js";import{TransitionStatus as r}from"./interfaces/index.js";import S from"./style/index.js";const d=(e,s)=>{const c=I(e)?e(s):e;return v.toArray(c).find(t=>g(t))},R=({className:e,children:s,visible:c=!0})=>{const[t,N]=O(()=>{const n=c?r.ENTERED:r.EXITED;return d(s,n)?n:r.UNMOUNTED}),i=d(s,t),T=i?c?r.ENTERED:r.EXITED:r.UNMOUNTED,E=U(),u=U(i);u.current=t===r.UNMOUNTED?i:i??u.current;const l=()=>{var n;(n=E.current)==null||n.cancel(),E.current=void 0},m=n=>{l();let o=!0;const p=()=>{o&&(o=!1,E.current=void 0,n())};p.cancel=()=>{o=!1},E.current=p},D=(n,o)=>{l(),N(n),m(()=>{m(()=>{N(o)}),E.current&&setTimeout(E.current,0)})},X=n=>{n&&n.target!==n.currentTarget||T===r.UNMOUNTED&&t===r.EXITED&&N(r.UNMOUNTED)};if(f(()=>{E.current&&(E.current(),E.current=void 0)},[t]),f(()=>{if(T===r.ENTERED){t===r.UNMOUNTED?N(r.EXITED):t!==r.ENTERING&&t!==r.ENTERED&&D(r.ENTERING,r.ENTERED);return}if(T===r.EXITED){(t===r.ENTERING||t===r.ENTERED)&&D(r.EXITING,r.EXITED);return}t!==r.EXITED&&t!==r.UNMOUNTED&&D(r.EXITING,r.EXITED)},[T,t]),!u.current)return null;const a=u.current;return G(a,{...a.props,className:I(s)?a.props.className:M(a.props.className,S.transition({status:t}),e),onTransitionEnd:h(a.props.onTransitionEnd,X)})};R.displayName="Transition";export{R as default};

package/dist/transition/index.d.ts

@@ -1,3 +1,3 @@
 import { default as Transition } from './Transition';
-export type * from './interfaces';
+export * from './interfaces';
 export default Transition;

package/dist/transition/interfaces/index.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare enum Status {
+export declare enum TransitionStatus {
     UNMOUNTED = "unmounted",
     ENTERING = "entering",
     ENTERED = "entered",
@@ -8,6 +8,6 @@ export declare enum Status {
 }
 export interface TransitionProps {
     className?: string;
-    children?: ReactNode;
+    children?: ReactNode | ((status: TransitionStatus) => ReactNode);
     visible?: boolean;
 }

package/dist/transition/interfaces/index.js

@@ -1 +1 @@
-var t=(E=>(E.UNMOUNTED="unmounted",E.ENTERING="entering",E.ENTERED="entered",E.EXITING="exiting",E.EXITED="exited",E))(t||{});export{t as Status};
+var t=(E=>(E.UNMOUNTED="unmounted",E.ENTERING="entering",E.ENTERED="entered",E.EXITING="exiting",E.EXITED="exited",E))(t||{});export{t as TransitionStatus};

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

@@ -1,7 +1,7 @@
-import { Status } from '../interfaces';
+import { TransitionStatus } from '../interfaces';
 declare const _default: {
     transition: (props?: {
-        status: Status;
+        status: TransitionStatus;
     } | undefined) => string;
 };
 export default _default;

package/dist/transition/style/index.js

@@ -1 +1 @@
-import{cva as a}from"@nild/shared";import{Status as t}from"../interfaces/index.js";const i=a(["transition-[opacity,visibility]"],{compoundVariants:[{status:t.ENTERED,className:["opacity-100","visible"]},{status:[t.UNMOUNTED,t.ENTERING,t.EXITING,t.EXITED],className:["opacity-0","invisible"]}]}),s={transition:i};export{s as default};
+import{cva as t}from"@nild/shared";import{TransitionStatus as i}from"../interfaces/index.js";const a=t(["transition-[opacity,visibility]"],{compoundVariants:[{status:i.ENTERED,className:["opacity-100","visible"]},{status:[i.UNMOUNTED,i.ENTERING,i.EXITING,i.EXITED],className:["opacity-0","invisible"]}]}),s={transition:a};export{s as default};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nild/components",
   "private": false,
-  "version": "0.0.37",
+  "version": "0.0.39",
   "type": "module",
   "module": "./dist/index.js",
   "exports": {