@yuno-payments/dashboard-design-system 2.3.9 → 2.3.10-beta.1

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

@@ -40,16 +40,16 @@ const P = D("flex gap-2 w-full", {
     disabled: x,
     layout: j = "vertical",
     className: $,
-    inputProps: h,
+    inputProps: v,
     ...E
   }, i) => {
-    const M = Y(), u = O || h?.id || M, b = !!a, [o, d] = n(m), [f, R] = n(() => {
+    const M = Y(), u = O || v?.id || M, b = !!a, [o, d] = n(m), [f, R] = n(() => {
       if (c) {
         const e = localStorage.getItem(`${c}_searchfield`);
         return e ? JSON.parse(e) : [];
       }
       return [];
-    }), [C, L] = n([]), [B, v] = n(!1), [J, I] = n(!1), g = V(null), _ = V(null), G = (e) => {
+    }), [C, L] = n([]), [B, h] = n(!1), [J, I] = n(!1), g = V(null), _ = V(null), G = (e) => {
       const s = e.target.value;
       d(s), (s === "" || H) && l(s);
     }, W = (e) => {
@@ -69,11 +69,11 @@ const P = D("flex gap-2 w-full", {
     }, X = () => {
       d(""), l(""), g.current?.focus();
     }, q = (e) => {
-      d(e), l(e), v(!1), g.current?.focus();
+      d(e), l(e), h(!1), g.current?.focus();
     }, A = () => {
-      v(!0);
+      h(!0);
     }, Q = () => {
-      J || v(!1);
+      J || h(!1);
     };
     return z(() => {
       d(m);
@@ -108,12 +108,12 @@ const P = D("flex gap-2 w-full", {
                 "aria-invalid": b,
                 "aria-describedby": p || a ? `${u}-description` : void 0,
                 ...E,
-                ...h,
+                ...v,
                 id: u,
                 className: r(
                   b && "border-destructive focus-visible:border-destructive",
                   "!px-9",
-                  h?.className
+                  v?.className
                 )
               }
             ),
@@ -124,7 +124,7 @@ const P = D("flex gap-2 w-full", {
                 size: "sm",
                 onClick: S,
                 className: r(
-                  "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground dark:text-foreground",
+                  "absolute start-3 top-1/2 -translate-y-1/2 text-muted-foreground dark:text-foreground",
                   !x && "cursor-pointer hover:text-foreground transition-colors"
                 )
               }
@@ -137,7 +137,7 @@ const P = D("flex gap-2 w-full", {
                 weight: "fill",
                 onClick: X,
                 className: r(
-                  "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground",
+                  "absolute end-3 top-1/2 -translate-y-1/2 text-muted-foreground",
                   !x && "cursor-pointer hover:text-foreground transition-colors"
                 )
               }

package/dist/components/molecules/highlight-banner/highlight-banner.js

@@ -1,23 +1,20 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m } from "react";
+import { forwardRef as x } from "react";
 import { cn as i } from "../../../lib/utils.js";
 import { Icon as c } from "../../atoms/icon/icon.js";
-const p = m(
-  ({ className: s, icon: d, title: o, description: a, button: t, variant: l = "default", ...n }, x) => {
-    const r = l === "secondary";
+const f = x(
+  ({ className: s, icon: d, title: o, description: a, button: t, variant: n = "default", ...l }, m) => {
+    const r = n === "secondary";
     return /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: x,
+        ref: m,
         className: i(
           "flex items-center gap-6 rounded-xl border p-6",
           r ? "border-border bg-background" : "border-primary bg-primary",
           s
         ),
-        style: {
-          boxShadow: "0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10)"
-        },
-        ...n,
+        ...l,
         children: [
           /* @__PURE__ */ e.jsx(
             "div",
@@ -68,7 +65,7 @@ const p = m(
     );
   }
 );
-p.displayName = "HighlightBanner";
+f.displayName = "HighlightBanner";
 export {
-  p as HighlightBanner
+  f as HighlightBanner
 };

package/dist/components/molecules/pagination/pagination.d.ts

@@ -45,7 +45,7 @@ interface PaginationProps extends ComponentProps<"nav"> {
      */
     maxVisiblePages?: number;
     /**
-     * Language for translations. Falls back to localStorage "yuno-lang", then "en".
+     * Language for translations. Falls back to localStorage "lang", then "en".
      */
     lang?: PaginationLanguage;
     /**

package/dist/components/organisms/data-table/components/cells/data-table-resize-handle.js

@@ -1,24 +1,30 @@
-import { j as t } from "../../../../../_virtual/jsx-runtime.js";
-import { RESIZE_HANDLE_CONFIG as e } from "../../utils/data-table-constants.js";
-function l({
-  onMouseDown: r,
-  onTouchStart: i
+import { j as e } from "../../../../../_virtual/jsx-runtime.js";
+import { RESIZE_HANDLE_CONFIG as t } from "../../utils/data-table-constants.js";
+function c({
+  onMouseDown: n,
+  onTouchStart: r
 }) {
-  return /* @__PURE__ */ t.jsx(
+  const s = (o) => {
+    o.stopPropagation(), n(o);
+  }, a = (o) => {
+    o.stopPropagation(), r(o);
+  };
+  return /* @__PURE__ */ e.jsx(
     "div",
     {
-      onMouseDown: r,
-      onTouchStart: i,
-      className: `absolute right-0 top-0 h-full ${e.width} cursor-col-resize select-none touch-none flex items-center justify-center hover:bg-neutral-100`,
-      children: /* @__PURE__ */ t.jsx(
+      onMouseDown: s,
+      onTouchStart: a,
+      onPointerDown: (o) => o.stopPropagation(),
+      className: `absolute right-0 top-0 h-full ${t.width} cursor-col-resize select-none touch-none flex items-center justify-center hover:bg-neutral-100`,
+      children: /* @__PURE__ */ e.jsx(
         "div",
         {
-          className: `${e.lineHeight} ${e.lineWidth} bg-neutral-300`
+          className: `${t.lineHeight} ${t.lineWidth} bg-neutral-300`
         }
       )
     }
   );
 }
 export {
-  l as DataTableResizeHandle
+  c as DataTableResizeHandle
 };

package/dist/components/organisms/tutorial/tutorial.js

@@ -3,28 +3,28 @@ import { forwardRef as C } from "react";
 import { cn as j } from "../../../lib/utils.js";
 import { Button as c } from "../../atoms/button/button.js";
 import { Icon as y } from "../../atoms/icon/icon.js";
-import { Typography as x } from "../../atoms/typography/typography.js";
+import { Typography as o } from "../../atoms/typography/typography.js";
 import { Link as b } from "../../atoms/link/link.js";
 import { Badge as w } from "../../atoms/badge/badge.js";
 const B = C(
   ({
-    continuous: o,
+    continuous: x,
     step: a,
     closeProps: l,
-    primaryProps: n,
-    tooltipProps: g,
-    withTag: v = !1,
+    primaryProps: r,
+    tooltipProps: v,
+    withTag: g = !1,
     tagLabel: f,
-    buttonGroup: r = [],
+    buttonGroup: n = [],
     width: i,
     skipProps: t,
     index: h,
     size: d
   }, N) => {
-    const u = (s) => {
+    const p = (s) => {
       l?.onClick?.(s);
-    }, k = (s, m) => {
-      m(), u(s);
+    }, u = (s, m) => {
+      m(), p(s);
     };
     return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
       /* @__PURE__ */ e.jsx("style", { children: `
@@ -35,17 +35,24 @@ const B = C(
       /* @__PURE__ */ e.jsxs(
         "div",
         {
-          ...g,
+          ...v,
           ref: N,
           className: j(
-            "bg-background rounded border shadow-lg p-4",
+            "bg-popover rounded-md border border-border shadow-md p-4",
             "max-w-[368px]",
             i && `max-w-[${i}px]`
           ),
           style: i ? { maxWidth: `${i}px` } : void 0,
           children: [
-            /* @__PURE__ */ e.jsxs("div", { className: "flex items-start justify-between gap-4 mb-3", children: [
-              /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: a.title && /* @__PURE__ */ e.jsx(x, { variant: "h4", className: "text-base font-semibold", children: a.title }) }),
+            /* @__PURE__ */ e.jsxs("div", { className: "flex items-start justify-between gap-4 mb-2", children: [
+              /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: a.title && /* @__PURE__ */ e.jsx(
+                o,
+                {
+                  variant: "h4",
+                  className: "text-base font-medium leading-none",
+                  children: a.title
+                }
+              ) }),
               !a.hideCloseButton && /* @__PURE__ */ e.jsx(
                 c,
                 {
@@ -57,7 +64,14 @@ const B = C(
                 }
               )
             ] }),
-            /* @__PURE__ */ e.jsx("div", { className: "mb-5", children: /* @__PURE__ */ e.jsx(x, { variant: "sm", className: "text-muted-foreground font-normal", children: a.content }) }),
+            /* @__PURE__ */ e.jsx("div", { className: "mb-6", children: /* @__PURE__ */ e.jsx(
+              o,
+              {
+                variant: "sm",
+                className: "text-muted-foreground font-normal",
+                children: a.content
+              }
+            ) }),
             /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between gap-4", children: [
               t && h !== (d ?? 0) - 1 && /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: /* @__PURE__ */ e.jsx(
                 b,
@@ -69,31 +83,38 @@ const B = C(
                   children: t.title
                 }
               ) }),
-              (d ?? 0) > 1 && /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e.jsxs(x, { variant: "xs", className: "text-muted-foreground mr-6", children: [
+              (d ?? 0) > 1 && /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e.jsxs(o, { variant: "xs", className: "text-muted-foreground mr-6", children: [
                 "Step ",
                 (h ?? 0) + 1,
                 " of ",
                 d
               ] }) }),
-              o && n && /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e.jsx(c, { size: "default", ...n, children: n.title }) })
+              x && r && /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e.jsx(c, { size: "default", ...r, children: r.title }) })
             ] }),
-            !o && r.length > 0 && /* @__PURE__ */ e.jsxs(
+            !x && n.length > 0 && /* @__PURE__ */ e.jsxs(
               "div",
               {
                 className: j(
                   "flex items-center mt-6 gap-3",
-                  r.length > 1 ? "justify-between" : "justify-end"
+                  n.length > 1 ? "justify-between" : "justify-end"
                 ),
                 children: [
-                  v && f && /* @__PURE__ */ e.jsx(w, { variant: "default", className: "bg-green-100 text-green-800", children: f }),
-                  r.map((s, m) => /* @__PURE__ */ e.jsx(
+                  g && f && /* @__PURE__ */ e.jsx(
+                    w,
+                    {
+                      variant: "default",
+                      className: "bg-green-100 text-green-800",
+                      children: f
+                    }
+                  ),
+                  n.map((s, m) => /* @__PURE__ */ e.jsx(
                     c,
                     {
                       variant: s.variant || "default",
                       size: s.size || "default",
                       loading: s.loading,
                       disabled: s.disabled,
-                      onClick: (p) => k(p, s.event),
+                      onClick: (k) => u(k, s.event),
                       children: s.label
                     },
                     m