@nild/components 0.0.13 → 0.0.15

package/dist/_shared/hooks/usePopup.js

@@ -1 +1 @@
-import{jsx as E}from"react/jsx-runtime";import{computePosition as B,offset as F,shift as G,flip as H,arrow as J,autoUpdate as K}from"../../_lib/floating-ui.dom.js";import{useControllableState as N,usePureCallback as P,useEffectCallback as Q,useIsomorphicLayoutEffect as k}from"@nild/hooks";import{getDPR as W,roundByDPR as f}from"@nild/shared/utils";import{useRef as x,useState as p,useMemo as X,Children as Y,isValidElement as h,cloneElement as O}from"react";import"../../portal/Arrow.js";import S from"../../portal/Portal.js";import Z from"../../transition/Transition.js";import g from"../../trigger/Trigger.js";const _=(j,{placement:m="bottom",strategy:b="absolute",offset:w=12,open:I,defaultOpen:C=!1}={})=>{const t=x(null),a=x(null),c=x(null),[n,L]=p(C),[r,M]=N(I,C),[s,R]=p({x:0,y:0}),[l,T]=p({x:0,y:0}),[o,U]=p(m.split("-")[0]),V=X(()=>{const e=o==="top"||o==="bottom";return{[o==="left"?"right":"left"]:e?l.x:l.x-s.x,[o==="top"?"bottom":"top"]:e?l.y-s.y:l.y}},[o,l,s]),$={top:"down",bottom:"up",left:"right",right:"left"}[o];let y,d,i;Y.forEach(j,e=>{h(e)&&e.type!==g&&e.type!==S&&(y=e),h(e)&&e.type===g&&(d=e),h(e)&&e.type===S&&(i=e)});const q=P(e=>{if(d)return O(d,{...e,ref:t});if(y)return E(g,{...e,ref:t,children:y})}),z=P(e=>{if(i)return E(Z,{visible:r,children:n&&O(i,{...i.props,...e,style:{transform:`translate(${s.x}px, ${s.y}px)`,...W()>=1.5&&{willChange:"transform"}},ref:a,arrow:{ref:c,style:V,orientation:$}})})}),v=Q(()=>{!t.current||!a.current||B(t.current,a.current,{placement:m,strategy:b,middleware:[F(w),G(),H(),c.current&&J({element:c.current})]}).then(({x:e,y:D,placement:A,middlewareData:{arrow:u}})=>{R({x:f(e),y:f(D)}),U(A.split("-")[0]),T({x:f(u?.x??e),y:f(u?.y??D)})})});return k(()=>{r&&!n?L(!0):r&&n&&v()},[r,n]),k(()=>{if(!(!t.current||!a.current||!r))return K(t.current,a.current,v)},[m,b,w,r]),[r,{setOpen:M,renderTrigger:q,renderPortal:z}]};export{_ as default};
+import{jsx as k}from"react/jsx-runtime";import{computePosition as H,offset as J,shift as K,flip as M,arrow as N,autoUpdate as Q}from"../../_lib/floating-ui.dom.js";import{useControllableState as W,usePureCallback as O,useEffectCallback as X,useIsomorphicLayoutEffect as S}from"@nild/hooks";import{getDPR as Y,roundByDPR as p}from"@nild/shared/utils";import{useRef as x,useState as u,Children as Z,isValidElement as h,cloneElement as $}from"react";import"../../portal/Arrow.js";import D from"../../portal/Portal.js";import q from"../../transition/Transition.js";import g from"../../trigger/Trigger.js";const _=(I,{placement:m="bottom",strategy:b="absolute",offset:w=12,open:L,defaultOpen:C=!1}={})=>{const t=x(null),o=x(null),c=x(null),[l,R]=u(C),[r,T]=W(L,C),[n,U]=u({x:0,y:0}),[s,V]=u({x:0,y:0}),[a,j]=u(m.split("-")[0]),E=a==="top"||a==="bottom",z={[a==="left"?"right":"left"]:E?s.x:s.x-n.x,[a==="top"?"bottom":"top"]:E?s.y-n.y:s.y},A={top:"down",bottom:"up",left:"right",right:"left"}[a];let y,d,i;Z.forEach(I,e=>{h(e)&&e.type!==g&&e.type!==D&&(y=e),h(e)&&e.type===g&&(d=e),h(e)&&e.type===D&&(i=e)});const B=O(e=>{if(d)return $(d,{...e,ref:t});if(y)return k(g,{...e,ref:t,children:y})}),F=O(e=>{if(i)return k(q,{visible:r,children:l&&$(i,{...i.props,...e,style:{transform:`translate(${n.x}px, ${n.y}px)`,...Y()>=1.5&&{willChange:"transform"}},ref:o,arrow:{ref:c,style:z,orientation:A}})})}),v=X(()=>{!t.current||!o.current||H(t.current,o.current,{placement:m,strategy:b,middleware:[J(w),K(),M(),c.current&&N({element:c.current})]}).then(({x:e,y:P,placement:G,middlewareData:{arrow:f}})=>{U({x:p(e),y:p(P)}),j(G.split("-")[0]),V({x:p(f?.x??e),y:p(f?.y??P)})})});return S(()=>{r&&!l?R(!0):r&&l&&v()},[r,l]),S(()=>{if(!(!t.current||!o.current||!r))return Q(t.current,o.current,v)},[m,b,w,r]),[r,{setOpen:T,renderTrigger:B,renderPortal:F}]};export{_ as default};

package/dist/button/Button.d.ts

@@ -1,22 +1,10 @@
-import { ReactElement, ButtonHTMLAttributes, HTMLAttributes, RefAttributes, ForwardRefExoticComponent } from 'react';
-import { ButtonVariant, ButtonSize, ButtonShape, GroupDirection } from './style';
-export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: ButtonVariant;
-    size?: ButtonSize;
-    shape?: ButtonShape;
-    equal?: boolean;
-    disabled?: boolean;
-    block?: boolean;
-}
+import { RefAttributes, ForwardRefExoticComponent } from 'react';
+import { ButtonProps, ButtonGroupProps } from './interfaces';
 /**
  * @category Components
  */
 declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>> & {
     Group: typeof Group;
 };
-export interface GroupProps extends HTMLAttributes<HTMLDivElement>, Pick<ButtonProps, 'variant' | 'size' | 'disabled'> {
-    children?: ReactElement<ButtonProps> | ReactElement<ButtonProps>[];
-    direction?: GroupDirection;
-}
-declare const Group: ForwardRefExoticComponent<GroupProps & RefAttributes<HTMLDivElement>>;
+declare const Group: ForwardRefExoticComponent<ButtonGroupProps & RefAttributes<HTMLDivElement>>;
 export default Button;

package/dist/button/Button.js

@@ -1 +1 @@
-import{jsx as c}from"react/jsx-runtime";import{cnMerge as _,isEmpty as h,cnJoin as L}from"@nild/shared";import{forwardRef as A,Children as P,isValidElement as C}from"react";import{DISABLED_CLS as M}from"../_shared/style/index.js";import N from"../_shared/utils/isPlainChildren.js";import{VARIANT_CLS_MAP as E,SIZE_CLS_MAP as R,SHAPE_CLS_MAP as y,EQUAL_CLS_MAP as I,GROUP_FIRST_CLS_MAP as g,GROUP_LAST_CLS_MAP as z,GROUP_DIVIDER_CLS_MAP as G}from"./style/index.js";const t=A(({className:r,children:l,variant:s="solid",size:n="medium",shape:d="square",equal:e=!1,disabled:p,block:f,...a},m)=>{const o=N(l);return c("button",{type:"button",...a,disabled:p,className:_("nd-button","font-nd cursor-pointer transition-colors",M,f&&"w-full",o&&"whitespace-nowrap truncate",E[s],R[n][`${o}`],y[d],e&&I[n],r),ref:m,children:l})});t.displayName="Button";const S=r=>C(r)&&r.type===t,b=A(({className:r,children:l,variant:s="solid",size:n="medium",disabled:d,direction:e="horizontal",...p},f)=>{const a=P.toArray(l);if(!a||h(a))return null;if(a.length===1){const[u]=a;return S(u)?c(t,{...u.props,variant:s,size:n,disabled:d}):null}const m=e==="horizontal",o=a.filter(S);return c("div",{...p,className:_("nd-button-group","flex",!m&&"flex-col",r),ref:f,children:o.map((u,i)=>c(t,{...u.props,className:L(i===0?g[e]:i===o.length-1?z[e]:"rounded-none",i!==0&&(m?"border-l-0":"border-t-0"),i!==o.length-1&&G[e][s]),variant:s,size:n,disabled:d},i))})});b.displayName="Button.Group",t.Group=b;export{t as default};
+import{jsx as p}from"react/jsx-runtime";import{cnMerge as f,isEmpty as v}from"@nild/shared";import{forwardRef as b,Children as y,isValidElement as g}from"react";import z from"../_shared/utils/isPlainChildren.js";import{buttonClassNames as C,groupButtonClassNames as B,groupClassNames as q}from"./style/index.js";const i=b(({className:s,children:r,variant:t="solid",size:o="medium",shape:l="square",equal:n=!1,disabled:d,block:u,...a},m)=>{const e=z(r);return p("button",{type:"button",...a,disabled:d,className:f(C({variant:t,size:o,shape:l,equal:n,plain:e,block:u,disabled:d}),s),ref:m,children:r})});i.displayName="Button";const h=s=>g(s)&&s.type===i,N=b(({className:s,children:r,variant:t="solid",size:o="medium",disabled:l,direction:n="horizontal",...d},u)=>{const a=y.toArray(r);if(!a||v(a))return null;if(a.length===1){const[e]=a;return h(e)?p(i,{...e.props,variant:t,size:o,disabled:l}):null}const m=a.filter(h);return p("div",{...d,className:f(q({direction:n}),s),ref:u,children:m.map((e,c)=>p(i,{...e.props,className:B({first:c===0,last:c===m.length-1,direction:n,variant:t}),variant:t,size:o,disabled:l},c))})});N.displayName="Button.Group",i.Group=N;export{i as default};

package/dist/button/index.d.ts

@@ -1,4 +1,3 @@
-import { default as Button, ButtonProps, GroupProps } from './Button';
-import { ButtonVariant, ButtonShape, ButtonSize, GroupDirection } from './style';
-export type { ButtonProps, ButtonVariant, ButtonShape, ButtonSize, GroupProps, GroupDirection };
+import { default as Button } from './Button';
+export type * from './interfaces';
 export default Button;

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

@@ -1,11 +1,9 @@
-export type ButtonVariant = 'solid' | 'outlined' | 'filled' | 'text';
-export declare const VARIANT_CLS_MAP: Record<ButtonVariant, string[]>;
-export type ButtonShape = 'round' | 'square';
-export declare const SHAPE_CLS_MAP: Record<ButtonShape, string[]>;
-export type ButtonSize = 'small' | 'medium' | 'large';
-export declare const SIZE_CLS_MAP: Record<ButtonSize, Record<'true' | 'false', string[]>>;
-export declare const EQUAL_CLS_MAP: Record<ButtonSize, string[]>;
-export type GroupDirection = 'horizontal' | 'vertical';
-export declare const GROUP_FIRST_CLS_MAP: Record<GroupDirection, string[]>;
-export declare const GROUP_LAST_CLS_MAP: Record<GroupDirection, string[]>;
-export declare const GROUP_DIVIDER_CLS_MAP: Record<GroupDirection, Record<ButtonVariant, string[]>>;
+import { ButtonProps, ButtonGroupProps } from '../interfaces';
+export declare const buttonClassNames: (props: ButtonProps & {
+    plain?: boolean;
+}) => string;
+export declare const groupClassNames: (props: ButtonGroupProps) => string;
+export declare const groupButtonClassNames: (props: ButtonGroupProps & {
+    first?: boolean;
+    last?: boolean;
+}) => string;

package/dist/button/style/index.js

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

package/dist/checkbox/Checkbox.d.ts

@@ -1,6 +1,7 @@
 import { HTMLAttributes, ForwardRefExoticComponent, RefAttributes, ChangeEventHandler } from 'react';
-import { CheckboxSize } from './style';
+import { CheckboxVariant, CheckboxSize } from './style';
 export interface CheckboxProps extends Omit<HTMLAttributes<HTMLLabelElement>, 'onChange' | 'defaultValue'> {
+    variant?: CheckboxVariant;
     size?: CheckboxSize;
     checked?: boolean;
     defaultChecked?: boolean;

package/dist/checkbox/Checkbox.js

@@ -1 +1 @@
-import{jsx as o,jsxs as j}from"react/jsx-runtime";import{useControllableState as A,useEffectCallback as M,usePureCallback as x}from"@nild/hooks";import{Icon as D}from"@nild/icons";import P from"@nild/icons/CheckSmall";import{cnJoin as d,isString as y,cnMerge as E}from"@nild/shared";import{forwardRef as b,Children as R,isValidElement as B,cloneElement as I}from"react";import{DISABLED_CLS as H}from"../_shared/style/index.js";import{SIZE_CLS_MAP as t,INDICATOR_CHECKED_CLS_MAP as J}from"./style/index.js";const m=b(({className:n,children:l,size:a="medium",checked:p,defaultChecked:h,value:u,defaultValue:L,indeterminate:K,disabled:C,onChange:N,...S},v)=>{const i=[],s=new Map,[f,w]=A(p??u,h??L??!1),k=M(()=>{C||w(e=>(N?.(!e),!e))}),_=x(()=>o(c,{className:t[a].indicator,checked:f,onChange:k,children:o("div",{className:d("flex items-center justify-center","w-full h-full rounded-sm border-solid border-1 border-primary","transition-[background-color,color]",J[`${f}`]),children:o(D,{component:P})})})),g=x(e=>o(r,{className:t[a].label,children:e}));return R.forEach(l,e=>{B(e)?e.type===c?(s.delete(c),s.set(c,I(e,{...e.props,className:d(t[a].indicator,e.props.className),checked:f,onChange:k}))):e.type===r&&(s.delete(r),s.set(r,I(e,{...e.props,className:d(t[a].label,e.props.className)}))):y(e)&&(s.has(r)||s.set(r,g(e)))}),i.push(...s.values()),s.has(c)||i.unshift(_()),!s.has(r)&&y(l)&&i.push(g(l)),o("label",{...S,className:E("nd-checkbox","group","flex items-center","cursor-pointer",t[a].wrapper,H,C&&"disabled",n),ref:v,children:i})}),c=b(({className:n,children:l,checked:a,onChange:p,...h},u)=>j("div",{...h,className:E("relative","flex items-center justify-center",n),ref:u,children:[l,o("input",{type:"checkbox",className:d("absolute inset-0 opacity-0","group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"),checked:a,onChange:p})]}));c.displayName="Checkbox.Indicator";const r=b(({children:n,...l},a)=>o("span",{...l,ref:a,children:n}));r.displayName="Checkbox.Label",m.Indicator=c,m.Label=r,m.displayName="Checkbox";export{m as default};
+import{jsx as o,jsxs as w}from"react/jsx-runtime";import{useControllableState as M,useEffectCallback as D,usePureCallback as g}from"@nild/hooks";import{Icon as P}from"@nild/icons";import R from"@nild/icons/CheckSmall";import{cnJoin as m,isString as y,cnMerge as I}from"@nild/shared";import{forwardRef as b,Children as V,isValidElement as T,cloneElement as S}from"react";import{DISABLED_CLS as B}from"../_shared/style/index.js";import{SIZE_CLS_MAP as t,INDICATOR_VARIANT_CLS_MAP as J}from"./style/index.js";const p=b(({className:n,children:r,variant:i="solid",size:l="medium",checked:h,defaultChecked:u,value:v,defaultValue:L,indeterminate:O,disabled:N,onChange:C,...A},E)=>{const d=[],a=new Map,[f,_]=M(h??v,u??L??!1),k=D(()=>{N||_(e=>(C?.(!e),!e))}),j=g(()=>o(c,{className:t[l].indicator,checked:f,onChange:k,children:o("div",{className:m("flex items-center justify-center","w-full h-full rounded-sm border-solid border-1 border-primary","transition-[background-color,color]",J[i][`${f}`]),children:o(P,{className:"mr-[0.25px]",component:R})})})),x=g(e=>o(s,{className:t[l].label,children:e}));return V.forEach(r,e=>{T(e)?e.type===c?(a.delete(c),a.set(c,S(e,{...e.props,className:m(t[l].indicator,e.props.className),checked:f,onChange:k}))):e.type===s&&(a.delete(s),a.set(s,S(e,{...e.props,className:m(t[l].label,e.props.className)}))):y(e)&&(a.has(s)||a.set(s,x(e)))}),d.push(...a.values()),a.has(c)||d.unshift(j()),!a.has(s)&&y(r)&&d.push(x(r)),o("label",{...A,className:I("nd-checkbox","group","flex items-center","cursor-pointer",t[l].root,B,N&&"disabled",n),ref:E,children:d})}),c=b(({className:n,children:r,checked:i,onChange:l,...h},u)=>w("div",{...h,className:I("relative","flex items-center justify-center",n),ref:u,children:[r,o("input",{type:"checkbox",className:m("absolute inset-0 opacity-0","group-enabled:cursor-pointer","group-disabled:cursor-not-allowed"),checked:i,onChange:l})]}));c.displayName="Checkbox.Indicator";const s=b(({children:n,...r},i)=>o("span",{...r,ref:i,children:n}));s.displayName="Checkbox.Label",p.Indicator=c,p.Label=s,p.displayName="Checkbox";export{p as default};

package/dist/checkbox/index.d.ts

@@ -1,3 +1,4 @@
 import { default as Checkbox, CheckboxProps } from './Checkbox';
-export type { CheckboxProps };
+import { CheckboxVariant, CheckboxSize } from './style';
+export type { CheckboxProps, CheckboxVariant, CheckboxSize };
 export default Checkbox;

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

@@ -1,6 +1,4 @@
+export type CheckboxVariant = 'solid' | 'outlined';
+export declare const INDICATOR_VARIANT_CLS_MAP: Record<CheckboxVariant, Record<'true' | 'false', string[]>>;
 export type CheckboxSize = 'small' | 'medium' | 'large';
-export declare const SIZE_CLS_MAP: Record<CheckboxSize, Record<'wrapper' | 'indicator' | 'label', string>>;
-export declare const INDICATOR_CHECKED_CLS_MAP: {
-    readonly true: readonly ["bg-primary text-contrast", "group-enabled:group-hover:bg-primary-hover"];
-    readonly false: readonly ["bg-transparent text-transparent", "group-enabled:group-hover:bg-tertiary-hover"];
-};
+export declare const SIZE_CLS_MAP: Record<CheckboxSize, Record<'root' | 'indicator' | 'label', string>>;

package/dist/checkbox/style/index.js

@@ -1 +1 @@
-const r={small:{wrapper:"gap-1.5",indicator:"w-3.5 h-3.5 text-sm",label:"text-sm"},medium:{wrapper:"gap-2",indicator:"w-4 h-4 text-md",label:"text-md"},large:{wrapper:"gap-2.5",indicator:"w-4.5 h-4.5 text-lg",label:"text-lg"}},t={true:["bg-primary text-contrast","group-enabled:group-hover:bg-primary-hover"],false:["bg-transparent text-transparent","group-enabled:group-hover:bg-tertiary-hover"]};export{t as INDICATOR_CHECKED_CLS_MAP,r as SIZE_CLS_MAP};
+const r={solid:{true:["bg-primary text-contrast","group-enabled:group-hover:bg-primary-hover"],false:["bg-transparent text-transparent","group-enabled:group-hover:bg-tertiary-hover"]},outlined:{true:["bg-transparent text-primary","group-enabled:group-hover:bg-tertiary-hover"],false:["bg-transparent text-transparent","group-enabled:group-hover:bg-tertiary-hover"]}},t={small:{root:"gap-1.5",indicator:"w-3.5 h-3.5 text-sm",label:"text-sm"},medium:{root:"gap-2",indicator:"w-4 h-4 text-md",label:"text-md"},large:{root:"gap-2.5",indicator:"w-4.5 h-4.5 text-xl",label:"text-lg"}};export{r as INDICATOR_VARIANT_CLS_MAP,t as SIZE_CLS_MAP};

package/dist/switch/style/index.js

@@ -1 +1 @@
-const r={solid:[""],outlined:["border-solid border border-primary"]},a={solid:{true:["bg-primary","group-enabled:group-hover:bg-primary-hover"],false:["bg-[--alpha(var(--color-primary)/40%)]","group-enabled:group-hover:bg-[--alpha(var(--color-primary)/50%)]"]},outlined:{true:["bg-transparent"],false:["bg-transparent"]}},e={solid:["bg-contrast","top-0"],outlined:["bg-primary","group-enabled:group-hover:bg-primary-hover","-top-[1px]"]},o={small:"calc(var(--spacing) * 4)",medium:"calc(var(--spacing) * 6)",large:"calc(var(--spacing) * 8)"},l={small:["min-w-8","text-sm"],medium:["min-w-10","text-md"],large:["min-w-12","text-lg"]},p={round:["rounded-full"],square:["rounded-md"]};export{p as SHAPE_CLS_MAP,l as SIZE_CLS_MAP,o as SIZE_VAR_MAP,r as VARIANT_CLS_MAP,e as VARIANT_THUMB_CLS_MAP,a as VARIANT_TRACK_CLS_MAP};
+const r={solid:[""],outlined:["border-solid border border-primary"]},a={solid:{true:["bg-primary","group-enabled:group-hover:bg-primary-hover"],false:["bg-[--alpha(var(--color-primary)/40%)]","group-enabled:group-hover:bg-[--alpha(var(--color-primary)/50%)]"]},outlined:{true:["bg-transparent","group-enabled:group-hover:bg-tertiary-hover"],false:["bg-transparent","group-enabled:group-hover:bg-tertiary-hover"]}},e={solid:["bg-contrast","top-0"],outlined:["bg-primary","top-[50%] -translate-y-[50%]","group-enabled:group-hover:bg-primary-hover"]},o={small:"calc(var(--spacing) * 4)",medium:"calc(var(--spacing) * 6)",large:"calc(var(--spacing) * 8)"},l={small:["min-w-8","text-sm"],medium:["min-w-10","text-md"],large:["min-w-12","text-lg"]},t={round:["rounded-full"],square:["rounded-md"]};export{t as SHAPE_CLS_MAP,l as SIZE_CLS_MAP,o as SIZE_VAR_MAP,r as VARIANT_CLS_MAP,e as VARIANT_THUMB_CLS_MAP,a as VARIANT_TRACK_CLS_MAP};

package/dist/tailwind.css

@@ -1 +1 @@
-@theme static{ --nd-color-primary-0: light-dark(#fafafa, #171717); --nd-color-primary-5: light-dark(#f7f7f7, #1e1e1e); --nd-color-primary-10: light-dark(#f4f4f4, #242424); --nd-color-primary-15: light-dark(#ededed, #2c2c2c); --nd-color-primary-20: light-dark(#e5e5e5, #333333); --nd-color-primary-30: light-dark(#cecece, #434343); --nd-color-primary-40: light-dark(#aeaeae, #575757); --nd-color-primary-50: light-dark(#888888, #888888); --nd-color-primary-60: light-dark(#626262, #b9b9b9); --nd-color-primary-70: light-dark(#424242, #cdcdcd); --nd-color-primary-80: light-dark(#2b2b2b, #dedede); --nd-color-primary-90: light-dark(#1d1d1d, #ececec); --nd-color-primary-100: light-dark(#171717, #fafafa); }@theme{ --color-primary: var(--nd-color-primary-80); --color-primary-hover: var(--nd-color-primary-70); --color-primary-active: var(--nd-color-primary-90); --color-secondary: var(--nd-color-primary-20); --color-secondary-hover: var(--nd-color-primary-30); --color-secondary-active: var(--nd-color-primary-40); --color-tertiary: var(--nd-color-primary-15); --color-tertiary-hover: var(--nd-color-primary-20); --color-tertiary-active: var(--nd-color-primary-30); --color-contrast: var(--nd-color-primary-0); --color-split: var(--nd-color-primary-20); --color-edge: var(--nd-color-primary-30); --background-color-container: light-dark(var(--nd-color-primary-0), var(--nd-color-primary-5)); --text-color-primary: var(--nd-color-primary-100); --text-color-secondary: var(--nd-color-primary-60); --text-color-link: var(--color-primary); --text-color-link-hover: var(--color-primary-hover); --text-color-link-active: var(--color-primary-active); --text-sm: .75rem; --text-sm--line-height: 1.25rem; --text-md: .875rem; --text-md--line-height: 1.375rem; --text-lg: 1rem; --text-lg--line-height: 1.5rem; --text-xl: 1.25rem; --text-xl--line-height: 1.75rem; --text-2xl: 1.5rem; --text-2xl--line-height: 2rem; --text-3xl: 1.875rem; --text-3xl--line-height: 2.375rem; --text-4xl: 2.375rem; --text-4xl--line-height: 2.875rem; --text-5xl: 2.875rem; --text-5xl--line-height: 3.375rem; --radius-sm: .125rem; --radius-md: .25rem; --radius-lg: .375rem; --font-nd: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --default-transition-duration: .2s; }@utility underline{text-decoration: underline; text-underline-offset: .125rem;}@custom-variant disabled{&.disabled,&:disabled {@slot;}}@custom-variant enabled{&:not(.disabled,:disabled) {@slot;}}
+@theme static{ --nd-color-primary-0: light-dark(#fafafa, #171717); --nd-color-primary-5: light-dark(#f7f7f7, #1e1e1e); --nd-color-primary-10: light-dark(#f4f4f4, #242424); --nd-color-primary-15: light-dark(#ededed, #2c2c2c); --nd-color-primary-20: light-dark(#e5e5e5, #333333); --nd-color-primary-30: light-dark(#cecece, #434343); --nd-color-primary-40: light-dark(#aeaeae, #575757); --nd-color-primary-50: light-dark(#888888, #888888); --nd-color-primary-60: light-dark(#626262, #b9b9b9); --nd-color-primary-70: light-dark(#424242, #cdcdcd); --nd-color-primary-80: light-dark(#2b2b2b, #dedede); --nd-color-primary-90: light-dark(#1d1d1d, #ececec); --nd-color-primary-100: light-dark(#171717, #fafafa); }@theme{ --color-primary: var(--nd-color-primary-80); --color-primary-hover: var(--nd-color-primary-70); --color-primary-active: var(--nd-color-primary-90); --color-secondary: var(--nd-color-primary-20); --color-secondary-hover: var(--nd-color-primary-30); --color-secondary-active: var(--nd-color-primary-40); --color-tertiary: var(--nd-color-primary-15); --color-tertiary-hover: var(--nd-color-primary-20); --color-tertiary-active: var(--nd-color-primary-30); --color-contrast: var(--nd-color-primary-0); --color-split: var(--nd-color-primary-20); --color-edge: var(--nd-color-primary-30); --background-color-container: light-dark(var(--nd-color-primary-0), var(--nd-color-primary-5)); --text-color-primary: var(--nd-color-primary-100); --text-color-secondary: var(--nd-color-primary-60); --text-color-link: var(--color-primary); --text-color-link-hover: var(--color-primary-hover); --text-color-link-active: var(--color-primary-active); --text-sm: .75rem; --text-sm--line-height: 1.25rem; --text-md: .875rem; --text-md--line-height: 1.375rem; --text-lg: 1rem; --text-lg--line-height: 1.5rem; --text-xl: 1.125rem; --text-xl--line-height: 1.625rem; --text-2xl: 1.25rem; --text-2xl--line-height: 1.75rem; --text-3xl: 1.5rem; --text-3xl--line-height: 2rem; --text-4xl: 1.875rem; --text-4xl--line-height: 2.375rem; --text-5xl: 2.375rem; --text-5xl--line-height: 2.875rem; --text-6xl: 2.875rem; --text-6xl--line-height: 3.375rem; --radius-sm: .125rem; --radius-md: .25rem; --radius-lg: .375rem; --font-nd: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --default-transition-duration: .2s; }@utility underline{text-decoration: underline; text-underline-offset: .125rem;}@custom-variant disabled{&.disabled,&:disabled {@slot;}}@custom-variant enabled{&:not(.disabled,:disabled) {@slot;}}

package/dist/typography/style/index.js

@@ -1 +1 @@
-const t={1:["text-5xl"],2:["text-4xl"],3:["text-3xl"],4:["text-2xl"],5:["text-xl"],6:["text-lg"]};export{t as HEADING_LEVEL_CLS_MAP};
+const t={1:["text-6xl"],2:["text-5xl"],3:["text-4xl"],4:["text-3xl"],5:["text-2xl"],6:["text-lg"]};export{t as HEADING_LEVEL_CLS_MAP};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nild/components",
   "private": false,
-  "version": "0.0.13",
+  "version": "0.0.15",
   "type": "module",
   "module": "./dist/index.js",
   "exports": {
@@ -31,9 +31,9 @@
   "peerDependencies": {
     "react": ">=18.2.0",
     "react-dom": ">=18.2.0",
-    "@nild/shared": "0.0.7",
-    "@nild/icons": "0.0.8",
-    "@nild/hooks": "0.0.9"
+    "@nild/shared": "0.0.8",
+    "@nild/hooks": "0.0.10",
+    "@nild/icons": "0.0.9"
   },
   "scripts": {
     "build": "vite build --mode PROD",