@ck-ui/component-library 0.3.0 → 1.0.1

package/dist/components/Table/_helpers/ExpandableRow/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ExpandableRow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,UAAU,wBAAwB;IAChC,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,QAAQ,EACR,QAAQ,GACT,EAAE,wBAAwB,2CA4B1B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ExpandableRow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,UAAU,wBAAwB;IAChC,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,QAAQ,EACR,QAAQ,GACT,EAAE,wBAAwB,2CAsC1B"}

package/dist/components/Table/_helpers/ExpandableRow/index.js

@@ -1,44 +1,54 @@
-import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import * as a from "react";
-const p = (e) => /* @__PURE__ */ a.createElement("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ a.createElement("path", { d: "M2.91747 9.03784L6.99782 4.96909L11.0781 9.03784", stroke: "#2B2B2B", strokeWidth: 0.88, strokeLinecap: "round", strokeLinejoin: "round" }));
-function m({
+import { jsxs as p, jsx as t } from "react/jsx-runtime";
+import * as n from "react";
+const d = (e) => /* @__PURE__ */ n.createElement("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.91747 9.03784L6.99782 4.96909L11.0781 9.03784", stroke: "#2B2B2B", strokeWidth: 0.88, strokeLinecap: "round", strokeLinejoin: "round" }));
+function x({
   isExpanded: e,
-  hasChildren: n,
-  depth: o,
-  indentSize: r,
-  onToggle: s,
+  hasChildren: o,
+  depth: r,
+  indentSize: a,
+  onToggle: i,
   children: l
 }) {
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ p(
     "div",
     {
-      className: "flex items-center gap-1 w-full",
-      style: { paddingLeft: `${o * r}px` },
+      style: {
+        display: "flex",
+        alignItems: "center",
+        gap: "4px",
+        width: "100%",
+        paddingLeft: `${r * a}px`
+      },
       children: [
-        n ? /* @__PURE__ */ t(
+        o ? /* @__PURE__ */ t(
           "button",
           {
             type: "button",
             className: "ckds-table-expand-btn",
-            onClick: (i) => {
-              i.stopPropagation(), s();
+            onClick: (s) => {
+              s.stopPropagation(), i();
             },
             "aria-label": e ? "Collapse row" : "Expand row",
             "aria-expanded": e,
             children: /* @__PURE__ */ t(
-              p,
+              d,
               {
-                className: "w-3.5 h-3.5 transition-transform duration-200",
-                style: { transform: e ? "rotate(0deg)" : "rotate(180deg)" }
+                style: {
+                  width: "14px",
+                  height: "14px",
+                  flexShrink: 0,
+                  transition: "transform 200ms ease",
+                  transform: e ? "rotate(0deg)" : "rotate(180deg)"
+                }
               }
             )
           }
-        ) : /* @__PURE__ */ t("span", { className: "w-5 shrink-0" }),
-        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: l })
+        ) : /* @__PURE__ */ t("span", { style: { width: "20px", flexShrink: 0, display: "inline-block" } }),
+        /* @__PURE__ */ t("div", { style: { flex: 1, minWidth: 0 }, children: l })
       ]
     }
   );
 }
 export {
-  m as ExpandableRowToggle
+  x as ExpandableRowToggle
 };

package/dist/components/Table/_helpers/GroupedHeader/index.d.ts

@@ -7,7 +7,7 @@ interface GroupedHeaderProps<TData> {
     getSortIcon: (sortState: false | "asc" | "desc") => React.ReactNode;
     selectionCell?: React.ReactNode;
     lastColId: string | null;
-    lastNonPinnedColId?: string | null;
+    columnSizing?: Record<string, number>;
     pinnedStyle: (column: Header<TData, unknown>["column"], table: Table<TData>, offset: number) => React.CSSProperties;
     selectionOffset: number;
 }
@@ -19,6 +19,6 @@ interface GroupedHeaderProps<TData> {
  *
  * This avoids the rowspan problem with display:flex rows.
  */
-export default function GroupedHeader<TData>({ headerGroups, table, hasSelection, getSortIcon, selectionCell, lastColId, lastNonPinnedColId, pinnedStyle: getPinnedStyle, selectionOffset, }: GroupedHeaderProps<TData>): import("react/jsx-runtime").JSX.Element | null;
+export default function GroupedHeader<TData>({ headerGroups, table, hasSelection, getSortIcon, selectionCell, lastColId, columnSizing, pinnedStyle: getPinnedStyle, selectionOffset, }: GroupedHeaderProps<TData>): import("react/jsx-runtime").JSX.Element | null;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Table/_helpers/GroupedHeader/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/GroupedHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,KAAK,EAAE,KAAK,MAAM,EAAoB,MAAM,uBAAuB,CAAC;AAC9F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,UAAU,kBAAkB,CAAC,KAAK;IAChC,YAAY,EAAE,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,SAAS,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IACpE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC,aAAa,CAAC;IACpH,eAAe,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAK,EAAE,EAC3C,YAAY,EACZ,KAAK,EACL,YAAoB,EACpB,WAAW,EACX,aAAa,EACb,SAAS,EACT,kBAAkB,EAClB,WAAW,EAAE,cAAc,EAC3B,eAAe,GAChB,EAAE,kBAAkB,CAAC,KAAK,CAAC,kDA0P3B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/GroupedHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,KAAK,EAAE,KAAK,MAAM,EAAoB,MAAM,uBAAuB,CAAC;AAC9F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAG/D,UAAU,kBAAkB,CAAC,KAAK;IAChC,YAAY,EAAE,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,SAAS,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IACpE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC,aAAa,CAAC;IACpH,eAAe,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAK,EAAE,EAC3C,YAAY,EACZ,KAAK,EACL,YAAoB,EACpB,WAAW,EACX,aAAa,EACb,SAAS,EACT,YAAY,EACZ,WAAW,EAAE,cAAc,EAC3B,eAAe,GAChB,EAAE,kBAAkB,CAAC,KAAK,CAAC,kDAgQ3B"}

package/dist/components/Table/_helpers/GroupedHeader/index.js

@@ -1,46 +1,47 @@
-import { jsxs as i, jsx as o, Fragment as I } from "react/jsx-runtime";
-import { f as N } from "../../../../index-f7TB87Mf.js";
-function j({
-  headerGroups: W,
-  table: b,
-  hasSelection: z = !1,
-  getSortIcon: p,
-  selectionCell: D,
-  lastColId: G,
-  lastNonPinnedColId: f,
-  pinnedStyle: H,
-  selectionOffset: L
+import { jsxs as r, jsx as o, Fragment as y } from "react/jsx-runtime";
+import { f as S } from "../../../../index-f7TB87Mf.js";
+import { columnLayoutStyle as x, columnsLayoutStyle as T } from "../../_utils/table.utils.js";
+function K({
+  headerGroups: I,
+  table: h,
+  hasSelection: N = !1,
+  getSortIcon: u,
+  selectionCell: v,
+  lastColId: w,
+  columnSizing: m,
+  pinnedStyle: D,
+  selectionOffset: H
 }) {
-  const l = b.getVisibleLeafColumns();
-  if (l.length === 0) return null;
-  const u = /* @__PURE__ */ new Map();
-  l.forEach((n) => u.set(n.id, null)), W.forEach((n) => {
-    n.columns.forEach((s) => {
-      u.has(s) && u.set(s, n.label);
+  const t = h.getVisibleLeafColumns();
+  if (t.length === 0) return null;
+  const i = /* @__PURE__ */ new Map();
+  t.forEach((l) => i.set(l.id, null)), I.forEach((l) => {
+    l.columns.forEach((s) => {
+      i.has(s) && i.set(s, l.label);
     });
   });
-  const R = b.getHeaderGroups()[0], k = /* @__PURE__ */ new Map();
-  R?.headers.forEach((n) => k.set(n.column.id, n));
-  const S = l[l.length - 1]?.id, x = [];
-  let c = 0;
-  for (; c < l.length; ) {
-    const n = l[c], s = u.get(n.id);
+  const R = h.getHeaderGroups()[0], p = /* @__PURE__ */ new Map();
+  R?.headers.forEach((l) => p.set(l.column.id, l));
+  const z = t[t.length - 1]?.id, f = [];
+  let d = 0;
+  for (; d < t.length; ) {
+    const l = t[d], s = i.get(l.id);
     if (s === null)
-      x.push({ type: "ungrouped", colIds: [n.id] }), c++;
+      f.push({ type: "ungrouped", colIds: [l.id] }), d++;
     else {
-      const a = [];
-      for (; c < l.length && u.get(l[c].id) === s; )
-        a.push(l[c].id), c++;
-      x.push({ type: "group", colIds: a, label: s });
+      const g = [];
+      for (; d < t.length && i.get(t[d].id) === s; )
+        g.push(t[d].id), d++;
+      f.push({ type: "group", colIds: g, label: s });
     }
   }
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ r(
     "tr",
     {
       className: "ckds-dragable-tr ckds-dragable-tr-double",
       style: { display: "flex", width: "100%", minWidth: "inherit" },
       children: [
-        z && /* @__PURE__ */ o(
+        N && /* @__PURE__ */ o(
           "th",
           {
             className: "ckds-dragable-th ckds-dragable-th-double-ungrouped",
@@ -53,55 +54,51 @@ function j({
               left: 0,
               zIndex: 2
             },
-            children: D
+            children: v
           }
         ),
-        x.map((n, s) => {
-          const a = n.colIds.reduce((e, d) => {
-            const t = l.find((h) => h.id === d);
-            return e + (t?.getSize() ?? 150);
-          }, 0), v = n.colIds.includes(S);
-          if (n.type === "ungrouped") {
-            const e = k.get(n.colIds[0]), d = e?.column.getIsPinned(), t = e?.column.id === G, h = t && d === "right", g = t && !d || n.colIds[0] === f;
-            return /* @__PURE__ */ i(I, { children: [
-              h && /* @__PURE__ */ o("th", { "aria-hidden": "true", className: "ckds-dragable-th ckds-dragable-th-double-ungrouped ckds-dragable-th-filler", style: { flex: "1 1 auto", minWidth: 0, padding: 0, border: "none", boxShadow: "none" } }, `dh-cell-${s}-filler`),
-              /* @__PURE__ */ i(
+        f.map((l, s) => {
+          const g = l.colIds.map((e) => t.find((c) => c.id === e)).filter((e) => !!e), L = l.colIds.includes(z);
+          if (l.type === "ungrouped") {
+            const e = p.get(l.colIds[0]), c = e?.column.getIsPinned(), n = e?.column.id === w;
+            return /* @__PURE__ */ r(y, { children: [
+              n && c === "right" && /* @__PURE__ */ o("th", { "aria-hidden": "true", className: "ckds-dragable-th ckds-dragable-th-double-ungrouped ckds-dragable-th-filler", style: { flex: "1 1 auto", minWidth: 0, padding: 0, border: "none", boxShadow: "none" } }, `dh-cell-${s}-filler`),
+              /* @__PURE__ */ r(
                 "th",
                 {
                   className: "ckds-dragable-th ckds-dragable-th-double-ungrouped",
                   style: {
-                    ...e ? H(e.column, b, L) : {},
-                    width: g ? "100%" : a,
-                    minWidth: a,
-                    maxWidth: g ? void 0 : a,
-                    flex: g ? "1 1 auto" : `0 0 ${a}px`,
-                    position: d ? "sticky" : "relative",
-                    zIndex: d ? 2 : void 0
+                    ...e ? D(e.column, h, H) : {},
+                    ...e ? x(e.column, t, m) : {},
+                    position: c ? "sticky" : "relative",
+                    zIndex: c ? 2 : void 0
                   },
                   children: [
-                    e && /* @__PURE__ */ i(
+                    e && /* @__PURE__ */ r(
                       "div",
                       {
                         style: {
                           display: "flex",
                           alignItems: "center",
-                          justifyContent: "space-between",
+                          flex: "1 1 auto",
+                          minWidth: 0,
+                          justifyContent: e.column.getCanSort() ? "space-between" : e.column.columnDef.align === "right" ? "flex-end" : e.column.columnDef.align === "center" ? "center" : "flex-start",
                           cursor: e.column.getCanSort() ? "pointer" : "default"
                         },
                         onClick: e.column.getCanSort() ? e.column.getToggleSortingHandler() : void 0,
                         role: "button",
                         tabIndex: e.column.getCanSort() ? 0 : -1,
-                        onKeyDown: (r) => {
-                          e.column.getCanSort() && (r.key === "Enter" || r.key === " ") && e.column.getToggleSortingHandler()?.(r);
+                        onKeyDown: (a) => {
+                          e.column.getCanSort() && (a.key === "Enter" || a.key === " ") && e.column.getToggleSortingHandler()?.(a);
                         },
                         children: [
-                          e.column.columnDef.align === "right" && e.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: p(e.column.getIsSorted()) }),
-                          N(e.column.columnDef.header, e.getContext()),
-                          e.column.columnDef.align !== "right" && e.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: p(e.column.getIsSorted()) })
+                          e.column.columnDef.align === "right" && e.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon ckds-sort-icon-left", children: u(e.column.getIsSorted()) }),
+                          S(e.column.columnDef.header, e.getContext()),
+                          e.column.columnDef.align !== "right" && e.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: u(e.column.getIsSorted()) })
                         ]
                       }
                     ),
-                    e && !t && /* @__PURE__ */ o(
+                    e && !n && e.column.getCanResize() && /* @__PURE__ */ o(
                       "div",
                       {
                         onMouseDown: e.getResizeHandler(),
@@ -118,63 +115,58 @@ function j({
               )
             ] });
           }
-          const $ = n.colIds[n.colIds.length - 1], E = l.find((e) => e.id === $), w = v && E?.getIsPinned() === "right", C = v && !w || n.colIds.some((e) => e === f);
-          return /* @__PURE__ */ i(I, { children: [
-            w && /* @__PURE__ */ o("th", { "aria-hidden": "true", className: "ckds-dragable-th ckds-dragable-th-double-group ckds-dragable-th-filler", style: { flex: "1 1 auto", minWidth: 0, padding: 0, border: "none", boxShadow: "none" } }, `dh-cell-${s}-filler`),
-            /* @__PURE__ */ i(
+          const G = l.colIds[l.colIds.length - 1], E = t.find((e) => e.id === G), M = L && E?.getIsPinned() === "right";
+          return /* @__PURE__ */ r(y, { children: [
+            M && /* @__PURE__ */ o("th", { "aria-hidden": "true", className: "ckds-dragable-th ckds-dragable-th-double-group ckds-dragable-th-filler", style: { flex: "1 1 auto", minWidth: 0, padding: 0, border: "none", boxShadow: "none" } }, `dh-cell-${s}-filler`),
+            /* @__PURE__ */ r(
               "th",
               {
                 className: "ckds-dragable-th ckds-dragable-th-double-group",
                 style: {
-                  width: C ? "100%" : a,
-                  minWidth: a,
-                  maxWidth: C ? void 0 : a,
-                  flex: C ? "1 1 auto" : `0 0 ${a}px`
+                  ...T(g, t, m)
                 },
                 children: [
-                  /* @__PURE__ */ o("div", { className: "ckds-dragable-th-double-group-label", children: /* @__PURE__ */ o("span", { className: "ckds-group-label-text", children: n.label }) }),
-                  /* @__PURE__ */ o("div", { className: "ckds-dragable-th-double-group-subheaders", children: n.colIds.map((e, d) => {
-                    const t = k.get(e), h = d === n.colIds.length - 1, g = e === S, r = l.find((m) => m.id === e)?.getSize() ?? 150, y = g && !t?.column.getIsPinned() || e === f;
-                    return /* @__PURE__ */ i(
+                  /* @__PURE__ */ o("div", { className: "ckds-dragable-th-double-group-label", children: /* @__PURE__ */ o("span", { className: "ckds-group-label-text", children: l.label }) }),
+                  /* @__PURE__ */ o("div", { className: "ckds-dragable-th-double-group-subheaders", children: l.colIds.map((e, c) => {
+                    const n = p.get(e), C = c === l.colIds.length - 1, a = n?.column.columnDef?.align, b = n?.column.getCanSort() ?? !1, P = b ? "space-between" : a === "right" ? "flex-end" : a === "center" ? "center" : "flex-start";
+                    return /* @__PURE__ */ r(
                       "div",
                       {
                         className: "ckds-dragable-th-double-subheader",
                         style: {
-                          width: y ? "100%" : r,
-                          minWidth: r,
-                          maxWidth: y ? void 0 : r,
-                          flex: y ? "1 1 auto" : `0 0 ${r}px`,
+                          ...n ? x(n.column, t, m) : {},
                           position: "relative"
                         },
                         children: [
-                          t && /* @__PURE__ */ i(
+                          n && /* @__PURE__ */ r(
                             "div",
                             {
                               style: {
                                 display: "flex",
                                 alignItems: "center",
-                                justifyContent: "space-between",
+                                justifyContent: P,
+                                width: "100%",
                                 height: "100%",
-                                cursor: t.column.getCanSort() ? "pointer" : "default"
+                                cursor: n.column.getCanSort() ? "pointer" : "default"
                               },
-                              onClick: t.column.getCanSort() ? t.column.getToggleSortingHandler() : void 0,
+                              onClick: n.column.getCanSort() ? n.column.getToggleSortingHandler() : void 0,
                               role: "button",
-                              tabIndex: t.column.getCanSort() ? 0 : -1,
-                              onKeyDown: (m) => {
-                                t.column.getCanSort() && (m.key === "Enter" || m.key === " ") && t.column.getToggleSortingHandler()?.(m);
+                              tabIndex: n.column.getCanSort() ? 0 : -1,
+                              onKeyDown: (k) => {
+                                n.column.getCanSort() && (k.key === "Enter" || k.key === " ") && n.column.getToggleSortingHandler()?.(k);
                               },
                               children: [
-                                t.column.columnDef.align === "right" && t.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: p(t.column.getIsSorted()) }),
-                                N(t.column.columnDef.header, t.getContext()),
-                                t.column.columnDef.align !== "right" && t.column.getCanSort() && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: p(t.column.getIsSorted()) })
+                                a === "right" && b && /* @__PURE__ */ o("span", { className: "ckds-sort-icon ckds-sort-icon-left", children: u(n.column.getIsSorted()) }),
+                                S(n.column.columnDef.header, n.getContext()),
+                                a !== "right" && b && /* @__PURE__ */ o("span", { className: "ckds-sort-icon", children: u(n.column.getIsSorted()) })
                               ]
                             }
                           ),
-                          t && !h && /* @__PURE__ */ o(
+                          n && !C && n.column.getCanResize() && /* @__PURE__ */ o(
                             "div",
                             {
-                              onMouseDown: t.getResizeHandler(),
-                              onTouchStart: t.getResizeHandler(),
+                              onMouseDown: n.getResizeHandler(),
+                              onTouchStart: n.getResizeHandler(),
                               className: "ckds-col-resize-handle",
                               role: "separator",
                               "aria-orientation": "vertical",
@@ -197,5 +189,5 @@ function j({
   );
 }
 export {
-  j as default
+  K as default
 };

package/dist/components/Table/_helpers/TableFilterModal/OptionList.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { O as d } from "../../../../OptionList-BNaH2PnX.js";
+import { O as d } from "../../../../OptionList-DN1xZbnV.js";
 import "../../../CKCheckbox/index.js";
 import "./OptionListItems.js";
 import "../../../../search-B_cup-NN.js";

package/dist/components/Table/_helpers/TableFilterModal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/TableFilterModal/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,qBAAqB,EAItB,MAAM,0BAA0B,CAAC;AAClC,OAAO,eAAe,CAAC;AAEvB,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,kBAAkB,EAClB,qBAAqB,EACrB,kBAAkB,EAClB,YAAY,EACZ,cAAqB,EACrB,eAAe,GAChB,EAAE,qBAAqB,2CAiIvB;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/TableFilterModal/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EACV,qBAAqB,EAItB,MAAM,0BAA0B,CAAC;AAClC,OAAO,eAAe,CAAC;AAEvB,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,kBAAkB,EAClB,qBAAqB,EACrB,kBAAkB,EAClB,YAAY,EACZ,cAAqB,EACrB,eAAe,GAChB,EAAE,qBAAqB,2CAgIvB;AAED,eAAe,gBAAgB,CAAC"}

package/dist/components/Table/_helpers/TableFilterModal/index.js

@@ -1,64 +1,65 @@
 import { jsxs as i, jsx as c } from "react/jsx-runtime";
-import { useState as b, useEffect as O } from "react";
-import { Button as m } from "../../../Button/index.js";
-import { Typography as v } from "../../../Typography/index.js";
-import { S } from "../../../../reset-icon-YxMt3Ozp.js";
-import V from "./RangeSelector.js";
-import { O as E } from "../../../../OptionList-BNaH2PnX.js";
-import '../../../../assets/styles-D8sahtFb.css';/* empty css                          */
-function $({
-  filters: r,
-  draftColumnFilters: o,
+import { useState as k, useEffect as F } from "react";
+import { CKButton as S } from "../../../CKButton/index.js";
+import { Button as b } from "../../../Button/index.js";
+import { Typography as y } from "../../../Typography/index.js";
+import { S as V } from "../../../../reset-icon-YxMt3Ozp.js";
+import C from "./RangeSelector.js";
+import { O as E } from "../../../../OptionList-DN1xZbnV.js";
+import '../../../../assets/styles-O-5pBCak.css';/* empty css                          */
+function G({
+  filters: n,
+  draftColumnFilters: s,
   setDraftColumnFilters: d,
-  handleApplyFilters: y,
+  handleApplyFilters: v,
   setModalOpen: f,
   virtualization: g = !0,
   isFilterChanged: x
 }) {
-  const [t, u] = b(null), [p, h] = b("");
-  O(() => {
-    if (!r || Object.keys(r).length === 0) return;
-    const e = Object.keys(r)[0], n = r[e];
-    u({ key: e, ...n });
-  }, [r]);
-  const k = (e) => {
-    const n = r[e];
-    u({ key: e, ...n });
-  }, s = t ? o.find((e) => e.id === t.accessorKey)?.value : null, N = t?.type === "checkbox" ? s?.values ?? s : void 0, j = t?.type === "checkbox" ? s?.exclude ?? !1 : !1, w = t?.type === "range" ? s : void 0;
+  const [t, m] = k(null), [p, h] = k("");
+  F(() => {
+    if (!n || Object.keys(n).length === 0) return;
+    const e = Object.keys(n)[0], r = n[e];
+    m({ key: e, ...r });
+  }, [n]);
+  const u = (e) => {
+    const r = n[e];
+    m({ key: e, ...r });
+  }, o = t ? s.find((e) => e.id === t.accessorKey)?.value : null, N = t?.type === "checkbox" ? o?.values ?? o : void 0, j = t?.type === "checkbox" ? o?.exclude ?? !1 : !1, w = t?.type === "range" ? o : void 0;
   return /* @__PURE__ */ i("div", { className: "ckds-filter-modal-wrapper", children: [
     /* @__PURE__ */ i("div", { className: "ckds-heading-container", children: [
-      /* @__PURE__ */ c(v, { variant: "body-lg", weight: "semibold", children: "Table Filters" }),
+      /* @__PURE__ */ c(y, { variant: "body-lg", weight: "semibold", children: "Table Filters" }),
       /* @__PURE__ */ c(
-        m,
+        S,
         {
           onClick: () => {
             d([]), h("");
           },
-          variant: "tertiary",
-          disabled: o.length === 0,
-          Icon: /* @__PURE__ */ c(S, {}),
-          iconPosition: "left",
-          children: "Reset Filters"
+          variant: "hyperlink",
+          disabled: s.length === 0,
+          icons: { left: /* @__PURE__ */ c(V, {}) },
+          label: "Reset Filter",
+          className: s.length > 0 ? "ckds-reset-btn-active" : ""
         }
       )
     ] }),
     /* @__PURE__ */ i("div", { className: "ckds-main-container", children: [
-      /* @__PURE__ */ c("div", { className: "ckds-tab-wrapper ckds-custom-scrollbar", children: r && Object.keys(r).map((e) => /* @__PURE__ */ c(
+      /* @__PURE__ */ c("div", { className: "ckds-tab-wrapper ckds-custom-scrollbar", children: n && Object.keys(n).map((e) => /* @__PURE__ */ c(
         "div",
         {
           className: `ckds-filter-tab-item ${t?.key === e ? "ckds-filter-tab-active" : ""}`,
-          onClick: () => k(e),
+          onClick: () => u(e),
           role: "button",
           tabIndex: 0,
-          onKeyDown: (n) => {
-            (n.key === "Enter" || n.key === " ") && k(e);
+          onKeyDown: (r) => {
+            (r.key === "Enter" || r.key === " ") && u(e);
           },
-          children: /* @__PURE__ */ i("div", { className: "flex items-center justify-between w-full", children: [
-            /* @__PURE__ */ c(v, { variant: "body-sm", className: "text-inherit", weight: t?.key === e ? "medium" : "regular", children: e }),
+          children: /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%" }, children: [
+            /* @__PURE__ */ c(y, { variant: "body-sm", className: "text-inherit", weight: t?.key === e ? "medium" : "regular", children: e }),
             (() => {
-              const n = o.find((F) => F.id === r[e].accessorKey);
-              if (!n) return null;
-              const a = n.value;
+              const r = s.find((O) => O.id === n[e].accessorKey);
+              if (!r) return null;
+              const a = r.value;
               let l = 0;
               return Array.isArray(a) ? l = a.length : a && typeof a == "object" && "values" in a ? l = a.values?.length ?? 0 : a && (l = 1), l > 0 ? /* @__PURE__ */ c("span", { className: "ckds-filter-tab-badge", children: l }) : null;
             })()
@@ -68,7 +69,7 @@ function $({
       )) }),
       /* @__PURE__ */ i("div", { className: "ckds-filter-details-container", children: [
         t?.type === "range" && /* @__PURE__ */ c(
-          V,
+          C,
           {
             selectedFilter: t,
             currentVal: w,
@@ -91,7 +92,7 @@ function $({
     ] }),
     /* @__PURE__ */ i("div", { className: "ckds-filter-modal-footer", children: [
       /* @__PURE__ */ c(
-        m,
+        b,
         {
           onClick: () => f({ open: !1, type: "filter", activeOption: "" }),
           variant: "secondary",
@@ -99,9 +100,9 @@ function $({
         }
       ),
       /* @__PURE__ */ c(
-        m,
+        b,
         {
-          onClick: y,
+          onClick: v,
           variant: "primary",
           disabled: !x || !!p,
           children: "Apply"
@@ -111,5 +112,5 @@ function $({
   ] });
 }
 export {
-  $ as default
+  G as default
 };

package/dist/components/Table/_helpers/TableRows.d.ts

@@ -1,3 +1,3 @@
 import { TableRowsProps } from '../_types/table.types';
-export default function TableRows<TData>({ rows, virtualization, rowVirtualizer, handleMeasure, getEstimatedSize, lastColId, lastNonPinnedColId, tableConfig, table, selectionState, selectionConfig, onToggleRowSelection, expandableConfig, expandedIds, onToggleExpand, depth, }: TableRowsProps<TData>): import("react/jsx-runtime").JSX.Element;
+export default function TableRows<TData>({ rows, virtualization, rowVirtualizer, handleMeasure, getEstimatedSize, columnSizing, tableConfig, table, selectionState, selectionConfig, onToggleRowSelection, expandableConfig, expandedIds, onToggleExpand, depth, }: TableRowsProps<TData>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=TableRows.d.ts.map

package/dist/components/Table/_helpers/TableRows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableRows.d.ts","sourceRoot":"","sources":["../../../../lib/components/Table/_helpers/TableRows.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAiE,MAAM,uBAAuB,CAAC;AAgE3H,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,KAAK,EAAE,EACvC,IAAI,EACJ,cAAc,EACd,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,SAAS,EACT,kBAAkB,EAClB,WAAW,EACX,KAAK,EACL,cAAc,EACd,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,KAAS,GACV,EAAE,cAAc,CAAC,KAAK,CAAC,2CA4HvB"}
+{"version":3,"file":"TableRows.d.ts","sourceRoot":"","sources":["../../../../lib/components/Table/_helpers/TableRows.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAiE,MAAM,uBAAuB,CAAC;AAgG3H,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,KAAK,EAAE,EACvC,IAAI,EACJ,cAAc,EACd,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,KAAK,EACL,cAAc,EACd,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,KAAS,GACV,EAAE,cAAc,CAAC,KAAK,CAAC,2CAoHvB"}