@konstructio/ui 0.1.2-alpha.66 → 0.1.2-alpha.67

package/dist/components/DateRangePicker/components/CalendarPanel/components/CalendarMonth/CalendarMonth.js

@@ -4,7 +4,7 @@ import { cn as d } from "../../../../../../utils/index.js";
 import { calendarMonthTitleVariants as f } from "../../CalendarPanel.variants.js";
 import { createDayPickerClassNames as h, SINGLE_MONTH_WIDTH as p } from "../../constants/index.js";
 import { getMonthName as M } from "../../../../utils/validation.js";
-import { D as y } from "../../../../../../DayPicker-PUEUVAST.js";
+import { D as y } from "../../../../../../DayPicker-CaeUXRCF.js";
 const N = (e) => `${M(e.getMonth())} ${e.getFullYear()}`, g = ({
   month: e,
   range: a,

package/dist/components/Datepicker/DatePicker.js

@@ -3,7 +3,7 @@ import { useState as h, useCallback as f } from "react";
 import { cn as t } from "../../utils/index.js";
 import { datePickerVariants as p } from "./DatePicker.variants.js";
 import '../../style.css';/* empty css                   */
-import { D as k } from "../../DayPicker-PUEUVAST.js";
+import { D as k } from "../../DayPicker-CaeUXRCF.js";
 import { C as g } from "../../chevron-left-BHBf-gQY.js";
 import { C as w } from "../../chevron-right-DvXGOiS_.js";
 const y = ({

package/dist/components/VirtualizedTable/VirtualizedTable.d.ts

@@ -5,6 +5,11 @@ import { Props as ActionProps } from './components/Actions/Actions.types';
 type VirtualizedTableCompound = (<TData extends RowData>(props: Props<TData>) => JSX.Element) & {
     TruncateText: typeof TruncateText;
     Actions: <TData extends RowData>(props: ActionProps<TData>) => JSX.Element | null;
+    Events: {
+        sendExpandRowEvent: (tableId: string, rowId: string) => void;
+        sendCollapseRowEvent: (tableId: string, rowId: string) => void;
+        sendToggleRowEvent: (tableId: string, rowId: string) => void;
+    };
     displayName?: string;
 };
 declare const VirtualizedTable: VirtualizedTableCompound;

package/dist/components/VirtualizedTable/VirtualizedTable.js

@@ -1,63 +1,64 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
 import { useMemo as U } from "react";
-import { cn as c } from "../../utils/index.js";
-import { TableProvider as X } from "./contexts/table.provider.js";
-import { Filter as Y } from "./components/Filter/Filter.js";
-import { WrapperBody as Z } from "./components/WrapperBody/WrapperBody.js";
-import { Header as _ } from "./components/Header/Header.js";
-import { Body as $ } from "./components/Body/Body.js";
-import { Pagination as D } from "./components/Pagination/Pagination.js";
-import { TruncateText as L } from "./components/TruncateText/TruncateText.js";
-import { Actions as rr } from "./components/Actions/Actions.js";
-const er = ({
-  id: n,
+import { cn as s } from "../../utils/index.js";
+import { sendToggleRowEvent as X, sendCollapseRowEvent as Y, sendExpandRowEvent as Z } from "./events/index.js";
+import { TableProvider as _ } from "./contexts/table.provider.js";
+import { Filter as $ } from "./components/Filter/Filter.js";
+import { WrapperBody as D } from "./components/WrapperBody/WrapperBody.js";
+import { Header as L } from "./components/Header/Header.js";
+import { Body as rr } from "./components/Body/Body.js";
+import { Pagination as er } from "./components/Pagination/Pagination.js";
+import { TruncateText as or } from "./components/TruncateText/TruncateText.js";
+import { Actions as ar } from "./components/Actions/Actions.js";
+const tr = ({
+  id: c,
   ariaLabel: p,
   columns: d,
   data: f,
   totalItems: u = -1 / 0,
   className: b,
   classNameHeaderActiveArrows: T,
-  classNameHeaderArrows: N,
+  classNameHeaderArrows: v,
   classNameHeaderTable: x,
-  classNameTable: A,
-  classNameWrapperTable: y,
+  classNameTable: E,
+  classNameWrapperTable: N,
   isLoading: a,
-  getRowId: h,
-  fetchData: z,
-  queryOptions: B,
+  getRowId: w,
+  fetchData: A,
+  queryOptions: y,
   // Pagination
-  showPagination: V,
+  showPagination: h,
   showTotalItems: t,
   showDropdownPagination: i,
   showDotPagination: l,
   showFormPagination: m,
-  pageSizes: j,
+  pageSizes: z,
   // Filter
-  showFilter: k = !1,
-  showFilterInput: v,
-  filterSearchPlaceholder: w = "",
-  multiSelectFilter: P,
-  filterActions: E,
-  showResetButton: H = !0,
-  resetButtonClassName: I,
+  showFilter: B = !1,
+  showFilterInput: R,
+  filterSearchPlaceholder: V = "",
+  multiSelectFilter: g,
+  filterActions: j,
+  showResetButton: k = !0,
+  resetButtonClassName: P,
   // Hover row
-  enableHoverRow: K,
-  classNameHoverRow: M,
+  enableHoverRow: C,
+  classNameHoverRow: H,
   // Expandable rows
-  enableExpandedRow: W,
-  expandedState: g,
-  defaultExpanded: q,
-  classNameExpandedRow: C,
-  classNameExpandedCell: F,
-  classNameExpandedContent: G,
-  classNameExpandedHeader: J,
-  classNameActiveExpandedRow: O,
-  onExpandedChange: Q,
-  renderExpandedRow: R,
+  enableExpandedRow: I,
+  expandedState: K,
+  defaultExpanded: M,
+  classNameExpandedRow: W,
+  classNameExpandedCell: q,
+  classNameExpandedContent: F,
+  classNameExpandedHeader: G,
+  classNameActiveExpandedRow: J,
+  onExpandedChange: O,
+  renderExpandedRow: Q,
   keepExpandColumnVisible: S
 }) => {
   const e = U(
-    () => V || [
+    () => h || [
       t,
       i,
       l,
@@ -66,90 +67,95 @@ const er = ({
     []
   );
   return /* @__PURE__ */ r(
-    X,
+    _,
     {
-      id: n,
+      id: c,
       columns: d,
       data: f,
-      getRowId: h,
-      fetchData: z,
+      getRowId: w,
+      fetchData: A,
       totalItems: u,
-      queryOptions: B,
+      queryOptions: y,
       isPaginationEnabled: e,
-      enableExpandedRow: W,
-      expandedState: g,
-      onExpandedChange: Q,
-      defaultExpanded: q,
-      classNameExpandedRow: C,
-      classNameExpandedCell: F,
-      classNameExpandedContent: G,
-      classNameExpandedHeader: J,
-      classNameActiveExpandedRow: O,
-      enableHoverRow: K,
-      classNameHoverRow: M,
-      renderExpandedRow: R,
+      enableExpandedRow: I,
+      expandedState: K,
+      onExpandedChange: O,
+      defaultExpanded: M,
+      classNameExpandedRow: W,
+      classNameExpandedCell: q,
+      classNameExpandedContent: F,
+      classNameExpandedHeader: G,
+      classNameActiveExpandedRow: J,
+      enableHoverRow: C,
+      classNameHoverRow: H,
+      renderExpandedRow: Q,
       keepExpandColumnVisible: S,
-      children: /* @__PURE__ */ s("section", { className: c("w-full min-w-fit", b), children: [
-        k && /* @__PURE__ */ r(
-          Y,
+      children: /* @__PURE__ */ n("section", { className: s("w-full min-w-fit", b), children: [
+        B && /* @__PURE__ */ r(
+          $,
           {
-            actions: E,
-            multiSelectFilter: P,
-            placeholder: w,
-            showFilterInput: v,
-            showResetButton: H,
-            resetButtonClassName: I
+            actions: j,
+            multiSelectFilter: g,
+            placeholder: V,
+            showFilterInput: R,
+            showResetButton: k,
+            resetButtonClassName: P
           }
         ),
         /* @__PURE__ */ r(
-          Z,
+          D,
           {
             showPagination: e,
-            classNameWrapperTable: y,
+            classNameWrapperTable: N,
             isLoading: a,
-            children: /* @__PURE__ */ s(
+            children: /* @__PURE__ */ n(
               "table",
               {
-                className: c(
+                className: s(
                   "w-full border-collapse table-auto",
                   "dark:border-separate dark:border-spacing-0",
-                  A
+                  E
                 ),
                 "aria-label": p,
                 children: [
                   /* @__PURE__ */ r(
-                    _,
+                    L,
                     {
                       className: x,
-                      classNameArrows: N,
+                      classNameArrows: v,
                       classNameActiveArrows: T
                     }
                   ),
-                  /* @__PURE__ */ r($, { isLoading: a, showPagination: e })
+                  /* @__PURE__ */ r(rr, { isLoading: a, showPagination: e })
                 ]
               }
             )
           }
         ),
         e && /* @__PURE__ */ r(
-          D,
+          er,
           {
             showTotalItems: t,
             showDropdownPagination: i,
             showDotPagination: l,
             showFormPagination: m,
-            pageSizes: j,
+            pageSizes: z,
             isLoading: a
           }
         )
       ] })
     }
   );
-}, o = er;
+}, o = tr;
 o.displayName = "KonstructVirtualizedTable";
-o.TruncateText = L;
-o.Actions = rr;
+o.TruncateText = or;
+o.Actions = ar;
+o.Events = {
+  sendExpandRowEvent: Z,
+  sendCollapseRowEvent: Y,
+  sendToggleRowEvent: X
+};
 export {
-  L as TruncateText,
+  or as TruncateText,
   o as VirtualizedTable
 };

package/dist/components/VirtualizedTable/components/Body/Body.js

@@ -1,63 +1,65 @@
-import { jsx as a, jsxs as S } from "react/jsx-runtime";
-import { f as j } from "../../../../index-CSWGJT-v.js";
+import { jsx as a, jsxs as A } from "react/jsx-runtime";
+import { f as B } from "../../../../index-CSWGJT-v.js";
 import { Fragment as H } from "react";
 import { Skeleton as M } from "../Skeleton/Skeleton.js";
-import { cn as s } from "../../../../utils/index.js";
-import { ExpandableRow as A } from "../ExpandableRow/ExpandableRow.js";
-import { useTableContext as B } from "../../contexts/table.hook.js";
-const J = ({
-  isLoading: f,
+import { cn as l } from "../../../../utils/index.js";
+import { ExpandableRow as O } from "../ExpandableRow/ExpandableRow.js";
+import { useTableContext as V } from "../../contexts/table.hook.js";
+const U = ({
+  isLoading: g,
   showPagination: t
 }) => {
   const {
-    table: b,
-    pageSize: u,
-    tableFetching: h,
-    enableExpandedRow: w,
-    classNameExpandedRow: N,
-    classNameExpandedCell: R,
-    classNameExpandedContent: k,
+    table: i,
+    pageSize: h,
+    tableFetching: w,
+    enableExpandedRow: N,
+    classNameExpandedRow: R,
+    classNameExpandedCell: k,
+    classNameExpandedContent: E,
     enableHoverRow: p,
-    classNameHoverRow: E,
+    classNameHoverRow: C,
     classNameActiveExpandedRow: v,
-    renderExpandedRow: i
-  } = B();
-  if (f || h)
-    return /* @__PURE__ */ a(M, { numberOfRows: u, table: b });
-  const o = b.getRowModel().rows ?? [];
+    renderExpandedRow: b,
+    isBorderOnAdjacentCell: D,
+    isExpandColumnVisible: y
+  } = V();
+  if (g || w)
+    return /* @__PURE__ */ a(M, { numberOfRows: h, table: i });
+  const d = i.getRowModel().rows ?? [];
   return /* @__PURE__ */ a(
     "tbody",
     {
-      className: s(
+      className: l(
         "text-slate-800",
         "text-sm",
         "font-normal",
         "relative",
         "dark:border-x"
       ),
-      children: o.map((g, l) => {
-        const { id: n, original: m, getVisibleCells: y } = g, { meta: d = {} } = m, c = y(), e = w && g.getIsExpanded(), C = !!d.expandedRow || !!i;
-        return /* @__PURE__ */ S(H, { children: [
+      children: d.map((x, s) => {
+        const { id: m, original: c, getVisibleCells: j } = x, { meta: o = {} } = c, n = j(), e = N && x.getIsExpanded(), z = !!o.expandedRow || !!b, u = n[0]?.column.id !== "__expand" || y ? 0 : D ? 1 : null;
+        return /* @__PURE__ */ A(H, { children: [
           /* @__PURE__ */ a(
             "tr",
             {
-              className: s(
+              className: l(
                 { "group/row": p },
                 "border-b",
                 "border-b-gray-200",
                 "dark:text-metal-50",
                 "dark:border-b-metal-700",
                 "bg-transparent",
-                d.className
+                o.className
               ),
-              "data-row-id": n,
-              ...d.attributes ?? {},
-              children: c.map(({ id: D, column: r, getContext: z }, x) => {
-                const F = typeof r.columnDef.meta?.className == "function" ? r.columnDef.meta?.className(m) : r.columnDef.meta?.className;
+              "data-row-id": m,
+              ...o.attributes ?? {},
+              children: n.map(({ id: F, column: r, getContext: S }, f) => {
+                const _ = typeof r.columnDef.meta?.className == "function" ? r.columnDef.meta?.className(c) : r.columnDef.meta?.className;
                 return /* @__PURE__ */ a(
                   "td",
                   {
-                    className: s(
+                    className: l(
                       "px-4",
                       "py-1",
                       "text-sm",
@@ -69,46 +71,46 @@ const J = ({
                       "dark:last:border-r",
                       {
                         "group-hover/row:bg-zinc-100 dark:group-hover/row:bg-metal-800": p,
-                        [s(
+                        [l(
                           "bg-zinc-100 dark:bg-metal-800",
                           v
                         )]: !!e
                       },
-                      E,
-                      F,
+                      C,
+                      _,
                       {
-                        "first:rounded-bl-lg": l === o.length - 1 && x === 0 && !t && !e,
-                        "last:rounded-br-lg": l === o.length - 1 && x === c.length - 1 && !t && !e,
+                        "rounded-bl-lg": s === d.length - 1 && u !== null && f === u && !t && !e,
+                        "rounded-br-lg": s === d.length - 1 && f === n.length - 1 && !t && !e,
                         "dark:[tr:last-child_&]:border-b": !t
                       }
                     ),
                     "data-expanded": e ? !0 : void 0,
                     ...r.columnDef.meta?.attributes ?? {},
-                    children: j(r.columnDef.cell, z())
+                    children: B(r.columnDef.cell, S())
                   },
-                  D
+                  F
                 );
               })
             }
           ),
-          C && /* @__PURE__ */ a(
-            A,
+          z && /* @__PURE__ */ a(
+            O,
             {
-              classNameExpandedCell: R,
-              classNameExpandedContent: k,
-              classNameExpandedRow: N,
-              colSpan: c.length,
-              id: n,
+              classNameExpandedCell: k,
+              classNameExpandedContent: E,
+              classNameExpandedRow: R,
+              colSpan: n.length,
+              id: m,
               isExpanded: !!e,
-              isLastRow: l === o.length - 1 && !t,
-              children: d.expandedRow ?? i?.(m)
+              isLastRow: s === d.length - 1 && !t,
+              children: o.expandedRow ?? b?.(c)
             }
           )
-        ] }, n);
+        ] }, m);
       })
     }
   );
 };
 export {
-  J as Body
+  U as Body
 };

package/dist/components/VirtualizedTable/contexts/table.context.d.ts

@@ -20,6 +20,8 @@ export type ContextType<TData extends RowData = RowData> = {
     classNameActiveExpandedRow?: string;
     enableHoverRow?: boolean;
     classNameHoverRow?: string;
+    isBorderOnAdjacentCell?: boolean;
+    isExpandColumnVisible?: boolean;
     renderExpandedRow?: (data: RowData) => ReactNode;
     handlePage: (newPage: number) => void;
     onPageSize: (newPageSize: number) => void;