@nild/components 0.0.16 → 0.0.18

package/dist/divider/Divider.d.ts

@@ -1,10 +1,4 @@
-import { HTMLAttributes } from 'react';
-import { DividerVariant, DividerDirection, DividerAlign } from './style';
-export interface DividerProps extends HTMLAttributes<HTMLDivElement> {
-    variant?: DividerVariant;
-    direction?: DividerDirection;
-    align?: DividerAlign;
-}
+import { DividerProps } from './interfaces';
 /**
  * @category Components
  */

package/dist/divider/Divider.js

@@ -1 +1 @@
-import{jsx as m}from"react/jsx-runtime";import{cnMerge as c,isEmpty as _}from"@nild/shared";import{forwardRef as p,Children as I}from"react";import{DIRECTION_WITH_CHILDREN_CLS_MAP as f,DIRECTION_WITHOUT_CHILDREN_CLS_MAP as C,ALIGN_CLS_MAP as N}from"./style/index.js";const s=p(({className:e,children:o,variant:a="solid",direction:r="horizontal",align:t="center",...n},d)=>{const l=r==="horizontal",i=I.toArray(o);return m("div",{...n,className:c("nd-divider","border-split","text-primary",l&&!_(i)?f[r][a].concat(N[t]):C[r][a],e),ref:d,children:i})});s.displayName="Divider";export{s as default};
+import{jsx as l}from"react/jsx-runtime";import{cnMerge as m,isEmpty as c}from"@nild/shared";import{forwardRef as f,Children as p}from"react";import{dividerClassNames as h}from"./style/index.js";const a=f(({className:i,children:e,variant:s="solid",direction:o="horizontal",align:t="center",...n},d)=>{const r=p.toArray(e);return l("div",{...n,className:m(h({emptyChildren:c(r),variant:s,direction:o,align:t}),i),ref:d,children:r})});a.displayName="Divider";export{a as default};

package/dist/divider/index.d.ts

@@ -1,4 +1,3 @@
-import { default as Divider, DividerProps } from './Divider';
-import { DividerVariant, DividerDirection, DividerAlign } from './style';
-export type { DividerProps, DividerVariant, DividerDirection, DividerAlign };
+import { default as Divider } from './Divider';
+export type * from './interfaces';
 export default Divider;

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

@@ -1,6 +1,4 @@
-export type DividerVariant = 'solid' | 'dashed' | 'dotted';
-export type DividerDirection = 'horizontal' | 'vertical';
-export declare const DIRECTION_WITHOUT_CHILDREN_CLS_MAP: Record<DividerDirection, Record<DividerVariant, string[]>>;
-export declare const DIRECTION_WITH_CHILDREN_CLS_MAP: Record<DividerDirection, Record<DividerVariant, string[]>>;
-export type DividerAlign = 'left' | 'center' | 'right';
-export declare const ALIGN_CLS_MAP: Record<DividerAlign, string[]>;
+import { DividerProps } from '../interfaces';
+export declare const dividerClassNames: (props?: (DividerProps & {
+    emptyChildren: boolean;
+}) | undefined) => string;

package/dist/divider/style/index.js

@@ -1 +1 @@
-const e=["w-full min-w-full","border-b","my-6"],r=["inline-block","h-[1em]","align-middle","border-r","ms-3 me-3"],d={horizontal:{solid:e.concat("border-solid"),dashed:e.concat("border-dashed"),dotted:e.concat("border-dotted")},vertical:{solid:r.concat("border-solid"),dashed:r.concat("border-dashed"),dotted:r.concat("border-dotted")}},o=["flex items-center text-center",'before:h-0 before:content-[""] before:border-b before:border-[color:inherit]','after:h-0 after:content-[""] after:border-b after:border-[color:inherit]',"my-6"],t={horizontal:{solid:o.concat(["before:border-solid","after:border-solid"]),dashed:o.concat(["before:border-dashed","after:border-dashed"]),dotted:o.concat(["before:border-dotted","after:border-dotted"])},vertical:{solid:[],dashed:[],dotted:[]}},a={left:["before:basis-1/12 before:grow-0","after:flex-1"],center:["before:flex-1","after:flex-1"],right:["before:flex-1","after:basis-1/12 after:grow-0"]};export{a as ALIGN_CLS_MAP,d as DIRECTION_WITHOUT_CHILDREN_CLS_MAP,t as DIRECTION_WITH_CHILDREN_CLS_MAP};
+import{cva as e}from"@nild/shared";const r=e(["nd-divider","border-split","text-primary"],{compoundVariants:[{emptyChildren:!0,direction:"horizontal",className:["w-full","min-w-full","border-b","my-6"]},{emptyChildren:!0,direction:"vertical",className:["inline-block","h-[1em]","align-middle","border-r","ms-3 me-3"]},{emptyChildren:!0,variant:"solid",className:["border-solid"]},{emptyChildren:!0,variant:"dashed",className:["border-dashed"]},{emptyChildren:!0,variant:"dotted",className:["border-dotted"]},{emptyChildren:!1,direction:"horizontal",className:["flex items-center text-center",'before:h-0 before:content-[""] before:border-b before:border-[color:inherit]','after:h-0 after:content-[""] after:border-b after:border-[color:inherit]',"my-6"]},{emptyChildren:!1,direction:"horizontal",variant:"solid",className:["before:border-solid","after:border-solid"]},{emptyChildren:!1,direction:"horizontal",variant:"dashed",className:["before:border-dashed","after:border-dashed"]},{emptyChildren:!1,direction:"horizontal",variant:"dotted",className:["before:border-dotted","after:border-dotted"]},{emptyChildren:!1,direction:"horizontal",align:"left",className:["before:basis-1/12","before:grow-0","after:flex-1"]},{emptyChildren:!1,direction:"horizontal",align:"center",className:["before:flex-1","after:flex-1"]},{emptyChildren:!1,direction:"horizontal",align:"right",className:["before:flex-1","after:basis-1/12","after:grow-0"]}]});export{r as dividerClassNames};

package/dist/switch/Switch.d.ts

@@ -1,16 +1,5 @@
-import { ForwardRefExoticComponent, ButtonHTMLAttributes, HTMLAttributes, RefAttributes } from 'react';
-import { SwitchVariant, SwitchSize, SwitchShape } from './style';
-export interface SwitchProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'defaultValue' | 'onChange'> {
-    variant?: SwitchVariant;
-    size?: SwitchSize;
-    shape?: SwitchShape;
-    checked?: boolean;
-    defaultChecked?: boolean;
-    value?: boolean;
-    defaultValue?: boolean;
-    disabled?: boolean;
-    onChange?: (checked: boolean) => void;
-}
+import { ForwardRefExoticComponent, HTMLAttributes, RefAttributes } from 'react';
+import { SwitchProps, SwitchVariant, SwitchShape } from './interfaces';
 /**
  * @category Components
  */
@@ -19,7 +8,20 @@ declare const Switch: ForwardRefExoticComponent<SwitchProps & RefAttributes<HTML
     Unchecked: typeof Unchecked;
     Thumb: typeof Thumb;
 };
-declare const Checked: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
-declare const Unchecked: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
-declare const Thumb: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+interface CheckedProps extends HTMLAttributes<HTMLDivElement> {
+    variant: SwitchVariant;
+    checked: boolean;
+}
+declare const Checked: ForwardRefExoticComponent<CheckedProps & RefAttributes<HTMLDivElement>>;
+interface UncheckedProps extends HTMLAttributes<HTMLDivElement> {
+    variant: SwitchVariant;
+    checked: boolean;
+}
+declare const Unchecked: ForwardRefExoticComponent<UncheckedProps & RefAttributes<HTMLDivElement>>;
+interface ThumbProps extends HTMLAttributes<HTMLDivElement> {
+    variant: SwitchVariant;
+    shape: SwitchShape;
+    checked: boolean;
+}
+declare const Thumb: ForwardRefExoticComponent<ThumbProps & RefAttributes<HTMLDivElement>>;
 export default Switch;

package/dist/switch/Switch.js

@@ -1 +1 @@
-import{jsxs as j,jsx as r}from"react/jsx-runtime";import{useControllableState as U}from"@nild/hooks";import{cnJoin as n,cnMerge as m}from"@nild/shared";import{forwardRef as p,Children as B,isValidElement as D,cloneElement as g}from"react";import{DISABLED_CLS as H}from"../_shared/style/index.js";import{VARIANT_TRACK_CLS_MAP as y,VARIANT_THUMB_CLS_MAP as Z,SHAPE_CLS_MAP as k,SIZE_VAR_MAP as $,VARIANT_CLS_MAP as q,SIZE_CLS_MAP as J}from"./style/index.js";const d=p(({className:t,children:c,variant:e="solid",size:a="medium",shape:w="round",checked:C,defaultChecked:b,value:x,defaultValue:M,disabled:E,onChange:v,style:I,...L},P)=>{let l,h,o;B.forEach(c,s=>{D(s)&&(s.type===f?l=s:s.type===u?h=s:s.type===N&&(o=s))});const R={"--nd-switch-height":$[a]},[i,T]=U(C??x,b??M??!1),A=n("h-[var(--nd-switch-height)]","ps-[calc(var(--nd-switch-height)/3)] pe-[calc(var(--nd-switch-height)*1.1)]",y[e][`${i}`].concat(i?"ms-0 me-0":"-ms-[100%] me-[100%]")),S=n("h-[var(--nd-switch-height)]","-mt-[var(--nd-switch-height)]","ps-[calc(var(--nd-switch-height)*1.1)] pe-[calc(var(--nd-switch-height)/3)]",y[e][`${i}`].concat(i?"ms-[100%] -me-[100%]":"ms-0 me-0")),_=n("h-[var(--nd-switch-height)]",Z[e],k[w],i?"left-[calc(100%-var(--nd-switch-height))]":"left-0"),V=()=>{T(s=>(v?.(!s),!s))};return j("button",{...L,type:"button",role:"switch","aria-checked":i,disabled:E,className:m("nd-switch","h-[var(--nd-switch-height)]","group","relative inline-block font-nd overflow-hidden cursor-pointer",H,q[e],J[a],k[w],t),style:{...R,...I},ref:P,onClick:V,children:[l?g(l,{...l.props,className:n(A,l.props.className)}):r(f,{className:A}),h?g(h,{...h.props,className:n(S,h.props.className)}):r(u,{className:S}),o?g(o,{...o.props,className:n(_,o.props.className)}):r(N,{className:_})]})});d.displayName="Switch";const f=p(({className:t,children:c,...e},a)=>r("div",{...e,className:m("flex justify-center items-center","text-center text-contrast","transition-[margin-inline,background-color]",t),ref:a,children:c}));f.displayName="Switch.Checked";const u=p(({className:t,children:c,...e},a)=>r("div",{...e,className:m("flex justify-center items-center","text-center text-contrast","transition-[margin-inline,background-color]",t),ref:a,children:c}));u.displayName="Switch.Unchecked";const N=p(({className:t,children:c,...e},a)=>r("div",{...e,className:m("flex justify-center items-center","absolute aspect-square scale-80","text-contrast transition-[left,background-color]",t),ref:a,children:c}));N.displayName="Switch.Thumb",d.Checked=f,d.Unchecked=u,d.Thumb=N;export{d as default};
+import{jsxs as M,jsx as d}from"react/jsx-runtime";import{useControllableState as R}from"@nild/hooks";import{cnMerge as p}from"@nild/shared";import{forwardRef as k,Children as T,isValidElement as U,cloneElement as y}from"react";import{switchClassNames as q,checkedClassNames as A,uncheckedClassNames as B,thumbClassNames as D}from"./style/index.js";const h=k(({className:i,children:r,variant:a="solid",size:s="medium",shape:c="round",checked:l,defaultChecked:f,value:w,defaultValue:b,disabled:g,onChange:C,style:S,...j},x)=>{let n,m,o;T.forEach(r,e=>{U(e)&&(e.type===v?n=e:e.type===u?m=e:e.type===N&&(o=e))});const E={"--nd-switch-height":{small:"calc(var(--spacing) * 4)",medium:"calc(var(--spacing) * 6)",large:"calc(var(--spacing) * 8)"}[s]},[t,V]=R(l??w,f??b??!1),z=()=>{V(e=>(C?.(!e),!e))};return M("button",{...j,type:"button",role:"switch","aria-checked":t,disabled:g,className:p(q({variant:a,size:s,shape:c}),i),style:{...E,...S},ref:x,onClick:z,children:[n?y(n,{...n.props,variant:a,checked:t}):d(v,{variant:a,checked:t}),m?y(m,{...m.props,variant:a,checked:t}):d(u,{variant:a,checked:t}),o?y(o,{...o.props,variant:a,shape:c,checked:t}):d(N,{variant:a,shape:c,checked:t})]})});h.displayName="Switch";const v=k(({className:i,children:r,variant:a,checked:s,...c},l)=>d("div",{...c,className:p(A({variant:a,checked:s}),i),ref:l,children:r}));v.displayName="Switch.Checked";const u=k(({className:i,children:r,variant:a,checked:s,...c},l)=>d("div",{...c,className:p(B({variant:a,checked:s}),i),ref:l,children:r}));u.displayName="Switch.Unchecked";const N=k(({className:i,children:r,variant:a,shape:s,checked:c,...l},f)=>d("div",{...l,className:p(D({variant:a,shape:s,checked:c}),i),ref:f,children:r}));N.displayName="Switch.Thumb",h.Checked=v,h.Unchecked=u,h.Thumb=N;export{h as default};

package/dist/switch/index.d.ts

@@ -1,4 +1,3 @@
-import { SwitchVariant, SwitchSize, SwitchShape } from './style';
-import { default as Switch, SwitchProps } from './Switch';
-export type { SwitchProps, SwitchVariant, SwitchSize, SwitchShape };
+import { default as Switch } from './Switch';
+export type * from './interfaces';
 export default Switch;

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

@@ -1,9 +1,5 @@
-export type SwitchVariant = 'solid' | 'outlined';
-export declare const VARIANT_CLS_MAP: Record<SwitchVariant, string[]>;
-export declare const VARIANT_TRACK_CLS_MAP: Record<SwitchVariant, Record<'true' | 'false', string[]>>;
-export declare const VARIANT_THUMB_CLS_MAP: Record<SwitchVariant, string[]>;
-export type SwitchSize = 'small' | 'medium' | 'large';
-export declare const SIZE_VAR_MAP: Record<SwitchSize, string>;
-export declare const SIZE_CLS_MAP: Record<SwitchSize, string[]>;
-export type SwitchShape = 'round' | 'square';
-export declare const SHAPE_CLS_MAP: Record<SwitchShape, string[]>;
+import { SwitchProps } from '../interfaces';
+export declare const switchClassNames: (props?: SwitchProps | undefined) => string;
+export declare const checkedClassNames: (props?: Pick<SwitchProps, "variant" | "checked"> | undefined) => string;
+export declare const uncheckedClassNames: (props?: Pick<SwitchProps, "variant" | "checked"> | undefined) => string;
+export declare const thumbClassNames: (props?: Pick<SwitchProps, "variant" | "shape" | "checked"> | undefined) => string;

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","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};
+import{cva as e}from"@nild/shared";import{DISABLED_CLS as r}from"../../_shared/style/index.js";const a=e(["nd-switch","group","h-[var(--nd-switch-height)]",["relative","inline-block","font-nd","overflow-hidden","cursor-pointer"],r],{variants:{variant:{solid:"",outlined:["border-solid","border","border-primary"]},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"}}}),t=e(["h-[var(--nd-switch-height)]","transition-[margin-inline,background-color]",["flex","justify-center","items-center"],["text-center","text-contrast"],["ps-[calc(var(--nd-switch-height)/3)]","pe-[calc(var(--nd-switch-height)*1.1)]"]],{variants:{checked:{true:["ms-0","me-0"],false:["-ms-[100%]","me-[100%]"]}},compoundVariants:[{variant:"solid",checked:!0,className:["bg-primary","group-enabled:group-hover:bg-primary-hover"]},{variant:"solid",checked:!1,className:["bg-[--alpha(var(--color-primary)/40%)]","group-enabled:group-hover:bg-[--alpha(var(--color-primary)/50%)]"]},{variant:"outlined",className:["bg-transparent","group-enabled:group-hover:bg-tertiary-hover"]}]}),s=e(["h-[var(--nd-switch-height)]","-mt-[var(--nd-switch-height)]","transition-[margin-inline,background-color]",["flex","justify-center","items-center"],["text-center","text-contrast"],["ps-[calc(var(--nd-switch-height)*1.1)]","pe-[calc(var(--nd-switch-height)/3)]"]],{variants:{checked:{true:["ms-[100%]","-me-[100%]"],false:["ms-0","me-0"]}},compoundVariants:[{variant:"solid",checked:!0,className:["bg-primary","group-enabled:group-hover:bg-primary-hover"]},{variant:"solid",checked:!1,className:["bg-[--alpha(var(--color-primary)/40%)]","group-enabled:group-hover:bg-[--alpha(var(--color-primary)/50%)]"]},{variant:"outlined",className:["bg-transparent","group-enabled:group-hover:bg-tertiary-hover"]}]}),i=e(["h-[var(--nd-switch-height)]",["flex","justify-center","items-center"],["absolute","aspect-square","scale-80"],["text-contrast","transition-[left,background-color]"]],{variants:{variant:{solid:["bg-contrast","top-0"],outlined:["bg-primary","top-[50%]","-translate-y-[50%]","group-enabled:group-hover:bg-primary-hover"]},shape:{round:"rounded-full",square:"rounded-md"},checked:{true:"left-[calc(100%-var(--nd-switch-height))]",false:"left-0"}}});export{t as checkedClassNames,a as switchClassNames,i as thumbClassNames,s as uncheckedClassNames};

package/package.json

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