@lssm/lib.design-system 1.7.3 → 1.9.0

package/dist/components/data-view/DataViewRenderer.js

@@ -1,67 +1,145 @@
 'use client';
 
-
+import { FiltersToolbar } from "../molecules/FiltersToolbar.js";
 import { DataViewList } from "./DataViewList.js";
 import { DataViewTable } from "./DataViewTable.js";
 import { DataViewDetail } from "./DataViewDetail.js";
-import "react";
-import { jsx } from "react/jsx-runtime";
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Pagination, PaginationContent, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from "@lssm/lib.ui-kit-web/ui/pagination";
 
 //#region src/components/data-view/DataViewRenderer.tsx
-function DataViewRenderer({ spec, items = [], item = null, className, renderActions, onSelect, onRowClick, headerActions, emptyState, footer }) {
-	switch (spec.view.kind) {
-		case "list": return /* @__PURE__ */ jsx(DataViewList, {
-			spec,
-			items,
-			className,
-			renderActions,
-			onSelect,
-			emptyState
-		});
-		case "table": return /* @__PURE__ */ jsx(DataViewTable, {
-			spec,
-			items,
-			className,
-			onRowClick,
-			emptyState,
-			headerActions,
-			footer
-		});
-		case "detail": return /* @__PURE__ */ jsx(DataViewDetail, {
-			spec,
-			item,
-			className,
-			emptyState,
-			headerActions
-		});
-		case "grid": {
-			const grid = spec.view;
-			const listView = {
-				kind: "list",
-				layout: "card",
-				fields: grid.fields,
-				filters: grid.filters,
-				actions: grid.actions,
-				primaryField: grid.primaryField,
-				secondaryFields: grid.secondaryFields
-			};
-			return /* @__PURE__ */ jsx(DataViewList, {
-				spec: {
-					...spec,
-					view: listView
-				},
+function DataViewRenderer({ spec, items = [], item = null, className, renderActions, onSelect, onRowClick, headerActions, emptyState, footer, search, onSearchChange, filters, onFilterChange, pagination, onPageChange }) {
+	const viewContent = React$1.useMemo(() => {
+		switch (spec.view.kind) {
+			case "list": return /* @__PURE__ */ jsx(DataViewList, {
+				spec,
 				items,
 				className,
 				renderActions,
 				onSelect,
 				emptyState
 			});
+			case "table": return /* @__PURE__ */ jsx(DataViewTable, {
+				spec,
+				items,
+				className,
+				onRowClick,
+				emptyState,
+				headerActions,
+				footer
+			});
+			case "detail": return /* @__PURE__ */ jsx(DataViewDetail, {
+				spec,
+				item,
+				className,
+				emptyState,
+				headerActions
+			});
+			case "grid": {
+				const grid = spec.view;
+				const listView = {
+					kind: "list",
+					layout: "card",
+					fields: grid.fields,
+					filters: grid.filters,
+					actions: grid.actions,
+					primaryField: grid.primaryField,
+					secondaryFields: grid.secondaryFields
+				};
+				return /* @__PURE__ */ jsx(DataViewList, {
+					spec: {
+						...spec,
+						view: listView
+					},
+					items,
+					className,
+					renderActions,
+					onSelect,
+					emptyState
+				});
+			}
+			default: return /* @__PURE__ */ jsx("div", {
+				className,
+				children: "Unsupported data view kind"
+			});
 		}
-		default: return /* @__PURE__ */ jsx("div", {
-			className,
-			children: "Unsupported data view kind"
-		});
-	}
+	}, [
+		spec,
+		items,
+		item,
+		className,
+		renderActions,
+		onSelect,
+		onRowClick,
+		headerActions,
+		emptyState,
+		footer
+	]);
+	if (!(spec.view.kind === "list" || spec.view.kind === "table" || spec.view.kind === "grid")) return /* @__PURE__ */ jsx(Fragment, { children: viewContent });
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-4",
+		children: [
+			(spec.view.filters?.length || onSearchChange) && /* @__PURE__ */ jsx(FiltersToolbar, {
+				searchValue: search,
+				onSearchChange,
+				searchPlaceholder: "Search...",
+				activeChips: filters ? Object.entries(filters).map(([key, value]) => ({
+					key,
+					label: `${key}: ${value}`,
+					onRemove: () => {
+						const newFilters = { ...filters };
+						delete newFilters[key];
+						onFilterChange?.(newFilters);
+					}
+				})) : [],
+				onClearAll: filters && Object.keys(filters).length > 0 ? () => onFilterChange?.({}) : void 0,
+				right: headerActions
+			}),
+			viewContent,
+			pagination && pagination.total > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "py-4",
+				children: [/* @__PURE__ */ jsx(Pagination, { children: /* @__PURE__ */ jsxs(PaginationContent, { children: [
+					/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationPrevious, {
+						href: "#",
+						onClick: (e) => {
+							e.preventDefault();
+							if (pagination.page > 1) onPageChange?.(pagination.page - 1);
+						},
+						"aria-disabled": pagination.page <= 1,
+						className: pagination.page <= 1 ? "pointer-events-none opacity-50" : ""
+					}) }),
+					/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationLink, {
+						href: "#",
+						isActive: true,
+						children: pagination.page
+					}) }),
+					/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationNext, {
+						href: "#",
+						onClick: (e) => {
+							e.preventDefault();
+							const totalPages = Math.ceil(pagination.total / pagination.pageSize);
+							if (pagination.page < totalPages) onPageChange?.(pagination.page + 1);
+						},
+						"aria-disabled": pagination.page >= Math.ceil(pagination.total / pagination.pageSize),
+						className: pagination.page >= Math.ceil(pagination.total / pagination.pageSize) ? "pointer-events-none opacity-50" : ""
+					}) })
+				] }) }), /* @__PURE__ */ jsxs("div", {
+					className: "text-muted-foreground mt-2 text-center text-sm",
+					children: [
+						"Page ",
+						pagination.page,
+						" of",
+						" ",
+						Math.ceil(pagination.total / pagination.pageSize),
+						" (",
+						pagination.total,
+						" items)"
+					]
+				})]
+			})
+		]
+	});
 }
 
 //#endregion

package/dist/components/data-view/DataViewRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataViewRenderer.js","names":["listView: DataViewListConfig"],"sources":["../../../src/components/data-view/DataViewRenderer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n  DataViewGridConfig,\n  DataViewListConfig,\n  DataViewSpec,\n} from '@lssm/lib.contracts/data-views';\nimport { DataViewList } from './DataViewList';\nimport { DataViewTable } from './DataViewTable';\nimport { DataViewDetail } from './DataViewDetail';\n\nexport interface DataViewRendererProps {\n  spec: DataViewSpec;\n  items?: Record<string, unknown>[];\n  item?: Record<string, unknown> | null;\n  className?: string;\n  renderActions?: (item: Record<string, unknown>) => React.ReactNode;\n  onSelect?: (item: Record<string, unknown>) => void;\n  onRowClick?: (item: Record<string, unknown>) => void;\n  headerActions?: React.ReactNode;\n  emptyState?: React.ReactNode;\n  footer?: React.ReactNode;\n}\n\nexport function DataViewRenderer({\n  spec,\n  items = [],\n  item = null,\n  className,\n  renderActions,\n  onSelect,\n  onRowClick,\n  headerActions,\n  emptyState,\n  footer,\n}: DataViewRendererProps) {\n  switch (spec.view.kind) {\n    case 'list':\n      return (\n        <DataViewList\n          spec={spec}\n          items={items}\n          className={className}\n          renderActions={renderActions}\n          onSelect={onSelect}\n          emptyState={emptyState}\n        />\n      );\n    case 'table':\n      return (\n        <DataViewTable\n          spec={spec}\n          items={items}\n          className={className}\n          onRowClick={onRowClick}\n          emptyState={emptyState}\n          headerActions={headerActions}\n          footer={footer}\n        />\n      );\n    case 'detail':\n      return (\n        <DataViewDetail\n          spec={spec}\n          item={item}\n          className={className}\n          emptyState={emptyState}\n          headerActions={headerActions}\n        />\n      );\n    case 'grid': {\n      const grid = spec.view as DataViewGridConfig;\n      const listView: DataViewListConfig = {\n        kind: 'list',\n        layout: 'card',\n        fields: grid.fields,\n        filters: grid.filters,\n        actions: grid.actions,\n        primaryField: grid.primaryField,\n        secondaryFields: grid.secondaryFields,\n      };\n      const listSpec = {\n        ...spec,\n        view: listView,\n      } satisfies DataViewSpec;\n      return (\n        <DataViewList\n          spec={listSpec}\n          items={items}\n          className={className}\n          renderActions={renderActions}\n          onSelect={onSelect}\n          emptyState={emptyState}\n        />\n      );\n    }\n    default:\n      return <div className={className}>Unsupported data view kind</div>;\n  }\n}\n"],"mappings":";;;;;;;;;;AAyBA,SAAgB,iBAAiB,EAC/B,MACA,QAAQ,EAAE,EACV,OAAO,MACP,WACA,eACA,UACA,YACA,eACA,YACA,UACwB;AACxB,SAAQ,KAAK,KAAK,MAAlB;EACE,KAAK,OACH,QACE,oBAAC;GACO;GACC;GACI;GACI;GACL;GACE;IACZ;EAEN,KAAK,QACH,QACE,oBAAC;GACO;GACC;GACI;GACC;GACA;GACG;GACP;IACR;EAEN,KAAK,SACH,QACE,oBAAC;GACO;GACA;GACK;GACC;GACG;IACf;EAEN,KAAK,QAAQ;GACX,MAAM,OAAO,KAAK;GAClB,MAAMA,WAA+B;IACnC,MAAM;IACN,QAAQ;IACR,QAAQ,KAAK;IACb,SAAS,KAAK;IACd,SAAS,KAAK;IACd,cAAc,KAAK;IACnB,iBAAiB,KAAK;IACvB;AAKD,UACE,oBAAC;IACC,MANa;KACf,GAAG;KACH,MAAM;KACP;IAIU;IACI;IACI;IACL;IACE;KACZ;;EAGN,QACE,QAAO,oBAAC;GAAe;aAAW;IAAgC"}
+{"version":3,"file":"DataViewRenderer.js","names":["React","listView: DataViewListConfig"],"sources":["../../../src/components/data-view/DataViewRenderer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n  DataViewGridConfig,\n  DataViewListConfig,\n  DataViewSpec,\n} from '@lssm/lib.contracts/data-views';\nimport { DataViewList } from './DataViewList';\nimport { DataViewTable } from './DataViewTable';\nimport { DataViewDetail } from './DataViewDetail';\nimport { FiltersToolbar } from '../molecules/FiltersToolbar';\nimport {\n  Pagination,\n  PaginationContent,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n  PaginationEllipsis,\n} from '@lssm/lib.ui-kit-web/ui/pagination';\n\nexport interface DataViewRendererProps {\n  spec: DataViewSpec;\n  items?: Record<string, unknown>[];\n  item?: Record<string, unknown> | null;\n  className?: string;\n  renderActions?: (item: Record<string, unknown>) => React.ReactNode;\n  onSelect?: (item: Record<string, unknown>) => void;\n  onRowClick?: (item: Record<string, unknown>) => void;\n  headerActions?: React.ReactNode;\n  emptyState?: React.ReactNode;\n  footer?: React.ReactNode;\n\n  // Filters & Search\n  search?: string;\n  onSearchChange?: (value: string) => void;\n  filters?: Record<string, any>;\n  onFilterChange?: (filters: Record<string, any>) => void;\n\n  // Pagination\n  pagination?: {\n    page: number;\n    pageSize: number;\n    total: number;\n  };\n  onPageChange?: (page: number) => void;\n}\n\nexport function DataViewRenderer({\n  spec,\n  items = [],\n  item = null,\n  className,\n  renderActions,\n  onSelect,\n  onRowClick,\n  headerActions,\n  emptyState,\n  footer,\n  search,\n  onSearchChange,\n  filters,\n  onFilterChange,\n  pagination,\n  onPageChange,\n}: DataViewRendererProps) {\n  const viewContent = React.useMemo(() => {\n    switch (spec.view.kind) {\n      case 'list':\n        return (\n          <DataViewList\n            spec={spec}\n            items={items}\n            className={className}\n            renderActions={renderActions}\n            onSelect={onSelect}\n            emptyState={emptyState}\n          />\n        );\n      case 'table':\n        return (\n          <DataViewTable\n            spec={spec}\n            items={items}\n            className={className}\n            onRowClick={onRowClick}\n            emptyState={emptyState}\n            headerActions={headerActions}\n            footer={footer}\n          />\n        );\n      case 'detail':\n        return (\n          <DataViewDetail\n            spec={spec}\n            item={item}\n            className={className}\n            emptyState={emptyState}\n            headerActions={headerActions}\n          />\n        );\n      case 'grid': {\n        const grid = spec.view as DataViewGridConfig;\n        const listView: DataViewListConfig = {\n          kind: 'list',\n          layout: 'card',\n          fields: grid.fields,\n          filters: grid.filters,\n          actions: grid.actions,\n          primaryField: grid.primaryField,\n          secondaryFields: grid.secondaryFields,\n        };\n        const listSpec = {\n          ...spec,\n          view: listView,\n        } satisfies DataViewSpec;\n        return (\n          <DataViewList\n            spec={listSpec}\n            items={items}\n            className={className}\n            renderActions={renderActions}\n            onSelect={onSelect}\n            emptyState={emptyState}\n          />\n        );\n      }\n      default:\n        return <div className={className}>Unsupported data view kind</div>;\n    }\n  }, [\n    spec,\n    items,\n    item,\n    className,\n    renderActions,\n    onSelect,\n    onRowClick,\n    headerActions,\n    emptyState,\n    footer,\n  ]);\n\n  // Only render toolbar/pagination if it's a collection view\n  const isCollection =\n    spec.view.kind === 'list' ||\n    spec.view.kind === 'table' ||\n    spec.view.kind === 'grid';\n\n  if (!isCollection) {\n    return <>{viewContent}</>;\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      {(spec.view.filters?.length || onSearchChange) && (\n        <FiltersToolbar\n          searchValue={search}\n          onSearchChange={onSearchChange}\n          searchPlaceholder=\"Search...\"\n          activeChips={\n            filters\n              ? Object.entries(filters).map(([key, value]) => ({\n                  key,\n                  label: `${key}: ${value}`,\n                  onRemove: () => {\n                    const newFilters = { ...filters };\n                    delete newFilters[key];\n                    onFilterChange?.(newFilters);\n                  },\n                }))\n              : []\n          }\n          onClearAll={\n            filters && Object.keys(filters).length > 0\n              ? () => onFilterChange?.({})\n              : undefined\n          }\n          right={headerActions}\n        >\n          {/* Render filter dropdowns here if needed */}\n        </FiltersToolbar>\n      )}\n\n      {viewContent}\n\n      {pagination && pagination.total > 0 && (\n        <div className=\"py-4\">\n          <Pagination>\n            <PaginationContent>\n              <PaginationItem>\n                <PaginationPrevious\n                  href=\"#\"\n                  onClick={(e) => {\n                    e.preventDefault();\n                    if (pagination.page > 1) {\n                      onPageChange?.(pagination.page - 1);\n                    }\n                  }}\n                  aria-disabled={pagination.page <= 1}\n                  className={\n                    pagination.page <= 1 ? 'pointer-events-none opacity-50' : ''\n                  }\n                />\n              </PaginationItem>\n\n              {/* Simplified pagination: show current page */}\n              <PaginationItem>\n                <PaginationLink href=\"#\" isActive>\n                  {pagination.page}\n                </PaginationLink>\n              </PaginationItem>\n\n              <PaginationItem>\n                <PaginationNext\n                  href=\"#\"\n                  onClick={(e) => {\n                    e.preventDefault();\n                    const totalPages = Math.ceil(\n                      pagination.total / pagination.pageSize\n                    );\n                    if (pagination.page < totalPages) {\n                      onPageChange?.(pagination.page + 1);\n                    }\n                  }}\n                  aria-disabled={\n                    pagination.page >=\n                    Math.ceil(pagination.total / pagination.pageSize)\n                  }\n                  className={\n                    pagination.page >=\n                    Math.ceil(pagination.total / pagination.pageSize)\n                      ? 'pointer-events-none opacity-50'\n                      : ''\n                  }\n                />\n              </PaginationItem>\n            </PaginationContent>\n          </Pagination>\n          <div className=\"text-muted-foreground mt-2 text-center text-sm\">\n            Page {pagination.page} of{' '}\n            {Math.ceil(pagination.total / pagination.pageSize)} (\n            {pagination.total} items)\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAiDA,SAAgB,iBAAiB,EAC/B,MACA,QAAQ,EAAE,EACV,OAAO,MACP,WACA,eACA,UACA,YACA,eACA,YACA,QACA,QACA,gBACA,SACA,gBACA,YACA,gBACwB;CACxB,MAAM,cAAcA,QAAM,cAAc;AACtC,UAAQ,KAAK,KAAK,MAAlB;GACE,KAAK,OACH,QACE,oBAAC;IACO;IACC;IACI;IACI;IACL;IACE;KACZ;GAEN,KAAK,QACH,QACE,oBAAC;IACO;IACC;IACI;IACC;IACA;IACG;IACP;KACR;GAEN,KAAK,SACH,QACE,oBAAC;IACO;IACA;IACK;IACC;IACG;KACf;GAEN,KAAK,QAAQ;IACX,MAAM,OAAO,KAAK;IAClB,MAAMC,WAA+B;KACnC,MAAM;KACN,QAAQ;KACR,QAAQ,KAAK;KACb,SAAS,KAAK;KACd,SAAS,KAAK;KACd,cAAc,KAAK;KACnB,iBAAiB,KAAK;KACvB;AAKD,WACE,oBAAC;KACC,MANa;MACf,GAAG;MACH,MAAM;MACP;KAIU;KACI;KACI;KACL;KACE;MACZ;;GAGN,QACE,QAAO,oBAAC;IAAe;cAAW;KAAgC;;IAErE;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAQF,KAAI,EAJF,KAAK,KAAK,SAAS,UACnB,KAAK,KAAK,SAAS,WACnB,KAAK,KAAK,SAAS,QAGnB,QAAO,0CAAG,cAAe;AAG3B,QACE,qBAAC;EAAI,WAAU;;IACX,KAAK,KAAK,SAAS,UAAU,mBAC7B,oBAAC;IACC,aAAa;IACG;IAChB,mBAAkB;IAClB,aACE,UACI,OAAO,QAAQ,QAAQ,CAAC,KAAK,CAAC,KAAK,YAAY;KAC7C;KACA,OAAO,GAAG,IAAI,IAAI;KAClB,gBAAgB;MACd,MAAM,aAAa,EAAE,GAAG,SAAS;AACjC,aAAO,WAAW;AAClB,uBAAiB,WAAW;;KAE/B,EAAE,GACH,EAAE;IAER,YACE,WAAW,OAAO,KAAK,QAAQ,CAAC,SAAS,UAC/B,iBAAiB,EAAE,CAAC,GAC1B;IAEN,OAAO;KAGQ;GAGlB;GAEA,cAAc,WAAW,QAAQ,KAChC,qBAAC;IAAI,WAAU;eACb,oBAAC,wBACC,qBAAC;KACC,oBAAC,4BACC,oBAAC;MACC,MAAK;MACL,UAAU,MAAM;AACd,SAAE,gBAAgB;AAClB,WAAI,WAAW,OAAO,EACpB,gBAAe,WAAW,OAAO,EAAE;;MAGvC,iBAAe,WAAW,QAAQ;MAClC,WACE,WAAW,QAAQ,IAAI,mCAAmC;OAE5D,GACa;KAGjB,oBAAC,4BACC,oBAAC;MAAe,MAAK;MAAI;gBACtB,WAAW;OACG,GACF;KAEjB,oBAAC,4BACC,oBAAC;MACC,MAAK;MACL,UAAU,MAAM;AACd,SAAE,gBAAgB;OAClB,MAAM,aAAa,KAAK,KACtB,WAAW,QAAQ,WAAW,SAC/B;AACD,WAAI,WAAW,OAAO,WACpB,gBAAe,WAAW,OAAO,EAAE;;MAGvC,iBACE,WAAW,QACX,KAAK,KAAK,WAAW,QAAQ,WAAW,SAAS;MAEnD,WACE,WAAW,QACX,KAAK,KAAK,WAAW,QAAQ,WAAW,SAAS,GAC7C,mCACA;OAEN,GACa;QACC,GACT,EACb,qBAAC;KAAI,WAAU;;MAAiD;MACxD,WAAW;MAAK;MAAI;MACzB,KAAK,KAAK,WAAW,QAAQ,WAAW,SAAS;MAAC;MAClD,WAAW;MAAM;;MACd;KACF;;GAEJ"}

package/dist/components/data-view/DataViewTable.d.ts

@@ -1,5 +1,6 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime116 from "react/jsx-runtime";
+import * as react_jsx_runtime39 from "react/jsx-runtime";
+import { DataViewSpec } from "@lssm/lib.contracts/data-views";
 
 //#region src/components/data-view/DataViewTable.d.ts
 interface DataViewTableProps {
@@ -19,7 +20,7 @@ declare function DataViewTable({
   emptyState,
   headerActions,
   footer
-}: DataViewTableProps): react_jsx_runtime116.JSX.Element;
+}: DataViewTableProps): react_jsx_runtime39.JSX.Element;
 //#endregion
 export { DataViewTable, DataViewTableProps };
 //# sourceMappingURL=DataViewTable.d.ts.map

package/dist/components/data-view/DataViewTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataViewTable.d.ts","names":[],"sources":["../../../src/components/data-view/DataViewTable.tsx"],"sourcesContent":[],"mappings":";;;;UAWiB,kBAAA;QACT;EADS,KAAA,EAER,MAFQ,CAAA,MAAA,EAAkB,OAAA,CAAA,EAAA;EAC3B,SAAA,CAAA,EAAA,MAAA;EACC,UAAA,CAAA,EAAA,CAAA,IAAA,EAEa,MAFb,CAAA,MAAA,EAAA,OAAA,CAAA,EAAA,GAAA,IAAA;EAEa,UAAA,CAAA,EACP,OAAA,CAAM,SADC;EACP,aAAM,CAAA,EACH,OAAA,CAAM,SADH;EACH,MAAM,CAAA,EACb,OAAA,CAAM,SADO;;AACE,iBAGV,aAAA,CAHU;EAAA,IAAA;EAAA,KAAA;EAAA,SAAA;EAAA,UAAA;EAAA,UAAA;EAAA,aAAA;EAAA;AAAA,CAAA,EAWvB,kBAXuB,CAAA,EAWL,oBAAA,CAAA,GAAA,CAAA,OAXK"}
+{"version":3,"file":"DataViewTable.d.ts","names":[],"sources":["../../../src/components/data-view/DataViewTable.tsx"],"sourcesContent":[],"mappings":";;;;;UAWiB,kBAAA;QACT;SACC;EAFQ,SAAA,CAAA,EAAA,MAAA;EACT,UAAA,CAAA,EAAA,CAAA,IAAA,EAGc,MAHd,CAAA,MAAA,EAAA,OAAA,CAAA,EAAA,GAAA,IAAA;EACC,UAAA,CAAA,EAGM,OAAA,CAAM,SAHZ;EAEa,aAAA,CAAA,EAEJ,OAAA,CAAM,SAFF;EACP,MAAM,CAAA,EAEV,OAAA,CAAM,SAFI;;AAEV,iBAGK,aAAA,CAHC;EAAA,IAAA;EAAA,KAAA;EAAA,SAAA;EAAA,UAAA;EAAA,UAAA;EAAA,aAAA;EAAA;AAAA,CAAA,EAWd,kBAXc,CAAA,EAWI,mBAAA,CAAA,GAAA,CAAA,OAXJ"}

package/dist/components/data-view/DataViewTable.js

@@ -1,6 +1,5 @@
 'use client';
 
-
 import { cn } from "../../lib/utils.js";
 import { formatValue, getAtPath } from "./utils.js";
 import "react";
@@ -24,11 +23,11 @@ function DataViewTable({ spec, items, className, onRowClick, emptyState, headerA
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex items-center justify-between",
 			children: [/* @__PURE__ */ jsx("h3", {
-				className: "text-base font-semibold text-foreground",
+				className: "text-foreground text-base font-semibold",
 				children: spec.meta.title
 			}), headerActions]
 		}), emptyState ?? /* @__PURE__ */ jsx("div", {
-			className: "rounded-md border border-dashed border-muted-foreground/40 p-8 text-center text-sm text-muted-foreground",
+			className: "border-muted-foreground/40 text-muted-foreground rounded-md border border-dashed p-8 text-center text-sm",
 			children: "No records available."
 		})]
 	});
@@ -38,28 +37,28 @@ function DataViewTable({ spec, items, className, onRowClick, emptyState, headerA
 			/* @__PURE__ */ jsxs("div", {
 				className: "flex items-center justify-between",
 				children: [/* @__PURE__ */ jsx("h3", {
-					className: "text-base font-semibold text-foreground",
+					className: "text-foreground text-base font-semibold",
 					children: spec.meta.title
 				}), headerActions]
 			}),
 			/* @__PURE__ */ jsx("div", {
-				className: "overflow-x-auto rounded-lg border border-border bg-card shadow-sm",
+				className: "border-border bg-card overflow-x-auto rounded-lg border shadow-sm",
 				children: /* @__PURE__ */ jsxs("table", {
-					className: cn("min-w-full divide-y divide-border text-sm", view.density === "compact" ? "text-sm" : "text-base"),
+					className: cn("divide-border min-w-full divide-y text-sm", view.density === "compact" ? "text-sm" : "text-base"),
 					children: [/* @__PURE__ */ jsx("thead", {
 						className: "bg-muted/50",
 						children: /* @__PURE__ */ jsx("tr", { children: columns.map((column, columnIdx) => /* @__PURE__ */ jsx("th", {
 							scope: "col",
-							className: cn("px-4 py-3 text-left font-semibold text-muted-foreground", alignmentClass(column.align)),
+							className: cn("text-muted-foreground px-4 py-3 text-left font-semibold", alignmentClass(column.align)),
 							children: column.label
 						}, `${column.field}.${columnIdx}`)) })
 					}), /* @__PURE__ */ jsx("tbody", {
-						className: "divide-y divide-border bg-background",
+						className: "divide-border bg-background divide-y",
 						children: items.map((item, rowIdx) => /* @__PURE__ */ jsx("tr", {
-							className: cn(onRowClick && "cursor-pointer hover:bg-muted/30 transition-colors"),
+							className: cn(onRowClick && "hover:bg-muted/30 cursor-pointer transition-colors"),
 							onClick: () => onRowClick?.(item),
 							children: columns.map((column) => /* @__PURE__ */ jsx("td", {
-								className: cn("px-4 py-3 text-foreground", alignmentClass(column.align)),
+								className: cn("text-foreground px-4 py-3", alignmentClass(column.align)),
 								children: displayValue(item, fields, column.field)
 							}, column.field))
 						}, rowIdx))

package/dist/components/data-view/DataViewTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataViewTable.js","names":[],"sources":["../../../src/components/data-view/DataViewTable.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n  DataViewSpec,\n  DataViewTableConfig,\n  DataViewField,\n} from '@lssm/lib.contracts/data-views';\nimport { cn } from '../../lib/utils';\nimport { getAtPath, formatValue } from './utils';\n\nexport interface DataViewTableProps {\n  spec: DataViewSpec;\n  items: Record<string, unknown>[];\n  className?: string;\n  onRowClick?: (item: Record<string, unknown>) => void;\n  emptyState?: React.ReactNode;\n  headerActions?: React.ReactNode;\n  footer?: React.ReactNode;\n}\n\nexport function DataViewTable({\n  spec,\n  items,\n  className,\n  onRowClick,\n  emptyState,\n  headerActions,\n  footer,\n}: DataViewTableProps) {\n  if (spec.view.kind !== 'table') {\n    throw new Error(\n      `DataViewTable received view kind \"${spec.view.kind}\", expected \"table\".`\n    );\n  }\n\n  const view = spec.view as DataViewTableConfig;\n  const fields = view.fields;\n  const columns =\n    view.columns?.map((column) => ({\n      ...column,\n      label: column.label ?? fieldLabel(fields, column.field),\n    })) ??\n    fields.map((field) => ({\n      field: field.key,\n      label: field.label,\n      align: 'left' as const,\n    }));\n\n  if (!items.length) {\n    return (\n      <div className={cn('flex w-full flex-col gap-4', className)}>\n        <div className=\"flex items-center justify-between\">\n          <h3 className=\"text-base font-semibold text-foreground\">\n            {spec.meta.title}\n          </h3>\n          {headerActions}\n        </div>\n        {emptyState ?? (\n          <div className=\"rounded-md border border-dashed border-muted-foreground/40 p-8 text-center text-sm text-muted-foreground\">\n            No records available.\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn('flex w-full flex-col gap-4', className)}>\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-base font-semibold text-foreground\">\n          {spec.meta.title}\n        </h3>\n        {headerActions}\n      </div>\n      <div className=\"overflow-x-auto rounded-lg border border-border bg-card shadow-sm\">\n        <table\n          className={cn(\n            'min-w-full divide-y divide-border text-sm',\n            view.density === 'compact' ? 'text-sm' : 'text-base'\n          )}\n        >\n          <thead className=\"bg-muted/50\">\n            <tr>\n              {columns.map((column, columnIdx) => (\n                <th\n                  key={`${column.field}.${columnIdx}`}\n                  scope=\"col\"\n                  className={cn(\n                    'px-4 py-3 text-left font-semibold text-muted-foreground',\n                    alignmentClass(column.align)\n                  )}\n                >\n                  {column.label}\n                </th>\n              ))}\n            </tr>\n          </thead>\n          <tbody className=\"divide-y divide-border bg-background\">\n            {items.map((item, rowIdx) => (\n              <tr\n                key={rowIdx}\n                className={cn(\n                  onRowClick &&\n                    'cursor-pointer hover:bg-muted/30 transition-colors'\n                )}\n                onClick={() => onRowClick?.(item)}\n              >\n                {columns.map((column) => (\n                  <td\n                    key={column.field}\n                    className={cn(\n                      'px-4 py-3 text-foreground',\n                      alignmentClass(column.align)\n                    )}\n                  >\n                    {displayValue(item, fields, column.field)}\n                  </td>\n                ))}\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      </div>\n      {footer}\n    </div>\n  );\n}\n\nfunction fieldLabel(fields: DataViewField[], key: string) {\n  return fields.find((field) => field.key === key)?.label ?? key;\n}\n\nfunction fieldByKey(fields: DataViewField[], key: string) {\n  return fields.find((field) => field.key === key);\n}\n\nfunction displayValue(\n  item: Record<string, unknown>,\n  fields: DataViewField[],\n  key: string\n) {\n  const field = fieldByKey(fields, key);\n  if (!field) return '';\n  const value = getAtPath(item, field.dataPath);\n  return formatValue(value, field.format);\n}\n\nfunction alignmentClass(\n  align: 'left' | 'center' | 'right' | undefined\n): string | undefined {\n  switch (align) {\n    case 'center':\n      return 'text-center';\n    case 'right':\n      return 'text-right';\n    default:\n      return 'text-left';\n  }\n}\n\n"],"mappings":";;;;;;;;;AAqBA,SAAgB,cAAc,EAC5B,MACA,OACA,WACA,YACA,YACA,eACA,UACqB;AACrB,KAAI,KAAK,KAAK,SAAS,QACrB,OAAM,IAAI,MACR,qCAAqC,KAAK,KAAK,KAAK,sBACrD;CAGH,MAAM,OAAO,KAAK;CAClB,MAAM,SAAS,KAAK;CACpB,MAAM,UACJ,KAAK,SAAS,KAAK,YAAY;EAC7B,GAAG;EACH,OAAO,OAAO,SAAS,WAAW,QAAQ,OAAO,MAAM;EACxD,EAAE,IACH,OAAO,KAAK,WAAW;EACrB,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO;EACR,EAAE;AAEL,KAAI,CAAC,MAAM,OACT,QACE,qBAAC;EAAI,WAAW,GAAG,8BAA8B,UAAU;aACzD,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAG,WAAU;cACX,KAAK,KAAK;KACR,EACJ;IACG,EACL,cACC,oBAAC;GAAI,WAAU;aAA2G;IAEpH;GAEJ;AAIV,QACE,qBAAC;EAAI,WAAW,GAAG,8BAA8B,UAAU;;GACzD,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eACX,KAAK,KAAK;MACR,EACJ;KACG;GACN,oBAAC;IAAI,WAAU;cACb,qBAAC;KACC,WAAW,GACT,6CACA,KAAK,YAAY,YAAY,YAAY,YAC1C;gBAED,oBAAC;MAAM,WAAU;gBACf,oBAAC,kBACE,QAAQ,KAAK,QAAQ,cACpB,oBAAC;OAEC,OAAM;OACN,WAAW,GACT,2DACA,eAAe,OAAO,MAAM,CAC7B;iBAEA,OAAO;SAPH,GAAG,OAAO,MAAM,GAAG,YAQrB,CACL,GACC;OACC,EACR,oBAAC;MAAM,WAAU;gBACd,MAAM,KAAK,MAAM,WAChB,oBAAC;OAEC,WAAW,GACT,cACE,qDACH;OACD,eAAe,aAAa,KAAK;iBAEhC,QAAQ,KAAK,WACZ,oBAAC;QAEC,WAAW,GACT,6BACA,eAAe,OAAO,MAAM,CAC7B;kBAEA,aAAa,MAAM,QAAQ,OAAO,MAAM;UANpC,OAAO,MAOT,CACL;SAjBG,OAkBF,CACL;OACI;MACF;KACJ;GACL;;GACG;;AAIV,SAAS,WAAW,QAAyB,KAAa;AACxD,QAAO,OAAO,MAAM,UAAU,MAAM,QAAQ,IAAI,EAAE,SAAS;;AAG7D,SAAS,WAAW,QAAyB,KAAa;AACxD,QAAO,OAAO,MAAM,UAAU,MAAM,QAAQ,IAAI;;AAGlD,SAAS,aACP,MACA,QACA,KACA;CACA,MAAM,QAAQ,WAAW,QAAQ,IAAI;AACrC,KAAI,CAAC,MAAO,QAAO;AAEnB,QAAO,YADO,UAAU,MAAM,MAAM,SAAS,EACnB,MAAM,OAAO;;AAGzC,SAAS,eACP,OACoB;AACpB,SAAQ,OAAR;EACE,KAAK,SACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO"}
+{"version":3,"file":"DataViewTable.js","names":[],"sources":["../../../src/components/data-view/DataViewTable.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n  DataViewSpec,\n  DataViewTableConfig,\n  DataViewField,\n} from '@lssm/lib.contracts/data-views';\nimport { cn } from '../../lib/utils';\nimport { getAtPath, formatValue } from './utils';\n\nexport interface DataViewTableProps {\n  spec: DataViewSpec;\n  items: Record<string, unknown>[];\n  className?: string;\n  onRowClick?: (item: Record<string, unknown>) => void;\n  emptyState?: React.ReactNode;\n  headerActions?: React.ReactNode;\n  footer?: React.ReactNode;\n}\n\nexport function DataViewTable({\n  spec,\n  items,\n  className,\n  onRowClick,\n  emptyState,\n  headerActions,\n  footer,\n}: DataViewTableProps) {\n  if (spec.view.kind !== 'table') {\n    throw new Error(\n      `DataViewTable received view kind \"${spec.view.kind}\", expected \"table\".`\n    );\n  }\n\n  const view = spec.view as DataViewTableConfig;\n  const fields = view.fields;\n  const columns =\n    view.columns?.map((column) => ({\n      ...column,\n      label: column.label ?? fieldLabel(fields, column.field),\n    })) ??\n    fields.map((field) => ({\n      field: field.key,\n      label: field.label,\n      align: 'left' as const,\n    }));\n\n  if (!items.length) {\n    return (\n      <div className={cn('flex w-full flex-col gap-4', className)}>\n        <div className=\"flex items-center justify-between\">\n          <h3 className=\"text-foreground text-base font-semibold\">\n            {spec.meta.title}\n          </h3>\n          {headerActions}\n        </div>\n        {emptyState ?? (\n          <div className=\"border-muted-foreground/40 text-muted-foreground rounded-md border border-dashed p-8 text-center text-sm\">\n            No records available.\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn('flex w-full flex-col gap-4', className)}>\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-foreground text-base font-semibold\">\n          {spec.meta.title}\n        </h3>\n        {headerActions}\n      </div>\n      <div className=\"border-border bg-card overflow-x-auto rounded-lg border shadow-sm\">\n        <table\n          className={cn(\n            'divide-border min-w-full divide-y text-sm',\n            view.density === 'compact' ? 'text-sm' : 'text-base'\n          )}\n        >\n          <thead className=\"bg-muted/50\">\n            <tr>\n              {columns.map((column, columnIdx) => (\n                <th\n                  key={`${column.field}.${columnIdx}`}\n                  scope=\"col\"\n                  className={cn(\n                    'text-muted-foreground px-4 py-3 text-left font-semibold',\n                    alignmentClass(column.align)\n                  )}\n                >\n                  {column.label}\n                </th>\n              ))}\n            </tr>\n          </thead>\n          <tbody className=\"divide-border bg-background divide-y\">\n            {items.map((item, rowIdx) => (\n              <tr\n                key={rowIdx}\n                className={cn(\n                  onRowClick &&\n                    'hover:bg-muted/30 cursor-pointer transition-colors'\n                )}\n                onClick={() => onRowClick?.(item)}\n              >\n                {columns.map((column) => (\n                  <td\n                    key={column.field}\n                    className={cn(\n                      'text-foreground px-4 py-3',\n                      alignmentClass(column.align)\n                    )}\n                  >\n                    {displayValue(item, fields, column.field)}\n                  </td>\n                ))}\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      </div>\n      {footer}\n    </div>\n  );\n}\n\nfunction fieldLabel(fields: DataViewField[], key: string) {\n  return fields.find((field) => field.key === key)?.label ?? key;\n}\n\nfunction fieldByKey(fields: DataViewField[], key: string) {\n  return fields.find((field) => field.key === key);\n}\n\nfunction displayValue(\n  item: Record<string, unknown>,\n  fields: DataViewField[],\n  key: string\n) {\n  const field = fieldByKey(fields, key);\n  if (!field) return '';\n  const value = getAtPath(item, field.dataPath);\n  return formatValue(value, field.format);\n}\n\nfunction alignmentClass(\n  align: 'left' | 'center' | 'right' | undefined\n): string | undefined {\n  switch (align) {\n    case 'center':\n      return 'text-center';\n    case 'right':\n      return 'text-right';\n    default:\n      return 'text-left';\n  }\n}\n"],"mappings":";;;;;;;;AAqBA,SAAgB,cAAc,EAC5B,MACA,OACA,WACA,YACA,YACA,eACA,UACqB;AACrB,KAAI,KAAK,KAAK,SAAS,QACrB,OAAM,IAAI,MACR,qCAAqC,KAAK,KAAK,KAAK,sBACrD;CAGH,MAAM,OAAO,KAAK;CAClB,MAAM,SAAS,KAAK;CACpB,MAAM,UACJ,KAAK,SAAS,KAAK,YAAY;EAC7B,GAAG;EACH,OAAO,OAAO,SAAS,WAAW,QAAQ,OAAO,MAAM;EACxD,EAAE,IACH,OAAO,KAAK,WAAW;EACrB,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO;EACR,EAAE;AAEL,KAAI,CAAC,MAAM,OACT,QACE,qBAAC;EAAI,WAAW,GAAG,8BAA8B,UAAU;aACzD,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAG,WAAU;cACX,KAAK,KAAK;KACR,EACJ;IACG,EACL,cACC,oBAAC;GAAI,WAAU;aAA2G;IAEpH;GAEJ;AAIV,QACE,qBAAC;EAAI,WAAW,GAAG,8BAA8B,UAAU;;GACzD,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eACX,KAAK,KAAK;MACR,EACJ;KACG;GACN,oBAAC;IAAI,WAAU;cACb,qBAAC;KACC,WAAW,GACT,6CACA,KAAK,YAAY,YAAY,YAAY,YAC1C;gBAED,oBAAC;MAAM,WAAU;gBACf,oBAAC,kBACE,QAAQ,KAAK,QAAQ,cACpB,oBAAC;OAEC,OAAM;OACN,WAAW,GACT,2DACA,eAAe,OAAO,MAAM,CAC7B;iBAEA,OAAO;SAPH,GAAG,OAAO,MAAM,GAAG,YAQrB,CACL,GACC;OACC,EACR,oBAAC;MAAM,WAAU;gBACd,MAAM,KAAK,MAAM,WAChB,oBAAC;OAEC,WAAW,GACT,cACE,qDACH;OACD,eAAe,aAAa,KAAK;iBAEhC,QAAQ,KAAK,WACZ,oBAAC;QAEC,WAAW,GACT,6BACA,eAAe,OAAO,MAAM,CAC7B;kBAEA,aAAa,MAAM,QAAQ,OAAO,MAAM;UANpC,OAAO,MAOT,CACL;SAjBG,OAkBF,CACL;OACI;MACF;KACJ;GACL;;GACG;;AAIV,SAAS,WAAW,QAAyB,KAAa;AACxD,QAAO,OAAO,MAAM,UAAU,MAAM,QAAQ,IAAI,EAAE,SAAS;;AAG7D,SAAS,WAAW,QAAyB,KAAa;AACxD,QAAO,OAAO,MAAM,UAAU,MAAM,QAAQ,IAAI;;AAGlD,SAAS,aACP,MACA,QACA,KACA;CACA,MAAM,QAAQ,WAAW,QAAQ,IAAI;AACrC,KAAI,CAAC,MAAO,QAAO;AAEnB,QAAO,YADO,UAAU,MAAM,MAAM,SAAS,EACnB,MAAM,OAAO;;AAGzC,SAAS,eACP,OACoB;AACpB,SAAQ,OAAR;EACE,KAAK,SACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO"}

package/dist/components/data-view/utils.js

@@ -1,6 +1,5 @@
 'use client';
 
-
 //#region src/components/data-view/utils.ts
 function getAtPath(source, path) {
 	if (!source) return void 0;

package/dist/components/data-view/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":["current: unknown"],"sources":["../../../src/components/data-view/utils.ts"],"sourcesContent":["'use client';\n\nexport function getAtPath(\n  source: Record<string, unknown> | undefined,\n  path: string\n): unknown {\n  if (!source) return undefined;\n  if (!path) return source;\n  const segments = path\n    .replace(/\\[(\\d+)\\]/g, '.$1')\n    .split('.')\n    .filter(Boolean);\n\n  let current: unknown = source;\n  for (const segment of segments) {\n    if (\n      current == null ||\n      (typeof current !== 'object' && !Array.isArray(current))\n    )\n      return undefined;\n    current = (current as Record<string, unknown>)[segment];\n  }\n  return current;\n}\n\nexport function formatValue(value: unknown, format?: string): string {\n  if (value == null) return '';\n  switch (format) {\n    case 'boolean':\n      return value ? 'Yes' : 'No';\n    case 'currency':\n      return typeof value === 'number'\n        ? new Intl.NumberFormat(undefined, {\n            style: 'currency',\n            currency: 'USD',\n          }).format(value)\n        : String(value);\n    case 'percentage':\n      return typeof value === 'number'\n        ? `${(value * 100).toFixed(1)}%`\n        : String(value);\n    case 'date':\n      return formatDate(value, {\n        dateStyle: 'medium',\n      });\n    case 'dateTime':\n      return formatDate(value, {\n        dateStyle: 'medium',\n        timeStyle: 'short',\n      });\n    default:\n      return String(value);\n  }\n}\n\nfunction formatDate(\n  value: unknown,\n  options: Intl.DateTimeFormatOptions\n): string {\n  if (value instanceof Date) {\n    return new Intl.DateTimeFormat(undefined, options).format(value);\n  }\n  if (typeof value === 'string' || typeof value === 'number') {\n    const date = new Date(value);\n    if (!Number.isNaN(date.getTime())) {\n      return new Intl.DateTimeFormat(undefined, options).format(date);\n    }\n  }\n  return String(value ?? '');\n}\n\n"],"mappings":";;;;AAEA,SAAgB,UACd,QACA,MACS;AACT,KAAI,CAAC,OAAQ,QAAO;AACpB,KAAI,CAAC,KAAM,QAAO;CAClB,MAAM,WAAW,KACd,QAAQ,cAAc,MAAM,CAC5B,MAAM,IAAI,CACV,OAAO,QAAQ;CAElB,IAAIA,UAAmB;AACvB,MAAK,MAAM,WAAW,UAAU;AAC9B,MACE,WAAW,QACV,OAAO,YAAY,YAAY,CAAC,MAAM,QAAQ,QAAQ,CAEvD,QAAO;AACT,YAAW,QAAoC;;AAEjD,QAAO;;AAGT,SAAgB,YAAY,OAAgB,QAAyB;AACnE,KAAI,SAAS,KAAM,QAAO;AAC1B,SAAQ,QAAR;EACE,KAAK,UACH,QAAO,QAAQ,QAAQ;EACzB,KAAK,WACH,QAAO,OAAO,UAAU,WACpB,IAAI,KAAK,aAAa,QAAW;GAC/B,OAAO;GACP,UAAU;GACX,CAAC,CAAC,OAAO,MAAM,GAChB,OAAO,MAAM;EACnB,KAAK,aACH,QAAO,OAAO,UAAU,WACpB,IAAI,QAAQ,KAAK,QAAQ,EAAE,CAAC,KAC5B,OAAO,MAAM;EACnB,KAAK,OACH,QAAO,WAAW,OAAO,EACvB,WAAW,UACZ,CAAC;EACJ,KAAK,WACH,QAAO,WAAW,OAAO;GACvB,WAAW;GACX,WAAW;GACZ,CAAC;EACJ,QACE,QAAO,OAAO,MAAM;;;AAI1B,SAAS,WACP,OACA,SACQ;AACR,KAAI,iBAAiB,KACnB,QAAO,IAAI,KAAK,eAAe,QAAW,QAAQ,CAAC,OAAO,MAAM;AAElE,KAAI,OAAO,UAAU,YAAY,OAAO,UAAU,UAAU;EAC1D,MAAM,OAAO,IAAI,KAAK,MAAM;AAC5B,MAAI,CAAC,OAAO,MAAM,KAAK,SAAS,CAAC,CAC/B,QAAO,IAAI,KAAK,eAAe,QAAW,QAAQ,CAAC,OAAO,KAAK;;AAGnE,QAAO,OAAO,SAAS,GAAG"}
+{"version":3,"file":"utils.js","names":["current: unknown"],"sources":["../../../src/components/data-view/utils.ts"],"sourcesContent":["'use client';\n\nexport function getAtPath(\n  source: Record<string, unknown> | undefined,\n  path: string\n): unknown {\n  if (!source) return undefined;\n  if (!path) return source;\n  const segments = path\n    .replace(/\\[(\\d+)\\]/g, '.$1')\n    .split('.')\n    .filter(Boolean);\n\n  let current: unknown = source;\n  for (const segment of segments) {\n    if (\n      current == null ||\n      (typeof current !== 'object' && !Array.isArray(current))\n    )\n      return undefined;\n    current = (current as Record<string, unknown>)[segment];\n  }\n  return current;\n}\n\nexport function formatValue(value: unknown, format?: string): string {\n  if (value == null) return '';\n  switch (format) {\n    case 'boolean':\n      return value ? 'Yes' : 'No';\n    case 'currency':\n      return typeof value === 'number'\n        ? new Intl.NumberFormat(undefined, {\n            style: 'currency',\n            currency: 'USD',\n          }).format(value)\n        : String(value);\n    case 'percentage':\n      return typeof value === 'number'\n        ? `${(value * 100).toFixed(1)}%`\n        : String(value);\n    case 'date':\n      return formatDate(value, {\n        dateStyle: 'medium',\n      });\n    case 'dateTime':\n      return formatDate(value, {\n        dateStyle: 'medium',\n        timeStyle: 'short',\n      });\n    default:\n      return String(value);\n  }\n}\n\nfunction formatDate(\n  value: unknown,\n  options: Intl.DateTimeFormatOptions\n): string {\n  if (value instanceof Date) {\n    return new Intl.DateTimeFormat(undefined, options).format(value);\n  }\n  if (typeof value === 'string' || typeof value === 'number') {\n    const date = new Date(value);\n    if (!Number.isNaN(date.getTime())) {\n      return new Intl.DateTimeFormat(undefined, options).format(date);\n    }\n  }\n  return String(value ?? '');\n}\n"],"mappings":";;;AAEA,SAAgB,UACd,QACA,MACS;AACT,KAAI,CAAC,OAAQ,QAAO;AACpB,KAAI,CAAC,KAAM,QAAO;CAClB,MAAM,WAAW,KACd,QAAQ,cAAc,MAAM,CAC5B,MAAM,IAAI,CACV,OAAO,QAAQ;CAElB,IAAIA,UAAmB;AACvB,MAAK,MAAM,WAAW,UAAU;AAC9B,MACE,WAAW,QACV,OAAO,YAAY,YAAY,CAAC,MAAM,QAAQ,QAAQ,CAEvD,QAAO;AACT,YAAW,QAAoC;;AAEjD,QAAO;;AAGT,SAAgB,YAAY,OAAgB,QAAyB;AACnE,KAAI,SAAS,KAAM,QAAO;AAC1B,SAAQ,QAAR;EACE,KAAK,UACH,QAAO,QAAQ,QAAQ;EACzB,KAAK,WACH,QAAO,OAAO,UAAU,WACpB,IAAI,KAAK,aAAa,QAAW;GAC/B,OAAO;GACP,UAAU;GACX,CAAC,CAAC,OAAO,MAAM,GAChB,OAAO,MAAM;EACnB,KAAK,aACH,QAAO,OAAO,UAAU,WACpB,IAAI,QAAQ,KAAK,QAAQ,EAAE,CAAC,KAC5B,OAAO,MAAM;EACnB,KAAK,OACH,QAAO,WAAW,OAAO,EACvB,WAAW,UACZ,CAAC;EACJ,KAAK,WACH,QAAO,WAAW,OAAO;GACvB,WAAW;GACX,WAAW;GACZ,CAAC;EACJ,QACE,QAAO,OAAO,MAAM;;;AAI1B,SAAS,WACP,OACA,SACQ;AACR,KAAI,iBAAiB,KACnB,QAAO,IAAI,KAAK,eAAe,QAAW,QAAQ,CAAC,OAAO,MAAM;AAElE,KAAI,OAAO,UAAU,YAAY,OAAO,UAAU,UAAU;EAC1D,MAAM,OAAO,IAAI,KAAK,MAAM;AAC5B,MAAI,CAAC,OAAO,MAAM,KAAK,SAAS,CAAC,CAC/B,QAAO,IAAI,KAAK,eAAe,QAAW,QAAQ,CAAC,OAAO,KAAK;;AAGnE,QAAO,OAAO,SAAS,GAAG"}

package/dist/components/forms/FormCardLayout.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime108 from "react/jsx-runtime";
+import * as react_jsx_runtime52 from "react/jsx-runtime";
 
 //#region src/components/forms/FormCardLayout.d.ts
 interface FormCardLayoutProps {
@@ -17,7 +17,7 @@ declare function FormCardLayout({
   children,
   className,
   contentClassName
-}: FormCardLayoutProps): react_jsx_runtime108.JSX.Element;
+}: FormCardLayoutProps): react_jsx_runtime52.JSX.Element;
 //#endregion
 export { FormCardLayout, FormCardLayoutProps };
 //# sourceMappingURL=FormCardLayout.d.ts.map

package/dist/components/forms/FormCardLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormCardLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormCardLayout.tsx"],"sourcesContent":[],"mappings":";;;;UASiB,mBAAA;UACP,OAAA,CAAM;gBACA,OAAA,CAAM;EAFL,OAAA,CAAA,EAGL,OAAA,CAAM,SAHkB;EAC1B,QAAM,EAGJ,OAAA,CAAM,SAHF;EACA,SAAM,CAAA,EAAA,MAAA;EACV,gBAAM,CAAA,EAAA,MAAA;;AACS,iBAKX,cAAA,CALW;EAAA,KAAA;EAAA,WAAA;EAAA,OAAA;EAAA,QAAA;EAAA,SAAA;EAAA;AAAA,CAAA,EAYxB,mBAZwB,CAAA,EAYL,oBAAA,CAAA,GAAA,CAAA,OAZK"}
+{"version":3,"file":"FormCardLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormCardLayout.tsx"],"sourcesContent":[],"mappings":";;;;UASiB,mBAAA;UACP,OAAA,CAAM;gBACA,OAAA,CAAM;EAFL,OAAA,CAAA,EAGL,OAAA,CAAM,SAHkB;EAC1B,QAAM,EAGJ,OAAA,CAAM,SAHF;EACA,SAAM,CAAA,EAAA,MAAA;EACV,gBAAM,CAAA,EAAA,MAAA;;AACS,iBAKX,cAAA,CALW;EAAA,KAAA;EAAA,WAAA;EAAA,OAAA;EAAA,QAAA;EAAA,SAAA;EAAA;AAAA,CAAA,EAYxB,mBAZwB,CAAA,EAYL,mBAAA,CAAA,GAAA,CAAA,OAZK"}

package/dist/components/forms/FormCardLayout.js

@@ -1,10 +1,9 @@
-import { cn, init_utils } from "../../ui-kit-web/dist/ui/utils.js";
-import { Card, CardContent, CardHeader, CardTitle } from "../../ui-kit-web/dist/ui/card.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@lssm/lib.ui-kit-web/ui/utils";
+import { Card, CardContent, CardHeader, CardTitle } from "@lssm/lib.ui-kit-web/ui/card";
 
 //#region src/components/forms/FormCardLayout.tsx
-init_utils();
 function FormCardLayout({ title, description, actions, children, className, contentClassName }) {
 	return /* @__PURE__ */ jsxs(Card, {
 		className: cn("border-none shadow-2xs", className),

package/dist/components/forms/FormCardLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormCardLayout.js","names":[],"sources":["../../../src/components/forms/FormCardLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from '@lssm/lib.ui-kit-web/ui/card';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport interface FormCardLayoutProps {\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  actions?: React.ReactNode;\n  children: React.ReactNode;\n  className?: string;\n  contentClassName?: string;\n}\n\nexport function FormCardLayout({\n  title,\n  description,\n  actions,\n  children,\n  className,\n  contentClassName,\n}: FormCardLayoutProps) {\n  return (\n    <Card className={cn('border-none shadow-2xs', className)}>\n      {(title || description) && (\n        <CardHeader>\n          {title && <CardTitle>{title}</CardTitle>}\n          {description && (\n            <div className=\"text-muted-foreground text-base\">{description}</div>\n          )}\n        </CardHeader>\n      )}\n      <CardContent className={cn('p-4 md:p-5', contentClassName)}>\n        <div className=\"space-y-4\">{children}</div>\n        {actions && (\n          <div className=\"mt-4 flex justify-end gap-2\">{actions}</div>\n        )}\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;YAOmD;AAWnD,SAAgB,eAAe,EAC7B,OACA,aACA,SACA,UACA,WACA,oBACsB;AACtB,QACE,qBAAC;EAAK,WAAW,GAAG,0BAA0B,UAAU;cACpD,SAAS,gBACT,qBAAC,yBACE,SAAS,oBAAC,uBAAW,QAAkB,EACvC,eACC,oBAAC;GAAI,WAAU;aAAmC;IAAkB,IAE3D,EAEf,qBAAC;GAAY,WAAW,GAAG,cAAc,iBAAiB;cACxD,oBAAC;IAAI,WAAU;IAAa;KAAe,EAC1C,WACC,oBAAC;IAAI,WAAU;cAA+B;KAAc;IAElD;GACT"}
+{"version":3,"file":"FormCardLayout.js","names":[],"sources":["../../../src/components/forms/FormCardLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from '@lssm/lib.ui-kit-web/ui/card';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport interface FormCardLayoutProps {\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  actions?: React.ReactNode;\n  children: React.ReactNode;\n  className?: string;\n  contentClassName?: string;\n}\n\nexport function FormCardLayout({\n  title,\n  description,\n  actions,\n  children,\n  className,\n  contentClassName,\n}: FormCardLayoutProps) {\n  return (\n    <Card className={cn('border-none shadow-2xs', className)}>\n      {(title || description) && (\n        <CardHeader>\n          {title && <CardTitle>{title}</CardTitle>}\n          {description && (\n            <div className=\"text-muted-foreground text-base\">{description}</div>\n          )}\n        </CardHeader>\n      )}\n      <CardContent className={cn('p-4 md:p-5', contentClassName)}>\n        <div className=\"space-y-4\">{children}</div>\n        {actions && (\n          <div className=\"mt-4 flex justify-end gap-2\">{actions}</div>\n        )}\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;AAkBA,SAAgB,eAAe,EAC7B,OACA,aACA,SACA,UACA,WACA,oBACsB;AACtB,QACE,qBAAC;EAAK,WAAW,GAAG,0BAA0B,UAAU;cACpD,SAAS,gBACT,qBAAC,yBACE,SAAS,oBAAC,uBAAW,QAAkB,EACvC,eACC,oBAAC;GAAI,WAAU;aAAmC;IAAkB,IAE3D,EAEf,qBAAC;GAAY,WAAW,GAAG,cAAc,iBAAiB;cACxD,oBAAC;IAAI,WAAU;IAAa;KAAe,EAC1C,WACC,oBAAC;IAAI,WAAU;cAA+B;KAAc;IAElD;GACT"}

package/dist/components/forms/FormDialog.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime101 from "react/jsx-runtime";
+import * as react_jsx_runtime60 from "react/jsx-runtime";
 
 //#region src/components/forms/FormDialog.d.ts
 interface FormDialogProps {
@@ -19,7 +19,7 @@ declare function FormDialog({
   children,
   footer,
   maxWidth
-}: FormDialogProps): react_jsx_runtime101.JSX.Element;
+}: FormDialogProps): react_jsx_runtime60.JSX.Element;
 //#endregion
 export { FormDialog, FormDialogProps };
 //# sourceMappingURL=FormDialog.d.ts.map

package/dist/components/forms/FormDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormDialog.d.ts","names":[],"sources":["../../../src/components/forms/FormDialog.tsx"],"sourcesContent":[],"mappings":";;;;UAYiB,eAAA;;;EAAA,KAAA,EAGR,OAAA,CAAM,SAHiB;EAGvB,WAAM,CAAA,EACC,OAAA,CAAM,SADP;EACC,QAAM,EACV,OAAA,CAAM,SADI;EACV,MAAM,CAAA,EACP,OAAA,CAAM,SADC;EACP,QAAM,CAAA,EAAA,MAAA;;AAID,iBAAA,UAAA,CAAU;EAAA,IAAA;EAAA,YAAA;EAAA,KAAA;EAAA,WAAA;EAAA,QAAA;EAAA,MAAA;EAAA;AAAA,CAAA,EAQvB,eARuB,CAAA,EAQR,oBAAA,CAAA,GAAA,CAAA,OARQ"}
+{"version":3,"file":"FormDialog.d.ts","names":[],"sources":["../../../src/components/forms/FormDialog.tsx"],"sourcesContent":[],"mappings":";;;;UAYiB,eAAA;;;EAAA,KAAA,EAGR,OAAA,CAAM,SAHiB;EAGvB,WAAM,CAAA,EACC,OAAA,CAAM,SADP;EACC,QAAM,EACV,OAAA,CAAM,SADI;EACV,MAAM,CAAA,EACP,OAAA,CAAM,SADC;EACP,QAAM,CAAA,EAAA,MAAA;;AAID,iBAAA,UAAA,CAAU;EAAA,IAAA;EAAA,YAAA;EAAA,KAAA;EAAA,WAAA;EAAA,QAAA;EAAA,MAAA;EAAA;AAAA,CAAA,EAQvB,eARuB,CAAA,EAQR,mBAAA,CAAA,GAAA,CAAA,OARQ"}

package/dist/components/forms/FormDialog.js

@@ -1,9 +1,8 @@
 'use client';
 
-
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "../../ui-kit-web/dist/ui/dialog.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@lssm/lib.ui-kit-web/ui/dialog";
 
 //#region src/components/forms/FormDialog.tsx
 function FormDialog({ open, onOpenChange, title, description, children, footer, maxWidth = "sm:max-w-[480px]" }) {

package/dist/components/forms/FormDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormDialog.js","names":[],"sources":["../../../src/components/forms/FormDialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '@lssm/lib.ui-kit-web/ui/dialog';\n\nexport interface FormDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  children: React.ReactNode; // form body\n  footer?: React.ReactNode; // actions\n  maxWidth?: string; // e.g., 'sm:max-w-[480px]'\n}\n\nexport function FormDialog({\n  open,\n  onOpenChange,\n  title,\n  description,\n  children,\n  footer,\n  maxWidth = 'sm:max-w-[480px]',\n}: FormDialogProps) {\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent className={maxWidth}>\n        <DialogHeader>\n          <DialogTitle>{title}</DialogTitle>\n          {description && <DialogDescription>{description}</DialogDescription>}\n        </DialogHeader>\n        {children}\n        {footer && <DialogFooter>{footer}</DialogFooter>}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;AAsBA,SAAgB,WAAW,EACzB,MACA,cACA,OACA,aACA,UACA,QACA,WAAW,sBACO;AAClB,QACE,oBAAC;EAAa;EAAoB;YAChC,qBAAC;GAAc,WAAW;;IACxB,qBAAC,2BACC,oBAAC,yBAAa,QAAoB,EACjC,eAAe,oBAAC,+BAAmB,cAAgC,IACvD;IACd;IACA,UAAU,oBAAC,0BAAc,SAAsB;;IAClC;GACT"}
+{"version":3,"file":"FormDialog.js","names":[],"sources":["../../../src/components/forms/FormDialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '@lssm/lib.ui-kit-web/ui/dialog';\n\nexport interface FormDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  children: React.ReactNode; // form body\n  footer?: React.ReactNode; // actions\n  maxWidth?: string; // e.g., 'sm:max-w-[480px]'\n}\n\nexport function FormDialog({\n  open,\n  onOpenChange,\n  title,\n  description,\n  children,\n  footer,\n  maxWidth = 'sm:max-w-[480px]',\n}: FormDialogProps) {\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent className={maxWidth}>\n        <DialogHeader>\n          <DialogTitle>{title}</DialogTitle>\n          {description && <DialogDescription>{description}</DialogDescription>}\n        </DialogHeader>\n        {children}\n        {footer && <DialogFooter>{footer}</DialogFooter>}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;AAsBA,SAAgB,WAAW,EACzB,MACA,cACA,OACA,aACA,UACA,QACA,WAAW,sBACO;AAClB,QACE,oBAAC;EAAa;EAAoB;YAChC,qBAAC;GAAc,WAAW;;IACxB,qBAAC,2BACC,oBAAC,yBAAa,QAAoB,EACjC,eAAe,oBAAC,+BAAmB,cAAgC,IACvD;IACd;IACA,UAAU,oBAAC,0BAAc,SAAsB;;IAClC;GACT"}

package/dist/components/forms/FormLayout.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime113 from "react/jsx-runtime";
+import * as react_jsx_runtime41 from "react/jsx-runtime";
 
 //#region src/components/forms/FormLayout.d.ts
 declare function FormSection({
@@ -8,14 +8,14 @@ declare function FormSection({
 }: {
   children: React$1.ReactNode;
   className?: string;
-}): react_jsx_runtime113.JSX.Element;
+}): react_jsx_runtime41.JSX.Element;
 declare function FormRow({
   children,
   className
 }: {
   children: React$1.ReactNode;
   className?: string;
-}): react_jsx_runtime113.JSX.Element;
+}): react_jsx_runtime41.JSX.Element;
 declare function FormGrid({
   children,
   cols,
@@ -24,7 +24,7 @@ declare function FormGrid({
   children: React$1.ReactNode;
   cols?: 1 | 2 | 3 | 4;
   className?: string;
-}): react_jsx_runtime113.JSX.Element;
+}): react_jsx_runtime41.JSX.Element;
 //#endregion
 export { FormGrid, FormRow, FormSection };
 //# sourceMappingURL=FormLayout.d.ts.map

package/dist/components/forms/FormLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormLayout.tsx"],"sourcesContent":[],"mappings":";;;;iBAKgB,WAAA;;;AAAhB;YAIY,OAAA,CAAM;;AAJlB,CAAA,CAAA,EAMC,oBAAA,CAAA,GAAA,CAAA,OAN0B;AACzB,iBASc,OAAA,CATd;EAAA,QAAA;EAAA;CAAA,EAAA;EACA,QAAA,EAYU,OAAA,CAAM,SAZhB;EAEU,SAAM,CAAA,EAAA,MAAA;CAEjB,CAAA,EAUA,oBAAA,CAAA,GAAA,CAAA,OAVA;AAAA,iBAkBe,QAAA,CAlBf;EAAA,QAAA;EAAA,IAAA;EAAA;CAAA,EAAA;EAIe,QAAA,EAmBJ,OAAA,CAAM,SAnBK;EACrB,IAAA,CAAA,EAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA;CAEU,CAAA,EAkBX,oBAAA,CAAA,GAAA,CAAA,OAlBiB"}
+{"version":3,"file":"FormLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormLayout.tsx"],"sourcesContent":[],"mappings":";;;;iBAKgB,WAAA;;;AAAhB;YAIY,OAAA,CAAM;;AAJlB,CAAA,CAAA,EAMC,mBAAA,CAAA,GAAA,CAAA,OAN0B;AACzB,iBASc,OAAA,CATd;EAAA,QAAA;EAAA;CAAA,EAAA;EACA,QAAA,EAYU,OAAA,CAAM,SAZhB;EAEU,SAAM,CAAA,EAAA,MAAA;CAEjB,CAAA,EAUA,mBAAA,CAAA,GAAA,CAAA,OAVA;AAAA,iBAkBe,QAAA,CAlBf;EAAA,QAAA;EAAA,IAAA;EAAA;CAAA,EAAA;EAIe,QAAA,EAmBJ,OAAA,CAAM,SAnBK;EACrB,IAAA,CAAA,EAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA;CAEU,CAAA,EAkBX,mBAAA,CAAA,GAAA,CAAA,OAlBiB"}

package/dist/components/forms/FormLayout.js

@@ -1,12 +1,10 @@
 'use client';
 
-
-import { cn, init_utils } from "../../ui-kit-web/dist/ui/utils.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
+import { cn } from "@lssm/lib.ui-kit-web/ui/utils";
 
 //#region src/components/forms/FormLayout.tsx
-init_utils();
 function FormSection({ children, className }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: cn("space-y-4", className),

package/dist/components/forms/FormLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.js","names":[],"sources":["../../../src/components/forms/FormLayout.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport function FormSection({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return <div className={cn('space-y-4', className)}>{children}</div>;\n}\n\nexport function FormRow({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <div className={cn('grid grid-cols-1 gap-4 md:grid-cols-2', className)}>\n      {children}\n    </div>\n  );\n}\n\nexport function FormGrid({\n  children,\n  cols = 2,\n  className,\n}: {\n  children: React.ReactNode;\n  cols?: 1 | 2 | 3 | 4;\n  className?: string;\n}) {\n  const preset =\n    cols === 1\n      ? 'grid-cols-1'\n      : cols === 2\n        ? 'grid-cols-2'\n        : cols === 3\n          ? 'grid-cols-3'\n          : 'grid-cols-4';\n  return <div className={cn('grid gap-4', preset, className)}>{children}</div>;\n}\n"],"mappings":";;;;;;;;YAGmD;AAEnD,SAAgB,YAAY,EAC1B,UACA,aAIC;AACD,QAAO,oBAAC;EAAI,WAAW,GAAG,aAAa,UAAU;EAAG;GAAe;;AAGrE,SAAgB,QAAQ,EACtB,UACA,aAIC;AACD,QACE,oBAAC;EAAI,WAAW,GAAG,yCAAyC,UAAU;EACnE;GACG;;AAIV,SAAgB,SAAS,EACvB,UACA,OAAO,GACP,aAKC;AASD,QAAO,oBAAC;EAAI,WAAW,GAAG,cAPxB,SAAS,IACL,gBACA,SAAS,IACP,gBACA,SAAS,IACP,gBACA,eACsC,UAAU;EAAG;GAAe"}
+{"version":3,"file":"FormLayout.js","names":[],"sources":["../../../src/components/forms/FormLayout.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport function FormSection({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return <div className={cn('space-y-4', className)}>{children}</div>;\n}\n\nexport function FormRow({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <div className={cn('grid grid-cols-1 gap-4 md:grid-cols-2', className)}>\n      {children}\n    </div>\n  );\n}\n\nexport function FormGrid({\n  children,\n  cols = 2,\n  className,\n}: {\n  children: React.ReactNode;\n  cols?: 1 | 2 | 3 | 4;\n  className?: string;\n}) {\n  const preset =\n    cols === 1\n      ? 'grid-cols-1'\n      : cols === 2\n        ? 'grid-cols-2'\n        : cols === 3\n          ? 'grid-cols-3'\n          : 'grid-cols-4';\n  return <div className={cn('grid gap-4', preset, className)}>{children}</div>;\n}\n"],"mappings":";;;;;;;AAKA,SAAgB,YAAY,EAC1B,UACA,aAIC;AACD,QAAO,oBAAC;EAAI,WAAW,GAAG,aAAa,UAAU;EAAG;GAAe;;AAGrE,SAAgB,QAAQ,EACtB,UACA,aAIC;AACD,QACE,oBAAC;EAAI,WAAW,GAAG,yCAAyC,UAAU;EACnE;GACG;;AAIV,SAAgB,SAAS,EACvB,UACA,OAAO,GACP,aAKC;AASD,QAAO,oBAAC;EAAI,WAAW,GAAG,cAPxB,SAAS,IACL,gBACA,SAAS,IACP,gBACA,SAAS,IACP,gBACA,eACsC,UAAU;EAAG;GAAe"}

package/dist/components/forms/FormOneByOneLayout.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime105 from "react/jsx-runtime";
+import * as react_jsx_runtime40 from "react/jsx-runtime";
 
 //#region src/components/forms/FormOneByOneLayout.d.ts
 interface OneByOneFieldDef {
@@ -20,7 +20,7 @@ declare function FormOneByOneLayout({
   initialKey,
   onComplete,
   className
-}: FormOneByOneLayoutProps): react_jsx_runtime105.JSX.Element | null;
+}: FormOneByOneLayoutProps): react_jsx_runtime40.JSX.Element | null;
 //#endregion
 export { FormOneByOneLayout, FormOneByOneLayoutProps, OneByOneFieldDef };
 //# sourceMappingURL=FormOneByOneLayout.d.ts.map

package/dist/components/forms/FormOneByOneLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormOneByOneLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormOneByOneLayout.tsx"],"sourcesContent":[],"mappings":";;;;UAIiB,gBAAA;;SAER,OAAA,CAAM;EAFE,WAAA,CAAA,EAGD,OAAA,CAAM,SAHW;EAExB,KAAM,EAEN,OAAA,CAAM,SAFA;EACC,QAAM,CAAA,EAAA,GAAA,GAAA,OAAA;;AACE,UAIP,uBAAA,CAJO;EAIP,MAAA,EACP,gBADO,EAAuB;EAOxB,UAAA,CAAA,EAAA,MAAA;EACd,UAAA,CAAA,EAAA,GAAA,GAAA,IAAA,GAL0B,OAK1B,CAAA,IAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA;;AAEA,iBAJc,kBAAA,CAId;EAAA,MAAA;EAAA,UAAA;EAAA,UAAA;EAAA;AAAA,CAAA,EACC,uBADD,CAAA,EACwB,oBAAA,CAAA,GAAA,CAAA,OAAA,GADxB,IAAA"}
+{"version":3,"file":"FormOneByOneLayout.d.ts","names":[],"sources":["../../../src/components/forms/FormOneByOneLayout.tsx"],"sourcesContent":[],"mappings":";;;;UAIiB,gBAAA;;SAER,OAAA,CAAM;EAFE,WAAA,CAAA,EAGD,OAAA,CAAM,SAHW;EAExB,KAAM,EAEN,OAAA,CAAM,SAFA;EACC,QAAM,CAAA,EAAA,GAAA,GAAA,OAAA;;AACE,UAIP,uBAAA,CAJO;EAIP,MAAA,EACP,gBADO,EAAuB;EAOxB,UAAA,CAAA,EAAA,MAAA;EACd,UAAA,CAAA,EAAA,GAAA,GAAA,IAAA,GAL0B,OAK1B,CAAA,IAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA;;AAEA,iBAJc,kBAAA,CAId;EAAA,MAAA;EAAA,UAAA;EAAA,UAAA;EAAA;AAAA,CAAA,EACC,uBADD,CAAA,EACwB,mBAAA,CAAA,GAAA,CAAA,OAAA,GADxB,IAAA"}

package/dist/components/forms/FormOneByOneLayout.js

@@ -1,10 +1,9 @@
-import { cn, init_utils } from "../../ui-kit-web/dist/ui/utils.js";
 import { Button } from "../atoms/Button.js";
 import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@lssm/lib.ui-kit-web/ui/utils";
 
 //#region src/components/forms/FormOneByOneLayout.tsx
-init_utils();
 function FormOneByOneLayout({ fields, initialKey, onComplete, className }) {
 	const indexByKey = React$1.useMemo(() => Object.fromEntries(fields.map((f, i) => [f.key, i])), [fields]);
 	const [idx, setIdx] = React$1.useState(() => {

package/dist/components/forms/FormOneByOneLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormOneByOneLayout.js","names":["React"],"sources":["../../../src/components/forms/FormOneByOneLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Button } from '../atoms/Button';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport interface OneByOneFieldDef {\n  key: string;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  input: React.ReactNode;\n  validate?: () => boolean; // called before advancing\n}\n\nexport interface FormOneByOneLayoutProps {\n  fields: OneByOneFieldDef[];\n  initialKey?: string;\n  onComplete?: () => void | Promise<void>;\n  className?: string;\n}\n\nexport function FormOneByOneLayout({\n  fields,\n  initialKey,\n  onComplete,\n  className,\n}: FormOneByOneLayoutProps) {\n  const indexByKey = React.useMemo(\n    () => Object.fromEntries(fields.map((f, i) => [f.key, i])),\n    [fields]\n  );\n  const [idx, setIdx] = React.useState<number>(() => {\n    if (initialKey && initialKey in indexByKey) {\n      return indexByKey[initialKey] || 0;\n    }\n    return 0;\n  });\n  const atLast = idx === fields.length - 1;\n  const field = fields[idx];\n\n  if (!field) {\n    return null;\n  }\n\n  const next = async () => {\n    if (field.validate && !field.validate()) return;\n    if (atLast) {\n      await onComplete?.();\n    } else {\n      setIdx((i) => Math.min(i + 1, fields.length - 1));\n    }\n  };\n  const prev = () => setIdx((i) => Math.max(0, i - 1));\n\n  return (\n    <div\n      className={cn(\n        'flex min-h-[320px] flex-col items-stretch justify-between',\n        className\n      )}\n    >\n      <div className=\"space-y-2\">\n        <div className=\"text-lg font-medium\">{field.title}</div>\n        {field.description && (\n          <div className=\"text-muted-foreground text-base\">\n            {field.description}\n          </div>\n        )}\n        <div className=\"pt-2\">{field.input}</div>\n      </div>\n      <div className=\"mt-6 flex items-center justify-between\">\n        <Button variant=\"ghost\" onPress={prev} disabled={idx === 0}>\n          Back\n        </Button>\n        <Button onPress={next}>{atLast ? 'Done' : 'Continue'}</Button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;YAEmD;AAiBnD,SAAgB,mBAAmB,EACjC,QACA,YACA,YACA,aAC0B;CAC1B,MAAM,aAAaA,QAAM,cACjB,OAAO,YAAY,OAAO,KAAK,GAAG,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,EAC1D,CAAC,OAAO,CACT;CACD,MAAM,CAAC,KAAK,UAAUA,QAAM,eAAuB;AACjD,MAAI,cAAc,cAAc,WAC9B,QAAO,WAAW,eAAe;AAEnC,SAAO;GACP;CACF,MAAM,SAAS,QAAQ,OAAO,SAAS;CACvC,MAAM,QAAQ,OAAO;AAErB,KAAI,CAAC,MACH,QAAO;CAGT,MAAM,OAAO,YAAY;AACvB,MAAI,MAAM,YAAY,CAAC,MAAM,UAAU,CAAE;AACzC,MAAI,OACF,OAAM,cAAc;MAEpB,SAAQ,MAAM,KAAK,IAAI,IAAI,GAAG,OAAO,SAAS,EAAE,CAAC;;CAGrD,MAAM,aAAa,QAAQ,MAAM,KAAK,IAAI,GAAG,IAAI,EAAE,CAAC;AAEpD,QACE,qBAAC;EACC,WAAW,GACT,6DACA,UACD;aAED,qBAAC;GAAI,WAAU;;IACb,oBAAC;KAAI,WAAU;eAAuB,MAAM;MAAY;IACvD,MAAM,eACL,oBAAC;KAAI,WAAU;eACZ,MAAM;MACH;IAER,oBAAC;KAAI,WAAU;eAAQ,MAAM;MAAY;;IACrC,EACN,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAO,SAAQ;IAAQ,SAAS;IAAM,UAAU,QAAQ;cAAG;KAEnD,EACT,oBAAC;IAAO,SAAS;cAAO,SAAS,SAAS;KAAoB;IAC1D;GACF"}
+{"version":3,"file":"FormOneByOneLayout.js","names":["React"],"sources":["../../../src/components/forms/FormOneByOneLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Button } from '../atoms/Button';\nimport { cn } from '@lssm/lib.ui-kit-web/ui/utils';\n\nexport interface OneByOneFieldDef {\n  key: string;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  input: React.ReactNode;\n  validate?: () => boolean; // called before advancing\n}\n\nexport interface FormOneByOneLayoutProps {\n  fields: OneByOneFieldDef[];\n  initialKey?: string;\n  onComplete?: () => void | Promise<void>;\n  className?: string;\n}\n\nexport function FormOneByOneLayout({\n  fields,\n  initialKey,\n  onComplete,\n  className,\n}: FormOneByOneLayoutProps) {\n  const indexByKey = React.useMemo(\n    () => Object.fromEntries(fields.map((f, i) => [f.key, i])),\n    [fields]\n  );\n  const [idx, setIdx] = React.useState<number>(() => {\n    if (initialKey && initialKey in indexByKey) {\n      return indexByKey[initialKey] || 0;\n    }\n    return 0;\n  });\n  const atLast = idx === fields.length - 1;\n  const field = fields[idx];\n\n  if (!field) {\n    return null;\n  }\n\n  const next = async () => {\n    if (field.validate && !field.validate()) return;\n    if (atLast) {\n      await onComplete?.();\n    } else {\n      setIdx((i) => Math.min(i + 1, fields.length - 1));\n    }\n  };\n  const prev = () => setIdx((i) => Math.max(0, i - 1));\n\n  return (\n    <div\n      className={cn(\n        'flex min-h-[320px] flex-col items-stretch justify-between',\n        className\n      )}\n    >\n      <div className=\"space-y-2\">\n        <div className=\"text-lg font-medium\">{field.title}</div>\n        {field.description && (\n          <div className=\"text-muted-foreground text-base\">\n            {field.description}\n          </div>\n        )}\n        <div className=\"pt-2\">{field.input}</div>\n      </div>\n      <div className=\"mt-6 flex items-center justify-between\">\n        <Button variant=\"ghost\" onPress={prev} disabled={idx === 0}>\n          Back\n        </Button>\n        <Button onPress={next}>{atLast ? 'Done' : 'Continue'}</Button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAmBA,SAAgB,mBAAmB,EACjC,QACA,YACA,YACA,aAC0B;CAC1B,MAAM,aAAaA,QAAM,cACjB,OAAO,YAAY,OAAO,KAAK,GAAG,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,EAC1D,CAAC,OAAO,CACT;CACD,MAAM,CAAC,KAAK,UAAUA,QAAM,eAAuB;AACjD,MAAI,cAAc,cAAc,WAC9B,QAAO,WAAW,eAAe;AAEnC,SAAO;GACP;CACF,MAAM,SAAS,QAAQ,OAAO,SAAS;CACvC,MAAM,QAAQ,OAAO;AAErB,KAAI,CAAC,MACH,QAAO;CAGT,MAAM,OAAO,YAAY;AACvB,MAAI,MAAM,YAAY,CAAC,MAAM,UAAU,CAAE;AACzC,MAAI,OACF,OAAM,cAAc;MAEpB,SAAQ,MAAM,KAAK,IAAI,IAAI,GAAG,OAAO,SAAS,EAAE,CAAC;;CAGrD,MAAM,aAAa,QAAQ,MAAM,KAAK,IAAI,GAAG,IAAI,EAAE,CAAC;AAEpD,QACE,qBAAC;EACC,WAAW,GACT,6DACA,UACD;aAED,qBAAC;GAAI,WAAU;;IACb,oBAAC;KAAI,WAAU;eAAuB,MAAM;MAAY;IACvD,MAAM,eACL,oBAAC;KAAI,WAAU;eACZ,MAAM;MACH;IAER,oBAAC;KAAI,WAAU;eAAQ,MAAM;MAAY;;IACrC,EACN,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAO,SAAQ;IAAQ,SAAS;IAAM,UAAU,QAAQ;cAAG;KAEnD,EACT,oBAAC;IAAO,SAAS;cAAO,SAAS,SAAS;KAAoB;IAC1D;GACF"}

package/dist/components/forms/FormStepsLayout.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime103 from "react/jsx-runtime";
+import * as react_jsx_runtime120 from "react/jsx-runtime";
 
 //#region src/components/forms/FormStepsLayout.d.ts
 interface StepDef {
@@ -21,7 +21,7 @@ declare function FormStepsLayout({
   onFinish,
   canNext,
   className
-}: FormStepsLayoutProps): react_jsx_runtime103.JSX.Element | null;
+}: FormStepsLayoutProps): react_jsx_runtime120.JSX.Element | null;
 //#endregion
 export { FormStepsLayout, FormStepsLayoutProps, StepDef };
 //# sourceMappingURL=FormStepsLayout.d.ts.map

package/dist/components/forms/FormStepsLayout.js

@@ -1,11 +1,10 @@
-import { cn, init_utils } from "../../ui-kit-web/dist/ui/utils.js";
-import { Separator } from "../../ui-kit-web/dist/ui/separator.js";
 import { Button } from "../atoms/Button.js";
 import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@lssm/lib.ui-kit-web/ui/utils";
+import { Separator } from "@lssm/lib.ui-kit-web/ui/separator";
 
 //#region src/components/forms/FormStepsLayout.tsx
-init_utils();
 function FormStepsLayout({ steps, initialStepKey, onFinish, canNext, className }) {
 	const indexByKey = React$1.useMemo(() => Object.fromEntries(steps.map((s, i) => [s.key, i])), [steps]);
 	const [idx, setIdx] = React$1.useState(() => {