@konstructio/ui 0.1.2-alpha.98 → 0.1.3

package/dist/components/VirtualizedTable/components/TruncateText/TruncateText.js

@@ -1,43 +1,50 @@
-import { o as R } from "../../../../chunk-cI0lbGMq.js";
-import { t as i } from "../../../../utils-COaoD3PI.js";
-import { Typography as l } from "../../../Typography/Typography.js";
-import { t as _ } from "../../../../debounce-B55BpO1u.js";
-import { Tooltip as g } from "../../../Tooltip/Tooltip.js";
-import { useCallback as v, useEffect as a, useRef as z, useState as E } from "react";
-import { jsx as n } from "react/jsx-runtime";
-var L = /* @__PURE__ */ R(_(), 1), A = ({ getValue: u, value: m, textClassName: c, side: f = "bottom", sideOffset: p, bgClassName: d, arrowClassName: b, className: h, delayDuration: w = 0 }) => {
-  const o = z(null), [T, x] = E(!1), r = m ?? u().toLocaleLowerCase(), t = v(() => {
-    const e = o.current;
-    e && x(e.scrollWidth > e.clientWidth);
-  }, []);
-  return a(() => {
-    const e = new AbortController(), s = (0, L.default)(t, 300);
-    return window.addEventListener("resize", s, { signal: e.signal }), () => {
-      e.abort(), s.cancel();
+import { CopyButton as g } from "../../../CopyButton/CopyButton.js";
+import { Tooltip as j } from "../../../Tooltip/Tooltip.js";
+import { Typography as E } from "../../../Typography/Typography.js";
+import { t as L } from "../../../../utils-DnIJruo0.js";
+import { useEffect as W, useState as l } from "react";
+import { jsx as r, jsxs as z } from "react/jsx-runtime";
+var q = ({ getValue: a, value: m, textClassName: f, variant: u, component: p = "p", copyable: d = !1, copyButtonProps: h, side: x = "bottom", sideOffset: T, bgClassName: b, arrowClassName: v, className: w, delayDuration: y = 0 }) => {
+  const [e, C] = l(null), [n, N] = l(!1), t = m ?? a?.().toLocaleLowerCase() ?? "";
+  W(() => {
+    if (!e) return;
+    const c = () => {
+      N(e.scrollWidth > e.clientWidth);
     };
-  }, [t]), a(() => {
-    t();
-  }, [t]), T ? /* @__PURE__ */ n(g, {
-    content: r,
-    side: f,
-    sideOffset: p,
-    bgClassName: d,
-    arrowClassName: b,
-    className: h,
-    delayDuration: w,
-    children: /* @__PURE__ */ n(l, {
-      ref: o,
-      component: "p",
-      className: i("w-full truncate cursor-pointer", c),
-      children: r
-    })
-  }) : /* @__PURE__ */ n(l, {
-    ref: o,
-    component: "p",
-    className: i("w-full truncate", c),
-    children: r
-  });
+    c();
+    const i = new ResizeObserver(c);
+    return i.observe(e), () => {
+      i.disconnect();
+    };
+  }, [e, t]);
+  const o = /* @__PURE__ */ r(E, {
+    ref: C,
+    variant: u,
+    component: p,
+    className: L("w-full truncate", n && "cursor-pointer", f),
+    children: t
+  }), s = n ? /* @__PURE__ */ r(j, {
+    content: t,
+    side: x,
+    sideOffset: T,
+    bgClassName: b,
+    arrowClassName: v,
+    className: w,
+    delayDuration: y,
+    children: o
+  }) : o;
+  return d ? /* @__PURE__ */ z("div", {
+    className: "flex min-w-0 items-center gap-2",
+    children: [/* @__PURE__ */ r("span", {
+      className: "min-w-0 flex-1",
+      children: s
+    }), /* @__PURE__ */ r(g, {
+      text: t,
+      label: t,
+      ...h
+    })]
+  }) : s;
 };
 export {
-  A as TruncateText
+  q as TruncateText
 };

package/dist/components/VirtualizedTable/components/VirtualizedTableContent/VirtualizedTableContent.js

@@ -0,0 +1,91 @@
+import { t as p } from "../../../../utils-DnIJruo0.js";
+import { t as rr } from "../../../../table.provider-Dhs7WtwK.js";
+import { Body as er } from "../Body/Body.js";
+import { Filter as ar } from "../Filter/Filter.js";
+import { Header as tr } from "../Header/Header.js";
+import { Pagination as lr } from "../Pagination/Pagination.js";
+import { ScrollContainer as or } from "../ScrollContainer/ScrollContainer.js";
+import { WrapperBody as ir } from "../WrapperBody/WrapperBody.js";
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+var ur = ({ id: o, ariaLabel: d, columns: n, data: b, totalItems: h = -1 / 0, className: u, classNameHeaderActiveArrows: v, classNameHeaderArrows: N, classNameHeaderTable: k, classNameTable: x, classNameWrapperTable: y, isLoading: a, emptyState: A, errorState: B, headerContent: j, classNameHeaderContent: w, classNameScrollContainer: i, columnPinning: t, getRowId: C, fetchData: P, queryOptions: g, showPagination: z, showTotalItems: s, showDropdownPagination: m, showDotPagination: c, showFormPagination: f, pageSizes: E, dropdownPaginationDirection: H, showFilter: T = !1, showFilterInput: V, filterSearchPlaceholder: W = "", filters: q, multiSelectFilter: F, filterActions: G, showResetButton: I = !0, resetButtonClassName: J, closeOnApply: K = !0, enableHoverRow: M, classNameHoverRow: O, enableExpandedRow: Q, expandedState: R, defaultExpanded: S, classNameExpandedRow: U, classNameExpandedCell: X, classNameExpandedContent: Y, classNameExpandedHeader: Z, classNameActiveExpandedRow: _, onExpandedChange: $, renderExpandedRow: L, keepExpandColumnVisible: D }) => {
+  const e = z || [
+    s,
+    m,
+    c,
+    f
+  ].some(Boolean);
+  return /* @__PURE__ */ r(rr, {
+    id: o,
+    columns: n,
+    data: b,
+    headerContent: j,
+    getRowId: C,
+    fetchData: P,
+    totalItems: h,
+    queryOptions: g,
+    isPaginationEnabled: e,
+    enableExpandedRow: Q,
+    expandedState: R,
+    onExpandedChange: $,
+    defaultExpanded: S,
+    classNameExpandedRow: U,
+    classNameExpandedCell: X,
+    classNameExpandedContent: Y,
+    classNameExpandedHeader: Z,
+    classNameActiveExpandedRow: _,
+    enableHoverRow: M,
+    classNameHoverRow: O,
+    renderExpandedRow: L,
+    keepExpandColumnVisible: D,
+    columnPinning: t,
+    children: /* @__PURE__ */ l("section", {
+      className: p("kvt", "w-full min-w-fit", u),
+      children: [T && /* @__PURE__ */ r(ar, {
+        id: o,
+        actions: G,
+        filters: q,
+        multiSelectFilter: F,
+        placeholder: W,
+        showFilterInput: V,
+        showResetButton: I,
+        resetButtonClassName: J,
+        closeOnApply: K
+      }), /* @__PURE__ */ l(or, {
+        className: i,
+        hasPinnedColumns: !!t?.left?.length || !!t?.right?.length,
+        children: [/* @__PURE__ */ r(ir, {
+          showPagination: e,
+          classNameWrapperTable: y,
+          isLoading: a,
+          children: /* @__PURE__ */ l("table", {
+            className: p("kvt-table", "w-full border-collapse table-auto", "dark:border-separate dark:border-spacing-0", x),
+            "aria-label": d,
+            children: [/* @__PURE__ */ r(tr, {
+              className: k,
+              classNameArrows: N,
+              classNameActiveArrows: v,
+              classNameHeaderContent: w
+            }), /* @__PURE__ */ r(er, {
+              isLoading: a,
+              showPagination: e,
+              emptyState: A,
+              errorState: B
+            })]
+          })
+        }), e && /* @__PURE__ */ r(lr, {
+          showTotalItems: s,
+          showDropdownPagination: m,
+          showDotPagination: c,
+          showFormPagination: f,
+          pageSizes: E,
+          isLoading: a,
+          isListPortal: !!i,
+          dropdownPaginationDirection: H
+        })]
+      })]
+    })
+  });
+};
+export {
+  ur as VirtualizedTableContent
+};

package/dist/components/VirtualizedTable/components/WrapperBody/WrapperBody.js

@@ -1,13 +1,14 @@
-import { t as a } from "../../../../utils-COaoD3PI.js";
-import { useTableContext as n } from "../../contexts/table.hook.js";
-import { jsx as m } from "react/jsx-runtime";
-var p = ({ children: o, classNameWrapperTable: r, isLoading: e, showPagination: t }) => {
-  const { tableFetching: d } = n();
-  return /* @__PURE__ */ m("div", {
-    className: a("shadow rounded-t-lg overflow-hidden", { "rounded-lg": !t || d || e }, r),
+import { t as n } from "../../../../utils-DnIJruo0.js";
+import { useTableContext as d } from "../../contexts/table.hook.js";
+import { isPaginationBarVisible as m } from "../../utils/pagination.js";
+import { jsx as s } from "react/jsx-runtime";
+var u = ({ children: o, classNameWrapperTable: r, isLoading: t, showPagination: e }) => {
+  const { tableLoading: a, totalItems: i = -1 / 0 } = d();
+  return /* @__PURE__ */ s("div", {
+    className: n("kvt-wrapper", "shadow rounded-t-lg overflow-hidden", { "rounded-lg": !e || !m(i) || a || t }, r),
     children: o
   });
 };
 export {
-  p as WrapperBody
+  u as WrapperBody
 };

package/dist/components/VirtualizedTable/components/index.js

@@ -1,16 +1,24 @@
 import { Actions as o } from "./Actions/Actions.js";
-import { Body as t } from "./Body/Body.js";
-import { Filter as p } from "./Filter/Filter.js";
-import { Header as f } from "./Header/Header.js";
-import { Pagination as n } from "./Pagination/Pagination.js";
-import { TruncateText as c } from "./TruncateText/TruncateText.js";
-import { WrapperBody as y } from "./WrapperBody/WrapperBody.js";
+import { Body as m } from "./Body/Body.js";
+import { EmptyResults as p } from "./EmptyResults/EmptyResults.js";
+import { EmptyState as f } from "./EmptyState/EmptyState.js";
+import { ErrorState as n } from "./ErrorState/ErrorState.js";
+import { Filter as y } from "./Filter/Filter.js";
+import { Header as d } from "./Header/Header.js";
+import { Pagination as E } from "./Pagination/Pagination.js";
+import { ScrollContainer as u } from "./ScrollContainer/ScrollContainer.js";
+import { TruncateText as B } from "./TruncateText/TruncateText.js";
+import { WrapperBody as g } from "./WrapperBody/WrapperBody.js";
 export {
   o as Actions,
-  t as Body,
-  p as Filter,
-  f as Header,
-  n as Pagination,
-  c as TruncateText,
-  y as WrapperBody
+  m as Body,
+  p as EmptyResults,
+  f as EmptyState,
+  n as ErrorState,
+  y as Filter,
+  d as Header,
+  E as Pagination,
+  u as ScrollContainer,
+  B as TruncateText,
+  g as WrapperBody
 };

package/dist/components/VirtualizedTable/constants/index.js

@@ -1,5 +1,7 @@
-import { DEFAULT_PAGE_SIZE as A, DEFAULT_PAGE_SIZES as _ } from "./pagination.js";
+import { DEFAULT_PAGE_SIZE as _, DEFAULT_PAGE_SIZES as o } from "./pagination.js";
+import { HIDE_BELOW_CLASS as A } from "./responsive.js";
 export {
-  A as DEFAULT_PAGE_SIZE,
-  _ as DEFAULT_PAGE_SIZES
+  _ as DEFAULT_PAGE_SIZE,
+  o as DEFAULT_PAGE_SIZES,
+  A as HIDE_BELOW_CLASS
 };

package/dist/components/VirtualizedTable/constants/responsive.js

@@ -0,0 +1,10 @@
+var d = {
+  sm: "max-sm:hidden",
+  md: "max-md:hidden",
+  lg: "max-lg:hidden",
+  xl: "max-xl:hidden",
+  "2xl": "max-2xl:hidden"
+};
+export {
+  d as HIDE_BELOW_CLASS
+};

package/dist/components/VirtualizedTable/contexts/index.js

@@ -1,8 +1,8 @@
-import { t as r } from "../../../table.provider-BPlFpIAe.js";
-import { TableContext as e } from "./table.context.js";
-import { useTableContext as a } from "./table.hook.js";
+import { TableContext as r } from "./table.context.js";
+import { useTableContext as e } from "./table.hook.js";
+import { t as a } from "../../../table.provider-Dhs7WtwK.js";
 export {
-  e as TableContext,
-  r as TableProvider,
-  a as useTableContext
+  r as TableContext,
+  a as TableProvider,
+  e as useTableContext
 };

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

@@ -3,14 +3,20 @@ import { createContext as e } from "react";
 var r = e({
   sortedData: [],
   table: {},
+  tableId: "",
   tableFetching: !1,
   tableLoading: !1,
+  tableError: null,
   totalItems: -1 / 0,
   termOfSearch: "",
   page: 0,
   pageSize: 10,
   totalPages: 1 / 0,
   isFirstLoad: !0,
+  pinnedWidths: {},
+  getPinnedHeaderRef() {
+    throw new Error("getPinnedHeaderRef function is not implemented");
+  },
   onSorting() {
     throw new Error("onSorting function is not implemented");
   },

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

@@ -1,4 +1,4 @@
-import { t as o } from "../../../table.provider-BPlFpIAe.js";
+import { t as o } from "../../../table.provider-Dhs7WtwK.js";
 export {
   o as TableProvider
 };

package/dist/components/VirtualizedTable/events/filters/filters.js

@@ -0,0 +1,7 @@
+import { t } from "../../../../events.types-BG1Uh8i6.js";
+var E = (e) => {
+  document.dispatchEvent(new CustomEvent(t.RESET_FILTERS, { detail: { tableId: e } }));
+};
+export {
+  E as sendResetFiltersEvent
+};

package/dist/components/VirtualizedTable/events/index.js

@@ -1,27 +1,12 @@
-var n = /* @__PURE__ */ (function(t) {
-  return t.EXPAND_ROW = "@konstructio/VirtualizedTable/event-EXPAND_ROW", t.COLLAPSE_ROW = "@konstructio/VirtualizedTable/event-COLLAPSE_ROW", t.TOGGLE_ROW = "@konstructio/VirtualizedTable/event-TOGGLE_ROW", t.RESET_FILTERS = "@konstructio/VirtualizedTable/event-RESET_FILTERS", t;
-})({}), E = (t, e) => {
-  document.dispatchEvent(new CustomEvent(n.EXPAND_ROW, { detail: {
-    tableId: t,
-    rowId: e
-  } }));
-}, o = (t, e) => {
-  document.dispatchEvent(new CustomEvent(n.COLLAPSE_ROW, { detail: {
-    tableId: t,
-    rowId: e
-  } }));
-}, s = (t, e) => {
-  document.dispatchEvent(new CustomEvent(n.TOGGLE_ROW, { detail: {
-    tableId: t,
-    rowId: e
-  } }));
-}, R = (t) => {
-  document.dispatchEvent(new CustomEvent(n.RESET_FILTERS, { detail: { tableId: t } }));
-};
+import { t } from "../../../events.types-BG1Uh8i6.js";
+import { sendResetFiltersEvent as n } from "./filters/filters.js";
+import { sendRefreshEvent as s } from "./refresh/refresh.js";
+import { sendCollapseRowEvent as d, sendExpandRowEvent as i, sendToggleRowEvent as p } from "./row/row.js";
 export {
-  n as VirtualizedTableEvent,
-  o as sendCollapseRowEvent,
-  E as sendExpandRowEvent,
-  R as sendResetFiltersEvent,
-  s as sendToggleRowEvent
+  t as VirtualizedTableEvent,
+  d as sendCollapseRowEvent,
+  i as sendExpandRowEvent,
+  s as sendRefreshEvent,
+  n as sendResetFiltersEvent,
+  p as sendToggleRowEvent
 };

package/dist/components/VirtualizedTable/events/refresh/refresh.js

@@ -0,0 +1,7 @@
+import { t } from "../../../../events.types-BG1Uh8i6.js";
+var a = (e) => {
+  document.dispatchEvent(new CustomEvent(t.REFRESH, { detail: { tableId: e } }));
+};
+export {
+  a as sendRefreshEvent
+};

package/dist/components/VirtualizedTable/events/row/row.js

@@ -0,0 +1,22 @@
+import { t as n } from "../../../../events.types-BG1Uh8i6.js";
+var d = (e, t) => {
+  document.dispatchEvent(new CustomEvent(n.EXPAND_ROW, { detail: {
+    tableId: e,
+    rowId: t
+  } }));
+}, o = (e, t) => {
+  document.dispatchEvent(new CustomEvent(n.COLLAPSE_ROW, { detail: {
+    tableId: e,
+    rowId: t
+  } }));
+}, E = (e, t) => {
+  document.dispatchEvent(new CustomEvent(n.TOGGLE_ROW, { detail: {
+    tableId: e,
+    rowId: t
+  } }));
+};
+export {
+  o as sendCollapseRowEvent,
+  d as sendExpandRowEvent,
+  E as sendToggleRowEvent
+};

package/dist/components/VirtualizedTable/hooks/index.js

@@ -0,0 +1,4 @@
+import { useVirtualizedTableReady as r } from "./useVirtualizedTableReady/useVirtualizedTableReady.js";
+export {
+  r as useVirtualizedTableReady
+};

package/dist/components/VirtualizedTable/hooks/useVirtualizedTableReady/index.js

@@ -0,0 +1,4 @@
+import { useVirtualizedTableReady as r } from "./useVirtualizedTableReady.js";
+export {
+  r as useVirtualizedTableReady
+};

package/dist/components/VirtualizedTable/hooks/useVirtualizedTableReady/useVirtualizedTableReady.js

@@ -0,0 +1,12 @@
+import { isVirtualizedTableContentLoaded as t, loadVirtualizedTableContent as r, subscribeToVirtualizedTableContent as a } from "../../utils/load-content/load-content.js";
+import { useEffect as i, useSyncExternalStore as o } from "react";
+var n = () => !1, s = () => {
+  const e = o(a, t, n);
+  return i(() => {
+    e || r().catch(() => {
+    });
+  }, [e]), e;
+};
+export {
+  s as useVirtualizedTableReady
+};

package/dist/components/VirtualizedTable/utils/get-table-id.js

@@ -0,0 +1,4 @@
+var a = (r) => Array.isArray(r) ? r.join(",") : String(r);
+export {
+  a as getTableId
+};

package/dist/components/VirtualizedTable/utils/index.js

@@ -0,0 +1,16 @@
+import { getTableId as i } from "./get-table-id.js";
+import { getLoadedVirtualizedTableContent as o, isVirtualizedTableContentLoaded as a, loadVirtualizedTableContent as r, preloadVirtualizedTable as n, subscribeToVirtualizedTableContent as d } from "./load-content/load-content.js";
+import { isPaginationBarVisible as b } from "./pagination.js";
+import { getPinnedCellProps as s, getPinnedOffset as p, isPinnedBoundary as u } from "./pinned-columns/pinned-columns.js";
+export {
+  o as getLoadedVirtualizedTableContent,
+  s as getPinnedCellProps,
+  p as getPinnedOffset,
+  i as getTableId,
+  b as isPaginationBarVisible,
+  u as isPinnedBoundary,
+  a as isVirtualizedTableContentLoaded,
+  r as loadVirtualizedTableContent,
+  n as preloadVirtualizedTable,
+  d as subscribeToVirtualizedTableContent
+};

package/dist/components/VirtualizedTable/utils/load-content/index.js

@@ -0,0 +1,8 @@
+import { getLoadedVirtualizedTableContent as t, isVirtualizedTableContentLoaded as a, loadVirtualizedTableContent as i, preloadVirtualizedTable as l, subscribeToVirtualizedTableContent as o } from "./load-content.js";
+export {
+  t as getLoadedVirtualizedTableContent,
+  a as isVirtualizedTableContentLoaded,
+  i as loadVirtualizedTableContent,
+  l as preloadVirtualizedTable,
+  o as subscribeToVirtualizedTableContent
+};

package/dist/components/VirtualizedTable/utils/load-content/load-content.js

@@ -0,0 +1,15 @@
+var r, a, t = /* @__PURE__ */ new Set(), n = () => (r || (r = import("../../components/VirtualizedTableContent/VirtualizedTableContent.js").then((e) => (a = e, t.forEach((d) => {
+  d();
+}), e)).catch((e) => {
+  throw r = void 0, e;
+})), r), o = () => a !== void 0, i = () => a, l = (e) => (t.add(e), () => {
+  t.delete(e);
+}), u = () => n().then(() => {
+});
+export {
+  i as getLoadedVirtualizedTableContent,
+  o as isVirtualizedTableContentLoaded,
+  n as loadVirtualizedTableContent,
+  u as preloadVirtualizedTable,
+  l as subscribeToVirtualizedTableContent
+};

package/dist/components/VirtualizedTable/utils/pagination.js

@@ -0,0 +1,5 @@
+import "../constants/pagination.js";
+var o = (r) => r > 10;
+export {
+  o as isPaginationBarVisible
+};

package/dist/components/VirtualizedTable/utils/pinned-columns/index.js

@@ -0,0 +1,6 @@
+import { getPinnedCellProps as n, getPinnedOffset as i, isPinnedBoundary as o } from "./pinned-columns.js";
+export {
+  n as getPinnedCellProps,
+  i as getPinnedOffset,
+  o as isPinnedBoundary
+};

package/dist/components/VirtualizedTable/utils/pinned-columns/pinned-columns.js

@@ -0,0 +1,32 @@
+import { t as f } from "../../../../utils-DnIJruo0.js";
+var o = (t, e) => t.reduce((r, { id: i }) => r + (e[i] ?? 0), 0), a = (t, e, r) => {
+  const i = e.getIsPinned();
+  if (i === "left") {
+    const n = t.getLeftLeafColumns(), d = n.findIndex(({ id: s }) => s === e.id);
+    return o(n.slice(0, d), r);
+  }
+  if (i === "right") {
+    const n = t.getRightLeafColumns(), d = n.findIndex(({ id: s }) => s === e.id);
+    return o(n.slice(d + 1), r);
+  }
+  return 0;
+}, l = (t, e) => {
+  const r = e.getIsPinned();
+  return r === "left" ? t.getLeftLeafColumns().at(-1)?.id === e.id : r === "right" ? t.getRightLeafColumns()[0]?.id === e.id : !1;
+}, u = (t, e, r) => {
+  const i = e.getIsPinned();
+  if (!i) return {};
+  const n = a(t, e, r), d = l(t, e);
+  return i === "left" ? {
+    className: f("kvt-pinned kvt-pinned-left sticky", d && "[[data-kvt-overflow]_&]:border-r border-r-gray-200 dark:border-r-metal-700"),
+    style: { left: n }
+  } : {
+    className: f("kvt-pinned kvt-pinned-right sticky", d && "[[data-kvt-overflow]_&]:border-l border-l-gray-200 dark:border-l-metal-700"),
+    style: { right: n }
+  };
+};
+export {
+  u as getPinnedCellProps,
+  a as getPinnedOffset,
+  l as isPinnedBoundary
+};