@konstructio/ui 0.1.2-alpha.70 → 0.1.2-alpha.72

package/dist/components/VirtualizedTable/contexts/table.provider.js

@@ -1,151 +1,181 @@
-import { jsx as O } from "react/jsx-runtime";
-import { V as Le } from "../../../index-BKjcReYh.js";
-import { useQuery as Te } from "@tanstack/react-query";
-import { u as Ae, g as Fe, a as Me } from "../../../index-CSWGJT-v.js";
-import { useState as r, useMemo as m, useCallback as b, useEffect as N } from "react";
-import { cn as L } from "../../../utils/index.js";
-import { VirtualizedTableEvent as W } from "../events/index.js";
-import { TableContext as Pe } from "./table.context.js";
-import { C as je } from "../../../chevron-right-DvXGOiS_.js";
-import { DEFAULT_PAGE_SIZE as _e } from "../constants/pagination.js";
-const Re = ({
-  children: Z,
-  classNameExpandedCell: J,
-  classNameExpandedContent: Y,
-  classNameExpandedRow: k,
-  classNameExpandedHeader: D,
-  classNameActiveExpandedRow: ee,
-  classNameHoverRow: te,
-  columns: T = [],
-  data: G = [],
-  defaultExpanded: ne,
-  enableExpandedRow: i,
-  enableHoverRow: oe,
-  expandedState: Q,
-  id: s,
-  isPaginationEnabled: re,
-  queryOptions: se = {},
-  totalItems: B,
-  getRowId: f,
-  fetchData: l,
-  onExpandedChange: $,
-  renderExpandedRow: x,
-  keepExpandColumnVisible: a
+import { jsx as A } from "react/jsx-runtime";
+import { V as $e } from "../../../index-BKjcReYh.js";
+import { useQuery as qe } from "@tanstack/react-query";
+import { u as ze, g as Ne, a as ve } from "../../../index-CSWGJT-v.js";
+import { useState as o, useMemo as g, useCallback as c, useEffect as G } from "react";
+import { cn as _ } from "../../../utils/index.js";
+import { VirtualizedTableEvent as Q } from "../events/index.js";
+import { TableContext as Re } from "./table.context.js";
+import { C as We } from "../../../chevron-right-DvXGOiS_.js";
+import { DEFAULT_PAGE_SIZE as Ge } from "../constants/pagination.js";
+const et = ({
+  children: J,
+  classNameExpandedCell: Y,
+  classNameExpandedContent: ee,
+  classNameExpandedRow: te,
+  classNameExpandedHeader: ne,
+  classNameActiveExpandedRow: oe,
+  classNameHoverRow: re,
+  columns: K = [],
+  data: k = [],
+  defaultExpanded: se,
+  enableExpandedRow: d,
+  enableHoverRow: ae,
+  expandedState: B,
+  id: i,
+  isPaginationEnabled: ie,
+  queryOptions: le = {},
+  totalItems: D,
+  getRowId: h,
+  fetchData: u,
+  onExpandedChange: H,
+  renderExpandedRow: w,
+  keepExpandColumnVisible: l
 }) => {
-  const [H, R] = r([]), [ae, ie] = r(!!l), [A, U] = r(0), [C, le] = r(), [g, ce] = r(_e), [de, ue] = r(B), F = l ? de : B, me = m(
-    () => Math.ceil(F / g),
-    [F, g]
-  ), [I, fe] = r({}), M = Te({
+  const [U, V] = o([]), [ce, de] = o(!!u), [M, p] = o(0), [I, ue] = o(), [y, me] = o(Ge), [fe, ge] = o(D), P = u ? fe : D, he = g(
+    () => Math.ceil(P / y),
+    [P, y]
+  ), [O, pe] = o({}), [x, ye] = o({}), [F, Se] = o({}), [E, be] = o({}), $ = qe({
     queryKey: (() => {
-      const e = typeof s == "string" || typeof s == "number" ? [s] : s;
-      return re && e.push(A, g), C && e.push(C), Object.entries(I).forEach(([t, u]) => {
-        e.push(`${t}:${u.join(",")}`);
+      const e = typeof i == "string" || typeof i == "number" ? [i] : i;
+      return ie && e.push(M, y), I && e.push(I), Object.entries(O).forEach(([t, n]) => {
+        e.push(`${t}:${n.join(",")}`);
+      }), Object.entries(x).forEach(([t, n]) => {
+        n && e.push(`${t}:${n}`);
+      }), Object.entries(F).forEach(([t, n]) => {
+        n && e.push(`${t}:${n.from ?? ""}-${n.to ?? ""}`);
+      }), Object.entries(E).forEach(([t, n]) => {
+        n && e.push(`${t}:${n}`);
       }), e;
     })(),
     refetchOnMount: !1,
     refetchOnWindowFocus: !1,
-    initialData: G,
-    enabled: !!l,
-    queryFn: async () => l({
-      page: Math.max(A + 1, 1),
-      pageSize: g,
-      termOfSearch: C,
-      ...Object.keys(I).length > 0 ? I : {}
-    }).then(({ data: e, totalItemsCount: t }) => (ie(!1), t && ue(t), e)),
-    ...se
-  }), h = l ? M.data : G, ge = l ? M.isLoading : !1, P = l ? M.isFetching : !1, he = b((e) => {
-    le(e), U(0);
-  }, []), pe = b((e, t) => {
-    const u = e.toLowerCase().replace(/\s+/g, "_");
-    fe((q) => ({
-      ...q,
-      [u]: t
+    initialData: k,
+    enabled: !!u,
+    queryFn: async () => u({
+      page: Math.max(M + 1, 1),
+      pageSize: y,
+      termOfSearch: I,
+      ...Object.keys(O).length > 0 ? O : {},
+      ...Object.keys(x).length > 0 ? x : {},
+      ...Object.keys(F).length > 0 ? F : {},
+      ...Object.keys(E).length > 0 ? E : {}
+    }).then(({ data: e, totalItemsCount: t }) => (de(!1), t && ge(t), e)),
+    ...le
+  }), S = u ? $.data : k, Ce = u ? $.isLoading : !1, q = u ? $.isFetching : !1, we = c((e) => {
+    ue(e), p(0);
+  }, []), Ie = c((e, t) => {
+    const n = e.toLowerCase().replace(/\s+/g, "_");
+    pe((a) => ({
+      ...a,
+      [n]: t
     }));
-  }, []), ye = b((e) => U(e), []), be = b(
-    (e) => ce(e),
+  }, []), Oe = c((e, t) => {
+    const n = e.toLowerCase().replace(/\s+/g, "_");
+    ye((a) => ({
+      ...a,
+      [n]: t?.toISOString()
+    })), p(0);
+  }, []), xe = c(
+    (e, t) => {
+      const n = e.toLowerCase().replace(/\s+/g, "_");
+      Se((a) => ({
+        ...a,
+        [n]: t ? { from: t.from?.toISOString(), to: t.to?.toISOString() } : void 0
+      })), p(0);
+    },
+    []
+  ), Fe = c((e, t) => {
+    const n = e.toLowerCase().replace(/\s+/g, "_");
+    be((a) => ({
+      ...a,
+      [n]: t?.toISOString()
+    })), p(0);
+  }, []), Ee = c((e) => p(e), []), Le = c(
+    (e) => me(e),
     []
-  ), [xe, Ce] = r(
-    ne ?? {}
-  ), j = Q !== void 0, c = j ? Q : xe, p = b(
+  ), [je, Te] = o(
+    se ?? {}
+  ), z = B !== void 0, m = z ? B : je, b = c(
     (e) => {
-      const t = typeof e == "function" ? e(c) : e;
-      j || Ce(t), $?.(e);
+      const t = typeof e == "function" ? e(m) : e;
+      z || Te(t), H?.(e);
     },
-    [c, j, $]
+    [m, z, H]
   );
-  N(() => {
-    if (!i) return;
-    const e = Array.isArray(s) ? s.join(",") : String(s), t = new AbortController(), u = (y) => {
-      const { detail: n } = y;
-      n.tableId === e && p((o) => typeof o == "boolean" ? { [n.rowId]: !0 } : { ...o, [n.rowId]: !0 });
-    }, q = (y) => {
-      const { detail: n } = y;
-      n.tableId === e && p((o) => {
-        if (typeof o == "boolean") return {};
-        const E = { ...o };
-        return delete E[n.rowId], E;
+  G(() => {
+    if (!d) return;
+    const e = Array.isArray(i) ? i.join(",") : String(i), t = new AbortController(), n = (C) => {
+      const { detail: r } = C;
+      r.tableId === e && b((s) => typeof s == "boolean" ? { [r.rowId]: !0 } : { ...s, [r.rowId]: !0 });
+    }, a = (C) => {
+      const { detail: r } = C;
+      r.tableId === e && b((s) => {
+        if (typeof s == "boolean") return {};
+        const T = { ...s };
+        return delete T[r.rowId], T;
       });
-    }, Oe = (y) => {
-      const { detail: n } = y;
-      n.tableId === e && p((o) => {
-        if (typeof o == "boolean") return { [n.rowId]: !o };
-        const E = !!o[n.rowId], z = { ...o };
-        return E ? delete z[n.rowId] : z[n.rowId] = !0, z;
+    }, Pe = (C) => {
+      const { detail: r } = C;
+      r.tableId === e && b((s) => {
+        if (typeof s == "boolean") return { [r.rowId]: !s };
+        const T = !!s[r.rowId], W = { ...s };
+        return T ? delete W[r.rowId] : W[r.rowId] = !0, W;
       });
     };
-    return document.addEventListener(W.EXPAND_ROW, u, {
+    return document.addEventListener(Q.EXPAND_ROW, n, {
       signal: t.signal
     }), document.addEventListener(
-      W.COLLAPSE_ROW,
-      q,
+      Q.COLLAPSE_ROW,
+      a,
       { signal: t.signal }
-    ), document.addEventListener(W.TOGGLE_ROW, Oe, {
+    ), document.addEventListener(Q.TOGGLE_ROW, Pe, {
       signal: t.signal
     }), () => t.abort();
-  }, [i, s, p]);
-  const _ = m(
-    () => h.some((e) => !!e.meta?.expandedRow),
-    [h]
-  ), S = m(
-    () => P ? [] : h.map(
-      (e, t) => f ? f(e, t) : String(t)
+  }, [d, i, b]);
+  const N = g(
+    () => S.some((e) => !!e.meta?.expandedRow),
+    [S]
+  ), L = g(
+    () => q ? [] : S.map(
+      (e, t) => h ? h(e, t) : String(t)
     ),
-    [h, f, P]
-  ), Ie = m(() => typeof c == "boolean" ? c : S.some((e) => !!c[e]), [c, S]), Se = m(() => typeof a == "boolean" ? a : typeof a == "object" ? S.some((e) => !!a[e]) : !1, [a, S]), v = _ || x && (Ie || Se), [d, V] = r(!!v);
-  N(() => {
+    [S, h, q]
+  ), Ae = g(() => typeof m == "boolean" ? m : L.some((e) => !!m[e]), [m, L]), _e = g(() => typeof l == "boolean" ? l : typeof l == "object" ? L.some((e) => !!l[e]) : !1, [l, L]), v = N || w && (Ae || _e), [f, X] = o(!!v);
+  G(() => {
     if (v) {
-      const e = requestAnimationFrame(() => V(!0));
+      const e = requestAnimationFrame(() => X(!0));
       return () => cancelAnimationFrame(e);
     } else
-      V(!1);
+      X(!1);
   }, [v]);
-  const [w, X] = r(
-    !d
+  const [j, Z] = o(
+    !f
   );
-  N(() => {
-    if (d)
-      X(!1);
+  G(() => {
+    if (f)
+      Z(!1);
     else {
-      const e = setTimeout(() => X(!0), 300);
+      const e = setTimeout(() => Z(!0), 300);
       return () => clearTimeout(e);
     }
-  }, [d]);
-  const K = m(() => !i || !_ && !x ? null : {
+  }, [f]);
+  const R = g(() => !d || !N && !w ? null : {
     id: "__expand",
-    header: () => /* @__PURE__ */ O(Le, { children: "Expand Column" }),
+    header: () => /* @__PURE__ */ A($e, { children: "Expand Column" }),
     cell: ({ row: e }) => {
-      const { meta: t } = e.original, u = typeof a == "object" && !!a[e.id];
-      return !t?.expandedRow && !e.getIsExpanded() && !u ? null : /* @__PURE__ */ O(
+      const { meta: t } = e.original, n = typeof l == "object" && !!l[e.id];
+      return !t?.expandedRow && !e.getIsExpanded() && !n ? null : /* @__PURE__ */ A(
         "button",
         {
           type: "button",
           className: "hover:cursor-pointer",
           onClick: () => e.toggleExpanded(),
           "aria-label": e.getIsExpanded() ? "Collapse row" : "Expand row",
-          children: /* @__PURE__ */ O(
-            je,
+          children: /* @__PURE__ */ A(
+            We,
             {
-              className: L(
+              className: _(
                 "size-4 transition-transform text-slate-400 dark:text-metal-400",
                 {
                   "-rotate-90": e.getIsExpanded()
@@ -158,77 +188,83 @@ const Re = ({
     },
     enableSorting: !1,
     meta: {
-      headerClassName: L(
+      headerClassName: _(
         "transition-[width,max-width,padding] duration-300 ease-in-out overflow-hidden",
         // Width: immediate change, CSS transition handles animation
-        d ? "w-10 max-w-10 px-2" : "w-0 max-w-0 !p-0",
+        f ? "w-10 max-w-10 px-2" : "w-0 max-w-0 !p-0",
         // Border/radius: deferred on collapse so border stays during exit
-        w && "!border-0 !rounded-none [&+th]:rounded-tl-lg dark:[&+th]:border-l"
+        j && "!border-0 !rounded-none [&+th]:rounded-tl-lg dark:[&+th]:border-l"
       ),
-      className: L(
+      className: _(
         "transition-[width,max-width,padding] duration-300 ease-in-out overflow-hidden",
-        d ? L("w-10 max-w-10 px-1 text-center", D) : "w-0 max-w-0 !p-0",
-        w && "!border-0 dark:[&+td]:border-l"
+        f ? _("w-10 max-w-10 px-1 text-center", ne) : "w-0 max-w-0 !p-0",
+        j && "!border-0 dark:[&+td]:border-l"
       )
     }
   }, [
-    i,
-    _,
-    x,
     d,
+    N,
     w,
-    a
-  ]), we = m(() => K ? [K, ...T] : T, [T, K]), Ee = Ae({
-    data: h,
-    columns: we,
-    ...f ? { getRowId: f } : {},
+    f,
+    j,
+    l
+  ]), Ke = g(() => R ? [R, ...K] : K, [K, R]), Me = ze({
+    data: S,
+    columns: Ke,
+    ...h ? { getRowId: h } : {},
     state: {
-      sorting: H,
-      ...i ? { expanded: c } : {}
+      sorting: U,
+      ...d ? { expanded: m } : {}
     },
-    onSortingChange: R,
-    ...i ? {
-      onExpandedChange: p,
+    onSortingChange: V,
+    ...d ? {
+      onExpandedChange: b,
       manualExpanding: !0
     } : {},
-    getCoreRowModel: Me(),
-    getSortedRowModel: Fe()
+    getCoreRowModel: ve(),
+    getSortedRowModel: Ne()
   });
-  return /* @__PURE__ */ O(
-    Pe.Provider,
+  return /* @__PURE__ */ A(
+    Re.Provider,
     {
       value: {
-        classNameActiveExpandedRow: ee,
-        classNameExpandedCell: J,
-        classNameExpandedContent: Y,
-        classNameExpandedRow: k,
-        classNameHoverRow: te,
-        enableExpandedRow: i,
-        enableHoverRow: oe,
-        isBorderOnAdjacentCell: w,
-        isExpandColumnVisible: d,
-        isFirstLoad: ae,
-        multiselectSelected: I,
-        page: A,
-        pageSize: g,
-        sortedData: H,
-        table: Ee,
-        tableFetching: P,
-        tableLoading: ge,
-        termOfSearch: C,
-        totalItems: F,
-        totalPages: me,
-        handlePage: ye,
-        onChangeTermOfSearch: he,
-        onPageSize: be,
-        onSelectMultiselect: pe,
-        onSorting: R,
-        renderExpandedRow: x
+        classNameActiveExpandedRow: oe,
+        classNameExpandedCell: Y,
+        classNameExpandedContent: ee,
+        classNameExpandedRow: te,
+        classNameHoverRow: re,
+        enableExpandedRow: d,
+        enableHoverRow: ae,
+        isBorderOnAdjacentCell: j,
+        isExpandColumnVisible: f,
+        isFirstLoad: ce,
+        multiselectSelected: O,
+        dateFilters: x,
+        dateRangeFilters: F,
+        timeFilters: E,
+        page: M,
+        pageSize: y,
+        sortedData: U,
+        table: Me,
+        tableFetching: q,
+        tableLoading: Ce,
+        termOfSearch: I,
+        totalItems: P,
+        totalPages: he,
+        handlePage: Ee,
+        onChangeTermOfSearch: we,
+        onPageSize: Le,
+        onSelectMultiselect: Ie,
+        onSelectDateFilter: Oe,
+        onSelectDateRangeFilter: xe,
+        onSelectTimeFilter: Fe,
+        onSorting: V,
+        renderExpandedRow: w
       },
-      children: Z
+      children: J
     }
   );
 };
 export {
-  Re as TableProvider
+  et as TableProvider
 };

package/dist/components/index.d.ts

@@ -17,6 +17,7 @@ export * from './DropdownButton/DropdownButton';
 export * from './Filter/Filter';
 export * from './ImageUpload/ImageUpload';
 export * from './Input/Input';
+export * from './LineChart/LineChart';
 export * from './Loading/Loading';
 export * from './Modal/Modal';
 export * from './MultiSelectDropdown/MultiSelectDropdown';
@@ -46,7 +47,7 @@ export * from './Typography/Typography';
 export * from './VirtualizedTable/VirtualizedTable';
 export { sendExpandRowEvent, sendCollapseRowEvent, sendToggleRowEvent, VirtualizedTableEvent, } from './VirtualizedTable/events';
 export type { VirtualizedTableEventDetail } from './VirtualizedTable/events';
-export type { ColumnDef, RowData, } from './VirtualizedTable/VirtualizedTable.types';
+export type { ColumnDef, RowData, FilterConfig, ActionFilterConfig, BadgeMultiSelectFilterConfig, TextMultiSelectFilterConfig, DateFilterConfig, DateRangeFilterConfig, TimeFilterConfig, } from './VirtualizedTable/VirtualizedTable.types';
 export type { Step, StepperClassNames, StepperIcons, StepperProps, StepSize, StepStatus, StepVariant, } from './Stepper/Stepper.types';
 export { horizontalConnectorWrapperVariants, stepConnectorVariants, stepContentVariants, stepDescriptionVariants, stepIndicatorVariants, stepItemVariants, stepLabelVariants, stepListVariants, stepperVariants, stepVariants, } from './Stepper/Stepper.variants';
 export { Counter as NumberInput } from './Counter/Counter';