@yuno-payments/dashboard-design-system 0.0.44 → 0.0.46

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { CardProps as ShadcnCardProps } from '../../../vendor/shadcn/card';
 interface CardProps extends ShadcnCardProps {
     children: ReactNode;

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

@@ -1,7 +1,7 @@
 import { ComponentProps } from 'react';
 import { Checkbox as ShadcnCheckbox } from '../../../vendor/shadcn/checkbox';
 export interface CheckboxProps extends Omit<ComponentProps<typeof ShadcnCheckbox>, "children"> {
-    label: string;
+    label?: string;
     description?: string;
 }
 declare const Checkbox: import('react').ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/atoms/checkbox/checkbox.js

@@ -1,32 +1,32 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as n, useId as i } from "react";
+import { forwardRef as i, useId as l } from "react";
 import { Checkbox as d } from "../../../vendor/shadcn/checkbox.js";
 import { Label as h } from "../../../vendor/shadcn/label.js";
-const p = n(
-  ({ label: r, description: s, id: t, name: a, ...c }, m) => {
-    const x = i(), o = t || a || x, l = /* @__PURE__ */ e.jsx(
+const p = i(
+  ({ label: s, description: r, id: c, name: a, ...m }, x) => {
+    const n = l(), o = c || a || n, t = /* @__PURE__ */ e.jsx(
       d,
       {
-        ref: m,
+        ref: x,
         id: o,
-        ...c,
+        ...m,
         className: "size-3.5 cursor-pointer"
       }
     );
-    return /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-2", children: [
-      l,
+    return s ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-2", children: [
+      t,
       /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5", children: [
         /* @__PURE__ */ e.jsx(
           h,
           {
             htmlFor: o,
             className: "text-sm leading-none cursor-pointer",
-            children: r
+            children: s
           }
         ),
-        s && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-neutral-500", children: s })
+        r && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-neutral-500", children: r })
       ] })
-    ] });
+    ] }) : t;
   }
 );
 p.displayName = "Checkbox";

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

@@ -8,6 +8,7 @@ interface IconProps extends Omit<PhosphorIconProps, "size">, VariantProps<typeof
     name: IconName;
     weight?: PhosphorIconWeight;
     className?: string;
+    tooltip?: string;
 }
 declare const Icon: import('react').ForwardRefExoticComponent<Omit<IconProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
 export { Icon, type IconProps };

package/dist/components/atoms/icon/icon.js

@@ -1,9 +1,10 @@
-import { j as a } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as c } from "react";
-import { cva as l } from "../../../node_modules/class-variance-authority/dist/index.js";
-import { cn as f } from "../../../lib/utils.js";
-import { IconList as p } from "./icon-list.js";
-const x = l("inline-flex items-center justify-center shrink-0", {
+import { j as t } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as f } from "react";
+import { cva as p } from "../../../node_modules/class-variance-authority/dist/index.js";
+import { cn as x } from "../../../lib/utils.js";
+import { IconList as z } from "./icon-list.js";
+import { Tooltip as d } from "../tooltip/tooltip.js";
+const u = p("inline-flex items-center justify-center shrink-0", {
   variants: {
     size: {
       xs: "size-3",
@@ -16,23 +17,23 @@ const x = l("inline-flex items-center justify-center shrink-0", {
   defaultVariants: {
     size: "md"
   }
-}), z = c(
-  ({ name: r, weight: i = "light", size: o, className: s, color: t, ...e }, n) => {
-    const m = p?.[r];
-    return /* @__PURE__ */ a.jsx(
-      m,
+}), j = f(
+  ({ name: r, weight: e = "light", size: s, className: n, color: m, tooltip: o, ...c }, a) => {
+    const l = z?.[r], i = /* @__PURE__ */ t.jsx(
+      l,
       {
-        ref: n,
+        ref: a,
         "aria-label": r,
-        className: f(x({ size: o }), s),
-        color: t || "currentColor",
-        weight: i,
-        ...e
+        className: x(u({ size: s }), n),
+        color: m || "currentColor",
+        weight: e,
+        ...c
       }
     );
+    return o ? /* @__PURE__ */ t.jsx(d, { content: o, children: i }) : i;
   }
 );
-z.displayName = "Icon";
+j.displayName = "Icon";
 export {
-  z as Icon
+  j as Icon
 };

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

@@ -10,11 +10,15 @@ export { FilterButton, FilterTag, FilterSection, FilterCheckboxOption, FilterRad
 export { FilterDropdown, FilterMenu, FilterMenuItem, type FilterDropdownProps, type FilterMenuProps, type FilterMenuItemProps, } from './filter-dropdown';
 export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, type DropdownMenuProps, type DropdownMenuPortalProps, type DropdownMenuTriggerProps, type DropdownMenuContentProps, type DropdownMenuGroupProps, type DropdownMenuLabelProps, type DropdownMenuItemProps, type DropdownMenuCheckboxItemProps, type DropdownMenuRadioGroupProps, type DropdownMenuRadioItemProps, type DropdownMenuSeparatorProps, type DropdownMenuShortcutProps, type DropdownMenuSubProps, type DropdownMenuSubTriggerProps, type DropdownMenuSubContentProps, } from './dropdown-menu';
 export { ToggleGroup, ToggleGroupItem, type ToggleGroupProps, type ToggleGroupItemProps, } from './toggle-group';
-export { Icon, type IconProps, type IconName } from './icon';
-export { Tooltip, type TooltipProps } from './tooltip';
+export { Tooltip, TooltipProvider, type TooltipProps, type TooltipProviderProps } from './tooltip';
 export { Input, type InputProps } from './input';
+export { RadioGroup, type RadioGroupProps, type RadioOption, RadioGroupBase, RadioGroupItem } from './radio-group';
+export { Skeleton } from './skeleton';
+export { Separator, type SeparatorProps } from './separator';
+export { Switch, type SwitchProps } from './switch';
+export { Textarea, type TextareaProps } from './textarea';
 export { Typography, type TypographyProps } from './typography';
+export { Icon, type IconProps, type IconName } from './icon';
 export { Alert, type AlertProps } from './alert';
 export { PasswordInput, type PasswordInputProps } from './password-input';
-export { Separator, type SeparatorProps } from './separator';
 export { Toaster, toast } from './toaster';

package/dist/components/atoms/input/input.js

@@ -1,12 +1,12 @@
 import { j as t } from "../../../_virtual/jsx-runtime.js";
 import { forwardRef as j, useId as N } from "react";
-import { cva as u } from "../../../node_modules/class-variance-authority/dist/index.js";
+import { cva as f } from "../../../node_modules/class-variance-authority/dist/index.js";
 import { Input as g } from "../../../vendor/shadcn/input.js";
 import { cn as e } from "../../../lib/utils.js";
 import { Label as y } from "../../../vendor/shadcn/label.js";
 import { Icon as b } from "../icon/icon.js";
 import { Button as I } from "../button/button.js";
-const V = u("flex gap-2 w-full", {
+const V = f("flex gap-2 w-full", {
   variants: {
     layout: {
       vertical: "flex-col",
@@ -16,7 +16,7 @@ const V = u("flex gap-2 w-full", {
   defaultVariants: {
     layout: "vertical"
   }
-}), w = u("text-sm", {
+}), w = f("text-sm", {
   variants: {
     layout: {
       vertical: "",
@@ -28,24 +28,24 @@ const V = u("flex gap-2 w-full", {
   }
 }), z = j(
   ({
-    className: f,
+    className: u,
     layout: l,
     label: o,
     description: r,
     error: a,
-    id: p,
+    id: x,
     button: m,
     disabled: c,
     endIcon: i,
     endIconProps: n,
-    ...x
+    ...p
   }, v) => {
-    const h = N(), s = p || h, d = !!a;
+    const h = N(), s = x || h, d = !!a;
     return /* @__PURE__ */ t.jsxs("div", { className: e(V({ layout: l })), children: [
       o && /* @__PURE__ */ t.jsx(y, { htmlFor: s, className: e(w({ layout: l })), children: o }),
       /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
         /* @__PURE__ */ t.jsxs("div", { className: "flex gap-2 items-center", children: [
-          /* @__PURE__ */ t.jsxs("div", { className: "relative flex-1", children: [
+          /* @__PURE__ */ t.jsxs("div", { className: "relative flex flex-1", children: [
             /* @__PURE__ */ t.jsx(
               g,
               {
@@ -55,11 +55,11 @@ const V = u("flex gap-2 w-full", {
                 className: e(
                   d && "border-destructive focus-visible:border-destructive",
                   i && "pr-9",
-                  f
+                  u
                 ),
                 "aria-invalid": d,
                 "aria-describedby": r || a ? `${s}-description` : void 0,
-                ...x
+                ...p
               }
             ),
             i && /* @__PURE__ */ t.jsx(

package/dist/components/atoms/password-input/password-input.js

@@ -1,59 +1,62 @@
-import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as d, useState as p } from "react";
+import { j as s } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as m, useState as p } from "react";
 import { cn as x } from "../../../lib/utils.js";
 import { Label as u } from "../../../vendor/shadcn/label.js";
 import { Button as f } from "../button/button.js";
-import { Input as l } from "../input/input.js";
-const j = d(
-  ({ defaultVisible: a = !1, label: t, forgotPasswordLinkProps: o, ...r }, n) => {
-    const [s, c] = p(a), i = () => {
-      c((m) => !m);
+import { Input as a } from "../input/input.js";
+const w = m(
+  ({ defaultVisible: l = !1, label: o, forgotPasswordLinkProps: t, ...r }, i) => {
+    const [e, c] = p(l), n = () => {
+      c((d) => !d);
     };
-    return o && t ? /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 w-full", children: [
-      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ e.jsx(u, { className: "text-sm", children: t }),
-        /* @__PURE__ */ e.jsx(
+    return t && o ? /* @__PURE__ */ s.jsxs("div", { className: "flex flex-col gap-2 w-full", children: [
+      /* @__PURE__ */ s.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ s.jsx(u, { className: "text-sm", children: o }),
+        /* @__PURE__ */ s.jsx(
           f,
           {
             variant: "link",
             className: x(
               "text-muted-foreground",
-              o?.className
+              t?.className
             ),
-            children: o.children || "Forgot password?"
+            ...t,
+            children: t.children || "Forgot password?"
           }
         )
       ] }),
-      /* @__PURE__ */ e.jsx(
-        l,
+      /* @__PURE__ */ s.jsx(
+        a,
         {
-          ref: n,
-          type: s ? "text" : "password",
-          endIcon: s ? "EyeClosed" : "Eye",
+          ref: i,
+          type: e ? "text" : "password",
+          endIcon: e ? "EyeClosed" : "Eye",
           endIconProps: {
-            onClick: i,
-            className: "cursor-pointer"
+            onClick: n,
+            className: "cursor-pointer",
+            tooltip: e ? "Hide password" : "Show password"
           },
           ...r
         }
       )
-    ] }) : /* @__PURE__ */ e.jsx(
-      l,
+    ] }) : /* @__PURE__ */ s.jsx(
+      a,
       {
-        ref: n,
-        label: t,
-        type: s ? "text" : "password",
-        endIcon: s ? "EyeClosed" : "Eye",
+        ref: i,
+        label: o,
+        type: e ? "text" : "password",
+        endIcon: e ? "EyeClosed" : "Eye",
         endIconProps: {
-          onClick: i,
-          className: "cursor-pointer"
+          onClick: n,
+          className: "cursor-pointer",
+          tooltip: e ? "Hide password" : "Show password"
         },
         ...r
       }
     );
   }
 );
-j.displayName = "PasswordInput";
+w.displayName = "PasswordInput";
 export {
-  j as PasswordInput
+  w as PasswordInput
 };

package/dist/components/atoms/radio-group/index.d.ts

@@ -1 +1,2 @@
 export { RadioGroup, type RadioGroupProps, type RadioOption, } from './radio-group';
+export { RadioGroup as RadioGroupBase, RadioGroupItem } from '../../../vendor/shadcn/radio-group';

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

@@ -0,0 +1,33 @@
+import { j as a } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as i } from "react";
+import { RadioGroup as c, RadioGroupItem as m } from "../../../vendor/shadcn/radio-group.js";
+import { Label as o } from "../../../vendor/shadcn/label.js";
+const u = i(({ options: s, name: d, ...t }, l) => /* @__PURE__ */ a.jsx(c, { ref: l, className: "gap-3", ...t, children: s.map((e) => {
+  const r = `${d}-${e.value}`;
+  return /* @__PURE__ */ a.jsxs("div", { className: "flex items-start gap-3", children: [
+    /* @__PURE__ */ a.jsx(
+      m,
+      {
+        value: e.value,
+        id: r,
+        disabled: e.disabled,
+        className: "size-3.5 data-[state=unchecked]:bg-white data-[state=unchecked]:border-neutral-200 data-[state=checked]:border-primary cursor-pointer"
+      }
+    ),
+    /* @__PURE__ */ a.jsxs("div", { className: "flex flex-col gap-1.5 flex-1", children: [
+      /* @__PURE__ */ a.jsx(
+        o,
+        {
+          htmlFor: r,
+          className: "text-sm leading-none cursor-pointer",
+          children: e.label
+        }
+      ),
+      e.description && /* @__PURE__ */ a.jsx("p", { className: "text-sm text-neutral-500", children: e.description })
+    ] })
+  ] }, e.value);
+}) }));
+u.displayName = "RadioGroup";
+export {
+  u as RadioGroup
+};

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

@@ -0,0 +1,47 @@
+import { j as e } from "../../../_virtual/jsx-runtime.js";
+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: 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: m,
+        id: r,
+        className: "cursor-pointer",
+        ...c
+      }
+    ), 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(
+          u,
+          {
+            htmlFor: r,
+            className: "text-sm leading-[18.39px] cursor-pointer",
+            children: t
+          }
+        ),
+        s && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-neutral-500", children: s })
+      ] })
+    ] });
+  }
+);
+j.displayName = "Switch";
+export {
+  j as Switch
+};

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

@@ -0,0 +1 @@
+export { Textarea, type TextareaProps } from './textarea';

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

@@ -0,0 +1,12 @@
+import { TextareaHTMLAttributes } from 'react';
+import { VariantProps } from 'class-variance-authority';
+declare const textareaWrapperVariants: (props?: ({
+    layout?: "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textareaWrapperVariants> {
+    label?: string;
+    description?: string;
+    error?: string;
+}
+declare const Textarea: import('react').ForwardRefExoticComponent<TextareaProps & import('react').RefAttributes<HTMLTextAreaElement>>;
+export { Textarea };

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

@@ -0,0 +1,75 @@
+import { j as t } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as u, useId as v } from "react";
+import { cva as c } from "../../../node_modules/class-variance-authority/dist/index.js";
+import { Textarea as h } from "../../../vendor/shadcn/textarea.js";
+import { cn as r } from "../../../lib/utils.js";
+import { Label as j } from "../../../vendor/shadcn/label.js";
+const b = c("flex gap-2 w-full", {
+  variants: {
+    layout: {
+      vertical: "flex-col",
+      horizontal: "flex-row items-start gap-4"
+    }
+  },
+  defaultVariants: {
+    layout: "vertical"
+  }
+}), N = c("text-sm", {
+  variants: {
+    layout: {
+      vertical: "",
+      horizontal: "mt-2"
+    }
+  },
+  defaultVariants: {
+    layout: "vertical"
+  }
+}), g = u(
+  ({
+    className: d,
+    layout: i,
+    label: o,
+    description: s,
+    error: a,
+    id: n,
+    disabled: m,
+    ...x
+  }, f) => {
+    const p = v(), e = n || p, l = !!a;
+    return /* @__PURE__ */ t.jsxs("div", { className: r(b({ layout: i })), children: [
+      o && /* @__PURE__ */ t.jsx(j, { htmlFor: e, className: r(N({ layout: i })), children: o }),
+      /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
+        /* @__PURE__ */ t.jsx(
+          h,
+          {
+            ref: f,
+            id: e,
+            disabled: m,
+            className: r(
+              l && "border-destructive focus-visible:border-destructive",
+              d
+            ),
+            "aria-invalid": l,
+            "aria-describedby": s || a ? `${e}-description` : void 0,
+            ...x
+          }
+        ),
+        (s || a) && /* @__PURE__ */ t.jsx(
+          "p",
+          {
+            id: `${e}-description`,
+            className: r(
+              "text-sm",
+              a ? "text-destructive" : "text-muted-foreground"
+            ),
+            children: a || s
+          }
+        )
+      ] })
+    ] });
+  }
+);
+g.displayName = "Textarea";
+export {
+  g as Textarea
+};

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

@@ -1 +1 @@
-export { Tooltip, type TooltipProps } from './tooltip';
+export { Tooltip, TooltipProvider, type TooltipProps, type TooltipProviderProps } from './tooltip';

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

@@ -11,4 +11,4 @@ interface TooltipProps extends ShadcnTooltipRootProps {
     triggerProps?: TooltipTriggerProps;
 }
 declare const Tooltip: import('react').ForwardRefExoticComponent<TooltipProps & import('react').RefAttributes<HTMLDivElement>>;
-export { Tooltip, type TooltipProps };
+export { Tooltip, TooltipProvider, type TooltipProps, type TooltipProviderProps };

package/dist/components/atoms/tooltip/tooltip.js

@@ -1,23 +1,21 @@
 import { j as o } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m, Fragment as T } from "react";
-import { TooltipProvider as x, Tooltip as a, TooltipTrigger as d, TooltipContent as j } from "../../../vendor/shadcn/tooltip.js";
-const c = m(
+import { forwardRef as n } from "react";
+import { TooltipProvider as m, Tooltip as T, TooltipTrigger as a, TooltipContent as d } from "../../../vendor/shadcn/tooltip.js";
+const x = n(
   ({
-    content: t,
+    content: r,
     children: i,
-    contentProps: e,
-    providerProps: r,
-    triggerProps: l,
-    ...p
-  }, s) => {
-    const n = r ? x : T;
-    return /* @__PURE__ */ o.jsx(n, { ...r, children: /* @__PURE__ */ o.jsxs(a, { ...p, children: [
-      /* @__PURE__ */ o.jsx(d, { ...l, children: i }),
-      /* @__PURE__ */ o.jsx(j, { ref: s, ...e, children: t })
-    ] }) });
-  }
+    contentProps: t,
+    providerProps: p,
+    triggerProps: e,
+    ...l
+  }, s) => /* @__PURE__ */ o.jsx(m, { delayDuration: 0, ...p, children: /* @__PURE__ */ o.jsxs(T, { ...l, children: [
+    /* @__PURE__ */ o.jsx(a, { ...e, children: i }),
+    /* @__PURE__ */ o.jsx(d, { ref: s, ...t, children: r })
+  ] }) })
 );
-c.displayName = "Tooltip";
+x.displayName = "Tooltip";
 export {
-  c as Tooltip
+  x as Tooltip,
+  m as TooltipProvider
 };