@yuno-payments/dashboard-design-system 0.0.166 → 0.0.170

package/dist/components/atoms/switch/switch.d.ts

@@ -1,64 +1,10 @@
 import { Switch as ShadcnSwitch } from '../../../vendor/shadcn/switch';
-import { ComponentProps, ChangeEvent } from 'react';
-/**
- * Props for the Switch component
- */
-export interface SwitchProps extends Omit<ComponentProps<typeof ShadcnSwitch>, "children" | "onCheckedChange" | "className" | "onChange"> {
-    /**
-     * Label text displayed next to the switch
-     */
+import { ComponentProps } from 'react';
+export interface SwitchProps extends Omit<ComponentProps<typeof ShadcnSwitch>, "children"> {
     label: string;
-    /**
-     * Optional description text displayed below the label
-     */
     description?: string;
-    /**
-     * Position of the switch relative to the label
-     * @default "left"
-     */
     side?: "left" | "right";
-    /**
-     * Visual variant of the switch container
-     * - "default": minimal layout without background
-     * - "box": contained layout with background, border, and padding
-     * @default "default"
-     */
     variant?: "default" | "box";
-    /**
-     * Callback fired when the switch state changes
-     * Provides a synthetic ChangeEvent compatible with react-hook-form
-     */
-    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Additional CSS classes to apply to the wrapper container
-     */
-    className?: string;
-    /**
-     * Additional CSS classes to apply to the switch element itself
-     */
-    switchClassName?: string;
-    /**
-     * Additional CSS classes to apply to the label element
-     */
-    labelClassName?: string;
-    /**
-     * Optional info icon with tooltip
-     */
-    info?: string;
 }
-/**
- * Toggle switch component with label and optional description.
- * Supports left/right positioning and box variant for emphasized display.
- *
- * @example
- * ```tsx
- * <Switch
- *   label="Enable notifications"
- *   description="Receive email notifications for updates"
- *   checked={isEnabled}
- *   onChange={(e) => setIsEnabled(e.target.checked)}
- * />
- * ```
- */
 declare const Switch: import('react').ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
 export { Switch };

package/dist/components/atoms/switch/switch.js

@@ -1,79 +1,47 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { Switch as v } from "../../../vendor/shadcn/switch.js";
-import { forwardRef as N, useId as y } from "react";
-import { cn as o } from "../../../lib/utils.js";
-import { Label as S } from "../label/label.js";
-const C = N(
+import { Switch as p } from "../../../vendor/shadcn/switch.js";
+import { forwardRef as f, useId as h } from "react";
+import { cn as w } from "../../../lib/utils.js";
+import { Label as u } from "../../../vendor/shadcn/label.js";
+const j = f(
   ({
-    label: c,
-    description: a,
-    side: i = "left",
-    variant: l = "default",
-    id: d,
-    name: t,
-    onChange: n,
-    className: m,
-    switchClassName: x,
-    info: f,
-    labelClassName: p,
-    ...h
-  }, u) => {
-    const g = y(), r = d || t || g, w = (s) => {
-      if (!n) return;
-      n({
-        target: {
-          name: t || r,
-          checked: s,
-          type: "checkbox",
-          value: s ? "on" : "off"
-        },
-        currentTarget: {
-          name: t || r,
-          checked: s,
-          type: "checkbox",
-          value: s ? "on" : "off"
-        },
-        preventDefault: () => {
-        },
-        stopPropagation: () => {
-        }
-      });
-    }, b = /* @__PURE__ */ e.jsx(
-      v,
+    label: t,
+    description: s,
+    side: o = "left",
+    variant: a = "default",
+    id: i,
+    name: l,
+    ...c
+  }, m) => {
+    const x = h(), r = i || l || x, d = /* @__PURE__ */ e.jsx(
+      p,
       {
-        ref: u,
+        ref: m,
         id: r,
-        name: t,
-        className: o("cursor-pointer", x),
-        onCheckedChange: w,
-        ...h
+        className: "cursor-pointer",
+        ...c
       }
-    ), j = o(
-      "flex gap-2 items-start",
-      {
-        "flex-row-reverse": i === "right",
-        "bg-background box-border justify-start p-4 rounded-lg border shadow-xs": l === "box"
-      },
-      m
-    );
-    return /* @__PURE__ */ e.jsxs("div", { className: j, children: [
-      b,
+    ), n = w("flex gap-3 items-start", {
+      "flex-row-reverse": o === "right",
+      "bg-white box-border justify-start p-4 rounded-lg border shadow-xs": a === "box"
+    });
+    return /* @__PURE__ */ e.jsxs("div", { className: n, children: [
+      d,
       /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ e.jsx(
-          S,
+        /* @__PURE__ */ e.jsx(
+          u,
           {
             htmlFor: r,
-            info: f,
-            className: o("text-sm leading-[18.39px] cursor-pointer", p),
-            children: c
+            className: "text-sm leading-[18.39px] cursor-pointer",
+            children: t
           }
-        ) }),
-        a && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-muted-foreground", children: a })
+        ),
+        s && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-neutral-500", children: s })
       ] })
     ] });
   }
 );
-C.displayName = "Switch";
+j.displayName = "Switch";
 export {
-  C as Switch
+  j as Switch
 };

package/dist/components/atoms/tabs/index.d.ts

@@ -1,17 +1 @@
-/**
- * Tabs components for organizing content into switchable panels.
- * Composed of Tabs (root), TabsList, TabsTrigger, and TabsContent.
- *
- * @example
- * ```tsx
- * <Tabs defaultValue="tab1">
- *   <TabsList>
- *     <TabsTrigger value="tab1">Tab 1</TabsTrigger>
- *     <TabsTrigger value="tab2">Tab 2</TabsTrigger>
- *   </TabsList>
- *   <TabsContent value="tab1">Content 1</TabsContent>
- *   <TabsContent value="tab2">Content 2</TabsContent>
- * </Tabs>
- * ```
- */
 export { Tabs, TabsList, TabsTrigger, TabsContent } from '../../../vendor/shadcn/tabs';

package/dist/components/atoms/textarea/textarea.d.ts

@@ -3,44 +3,12 @@ import { VariantProps } from 'class-variance-authority';
 declare const textareaWrapperVariants: (props?: ({
     layout?: "horizontal" | "vertical" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-/**
- * Props for the Textarea component
- */
 export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "className">, VariantProps<typeof textareaWrapperVariants> {
-    /**
-     * Label text displayed above or next to the textarea
-     */
     label?: string;
-    /**
-     * Helper text displayed below the textarea
-     */
     description?: string;
-    /**
-     * Error message displayed below the textarea (overrides description)
-     */
     error?: string;
-    /**
-     * Additional CSS classes for the container
-     */
     className?: string;
-    /**
-     * Additional props to pass to the textarea element
-     */
     textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
 }
-/**
- * Multiline text input component with label, description, and error handling.
- * Supports vertical and horizontal layouts.
- *
- * @example
- * ```tsx
- * <Textarea
- *   label="Comments"
- *   placeholder="Enter your comments..."
- *   description="Max 500 characters"
- *   rows={4}
- * />
- * ```
- */
 declare const Textarea: import('react').ForwardRefExoticComponent<TextareaProps & import('react').RefAttributes<HTMLTextAreaElement>>;
 export { Textarea };

package/dist/components/atoms/textarea/textarea.js

@@ -3,7 +3,7 @@ import { forwardRef as p, useId as h } from "react";
 import { cva as d } from "../../../node_modules/class-variance-authority/dist/index.js";
 import { Textarea as j } from "../../../vendor/shadcn/textarea.js";
 import { cn as s } from "../../../lib/utils.js";
-import { Label as N } from "../label/label.js";
+import { Label as N } from "../../../vendor/shadcn/label.js";
 const b = d("flex gap-2 w-full", {
   variants: {
     layout: {

package/dist/components/atoms/time-picker/time-picker.d.ts

@@ -1,75 +1,4 @@
 import { TimePickerProps as TimePickerPrimitiveProps } from '../../../vendor/shadcn/time-picker';
-import * as React from "react";
-/**
- * Props for the TimePicker component
- */
-export interface TimePickerProps extends Omit<TimePickerPrimitiveProps, "onChange"> {
-    /**
-     * Label text displayed above the input
-     */
-    label?: string;
-    /**
-     * Error message displayed below the input
-     */
-    error?: string;
-    /**
-     * Helper text displayed below the input
-     */
-    description?: string;
-    /**
-     * Layout orientation
-     * @default "vertical"
-     */
-    orientation?: "vertical" | "horizontal" | "responsive";
-    /**
-     * Callback fired when the time value changes
-     */
-    onChange?: (value: string) => void;
-    /**
-     * Picker mode
-     * - "native": HTML5 native input (default)
-     * - "dropdown": Custom dropdown with columns
-     * @default "native"
-     */
-    mode?: "native" | "dropdown";
-    /**
-     * Minute intervals (only for mode="dropdown")
-     * 0 = all minutes, 15 = every 15 minutes, etc.
-     * @default 0
-     */
-    divisorMinutes?: number;
-    /**
-     * Width of the picker (only for mode="dropdown")
-     * @default 140
-     */
-    width?: number | string;
-    /**
-     * Use 24-hour format (military time) instead of 12-hour with AM/PM
-     * @default false
-     */
-    use24Hour?: boolean;
-}
-/**
- * Time input picker with label, description, and error handling.
- * Supports two modes: native HTML5 input or custom dropdown.
- *
- * @example
- * ```tsx
- * // Native mode (default)
- * <TimePicker
- *   label="Select time"
- *   value={time}
- *   onChange={(value) => setTime(value)}
- * />
- *
- * // Dropdown mode with 15-minute intervals
- * <TimePicker
- *   mode="dropdown"
- *   divisorMinutes={15}
- *   value={time}
- *   onChange={(value) => setTime(value)}
- * />
- * ```
- */
-declare const TimePicker: React.ForwardRefExoticComponent<TimePickerProps & React.RefAttributes<HTMLInputElement>>;
+export type TimePickerProps = TimePickerPrimitiveProps;
+declare const TimePicker: import('react').ForwardRefExoticComponent<TimePickerPrimitiveProps & import('react').RefAttributes<HTMLInputElement>>;
 export { TimePicker };

package/dist/components/atoms/time-picker/time-picker.js

@@ -1,220 +1,5 @@
-import { j as r } from "../../../_virtual/jsx-runtime.js";
-import * as G from "react";
-import { useId as J, useState as $, useRef as C, useEffect as E } from "react";
-import { cn as c } from "../../../lib/utils.js";
-import { Icon as K } from "../icon/icon.js";
-import { TimePicker as Q } from "../../../vendor/shadcn/time-picker.js";
-import { Field as R, FieldLabel as T, FieldDescription as O, FieldError as _ } from "../../../vendor/shadcn/field.js";
-const X = Array.from({ length: 12 }, (e, n) => n + 1), Y = Array.from({ length: 24 }, (e, n) => n), Z = ["AM", "PM"], H = (e) => {
-  if (e === 0)
-    return Array.from({ length: 60 }, (o, i) => i);
-  const n = 60 / e;
-  return Array.from({ length: n }, (o, i) => i * e);
-}, d = (e) => e.toString().padStart(2, "0"), ee = (e) => {
-  const n = e >= 12 ? "PM" : "AM";
-  return { hour: e === 0 ? 12 : e > 12 ? e - 12 : e, meridiem: n };
-}, te = (e, n) => e === 12 ? n === "AM" ? 0 : 12 : n === "PM" ? e + 12 : e, re = G.forwardRef(
-  ({
-    className: e,
-    label: n,
-    error: o,
-    description: i,
-    orientation: x = "vertical",
-    id: m,
-    onChange: f,
-    mode: y = "native",
-    divisorMinutes: j = 0,
-    width: s = 140,
-    value: l,
-    disabled: p,
-    use24Hour: w = !1,
-    ...h
-  }, P) => {
-    const S = J(), u = m || S, v = !!o;
-    if (y === "native") {
-      const k = /* @__PURE__ */ r.jsx(
-        Q,
-        {
-          ref: P,
-          id: u,
-          value: l,
-          disabled: p,
-          className: c(
-            v && "border-destructive focus-visible:border-destructive",
-            !(n || o || i) && e
-          ),
-          "aria-invalid": v ? !0 : void 0,
-          "aria-describedby": i || o ? `${u}-description` : void 0,
-          ...h,
-          onChange: (a) => {
-            f?.(a.target.value);
-          }
-        }
-      );
-      return n || o || i ? /* @__PURE__ */ r.jsxs(
-        R,
-        {
-          orientation: x,
-          "data-invalid": v,
-          className: c("w-full", e),
-          children: [
-            n && /* @__PURE__ */ r.jsx(T, { htmlFor: u, children: n }),
-            /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-              k,
-              i && !o && /* @__PURE__ */ r.jsx(O, { id: `${u}-description`, children: i }),
-              o && /* @__PURE__ */ r.jsx(_, { id: `${u}-description`, children: o })
-            ] })
-          ]
-        }
-      ) : k;
-    }
-    return /* @__PURE__ */ r.jsx(
-      ne,
-      {
-        value: l || (w ? "00:00" : "12:00"),
-        onChange: f,
-        divisorMinutes: j,
-        width: s,
-        label: n,
-        error: o,
-        description: i,
-        disabled: p,
-        className: e,
-        use24Hour: w
-      }
-    );
-  }
-);
-re.displayName = "TimePicker";
-const ne = ({
-  value: e,
-  onChange: n,
-  divisorMinutes: o,
-  width: i,
-  label: x,
-  error: m,
-  description: f,
-  disabled: y,
-  className: j,
-  use24Hour: s = !1
-}) => {
-  const [l, p] = $(!1), w = C(null), h = C(null), P = (t) => {
-    const [g, B] = t.split(":"), N = parseInt(g, 10) || 0, A = parseInt(B, 10) || 0;
-    if (s)
-      return { hour24: N, minute: A, hour: N, meridiem: "AM" };
-    const { hour: W, meridiem: q } = ee(N);
-    return { hour24: N, minute: A, hour: W, meridiem: q };
-  }, { hour: S, hour24: u, minute: v, meridiem: k } = P(e), [a, D] = $(s ? u : S), [b, F] = $(v), [M, L] = $(k), U = H(o);
-  E(() => {
-    let t;
-    s ? t = a : t = te(a, M);
-    const g = `${d(t)}:${d(b)}`;
-    n?.(g);
-  }, [a, b, M, n, s]), E(() => {
-    const t = (g) => {
-      h.current && !h.current.contains(g.target) && p(!1);
-    };
-    if (l)
-      return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
-  }, [l]);
-  const V = s ? `${d(a)}:${d(b)}` : `${d(a)}:${d(b)} ${M}`, z = s ? Y : X, I = /* @__PURE__ */ r.jsxs(
-    "div",
-    {
-      ref: h,
-      className: c("relative inline-block", j),
-      style: { width: typeof i == "number" ? `${i}px` : i },
-      children: [
-        /* @__PURE__ */ r.jsxs(
-          "button",
-          {
-            type: "button",
-            disabled: y,
-            onClick: () => !y && p(!l),
-            className: c(
-              "flex items-center justify-between w-full h-9 px-3 py-2",
-              "text-sm rounded-md border border-input bg-background",
-              "hover:bg-accent hover:text-accent-foreground",
-              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-              "disabled:cursor-not-allowed disabled:opacity-50",
-              m && "border-destructive"
-            ),
-            children: [
-              /* @__PURE__ */ r.jsx("span", { children: V }),
-              /* @__PURE__ */ r.jsx(
-                K,
-                {
-                  name: l ? "CaretUp" : "CaretDown",
-                  size: "sm",
-                  className: "ml-2"
-                }
-              )
-            ]
-          }
-        ),
-        l && /* @__PURE__ */ r.jsxs(
-          "div",
-          {
-            ref: w,
-            className: c(
-              "absolute z-50 mt-1 bg-popover border border-border rounded-md shadow-lg",
-              "flex divide-x divide-border"
-            ),
-            style: { width: "fit-content", minWidth: s ? "140px" : "200px" },
-            children: [
-              /* @__PURE__ */ r.jsx("div", { className: "flex flex-col overflow-y-auto max-h-[200px] min-w-[60px]", children: z.map((t) => /* @__PURE__ */ r.jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => D(t),
-                  className: c(
-                    "px-3 py-2 text-sm text-left hover:bg-accent",
-                    a === t && "bg-primary text-primary-foreground hover:bg-primary"
-                  ),
-                  children: d(t)
-                },
-                t
-              )) }),
-              /* @__PURE__ */ r.jsx("div", { className: "flex flex-col overflow-y-auto max-h-[200px] min-w-[60px]", children: U.map((t) => /* @__PURE__ */ r.jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => F(t),
-                  className: c(
-                    "px-3 py-2 text-sm text-left hover:bg-accent",
-                    b === t && "bg-primary text-primary-foreground hover:bg-primary"
-                  ),
-                  children: d(t)
-                },
-                t
-              )) }),
-              !s && /* @__PURE__ */ r.jsx("div", { className: "flex flex-col min-w-[60px]", children: Z.map((t) => /* @__PURE__ */ r.jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => L(t),
-                  className: c(
-                    "px-3 py-2 text-sm text-left hover:bg-accent",
-                    M === t && "bg-primary text-primary-foreground hover:bg-primary"
-                  ),
-                  children: t
-                },
-                t
-              )) })
-            ]
-          }
-        )
-      ]
-    }
-  );
-  return x || m || f ? /* @__PURE__ */ r.jsxs(R, { orientation: "vertical", className: c("w-full", j), children: [
-    x && /* @__PURE__ */ r.jsx(T, { children: x }),
-    /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-      I,
-      f && !m && /* @__PURE__ */ r.jsx(O, { children: f }),
-      m && /* @__PURE__ */ r.jsx(_, { children: m })
-    ] })
-  ] }) : I;
-};
+import { TimePicker as e } from "../../../vendor/shadcn/time-picker.js";
+const r = e;
 export {
-  re as TimePicker
+  r as TimePicker
 };

package/dist/components/atoms/toaster/index.d.ts

@@ -1,16 +1 @@
-/**
- * Toast notification container component (based on Sonner).
- * Place once at root level to enable toast notifications globally.
- * Use with toast() function from sonner.
- *
- * @example
- * ```tsx
- * // In root layout:
- * <Toaster />
- *
- * // Anywhere in app:
- * import { toast } from 'sonner';
- * toast.success('Operation successful!');
- * ```
- */
 export { Toaster } from '../../../vendor/shadcn/sonner';

package/dist/components/atoms/toggle-group/toggle-group.d.ts

@@ -2,35 +2,10 @@ import { ToggleGroup as ShadcnToggleGroup, ToggleGroupItem as ShadcnToggleGroupI
 import { VariantProps } from 'class-variance-authority';
 import { toggleVariants } from '../../../vendor/shadcn/toggle';
 import * as React from "react";
-/**
- * Props for the ToggleGroup component
- */
-export interface ToggleGroupProps extends Omit<React.ComponentPropsWithoutRef<typeof ShadcnToggleGroup>, "onValueChange">, VariantProps<typeof toggleVariants> {
-    /**
-     * Callback fired when the selected value changes
-     */
-    onChange?: (value: string) => void;
+export interface ToggleGroupProps extends React.ComponentPropsWithoutRef<typeof ShadcnToggleGroup>, VariantProps<typeof toggleVariants> {
 }
-/**
- * Props for the ToggleGroupItem component
- */
 export interface ToggleGroupItemProps extends React.ComponentPropsWithoutRef<typeof ShadcnToggleGroupItem>, VariantProps<typeof toggleVariants> {
 }
-/**
- * Group of toggle buttons for single or multiple selection.
- *
- * @example
- * ```tsx
- * <ToggleGroup type="single" value={selected} onChange={setSelected}>
- *   <ToggleGroupItem value="left">Left</ToggleGroupItem>
- *   <ToggleGroupItem value="center">Center</ToggleGroupItem>
- *   <ToggleGroupItem value="right">Right</ToggleGroupItem>
- * </ToggleGroup>
- * ```
- */
 declare const ToggleGroup: React.ForwardRefExoticComponent<ToggleGroupProps & React.RefAttributes<HTMLDivElement>>;
-/**
- * Individual toggle button within a ToggleGroup
- */
 declare const ToggleGroupItem: React.ForwardRefExoticComponent<ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
 export { ToggleGroup, ToggleGroupItem };

package/dist/components/atoms/toggle-group/toggle-group.js

@@ -1,33 +1,32 @@
-import { j as p } from "../../../_virtual/jsx-runtime.js";
-import * as s from "react";
-import { ToggleGroup as u, ToggleGroupItem as f } from "../../../vendor/shadcn/toggle-group.js";
+import { j as s } from "../../../_virtual/jsx-runtime.js";
+import * as a from "react";
+import { ToggleGroup as l, ToggleGroupItem as u } from "../../../vendor/shadcn/toggle-group.js";
 import { cn as t } from "../../../lib/utils.js";
-const n = s.forwardRef(({ className: o, variant: r, size: e, children: a, onChange: g, ...m }, l) => /* @__PURE__ */ p.jsx(
-  u,
+const f = a.forwardRef(({ className: o, variant: r, size: e, children: m, ...g }, p) => /* @__PURE__ */ s.jsx(
+  l,
   {
-    ref: l,
+    ref: p,
     className: t(o),
     variant: r,
     size: e,
-    onValueChange: g,
-    ...m,
-    children: a
+    ...g,
+    children: m
   }
 ));
-n.displayName = "ToggleGroup";
-const G = s.forwardRef(({ className: o, variant: r, size: e, children: a, ...g }, m) => /* @__PURE__ */ p.jsx(
-  f,
+f.displayName = "ToggleGroup";
+const G = a.forwardRef(({ className: o, variant: r, size: e, children: m, ...g }, p) => /* @__PURE__ */ s.jsx(
+  u,
   {
-    ref: m,
+    ref: p,
     className: t(o),
     variant: r,
     size: e,
     ...g,
-    children: a
+    children: m
   }
 ));
 G.displayName = "ToggleGroupItem";
 export {
-  n as ToggleGroup,
+  f as ToggleGroup,
   G as ToggleGroupItem
 };