wimui 0.1.0

package/dist/components/data-display/DataGrid/DataGrid.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../form/Checkbox/Checkbox.cjs"),r=require("../../navigation/Pagination/Pagination.cjs"),i=require("../Table/Table.cjs"),a=require("./useFixedColumns.cjs"),o=require("./useDataGridKeyboard.cjs"),s=require("./useInfiniteScroll.cjs"),c=require("./datagrid.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");function f({columns:e,data:f,rowKey:p=`id`,loading:m=!1,striped:h=!1,bordered:g=!1,hoverable:_=!0,stickyHeader:v=!0,height:y,maxHeight:b,emptyMessage:x,mobileCard:S=!1,selection:C,selectedRowKeys:w,onSelectionChange:T,sortConfig:E,onSortChange:D,pagination:O,infiniteScroll:k,className:A,ariaLabel:j}){let{t:M}=t.useWimTranslation(`common`),N=(0,l.useMemo)(()=>C?C===!0?{type:`checkbox`,selectedRowKeys:w??[],onChange:(e,t)=>{T?.(e,t)}}:C:null,[C,w,T]),{fixedLeftOffsets:P,fixedRightOffsets:F}=a.useFixedColumns(e,!!N),I=(e,t=!1)=>{let n=P[e];if(n)return{stickyLeft:!0,leftOffset:n.offset,stickyZIndex:t?1e3+n.zIndex:n.zIndex,className:(0,u.default)(c.default.cellFixed,n.isLast&&c.default.cellFixedLeftLast)};let r=F[e];return r?{stickyRight:!0,rightOffset:r.offset,stickyZIndex:t?1e3+r.zIndex:r.zIndex,className:(0,u.default)(c.default.cellFixed,r.isFirst&&c.default.cellFixedRightFirst)}:{}},L=(0,l.useCallback)(e=>typeof p==`function`?p(e):e[p],[p]),R=(0,l.useMemo)(()=>!N||f.length===0?!1:f.every(e=>N.selectedRowKeys.includes(L(e))),[f,N,L]),z=(0,l.useMemo)(()=>N?!R&&f.some(e=>N.selectedRowKeys.includes(L(e))):!1,[f,N,R,L]),B=e=>{if(!N)return;let t=e.target.checked,n=t?f.map(L):[],r=t?f:[];N.onChange(n,r)},V=(e,t)=>{if(!N)return;let n=t.target.checked,r=L(e),i=n?[...N.selectedRowKeys,r]:N.selectedRowKeys.filter(e=>e!==r),a=f.filter(e=>i.includes(L(e)));N.onChange(i,a)},{focusedCell:H,handleKeyDown:U,containerRef:W}=o.useDataGridKeyboard(e,f,!!N),{loaderRef:G}=s.useInfiniteScroll(k),K=e.length+ +!!N;return(0,d.jsxs)(`div`,{className:(0,u.default)(`wim-data-grid`,c.default.root,m&&c.default.loading,A),children:[(0,d.jsxs)(`div`,{className:c.default.container,style:{height:y,maxHeight:b},children:[(0,d.jsxs)(i.Table,{ref:W,onKeyDown:U,tabIndex:0,role:`grid`,"aria-label":j??M(`a11y.data_grid`),"aria-rowcount":f.length+1,"aria-colcount":K,striped:h,bordered:g,hoverable:_,stickyHeader:v,mobileCard:S,fullWidth:!0,className:(0,u.default)(`wim-table`,c.default.table),containerClassName:c.default.tableContainer,children:[(0,d.jsx)(i.Table.Header,{children:(0,d.jsxs)(i.Table.Row,{children:[N&&(0,d.jsx)(i.Table.Head,{role:`columnheader`,selection:!0,stickyLeft:!0,leftOffset:0,stickyZIndex:1150,"data-row":-1,"data-col":-1,"aria-label":M(`a11y.select_all_rows`),tabIndex:H.row===-1&&H.col===-1?0:-1,children:(N.type??`checkbox`)===`checkbox`&&(0,d.jsx)(n.Checkbox,{checked:R,indeterminate:z,onChange:B,"aria-label":M(`a11y.select_all_rows`)})}),e.map((e,t)=>{let n=I(e.key,!0);return(0,d.jsx)(i.Table.Head,{role:`columnheader`,style:{width:e.width,minWidth:e.width},sortable:e.sortable,sortDirection:E?.key===e.key?E.direction:`none`,onSort:()=>{if(!e.sortable||!D)return;let t=E?.key===e.key?E.direction===`asc`?`desc`:E.direction===`desc`?`none`:`asc`:`asc`;D(e.key,t)},...n,tabIndex:H.row===-1&&H.col===(N?t+1:t)?0:-1,"data-row":-1,"data-col":N?t+1:t,children:e.title},e.key)})]})}),(0,d.jsx)(i.Table.Body,{children:f.map((t,r)=>{let a=L(t),o=N?.selectedRowKeys.includes(a);return(0,d.jsxs)(i.Table.Row,{selected:o,children:[N&&(0,d.jsx)(i.Table.Cell,{role:`gridcell`,selection:!0,stickyLeft:!0,leftOffset:0,stickyZIndex:150,"data-row":r,"data-col":-1,tabIndex:H.row===r&&H.col===-1?0:-1,children:(0,d.jsx)(n.Checkbox,{checked:o,onChange:e=>V(t,e),"aria-label":M(`a11y.select_row`)})}),e.map((e,n)=>{let a=I(e.key,!1),o=t[e.dataIndex??e.key];return(0,d.jsx)(i.Table.Cell,{role:`gridcell`,label:typeof e.title==`string`?e.title:void 0,...a,"data-row":r,"data-col":N?n+1:n,tabIndex:H.row===r&&H.col===(N?n+1:n)?0:-1,children:e.render?e.render(o,t,r):o},e.key)})]},a)})})]}),f.length===0&&x&&(0,d.jsx)(`div`,{role:`status`,className:c.default.empty,children:x}),k?.hasMore&&(0,d.jsx)(`div`,{ref:G,className:c.default.loader,children:k.hasMore&&`Loading more...`})]}),O&&(0,d.jsxs)(`div`,{className:c.default.footer,children:[(0,d.jsxs)(`div`,{className:c.default.info,children:[`Displaying `,f.length,` of `,O.total,` records`,N?.selectedRowKeys&&N.selectedRowKeys.length>0&&(0,d.jsxs)(`span`,{className:c.default.selectionInfo,children:[`(`,N.selectedRowKeys.length,` row(s) selected)`]})]}),(0,d.jsx)(`div`,{className:c.default.pagination,children:(0,d.jsx)(r.Pagination,{className:c.default.paginationContent,current:O.current,total:O.total,pageSize:O.pageSize,onChange:O.onChange})})]})]})}exports.DataGrid=f;

package/dist/components/data-display/DataGrid/DataGrid.d.ts

@@ -0,0 +1,74 @@
+import { default as React } from 'react';
+export type DataGridColumn<T> = {
+    key: string;
+    /** If provided, read cell value from this field instead of `key` */
+    dataIndex?: string;
+    title: React.ReactNode;
+    width?: string | number;
+    sortable?: boolean;
+    fixed?: "left" | "right";
+    render?: (value: unknown, record: T, index: number) => React.ReactNode;
+};
+type SelectionConfig<T> = {
+    type?: "checkbox" | "radio";
+    selectedRowKeys: string[];
+    onChange: (keys: string[], records: T[]) => void;
+};
+export type DataGridProps<T> = {
+    /** Column definitions */
+    columns: DataGridColumn<T>[];
+    /** Row data */
+    data: T[];
+    /** Row key: a field name or a function that derives the key from a record */
+    rowKey?: string | ((record: T) => string);
+    /** Whether the grid is in a loading state */
+    loading?: boolean;
+    /** Whether to show striped (zebra) rows */
+    striped?: boolean;
+    /** Whether to show borders between cells */
+    bordered?: boolean;
+    /** Whether rows highlight on hover */
+    hoverable?: boolean;
+    /** Whether the header sticks to the top while scrolling */
+    stickyHeader?: boolean;
+    /** Height of the grid (enables vertical scrolling) */
+    height?: string | number;
+    /** Maximum height of the grid (enables vertical scrolling) */
+    maxHeight?: string | number;
+    /** Message or element to display when data is empty */
+    emptyMessage?: React.ReactNode;
+    /** Enable mobile card layout */
+    mobileCard?: boolean;
+    /** Row selection: a boolean shorthand or a full configuration object */
+    selection?: boolean | SelectionConfig<T>;
+    /** Selected row keys (used with boolean `selection`) */
+    selectedRowKeys?: string[];
+    /** Selection change callback (used with boolean `selection`) */
+    onSelectionChange?: (keys: string[], records: T[]) => void;
+    /** Current sort configuration */
+    sortConfig?: {
+        key: string;
+        direction: "asc" | "desc" | "none";
+    };
+    /** Callback when the sort configuration changes */
+    onSortChange?: (key: string, direction: "asc" | "desc" | "none") => void;
+    /** Pagination configuration, or false to disable pagination */
+    pagination?: {
+        current: number;
+        pageSize: number;
+        total: number;
+        onChange: (page: number, pageSize: number) => void;
+    } | false;
+    /** Infinite-scroll configuration for dynamic loading */
+    infiniteScroll?: {
+        hasMore: boolean;
+        onLoadMore: () => void;
+        threshold?: number;
+    };
+    /** Additional class names */
+    className?: string;
+    /** Accessibility label for the grid */
+    ariaLabel?: string;
+};
+export declare function DataGrid<T extends Record<string, unknown>>({ columns, data, rowKey, loading, striped, bordered, hoverable, stickyHeader, height, maxHeight, emptyMessage, mobileCard, selection: selectionProp, selectedRowKeys: propsSelectedRowKeys, onSelectionChange, sortConfig, onSortChange, pagination, infiniteScroll, className, ariaLabel, }: DataGridProps<T>): React.JSX.Element;
+export {};

package/dist/components/data-display/DataGrid/DataGrid.js

@@ -0,0 +1,197 @@
+"use client";
+import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
+import { Checkbox as t } from "../../form/Checkbox/Checkbox.js";
+import { Pagination as n } from "../../navigation/Pagination/Pagination.js";
+import { Table as r } from "../Table/Table.js";
+import { useFixedColumns as i } from "./useFixedColumns.js";
+import { useDataGridKeyboard as a } from "./useDataGridKeyboard.js";
+import { useInfiniteScroll as o } from "./useInfiniteScroll.js";
+import s from "./datagrid.module.js";
+import { useCallback as c, useMemo as l } from "react";
+import u from "classnames";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/components/data-display/DataGrid/DataGrid.tsx
+function p({ columns: p, data: m, rowKey: h = "id", loading: g = !1, striped: _ = !1, bordered: v = !1, hoverable: y = !0, stickyHeader: b = !0, height: x, maxHeight: S, emptyMessage: C, mobileCard: w = !1, selection: T, selectedRowKeys: E, onSelectionChange: D, sortConfig: O, onSortChange: k, pagination: A, infiniteScroll: j, className: M, ariaLabel: N }) {
+	let { t: P } = e("common"), F = l(() => T ? T === !0 ? {
+		type: "checkbox",
+		selectedRowKeys: E ?? [],
+		onChange: (e, t) => {
+			D?.(e, t);
+		}
+	} : T : null, [
+		T,
+		E,
+		D
+	]), { fixedLeftOffsets: I, fixedRightOffsets: L } = i(p, !!F), R = (e, t = !1) => {
+		let n = I[e];
+		if (n) return {
+			stickyLeft: !0,
+			leftOffset: n.offset,
+			stickyZIndex: t ? 1e3 + n.zIndex : n.zIndex,
+			className: u(s.cellFixed, n.isLast && s.cellFixedLeftLast)
+		};
+		let r = L[e];
+		return r ? {
+			stickyRight: !0,
+			rightOffset: r.offset,
+			stickyZIndex: t ? 1e3 + r.zIndex : r.zIndex,
+			className: u(s.cellFixed, r.isFirst && s.cellFixedRightFirst)
+		} : {};
+	}, z = c((e) => typeof h == "function" ? h(e) : e[h], [h]), B = l(() => !F || m.length === 0 ? !1 : m.every((e) => F.selectedRowKeys.includes(z(e))), [
+		m,
+		F,
+		z
+	]), V = l(() => F ? !B && m.some((e) => F.selectedRowKeys.includes(z(e))) : !1, [
+		m,
+		F,
+		B,
+		z
+	]), H = (e) => {
+		if (!F) return;
+		let t = e.target.checked, n = t ? m.map(z) : [], r = t ? m : [];
+		F.onChange(n, r);
+	}, U = (e, t) => {
+		if (!F) return;
+		let n = t.target.checked, r = z(e), i = n ? [...F.selectedRowKeys, r] : F.selectedRowKeys.filter((e) => e !== r), a = m.filter((e) => i.includes(z(e)));
+		F.onChange(i, a);
+	}, { focusedCell: W, handleKeyDown: G, containerRef: K } = a(p, m, !!F), { loaderRef: q } = o(j), J = p.length + +!!F;
+	return /* @__PURE__ */ f("div", {
+		className: u("wim-data-grid", s.root, g && s.loading, M),
+		children: [/* @__PURE__ */ f("div", {
+			className: s.container,
+			style: {
+				height: x,
+				maxHeight: S
+			},
+			children: [
+				/* @__PURE__ */ f(r, {
+					ref: K,
+					onKeyDown: G,
+					tabIndex: 0,
+					role: "grid",
+					"aria-label": N ?? P("a11y.data_grid"),
+					"aria-rowcount": m.length + 1,
+					"aria-colcount": J,
+					striped: _,
+					bordered: v,
+					hoverable: y,
+					stickyHeader: b,
+					mobileCard: w,
+					fullWidth: !0,
+					className: u("wim-table", s.table),
+					containerClassName: s.tableContainer,
+					children: [/* @__PURE__ */ d(r.Header, { children: /* @__PURE__ */ f(r.Row, { children: [F && /* @__PURE__ */ d(r.Head, {
+						role: "columnheader",
+						selection: !0,
+						stickyLeft: !0,
+						leftOffset: 0,
+						stickyZIndex: 1150,
+						"data-row": -1,
+						"data-col": -1,
+						"aria-label": P("a11y.select_all_rows"),
+						tabIndex: W.row === -1 && W.col === -1 ? 0 : -1,
+						children: (F.type ?? "checkbox") === "checkbox" && /* @__PURE__ */ d(t, {
+							checked: B,
+							indeterminate: V,
+							onChange: H,
+							"aria-label": P("a11y.select_all_rows")
+						})
+					}), p.map((e, t) => {
+						let n = R(e.key, !0);
+						return /* @__PURE__ */ d(r.Head, {
+							role: "columnheader",
+							style: {
+								width: e.width,
+								minWidth: e.width
+							},
+							sortable: e.sortable,
+							sortDirection: O?.key === e.key ? O.direction : "none",
+							onSort: () => {
+								if (!e.sortable || !k) return;
+								let t = O?.key === e.key ? O.direction === "asc" ? "desc" : O.direction === "desc" ? "none" : "asc" : "asc";
+								k(e.key, t);
+							},
+							...n,
+							tabIndex: W.row === -1 && W.col === (F ? t + 1 : t) ? 0 : -1,
+							"data-row": -1,
+							"data-col": F ? t + 1 : t,
+							children: e.title
+						}, e.key);
+					})] }) }), /* @__PURE__ */ d(r.Body, { children: m.map((e, n) => {
+						let i = z(e), a = F?.selectedRowKeys.includes(i);
+						return /* @__PURE__ */ f(r.Row, {
+							selected: a,
+							children: [F && /* @__PURE__ */ d(r.Cell, {
+								role: "gridcell",
+								selection: !0,
+								stickyLeft: !0,
+								leftOffset: 0,
+								stickyZIndex: 150,
+								"data-row": n,
+								"data-col": -1,
+								tabIndex: W.row === n && W.col === -1 ? 0 : -1,
+								children: /* @__PURE__ */ d(t, {
+									checked: a,
+									onChange: (t) => U(e, t),
+									"aria-label": P("a11y.select_row")
+								})
+							}), p.map((t, i) => {
+								let a = R(t.key, !1), o = e[t.dataIndex ?? t.key];
+								return /* @__PURE__ */ d(r.Cell, {
+									role: "gridcell",
+									label: typeof t.title == "string" ? t.title : void 0,
+									...a,
+									"data-row": n,
+									"data-col": F ? i + 1 : i,
+									tabIndex: W.row === n && W.col === (F ? i + 1 : i) ? 0 : -1,
+									children: t.render ? t.render(o, e, n) : o
+								}, t.key);
+							})]
+						}, i);
+					}) })]
+				}),
+				m.length === 0 && C && /* @__PURE__ */ d("div", {
+					role: "status",
+					className: s.empty,
+					children: C
+				}),
+				j?.hasMore && /* @__PURE__ */ d("div", {
+					ref: q,
+					className: s.loader,
+					children: j.hasMore && "Loading more..."
+				})
+			]
+		}), A && /* @__PURE__ */ f("div", {
+			className: s.footer,
+			children: [/* @__PURE__ */ f("div", {
+				className: s.info,
+				children: [
+					"Displaying ",
+					m.length,
+					" of ",
+					A.total,
+					" records",
+					F?.selectedRowKeys && F.selectedRowKeys.length > 0 && /* @__PURE__ */ f("span", {
+						className: s.selectionInfo,
+						children: [
+							"(",
+							F.selectedRowKeys.length,
+							" row(s) selected)"
+						]
+					})
+				]
+			}), /* @__PURE__ */ d("div", {
+				className: s.pagination,
+				children: /* @__PURE__ */ d(n, {
+					className: s.paginationContent,
+					current: A.current,
+					total: A.total,
+					pageSize: A.pageSize,
+					onChange: A.onChange
+				})
+			})]
+		})]
+	});
+}
+//#endregion
+export { p as DataGrid };

package/dist/components/data-display/DataGrid/datagrid.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_asx5s_3`,t=`_container_asx5s_15`,n=`_footer_asx5s_22`,r=`_info_asx5s_33`,i=`_pagination_asx5s_44`,a=`_paginationContent_asx5s_55`,o=`_loading_asx5s_59`,s=`_loader_asx5s_64`,c=`_table_asx5s_73`,l=`_tableContainer_asx5s_78`,u=`_cellFixed_asx5s_82`,d=`_cellFixedLeftLast_asx5s_87`,f=`_cellFixedRightFirst_asx5s_99`,p=`_selectionInfo_asx5s_111`,m={root:e,container:t,footer:n,info:r,pagination:i,paginationContent:a,loading:o,loader:s,table:c,tableContainer:l,cellFixed:u,cellFixedLeftLast:d,cellFixedRightFirst:f,selectionInfo:p};exports.cellFixed=u,exports.cellFixedLeftLast=d,exports.cellFixedRightFirst=f,exports.container=t,exports.default=m,exports.footer=n,exports.info=r,exports.loader=s,exports.loading=o,exports.pagination=i,exports.paginationContent=a,exports.root=e,exports.selectionInfo=p,exports.table=c,exports.tableContainer=l;

package/dist/components/data-display/DataGrid/datagrid.module.js

@@ -0,0 +1,20 @@
+"use client";
+//#region src/components/data-display/DataGrid/datagrid.module.scss
+var e = "_root_asx5s_3", t = "_container_asx5s_15", n = "_footer_asx5s_22", r = "_info_asx5s_33", i = "_pagination_asx5s_44", a = "_paginationContent_asx5s_55", o = "_loading_asx5s_59", s = "_loader_asx5s_64", c = "_table_asx5s_73", l = "_tableContainer_asx5s_78", u = "_cellFixed_asx5s_82", d = "_cellFixedLeftLast_asx5s_87", f = "_cellFixedRightFirst_asx5s_99", p = "_selectionInfo_asx5s_111", m = {
+	root: e,
+	container: t,
+	footer: n,
+	info: r,
+	pagination: i,
+	paginationContent: a,
+	loading: o,
+	loader: s,
+	table: c,
+	tableContainer: l,
+	cellFixed: u,
+	cellFixedLeftLast: d,
+	cellFixedRightFirst: f,
+	selectionInfo: p
+};
+//#endregion
+export { u as cellFixed, d as cellFixedLeftLast, f as cellFixedRightFirst, t as container, m as default, n as footer, r as info, s as loader, o as loading, i as pagination, a as paginationContent, e as root, p as selectionInfo, c as table, l as tableContainer };

package/dist/components/data-display/DataGrid/useDataGridKeyboard.cjs

@@ -0,0 +1,2 @@
+"use client";
+let e=require("react");function t(t,n,r){let[i,a]=(0,e.useState)({row:-1,col:r?-1:0}),o=(0,e.useRef)(null);return{focusedCell:i,setFocusedCell:a,containerRef:o,handleKeyDown:e=>{let{row:s,col:c}=i,l=s,u=c,d=r?-1:0,f=t.length-1,p=n.length-1;switch(e.key){case`ArrowRight`:c<f&&u++;break;case`ArrowLeft`:c>d&&u--;break;case`ArrowDown`:s<p&&l++;break;case`ArrowUp`:s>-1&&l--;break;case`Home`:e.ctrlKey&&(l=-1),u=d;break;case`End`:e.ctrlKey&&(l=p),u=f;break;case`Enter`:case` `:{let t=document.activeElement;if(t?.getAttribute(`role`)===`columnheader`)return;if(t?.tagName===`TD`||t?.tagName===`TH`||t?.getAttribute(`role`)===`gridcell`){let n=t.querySelector(`input, button, [role="button"]`);n&&(n.click(),e.preventDefault())}return}default:return}(l!==s||u!==c)&&(e.preventDefault(),a({row:l,col:u}),setTimeout(()=>{(o.current?.querySelector(`[data-row="${l}"][data-col="${u}"]`))?.focus()},0))}}}exports.useDataGridKeyboard=t;

package/dist/components/data-display/DataGrid/useDataGridKeyboard.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+import { DataGridColumn } from './DataGrid';
+export declare function useDataGridKeyboard<T>(columns: DataGridColumn<T>[], rows: T[], selection: boolean): {
+    focusedCell: {
+        row: number;
+        col: number;
+    };
+    setFocusedCell: React.Dispatch<React.SetStateAction<{
+        row: number;
+        col: number;
+    }>>;
+    containerRef: React.RefObject<HTMLTableElement | null>;
+    handleKeyDown: (e: React.KeyboardEvent) => void;
+};

package/dist/components/data-display/DataGrid/useDataGridKeyboard.js

@@ -0,0 +1,56 @@
+"use client";
+import { useRef as e, useState as t } from "react";
+//#region src/components/data-display/DataGrid/useDataGridKeyboard.ts
+function n(n, r, i) {
+	let [a, o] = t({
+		row: -1,
+		col: i ? -1 : 0
+	}), s = e(null);
+	return {
+		focusedCell: a,
+		setFocusedCell: o,
+		containerRef: s,
+		handleKeyDown: (e) => {
+			let { row: t, col: c } = a, l = t, u = c, d = i ? -1 : 0, f = n.length - 1, p = r.length - 1;
+			switch (e.key) {
+				case "ArrowRight":
+					c < f && u++;
+					break;
+				case "ArrowLeft":
+					c > d && u--;
+					break;
+				case "ArrowDown":
+					t < p && l++;
+					break;
+				case "ArrowUp":
+					t > -1 && l--;
+					break;
+				case "Home":
+					e.ctrlKey && (l = -1), u = d;
+					break;
+				case "End":
+					e.ctrlKey && (l = p), u = f;
+					break;
+				case "Enter":
+				case " ": {
+					let t = document.activeElement;
+					if (t?.getAttribute("role") === "columnheader") return;
+					if (t?.tagName === "TD" || t?.tagName === "TH" || t?.getAttribute("role") === "gridcell") {
+						let n = t.querySelector("input, button, [role=\"button\"]");
+						n && (n.click(), e.preventDefault());
+					}
+					return;
+				}
+				default: return;
+			}
+			(l !== t || u !== c) && (e.preventDefault(), o({
+				row: l,
+				col: u
+			}), setTimeout(() => {
+				(s.current?.querySelector(`[data-row="${l}"][data-col="${u}"]`))?.focus();
+			}, 0));
+		}
+	};
+}
+//#endregion
+export { n as useDataGridKeyboard };

package/dist/components/data-display/DataGrid/useFixedColumns.cjs

@@ -0,0 +1,2 @@
+"use client";
+let e=require("react");function t(e){return typeof e==`number`?e:typeof e==`string`&&e.endsWith(`px`)?parseInt(e,10):0}function n(n,r){return(0,e.useMemo)(()=>{let e={},i=r?60:0,a=100,o=n.filter(e=>e.fixed===`left`);o.forEach((n,r)=>{e[n.key]={offset:i===0?0:`${i}px`,zIndex:a--,isLast:r===o.length-1},i+=t(n.width)});let s={},c=0,l=100,u=n.filter(e=>e.fixed===`right`);return u.reverse().forEach((e,n)=>{s[e.key]={offset:c===0?0:`${c}px`,zIndex:l--,isFirst:n===u.length-1},c+=t(e.width)}),{fixedLeftOffsets:e,fixedRightOffsets:s}},[n,r])}exports.useFixedColumns=n;

package/dist/components/data-display/DataGrid/useFixedColumns.d.ts

@@ -0,0 +1,9 @@
+import { DataGridColumn } from './DataGrid';
+export type FixedColumnInfo = {
+    offset: number | string;
+    zIndex: number;
+};
+export declare function useFixedColumns<T>(columns: DataGridColumn<T>[], selection: boolean): {
+    fixedLeftOffsets: Record<string, FixedColumnInfo>;
+    fixedRightOffsets: Record<string, FixedColumnInfo>;
+};

package/dist/components/data-display/DataGrid/useFixedColumns.js

@@ -0,0 +1,31 @@
+"use client";
+import { useMemo as e } from "react";
+//#region src/components/data-display/DataGrid/useFixedColumns.ts
+function t(e) {
+	return typeof e == "number" ? e : typeof e == "string" && e.endsWith("px") ? parseInt(e, 10) : 0;
+}
+function n(n, r) {
+	return e(() => {
+		let e = {}, i = r ? 60 : 0, a = 100, o = n.filter((e) => e.fixed === "left");
+		o.forEach((n, r) => {
+			e[n.key] = {
+				offset: i === 0 ? 0 : `${i}px`,
+				zIndex: a--,
+				isLast: r === o.length - 1
+			}, i += t(n.width);
+		});
+		let s = {}, c = 0, l = 100, u = n.filter((e) => e.fixed === "right");
+		return u.reverse().forEach((e, n) => {
+			s[e.key] = {
+				offset: c === 0 ? 0 : `${c}px`,
+				zIndex: l--,
+				isFirst: n === u.length - 1
+			}, c += t(e.width);
+		}), {
+			fixedLeftOffsets: e,
+			fixedRightOffsets: s
+		};
+	}, [n, r]);
+}
+//#endregion
+export { n as useFixedColumns };

package/dist/components/data-display/DataGrid/useInfiniteScroll.cjs

@@ -0,0 +1,2 @@
+"use client";
+let e=require("react");function t(t){let n=(0,e.useRef)(null);return(0,e.useEffect)(()=>{if(!t||!t.hasMore)return;let e=new IntersectionObserver(e=>{e[0].isIntersecting&&t.onLoadMore()},{threshold:t.threshold||.1});return n.current&&e.observe(n.current),()=>e.disconnect()},[t]),{loaderRef:n}}exports.useInfiniteScroll=t;

package/dist/components/data-display/DataGrid/useInfiniteScroll.d.ts

@@ -0,0 +1,4 @@
+import { DataGridProps } from './DataGrid';
+export declare function useInfiniteScroll(infiniteScroll: DataGridProps<Record<string, unknown>>["infiniteScroll"]): {
+    loaderRef: import('react').RefObject<HTMLDivElement | null>;
+};

package/dist/components/data-display/DataGrid/useInfiniteScroll.js

@@ -0,0 +1,15 @@
+"use client";
+import { useEffect as e, useRef as t } from "react";
+//#region src/components/data-display/DataGrid/useInfiniteScroll.ts
+function n(n) {
+	let r = t(null);
+	return e(() => {
+		if (!n || !n.hasMore) return;
+		let e = new IntersectionObserver((e) => {
+			e[0].isIntersecting && n.onLoadMore();
+		}, { threshold: n.threshold || .1 });
+		return r.current && e.observe(r.current), () => e.disconnect();
+	}, [n]), { loaderRef: r };
+}
+//#endregion
+export { n as useInfiniteScroll };

package/dist/components/data-display/DescriptionList/DescriptionList.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("./description-list.module.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("classnames");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a=({children:e,className:n,layout:a=`horizontal`,size:o=`md`,border:s=!1,bordered:c=!1,...l})=>{let u=s||c;return(0,i.jsx)(`dl`,{className:(0,r.default)(`wim-description-list`,t.default.root,t.default[a],t.default[o],u&&t.default.border,n),...l,children:e})},o=({children:e,className:n,...a})=>(0,i.jsx)(`div`,{className:(0,r.default)(t.default.item,n),...a,children:e}),s=({children:e,className:n,...a})=>(0,i.jsx)(`dt`,{className:(0,r.default)(t.default.term,n),...a,children:e}),c=({children:e,className:n,...a})=>(0,i.jsx)(`dd`,{className:(0,r.default)(t.default.details,n),...a,children:e});exports.DescriptionList=a,exports.DescriptionListDetails=c,exports.DescriptionListItem=o,exports.DescriptionListTerm=s;

package/dist/components/data-display/DescriptionList/DescriptionList.d.ts

@@ -0,0 +1,35 @@
+import { default as React } from 'react';
+import { ComponentSizeBasic } from '../../../types/tokens';
+type DescriptionListProps = {
+    /** DescriptionListItem elements */
+    children: React.ReactNode;
+    /** Additional class names */
+    className?: string;
+    /** Layout of terms and descriptions */
+    layout?: "horizontal" | "vertical" | "compact";
+    /** Size of the text */
+    size?: ComponentSizeBasic;
+    /** Whether to show borders (alias of bordered) */
+    border?: boolean;
+    /** Whether to show borders */
+    bordered?: boolean;
+};
+export declare const DescriptionList: ({ children, className, layout, size, border, bordered, ...props }: DescriptionListProps) => React.JSX.Element;
+type DescriptionListItemProps = {
+    /** A DescriptionListTerm and its DescriptionListDetails */
+    children: React.ReactNode;
+    /** Additional class names */
+    className?: string;
+};
+export declare const DescriptionListItem: ({ children, className, ...props }: DescriptionListItemProps) => React.JSX.Element;
+type DescriptionListTermProps = {
+    children: React.ReactNode;
+    className?: string;
+};
+export declare const DescriptionListTerm: ({ children, className, ...props }: DescriptionListTermProps) => React.JSX.Element;
+type DescriptionListDetailsProps = {
+    children: React.ReactNode;
+    className?: string;
+};
+export declare const DescriptionListDetails: ({ children, className, ...props }: DescriptionListDetailsProps) => React.JSX.Element;
+export {};

package/dist/components/data-display/DescriptionList/DescriptionList.js

@@ -0,0 +1,28 @@
+"use client";
+import e from "./description-list.module.js";
+import "react";
+import t from "classnames";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/data-display/DescriptionList/DescriptionList.tsx
+var r = ({ children: r, className: i, layout: a = "horizontal", size: o = "md", border: s = !1, bordered: c = !1, ...l }) => {
+	let u = s || c;
+	return /* @__PURE__ */ n("dl", {
+		className: t("wim-description-list", e.root, e[a], e[o], u && e.border, i),
+		...l,
+		children: r
+	});
+}, i = ({ children: r, className: i, ...a }) => /* @__PURE__ */ n("div", {
+	className: t(e.item, i),
+	...a,
+	children: r
+}), a = ({ children: r, className: i, ...a }) => /* @__PURE__ */ n("dt", {
+	className: t(e.term, i),
+	...a,
+	children: r
+}), o = ({ children: r, className: i, ...a }) => /* @__PURE__ */ n("dd", {
+	className: t(e.details, i),
+	...a,
+	children: r
+});
+//#endregion
+export { r as DescriptionList, o as DescriptionListDetails, i as DescriptionListItem, a as DescriptionListTerm };

package/dist/components/data-display/DescriptionList/description-list.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_rds6b_3`,t=`_border_rds6b_11`,n=`_item_rds6b_16`,r=`_horizontal_rds6b_22`,i=`_term_rds6b_22`,a=`_vertical_rds6b_32`,o=`_compact_rds6b_39`,s=`_sm_rds6b_52`,c=`_md_rds6b_55`,l=`_lg_rds6b_58`,u=`_details_rds6b_77`,d={root:e,border:t,item:n,horizontal:r,term:i,vertical:a,compact:o,sm:s,md:c,lg:l,details:u};exports.border=t,exports.compact=o,exports.default=d,exports.details=u,exports.horizontal=r,exports.item=n,exports.lg=l,exports.md=c,exports.root=e,exports.sm=s,exports.term=i,exports.vertical=a;

package/dist/components/data-display/DescriptionList/description-list.module.js

@@ -0,0 +1,17 @@
+"use client";
+//#region src/components/data-display/DescriptionList/description-list.module.scss
+var e = "_root_rds6b_3", t = "_border_rds6b_11", n = "_item_rds6b_16", r = "_horizontal_rds6b_22", i = "_term_rds6b_22", a = "_vertical_rds6b_32", o = "_compact_rds6b_39", s = "_sm_rds6b_52", c = "_md_rds6b_55", l = "_lg_rds6b_58", u = "_details_rds6b_77", d = {
+	root: e,
+	border: t,
+	item: n,
+	horizontal: r,
+	term: i,
+	vertical: a,
+	compact: o,
+	sm: s,
+	md: c,
+	lg: l,
+	details: u
+};
+//#endregion
+export { t as border, o as compact, d as default, u as details, r as horizontal, n as item, l as lg, c as md, e as root, s as sm, i as term, a as vertical };

package/dist/components/data-display/EmptyState/EmptyState.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../_internal/StatusContent.cjs"),n=require("./empty-state.module.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("classnames");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=({title:e,description:r,icon:o,extra:s,variant:c=`default`,className:l,...u})=>(0,a.jsx)(t.StatusContent,{title:e,description:r,icon:o,actions:s,className:(0,i.default)(`wim-empty-state`,n.default.root,n.default[c],l),...u});exports.EmptyState=o;

package/dist/components/data-display/EmptyState/EmptyState.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+type EmptyStateProps = React.ComponentPropsWithoutRef<"div"> & {
+    /** Title to display. */
+    title: React.ReactNode;
+    /** Description text to display. */
+    description?: React.ReactNode;
+    /** Icon to display. */
+    icon?: React.ReactNode;
+    /** Element shown as an action (e.g. a button). */
+    extra?: React.ReactNode;
+    /** Design variant. */
+    variant?: "default" | "simple";
+};
+/**
+ * Placeholder component shown when there is no data or no search results.
+ */
+export declare const EmptyState: ({ title, description, icon, extra, variant, className, ...props }: EmptyStateProps) => React.JSX.Element;
+export {};

package/dist/components/data-display/EmptyState/EmptyState.js

@@ -0,0 +1,17 @@
+"use client";
+import { StatusContent as e } from "../../_internal/StatusContent.js";
+import t from "./empty-state.module.js";
+import "react";
+import n from "classnames";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/data-display/EmptyState/EmptyState.tsx
+var i = ({ title: i, description: a, icon: o, extra: s, variant: c = "default", className: l, ...u }) => /* @__PURE__ */ r(e, {
+	title: i,
+	description: a,
+	icon: o,
+	actions: s,
+	className: n("wim-empty-state", t.root, t[c], l),
+	...u
+});
+//#endregion
+export { i as EmptyState };

package/dist/components/data-display/EmptyState/empty-state.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e={};exports.default=e;

package/dist/components/data-display/EmptyState/empty-state.module.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/data-display/EmptyState/empty-state.module.scss
+var e = {};
+//#endregion
+export { e as default };

package/dist/components/data-display/FAQSection/FAQSection.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../typography/Text/Text.cjs"),n=require("../Accordion/Accordion.cjs"),r=require("../../typography/Title/Title.cjs"),i=require("./faq-section.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=({items:e,title:a,description:c,layout:l=`top`,accordionProps:u,className:d})=>{let f=!!(a||c);return(0,s.jsxs)(`section`,{className:(0,o.default)(`wim-faq-section`,i.default.root,i.default[`layout-${l}`],d),children:[f&&(0,s.jsxs)(`div`,{className:i.default.header,children:[a&&(0,s.jsx)(r.Title,{tag:`h2`,size:`xl`,className:i.default.title,children:a}),c&&(0,s.jsx)(t.Text,{content:c,color:`text-secondary`,className:i.default.description})]}),(0,s.jsx)(`div`,{className:i.default.content,children:(0,s.jsx)(n.Accordion,{type:`multiple`,collapsible:!0,...u,className:(0,o.default)(i.default.accordion,u?.className),children:e.map((e,t)=>(0,s.jsxs)(n.Accordion.Item,{value:`faq-item-${t}`,children:[(0,s.jsx)(n.Accordion.Trigger,{children:e.question}),(0,s.jsx)(n.Accordion.Content,{children:e.answer})]},t))})})]})};exports.FAQSection=c;

package/dist/components/data-display/FAQSection/FAQSection.d.ts

@@ -0,0 +1,31 @@
+import { default as React } from 'react';
+import { AccordionProps } from '../../data-display/Accordion/Accordion';
+export interface FAQItem {
+    /** Question. */
+    question: React.ReactNode;
+    /** Answer. */
+    answer: React.ReactNode;
+}
+export interface FAQSectionProps {
+    /** FAQ items. */
+    items: FAQItem[];
+    /** Main title of the section. */
+    title?: React.ReactNode;
+    /** Supplementary description shown below the title. */
+    description?: React.ReactNode;
+    /**
+     * Layout.
+     * - top: title and description above the accordion.
+     * - left: title and description on the left, accordion on the right (desktop and up).
+     */
+    layout?: "top" | "left";
+    /** Props passed to the inner Accordion component. */
+    accordionProps?: Omit<AccordionProps, "children">;
+    /** Additional class names. */
+    className?: string;
+}
+/**
+ * Section component for displaying frequently asked questions (FAQ).
+ * Built on top of the existing Accordion component.
+ */
+export declare const FAQSection: ({ items, title, description, layout, accordionProps, className, }: FAQSectionProps) => React.JSX.Element;