@yuno-payments/dashboard-design-system 1.3.5 → 1.4.0

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

@@ -24,7 +24,7 @@ interface RadioOption {
 /**
  * Props for the RadioGroup component
  */
-interface RadioGroupProps extends Omit<ComponentProps<typeof ShadcnRadioGroup>, "children" | "onValueChange"> {
+interface RadioGroupProps extends Omit<ComponentProps<typeof ShadcnRadioGroup>, "children" | "onValueChange" | "onChange"> {
     /**
      * Array of radio options to display
      */

package/dist/components/atoms/select/search-select.d.ts

@@ -1,6 +1,6 @@
 import { SelectOption, SelectOptionGroup } from './select';
 import * as React from "react";
-export interface SearchSelectProps {
+interface SearchSelectProps {
     label?: string;
     description?: string;
     error?: string;

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

@@ -72,7 +72,14 @@ const W = r.forwardRef(
     }, O = R();
     return /* @__PURE__ */ e.jsxs("div", { className: a("w-full", E), children: [
       j && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1 mb-2", children: [
-        /* @__PURE__ */ e.jsx(A, { htmlFor: g, className: a(f && "text-muted-foreground"), children: j }),
+        /* @__PURE__ */ e.jsx(
+          A,
+          {
+            htmlFor: g,
+            className: a(f && "text-muted-foreground"),
+            children: j
+          }
+        ),
         L && /* @__PURE__ */ e.jsx(x, { variant: "sm", className: "text-muted-foreground", children: "(Optional)" })
       ] }),
       N && !u && /* @__PURE__ */ e.jsx(

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

@@ -32,7 +32,7 @@ export interface SelectOptionGroup {
 /**
  * Props for the Select component
  */
-export interface SelectProps {
+interface SelectProps {
     /**
      * Label text displayed above the select
      */

package/dist/components/atoms/typography/typography.js

@@ -1,7 +1,7 @@
 import { cva as s } from "../../../node_modules/class-variance-authority/dist/index.js";
 import { cn as i } from "../../../lib/utils.js";
 import { forwardRef as m, createElement as c } from "react";
-const d = s("font-[var(--font-family)]", {
+const d = s("font-[var(--font-family-inter)]", {
   variants: {
     variant: {
       h1: "scroll-m-20 text-4xl tracking-tight lg:text-5xl",

package/dist/components/molecules/file-upload/file-upload.js

@@ -92,14 +92,7 @@ function ee({
             className: "object-contain",
             "aria-hidden": "true"
           }
-        ) : /* @__PURE__ */ r.jsx(
-          b,
-          {
-            name: "UploadSimple",
-            size: "xl",
-            className: "text-muted-foreground"
-          }
-        ),
+        ) : /* @__PURE__ */ r.jsx(b, { name: "UploadSimple", size: "xl", className: "text-muted-foreground" }),
         /* @__PURE__ */ r.jsxs("p", { className: "text-sm text-center text-foreground font-semibold", children: [
           /* @__PURE__ */ r.jsx("span", { className: "text-primary cursor-pointer", children: "Select" }),
           " ",

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

@@ -9,3 +9,4 @@ export { HighlightBanner, type HighlightBannerProps } from './highlight-banner';
 export { Empty, type EmptyProps } from './empty';
 export { EmptyIcon, type EmptyIconProps } from './empty';
 export { FileUpload, type FileUploadProps, type UploadFile, } from './file-upload';
+export { Stepper, type StepperProps, type StepperStep } from './stepper';

package/dist/components/molecules/stepper/index.d.ts

@@ -0,0 +1 @@
+export { Stepper, type StepperProps, type StepperStep } from './stepper';

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

@@ -0,0 +1,50 @@
+import { HTMLAttributes } from 'react';
+export interface StepperStep {
+    /** Unique identifier for the step */
+    key: string | number;
+    /** Display label for the step */
+    label: string;
+    /** Optional subtitle shown below the label */
+    description?: string;
+    /** Marks step with error styling */
+    status?: "error";
+}
+export interface StepperProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Zero-based index of the currently active step.
+     * Steps before this index are marked as completed,
+     * steps after are marked as inactive.
+     */
+    activeStep: number;
+    /**
+     * Array of steps to display in the stepper.
+     * Each step must have a unique `key` and a `label`.
+     */
+    steps: StepperStep[];
+    /** Layout orientation. Defaults to "horizontal". */
+    orientation?: "horizontal" | "vertical";
+    /** When provided, completed and inactive steps become clickable. */
+    onStepClick?: (index: number) => void;
+}
+/**
+ * A stepper component that displays progress through a sequence of steps.
+ * Each step shows a numbered circle (or checkmark when completed) and a label.
+ * Steps are connected by lines that reflect the current progress.
+ *
+ * Supports horizontal (default) and vertical orientations, optional step descriptions,
+ * error states, and clickable steps via `onStepClick`.
+ *
+ * @example
+ * ```tsx
+ * <Stepper
+ *   activeStep={1}
+ *   steps={[
+ *     { key: "details", label: "Details" },
+ *     { key: "review", label: "Review" },
+ *     { key: "confirm", label: "Confirm" },
+ *   ]}
+ * />
+ * ```
+ */
+declare const Stepper: import('react').ForwardRefExoticComponent<StepperProps & import('react').RefAttributes<HTMLDivElement>>;
+export { Stepper };

package/dist/components/molecules/stepper/stepper.js

@@ -0,0 +1,74 @@
+import { j as r } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as b, Fragment as h } from "react";
+import { cn as i } from "../../../lib/utils.js";
+import { Icon as d } from "../../atoms/icon/icon.js";
+function j(t, e, o) {
+  return t.status === "error" ? "error" : e < o ? "completed" : e === o ? "active" : "inactive";
+}
+const N = ({ index: t, state: e }) => {
+  const o = i(
+    "flex h-6 w-6 shrink-0 items-center justify-center rounded-full text-xs font-bold",
+    (e === "completed" || e === "active") && "bg-primary text-primary-foreground",
+    e === "inactive" && "bg-border text-muted-foreground",
+    e === "error" && "bg-destructive text-destructive-foreground"
+  );
+  return /* @__PURE__ */ r.jsx("div", { className: o, children: e === "completed" ? /* @__PURE__ */ r.jsx(d, { name: "Check", size: "xs", className: "text-primary-foreground", weight: "bold" }) : e === "error" ? /* @__PURE__ */ r.jsx(d, { name: "X", size: "xs", className: "text-destructive-foreground", weight: "bold" }) : /* @__PURE__ */ r.jsx("span", { children: t + 1 }) });
+}, y = ({
+  state: t,
+  orientation: e
+}) => {
+  const o = t === "completed" || t === "active";
+  return e === "vertical" ? /* @__PURE__ */ r.jsx("div", { className: i("w-0.5 h-6 ml-3 my-1", o ? "bg-primary" : "bg-border") }) : /* @__PURE__ */ r.jsx("div", { className: i("mx-2 h-0.5 flex-1 rounded-sm", o ? "bg-primary" : "bg-border") });
+}, w = b(
+  ({ activeStep: t, steps: e, orientation: o = "horizontal", onStepClick: l, className: u, ...x }, f) => {
+    const a = o === "vertical";
+    return /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        ref: f,
+        className: i(
+          a ? "flex flex-col w-full" : "flex w-full items-center",
+          u
+        ),
+        ...x,
+        children: e.map((c, s) => {
+          const n = j(c, s, t), p = c.status === "error" ? "inactive" : s < t ? "completed" : s === t ? "active" : "inactive", v = i(
+            "text-xs",
+            n === "completed" || n === "active" ? "font-bold text-foreground" : n === "error" ? "font-bold text-destructive" : "font-normal text-muted-foreground"
+          ), m = l != null && n !== "active";
+          return /* @__PURE__ */ r.jsxs(h, { children: [
+            /* @__PURE__ */ r.jsxs(
+              "div",
+              {
+                className: i(
+                  "flex flex-row gap-2",
+                  a ? "items-start" : "items-center",
+                  m && "cursor-pointer hover:opacity-80"
+                ),
+                "aria-current": n === "active" ? "step" : void 0,
+                ...m ? {
+                  role: "button",
+                  tabIndex: 0,
+                  onClick: () => l(s),
+                  onKeyDown: (g) => g.key === "Enter" && l(s)
+                } : {},
+                children: [
+                  /* @__PURE__ */ r.jsx(N, { index: s, state: n }),
+                  /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col", children: [
+                    /* @__PURE__ */ r.jsx("span", { className: v, children: c.label }),
+                    c.description && /* @__PURE__ */ r.jsx("span", { className: "text-xs text-muted-foreground font-normal", children: c.description })
+                  ] })
+                ]
+              }
+            ),
+            s < e.length - 1 && /* @__PURE__ */ r.jsx(y, { state: p, orientation: o })
+          ] }, c.key);
+        })
+      }
+    );
+  }
+);
+w.displayName = "Stepper";
+export {
+  w as Stepper
+};

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

@@ -0,0 +1,3 @@
+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

@@ -0,0 +1,12 @@
+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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,3 @@
+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

@@ -0,0 +1,31 @@
+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

@@ -0,0 +1,125 @@
+import { j as r } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as N, useMemo as h, useCallback as R } from "react";
+import { useReactTable as v, flexRender as x } from "../../../node_modules/@tanstack/react-table/build/lib/index.js";
+import { cn as n } from "../../../lib/utils.js";
+import { TableHeader as C, TableRow as m, TableHead as k, TableBody as D, TableCell as f, 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: c,
+  columns: l,
+  aggregationLabel: d = "Total",
+  onRowClick: i,
+  className: p,
+  ...j
+}, y) {
+  const g = h(
+    () => l.some((t) => t.aggregationFn),
+    [l]
+  ), u = h(() => g ? z({ rows: c, columns: l, aggregationLabel: d }) : null, [c, l, d, g]), b = v({
+    data: c,
+    columns: l,
+    getCoreRowModel: H()
+  }), A = R(
+    (t, e) => {
+      e.target.closest('[data-column="actions"]') || i?.(t);
+    },
+    [i]
+  );
+  return /* @__PURE__ */ r.jsx(
+    "div",
+    {
+      ref: y,
+      className: n(
+        "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(
+          m,
+          {
+            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: n(
+                    "h-12 px-4 text-sm font-medium text-muted-foreground bg-muted",
+                    s === 0 && "pl-6",
+                    o?.headerAlign === "right" && "text-right",
+                    a && "sticky right-0 px-0"
+                  ),
+                  style: {
+                    minWidth: e.column.columnDef.minSize,
+                    width: e.column.columnDef.size
+                  },
+                  children: e.isPlaceholder ? null : x(
+                    e.column.columnDef.header,
+                    e.getContext()
+                  )
+                },
+                e.id
+              );
+            })
+          },
+          t.id
+        )) }),
+        /* @__PURE__ */ r.jsxs(D, { children: [
+          b.getRowModel().rows.map((t) => /* @__PURE__ */ r.jsx(
+            m,
+            {
+              className: n(
+                "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(
+                  f,
+                  {
+                    className: n(
+                      "px-4 text-sm",
+                      s === 0 && "pl-6",
+                      o?.headerAlign === "right" && "text-right",
+                      a && "sticky right-0 bg-card px-0"
+                    ),
+                    ...a ? { "data-column": "actions" } : {},
+                    children: x(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(m, { className: "h-12 bg-muted text-foreground hover:bg-muted", children: l.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(
+            f,
+            {
+              className: n(
+                "px-4 text-sm font-bold bg-muted",
+                e === 0 && "pl-6",
+                T?.headerAlign === "right" && "text-right",
+                s && "sticky right-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

@@ -0,0 +1,35 @@
+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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,23 @@
+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

@@ -0,0 +1,4 @@
+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/index.d.ts

@@ -1,5 +1,7 @@
+export * from './aggregated-table';
 export * from './data-table';
 export { Dialog } from './dialog';
 export { Sheet } from './sheet';
 export { Tutorial } from './tutorial';
 export type { TutorialProps, TutorialButtonProps } from './tutorial';
+export * from './transfer-list';

package/dist/components/organisms/transfer-list/index.d.ts

@@ -0,0 +1,3 @@
+export { TransferList, type TransferListProps } from './transfer-list';
+export { TransferListEmptyState } from './transfer-list-empty-state';
+export type { TransferItem } from './transfer-list.types';

package/dist/components/organisms/transfer-list/transfer-list-box.d.ts

@@ -0,0 +1,17 @@
+import { TransferItem } from './transfer-list.types';
+import { IconName } from '../../atoms/icon';
+export interface TransferListBoxProps {
+    id: string;
+    title: string;
+    items: TransferItem[];
+    height: number;
+    showSearch: boolean;
+    search: string;
+    searchPlaceholder: string;
+    onSearchChange: (value: string) => void;
+    onMove?: (item: TransferItem) => void;
+    moveIconName?: IconName;
+    emptyState?: React.ReactNode;
+    isSelected?: boolean;
+}
+export declare const TransferListBox: ({ id, title, items, height, showSearch, search, searchPlaceholder, onSearchChange, onMove, moveIconName, emptyState, isSelected, }: TransferListBoxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/transfer-list/transfer-list-box.js

@@ -0,0 +1,65 @@
+import { j as e } from "../../../_virtual/jsx-runtime.js";
+import { useDroppable as j } from "../../../node_modules/@dnd-kit/react/index.js";
+import { TransferListItem as I } from "./transfer-list-item.js";
+import { TransferListEmptyState as y } from "./transfer-list-empty-state.js";
+import { Field as N } from "../../atoms/field/field.js";
+const v = 1, R = ({
+  id: l,
+  title: t,
+  items: o,
+  height: n,
+  showSearch: m,
+  search: s,
+  searchPlaceholder: f,
+  onSearchChange: p,
+  onMove: c,
+  moveIconName: x,
+  emptyState: d,
+  isSelected: u = !1
+}) => {
+  const a = `${l}-title`, i = o.length === 0, { ref: b } = j({ id: l, collisionPriority: v }), g = d ?? /* @__PURE__ */ e.jsx(y, {});
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: "border border-border rounded-lg p-4 w-full flex flex-col gap-2",
+      style: { height: n },
+      children: [
+        /* @__PURE__ */ e.jsx("p", { id: a, className: "text-sm text-foreground mb-2", children: t }),
+        m && (!i || s.length > 0) && /* @__PURE__ */ e.jsx(
+          N,
+          {
+            placeholder: f,
+            value: s,
+            onChange: (r) => p(r.target.value),
+            "aria-label": `${t} search`
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            ref: b,
+            className: "h-full overflow-auto w-full flex flex-col gap-2",
+            role: "listbox",
+            "aria-labelledby": a,
+            "aria-multiselectable": !0,
+            children: i ? g : o.map((r, h) => /* @__PURE__ */ e.jsx(
+              I,
+              {
+                item: r,
+                index: h,
+                group: l,
+                onMove: c,
+                moveIconName: x,
+                isSelected: u
+              },
+              r.id
+            ))
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  R as TransferListBox
+};

package/dist/components/organisms/transfer-list/transfer-list-empty-state.d.ts

@@ -0,0 +1,7 @@
+import { IconName } from '../../atoms/icon';
+export interface TransferListEmptyStateProps {
+    title?: string;
+    description?: string;
+    iconName?: IconName;
+}
+export declare const TransferListEmptyState: ({ title, description, iconName, }: TransferListEmptyStateProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/transfer-list/transfer-list-empty-state.js

@@ -0,0 +1,14 @@
+import { j as e } from "../../../_virtual/jsx-runtime.js";
+import { Icon as o } from "../../atoms/icon/icon.js";
+const l = ({
+  title: t = "No items",
+  description: r = "No items available",
+  iconName: s = "TextColumns"
+}) => /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col items-center justify-center h-full gap-4 border border-border rounded-lg p-4 bg-muted", children: [
+  /* @__PURE__ */ e.jsx(o, { name: s, className: "text-muted-foreground", size: "xl" }),
+  /* @__PURE__ */ e.jsx("p", { className: "text-base text-center text-foreground font-bold", children: t }),
+  /* @__PURE__ */ e.jsx("p", { className: "text-xs text-center text-muted-foreground", children: r })
+] });
+export {
+  l as TransferListEmptyState
+};

package/dist/components/organisms/transfer-list/transfer-list-item.d.ts

@@ -0,0 +1,15 @@
+import { TransferItem } from './transfer-list.types';
+import { IconName } from '../../atoms/icon';
+export interface TransferListItemViewProps {
+    item: TransferItem;
+    onMove?: (item: TransferItem) => void;
+    moveIconName?: IconName;
+    isSelected?: boolean;
+}
+export interface TransferListItemProps extends TransferListItemViewProps {
+    index: number;
+    group: string;
+}
+/** Presentational-only item — used inside DragOverlay (no dnd hooks). */
+export declare const TransferListItemView: ({ item, onMove, moveIconName, isSelected, }: TransferListItemViewProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TransferListItem: ({ item, index, group, onMove, moveIconName, isSelected, }: TransferListItemProps) => import("react/jsx-runtime").JSX.Element;