@pautena/react-design-system 2.0.0-alpha.1b → 2.0.0-alpha.5

package/dist/components/notification-center/notification-center-provider.mjs

@@ -0,0 +1,31 @@
+import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { toast as e } from "../../node_modules/sonner/dist/index.mjs";
+import { Toaster as n } from "../ui/sonner.mjs";
+import { NotificationCenterContext as m } from "./notification-center-context.mjs";
+const c = ({
+  children: o,
+  ...t
+}) => /* @__PURE__ */ r(
+  m.Provider,
+  {
+    value: {
+      toast: e
+    },
+    children: [
+      /* @__PURE__ */ i(
+        n,
+        {
+          position: "top-right",
+          closeButton: !0,
+          duration: 6e3,
+          ...t
+        }
+      ),
+      o
+    ]
+  }
+);
+export {
+  c as NotificationCenterProvider
+};
+//# sourceMappingURL=notification-center-provider.mjs.map

package/dist/components/notification-center/notification-center-provider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-center-provider.mjs","sources":["../../../src/components/notification-center/notification-center-provider.tsx"],"sourcesContent":["import { type ToasterProps, toast } from \"sonner\";\nimport { Toaster } from \"@/components/ui/sonner\";\nimport { NotificationCenterContext } from \"./notification-center-context\";\n\n/**\n * Props for the NotificationCenterProvider component.\n */\nexport interface NotificationCenterProviderProps extends ToasterProps {\n  /**\n   * Content to wrap with notification context.\n   */\n  children?: React.ReactNode;\n}\n\nexport const NotificationCenterProvider = ({\n  children,\n  ...toasterProps\n}: NotificationCenterProviderProps) => {\n  return (\n    <NotificationCenterContext.Provider\n      value={{\n        toast,\n      }}\n    >\n      <Toaster\n        position=\"top-right\"\n        closeButton\n        duration={6000}\n        {...toasterProps}\n      />\n      {children}\n    </NotificationCenterContext.Provider>\n  );\n};\n"],"names":["NotificationCenterProvider","children","toasterProps","jsxs","NotificationCenterContext","toast","jsx","Toaster"],"mappings":";;;;AAcO,MAAMA,IAA6B,CAAC;AAAA,EACzC,UAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAACC,EAA0B;AAAA,EAA1B;AAAA,IACC,OAAO;AAAA,MACL,OAAAC;AAAA,IAAA;AAAA,IAGF,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,UAAS;AAAA,UACT,aAAW;AAAA,UACX,UAAU;AAAA,UACT,GAAGL;AAAA,QAAA;AAAA,MAAA;AAAA,MAELD;AAAA,IAAA;AAAA,EAAA;AAAA;"}

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

@@ -0,0 +1,2 @@
+export type { PlaceholderAction, PlaceholderIcon, PlaceholderIconArgs, PlaceholderProps, } from './placeholder';
+export { default, default as Placeholder } from './placeholder';

package/dist/components/placeholder/placeholder.d.ts

@@ -0,0 +1,75 @@
+import { ReactElement } from 'react';
+type IconColor = "inherit" | "action" | "disabled" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
+/**
+ * Action button configuration for placeholder.
+ */
+export interface PlaceholderAction {
+    /**
+     * Unique identifier.
+     */
+    id: string;
+    /**
+     * Button text label.
+     */
+    text: string;
+    /**
+     * Navigation URL when clicked.
+     */
+    href?: string;
+    /**
+     * Click handler function.
+     */
+    onClick?: () => void;
+}
+/**
+ * Arguments passed to icon render function.
+ */
+export interface PlaceholderIconArgs {
+    /**
+     * Icon size in pixels.
+     */
+    size: number;
+    /**
+     * Icon color theme.
+     */
+    color: IconColor;
+}
+/**
+ * Function that renders a custom icon element.
+ */
+export type PlaceholderIcon = ({ size, color, }: PlaceholderIconArgs) => ReactElement;
+/**
+ * Props for the Placeholder component.
+ */
+export interface PlaceholderProps {
+    /**
+     * Main title text.
+     */
+    title: string;
+    /**
+     * Subtitle or description text.
+     */
+    subtitle: string;
+    /**
+     * Icon size in pixels.
+     * @default 120
+     */
+    iconSize?: number;
+    /**
+     * Custom icon render function.
+     */
+    icon?: PlaceholderIcon;
+    /**
+     * Action buttons to display.
+     */
+    actions?: PlaceholderAction[];
+    /**
+     * Additional CSS classes.
+     */
+    className?: string;
+}
+/**
+ * Empty state placeholder with optional icon and actions.
+ */
+export declare function Placeholder({ title, subtitle, icon, iconSize, actions, className, }: PlaceholderProps): import("react/jsx-runtime").JSX.Element;
+export default Placeholder;

package/dist/components/placeholder/placeholder.mjs

@@ -0,0 +1,59 @@
+import { jsxs as f, jsx as e } from "react/jsx-runtime";
+import { cn as t } from "../../lib/utils.mjs";
+function b({
+  title: o,
+  subtitle: a,
+  icon: d,
+  iconSize: c = 120,
+  actions: r,
+  className: u
+}) {
+  return /* @__PURE__ */ f(
+    "div",
+    {
+      className: t(
+        "flex flex-col items-center justify-center text-center",
+        u
+      ),
+      children: [
+        d?.({ size: c, color: "primary" }),
+        /* @__PURE__ */ e("h1", { className: "text-3xl font-semibold", children: o }),
+        /* @__PURE__ */ e("h2", { className: "mt-2 text-base text-muted-foreground", children: a }),
+        r ? /* @__PURE__ */ e("div", { className: "pt-4", children: r.map(({ id: n, text: m, href: l, onClick: i }, x) => {
+          const s = x < r.length - 1 ? "mr-2" : "";
+          return l ? /* @__PURE__ */ e(
+            "a",
+            {
+              role: "button",
+              href: l,
+              onClick: i,
+              className: t(
+                "inline-flex h-9 items-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground",
+                s
+              ),
+              children: m
+            },
+            n
+          ) : /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: i,
+              className: t(
+                "inline-flex h-9 items-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground",
+                s
+              ),
+              children: m
+            },
+            n
+          );
+        }) }) : null
+      ]
+    }
+  );
+}
+export {
+  b as Placeholder,
+  b as default
+};
+//# sourceMappingURL=placeholder.mjs.map

package/dist/components/placeholder/placeholder.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"placeholder.mjs","sources":["../../../src/components/placeholder/placeholder.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { cn } from \"@/lib/utils\";\n\ntype IconColor =\n  | \"inherit\"\n  | \"action\"\n  | \"disabled\"\n  | \"primary\"\n  | \"secondary\"\n  | \"error\"\n  | \"info\"\n  | \"success\"\n  | \"warning\";\n\n/**\n * Action button configuration for placeholder.\n */\nexport interface PlaceholderAction {\n  /**\n   * Unique identifier.\n   */\n  id: string;\n  /**\n   * Button text label.\n   */\n  text: string;\n  /**\n   * Navigation URL when clicked.\n   */\n  href?: string;\n  /**\n   * Click handler function.\n   */\n  onClick?: () => void;\n}\n\n/**\n * Arguments passed to icon render function.\n */\nexport interface PlaceholderIconArgs {\n  /**\n   * Icon size in pixels.\n   */\n  size: number;\n  /**\n   * Icon color theme.\n   */\n  color: IconColor;\n}\n\n/**\n * Function that renders a custom icon element.\n */\nexport type PlaceholderIcon = ({\n  size,\n  color,\n}: PlaceholderIconArgs) => ReactElement;\n\n/**\n * Props for the Placeholder component.\n */\nexport interface PlaceholderProps {\n  /**\n   * Main title text.\n   */\n  title: string;\n  /**\n   * Subtitle or description text.\n   */\n  subtitle: string;\n  /**\n   * Icon size in pixels.\n   * @default 120\n   */\n  iconSize?: number;\n  /**\n   * Custom icon render function.\n   */\n  icon?: PlaceholderIcon;\n  /**\n   * Action buttons to display.\n   */\n  actions?: PlaceholderAction[];\n  /**\n   * Additional CSS classes.\n   */\n  className?: string;\n}\n\n/**\n * Empty state placeholder with optional icon and actions.\n */\nexport function Placeholder({\n  title,\n  subtitle,\n  icon,\n  iconSize = 120,\n  actions,\n  className,\n}: PlaceholderProps) {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col items-center justify-center text-center\",\n        className,\n      )}\n    >\n      {icon?.({ size: iconSize, color: \"primary\" })}\n      <h1 className=\"text-3xl font-semibold\">{title}</h1>\n      <h2 className=\"mt-2 text-base text-muted-foreground\">{subtitle}</h2>\n      {actions ? (\n        <div className=\"pt-4\">\n          {actions.map(({ id, text, href, onClick }, index) => {\n            const marginClass = index < actions.length - 1 ? \"mr-2\" : \"\";\n\n            if (href) {\n              return (\n                <a\n                  key={id}\n                  role=\"button\"\n                  href={href}\n                  onClick={onClick}\n                  className={cn(\n                    \"inline-flex h-9 items-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground\",\n                    marginClass,\n                  )}\n                >\n                  {text}\n                </a>\n              );\n            }\n\n            return (\n              <button\n                type=\"button\"\n                key={id}\n                onClick={onClick}\n                className={cn(\n                  \"inline-flex h-9 items-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground\",\n                  marginClass,\n                )}\n              >\n                {text}\n              </button>\n            );\n          })}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport default Placeholder;\n"],"names":["Placeholder","title","subtitle","icon","iconSize","actions","className","jsxs","cn","jsx","id","text","href","onClick","index","marginClass"],"mappings":";;AA4FO,SAASA,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,WAAAC;AACF,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAAH,IAAO,EAAE,MAAMC,GAAU,OAAO,WAAW;AAAA,QAC5C,gBAAAK,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAR,GAAM;AAAA,QAC9C,gBAAAQ,EAAC,MAAA,EAAG,WAAU,wCAAwC,UAAAP,GAAS;AAAA,QAC9DG,IACC,gBAAAI,EAAC,OAAA,EAAI,WAAU,QACZ,UAAAJ,EAAQ,IAAI,CAAC,EAAE,IAAAK,GAAI,MAAAC,GAAM,MAAAC,GAAM,SAAAC,EAAA,GAAWC,MAAU;AACnD,gBAAMC,IAAcD,IAAQT,EAAQ,SAAS,IAAI,SAAS;AAE1D,iBAAIO,IAEA,gBAAAH;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC,MAAK;AAAA,cACL,MAAAG;AAAA,cACA,SAAAC;AAAA,cACA,WAAWL;AAAA,gBACT;AAAA,gBACAO;AAAA,cAAA;AAAA,cAGD,UAAAJ;AAAA,YAAA;AAAA,YATID;AAAA,UAAA,IAeT,gBAAAD;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cAEL,SAAAI;AAAA,cACA,WAAWL;AAAA,gBACT;AAAA,gBACAO;AAAA,cAAA;AAAA,cAGD,UAAAJ;AAAA,YAAA;AAAA,YAPID;AAAA,UAAA;AAAA,QAUX,CAAC,GACH,IACE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/components/placeholder/placeholder.mock.d.ts

@@ -0,0 +1,2 @@
+import { PlaceholderAction } from './placeholder';
+export declare const actions: PlaceholderAction[];

package/dist/components/remote-data-table/index.d.ts

@@ -0,0 +1,3 @@
+export type { OnChangeFn, PaginationState, QuerySpecField, QuerySpecFieldOption, QuerySpecFieldType, QuerySpecFilter, QuerySpecOp, RemoteDataTableColumn, RemoteDataTableColumnMeta, RemoteDataTableProps, RemoteDataTableQueryBuilderProps, SortingState, } from './remote-data-table';
+export { buildQuerySpecParams, default, default as RemoteDataTable, } from './remote-data-table';
+export * from './use-remote-data-table';

package/dist/components/remote-data-table/query-spec-utils.d.ts

@@ -0,0 +1,8 @@
+import { QuerySpecField, QuerySpecFilter, QuerySpecOp } from './remote-data-table.types';
+export declare const querySpecOpLabels: Record<QuerySpecOp, string>;
+export declare const createFilterId: () => string;
+export declare const getFieldByName: (fields: QuerySpecField[], name: string) => QuerySpecField | undefined;
+export declare const getOpsForField: (field?: QuerySpecField) => QuerySpecOp[];
+export declare const coerceFilterValue: (field: QuerySpecField | undefined, op: QuerySpecOp, value?: string) => string;
+export declare const formatFiltersSummary: (filters: QuerySpecFilter[], fields: QuerySpecField[]) => string;
+export declare const buildQuerySpecParams: (filters: QuerySpecFilter[], fields: QuerySpecField[]) => Record<string, string | number | boolean>;

package/dist/components/remote-data-table/query-spec-utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"query-spec-utils.mjs","sources":["../../../src/components/remote-data-table/query-spec-utils.ts"],"sourcesContent":["import type {\n  QuerySpecField,\n  QuerySpecFilter,\n  QuerySpecOp,\n} from \"./remote-data-table.types\";\n\nconst defaultQuerySpecOps: QuerySpecOp[] = [\"eq\"];\n\nexport const querySpecOpLabels: Record<QuerySpecOp, string> = {\n  eq: \"is\",\n  neq: \"is not\",\n  lt: \"<\",\n  lte: \"<=\",\n  gt: \">\",\n  gte: \">=\",\n  ilike: \"contains\",\n  in: \"in\",\n  isnull: \"is null\",\n};\n\nexport const createFilterId = () =>\n  typeof crypto !== \"undefined\" && typeof crypto.randomUUID === \"function\"\n    ? crypto.randomUUID()\n    : `filter-${Math.random().toString(36).slice(2, 10)}`;\n\nexport const getFieldByName = (fields: QuerySpecField[], name: string) =>\n  fields.find((field) => field.name === name);\n\nexport const getOpsForField = (field?: QuerySpecField) =>\n  field?.ops?.length ? field.ops : defaultQuerySpecOps;\n\nexport const coerceFilterValue = (\n  field: QuerySpecField | undefined,\n  op: QuerySpecOp,\n  value?: string,\n) => {\n  if (op === \"isnull\") {\n    return value === \"false\" ? \"false\" : \"true\";\n  }\n\n  if (field?.type === \"boolean\") {\n    return value === \"false\" ? \"false\" : \"true\";\n  }\n\n  return value ?? \"\";\n};\n\nconst normalizeFilterValue = (\n  filter: QuerySpecFilter,\n  field?: QuerySpecField,\n) => {\n  if (filter.op === \"isnull\") {\n    return filter.value === \"false\" ? \"false\" : \"true\";\n  }\n\n  const raw = (filter.value ?? \"\").trim();\n  if (!raw) {\n    return \"\";\n  }\n\n  if (filter.op === \"in\") {\n    return raw\n      .split(\",\")\n      .map((part) => part.trim())\n      .filter(Boolean)\n      .join(\",\");\n  }\n\n  if (field?.type === \"date\" || field?.type === \"datetime\") {\n    const parsed = new Date(raw);\n    if (!Number.isNaN(parsed.getTime())) {\n      return parsed.toISOString();\n    }\n  }\n\n  if (field?.type === \"boolean\") {\n    return raw === \"false\" ? \"false\" : \"true\";\n  }\n\n  return raw;\n};\n\nconst getOptionLabel = (value: string, field?: QuerySpecField) => {\n  if (!field?.options?.length) {\n    return value;\n  }\n\n  return field.options.find((option) => option.value === value)?.label ?? value;\n};\n\nconst formatFilterSummary = (\n  filter: QuerySpecFilter,\n  field?: QuerySpecField,\n) => {\n  const label = field?.label ?? filter.field;\n  const rawValue = (filter.value ?? \"\").trim();\n\n  if (filter.op === \"isnull\") {\n    const isNull = rawValue !== \"false\";\n    return `${label} ${isNull ? \"is null\" : \"is not null\"}`;\n  }\n\n  if (!rawValue) {\n    return \"\";\n  }\n\n  const opLabel = querySpecOpLabels[filter.op] ?? filter.op;\n\n  if (filter.op === \"in\") {\n    const values = rawValue\n      .split(\",\")\n      .map((part) => part.trim())\n      .filter(Boolean)\n      .map((value) => getOptionLabel(value, field))\n      .join(\", \");\n    return `${label} ${opLabel} (${values})`;\n  }\n\n  const displayValue = getOptionLabel(rawValue, field);\n  const needsQuotes =\n    !field?.type ||\n    field.type === \"string\" ||\n    field.type === \"date\" ||\n    field.type === \"datetime\";\n  const formattedValue = needsQuotes ? `\"${displayValue}\"` : displayValue;\n  return `${label} ${opLabel} ${formattedValue}`;\n};\n\nexport const formatFiltersSummary = (\n  filters: QuerySpecFilter[],\n  fields: QuerySpecField[],\n) => {\n  if (!filters.length) {\n    return \"\";\n  }\n\n  const fieldMap = new Map(fields.map((field) => [field.name, field]));\n  return filters\n    .map((filter) => formatFilterSummary(filter, fieldMap.get(filter.field)))\n    .filter(Boolean)\n    .join(\" AND \");\n};\n\nexport const buildQuerySpecParams = (\n  filters: QuerySpecFilter[],\n  fields: QuerySpecField[],\n) => {\n  const fieldMap = new Map(fields.map((field) => [field.name, field]));\n  const params: Record<string, string | number | boolean> = {};\n\n  for (const filter of filters) {\n    const field = fieldMap.get(filter.field);\n    if (!field) {\n      continue;\n    }\n\n    const normalized = normalizeFilterValue(filter, field);\n    if (!normalized && filter.op !== \"isnull\") {\n      continue;\n    }\n\n    const key = filter.op === \"eq\" ? field.name : `${field.name}__${filter.op}`;\n    if (filter.op === \"isnull\") {\n      params[key] = normalized !== \"false\";\n    } else if (field.type === \"boolean\") {\n      params[key] = normalized !== \"false\";\n    } else if (field.type === \"number\" && filter.op !== \"in\") {\n      const numeric = Number(normalized);\n      params[key] = Number.isNaN(numeric) ? normalized : numeric;\n    } else {\n      params[key] = normalized;\n    }\n  }\n\n  return params;\n};\n"],"names":["defaultQuerySpecOps","querySpecOpLabels","createFilterId","getFieldByName","fields","name","field","getOpsForField","coerceFilterValue","op","value","normalizeFilterValue","filter","raw","part","parsed","getOptionLabel","option","formatFilterSummary","label","rawValue","opLabel","values","displayValue","formattedValue","formatFiltersSummary","filters","fieldMap","buildQuerySpecParams","params","normalized","key","numeric"],"mappings":"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"}

package/dist/components/remote-data-table/remote-data-table-body.d.ts

@@ -0,0 +1,26 @@
+import { RemoteDataTableColumn, SortingState } from './remote-data-table.types';
+/**
+ * Props for the RemoteDataTableBody component
+ *
+ * @template TData - The type of data being displayed in the table
+ */
+type RemoteDataTableBodyProps<TData> = {
+    /** Array of data items to display */
+    data: TData[];
+    /** Column definitions for the table */
+    columns: RemoteDataTableColumn<TData>[];
+    /** Whether table rows are loading */
+    loading: boolean;
+    /** Message to display when there is no data */
+    emptyMessage: string;
+    /** Sorting state for the table */
+    sorting?: SortingState;
+    /** Callback fired when sorting changes */
+    onSortingChange?: (sorting: SortingState) => void;
+    /** Callback fired when a row is clicked */
+    onRowClick?: (row: TData) => void;
+    /** Optional function to generate unique row IDs */
+    getRowId?: (row: TData, index: number) => string;
+};
+export declare const RemoteDataTableBody: <TData>({ data, columns, loading, emptyMessage, sorting, onSortingChange, onRowClick, getRowId, }: RemoteDataTableBodyProps<TData>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/remote-data-table/remote-data-table-body.mjs

@@ -0,0 +1,93 @@
+import { jsxs as h, jsx as t } from "react/jsx-runtime";
+import { Table as D, TableHeader as B, TableRow as n, TableHead as C, TableBody as j, TableCell as m } from "../ui/table.mjs";
+import { cn as f } from "../../lib/utils.mjs";
+import H from "../../node_modules/lucide-react/dist/esm/icons/loader-circle.mjs";
+import K from "../../node_modules/lucide-react/dist/esm/icons/chevron-up.mjs";
+import L from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.mjs";
+import U from "../../node_modules/lucide-react/dist/esm/icons/arrow-up-down.mjs";
+const b = (s) => s === "center" ? "text-center" : s === "right" ? "text-right" : "text-left", G = ({
+  data: s,
+  columns: c,
+  loading: l,
+  emptyMessage: N,
+  sorting: p = [],
+  onSortingChange: d,
+  onRowClick: o,
+  getRowId: x
+}) => {
+  const u = Math.max(c.length, 1), g = !l && s.length === 0, y = !!o, w = (e) => {
+    if (!d) return;
+    const r = p.find((i) => i.id === e);
+    r ? r.desc ? d([]) : d([{ id: e, desc: !0 }]) : d([{ id: e, desc: !1 }]);
+  }, W = (e) => {
+    const r = p.find((i) => i.id === e);
+    return r ? r.desc ? "desc" : "asc" : !1;
+  }, v = (e) => e === "asc" ? /* @__PURE__ */ t(K, { className: "h-4 w-4" }) : e === "desc" ? /* @__PURE__ */ t(L, { className: "h-4 w-4" }) : /* @__PURE__ */ t(U, { className: "h-4 w-4 text-muted-foreground" });
+  return /* @__PURE__ */ h(D, { "aria-busy": l, children: [
+    /* @__PURE__ */ t(B, { className: "bg-muted/40", children: /* @__PURE__ */ t(n, { children: c.map((e) => {
+      const r = W(e.id), i = (e.enableSorting ?? !0) && d;
+      return /* @__PURE__ */ t(
+        C,
+        {
+          "aria-sort": r === "asc" ? "ascending" : r === "desc" ? "descending" : "none",
+          className: f(
+            "text-xs font-semibold uppercase tracking-wide text-muted-foreground",
+            b(e.meta?.align)
+          ),
+          style: {
+            width: e.meta?.width,
+            minWidth: e.meta?.minWidth,
+            maxWidth: e.meta?.maxWidth
+          },
+          children: i ? /* @__PURE__ */ h(
+            "button",
+            {
+              type: "button",
+              className: "flex w-full items-center gap-2",
+              onClick: () => w(e.id),
+              children: [
+                /* @__PURE__ */ t("span", { className: "truncate", children: e.header }),
+                v(r)
+              ]
+            }
+          ) : e.header
+        },
+        e.id
+      );
+    }) }) }),
+    /* @__PURE__ */ t(j, { children: l ? /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(m, { colSpan: u, children: /* @__PURE__ */ h("div", { className: "flex items-center gap-2 py-3 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ t(H, { className: "h-4 w-4 animate-spin", "aria-hidden": "true" }),
+      /* @__PURE__ */ t("span", { children: "Loading" })
+    ] }) }) }) : g ? /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(m, { colSpan: u, children: /* @__PURE__ */ t("p", { className: "py-3 text-sm text-muted-foreground", children: N }) }) }) : s.map((e, r) => {
+      const i = x ? x(e, r) : String(r);
+      return /* @__PURE__ */ t(
+        n,
+        {
+          className: f(y && "cursor-pointer"),
+          onClick: o ? () => o(e) : void 0,
+          children: c.map((a) => {
+            const T = a.accessorKey ? e[a.accessorKey] : void 0, S = a.cell ? a.cell(e) : String(T ?? "");
+            return /* @__PURE__ */ t(
+              m,
+              {
+                className: f(b(a.meta?.align)),
+                style: {
+                  width: a.meta?.width,
+                  minWidth: a.meta?.minWidth,
+                  maxWidth: a.meta?.maxWidth
+                },
+                children: S
+              },
+              a.id
+            );
+          })
+        },
+        i
+      );
+    }) })
+  ] });
+};
+export {
+  G as RemoteDataTableBody
+};
+//# sourceMappingURL=remote-data-table-body.mjs.map

package/dist/components/remote-data-table/remote-data-table-body.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"remote-data-table-body.mjs","sources":["../../../src/components/remote-data-table/remote-data-table-body.tsx"],"sourcesContent":["import { ArrowUpDown, ChevronDown, ChevronUp, Loader2 } from \"lucide-react\";\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/components/ui/table\";\nimport { cn } from \"@/lib/utils\";\nimport type {\n  RemoteDataTableColumn,\n  SortingState,\n} from \"./remote-data-table.types\";\n\n/**\n * Props for the RemoteDataTableBody component\n *\n * @template TData - The type of data being displayed in the table\n */\ntype RemoteDataTableBodyProps<TData> = {\n  /** Array of data items to display */\n  data: TData[];\n  /** Column definitions for the table */\n  columns: RemoteDataTableColumn<TData>[];\n  /** Whether table rows are loading */\n  loading: boolean;\n  /** Message to display when there is no data */\n  emptyMessage: string;\n  /** Sorting state for the table */\n  sorting?: SortingState;\n  /** Callback fired when sorting changes */\n  onSortingChange?: (sorting: SortingState) => void;\n  /** Callback fired when a row is clicked */\n  onRowClick?: (row: TData) => void;\n  /** Optional function to generate unique row IDs */\n  getRowId?: (row: TData, index: number) => string;\n};\n\nconst alignClassName = (align?: \"left\" | \"center\" | \"right\") => {\n  if (align === \"center\") return \"text-center\";\n  if (align === \"right\") return \"text-right\";\n  return \"text-left\";\n};\n\nexport const RemoteDataTableBody = <TData,>({\n  data,\n  columns,\n  loading,\n  emptyMessage,\n  sorting = [],\n  onSortingChange,\n  onRowClick,\n  getRowId,\n}: RemoteDataTableBodyProps<TData>) => {\n  const columnCount = Math.max(columns.length, 1);\n  const showEmpty = !loading && data.length === 0;\n  const isInteractive = Boolean(onRowClick);\n\n  const handleSort = (columnId: string) => {\n    if (!onSortingChange) return;\n\n    const existingSort = sorting.find((sort) => sort.id === columnId);\n    if (!existingSort) {\n      onSortingChange([{ id: columnId, desc: false }]);\n    } else if (!existingSort.desc) {\n      onSortingChange([{ id: columnId, desc: true }]);\n    } else {\n      onSortingChange([]);\n    }\n  };\n\n  const getSortDirection = (columnId: string) => {\n    const sort = sorting.find((item) => item.id === columnId);\n    if (!sort) return false;\n    return sort.desc ? \"desc\" : \"asc\";\n  };\n\n  const getSortIcon = (direction: \"asc\" | \"desc\" | false) => {\n    if (direction === \"asc\") {\n      return <ChevronUp className=\"h-4 w-4\" />;\n    }\n\n    if (direction === \"desc\") {\n      return <ChevronDown className=\"h-4 w-4\" />;\n    }\n\n    return <ArrowUpDown className=\"h-4 w-4 text-muted-foreground\" />;\n  };\n\n  return (\n    <Table aria-busy={loading}>\n      <TableHeader className=\"bg-muted/40\">\n        <TableRow>\n          {columns.map((column) => {\n            const sortDirection = getSortDirection(column.id);\n            const canSort = (column.enableSorting ?? true) && onSortingChange;\n\n            return (\n              <TableHead\n                key={column.id}\n                aria-sort={\n                  sortDirection === \"asc\"\n                    ? \"ascending\"\n                    : sortDirection === \"desc\"\n                      ? \"descending\"\n                      : \"none\"\n                }\n                className={cn(\n                  \"text-xs font-semibold uppercase tracking-wide text-muted-foreground\",\n                  alignClassName(column.meta?.align),\n                )}\n                style={{\n                  width: column.meta?.width,\n                  minWidth: column.meta?.minWidth,\n                  maxWidth: column.meta?.maxWidth,\n                }}\n              >\n                {canSort ? (\n                  <button\n                    type=\"button\"\n                    className=\"flex w-full items-center gap-2\"\n                    onClick={() => handleSort(column.id)}\n                  >\n                    <span className=\"truncate\">{column.header}</span>\n                    {getSortIcon(sortDirection)}\n                  </button>\n                ) : (\n                  column.header\n                )}\n              </TableHead>\n            );\n          })}\n        </TableRow>\n      </TableHeader>\n      <TableBody>\n        {loading ? (\n          <TableRow>\n            <TableCell colSpan={columnCount}>\n              <div className=\"flex items-center gap-2 py-3 text-sm text-muted-foreground\">\n                <Loader2 className=\"h-4 w-4 animate-spin\" aria-hidden=\"true\" />\n                <span>Loading</span>\n              </div>\n            </TableCell>\n          </TableRow>\n        ) : showEmpty ? (\n          <TableRow>\n            <TableCell colSpan={columnCount}>\n              <p className=\"py-3 text-sm text-muted-foreground\">\n                {emptyMessage}\n              </p>\n            </TableCell>\n          </TableRow>\n        ) : (\n          data.map((row, index) => {\n            const rowId = getRowId ? getRowId(row, index) : String(index);\n\n            return (\n              <TableRow\n                key={rowId}\n                className={cn(isInteractive && \"cursor-pointer\")}\n                onClick={onRowClick ? () => onRowClick(row) : undefined}\n              >\n                {columns.map((column) => {\n                  const value = column.accessorKey\n                    ? row[column.accessorKey]\n                    : undefined;\n                  const cellContent = column.cell\n                    ? column.cell(row)\n                    : String(value ?? \"\");\n\n                  return (\n                    <TableCell\n                      key={column.id}\n                      className={cn(alignClassName(column.meta?.align))}\n                      style={{\n                        width: column.meta?.width,\n                        minWidth: column.meta?.minWidth,\n                        maxWidth: column.meta?.maxWidth,\n                      }}\n                    >\n                      {cellContent}\n                    </TableCell>\n                  );\n                })}\n              </TableRow>\n            );\n          })\n        )}\n      </TableBody>\n    </Table>\n  );\n};\n"],"names":["alignClassName","align","RemoteDataTableBody","data","columns","loading","emptyMessage","sorting","onSortingChange","onRowClick","getRowId","columnCount","showEmpty","isInteractive","handleSort","columnId","existingSort","sort","getSortDirection","item","getSortIcon","direction","jsx","ChevronUp","ChevronDown","ArrowUpDown","jsxs","Table","TableHeader","TableRow","column","sortDirection","canSort","TableHead","cn","TableBody","TableCell","Loader2","row","index","rowId","value","cellContent"],"mappings":"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"}

package/dist/components/remote-data-table/remote-data-table-pagination.d.ts

@@ -0,0 +1,16 @@
+import { OnChangeFn, PaginationState } from './remote-data-table.types';
+/**
+ * Props for the RemoteDataTablePagination component
+ */
+type RemoteDataTablePaginationProps = {
+    /** Current pagination state */
+    pagination: PaginationState;
+    /** Callback fired when pagination changes */
+    onPaginationChange: OnChangeFn<PaginationState>;
+    /** Total number of rows available */
+    rowCount: number;
+    /** Available page size options */
+    pageSizeOptions: number[];
+};
+export declare const RemoteDataTablePagination: ({ pagination, onPaginationChange, rowCount, pageSizeOptions, }: RemoteDataTablePaginationProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/remote-data-table/remote-data-table-pagination.mjs

@@ -0,0 +1,86 @@
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
+import { Button as c } from "../ui/button.mjs";
+import { cn as g } from "../../lib/utils.mjs";
+const u = ({
+  pagination: a,
+  onPaginationChange: l,
+  rowCount: t,
+  pageSizeOptions: m
+}) => {
+  const d = Math.max(1, Math.ceil(t / a.pageSize)), x = a.pageIndex > 0, o = a.pageIndex < d - 1, n = t === 0 ? 0 : a.pageIndex * a.pageSize + 1, p = Math.min(
+    t,
+    (a.pageIndex + 1) * a.pageSize
+  );
+  return /* @__PURE__ */ r("div", { className: "flex flex-col gap-3 border-t border-border px-4 py-3 text-sm text-muted-foreground sm:flex-row sm:items-center sm:justify-between", children: [
+    /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ s("span", { children: "Rows per page" }),
+      /* @__PURE__ */ s(
+        "select",
+        {
+          "aria-label": "Rows per page",
+          className: g(
+            "h-8 rounded-md border border-input bg-background px-2 text-sm text-foreground"
+          ),
+          value: a.pageSize,
+          onChange: (e) => {
+            l((i) => ({
+              ...i,
+              pageIndex: 0,
+              pageSize: Number(e.target.value)
+            }));
+          },
+          children: m.map((e) => /* @__PURE__ */ s("option", { value: e, children: e }, e))
+        }
+      )
+    ] }),
+    /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-3", children: [
+      /* @__PURE__ */ r("span", { children: [
+        n,
+        "-",
+        p,
+        " of ",
+        t
+      ] }),
+      /* @__PURE__ */ r("span", { className: "text-xs text-muted-foreground", children: [
+        "Page ",
+        d === 0 ? 0 : a.pageIndex + 1,
+        " of ",
+        d
+      ] }),
+      /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ s(
+          c,
+          {
+            variant: "ghost",
+            size: "sm",
+            "aria-label": "Go to previous page",
+            disabled: !x,
+            onClick: () => l((e) => ({
+              ...e,
+              pageIndex: Math.max(0, e.pageIndex - 1)
+            })),
+            children: "Previous"
+          }
+        ),
+        /* @__PURE__ */ s(
+          c,
+          {
+            variant: "ghost",
+            size: "sm",
+            "aria-label": "Go to next page",
+            disabled: !o,
+            onClick: () => l((e) => ({
+              ...e,
+              pageIndex: Math.min(d - 1, e.pageIndex + 1)
+            })),
+            children: "Next"
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+export {
+  u as RemoteDataTablePagination
+};
+//# sourceMappingURL=remote-data-table-pagination.mjs.map

package/dist/components/remote-data-table/remote-data-table-pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"remote-data-table-pagination.mjs","sources":["../../../src/components/remote-data-table/remote-data-table-pagination.tsx"],"sourcesContent":["import { Button } from \"@/components/ui/button\";\nimport { cn } from \"@/lib/utils\";\nimport type { OnChangeFn, PaginationState } from \"./remote-data-table.types\";\n\n/**\n * Props for the RemoteDataTablePagination component\n */\ntype RemoteDataTablePaginationProps = {\n  /** Current pagination state */\n  pagination: PaginationState;\n  /** Callback fired when pagination changes */\n  onPaginationChange: OnChangeFn<PaginationState>;\n  /** Total number of rows available */\n  rowCount: number;\n  /** Available page size options */\n  pageSizeOptions: number[];\n};\n\nexport const RemoteDataTablePagination = ({\n  pagination,\n  onPaginationChange,\n  rowCount,\n  pageSizeOptions,\n}: RemoteDataTablePaginationProps) => {\n  const totalPages = Math.max(1, Math.ceil(rowCount / pagination.pageSize));\n  const canPrevious = pagination.pageIndex > 0;\n  const canNext = pagination.pageIndex < totalPages - 1;\n  const from =\n    rowCount === 0 ? 0 : pagination.pageIndex * pagination.pageSize + 1;\n  const to = Math.min(\n    rowCount,\n    (pagination.pageIndex + 1) * pagination.pageSize,\n  );\n\n  return (\n    <div className=\"flex flex-col gap-3 border-t border-border px-4 py-3 text-sm text-muted-foreground sm:flex-row sm:items-center sm:justify-between\">\n      <div className=\"flex items-center gap-2\">\n        <span>Rows per page</span>\n        <select\n          aria-label=\"Rows per page\"\n          className={cn(\n            \"h-8 rounded-md border border-input bg-background px-2 text-sm text-foreground\",\n          )}\n          value={pagination.pageSize}\n          onChange={(event) => {\n            onPaginationChange((prev) => ({\n              ...prev,\n              pageIndex: 0,\n              pageSize: Number(event.target.value),\n            }));\n          }}\n        >\n          {pageSizeOptions.map((option) => (\n            <option key={option} value={option}>\n              {option}\n            </option>\n          ))}\n        </select>\n      </div>\n\n      <div className=\"flex flex-wrap items-center gap-3\">\n        <span>\n          {from}-{to} of {rowCount}\n        </span>\n        <span className=\"text-xs text-muted-foreground\">\n          Page {totalPages === 0 ? 0 : pagination.pageIndex + 1} of {totalPages}\n        </span>\n        <div className=\"flex items-center gap-1\">\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Go to previous page\"\n            disabled={!canPrevious}\n            onClick={() =>\n              onPaginationChange((prev) => ({\n                ...prev,\n                pageIndex: Math.max(0, prev.pageIndex - 1),\n              }))\n            }\n          >\n            Previous\n          </Button>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Go to next page\"\n            disabled={!canNext}\n            onClick={() =>\n              onPaginationChange((prev) => ({\n                ...prev,\n                pageIndex: Math.min(totalPages - 1, prev.pageIndex + 1),\n              }))\n            }\n          >\n            Next\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["RemoteDataTablePagination","pagination","onPaginationChange","rowCount","pageSizeOptions","totalPages","canPrevious","canNext","from","to","jsxs","jsx","cn","event","prev","option","Button"],"mappings":";;;AAkBO,MAAMA,IAA4B,CAAC;AAAA,EACxC,YAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AACF,MAAsC;AACpC,QAAMC,IAAa,KAAK,IAAI,GAAG,KAAK,KAAKF,IAAWF,EAAW,QAAQ,CAAC,GAClEK,IAAcL,EAAW,YAAY,GACrCM,IAAUN,EAAW,YAAYI,IAAa,GAC9CG,IACJL,MAAa,IAAI,IAAIF,EAAW,YAAYA,EAAW,WAAW,GAC9DQ,IAAK,KAAK;AAAA,IACdN;AAAA,KACCF,EAAW,YAAY,KAAKA,EAAW;AAAA,EAAA;AAG1C,SACE,gBAAAS,EAAC,OAAA,EAAI,WAAU,qIACb,UAAA;AAAA,IAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,MAAA,gBAAAC,EAAC,UAAK,UAAA,gBAAA,CAAa;AAAA,MACnB,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,cAAW;AAAA,UACX,WAAWC;AAAA,YACT;AAAA,UAAA;AAAA,UAEF,OAAOX,EAAW;AAAA,UAClB,UAAU,CAACY,MAAU;AACnB,YAAAX,EAAmB,CAACY,OAAU;AAAA,cAC5B,GAAGA;AAAA,cACH,WAAW;AAAA,cACX,UAAU,OAAOD,EAAM,OAAO,KAAK;AAAA,YAAA,EACnC;AAAA,UACJ;AAAA,UAEC,UAAAT,EAAgB,IAAI,CAACW,MACpB,gBAAAJ,EAAC,YAAoB,OAAOI,GACzB,UAAAA,EAAA,GADUA,CAEb,CACD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GACF;AAAA,IAEA,gBAAAL,EAAC,OAAA,EAAI,WAAU,qCACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,QAAA,EACE,UAAA;AAAA,QAAAF;AAAA,QAAK;AAAA,QAAEC;AAAA,QAAG;AAAA,QAAKN;AAAA,MAAA,GAClB;AAAA,MACA,gBAAAO,EAAC,QAAA,EAAK,WAAU,iCAAgC,UAAA;AAAA,QAAA;AAAA,QACxCL,MAAe,IAAI,IAAIJ,EAAW,YAAY;AAAA,QAAE;AAAA,QAAKI;AAAA,MAAA,GAC7D;AAAA,MACA,gBAAAK,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,cAAW;AAAA,YACX,UAAU,CAACV;AAAA,YACX,SAAS,MACPJ,EAAmB,CAACY,OAAU;AAAA,cAC5B,GAAGA;AAAA,cACH,WAAW,KAAK,IAAI,GAAGA,EAAK,YAAY,CAAC;AAAA,YAAA,EACzC;AAAA,YAEL,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGD,gBAAAH;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,cAAW;AAAA,YACX,UAAU,CAACT;AAAA,YACX,SAAS,MACPL,EAAmB,CAACY,OAAU;AAAA,cAC5B,GAAGA;AAAA,cACH,WAAW,KAAK,IAAIT,IAAa,GAAGS,EAAK,YAAY,CAAC;AAAA,YAAA,EACtD;AAAA,YAEL,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED,EAAA,CACF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/remote-data-table/remote-data-table-query-builder.d.ts

@@ -0,0 +1,13 @@
+import { RemoteDataTableQueryBuilderProps as RemoteDataTableQueryBuilderConfig } from './remote-data-table.types';
+/**
+ * Props for the RemoteDataTableQueryBuilder component
+ */
+type RemoteDataTableQueryBuilderProps = {
+    /** Query builder configuration */
+    queryBuilder: RemoteDataTableQueryBuilderConfig;
+};
+/**
+ * Filter builder for RemoteDataTable query definitions.
+ */
+export declare const RemoteDataTableQueryBuilder: ({ queryBuilder, }: RemoteDataTableQueryBuilderProps) => import("react/jsx-runtime").JSX.Element;
+export {};