@sruim/nexus-design 0.0.1

package/dist/ui/collapsible/index.js

@@ -0,0 +1,7 @@
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+
+const Collapsible = CollapsiblePrimitive.Root;
+Collapsible.Trigger = CollapsiblePrimitive.Trigger;
+Collapsible.Content = CollapsiblePrimitive.Content;
+
+export { Collapsible };

package/dist/ui/dialog/confirm.d.ts

@@ -0,0 +1,20 @@
+import type * as React from 'react';
+interface Params {
+    className?: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    cancel?: React.ReactNode;
+    confirm?: React.ReactNode;
+    cancelText?: string;
+    confirmText?: string;
+    onCancel?: () => void;
+    onConfirm?: () => void;
+}
+interface Props extends Params {
+    onClose: () => void;
+}
+interface IConfirm extends React.FC<Props> {
+    show: (params?: Params) => void;
+}
+declare const Confirm: IConfirm;
+export { Confirm };

package/dist/ui/dialog/confirm.js

@@ -0,0 +1,80 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@radix-ui/react-portal';
+import '../avatar/index.js';
+import { cn } from '../../utils/config.js';
+import { Button } from '../button.js';
+import '../carousel/index.js';
+import '../checkbox/index.js';
+import '../collapsible/index.js';
+import { Dialog } from './dialog.js';
+import '../drawer.js';
+import '../form.js';
+import '../input-otp.js';
+import '../label.js';
+import 'react';
+import '../popover/index.js';
+import '../progress.js';
+import '../select/index.js';
+import '../slider/index.js';
+import '../sonner.js';
+import '../switch.js';
+import '../table/index.js';
+import '../tabs/index.js';
+import '../toggle/toggle.js';
+import '../toggle/toggle-group.js';
+import '../tooltip/index.js';
+import { Icon } from '../../components/icon/index.js';
+import '../../components/img-uploader/index.js';
+import '../../components/img-viewer/index.js';
+import '../../components/loading/index.js';
+import '../../components/model-uploader/index.js';
+import { FrostGlass } from '../../tokens/materials.js';
+
+const Confirm = ({
+  className,
+  title,
+  description,
+  cancel,
+  confirm,
+  cancelText,
+  confirmText,
+  onCancel,
+  onConfirm,
+  onClose
+}) => {
+  const handleCancel = async () => {
+    try {
+      await onCancel?.();
+    } finally {
+      onClose();
+    }
+  };
+  const handleConfirm = async () => {
+    try {
+      await onConfirm?.();
+    } finally {
+      onClose();
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("w-95 p-4 rounded-6 relative", FrostGlass, className), children: [
+    /* @__PURE__ */ jsx(
+      Icon,
+      {
+        icon: "i-nexus-close-monotone",
+        className: "absolute right-4 top-4 size-5 cursor-pointer text-text-secondary",
+        onClick: handleCancel
+      }
+    ),
+    /* @__PURE__ */ jsx("h3", { className: "mb-4 mt-6 text-center text-4.5 text-text-primary", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "text-center text-4 text-text-secondary", children: description }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-6 flex gap-4", children: [
+      cancel ? cancel : /* @__PURE__ */ jsx(Button, { variant: "plain", className: "flex-1 font-bold", onClick: handleCancel, children: cancelText }),
+      confirm ? confirm : /* @__PURE__ */ jsx(Button, { variant: "solid", className: "flex-1 font-bold", onClick: handleConfirm, children: confirmText })
+    ] })
+  ] });
+};
+Confirm.show = (params) => {
+  const close = Dialog.show(/* @__PURE__ */ jsx(Confirm, { ...params, onClose: () => close() }));
+};
+
+export { Confirm };

package/dist/ui/dialog/dialog.d.ts

@@ -0,0 +1,26 @@
+import * as D from '@radix-ui/react-dialog';
+import * as React from 'react';
+declare const Overlay: React.ForwardRefExoticComponent<D.DialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+declare const Content: React.ForwardRefExoticComponent<D.DialogContentProps & React.RefAttributes<HTMLDivElement>>;
+interface Props {
+    overlayClassName?: string;
+}
+interface TDialog extends React.FC<D.DialogContentProps & D.DialogProps & Props> {
+    Root: typeof D.Root;
+    Portal: typeof D.Portal;
+    Trigger: typeof D.Trigger;
+    Overlay: typeof Overlay;
+    Content: typeof Content;
+    show: (dialog: React.ReactNode, params?: Omit<D.DialogContentProps & D.DialogProps, 'open' | 'defaultOpen'> & Props) => () => void;
+}
+declare const Dialog: TDialog;
+declare const open: unique symbol;
+declare const close: unique symbol;
+declare global {
+    interface Window {
+        [open]: (key: number, dialog: React.ReactNode) => void;
+        [close]: (key: number) => void;
+    }
+}
+export declare const Dialoger: React.FC;
+export { Dialog };

package/dist/ui/dialog/dialog.js

@@ -0,0 +1,97 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { DeepGlass } from '../../tokens/materials.js';
+import { cn } from '../../utils/config.js';
+import { sleep } from '../../utils/utils.js';
+import * as D from '@radix-ui/react-dialog';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+import * as React from 'react';
+
+const AnimationBaseStyle = "duration-slow ease-smooth data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0";
+const AnimationInStyle = "data-[state=open]:zoom-in-95 data-[state=open]:slide-in-l-1/2 data-[state=open]:slide-in-t-2";
+const AnimationOutStyle = "data-[state=closed]:zoom-out-95 data-[state=closed]:slide-out-l-1/2 data-[state=closed]:slide-out-t-2";
+const Overlay = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    D.Overlay,
+    {
+      ref,
+      className: cn("fixed inset-0 z-50", DeepGlass, AnimationBaseStyle, className),
+      ...props
+    }
+  )
+);
+Overlay.displayName = D.Overlay.displayName;
+const BaseStyle = "outline-none z-50 fixed left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 h-full flex flex-col justify-center";
+const Content = React.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+    D.Content,
+    {
+      "aria-describedby": void 0,
+      ref,
+      className: cn(BaseStyle, AnimationBaseStyle, AnimationInStyle, AnimationOutStyle, className),
+      ...props,
+      children
+    }
+  )
+);
+Content.displayName = D.Content.displayName;
+const Dialog = ({
+  open: open2 = true,
+  defaultOpen,
+  onOpenChange,
+  modal,
+  overlayClassName,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(D.Root, { open: open2, defaultOpen, onOpenChange, modal, children: /* @__PURE__ */ jsxs(D.Portal, { children: [
+    /* @__PURE__ */ jsx(Overlay, { className: overlayClassName }),
+    /* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(D.Title, {}) }),
+    /* @__PURE__ */ jsx(Content, { ...props })
+  ] }) });
+};
+Dialog.Root = D.Root;
+Dialog.Portal = D.Portal;
+Dialog.Overlay = Overlay;
+Dialog.Content = Content;
+Dialog.Trigger = D.Trigger;
+const open = Symbol.for("open");
+const close = Symbol.for("close");
+const Dialoger = () => {
+  const [data, setData] = React.useState({});
+  const openDialog = (key, dialog) => {
+    if (!dialog) return;
+    setData({ ...data, [key]: dialog });
+  };
+  const closeDialog = (key) => {
+    if (data[key]) {
+      delete data[key];
+      setData({ ...data });
+    }
+  };
+  if (globalThis.window) {
+    globalThis.window[open] = openDialog;
+    globalThis.window[close] = closeDialog;
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: Object.values(data) });
+};
+Dialog.show = (dialog, params) => {
+  if (window === void 0) {
+    console.warn("Dialog.show is not supported in Server Side");
+    return () => Promise.resolve();
+  }
+  const key = Date.now();
+  window[open](
+    key,
+    /* @__PURE__ */ jsx(Dialog, { ...params, open: true, children: dialog }, key)
+  );
+  return () => {
+    window[open](
+      key,
+      /* @__PURE__ */ jsx(Dialog, { ...params, open: false, children: dialog }, key)
+    );
+    sleep(150).then(() => {
+      window[close](key);
+    });
+  };
+};
+
+export { Dialog, Dialoger };

package/dist/ui/dialog/index.d.ts

@@ -0,0 +1,2 @@
+export * from './confirm';
+export * from './dialog';

package/dist/ui/drawer.d.ts

@@ -0,0 +1,22 @@
+import { Drawer as DrawerPrimitive } from 'vaul';
+import * as React from 'react';
+declare const Drawer: {
+    ({ shouldScaleBackground, ...props }: React.ComponentProps<typeof DrawerPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    Content: React.ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-dialog').DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Title: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-dialog').DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+    Description: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-dialog').DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+    Footer: {
+        ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Header: {
+        ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Overlay: React.ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-dialog').DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Portal: typeof import('vaul').Portal;
+    Trigger: React.ForwardRefExoticComponent<import('@radix-ui/react-dialog').DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Close: React.ForwardRefExoticComponent<import('@radix-ui/react-dialog').DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+};
+export { Drawer };

package/dist/ui/drawer.js

@@ -0,0 +1,98 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { DeepGlass, FrostGlass } from '../tokens/materials.js';
+import { cn } from '../utils/config.js';
+import '@radix-ui/react-portal';
+import './avatar/index.js';
+import './button.js';
+import './carousel/index.js';
+import './checkbox/index.js';
+import './collapsible/index.js';
+import './dialog/confirm.js';
+import './dialog/dialog.js';
+import './form.js';
+import './input-otp.js';
+import './label.js';
+import * as React from 'react';
+import './popover/index.js';
+import './progress.js';
+import './select/index.js';
+import './slider/index.js';
+import './sonner.js';
+import './switch.js';
+import './table/index.js';
+import './tabs/index.js';
+import './toggle/toggle.js';
+import './toggle/toggle-group.js';
+import './tooltip/index.js';
+import { Drawer as Drawer$1 } from 'vaul';
+
+const Drawer = ({
+  shouldScaleBackground = true,
+  ...props
+}) => /* @__PURE__ */ jsx(Drawer$1.Root, { shouldScaleBackground, ...props });
+Drawer.displayName = "Drawer";
+const DrawerTrigger = Drawer$1.Trigger;
+const DrawerPortal = Drawer$1.Portal;
+const DrawerClose = Drawer$1.Close;
+const DrawerOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer$1.Overlay,
+  {
+    ref,
+    className: cn("fixed inset-0 z-50 duration-slow ease-smooth", DeepGlass, className),
+    ...props
+  }
+));
+DrawerOverlay.displayName = Drawer$1.Overlay.displayName;
+const DrawerContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [
+  /* @__PURE__ */ jsx(DrawerOverlay, {}),
+  /* @__PURE__ */ jsxs(
+    Drawer$1.Content,
+    {
+      ref,
+      className: cn(
+        "fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border border-border-subtle duration-slow ease-smooth",
+        FrostGlass,
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "mx-auto mt-4 h-2 w-[100px] rounded-full bg-surface-dim" }),
+        children
+      ]
+    }
+  )
+] }));
+DrawerContent.displayName = "DrawerContent";
+const DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("grid gap-1.5 p-4 text-center sm:text-left", className), ...props });
+DrawerHeader.displayName = "DrawerHeader";
+const DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("mt-auto flex flex-col gap-2 p-4", className), ...props });
+DrawerFooter.displayName = "DrawerFooter";
+const DrawerTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer$1.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+DrawerTitle.displayName = Drawer$1.Title.displayName;
+const DrawerDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer$1.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+DrawerDescription.displayName = Drawer$1.Description.displayName;
+Drawer.Content = DrawerContent;
+Drawer.Title = DrawerTitle;
+Drawer.Description = DrawerDescription;
+Drawer.Footer = DrawerFooter;
+Drawer.Header = DrawerHeader;
+Drawer.Overlay = DrawerOverlay;
+Drawer.Portal = DrawerPortal;
+Drawer.Trigger = DrawerTrigger;
+Drawer.Close = DrawerClose;
+
+export { Drawer };

package/dist/ui/form.d.ts

@@ -0,0 +1,33 @@
+import { useFormContext, ControllerProps, FieldPath, FieldValues, UseFormProps, UseFormReturn } from 'react-hook-form';
+import { z } from 'zod';
+import type * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: import('react-hook-form').FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+interface FormProps<T extends FieldValues> extends React.FormHTMLAttributes<HTMLFormElement> {
+    form: UseFormReturn<T>;
+}
+declare const Form: {
+    <T extends FieldValues>({ form, children, ...props }: FormProps<T>): import("react/jsx-runtime").JSX.Element;
+    Item: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Field: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
+    Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+    Control: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-slot').SlotProps & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+    Description: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+    Message: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+};
+declare const useForm: <T extends FieldValues>(fn: (_z: typeof z) => Omit<UseFormProps<T>, "resolver"> & {
+    resolver: z.ZodSchema<T>;
+}, deps?: React.DependencyList) => UseFormReturn<T, any, T>;
+export { Form, useForm, useFormContext, useFormField };
+export type { UseFormReturn };

package/dist/ui/form.js

@@ -0,0 +1,138 @@
+import { jsx } from 'react/jsx-runtime';
+import { Label } from './label.js';
+import { cn } from '../utils/config.js';
+import '@radix-ui/react-portal';
+import './avatar/index.js';
+import './button.js';
+import './carousel/index.js';
+import './checkbox/index.js';
+import './collapsible/index.js';
+import './dialog/confirm.js';
+import './dialog/dialog.js';
+import './drawer.js';
+import './input-otp.js';
+import * as React from 'react';
+import './popover/index.js';
+import './progress.js';
+import './select/index.js';
+import './slider/index.js';
+import './sonner.js';
+import './switch.js';
+import './table/index.js';
+import './tabs/index.js';
+import './toggle/toggle.js';
+import './toggle/toggle-group.js';
+import './tooltip/index.js';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Slot } from '@radix-ui/react-slot';
+import { useFormContext, FormProvider, useForm as useForm$1, Controller } from 'react-hook-form';
+export { useFormContext } from 'react-hook-form';
+import { z } from 'zod';
+
+const FormFieldContext = React.createContext({});
+const FormField = ({
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
+};
+const FormItemContext = React.createContext({});
+const useFormField = () => {
+  const fieldContext = React.useContext(FormFieldContext);
+  const itemContext = React.useContext(FormItemContext);
+  const { getFieldState, formState } = useFormContext();
+  const fieldState = getFieldState(fieldContext.name, formState);
+  if (!fieldContext) {
+    throw new Error("useFormField should be used within <FormField>");
+  }
+  const { id } = itemContext;
+  return {
+    id,
+    name: fieldContext.name,
+    formItemId: `${id}-form-item`,
+    formDescriptionId: `${id}-form-item-description`,
+    formMessageId: `${id}-form-item-message`,
+    ...fieldState
+  };
+};
+const FormItem = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const id = React.useId();
+    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { ref, className: cn("space-y-2", className), ...props }) });
+  }
+);
+FormItem.displayName = "FormItem";
+const FormLabel = React.forwardRef(({ className, ...props }, ref) => {
+  const { error, formItemId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Label,
+    {
+      ref,
+      className: cn(error && "text-status-error", className),
+      htmlFor: formItemId,
+      ...props
+    }
+  );
+});
+FormLabel.displayName = "FormLabel";
+const FormControl = React.forwardRef(({ ...props }, ref) => {
+  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Slot,
+    {
+      ref,
+      id: formItemId,
+      "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
+      "aria-invalid": !!error,
+      ...props
+    }
+  );
+});
+FormControl.displayName = "FormControl";
+const FormDescription = React.forwardRef(({ className, ...props }, ref) => {
+  const { formDescriptionId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      ref,
+      id: formDescriptionId,
+      className: cn("text-sm text-text-secondary", className),
+      ...props
+    }
+  );
+});
+FormDescription.displayName = "FormDescription";
+const FormMessage = React.forwardRef(({ className, children, ...props }, ref) => {
+  const { error, formMessageId } = useFormField();
+  const body = error ? String(error?.message ?? "") : children;
+  if (!body) return null;
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      ref,
+      id: formMessageId,
+      className: cn("text-status-error text-2.5", className),
+      ...props,
+      children: body
+    }
+  );
+});
+FormMessage.displayName = "FormMessage";
+const Form = ({ form, children, ...props }) => /* @__PURE__ */ jsx(FormProvider, { ...form, children: /* @__PURE__ */ jsx("form", { ...props, children }) });
+Form.Item = FormItem;
+Form.Field = FormField;
+Form.Label = FormLabel;
+Form.Control = FormControl;
+Form.Description = FormDescription;
+Form.Message = FormMessage;
+const useForm = (fn, deps = []) => {
+  const formSchema = React.useMemo(() => {
+    const params = fn(z);
+    return {
+      ...params,
+      resolver: zodResolver(params.resolver)
+    };
+  }, deps);
+  return useForm$1(formSchema);
+};
+
+export { Form, useForm, useFormField };

package/dist/ui/index.d.ts

@@ -0,0 +1,24 @@
+export * from '@radix-ui/react-portal';
+export * from './avatar';
+export * from './badge';
+export * from './button';
+export * from './carousel';
+export * from './checkbox';
+export * from './collapsible';
+export * from './dialog';
+export * from './drawer';
+export * from './form';
+export * from './input-otp';
+export * from './label';
+export * from './masonry';
+export * from './popover';
+export * from './progress';
+export * from './select';
+export * from './slider';
+export * from './snap-input';
+export * from './sonner';
+export * from './switch';
+export * from './table';
+export * from './tabs';
+export * from './toggle';
+export * from './tooltip';

package/dist/ui/input-otp.d.ts

@@ -0,0 +1,14 @@
+import { OTPInput } from 'input-otp';
+import * as React from 'react';
+interface InputOTPComponent extends React.FC<React.ComponentPropsWithoutRef<typeof OTPInput>> {
+    Group: typeof InputOTPGroup;
+    Slot: typeof InputOTPSlot;
+    Separator: typeof InputOTPSeparator;
+}
+declare const InputOTP: InputOTPComponent & typeof OTPInput;
+declare const InputOTPGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSlot: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    index: number;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSeparator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { InputOTP };

package/dist/ui/input-otp.js

@@ -0,0 +1,73 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { OTPInput, OTPInputContext } from 'input-otp';
+import * as React from 'react';
+import { cn } from '../utils/config.js';
+import '@radix-ui/react-portal';
+import './avatar/index.js';
+import './button.js';
+import './carousel/index.js';
+import './checkbox/index.js';
+import './collapsible/index.js';
+import './dialog/confirm.js';
+import './dialog/dialog.js';
+import './drawer.js';
+import './form.js';
+import './label.js';
+import './popover/index.js';
+import './progress.js';
+import './select/index.js';
+import './slider/index.js';
+import './sonner.js';
+import './switch.js';
+import './table/index.js';
+import './tabs/index.js';
+import './toggle/toggle.js';
+import './toggle/toggle-group.js';
+import './tooltip/index.js';
+
+const InputOTP = React.forwardRef(({ containerClassName, ...props }, ref) => /* @__PURE__ */ jsx(
+  OTPInput,
+  {
+    ref,
+    containerClassName: cn(
+      "flex items-center gap-2 has-[:disabled]:opacity-50",
+      containerClassName
+    ),
+    ...props
+  }
+));
+InputOTP.displayName = "InputOTP";
+const InputOTPGroup = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("flex items-center", className), ...props })
+);
+InputOTPGroup.displayName = "InputOTPGroup";
+const InputOTPSlot = React.forwardRef(({ index, className, ...props }, ref) => {
+  const inputOTPContext = React.useContext(OTPInputContext);
+  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "relative mr-4 flex size-10 items-center justify-center border border-border-subtle rounded-3 text-3 transition-all duration-fast ease-smooth last:mr-0",
+        isActive && "z-10 ring-2 ring-border-focus ring-offset-background",
+        className
+      ),
+      ...props,
+      children: [
+        char,
+        hasFakeCaret && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "h-4 w-px bg-text-primary duration-1000" }) })
+      ]
+    }
+  );
+});
+InputOTPSlot.displayName = "InputOTPSlot";
+const InputOTPSeparator = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx("div", { className: cn("size-2 rounded-1/2 bg-surface-dim", className) }) })
+);
+InputOTPSeparator.displayName = "InputOTPSeparator";
+InputOTP.Group = InputOTPGroup;
+InputOTP.Slot = InputOTPSlot;
+InputOTP.Separator = InputOTPSeparator;
+
+export { InputOTP };

package/dist/ui/label.d.ts

@@ -0,0 +1,4 @@
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+export { Label };