@yuno-payments/dashboard-design-system 0.0.152 → 0.0.155

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

@@ -17,6 +17,14 @@ export interface CheckboxProps extends Omit<ComponentProps<typeof ShadcnCheckbox
      * Provides a synthetic ChangeEvent compatible with react-hook-form
      */
     onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Additional CSS classes to apply to the label element
+     */
+    labelClassName?: string;
+    /**
+     * Optional info icon with tooltip
+     */
+    info?: string;
 }
 /**
  * Checkbox component with optional label and description.

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

@@ -1,11 +1,21 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as u, useId as d } from "react";
-import { Checkbox as g } from "../../../vendor/shadcn/checkbox.js";
+import { forwardRef as g, useId as C } from "react";
+import { Checkbox as j } from "../../../vendor/shadcn/checkbox.js";
 import { cn as x } from "../../../lib/utils.js";
-import { Label as C } from "../../../vendor/shadcn/label.js";
-const j = u(
-  ({ label: n, description: c, id: i, name: t, disabled: s, onChange: a, ...f }, l) => {
-    const p = d(), o = i || t || p, h = (r) => {
+import { Label as k } from "../label/label.js";
+const v = g(
+  ({
+    label: n,
+    description: c,
+    id: i,
+    name: t,
+    disabled: s,
+    onChange: a,
+    labelClassName: f,
+    info: l,
+    ...p
+  }, h) => {
+    const u = C(), o = i || t || u, d = (r) => {
       if (!a) return;
       a({
         target: {
@@ -26,14 +36,14 @@ const j = u(
         }
       });
     }, m = /* @__PURE__ */ e.jsx(
-      g,
+      j,
       {
-        ref: l,
+        ref: h,
         id: o,
         name: t,
         disabled: s,
-        onCheckedChange: h,
-        ...f,
+        onCheckedChange: d,
+        ...p,
         className: "size-3.5 cursor-pointer"
       }
     );
@@ -41,12 +51,14 @@ const j = u(
       m,
       /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5", children: [
         /* @__PURE__ */ e.jsx(
-          C,
+          k,
           {
             htmlFor: o,
+            info: l,
             className: x(
               "text-sm leading-none cursor-pointer",
-              s && "text-muted-foreground"
+              s && "text-muted-foreground",
+              f
             ),
             children: n
           }
@@ -65,7 +77,7 @@ const j = u(
     ] }) : m;
   }
 );
-j.displayName = "Checkbox";
+v.displayName = "Checkbox";
 export {
-  j as Checkbox
+  v as Checkbox
 };

package/dist/components/atoms/combobox/combobox.js

@@ -3,7 +3,7 @@ import { forwardRef as Y, useState as y, useRef as Z, useEffect as I } from "rea
 import { cn as m } from "../../../lib/utils.js";
 import { Combobox as _, ComboboxTrigger as A, ComboboxContent as W } from "../../../vendor/shadcn/combobox.js";
 import { Icon as $ } from "../icon/icon.js";
-import { Label as P } from "../../../vendor/shadcn/label.js";
+import { Label as P } from "../label/label.js";
 import { Typography as C } from "../typography/typography.js";
 import { Badge as N } from "../badge/badge.js";
 import { Checkbox as ee } from "../checkbox/checkbox.js";

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

@@ -1 +1 @@
-export { Label } from '../../../vendor/shadcn/label';
+export { Label } from './label';

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

@@ -0,0 +1,11 @@
+import { Label as ShadcnLabel } from '../../../vendor/shadcn/label';
+import { ComponentProps } from 'react';
+interface LabelProps extends ComponentProps<typeof ShadcnLabel> {
+    info?: string;
+    className?: string;
+}
+declare const Label: {
+    ({ htmlFor, className, info, ...props }: LabelProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Label };

package/dist/components/atoms/label/label.js

@@ -0,0 +1,28 @@
+import { j as e } from "../../../_virtual/jsx-runtime.js";
+import { cn as o } from "../../../lib/utils.js";
+import { Label as a } from "../../../vendor/shadcn/label.js";
+import "react";
+import { Icon as i } from "../icon/icon.js";
+const l = ({ htmlFor: r, className: t, info: s, ...m }) => /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+  /* @__PURE__ */ e.jsx(
+    a,
+    {
+      htmlFor: r,
+      className: o("text-sm leading-[18.39px] cursor-pointer", t),
+      ...m
+    }
+  ),
+  s && /* @__PURE__ */ e.jsx(
+    i,
+    {
+      name: "Info",
+      size: "sm",
+      className: "text-muted-foreground",
+      tooltip: s
+    }
+  )
+] });
+l.displayName = "Label";
+export {
+  l as Label
+};

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

@@ -1,7 +1,7 @@
 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 f } from "../../../vendor/shadcn/label.js";
+import { Label as f } from "../label/label.js";
 import { Link as w } from "../link/link.js";
 import { Field as d } from "../field/field.js";
 const u = m(

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

@@ -1,7 +1,7 @@
 import { j as r } from "../../../_virtual/jsx-runtime.js";
 import { RadioGroupItem as d } from "../../../vendor/shadcn/radio-group.js";
 import { cn as a } from "../../../lib/utils.js";
-import { Label as l } from "../../../vendor/shadcn/label.js";
+import { Label as l } from "../label/label.js";
 const o = ({
   option: e,
   radioId: s,

package/dist/components/atoms/search-field/search-field.js

@@ -4,7 +4,7 @@ import { cn as r } from "../../../lib/utils.js";
 import { Input as Z } from "../../../vendor/shadcn/input.js";
 import { Icon as w } from "../icon/icon.js";
 import { cva as D } from "../../../node_modules/class-variance-authority/dist/index.js";
-import { Label as K } from "../../../vendor/shadcn/label.js";
+import { Label as K } from "../label/label.js";
 const P = D("flex gap-2 w-full", {
   variants: {
     layout: {

package/dist/components/atoms/select/select.js

@@ -2,7 +2,7 @@ import { j as e } from "../../../_virtual/jsx-runtime.js";
 import * as y from "react";
 import { cn as c } from "../../../lib/utils.js";
 import { Select as w, SelectTrigger as C, SelectValue as G, SelectContent as L, SelectGroup as O, SelectLabel as R, SelectItem as d } from "../../../vendor/shadcn/select.js";
-import { Label as T } from "../../../vendor/shadcn/label.js";
+import { Label as T } from "../label/label.js";
 import { Typography as n } from "../typography/typography.js";
 const V = y.forwardRef(
   ({

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

@@ -37,6 +37,14 @@ export interface SwitchProps extends Omit<ComponentProps<typeof ShadcnSwitch>, "
      * 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.

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

@@ -1,24 +1,26 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { Switch as b } from "../../../vendor/shadcn/switch.js";
-import { forwardRef as j, useId as v } from "react";
-import { cn as n } from "../../../lib/utils.js";
-import { Label as y } from "../../../vendor/shadcn/label.js";
-const N = j(
+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(
   ({
     label: c,
-    description: o,
+    description: a,
     side: i = "left",
     variant: l = "default",
     id: d,
     name: t,
-    onChange: a,
-    className: f,
-    switchClassName: m,
-    ...x
-  }, p) => {
-    const h = v(), r = d || t || h, u = (s) => {
-      if (!a) return;
-      a({
+    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,
@@ -36,41 +38,42 @@ const N = j(
         stopPropagation: () => {
         }
       });
-    }, g = /* @__PURE__ */ e.jsx(
-      b,
+    }, b = /* @__PURE__ */ e.jsx(
+      v,
       {
-        ref: p,
+        ref: u,
         id: r,
         name: t,
-        className: n("cursor-pointer", m),
-        onCheckedChange: u,
-        ...x
+        className: o("cursor-pointer", x),
+        onCheckedChange: w,
+        ...h
       }
-    ), w = n(
-      "flex gap-3 items-start",
+    ), 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"
       },
-      f
+      m
     );
-    return /* @__PURE__ */ e.jsxs("div", { className: w, children: [
-      g,
+    return /* @__PURE__ */ e.jsxs("div", { className: j, children: [
+      b,
       /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-        /* @__PURE__ */ e.jsx(
-          y,
+        /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ e.jsx(
+          S,
           {
             htmlFor: r,
-            className: "text-sm leading-[18.39px] cursor-pointer",
+            info: f,
+            className: o("text-sm leading-[18.39px] cursor-pointer", p),
             children: c
           }
-        ),
-        o && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-muted-foreground", children: o })
+        ) }),
+        a && /* @__PURE__ */ e.jsx("p", { className: "text-sm text-muted-foreground", children: a })
       ] })
     ] });
   }
 );
-N.displayName = "Switch";
+C.displayName = "Switch";
 export {
-  N as Switch
+  C as Switch
 };

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 "../../../vendor/shadcn/label.js";
+import { Label as N } from "../label/label.js";
 const b = d("flex gap-2 w-full", {
   variants: {
     layout: {

package/dist/vendor/shadcn/avatar.js

@@ -1,16 +1,16 @@
-import { j as e } from "../../_virtual/jsx-runtime.js";
+import { j as r } from "../../_virtual/jsx-runtime.js";
 import "react";
-import * as r from "@radix-ui/react-avatar";
-import { cn as l } from "../../lib/utils.js";
-function m({
+import * as e from "@radix-ui/react-avatar";
+import { cn as s } from "../../lib/utils.js";
+function n({
   className: a,
   ...t
 }) {
-  return /* @__PURE__ */ e.jsx(
-    r.Root,
+  return /* @__PURE__ */ r.jsx(
+    e.Root,
     {
       "data-slot": "avatar",
-      className: l(
+      className: s(
         "relative flex size-8 shrink-0 overflow-hidden rounded-full",
         a
       ),
@@ -18,29 +18,29 @@ function m({
     }
   );
 }
-function n({
+function f({
   className: a,
   ...t
 }) {
-  return /* @__PURE__ */ e.jsx(
-    r.Image,
+  return /* @__PURE__ */ r.jsx(
+    e.Image,
     {
       "data-slot": "avatar-image",
-      className: l("aspect-square size-full", a),
+      className: s("aspect-square size-full", a),
       ...t
     }
   );
 }
-function u({
+function m({
   className: a,
   ...t
 }) {
-  return /* @__PURE__ */ e.jsx(
-    r.Fallback,
+  return /* @__PURE__ */ r.jsx(
+    e.Fallback,
     {
       "data-slot": "avatar-fallback",
-      className: l(
-        "bg-muted flex size-full items-center justify-center rounded-full",
+      className: s(
+        "bg-surface flex size-full items-center justify-center rounded-full",
         a
       ),
       ...t
@@ -48,7 +48,7 @@ function u({
   );
 }
 export {
-  m as Avatar,
-  u as AvatarFallback,
-  n as AvatarImage
+  n as Avatar,
+  m as AvatarFallback,
+  f as AvatarImage
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuno-payments/dashboard-design-system",
-  "version": "0.0.152",
+  "version": "0.0.155",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",