@caspeco/casper-ui-library 10.3.1 → 10.5.0

package/dist/components/table/table-context-provider.js

@@ -1,152 +1,204 @@
-import { jsx as me } from "react/jsx-runtime";
-import { useControllableState as d } from "@chakra-ui/react";
-import { useReactTable as Ce } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
-import { useState as b, useCallback as n, useEffect as be } from "react";
-import { arrayMove as L } from "./helper.js";
-import { TableContext as we } from "./table-context.js";
-import { getFilteredRowModel as he, getSortedRowModel as Re, getExpandedRowModel as ve, getCoreRowModel as Me } from "../../node_modules/@tanstack/table-core/build/lib/index.js";
-const Fe = ({
-  data: w,
-  totalDataCount: k,
-  columns: h,
-  children: q,
-  expandedState: z,
-  localeString: A,
-  initialExpandedState: R = {},
-  initialBreakingContentState: v = {},
-  initialColumnVisibilityState: B = {},
-  columnVisibilityState: G,
-  onColumnVisibilityChange: I,
-  onExpandedChange: M,
-  getRowId: S,
-  getRowActions: J,
-  onBreakingContentChange: K,
-  id: N,
-  customRowIndication: g,
-  onSortingChange: p,
-  initialSortingState: Q = [],
-  sortingState: x,
-  selectionState: U,
-  initialSelectionState: W = [],
-  onSelectionChange: y,
-  selectionActions: P,
-  disableSelectionCheckbox: u,
-  enableColumnReorder: V = !1,
-  columnOrderState: X,
-  initialColumnOrder: E,
-  onColumnOrderChange: Y
-}) => {
-  const [r, c] = d({
-    value: z,
-    onChange: M,
-    defaultValue: R
-  }), [a, F] = d({
-    value: G,
-    onChange: I,
-    defaultValue: B
-  }), [T, O] = d({
-    value: x,
-    onChange: p,
-    defaultValue: Q
-  }), [Z, $] = d({
-    value: U,
-    onChange: y,
-    defaultValue: W
-  }), [f, s] = d({
-    value: X,
-    onChange: Y,
-    defaultValue: E?.length ? E : h.map((e) => e.id).filter((e) => e !== void 0)
-  }), [_, ee] = b(v || {}), [H, m] = b({}), [j, D] = b(null), te = n((e) => (D(e), () => {
-    D(null);
-  }), []), oe = n(() => j, [j]);
-  be(() => {
-    g && m(g);
-  }, [g, m]);
-  const ne = n((e) => {
-    let t;
-    typeof e == "function" ? t = e(a) : t = e, F(t);
-  }, [a, F]), le = n((e) => {
-    let t;
-    typeof e == "function" ? t = e(r) : t = e, c(t);
-  }, [r, c]), ie = n((e) => {
-    O(e);
-  }, [O]), se = n((e) => {
-    const t = typeof e == "function" ? e(f) : e;
-    s(t);
-  }, [f, s]), o = Ce({
-    columns: h,
-    data: w,
-    getCoreRowModel: Me(),
-    getExpandedRowModel: ve(),
-    getSortedRowModel: Re(),
-    getFilteredRowModel: he(),
-    onColumnVisibilityChange: ne,
-    onExpandedChange: le,
-    onColumnOrderChange: se,
-    getSubRows: (e) => e.subRows,
-    getRowId: S,
-    enableSubRowSelection: !0,
-    enableMultiRowSelection: !1,
-    enableRowSelection: !0,
-    state: {
-      sorting: T,
-      columnVisibility: a,
-      expanded: r,
-      rowSelection: H,
-      columnOrder: V ? f : void 0
-    },
-    manualSorting: x !== void 0
-  }), de = n((e, t) => {
-    if (e === t) return;
-    const fe = o.getColumn(e).getIsPinned(), ge = o.getColumn(t).getIsPinned();
-    if (fe === "left" || ge === "left") {
-      const i = o.getAllLeafColumns().filter((l) => l.getIsVisible()), C = i.map((l) => l.id), ue = L(C, C.indexOf(e), C.indexOf(t)), ce = i.filter((l) => l.getIsPinned() === "left").length;
-      o.setColumnPinning((l) => ({
-        ...l,
-        left: ue.slice(0, ce)
-      }));
-    }
-    s((i) => L(i, i.indexOf(e), i.indexOf(t)));
-  }, [s, o]), re = n(() => o.getRowModel().flatRows.filter((e) => !u?.(e)).map((e) => e.id), [u, o]), ae = {
-    data: w,
-    totalDataCount: k,
-    table: o,
-    initialExpandedState: R,
-    initialBreakingContentState: v,
-    localeString: A,
-    onExpandedChange: M,
-    expanded: r,
-    sorting: T,
-    setSorting: ie,
-    setExpanded: c,
-    getRowId: S,
-    getRowActions: J,
-    breakingContentState: _,
-    setBreakingContentState: ee,
-    onBreakingContentChange: K,
-    id: N,
-    setRowHighlight: m,
-    rowHighlight: H,
-    columnVisibility: a,
-    onSortingChange: p,
-    registerTableFilter: te,
-    getTableFilterMethods: oe,
-    canSelectRows: y !== void 0 || P !== void 0,
-    setSelectedRowIds: $,
-    selectedRowIds: Z,
-    selectionActions: P,
-    disableSelectionCheckbox: u,
-    getSelectableRowIds: re,
-    enableColumnReorder: V,
-    columnOrder: f,
-    setColumnOrder: s,
-    handleDragEnd: de
-  };
-  return (
-    // This is correct but there's no easy way to type the context statically with generics
-    /* @__PURE__ */ me(we.Provider, { value: ae, children: q })
-  );
-};
-export {
-  Fe as TableProvider
+"use no memo";
+import { getCoreRowModel as e, getExpandedRowModel as t, getFilteredRowModel as n, getSortedRowModel as r } from "../../node_modules/@tanstack/table-core/build/lib/index.js";
+import { useReactTable as i } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
+import { arrayMove as ee, getColumnSizeCssVarName as a, getColumnStartCssVarName as te } from "./helper.js";
+import { TableColumnResizeInfoContext as ne, TableColumnSizeVarsContext as re, TableContext as ie } from "./table-context.js";
+import { useCallback as o, useEffect as ae, useMemo as s, useState as c } from "react";
+import { useControllableState as l } from "@chakra-ui/react";
+import { jsx as u } from "react/jsx-runtime";
+//#region lib/components/table/table-context-provider.tsx
+var oe = {}, se = {}, d = ({ data: d, totalDataCount: f, columns: p, children: ce, expandedState: le, localeString: m, initialExpandedState: h = oe, initialBreakingContentState: g = se, initialColumnVisibilityState: ue = {}, columnVisibilityState: de, onColumnVisibilityChange: fe, onExpandedChange: _, getRowId: v, getRowActions: pe, onBreakingContentChange: y, id: b, customRowIndication: x, onSortingChange: S, initialSortingState: me = [], sortingState: C, selectionState: he, initialSelectionState: ge = [], onSelectionChange: w, selectionActions: T, disableSelectionCheckbox: E, enableColumnReorder: D = !1, columnOrderState: _e, initialColumnOrder: O, onColumnOrderChange: ve, enableColumnResizing: k = !1, initialColumnSizingState: ye, onColumnSizingChange: A }) => {
+	let [j, M] = l({
+		value: le,
+		onChange: _,
+		defaultValue: h
+	}), [N, P] = l({
+		value: de,
+		onChange: fe,
+		defaultValue: ue
+	}), [F, I] = l({
+		value: C,
+		onChange: S,
+		defaultValue: me
+	}), [be, L] = l({
+		value: he,
+		onChange: w,
+		defaultValue: ge
+	}), [R, z] = l({
+		value: _e,
+		onChange: ve,
+		defaultValue: O?.length ? O : p.map((e) => e.id).filter((e) => e !== void 0)
+	}), [B, xe] = c(ye ?? {}), [V, Se] = c({
+		startOffset: null,
+		startSize: null,
+		deltaOffset: null,
+		deltaPercentage: null,
+		isResizingColumn: !1,
+		columnSizingStart: []
+	}), [H, U] = c(g || {}), [W, G] = c({}), [K, q] = c(null), J = o((e) => (q(e), () => {
+		q(null);
+	}), []), Y = o(() => K, [K]);
+	ae(() => {
+		x && G(x);
+	}, [x, G]);
+	let Ce = o((e) => {
+		let t;
+		t = typeof e == "function" ? e(N) : e, P(t);
+	}, [N, P]), we = o((e) => {
+		let t;
+		t = typeof e == "function" ? e(j) : e, M(t);
+	}, [j, M]), X = o((e) => {
+		I(e);
+	}, [I]), Te = o((e) => {
+		let t = typeof e == "function" ? e(R) : e;
+		z(t);
+	}, [R, z]), Ee = o((e) => {
+		let t = typeof e == "function" ? e(V) : e;
+		Se(t);
+	}, [V]), De = o((e) => {
+		let t = typeof e == "function" ? e(B) : e;
+		xe(t), A?.(t);
+	}, [B, A]), Z = i({
+		columns: p,
+		data: d,
+		getCoreRowModel: e(),
+		getExpandedRowModel: t(),
+		getSortedRowModel: r(),
+		getFilteredRowModel: n(),
+		onColumnVisibilityChange: Ce,
+		onExpandedChange: we,
+		onColumnOrderChange: Te,
+		onColumnSizingChange: De,
+		onColumnSizingInfoChange: Ee,
+		enableColumnResizing: k,
+		columnResizeMode: "onEnd",
+		defaultColumn: k ? { minSize: 80 } : void 0,
+		getSubRows: (e) => e.subRows,
+		getRowId: v,
+		enableSubRowSelection: !0,
+		enableMultiRowSelection: !1,
+		enableRowSelection: !0,
+		state: {
+			sorting: F,
+			columnVisibility: N,
+			expanded: j,
+			rowSelection: W,
+			columnOrder: D ? R : void 0,
+			columnSizing: B,
+			columnSizingInfo: V
+		},
+		manualSorting: C !== void 0
+	}), Q = Z.getState().columnPinning, $ = V.isResizingColumn, Oe = s(() => {
+		if (!k) return;
+		let e = {};
+		for (let t of Z.getVisibleLeafColumns()) e[a(t.id)] = `${t.getSize()}px`, t.getIsPinned() === "left" && (e[te(t.id)] = `${t.getStart("left")}px`);
+		return e;
+	}, [
+		k,
+		Z,
+		B,
+		Q
+	]), ke = s(() => k ? {
+		isResizingColumn: $,
+		deltaOffset: V.deltaOffset ?? 0
+	} : void 0, [
+		k,
+		$,
+		V.deltaOffset
+	]), Ae = o((e, t) => {
+		if (e === t) return;
+		let n = Z.getColumn(e).getIsPinned(), r = Z.getColumn(t).getIsPinned();
+		if (n === "left" || r === "left") {
+			let n = Z.getAllLeafColumns().filter((e) => e.getIsVisible()), r = n.map((e) => e.id), i = ee(r, r.indexOf(e), r.indexOf(t)), a = n.filter((e) => e.getIsPinned() === "left").length;
+			Z.setColumnPinning((e) => ({
+				...e,
+				left: i.slice(0, a)
+			}));
+		}
+		z((n) => ee(n, n.indexOf(e), n.indexOf(t)));
+	}, [z, Z]), je = o(() => Z.getRowModel().flatRows.filter((e) => !E?.(e)).map((e) => e.id), [E, Z]), Me = w !== void 0 || T !== void 0, Ne = s(() => ({
+		data: d,
+		totalDataCount: f,
+		table: Z,
+		initialExpandedState: h,
+		initialBreakingContentState: g,
+		localeString: m,
+		onExpandedChange: _,
+		expanded: j,
+		sorting: F,
+		setSorting: X,
+		setExpanded: M,
+		getRowId: v,
+		getRowActions: pe,
+		breakingContentState: H,
+		setBreakingContentState: U,
+		onBreakingContentChange: y,
+		id: b,
+		setRowHighlight: G,
+		rowHighlight: W,
+		columnVisibility: N,
+		onSortingChange: S,
+		registerTableFilter: J,
+		getTableFilterMethods: Y,
+		canSelectRows: Me,
+		setSelectedRowIds: L,
+		selectedRowIds: be,
+		selectionActions: T,
+		disableSelectionCheckbox: E,
+		getSelectableRowIds: je,
+		enableColumnReorder: D,
+		columnOrder: R,
+		setColumnOrder: z,
+		handleDragEnd: Ae,
+		enableColumnResizing: k,
+		columnPinning: Q
+	}), [
+		d,
+		f,
+		Z,
+		h,
+		g,
+		m,
+		_,
+		j,
+		F,
+		X,
+		M,
+		v,
+		pe,
+		H,
+		U,
+		y,
+		b,
+		G,
+		W,
+		N,
+		S,
+		J,
+		Y,
+		Me,
+		L,
+		be,
+		T,
+		E,
+		je,
+		D,
+		R,
+		z,
+		Ae,
+		k,
+		Q
+	]);
+	return /* @__PURE__ */ u(ie.Provider, {
+		value: Ne,
+		children: /* @__PURE__ */ u(re.Provider, {
+			value: Oe,
+			children: /* @__PURE__ */ u(ne.Provider, {
+				value: ke,
+				children: ce
+			})
+		})
+	});
 };
+//#endregion
+export { d as TableProvider };

package/dist/components/table/table-context.d.ts

@@ -2,4 +2,28 @@ import { TableContextInterface } from './table-context-provider.js';
 import { TableData } from './types.js';
 export declare const TableContext: import('react').Context<TableContextInterface<object> | null>;
 export declare function useTableContext<TData extends TableData>(): TableContextInterface<TData>;
+/**
+ * Column widths as CSS variables, e.g. `{ "--col-name-size": "200px" }`.
+ *
+ * TableProvider fills this in each time a resize finishes. TableContent puts the variables on the
+ * `<table>` element, and every header and cell reads its own width from there.
+ *
+ * Kept out of {@link TableContext} on purpose: a width change then re-renders only the table root,
+ * and the cells resize through CSS. On a big table that saves redrawing every cell.
+ */
+export declare const TableColumnSizeVarsContext: import('react').Context<Record<string, string> | undefined>;
+export declare function useTableColumnSizeVars(): Record<string, string> | undefined;
+/**
+ * Holds the live drag state for the resize indicator (the moving line). It has its own context so that
+ * while you drag, only the indicator updates — the rows and table root don't re-render. `undefined` when
+ * resizing is turned off.
+ */
+export type TableColumnResizeInfo = {
+    /** The id of the column currently being resized, or "false" when no resize is in progress. */
+    isResizingColumn: string | false;
+    /** Horizontal drag offset in pixels from the column's original right edge. */
+    deltaOffset: number;
+};
+export declare const TableColumnResizeInfoContext: import('react').Context<TableColumnResizeInfo | undefined>;
+export declare function useTableColumnResizeInfo(): TableColumnResizeInfo | undefined;
 //# sourceMappingURL=table-context.d.ts.map

package/dist/components/table/table-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-context.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-context.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,eAAO,MAAM,YAAY,+DAA+D,CAAC;AAEzF,wBAAgB,eAAe,CAAC,KAAK,SAAS,SAAS,KAAK,qBAAqB,CAAC,KAAK,CAAC,CASvF"}
+{"version":3,"file":"table-context.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-context.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,eAAO,MAAM,YAAY,+DAA+D,CAAC;AAEzF,wBAAgB,eAAe,CAAC,KAAK,SAAS,SAAS,KAAK,qBAAqB,CAAC,KAAK,CAAC,CASvF;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,0BAA0B,6DAA+D,CAAC;AAEvG,wBAAgB,sBAAsB,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAE3E;AAED;;;;GAIG;AACH,MAAM,MAAM,qBAAqB,GAAG;IACnC,8FAA8F;IAC9F,gBAAgB,EAAE,MAAM,GAAG,KAAK,CAAC;IACjC,8EAA8E;IAC9E,WAAW,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,4BAA4B,4DAA8D,CAAC;AAExG,wBAAgB,wBAAwB,IAAI,qBAAqB,GAAG,SAAS,CAE5E"}

package/dist/components/table/table-context.js

@@ -1,12 +1,19 @@
-import { useContext as e, createContext as o } from "react";
-const n = o(null);
-function u() {
-  const t = e(n);
-  if (!t)
-    throw new Error("useTableContext must be used within a TableProvider");
-  return t;
+"use no memo";
+import { createContext as e, useContext as t } from "react";
+//#region lib/components/table/table-context.tsx
+var n = e(null);
+function r() {
+	let e = t(n);
+	if (!e) throw Error("useTableContext must be used within a TableProvider");
+	return e;
 }
-export {
-  n as TableContext,
-  u as useTableContext
-};
+var i = e(void 0);
+function a() {
+	return t(i);
+}
+var o = e(void 0);
+function s() {
+	return t(o);
+}
+//#endregion
+export { o as TableColumnResizeInfoContext, i as TableColumnSizeVarsContext, n as TableContext, s as useTableColumnResizeInfo, a as useTableColumnSizeVars, r as useTableContext };