@yuno-payments/dashboard-design-system 2.9.4 → 3.0.0

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

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

package/dist/components/organisms/aggregated-table/aggregated-table.constants.d.ts

@@ -1,3 +0,0 @@
-import { AggregationBuiltInFn } from './aggregated-table.types';
-export declare const TOTALS_ROW_ID = "__AGGREGATION_TOTALS_ROW__";
-export declare const AGGREGATION_FUNCTIONS: Record<string, AggregationBuiltInFn>;

package/dist/components/organisms/aggregated-table/aggregated-table.constants.js

@@ -1,12 +0,0 @@
-import { maxAggregation as g, minAggregation as A, sizeAggregation as i, avgAggregation as o, sumAggregation as a } from "./aggregation-functions.helpers.js";
-const t = "__AGGREGATION_TOTALS_ROW__", _ = {
-  sum: a,
-  avg: o,
-  size: i,
-  min: A,
-  max: g
-};
-export {
-  _ as AGGREGATION_FUNCTIONS,
-  t as TOTALS_ROW_ID
-};

package/dist/components/organisms/aggregated-table/aggregated-table.d.ts

@@ -1,6 +0,0 @@
-import { HTMLAttributes } from 'react';
-import { AggregatedTableProps } from './aggregated-table.types';
-declare const AggregatedTable: <T extends object = Record<string, any>>(props: AggregatedTableProps<T> & Omit<HTMLAttributes<HTMLDivElement>, "onRowClick"> & {
-    ref?: React.Ref<HTMLDivElement>;
-}) => React.ReactElement | null;
-export { AggregatedTable };

package/dist/components/organisms/aggregated-table/aggregated-table.helpers.d.ts

@@ -1,3 +0,0 @@
-import { AggregatedColumn, CalculateTotalsRowParams } from './aggregated-table.types';
-export declare const isActionsColumn: <T extends Record<string, any>>(col: AggregatedColumn<T>) => boolean;
-export declare const calculateTotalsRow: <T extends object>({ rows, columns, aggregationLabel, }: CalculateTotalsRowParams<T>) => Record<string, any>;

package/dist/components/organisms/aggregated-table/aggregated-table.helpers.js

@@ -1,31 +0,0 @@
-import { AGGREGATION_FUNCTIONS as c, TOTALS_ROW_ID as y } from "./aggregated-table.constants.js";
-const d = (e) => "accessorKey" in e && typeof e.accessorKey == "string" ? e.accessorKey : e.id, F = (e) => e.meta?.isActions === !0, p = ({
-  rows: e,
-  columns: s,
-  aggregationLabel: u
-}) => {
-  const o = e;
-  return s.reduce(
-    (r, n, f) => {
-      const t = d(n);
-      if (!t) return r;
-      if (f === 0 && !n.aggregationFn)
-        return r[t] = u, r;
-      if (!n.aggregationFn) return r;
-      const a = o.map((i) => i[t]);
-      let g;
-      if (typeof n.aggregationFn == "function")
-        g = n.aggregationFn({ values: a, field: t });
-      else {
-        const i = c[n.aggregationFn];
-        g = i ? i(a) : 0;
-      }
-      return r[t] = n.aggregationCell ? n.aggregationCell(g) : g, r;
-    },
-    { id: y }
-  );
-};
-export {
-  p as calculateTotalsRow,
-  F as isActionsColumn
-};

package/dist/components/organisms/aggregated-table/aggregated-table.js

@@ -1,125 +0,0 @@
-import { j as r } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as N, useMemo as x, useCallback as R } from "react";
-import { useReactTable as v, flexRender as f } from "../../../node_modules/@tanstack/react-table/build/lib/index.js";
-import { cn as l } from "../../../lib/utils.js";
-import { TableHeader as C, TableRow as c, TableHead as k, TableBody as D, TableCell as h, TableFooter as w } from "../../../vendor/shadcn/table.js";
-import { calculateTotalsRow as z, isActionsColumn as M } from "./aggregated-table.helpers.js";
-import { getCoreRowModel as H } from "../../../node_modules/@tanstack/table-core/build/lib/index.js";
-function K({
-  rows: d,
-  columns: n,
-  aggregationLabel: m = "Total",
-  onRowClick: i,
-  className: p,
-  ...j
-}, y) {
-  const g = x(
-    () => n.some((t) => t.aggregationFn),
-    [n]
-  ), u = x(() => g ? z({ rows: d, columns: n, aggregationLabel: m }) : null, [d, n, m, g]), b = v({
-    data: d,
-    columns: n,
-    getCoreRowModel: H()
-  }), A = R(
-    (t, e) => {
-      e.target.closest('[data-column="actions"]') || i?.(t);
-    },
-    [i]
-  );
-  return /* @__PURE__ */ r.jsx(
-    "div",
-    {
-      ref: y,
-      className: l(
-        "h-full rounded-lg border border-border overflow-auto",
-        p
-      ),
-      ...j,
-      children: /* @__PURE__ */ r.jsxs("table", { className: "w-full h-full border-collapse", children: [
-        /* @__PURE__ */ r.jsx(C, { className: "sticky top-0 z-10", children: b.getHeaderGroups().map((t) => /* @__PURE__ */ r.jsx(
-          c,
-          {
-            className: "border-b border-border bg-muted hover:bg-muted",
-            children: t.headers.map((e, s) => {
-              const o = e.column.columnDef.meta, a = o?.isActions;
-              return /* @__PURE__ */ r.jsx(
-                k,
-                {
-                  className: l(
-                    "h-12 px-4 text-sm font-medium text-muted-foreground bg-muted",
-                    s === 0 && "ps-6",
-                    o?.headerAlign === "right" && "text-right",
-                    a && "sticky end-0 px-0"
-                  ),
-                  style: {
-                    minWidth: e.column.columnDef.minSize,
-                    width: e.column.columnDef.size
-                  },
-                  children: e.isPlaceholder ? null : f(
-                    e.column.columnDef.header,
-                    e.getContext()
-                  )
-                },
-                e.id
-              );
-            })
-          },
-          t.id
-        )) }),
-        /* @__PURE__ */ r.jsxs(D, { children: [
-          b.getRowModel().rows.map((t) => /* @__PURE__ */ r.jsx(
-            c,
-            {
-              className: l(
-                "h-12 border-b border-border bg-card text-foreground",
-                "hover:bg-muted",
-                i && "cursor-pointer"
-              ),
-              onClick: i ? (e) => A(t.original, e) : void 0,
-              children: t.getVisibleCells().map((e, s) => {
-                const o = e.column.columnDef.meta, a = o?.isActions;
-                return /* @__PURE__ */ r.jsx(
-                  h,
-                  {
-                    className: l(
-                      "px-4 text-sm",
-                      s === 0 && "ps-6",
-                      o?.headerAlign === "right" && "text-right",
-                      a && "sticky end-0 bg-card px-0"
-                    ),
-                    ...a ? { "data-column": "actions" } : {},
-                    children: f(e.column.columnDef.cell, e.getContext())
-                  },
-                  e.id
-                );
-              })
-            },
-            t.id
-          )),
-          /* @__PURE__ */ r.jsx("tr", { "aria-hidden": "true" })
-        ] }),
-        u && /* @__PURE__ */ r.jsx(w, { className: "sticky bottom-0 z-10 bg-muted", children: /* @__PURE__ */ r.jsx(c, { className: "h-12 bg-muted text-foreground hover:bg-muted", children: n.map((t, e) => {
-          const s = M(t), o = ("accessorKey" in t && typeof t.accessorKey == "string" ? t.accessorKey : t.id) || String(e), a = s ? null : u[o], T = t.meta;
-          return /* @__PURE__ */ r.jsx(
-            h,
-            {
-              className: l(
-                "px-4 text-sm font-bold bg-muted",
-                e === 0 && "ps-6",
-                T?.headerAlign === "right" && "text-right",
-                s && "sticky end-0 px-0"
-              ),
-              children: a ?? ""
-            },
-            o
-          );
-        }) }) })
-      ] })
-    }
-  );
-}
-const F = N(K);
-F.displayName = "AggregatedTable";
-export {
-  F as AggregatedTable
-};

package/dist/components/organisms/aggregated-table/aggregated-table.types.d.ts

@@ -1,35 +0,0 @@
-import { ReactNode } from 'react';
-import { ColumnDef } from '@tanstack/react-table';
-export type AggregationFn = "sum" | "avg" | "size" | "min" | "max" | ((params: {
-    values: unknown[];
-    field: string;
-}) => number | string);
-export type AggregatedColumn<T extends object = Record<string, any>> = ColumnDef<T, unknown> & {
-    aggregationFn?: AggregationFn;
-    aggregationCell?: (value: number | string) => string | ReactNode;
-};
-export type AggregationBuiltInFn = (values: unknown[]) => number;
-export type CalculateTotalsRowParams<T extends object = Record<string, any>> = {
-    rows: T[];
-    columns: AggregatedColumn<any>[];
-    aggregationLabel: string;
-};
-export interface AggregatedColumnMeta {
-    headerAlign?: "left" | "center" | "right";
-    isActions?: boolean;
-}
-export interface AggregatedTableProps<T extends object = Record<string, any>> {
-    /** Data rows */
-    rows: T[];
-    /**
-     * Column definitions. Decoupled from T so callers can pass AggregatedColumn[]
-     * without needing to parameterize with the exact row type.
-     */
-    columns: AggregatedColumn<any>[];
-    /** Label to display in the first column of the footer (default: 'Total') */
-    aggregationLabel?: string;
-    /** Row click handler — receives the typed row directly */
-    onRowClick?: (row: T) => void;
-    /** Additional CSS classes */
-    className?: string;
-}

package/dist/components/organisms/aggregated-table/aggregation-functions.helpers.d.ts

@@ -1,6 +0,0 @@
-import { AggregationBuiltInFn } from './aggregated-table.types';
-export declare const sumAggregation: AggregationBuiltInFn;
-export declare const avgAggregation: AggregationBuiltInFn;
-export declare const sizeAggregation: AggregationBuiltInFn;
-export declare const minAggregation: AggregationBuiltInFn;
-export declare const maxAggregation: AggregationBuiltInFn;

package/dist/components/organisms/aggregated-table/aggregation-functions.helpers.js

@@ -1,23 +0,0 @@
-const s = (e) => {
-  const n = e.reduce((t, r) => {
-    const u = Number(r);
-    return t + (isNaN(u) ? 0 : u);
-  }, 0);
-  return Math.round(n * 100) / 100;
-}, g = (e) => {
-  const n = e.filter((r) => r != null && !isNaN(Number(r)));
-  return n.length === 0 ? 0 : n.reduce((r, u) => r + Number(u), 0) / n.length;
-}, a = (e) => e.filter((n) => n != null && n !== "").length, i = (e) => {
-  const n = e.map((t) => Number(t)).filter((t) => !isNaN(t));
-  return n.length > 0 ? Math.min(...n) : 0;
-}, m = (e) => {
-  const n = e.map((t) => Number(t)).filter((t) => !isNaN(t));
-  return n.length > 0 ? Math.max(...n) : 0;
-};
-export {
-  g as avgAggregation,
-  m as maxAggregation,
-  i as minAggregation,
-  a as sizeAggregation,
-  s as sumAggregation
-};

package/dist/components/organisms/aggregated-table/index.d.ts

@@ -1,4 +0,0 @@
-export { AggregatedTable } from './aggregated-table';
-export type { AggregatedTableProps, AggregatedColumn, AggregatedColumnMeta, AggregationFn } from './aggregated-table.types';
-export { sumAggregation, avgAggregation, sizeAggregation, minAggregation, maxAggregation, } from './aggregation-functions.helpers';
-export { TOTALS_ROW_ID } from './aggregated-table.constants';

package/dist/components/organisms/combobox/combobox.d.ts

@@ -1,21 +0,0 @@
-import { ComboboxProps } from './types';
-/**
- * Multi-select combobox component with search and chips display.
- * Features include searchable options, chip badges for selected items, and "delete all" functionality.
- *
- * @example
- * ```tsx
- * <Combobox
- *   label="Select Users"
- *   value={selectedIds}
- *   options={[
- *     { value: '1', label: 'John Doe' },
- *     { value: '2', label: 'Jane Smith' }
- *   ]}
- *   onChange={(newValues) => setSelectedIds(newValues)}
- *   onCloseChip={(id) => handleRemove(id)}
- * />
- * ```
- */
-declare const ComboboxComponent: import('react').ForwardRefExoticComponent<ComboboxProps & import('react').RefAttributes<HTMLButtonElement>>;
-export { ComboboxComponent as Combobox };