@ck-ui/component-library 1.0.0 → 1.0.2

package/dist/components/Search/index.js

@@ -1,10 +1,10 @@
-import { jsxs as K, jsx as t } from "react/jsx-runtime";
-import { useState as w, useRef as g, useEffect as m, useMemo as L } from "react";
+import { jsxs as K, jsx as c } from "react/jsx-runtime";
+import { useState as y, useRef as f, useEffect as l, useMemo as L } from "react";
 import { S as R } from "../../search-B_cup-NN.js";
 import { S as V } from "../../cancel-BAgTEOGD.js";
-import { SMALL as A, MEDIUM as B } from "../../constants.js";
-import { mergeClasses as S } from "../../utils/mergeClasses.js";
-import '../../assets/index-BoQKDmZt.css';const a = {
+import { SMALL as A, MEDIUM as P } from "../../constants.js";
+import { mergeClasses as D } from "../../utils/mergeClasses.js";
+import '../../assets/index-BoQKDmZt.css';const t = {
   "ckds-search-wrapper": "_ckds-search-wrapper_mt85e_1",
   "search-wrapper-small": "_search-wrapper-small_mt85e_35",
   "search-wrapper-medium": "_search-wrapper-medium_mt85e_38",
@@ -14,86 +14,88 @@ import '../../assets/index-BoQKDmZt.css';const a = {
   "search-input": "_search-input_mt85e_66",
   "search-clear": "_search-clear_mt85e_85"
 };
-function J({
-  value: o = "",
-  placeholder: y = "Search",
-  onChange: u,
-  onClear: b,
-  onSearch: k,
-  disabled: p = !1,
-  showClearBtn: C = !0,
-  wrapperClassName: D = "",
-  inputClassName: v = "",
-  autoFocus: h = !1,
-  maxLength: x,
-  id: T,
-  name: I,
-  size: s = "medium",
-  debounceMs: f = 0
+function O({
+  value: p = "",
+  placeholder: k = "Search",
+  onChange: i,
+  onClear: C,
+  onSearch: b,
+  disabled: a = !1,
+  showClearBtn: v = !0,
+  wrapperClassName: x = "",
+  inputClassName: T = "",
+  autoFocus: _ = !1,
+  maxLength: I,
+  id: M,
+  name: N,
+  size: n = "medium",
+  debounceMs: d = 0
 }) {
-  const [M, _] = w(!1), [c, i] = w(o), l = g(null), r = g(null);
-  m(() => {
-    i(o);
-  }, [o]), m(() => {
-    h && l.current?.focus();
-  }, [h]);
-  const n = L(() => s === A ? "10" : s === B ? "14" : "18", [s]), N = (e) => {
-    f > 0 ? (r.current && clearTimeout(r.current), r.current = setTimeout(() => u?.(e), f)) : u?.(e);
+  const [w, g] = y(!1), [s, m] = y(p), o = f(null), r = f(null), h = f(!1);
+  l(() => {
+    m(p);
+  }, [p]), l(() => {
+    _ && o.current?.focus();
+  }, [_]), l(() => {
+    a ? h.current = w : h.current && s && (o.current?.focus(), h.current = !1);
+  }, [a]);
+  const u = L(() => n === A ? "10" : n === P ? "14" : "18", [n]), E = (e) => {
+    d > 0 ? (r.current && clearTimeout(r.current), r.current = setTimeout(() => i?.(e), d)) : i?.(e);
   };
-  m(() => () => {
+  l(() => () => {
     r.current && clearTimeout(r.current);
   }, []);
-  const E = (e) => {
-    const d = e.target.value;
-    i(d), N(d);
+  const F = (e) => {
+    const S = e.target.value;
+    m(S), E(S);
   }, j = (e) => {
-    e.preventDefault(), r.current && clearTimeout(r.current), i(""), u?.(""), b?.(), l.current?.focus();
-  }, F = (e) => {
-    e.stopPropagation(), e.key === "Enter" && k?.(c);
+    e.preventDefault(), r.current && clearTimeout(r.current), m(""), i?.(""), C?.(), o.current?.focus();
+  }, B = (e) => {
+    e.stopPropagation(), e.key === "Enter" && b?.(s);
   };
   return /* @__PURE__ */ K(
     "div",
     {
-      className: S(
-        a["ckds-search-wrapper"],
-        a[`search-wrapper-${s}`],
-        p ? a["search-wrapper--disabled"] : "",
-        D
+      className: D(
+        t["ckds-search-wrapper"],
+        t[`search-wrapper-${n}`],
+        a ? t["search-wrapper--disabled"] : "",
+        x
       ),
       children: [
-        !M && !c && /* @__PURE__ */ t("span", { className: a["search-icon"], children: /* @__PURE__ */ t(R, { width: n, height: n }) }),
-        /* @__PURE__ */ t(
+        !w && !s && /* @__PURE__ */ c("span", { className: t["search-icon"], children: /* @__PURE__ */ c(R, { width: u, height: u }) }),
+        /* @__PURE__ */ c(
           "input",
           {
-            ref: l,
-            id: T,
-            name: I,
+            ref: o,
+            id: M,
+            name: N,
             type: "text",
-            className: S(
+            className: D(
               "ckds-body-sm-reg",
-              a["search-input"],
-              v
+              t["search-input"],
+              T
             ),
-            value: c,
-            placeholder: y,
-            disabled: p,
-            maxLength: x,
-            onChange: E,
-            onKeyDown: F,
-            onFocus: () => _(!0),
-            onBlur: () => _(!1)
+            value: s,
+            placeholder: k,
+            disabled: a,
+            maxLength: I,
+            onChange: F,
+            onKeyDown: B,
+            onFocus: () => g(!0),
+            onBlur: () => g(!1)
           }
         ),
-        C && c && !p && /* @__PURE__ */ t(
+        v && s && !a && /* @__PURE__ */ c(
           "button",
           {
             type: "button",
-            className: a["search-clear"],
+            className: t["search-clear"],
             onMouseDown: (e) => e.preventDefault(),
             onClick: j,
             "aria-label": "Clear search",
             tabIndex: 0,
-            children: /* @__PURE__ */ t(V, { width: n, height: n })
+            children: /* @__PURE__ */ c(V, { width: u, height: u })
           }
         )
       ]
@@ -101,5 +103,5 @@ function J({
   );
 }
 export {
-  J as Search
+  O as Search
 };

package/dist/components/SingleSelectDropdown/_helpers/DropdownFooter.js

@@ -1,12 +1,12 @@
 import "react/jsx-runtime";
-import { D as v } from "../../../DropdownFooter-CYkg2g5d.js";
+import { D as v } from "../../../DropdownFooter-CsDll1Tj.js";
 import "../../Avatar/index.js";
 import "../../CKButton/index.js";
 import "../../IconButton/index.js";
 import "../../Stepper/index.js";
 import "react";
-import "../../../index-C8cPPHJD.js";
-import '../../../assets/theme-gJHYUL9y.css';import '../../../assets/styles-Bqfs9eXV.css';import '../../../assets/styles-BTZL03H2.css';import '../../../assets/styles-D8sahtFb.css';import '../../../assets/ReactToastify-tlSLHgLC.css';/* empty css                              */
+import "../../../index-BR6M9zUI.js";
+import '../../../assets/theme-gJHYUL9y.css';import '../../../assets/styles-DngCqCGW.css';import '../../../assets/styles-DLJzdWsF.css';import '../../../assets/styles-O-5pBCak.css';import '../../../assets/ReactToastify-GNLSjkBZ.css';/* empty css                              */
 import "../../GroupedMultiSelect/_helpers/TagContent.js";
 import "../../GroupedMultiSelect/_helpers/OptionRow.js";
 import "../../GroupedSingleSelect/_helpers/OptionRow.js";

package/dist/components/SingleSelectDropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/SingleSelectDropdown/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAO7E,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,KAAY,EACZ,QAAQ,EACR,KAAK,EACL,WAAsB,EACtB,UAAU,EACV,QAAgB,EAChB,UAAiB,EACjB,eAAsB,EACtB,SAAc,EACd,SAAiB,EACjB,KAAU,GACX,EAAE,iBAAiB,2CAoKnB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/SingleSelectDropdown/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAS7E,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,KAAY,EACZ,QAAQ,EACR,KAAK,EACL,WAAsB,EACtB,UAAU,EACV,QAAgB,EAChB,UAAiB,EACjB,eAAsB,EACtB,SAAc,EACd,SAAiB,EACjB,KAAU,GACX,EAAE,iBAAiB,2CAyKnB"}

package/dist/components/SingleSelectDropdown/index.js

@@ -1,17 +1,17 @@
-import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import { useState as d, useRef as g, useMemo as T, useEffect as y } from "react";
-import { s as r, D as V } from "../../DropdownFooter-CYkg2g5d.js";
-import { S as A } from "../../chevron-down-Cm9R64Fe.js";
-import { S as B } from "../../info-icon-ooYw3va_.js";
+import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import { useState as d, useRef as g, useMemo as V, useEffect as D } from "react";
+import { s as e, D as A } from "../../DropdownFooter-CsDll1Tj.js";
+import { S as M } from "../../chevron-down-Cm9R64Fe.js";
+import { S as q } from "../../info-icon-ooYw3va_.js";
 import "../Avatar/index.js";
 import "../CKButton/index.js";
 import "../IconButton/index.js";
 import "../Stepper/index.js";
-import { Tooltip as M } from "../Tooltip/index.js";
-import "../../index-C8cPPHJD.js";
-import '../../assets/theme-gJHYUL9y.css';import '../../assets/styles-Bqfs9eXV.css';import '../../assets/styles-BTZL03H2.css';import '../../assets/styles-D8sahtFb.css';import '../../assets/ReactToastify-tlSLHgLC.css';/* empty css                           */
-import { RadioButton as q } from "../RadioButton/index.js";
-import { Search as G } from "../Search/index.js";
+import { Tooltip as G } from "../Tooltip/index.js";
+import "../../index-BR6M9zUI.js";
+import '../../assets/theme-gJHYUL9y.css';import '../../assets/styles-DngCqCGW.css';import '../../assets/styles-DLJzdWsF.css';import '../../assets/styles-O-5pBCak.css';import '../../assets/ReactToastify-GNLSjkBZ.css';/* empty css                           */
+import { RadioButton as H } from "../RadioButton/index.js";
+import { Search as J } from "../Search/index.js";
 import "../GroupedMultiSelect/_helpers/TagContent.js";
 import "../GroupedMultiSelect/_helpers/OptionRow.js";
 import "../GroupedSingleSelect/_helpers/OptionRow.js";
@@ -23,133 +23,138 @@ import "../Loader/index.js";
 /* empty css                    */
 import "../MultiSelect/_helpers/TagContent.js";
 import "../MultiSelect/_helpers/OptionRow.js";
+import { useDropdownDirection as K } from "../MultiSelect/_utils/useDropdownDirection.js";
 import "../ProfileDropdown/index.js";
 import "../MAVDropdown/index.js";
 /* empty css                   */
 import "../FusionChart/index.js";
-function Ce({
+function ge({
   options: u,
-  value: o = null,
-  onChange: D,
-  label: v,
+  value: t = null,
+  onChange: y,
+  label: N,
   placeholder: O = "Select",
-  helperText: N,
-  disabled: s = !1,
+  helperText: w,
+  disabled: n = !1,
   searchable: k = !0,
   showClearButton: x = !0,
   className: I = "",
   mandatory: L = !1,
   width: b = ""
 }) {
-  const [a, c] = d(!1), [h, i] = d(""), [f, m] = d(o), C = g(null), S = g(null), [R, E] = d(!1), n = u.find((e) => e.value === o), $ = T(() => u.filter(
-    (e) => e.label.toLowerCase().includes(h.toLowerCase())
-  ), [h, u]), W = (e) => {
-    m?.(e);
-  }, j = () => {
-    m(null);
-  }, z = () => {
-    D?.(f), c(!1);
+  const [l, c] = d(!1), [h, i] = d(""), [f, p] = d(t), v = g(null), { vertical: R, horizontal: j } = K(v, l), C = g(null), [z, E] = d(!1), a = u.find((r) => r.value === t), S = V(() => u.filter(
+    (r) => r.label.toLowerCase().includes(h.toLowerCase())
+  ), [h, u]), W = (r) => {
+    p?.(r);
+  }, B = () => {
+    p(null);
   }, F = () => {
-    m(o), c(!1), i("");
+    y?.(f), c(!1);
+  }, T = () => {
+    p(t), c(!1), i("");
   };
-  return y(() => {
-    const e = (p) => {
-      C.current?.contains(p.target) || (c(!1), m(o), i(""));
+  return D(() => {
+    const r = (m) => {
+      v.current?.contains(m.target) || (c(!1), p(t), i(""));
     };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, [o]), y(() => {
-    const e = S.current;
-    if (!e) return;
-    const p = () => {
-      E(e.scrollWidth > e.clientWidth);
+    return document.addEventListener("mousedown", r), () => document.removeEventListener("mousedown", r);
+  }, [t]), D(() => {
+    const r = C.current;
+    if (!r) return;
+    const m = () => {
+      E(r.scrollWidth > r.clientWidth);
     };
-    p();
-    const w = new ResizeObserver(p);
-    return w.observe(e), () => w.disconnect();
-  }, [n?.label, b]), /* @__PURE__ */ l(
+    m();
+    const $ = new ResizeObserver(m);
+    return $.observe(r), () => $.disconnect();
+  }, [a?.label, b]), /* @__PURE__ */ s(
     "div",
     {
-      ref: C,
+      ref: v,
       style: { width: b },
-      className: `${r["ckds-single-select"]} ${s ? r.disabled : ""} ${I}`,
+      className: `${e["ckds-single-select"]} ${n ? e.disabled : ""} ${I}`,
       children: [
-        v && /* @__PURE__ */ l("label", { className: `${r.label} ${s ? r.disabled : ""}`, children: [
-          v,
-          L && /* @__PURE__ */ t("span", { className: r.mandatory, children: "*" })
+        N && /* @__PURE__ */ s("label", { className: `${e.label} ${n ? e.disabled : ""}`, children: [
+          N,
+          L && /* @__PURE__ */ o("span", { className: e.mandatory, children: "*" })
         ] }),
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ s(
           "button",
           {
             type: "button",
-            className: `${r.trigger} ${a ? r.active : ""}`,
-            onClick: () => !s && c((e) => !e),
+            className: `${e.trigger} ${l ? e.active : ""}`,
+            onClick: () => !n && c((r) => !r),
             "aria-haspopup": "listbox",
-            "aria-expanded": a,
-            disabled: s,
+            "aria-expanded": l,
+            disabled: n,
             children: [
-              /* @__PURE__ */ t(
-                M,
+              /* @__PURE__ */ o(
+                G,
                 {
-                  title: R ? n?.label : "",
+                  title: z ? a?.label : "",
                   placement: "bottom",
-                  children: /* @__PURE__ */ t(
+                  children: /* @__PURE__ */ o(
                     "span",
                     {
-                      ref: S,
-                      className: `${n ? r.value : r.placeholder} ${s ? r.disabled : ""}`,
-                      children: n ? n.label : O
+                      ref: C,
+                      className: `${a ? e.value : e.placeholder} ${n ? e.disabled : ""}`,
+                      children: a ? a.label : O
                     }
                   )
                 }
               ),
-              /* @__PURE__ */ t("span", { className: `${r.arrow} ${a ? r.open : ""}`, children: /* @__PURE__ */ t(A, {}) })
+              /* @__PURE__ */ o("span", { className: `${e.arrow} ${l ? e.open : ""}`, children: /* @__PURE__ */ o(M, {}) })
             ]
           }
         ),
-        a && /* @__PURE__ */ l("div", { className: r.dropdown, children: [
-          /* @__PURE__ */ l("div", { children: [
-            k && /* @__PURE__ */ t("div", { className: r["search-wrapper"], children: /* @__PURE__ */ t(
-              G,
+        l && /* @__PURE__ */ s("div", { className: [
+          e.dropdown,
+          e[`dropdown-align-${j}`],
+          R === "up" ? e["dropdown-up"] : ""
+        ].filter(Boolean).join(" "), children: [
+          /* @__PURE__ */ s("div", { children: [
+            k && /* @__PURE__ */ o("div", { className: e["search-wrapper"], children: /* @__PURE__ */ o(
+              J,
               {
                 value: h,
                 placeholder: "Search",
                 autoFocus: !1,
-                onChange: (e) => i(e),
+                onChange: (r) => i(r),
                 onClear: () => i(""),
-                wrapperClassName: r.searchWrapper,
-                inputClassName: r.searchInput
+                wrapperClassName: e.searchWrapper,
+                inputClassName: e.searchInput
               }
             ) }),
-            /* @__PURE__ */ t("div", { className: r.options, children: $.length === 0 ? /* @__PURE__ */ t("span", { className: r.noData, children: "0 results" }) : $.map((e) => /* @__PURE__ */ t(
-              q,
+            /* @__PURE__ */ o("div", { className: e.options, children: S.length === 0 ? /* @__PURE__ */ o("span", { className: e.noData, children: "0 results" }) : S.map((r) => /* @__PURE__ */ o(
+              H,
               {
-                label: e.label,
+                label: r.label,
                 color: "",
-                selected: f === e.value,
-                onChange: () => W(e.value)
+                selected: f === r.value,
+                onChange: () => W(r.value)
               }
             )) })
           ] }),
-          /* @__PURE__ */ t(
-            V,
+          /* @__PURE__ */ o(
+            A,
             {
-              value: o,
+              value: t,
               selectedValue: f,
               showClearButton: x,
-              onClear: j,
-              onCancel: F,
-              onApply: z
+              onClear: B,
+              onCancel: T,
+              onApply: F
             }
           )
         ] }),
-        N && /* @__PURE__ */ l("div", { className: r.helper, children: [
-          /* @__PURE__ */ t("div", { className: r["helper-icon"], children: /* @__PURE__ */ t(B, {}) }),
-          /* @__PURE__ */ t("div", { className: `${s ? r.disabled : ""}`, children: N })
+        w && /* @__PURE__ */ s("div", { className: e.helper, children: [
+          /* @__PURE__ */ o("div", { className: e["helper-icon"], children: /* @__PURE__ */ o(q, {}) }),
+          /* @__PURE__ */ o("div", { className: `${n ? e.disabled : ""}`, children: w })
         ] })
       ]
     }
   );
 }
 export {
-  Ce as SingleSelectDropdown
+  ge as SingleSelectDropdown
 };

package/dist/components/Table/_helpers/ColumnManager/ColumnConfig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnConfig.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ColumnManager/ColumnConfig.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAElE,iBAAS,YAAY,CAAC,KAAK,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,EAAE,iBAAiB,CAAC,KAAK,CAAC,2CAwFrF;AAED,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ColumnConfig.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ColumnManager/ColumnConfig.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAElE,iBAAS,YAAY,CAAC,KAAK,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,EAAE,iBAAiB,CAAC,KAAK,CAAC,2CA4FrF;AAED,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,eAAe,YAAY,CAAC"}

package/dist/components/Table/_helpers/ColumnManager/ColumnConfig.js

@@ -1,69 +1,71 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { CKCheckbox as c } from "../../../CKCheckbox/index.js";
+import { CKCheckbox as d } from "../../../CKCheckbox/index.js";
 import { Typography as l } from "../../../Typography/index.js";
-import { RadioGroup as t } from "../../../RadioGroup/index.js";
+import { RadioGroup as c } from "../../../RadioGroup/index.js";
 function h({ draftConfig: a, setDraftConfig: r }) {
   return /* @__PURE__ */ i("div", { className: "ckds-column-config-panel", children: [
     /* @__PURE__ */ e("div", { children: /* @__PURE__ */ i("label", { className: "ckds-column-config-label", children: [
       /* @__PURE__ */ e(
-        c,
+        d,
         {
           checked: a.wrapText,
           onChange: (n) => r((o) => ({
             ...o,
             wrapText: n
-          }))
+          })),
+          size: "md"
         }
       ),
-      /* @__PURE__ */ i("div", { style: { display: "flex", flexDirection: "column", gap: "4px" }, children: [
+      /* @__PURE__ */ i("div", { style: { display: "flex", flexDirection: "column", gap: "4px", marginTop: "-1px" }, children: [
         /* @__PURE__ */ e(l, { variant: "body-sm", weight: "medium", children: "Wrap Text" }),
-        /* @__PURE__ */ e(l, { variant: "caption", color: "secondary", children: "Show full content in cells instead of truncating" })
+        /* @__PURE__ */ e(l, { color: "secondary", variant: "body-xs", children: "Show full content in cells instead of truncating" })
       ] })
     ] }) }),
     /* @__PURE__ */ e("div", { style: { marginTop: "16px" }, children: /* @__PURE__ */ i("label", { className: "ckds-column-config-label", children: [
       /* @__PURE__ */ e(
-        c,
+        d,
         {
           checked: a.stripedRows,
           onChange: (n) => r((o) => ({
             ...o,
             stripedRows: n
-          }))
+          })),
+          size: "md"
         }
       ),
-      /* @__PURE__ */ i("div", { style: { display: "flex", flexDirection: "column", gap: "4px" }, children: [
+      /* @__PURE__ */ i("div", { style: { display: "flex", flexDirection: "column", gap: "4px", marginTop: "-1px" }, children: [
         /* @__PURE__ */ e(l, { variant: "body-sm", weight: "medium", children: "Zebra Striping" }),
-        /* @__PURE__ */ e(l, { variant: "caption", color: "secondary", children: "Alternate row colors for easier reading" })
+        /* @__PURE__ */ e(l, { variant: "body-xs", color: "secondary", children: "Alternate row colors for easier reading" })
       ] })
     ] }) }),
     /* @__PURE__ */ e("div", { className: "ckds-column-config-divider" }),
     /* @__PURE__ */ i("div", { style: { marginTop: "16px" }, children: [
       /* @__PURE__ */ i("div", { style: { marginBottom: "16px" }, children: [
-        /* @__PURE__ */ e(l, { variant: "body-sm", color: "secondary", children: "Pin Start Column" }),
-        /* @__PURE__ */ e(l, { variant: "caption", weight: "medium", children: "Keep columns fixed when scrolling" })
+        /* @__PURE__ */ e(l, { variant: "body-sm", weight: "medium", children: "Pin Start Column" }),
+        /* @__PURE__ */ e(l, { variant: "body-xs", color: "secondary", children: "Keep columns fixed when scrolling" })
       ] }),
       /* @__PURE__ */ e("div", { style: { marginTop: "8px" }, children: /* @__PURE__ */ e(
-        t,
+        c,
         {
           name: "stickyStart",
           value: a.stickyStart,
           onChange: (n) => r((o) => ({ ...o, stickyStart: n })),
-          size: "small",
           options: [
             { label: "None", value: "none" },
             { label: "First Column", value: "first" },
             { label: "First Two Columns", value: "firstTwo" }
-          ]
+          ],
+          gap: "8px"
         }
       ) })
     ] }),
     /* @__PURE__ */ i("div", { style: { marginTop: "16px" }, children: [
       /* @__PURE__ */ i("div", { style: { marginBottom: "16px" }, children: [
-        /* @__PURE__ */ e(l, { variant: "body-sm", color: "secondary", children: "Pin End Column" }),
-        /* @__PURE__ */ e(l, { variant: "caption", weight: "medium", children: "Keep the last column fixed while scrolling" })
+        /* @__PURE__ */ e(l, { variant: "body-sm", weight: "medium", children: "Pin End Column" }),
+        /* @__PURE__ */ e(l, { variant: "body-xs", color: "secondary", children: "Keep the last column fixed while scrolling" })
       ] }),
       /* @__PURE__ */ e("div", { style: { marginTop: "8px" }, children: /* @__PURE__ */ e(
-        t,
+        c,
         {
           name: "stickyEnd",
           value: a.stickyEnd,
@@ -72,7 +74,8 @@ function h({ draftConfig: a, setDraftConfig: r }) {
           options: [
             { label: "None", value: "none" },
             { label: "Last Column", value: "last" }
-          ]
+          ],
+          gap: "8px"
         }
       ) })
     ] })

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ColumnManager/index.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,kBAAkB,EAA0B,MAAM,0BAA0B,CAAC;AAC3F,OAAO,eAAe,CAAC;AAgEvB,iBAAS,aAAa,CAAC,KAAK,EAAE,EAC5B,WAAW,EACX,cAAc,EACd,eAAe,EACf,eAAe,EACf,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,eAAe,GAChB,EAAE,kBAAkB,CAAC,KAAK,CAAC,2CAiG3B;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Table/_helpers/ColumnManager/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,kBAAkB,EAA0B,MAAM,0BAA0B,CAAC;AAC3F,OAAO,eAAe,CAAC;AAkEvB,iBAAS,aAAa,CAAC,KAAK,EAAE,EAC5B,WAAW,EACX,cAAc,EACd,eAAe,EACf,eAAe,EACf,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,eAAe,GAChB,EAAE,kBAAkB,CAAC,KAAK,CAAC,2CAoG3B;AAED,eAAe,aAAa,CAAC"}