@nild/components 0.0.8 → 0.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- import{isNil as p,isArray as s,isEmpty as e}from"@nild/shared/utils";import{Fragment as a}from"react";const o=r=>!!(p(r)||s(r)&&e(r)||typeof r=="object"&&"type"in r&&r.type===a&&o(r.props.children));export{o as default};
1
+ import{isNil as p,isArray as s,isEmpty as e}from"@nild/shared";import{Fragment as a}from"react";const o=r=>!!(p(r)||s(r)&&e(r)||typeof r=="object"&&"type"in r&&r.type===a&&o(r.props.children));export{o as default};
@@ -1 +1 @@
1
- import{isNil as e,isString as t,isNumber as o,isArray as r}from"@nild/shared/utils";const i=s=>e(s)?!1:t(s)||o(s)?!0:r(s)?s.every(a=>i(a)):!1;export{i as default};
1
+ import{isNil as e,isString as t,isNumber as o,isArray as r}from"@nild/shared";const i=s=>e(s)?!1:t(s)||o(s)?!0:r(s)?s.every(a=>i(a)):!1;export{i as default};
@@ -1,5 +1,5 @@
1
1
  import { ReactElement, ButtonHTMLAttributes, HTMLAttributes, RefAttributes, ForwardRefExoticComponent } from 'react';
2
- import { ButtonVariant, ButtonSize, ButtonShape } from './style';
2
+ import { ButtonVariant, ButtonSize, ButtonShape, GroupDirection } from './style';
3
3
  export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
4
4
  variant?: ButtonVariant;
5
5
  size?: ButtonSize;
@@ -8,12 +8,15 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
8
8
  disabled?: boolean;
9
9
  block?: boolean;
10
10
  }
11
+ /**
12
+ * @category Components
13
+ */
11
14
  declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>> & {
12
15
  Group: typeof Group;
13
16
  };
14
17
  export interface GroupProps extends HTMLAttributes<HTMLDivElement>, Pick<ButtonProps, 'variant' | 'size' | 'disabled'> {
15
18
  children?: ReactElement<ButtonProps> | ReactElement<ButtonProps>[];
16
- direction?: 'horizontal' | 'vertical';
19
+ direction?: GroupDirection;
17
20
  }
18
21
  declare const Group: ForwardRefExoticComponent<GroupProps & RefAttributes<HTMLDivElement>>;
19
22
  export default Button;
@@ -1 +1 @@
1
- import{jsx as t,Fragment as A}from"react/jsx-runtime";import{cnMerge as p,isArray as S,cnJoin as b}from"@nild/shared/utils";import{forwardRef as f}from"react";import{DISABLED_CLS as L}from"../_shared/style/index.js";import P from"../_shared/utils/isEmptyChildren.js";import h from"../_shared/utils/isPlainChildren.js";import{VARIANT_CLS_MAP as C,SIZE_CLS_MAP as M,SHAPE_CLS_MAP as N,EQUAL_CLS_MAP as R,GROUP_FIRST_CLS_MAP as I,GROUP_LAST_CLS_MAP as g,GROUP_DIVIDER_CLS_MAP as z}from"./style/index.js";const i=f(({className:r,children:n,variant:s="solid",size:o="medium",shape:l="square",equal:e=!1,disabled:m,block:c,...d},u)=>{const a=h(n);return t("button",{type:"button",...d,disabled:m,className:p("nd-button","font-sans cursor-pointer transition-colors",L,c&&"w-full",a&&"whitespace-nowrap truncate",C[s],M[o][`${a}`],N[l],e&&R[o],r),ref:u,children:n})});i.displayName="Button";const _=f(({children:r,className:n,variant:s="solid",size:o="medium",disabled:l,direction:e="horizontal",...m},c)=>{if(!r||P(r))return t(A,{});if(!S(r))return t(i,{...r.props,variant:s,size:o,disabled:l});const d=e==="horizontal";return t("div",{...m,className:p("nd-button-group","flex",!d&&"flex-col",n),ref:c,children:r.map((u,a)=>t(i,{...u.props,className:b(a===0?I[e]:a===r.length-1?g[e]:"rounded-none",a!==0&&(d?"border-l-0":"border-t-0"),a!==r.length-1&&z[e][s]),variant:s,size:o,disabled:l},a))})});_.displayName="Button.Group",i.Group=_;export{i as default};
1
+ import{jsx as t,Fragment as A}from"react/jsx-runtime";import{cnMerge as p,isArray as S,cnJoin as b}from"@nild/shared";import{forwardRef as f}from"react";import{DISABLED_CLS as L}from"../_shared/style/index.js";import P from"../_shared/utils/isEmptyChildren.js";import h from"../_shared/utils/isPlainChildren.js";import{VARIANT_CLS_MAP as C,SIZE_CLS_MAP as M,SHAPE_CLS_MAP as N,EQUAL_CLS_MAP as R,GROUP_FIRST_CLS_MAP as I,GROUP_LAST_CLS_MAP as g,GROUP_DIVIDER_CLS_MAP as z}from"./style/index.js";const i=f(({className:r,children:n,variant:s="solid",size:o="medium",shape:l="square",equal:e=!1,disabled:m,block:c,...d},u)=>{const a=h(n);return t("button",{type:"button",...d,disabled:m,className:p("nd-button","font-sans cursor-pointer transition-colors",L,c&&"w-full",a&&"whitespace-nowrap truncate",C[s],M[o][`${a}`],N[l],e&&R[o],r),ref:u,children:n})});i.displayName="Button";const _=f(({children:r,className:n,variant:s="solid",size:o="medium",disabled:l,direction:e="horizontal",...m},c)=>{if(!r||P(r))return t(A,{});if(!S(r))return t(i,{...r.props,variant:s,size:o,disabled:l});const d=e==="horizontal";return t("div",{...m,className:p("nd-button-group","flex",!d&&"flex-col",n),ref:c,children:r.map((u,a)=>t(i,{...u.props,className:b(a===0?I[e]:a===r.length-1?g[e]:"rounded-none",a!==0&&(d?"border-l-0":"border-t-0"),a!==r.length-1&&z[e][s]),variant:s,size:o,disabled:l},a))})});_.displayName="Button.Group",i.Group=_;export{i as default};
@@ -1,3 +1,4 @@
1
- import { default as Button, ButtonProps } from './Button';
2
- export type { ButtonProps };
1
+ import { default as Button, ButtonProps, GroupProps } from './Button';
2
+ import { ButtonVariant, ButtonShape, ButtonSize, GroupDirection } from './style';
3
+ export type { ButtonProps, ButtonVariant, ButtonShape, ButtonSize, GroupProps, GroupDirection };
3
4
  export default Button;
@@ -5,7 +5,7 @@ export declare const SHAPE_CLS_MAP: Record<ButtonShape, string[]>;
5
5
  export type ButtonSize = 'small' | 'medium' | 'large';
6
6
  export declare const SIZE_CLS_MAP: Record<ButtonSize, Record<'true' | 'false', string[]>>;
7
7
  export declare const EQUAL_CLS_MAP: Record<ButtonSize, string[]>;
8
- export type ButtonGroupDirection = 'horizontal' | 'vertical';
9
- export declare const GROUP_FIRST_CLS_MAP: Record<ButtonGroupDirection, string[]>;
10
- export declare const GROUP_LAST_CLS_MAP: Record<ButtonGroupDirection, string[]>;
11
- export declare const GROUP_DIVIDER_CLS_MAP: Record<ButtonGroupDirection, Record<ButtonVariant, string[]>>;
8
+ export type GroupDirection = 'horizontal' | 'vertical';
9
+ export declare const GROUP_FIRST_CLS_MAP: Record<GroupDirection, string[]>;
10
+ export declare const GROUP_LAST_CLS_MAP: Record<GroupDirection, string[]>;
11
+ export declare const GROUP_DIVIDER_CLS_MAP: Record<GroupDirection, Record<ButtonVariant, string[]>>;
@@ -5,5 +5,8 @@ export interface DividerProps extends HTMLAttributes<HTMLDivElement> {
5
5
  direction?: DividerDirection;
6
6
  align?: DividerAlign;
7
7
  }
8
+ /**
9
+ * @category Components
10
+ */
8
11
  declare const Divider: import('react').ForwardRefExoticComponent<DividerProps & import('react').RefAttributes<HTMLDivElement>>;
9
12
  export default Divider;
@@ -1 +1 @@
1
- import{jsx as l}from"react/jsx-runtime";import{cnMerge as c}from"@nild/shared/utils";import{forwardRef as _}from"react";import f from"../_shared/utils/isEmptyChildren.js";import{DIRECTION_WITH_CHILDREN_CLS_MAP as p,DIRECTION_WITHOUT_CHILDREN_CLS_MAP as I,ALIGN_CLS_MAP as N}from"./style/index.js";const o=_(({className:e,children:a,variant:i="solid",direction:r="horizontal",align:t="center",...s},n)=>{const d=r==="horizontal",m=!f(a);return l("div",{...s,className:c("nd-divider","border-split","text-primary",d&&m?p[r][i].concat(N[t]):I[r][i],e),ref:n,children:a})});o.displayName="Divider";export{o as default};
1
+ import{jsx as l}from"react/jsx-runtime";import{cnMerge as c}from"@nild/shared";import{forwardRef as _}from"react";import f from"../_shared/utils/isEmptyChildren.js";import{DIRECTION_WITH_CHILDREN_CLS_MAP as p,DIRECTION_WITHOUT_CHILDREN_CLS_MAP as I,ALIGN_CLS_MAP as N}from"./style/index.js";const o=_(({className:e,children:a,variant:i="solid",direction:r="horizontal",align:t="center",...s},n)=>{const d=r==="horizontal",m=!f(a);return l("div",{...s,className:c("nd-divider","border-split","text-primary",d&&m?p[r][i].concat(N[t]):I[r][i],e),ref:n,children:a})});o.displayName="Divider";export{o as default};
@@ -1,3 +1,4 @@
1
1
  import { default as Divider, DividerProps } from './Divider';
2
- export type { DividerProps };
2
+ import { DividerVariant, DividerDirection, DividerAlign } from './style';
3
+ export type { DividerProps, DividerVariant, DividerDirection, DividerAlign };
3
4
  export default Divider;
@@ -2,7 +2,7 @@ import { FC, ReactNode } from 'react';
2
2
  import { default as Portal } from '../portal';
3
3
  import { default as Trigger, TriggerAction } from '../trigger';
4
4
  import { Placement, OffsetOptions } from '@floating-ui/dom';
5
- interface PopoverProps {
5
+ export interface PopoverProps {
6
6
  children?: ReactNode;
7
7
  placement?: Placement;
8
8
  offset?: OffsetOptions;
@@ -11,6 +11,9 @@ interface PopoverProps {
11
11
  defaultOpen?: boolean;
12
12
  onChange?: (open: boolean) => void;
13
13
  }
14
+ /**
15
+ * @category Components
16
+ */
14
17
  declare const Popover: FC<PopoverProps> & {
15
18
  Trigger: typeof Trigger;
16
19
  Portal: typeof Portal;
@@ -1,2 +1,3 @@
1
- import { default as Popover } from './Popover';
1
+ import { default as Popover, PopoverProps } from './Popover';
2
+ export type { PopoverProps };
2
3
  export default Popover;
@@ -1 +1 @@
1
- import{jsx as t}from"react/jsx-runtime";import{cnMerge as d}from"@nild/shared/utils";import{forwardRef as R}from"react";import{ARROW_ORIENTATION_STYLE_MAP as _,ARROW_ORIENTATION_CLS_MAP as f,ARROW_SIZE_CLS_MAP as A}from"./style/index.js";const a=R(({className:e,style:o,orientation:r="up",size:s="medium",...i},m)=>t("div",{...i,style:{..._[r],...o},className:d("nd-arrow","bg-container border-solid border-edge",f[r],A[s],e),ref:m}));a.displayName="Arrow";export{a as default};
1
+ import{jsx as t}from"react/jsx-runtime";import{cnMerge as d}from"@nild/shared";import{forwardRef as R}from"react";import{ARROW_ORIENTATION_STYLE_MAP as _,ARROW_ORIENTATION_CLS_MAP as f,ARROW_SIZE_CLS_MAP as A}from"./style/index.js";const a=R(({className:e,style:o,orientation:r="up",size:s="medium",...i},m)=>t("div",{...i,style:{..._[r],...o},className:d("nd-arrow","bg-container border-solid border-edge",f[r],A[s],e),ref:m}));a.displayName="Arrow";export{a as default};
@@ -1,7 +1,7 @@
1
1
  import { HTMLAttributes, Ref } from 'react';
2
2
  import { ArrowProps } from './Arrow';
3
3
  import { PaddingSize } from './style';
4
- interface ArrowOptions extends ArrowProps {
4
+ export interface ArrowOptions extends ArrowProps {
5
5
  ref: Ref<HTMLDivElement>;
6
6
  }
7
7
  export interface PortalProps extends HTMLAttributes<HTMLDivElement> {
@@ -9,5 +9,8 @@ export interface PortalProps extends HTMLAttributes<HTMLDivElement> {
9
9
  paddingSize?: PaddingSize;
10
10
  arrow?: ArrowOptions | false;
11
11
  }
12
+ /**
13
+ * @category Components
14
+ */
12
15
  declare const Portal: import('react').ForwardRefExoticComponent<PortalProps & import('react').RefAttributes<HTMLDivElement>>;
13
16
  export default Portal;
@@ -1 +1 @@
1
- import{jsxs as p,jsx as u}from"react/jsx-runtime";import{cnMerge as r,cnJoin as f}from"@nild/shared/utils";import{forwardRef as N,Children as g,isValidElement as b,cloneElement as P}from"react";import{createPortal as h}from"react-dom";import v from"./Arrow.js";import{PADDING_SIZE_CLS_MAP as x}from"./style/index.js";const s=N(({className:l,children:t,container:n=document.body,paddingSize:i="medium",arrow:e=!1,...m},d)=>{var o;const a=g.toArray(t).find(c=>b(c));return a?h(p("div",{...m,className:r("nd-portal","absolute top-0 left-0",l),ref:d,children:[P(a,{...a.props,className:r("bg-container rounded-md outline-solid outline-1 outline-edge shadow-lg",x[i],(o=a?.props)==null?void 0:o.className)}),e!==!1&&u(v,{...e,className:f("absolute",e.className)})]}),n):null});s.displayName="Portal";export{s as default};
1
+ import{jsxs as p,jsx as u}from"react/jsx-runtime";import{cnMerge as r,cnJoin as f}from"@nild/shared";import{forwardRef as N,Children as g,isValidElement as b,cloneElement as P}from"react";import{createPortal as h}from"react-dom";import v from"./Arrow.js";import{PADDING_SIZE_CLS_MAP as x}from"./style/index.js";const s=N(({className:l,children:t,container:n=document.body,paddingSize:i="medium",arrow:e=!1,...m},d)=>{var o;const a=g.toArray(t).find(c=>b(c));return a?h(p("div",{...m,className:r("nd-portal","absolute top-0 left-0",l),ref:d,children:[P(a,{...a.props,className:r("bg-container rounded-md outline-solid outline-1 outline-edge shadow-lg",x[i],(o=a?.props)==null?void 0:o.className)}),e!==!1&&u(v,{...e,className:f("absolute",e.className)})]}),n):null});s.displayName="Portal";export{s as default};
@@ -1,5 +1,6 @@
1
1
  import { default as Arrow, ArrowProps } from './Arrow';
2
- import { default as Portal, PortalProps } from './Portal';
3
- export type { ArrowProps, PortalProps };
2
+ import { default as Portal, PortalProps, ArrowOptions } from './Portal';
3
+ import { PaddingSize } from './style';
4
+ export type { ArrowProps, PortalProps, PaddingSize, ArrowOptions };
4
5
  export { Arrow };
5
6
  export default Portal;
@@ -11,6 +11,9 @@ export interface SwitchProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement
11
11
  disabled?: boolean;
12
12
  onChange?: (checked: boolean) => void;
13
13
  }
14
+ /**
15
+ * @category Components
16
+ */
14
17
  declare const Switch: ForwardRefExoticComponent<SwitchProps & RefAttributes<HTMLButtonElement>> & {
15
18
  Checked: typeof Checked;
16
19
  Unchecked: typeof Unchecked;
@@ -1 +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 d}from"@nild/shared/utils";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 m=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:d("nd-switch","h-[var(--nd-switch-height)]","group","relative inline-block font-sans 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:_})]})});m.displayName="Switch";const f=p(({className:t,children:c,...e},a)=>r("div",{...e,className:d("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:d("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:d("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",m.Checked=f,m.Unchecked=u,m.Thumb=N;export{m as default};
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 d}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 m=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:d("nd-switch","h-[var(--nd-switch-height)]","group","relative inline-block font-sans 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:_})]})});m.displayName="Switch";const f=p(({className:t,children:c,...e},a)=>r("div",{...e,className:d("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:d("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:d("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",m.Checked=f,m.Unchecked=u,m.Thumb=N;export{m as default};
@@ -1,2 +1,4 @@
1
- import { default as Switch } from './Switch';
1
+ import { SwitchVariant, SwitchSize, SwitchShape } from './style';
2
+ import { default as Switch, SwitchProps } from './Switch';
3
+ export type { SwitchProps, SwitchVariant, SwitchSize, SwitchShape };
2
4
  export default Switch;
@@ -1,8 +1,11 @@
1
1
  import { FC, ReactNode } from 'react';
2
- interface TransitionProps {
2
+ export interface TransitionProps {
3
3
  className?: string;
4
4
  children?: ReactNode;
5
5
  visible?: boolean;
6
6
  }
7
+ /**
8
+ * @category Components
9
+ */
7
10
  declare const Transition: FC<TransitionProps>;
8
11
  export default Transition;
@@ -1 +1 @@
1
- import{useEffectCallback as o}from"@nild/hooks";import{cnMerge as E}from"@nild/shared/utils";import{Children as T,isValidElement as k,useState as h,useRef as p,useEffect as f,cloneElement as N}from"react";const x=({className:b,children:v,visible:l=!0})=>{const c=T.toArray(v).find(a=>k(a)),u=c?l?"entered":"exited":"unmounted",[t,n]=h(u),e=p(),r=p(c);r.current=t==="unmounted"?c:c??r.current;const i=o(a=>{s();let d=!0;const m=()=>{d&&(d=!1,e.current=void 0,a?.())};m.cancel=()=>{d=!1},e.current=m}),g=o(()=>{e.current&&(e.current(),e.current=void 0)}),s=o(()=>{e.current&&(e.current.cancel(),e.current=void 0)}),y=o(()=>{u==="unmounted"&&t==="exited"&&n("unmounted")});return f(()=>{g()},[t]),f(()=>{switch(u){case"entered":t!=="entering"&&t!=="entered"&&(t==="unmounted"?n("exited"):(s(),n("entering"),i(()=>{i(()=>{n("entered")}),e.current&&setTimeout(e.current,0)})));break;case"exited":(t==="entering"||t==="entered")&&(s(),n("exiting"),i(()=>{i(()=>{n("exited")}),e.current&&setTimeout(e.current,0)}));break;case"unmounted":default:t!=="exited"&&t!=="unmounted"&&(s(),n("exiting"),i(()=>{i(()=>{n("exited")}),e.current&&setTimeout(e.current,0)}));break}},[l,u,t]),r.current?N(r.current,{...r.current.props,className:E(r.current.props.className,"transition-[opacity,visibility]",t==="entered"?"opacity-100 visible":"opacity-0 invisible",b),onTransitionEnd:y}):null};x.displayName="Transition";export{x as default};
1
+ import{useEffectCallback as o}from"@nild/hooks";import{cnMerge as E}from"@nild/shared";import{Children as T,isValidElement as k,useState as h,useRef as p,useEffect as f,cloneElement as N}from"react";const x=({className:b,children:v,visible:l=!0})=>{const c=T.toArray(v).find(a=>k(a)),u=c?l?"entered":"exited":"unmounted",[t,n]=h(u),e=p(),r=p(c);r.current=t==="unmounted"?c:c??r.current;const i=o(a=>{s();let d=!0;const m=()=>{d&&(d=!1,e.current=void 0,a?.())};m.cancel=()=>{d=!1},e.current=m}),g=o(()=>{e.current&&(e.current(),e.current=void 0)}),s=o(()=>{e.current&&(e.current.cancel(),e.current=void 0)}),y=o(()=>{u==="unmounted"&&t==="exited"&&n("unmounted")});return f(()=>{g()},[t]),f(()=>{switch(u){case"entered":t!=="entering"&&t!=="entered"&&(t==="unmounted"?n("exited"):(s(),n("entering"),i(()=>{i(()=>{n("entered")}),e.current&&setTimeout(e.current,0)})));break;case"exited":(t==="entering"||t==="entered")&&(s(),n("exiting"),i(()=>{i(()=>{n("exited")}),e.current&&setTimeout(e.current,0)}));break;case"unmounted":default:t!=="exited"&&t!=="unmounted"&&(s(),n("exiting"),i(()=>{i(()=>{n("exited")}),e.current&&setTimeout(e.current,0)}));break}},[l,u,t]),r.current?N(r.current,{...r.current.props,className:E(r.current.props.className,"transition-[opacity,visibility]",t==="entered"?"opacity-100 visible":"opacity-0 invisible",b),onTransitionEnd:y}):null};x.displayName="Transition";export{x as default};
@@ -1,2 +1,3 @@
1
- import { default as Transition } from './Transition';
1
+ import { default as Transition, TransitionProps } from './Transition';
2
+ export type { TransitionProps };
2
3
  export default Transition;
@@ -7,5 +7,8 @@ export interface TriggerProps {
7
7
  onOpen?: () => void;
8
8
  onClose?: () => void;
9
9
  }
10
+ /**
11
+ * @category Components
12
+ */
10
13
  declare const Trigger: import('react').ForwardRefExoticComponent<TriggerProps & import('react').RefAttributes<Element>>;
11
14
  export default Trigger;
@@ -1 +1 @@
1
- import{useEffectCallback as o}from"@nild/hooks";import{mergeRefs as x,cnJoin as y}from"@nild/shared/utils";import{forwardRef as C,Children as E,isValidElement as A,cloneElement as N}from"react";const a=C(({children:t,action:s="click",onToggle:u,onOpen:l,onClose:i,...v},f)=>{var r,d;const n=E.toArray(t).find(c=>A(c)),e=Array.isArray(s)?s:[s],m=o(()=>e.includes("click")&&u?.()),p=o(()=>e.includes("hover")&&l?.()),g=o(()=>e.includes("hover")&&i?.()),k=o(()=>e.includes("focus")&&l?.()),M=o(()=>(e.includes("click")||e.includes("focus")||e.includes("contextMenu"))&&i?.()),h=o(c=>e.includes("contextMenu")&&(c.preventDefault(),l?.()));return n?N(n,{...v,className:y("nd-trigger",(r=n?.props)==null?void 0:r.className),ref:x(f,(d=n?.props)==null?void 0:d.ref),onClick:m,onMouseEnter:p,onMouseLeave:g,onFocus:k,onBlur:M,onContextMenu:h}):null});a.displayName="Trigger";export{a as default};
1
+ import{useEffectCallback as o}from"@nild/hooks";import{mergeRefs as x,cnJoin as y}from"@nild/shared";import{forwardRef as C,Children as E,isValidElement as A,cloneElement as N}from"react";const a=C(({children:t,action:s="click",onToggle:u,onOpen:l,onClose:i,...v},f)=>{var r,d;const n=E.toArray(t).find(c=>A(c)),e=Array.isArray(s)?s:[s],m=o(()=>e.includes("click")&&u?.()),p=o(()=>e.includes("hover")&&l?.()),g=o(()=>e.includes("hover")&&i?.()),k=o(()=>e.includes("focus")&&l?.()),M=o(()=>(e.includes("click")||e.includes("focus")||e.includes("contextMenu"))&&i?.()),h=o(c=>e.includes("contextMenu")&&(c.preventDefault(),l?.()));return n?N(n,{...v,className:y("nd-trigger",(r=n?.props)==null?void 0:r.className),ref:x(f,(d=n?.props)==null?void 0:d.ref),onClick:m,onMouseEnter:p,onMouseLeave:g,onFocus:k,onBlur:M,onContextMenu:h}):null});a.displayName="Trigger";export{a as default};
@@ -1 +1 @@
1
- import{jsx as d}from"react/jsx-runtime";import{cnMerge as s}from"@nild/shared/utils";import{forwardRef as f}from"react";import{DISABLED_CLS as m}from"../_shared/style/index.js";const r=f(({className:n,children:i,disabled:e,underlined:a,href:t="#",...l},o)=>d("a",{...l,href:e?void 0:t,className:s("nd-link",["font-sans","text-link","text-[length:inherit]","cursor-pointer","enabled:hover:text-link-hover","enabled:active:text-link-active"],m,a?"underline":"no-underline",e&&"disabled",n),ref:o,children:i}));r.displayName="Typography.Link";export{r as default};
1
+ import{jsx as d}from"react/jsx-runtime";import{cnMerge as s}from"@nild/shared";import{forwardRef as f}from"react";import{DISABLED_CLS as m}from"../_shared/style/index.js";const r=f(({className:n,children:i,disabled:e,underlined:a,href:t="#",...l},o)=>d("a",{...l,href:e?void 0:t,className:s("nd-link",["font-sans","text-link","text-[length:inherit]","cursor-pointer","enabled:hover:text-link-hover","enabled:active:text-link-active"],m,a?"underline":"no-underline",e&&"disabled",n),ref:o,children:i}));r.displayName="Typography.Link";export{r as default};
@@ -1 +1 @@
1
- import{jsx as t}from"react/jsx-runtime";import{cnMerge as o}from"@nild/shared/utils";import{forwardRef as s}from"react";const r=s(({className:a,children:e,...m},p)=>t("p",{...m,className:o("nd-paragraph","text-primary text-[length:inherit]","mt-0 mb-[1em]",a),ref:p,children:e}));r.displayName="Typography.Paragraph";export{r as default};
1
+ import{jsx as t}from"react/jsx-runtime";import{cnMerge as o}from"@nild/shared";import{forwardRef as s}from"react";const r=s(({className:a,children:e,...m},p)=>t("p",{...m,className:o("nd-paragraph","text-primary text-[length:inherit]","mt-0 mb-[1em]",a),ref:p,children:e}));r.displayName="Typography.Paragraph";export{r as default};
@@ -1 +1 @@
1
- import{jsx as r}from"react/jsx-runtime";import{cnJoin as d,cnMerge as x}from"@nild/shared/utils";import{forwardRef as g}from"react";import{DISABLED_CLS as u}from"../_shared/style/index.js";const s=g(({className:a,children:o,disabled:n,secondary:t,strong:i,deleted:l,underlined:c,italic:m,marked:p,coded:b,keyboarded:h,...y},f)=>{let e=o;return i&&(e=r("strong",{children:e})),l&&(e=r("del",{children:e})),c&&(e=r("u",{className:"underline",children:e})),m&&(e=r("i",{children:e})),p&&(e=r("mark",{className:"text-contrast bg-primary",children:e})),b&&(e=r("code",{className:d("text-sm","ps-1.5 pe-1.5","bg-secondary rounded-sm border border-solid border-secondary"),children:e})),h&&(e=r("kbd",{className:d("text-sm","ps-1.5 pe-1.5","rounded-sm border border-b-2 border-solid border-secondary"),children:e})),r("span",{...y,className:x("nd-text","font-sans text-[length:inherit]",u,n&&"disabled",t?"text-secondary":"text-primary",a),ref:f,children:e})});s.displayName="Typography.Text";export{s as default};
1
+ import{jsx as r}from"react/jsx-runtime";import{cnJoin as d,cnMerge as x}from"@nild/shared";import{forwardRef as g}from"react";import{DISABLED_CLS as u}from"../_shared/style/index.js";const s=g(({className:a,children:o,disabled:n,secondary:t,strong:i,deleted:l,underlined:c,italic:m,marked:p,coded:b,keyboarded:h,...y},f)=>{let e=o;return i&&(e=r("strong",{children:e})),l&&(e=r("del",{children:e})),c&&(e=r("u",{className:"underline",children:e})),m&&(e=r("i",{children:e})),p&&(e=r("mark",{className:"text-contrast bg-primary",children:e})),b&&(e=r("code",{className:d("text-sm","ps-1.5 pe-1.5","bg-secondary rounded-sm border border-solid border-secondary"),children:e})),h&&(e=r("kbd",{className:d("text-sm","ps-1.5 pe-1.5","rounded-sm border border-b-2 border-solid border-secondary"),children:e})),r("span",{...y,className:x("nd-text","font-sans text-[length:inherit]",u,n&&"disabled",t?"text-secondary":"text-primary",a),ref:f,children:e})});s.displayName="Typography.Text";export{s as default};
@@ -1 +1 @@
1
- import{jsx as i}from"react/jsx-runtime";import{cnMerge as f}from"@nild/shared/utils";import{forwardRef as l}from"react";import{HEADING_LEVEL_CLS_MAP as n}from"./style/index.js";const r=l(({className:a,children:m,level:e=1,...s},o)=>{const t=`h${e}`;return i(t,{...s,className:f(["nd-title","font-sans font-semibold text-primary","mt-[1em] mb-[0.5em]"],n[e],a),ref:o,children:m})});r.displayName="Typography.Title";export{r as default};
1
+ import{jsx as i}from"react/jsx-runtime";import{cnMerge as f}from"@nild/shared";import{forwardRef as l}from"react";import{HEADING_LEVEL_CLS_MAP as n}from"./style/index.js";const r=l(({className:a,children:m,level:e=1,...s},o)=>{const t=`h${e}`;return i(t,{...s,className:f(["nd-title","font-sans font-semibold text-primary","mt-[1em] mb-[0.5em]"],n[e],a),ref:o,children:m})});r.displayName="Typography.Title";export{r as default};
@@ -4,6 +4,9 @@ import { default as Paragraph } from './Paragraph';
4
4
  import { default as Text } from './Text';
5
5
  import { default as Title } from './Title';
6
6
  export type TypographyProps = HTMLAttributes<HTMLElement>;
7
+ /**
8
+ * @category Components
9
+ */
7
10
  declare const Typography: ForwardRefExoticComponent<TypographyProps> & {
8
11
  Link: typeof Link;
9
12
  Paragraph: typeof Paragraph;
@@ -1 +1 @@
1
- import{jsx as e}from"react/jsx-runtime";import{cnMerge as p}from"@nild/shared/utils";import{forwardRef as i}from"react";import s from"./Link.js";import f from"./Paragraph.js";import n from"./Text.js";import l from"./Title.js";const r=i(({className:o,children:a,...m},t)=>e("article",{...m,className:p("nd-typography","font-sans text-md",o),ref:t,children:a}));r.Link=s,r.Paragraph=f,r.Text=n,r.Title=l,r.displayName="Typography";export{r as default};
1
+ import{jsx as e}from"react/jsx-runtime";import{cnMerge as p}from"@nild/shared";import{forwardRef as i}from"react";import s from"./Link.js";import f from"./Paragraph.js";import n from"./Text.js";import l from"./Title.js";const r=i(({className:o,children:a,...m},t)=>e("article",{...m,className:p("nd-typography","font-sans text-md",o),ref:t,children:a}));r.Link=s,r.Paragraph=f,r.Text=n,r.Title=l,r.displayName="Typography";export{r as default};
@@ -1,3 +1,8 @@
1
+ import { LinkProps } from './Link';
2
+ import { ParagraphProps } from './Paragraph';
3
+ import { HeadingLevel } from './style';
4
+ import { TextProps } from './Text';
5
+ import { TitleProps } from './Title';
1
6
  import { default as Typography, TypographyProps } from './Typography';
2
- export type { TypographyProps };
7
+ export type { TypographyProps, LinkProps, ParagraphProps, TextProps, TitleProps, HeadingLevel };
3
8
  export default Typography;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@nild/components",
3
3
  "private": false,
4
- "version": "0.0.8",
4
+ "version": "0.0.10",
5
5
  "type": "module",
6
6
  "module": "./dist/index.js",
7
7
  "exports": {
@@ -31,12 +31,13 @@
31
31
  "peerDependencies": {
32
32
  "react": ">=18.2.0",
33
33
  "react-dom": ">=18.2.0",
34
- "@nild/hooks": "0.0.7",
35
- "@nild/shared": "0.0.5"
34
+ "@nild/hooks": "0.0.8",
35
+ "@nild/shared": "0.0.6"
36
36
  },
37
37
  "scripts": {
38
38
  "build": "vite build --mode PROD",
39
39
  "dev": "vite build --mode DEV --watch",
40
+ "api": "node scripts/generate-api.js",
40
41
  "test": "vitest run --environment jsdom --globals",
41
42
  "test:coverage": "vitest run --environment jsdom --globals --coverage"
42
43
  }