@ck-ui/component-library 0.2.0 → 1.0.0

package/dist/components/CKButton/_helper/IconSlot.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import { I as m } from "../../../IconSlot-CbpGCbaA.js";
+import { I as m } from "../../../IconSlot-CFKmSU2_.js";
 export {
   m as IconSlot
 };

package/dist/components/CKButton/_helper/StandardLayout.js

@@ -1,5 +1,5 @@
 import { jsxs as d, Fragment as m, jsx as o } from "react/jsx-runtime";
-import { I as t } from "../../../IconSlot-CbpGCbaA.js";
+import { I as t } from "../../../IconSlot-CFKmSU2_.js";
 function s({
   leftIcon: i,
   rightIcon: c,

package/dist/components/CKButton/_types/button.types.d.ts

@@ -14,6 +14,8 @@ export interface BaseProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
     isSubmit?: boolean;
     fullWidth?: boolean;
     className?: string;
+    /** When true, removes min-width and renders a square icon-only button. */
+    iconOnly?: boolean;
 }
 type ButtonAsButton = BaseProps & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> & {
     href?: undefined;

package/dist/components/CKButton/_types/button.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKButton/_types/button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,WAAW,GAAG,OAAO,CAAC;AAE5E,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,CACX;IACC,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,cAAc,GAAG,SAAS,GAC7B,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC;AAEJ,KAAK,YAAY,GAAG,SAAS,GAC3B,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1D,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEJ,MAAM,MAAM,WAAW,GAAG,cAAc,GAAG,YAAY,CAAC"}
+{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKButton/_types/button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,WAAW,GAAG,OAAO,CAAC;AAE5E,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,CACX;IACC,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,cAAc,GAAG,SAAS,GAC7B,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC;AAEJ,KAAK,YAAY,GAAG,SAAS,GAC3B,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1D,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEJ,MAAM,MAAM,WAAW,GAAG,cAAc,GAAG,YAAY,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAMzD,eAAO,MAAM,QAAQ,+HA+FnB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAMzD,eAAO,MAAM,QAAQ,+HAiGnB,CAAC"}

package/dist/components/CKButton/index.js

@@ -1,72 +1,74 @@
 import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as S } from "react";
-import { s as r } from "../../IconSlot-CbpGCbaA.js";
+import { forwardRef as y } from "react";
+import { s as o } from "../../IconSlot-CFKmSU2_.js";
 import { StandardLayout as g } from "./_helper/StandardLayout.js";
 import { ComboLayout as E } from "./_helper/ComboLayout.js";
 import { mergeClasses as k } from "../../utils/mergeClasses.js";
-import { VARIANT as C, SIZE as y, ERROR as B, IS_SUBMIT as F, FULL_WIDTH as N } from "./constants.js";
-const w = S(function(A, s) {
+import { VARIANT as C, SIZE as B, ERROR as F, IS_SUBMIT as N, FULL_WIDTH as O } from "./constants.js";
+const w = y(function(A, i) {
   const {
-    variant: i = C.PRIMARY,
-    size: a = y.LARGE,
-    label: n,
+    variant: n = C.PRIMARY,
+    size: a = B.LARGE,
+    label: s,
     icons: l,
-    error: h = B.FALSE,
-    isSubmit: v = F.FALSE,
-    fullWidth: I = N.FALSE,
+    error: h = F.FALSE,
+    isSubmit: v = N.FALSE,
+    fullWidth: I = O.FALSE,
     disabled: t,
     className: L,
     href: c,
+    iconOnly: R,
     ...m
-  } = A, d = l?.left, b = l?.right, R = k(
-    r["ckds-button"],
-    r[i],
-    r[a],
-    h && r.error,
+  } = A, d = l?.left, b = l?.right, S = k(
+    o["ckds-button"],
+    o[n],
+    o[a],
+    h && o.error,
     I && "ckds-w-full",
+    R && o["icon-only"],
     L
-  ), f = i === C.COMBO ? /* @__PURE__ */ e(
+  ), f = n === C.COMBO ? /* @__PURE__ */ e(
     E,
     {
       leftIcon: d,
       rightIcon: b,
-      label: n,
+      label: s,
       size: a,
-      dividerClass: r["combo-divider"],
-      labelAreaClass: r["combo-label-area"],
-      labelAreaWithDividerClass: r["combo-label-area-with-divider"],
-      iconAreaClass: r["combo-icon-area"]
+      dividerClass: o["combo-divider"],
+      labelAreaClass: o["combo-label-area"],
+      labelAreaWithDividerClass: o["combo-label-area-with-divider"],
+      iconAreaClass: o["combo-icon-area"]
     }
   ) : /* @__PURE__ */ e(
     g,
     {
       leftIcon: d,
       rightIcon: b,
-      label: n,
+      label: s,
       size: a
     }
   ), u = {
-    className: R
+    className: S
   };
   if (c) {
-    const o = m;
+    const r = m;
     return /* @__PURE__ */ e(
       "a",
       {
         ...u,
-        ref: s,
+        ref: i,
         href: t ? void 0 : c,
         "aria-disabled": t || void 0,
-        target: o.target,
-        rel: o.target === "_blank" ? o.rel ?? "noopener noreferrer" : o.rel,
+        target: r.target,
+        rel: r.target === "_blank" ? r.rel ?? "noopener noreferrer" : r.rel,
         onClick: (p) => {
           if (t) {
             p.preventDefault();
             return;
           }
-          o.onClick?.(p);
+          r.onClick?.(p);
         },
-        ...o,
+        ...r,
         children: f
       }
     );
@@ -75,7 +77,7 @@ const w = S(function(A, s) {
     "button",
     {
       ...u,
-      ref: s,
+      ref: i,
       type: v ? "submit" : "button",
       disabled: t,
       ...m,

package/dist/components/CKCheckbox/_types/type.d.ts

@@ -1,7 +1,11 @@
+import { default as React } from 'react';
 type sizes = "sm" | "md" | "lg";
 export interface DSCheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "onChange"> {
     checked: boolean;
+    /** When true, shows a partial/indeterminate state (dash icon) */
+    indeterminate?: boolean;
     wrapperClassName?: string;
+    classname?: string;
     onChange?: (val: boolean) => void;
     size?: sizes;
 }

package/dist/components/CKCheckbox/_types/type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKCheckbox/_types/type.ts"],"names":[],"mappings":"AAAA,KAAK,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhC,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,UAAU,CACpB;IACC,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC;CACd"}
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKCheckbox/_types/type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhC,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,UAAU,CACpB;IACC,OAAO,EAAE,OAAO,CAAC;IACjB,iEAAiE;IACjE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC;CACd"}

package/dist/components/CKCheckbox/index.d.ts

@@ -1,3 +1,3 @@
 import { DSCheckboxProps } from './_types/type';
-export declare function CKCheckbox({ checked, onChange, wrapperClassName, className, disabled, size, ...restProps }: DSCheckboxProps): import("react/jsx-runtime").JSX.Element;
+export declare function CKCheckbox({ checked, indeterminate, onChange, wrapperClassName, classname, disabled, size, ...restProps }: DSCheckboxProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKCheckbox/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrD,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,gBAAqB,EACrB,SAAc,EACd,QAAgB,EAChB,IAAS,EACT,GAAG,SAAS,EACb,EAAE,eAAe,2CAwBjB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKCheckbox/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrD,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,aAAqB,EACrB,QAAQ,EACR,gBAAqB,EACrB,SAAc,EACd,QAAgB,EAChB,IAAS,EACT,GAAG,SAAS,EACb,EAAE,eAAe,2CAgDjB"}

package/dist/components/CKCheckbox/index.js

@@ -1,44 +1,60 @@
 import { jsxs as b, jsx as e } from "react/jsx-runtime";
-import { LG as t } from "../../constants.js";
-import '../../assets/index-DAtOlGx5.css';const c = {
-  "ckds-checkbox-wrapper": "_ckds-checkbox-wrapper_9rogj_1",
-  "ckds-checkbox": "_ckds-checkbox_9rogj_1",
-  "ckds-checkbox-sm": "_ckds-checkbox-sm_9rogj_49",
-  "ckds-checkbox-md": "_ckds-checkbox-md_9rogj_53",
-  "ckds-checkbox-tick": "_ckds-checkbox-tick_9rogj_58"
+import { useRef as p, useLayoutEffect as m } from "react";
+import { LG as _ } from "../../constants.js";
+import { mergeClasses as x } from "../../utils/mergeClasses.js";
+import '../../assets/index-rrYSS2rl.css';const c = {
+  "ckds-checkbox-wrapper": "_ckds-checkbox-wrapper_2erx7_1",
+  "ckds-checkbox": "_ckds-checkbox_2erx7_1",
+  "ckds-checkbox-sm": "_ckds-checkbox-sm_2erx7_63",
+  "ckds-checkbox-md": "_ckds-checkbox-md_2erx7_67",
+  "ckds-checkbox-tick": "_ckds-checkbox-tick_2erx7_72",
+  "ckds-checkbox-indeterminate": "_ckds-checkbox-indeterminate_2erx7_99"
 };
-function i({
+function w({
   checked: o,
-  onChange: s,
-  wrapperClassName: r = "",
-  className: h = "",
-  disabled: d = !1,
-  size: x = t,
-  ...a
+  indeterminate: s = !1,
+  onChange: t,
+  wrapperClassName: d = "",
+  classname: h = "",
+  disabled: a = !1,
+  size: i = _,
+  ...n
 }) {
-  return /* @__PURE__ */ b(
+  const k = p(null);
+  return m(() => {
+    k.current && (k.current.indeterminate = s, k.current.checked = !!o);
+  }, [s, o]), /* @__PURE__ */ b(
     "label",
     {
-      className: `${c["ckds-checkbox-wrapper"]} ${c[r]}`,
+      className: x(
+        c["ckds-checkbox-wrapper"],
+        c[d]
+      ),
       children: [
         /* @__PURE__ */ e(
           "input",
           {
+            ref: k,
             type: "checkbox",
             checked: o,
-            onChange: (k) => {
-              s?.(k.target.checked);
+            onChange: (r) => {
+              t?.(r.target.checked);
             },
-            onClick: (k) => k.stopPropagation(),
-            disabled: d,
-            ...a
+            onClick: (r) => r.stopPropagation(),
+            disabled: a,
+            ...n
           }
         ),
         /* @__PURE__ */ e(
           "span",
           {
-            className: `${c["ckds-checkbox"]} ${c[`ckds-checkbox-${x}`]} ${c[h]}`,
-            children: /* @__PURE__ */ e("svg", { className: c["ckds-checkbox-tick"], viewBox: "0 0 16 16", children: /* @__PURE__ */ e("path", { d: "M4 8.5L7 11.5L12 5.5" }) })
+            className: x(
+              c["ckds-checkbox"],
+              c[`ckds-checkbox-${i}`],
+              s && c["ckds-checkbox-indeterminate"],
+              h
+            ),
+            children: s ? /* @__PURE__ */ e("svg", { className: c["ckds-checkbox-tick"], viewBox: "0 0 16 16", children: /* @__PURE__ */ e("path", { d: "M4 8H12" }) }) : /* @__PURE__ */ e("svg", { className: c["ckds-checkbox-tick"], viewBox: "0 0 16 16", children: /* @__PURE__ */ e("path", { d: "M4 8.5L7 11.5L12 5.5" }) })
           }
         )
       ]
@@ -46,5 +62,5 @@ function i({
   );
 }
 export {
-  i as CKCheckbox
+  w as CKCheckbox
 };

package/dist/components/CKTag/_types/type.d.ts

@@ -5,7 +5,7 @@ type Shapes = "rounded" | "pill";
 export interface CKTagProps extends React.HTMLAttributes<HTMLSpanElement> {
     variation: CKTagVariation;
     children: React.ReactNode;
-    className?: string;
+    classname?: string;
     size?: sizes;
     fill?: FillVariants;
     shape?: Shapes;

package/dist/components/CKTag/_types/type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKTag/_types/type.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AACjD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AACnF,KAAK,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AACjD,KAAK,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;AAEjC,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IACvE,SAAS,EAAE,cAAc,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAGD,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAMzD,CAAC"}
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../lib/components/CKTag/_types/type.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AACjD,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,QAAQ,GACR,SAAS,GACT,SAAS,GACT,MAAM,CAAC;AACX,KAAK,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AACjD,KAAK,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;AAEjC,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IACvE,SAAS,EAAE,cAAc,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAGD,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAMzD,CAAC"}

package/dist/components/CKTag/index.d.ts

@@ -1,3 +1,3 @@
 import { CKTagProps } from './_types/type';
-export declare function CKTag({ variation, children, className, size, fill, shape, ...restProps }: CKTagProps): import("react/jsx-runtime").JSX.Element;
+export declare function CKTag({ variation, children, classname, size, fill, shape, ...restProps }: CKTagProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKTag/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,UAAU,EAEhB,MAAM,eAAe,CAAC;AAGvB,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,SAAc,EACd,IAAa,EACb,IAAY,EACZ,KAAe,EACf,GAAG,SAAS,EACb,EAAE,UAAU,2CAqBZ"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/CKTag/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,UAAU,EAEhB,MAAM,eAAe,CAAC;AAGvB,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,SAAc,EACd,IAAa,EACb,IAAY,EACZ,KAAe,EACf,GAAG,SAAS,EACb,EAAE,UAAU,2CA6BZ"}

package/dist/components/CKTag/index.js

@@ -1,41 +1,50 @@
 import { jsx as d } from "react/jsx-runtime";
-import { SOLID as u, MEDIUM as o, ROUNDED as m, SMALL as g, LARGE as p } from "../../constants.js";
-import { statusClassMap as $ } from "./_types/type.js";
-import '../../assets/index-Bo4Tx8px.css';const k = "_small_9itnf_13", C = "_soft_9itnf_13", D = "_outline_9itnf_17", L = "_solid_9itnf_21", M = "_medium_9itnf_25", w = "_large_9itnf_37", E = "_rounded_9itnf_63", S = "_pill_9itnf_67", x = "_neutral_9itnf_72", y = "_success_9itnf_89", A = "_danger_9itnf_106", I = "_info_9itnf_123", N = "_warning_9itnf_140", n = {
+import { ROUNDED as m, MEDIUM as o, SOLID as u, SMALL as g, LARGE as p } from "../../constants.js";
+import { mergeClasses as k } from "../../utils/mergeClasses.js";
+import { statusClassMap as C } from "./_types/type.js";
+import '../../assets/index-Bo4Tx8px.css';const D = "_small_9itnf_13", L = "_soft_9itnf_13", M = "_outline_9itnf_17", w = "_solid_9itnf_21", E = "_medium_9itnf_25", S = "_large_9itnf_37", x = "_rounded_9itnf_63", y = "_pill_9itnf_67", A = "_neutral_9itnf_72", I = "_success_9itnf_89", N = "_danger_9itnf_106", O = "_info_9itnf_123", R = "_warning_9itnf_140", n = {
   "ckds-tag": "_ckds-tag_9itnf_1",
-  small: k,
-  soft: C,
-  outline: D,
-  solid: L,
-  medium: M,
-  large: w,
-  rounded: E,
-  pill: S,
-  neutral: x,
-  success: y,
-  danger: A,
-  info: I,
-  warning: N
+  small: D,
+  soft: L,
+  outline: M,
+  solid: w,
+  medium: E,
+  large: S,
+  rounded: x,
+  pill: y,
+  neutral: A,
+  success: I,
+  danger: N,
+  info: O,
+  warning: R
 };
-function b({
+function K({
   variation: s,
   children: i,
-  className: e = "",
+  classname: e = "",
   size: _ = o,
   fill: l = u,
-  shape: c = m,
-  ...r
+  shape: r = m,
+  ...c
 }) {
-  const a = $[s] || s || "neutral", f = (t) => t === g ? "ckcl-cap-med" : t === o || t === p ? "ckds-body-sm-med" : "";
+  const a = C[s] || s || "neutral", f = (t) => t === g ? "ckcl-cap-med" : t === o || t === p ? "ckds-body-sm-med" : "";
   return /* @__PURE__ */ d(
     "div",
     {
-      className: `${n["ckds-tag"]} ${n[a]} ${n[l]} ${n[_]} ${f(_)} ${n[c]} ${e}`,
-      ...r,
+      className: k(
+        n["ckds-tag"],
+        n[a],
+        n[l],
+        n[_],
+        f(_),
+        n[r],
+        e
+      ),
+      ...c,
       children: i
     }
   );
 }
 export {
-  b as CKTag
+  K as CKTag
 };

package/dist/components/CostComparatorTable/_helpers/CostCell.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+import { CompareValues, FormatValue } from '../_types/costComparatorTable.types';
+interface CostCellProps<TRow> {
+    /** The comparator column key this cell belongs to. */
+    columnKey: string;
+    /** Index of this column inside the full ordered list of comparator columns. */
+    columnIndex: number;
+    /** The full ordered list of comparator column keys (used for non-comparator mode adjacency). */
+    orderedKeys: string[];
+    /** Original row, used to fetch sibling values for diff coloring. */
+    row: TRow;
+    /** The accessor used to read the row's value map (e.g. "costDates"). */
+    valueMapKey: string;
+    /** Current cell value. */
+    value: number | undefined;
+    /** Comparator mode toggle. */
+    comparatorMode: boolean;
+    /** Currently selected (and chronologically sorted) header keys. */
+    selected: string[];
+    /** Consumer-supplied formatter. */
+    formatValue: FormatValue<TRow>;
+    /** Consumer-supplied diff-class resolver. */
+    compareValues: CompareValues;
+    /** Column text alignment, forwarded from the column definition. */
+    align?: "left" | "center" | "right";
+}
+/**
+ * Body cell wrapper that handles:
+ *   • Comparator mode dim/disable styling.
+ *   • Diff coloring vs. the previous selected (or adjacent) column.
+ *   • Delegating value rendering to the consumer's `formatValue`.
+ *
+ * The library never produces color classes itself — `compareValues` is what
+ * chooses them. We just apply the returned class to the cell wrapper.
+ */
+export declare function CostCell<TRow extends Record<string, unknown>>({ columnKey, columnIndex, orderedKeys, row, valueMapKey, value, comparatorMode, selected, formatValue, compareValues, align, }: CostCellProps<TRow>): ReactNode;
+export {};
+//# sourceMappingURL=CostCell.d.ts.map

package/dist/components/CostComparatorTable/_helpers/CostCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CostCell.d.ts","sourceRoot":"","sources":["../../../../lib/components/CostComparatorTable/_helpers/CostCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAEtF,UAAU,aAAa,CAAC,IAAI;IAC1B,sDAAsD;IACtD,SAAS,EAAE,MAAM,CAAC;IAClB,+EAA+E;IAC/E,WAAW,EAAE,MAAM,CAAC;IACpB,gGAAgG;IAChG,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,oEAAoE;IACpE,GAAG,EAAE,IAAI,CAAC;IACV,wEAAwE;IACxE,WAAW,EAAE,MAAM,CAAC;IACpB,0BAA0B;IAC1B,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,8BAA8B;IAC9B,cAAc,EAAE,OAAO,CAAC;IACxB,mEAAmE;IACnE,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,mCAAmC;IACnC,WAAW,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IAC/B,6CAA6C;IAC7C,aAAa,EAAE,aAAa,CAAC;IAC7B,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAC7D,SAAS,EACT,WAAW,EACX,WAAW,EACX,GAAG,EACH,WAAW,EACX,KAAK,EACL,cAAc,EACd,QAAQ,EACR,WAAW,EACX,aAAa,EACb,KAAK,GACN,EAAE,aAAa,CAAC,IAAI,CAAC,GAAG,SAAS,CAoCjC"}

package/dist/components/CostComparatorTable/_helpers/CostCell.js

@@ -0,0 +1,54 @@
+import { jsx as N } from "react/jsx-runtime";
+import "react";
+import { s as d } from "../../../styles.module-BXby6f8d.js";
+import { mergeClasses as g } from "../../../utils/mergeClasses.js";
+import { pickPrecision as V } from "../_utils/costComparator.utils.js";
+function O({
+  columnKey: s,
+  columnIndex: e,
+  orderedKeys: n,
+  row: t,
+  valueMapKey: r,
+  value: b,
+  comparatorMode: x,
+  selected: o,
+  formatValue: C,
+  compareValues: p,
+  align: k
+}) {
+  const i = Number(b ?? 0), m = V(i);
+  let l = "", a = !1;
+  if (x)
+    if (!o.includes(s))
+      a = !0;
+    else {
+      const c = o.indexOf(s);
+      if (c > 0) {
+        const f = o[c - 1], v = u(t, r, f);
+        l = p(i, v, m);
+      }
+    }
+  else if (e > 0) {
+    const c = n[e - 1], f = u(t, r, c);
+    l = p(i, f, m);
+  }
+  return /* @__PURE__ */ N(
+    "span",
+    {
+      className: g(
+        d["ckds-cost-cell"],
+        a ? d["ckds-disabled"] : "",
+        l
+      ),
+      style: { textAlign: k },
+      children: C(i, t, s)
+    }
+  );
+}
+function u(s, e, n) {
+  const r = s[e];
+  return Number(r?.[n] ?? 0);
+}
+export {
+  O as CostCell
+};

package/dist/components/CostComparatorTable/_helpers/HeaderCheckbox.d.ts

@@ -0,0 +1,14 @@
+interface HeaderCheckboxProps {
+    label: string;
+    checked: boolean;
+    disabled: boolean;
+    onToggle: () => void;
+}
+/**
+ * Header content used while comparator mode is on.
+ * Renders a checkbox alongside the label and dims the whole header
+ * when the column is unselected.
+ */
+export declare function HeaderCheckbox({ label, checked, disabled, onToggle }: HeaderCheckboxProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=HeaderCheckbox.d.ts.map

package/dist/components/CostComparatorTable/_helpers/HeaderCheckbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderCheckbox.d.ts","sourceRoot":"","sources":["../../../../lib/components/CostComparatorTable/_helpers/HeaderCheckbox.tsx"],"names":[],"mappings":"AAGA,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,mBAAmB,2CAWzF"}

package/dist/components/CostComparatorTable/_helpers/HeaderCheckbox.js

@@ -0,0 +1,19 @@
+import { jsxs as d, jsx as s } from "react/jsx-runtime";
+import { CKCheckbox as h } from "../../CKCheckbox/index.js";
+import { s as e } from "../../../styles.module-BXby6f8d.js";
+function l({ label: c, checked: r, disabled: a, onToggle: o }) {
+  return /* @__PURE__ */ d("span", { className: `${e["ckds-header-checkbox"]} ${a ? e["ckds-disabled"] : ""}`, children: [
+    /* @__PURE__ */ s(
+      h,
+      {
+        checked: r,
+        onChange: o,
+        size: "md"
+      }
+    ),
+    /* @__PURE__ */ s("span", { className: e["ckds-header-checkbox-label"], children: c })
+  ] });
+}
+export {
+  l as HeaderCheckbox
+};

package/dist/components/CostComparatorTable/_types/costComparatorTable.types.d.ts

@@ -0,0 +1,90 @@
+import { ReactNode } from 'react';
+/**
+ * One date / period column the user can compare across.
+ * `key` is the lookup key used inside each row's value map (e.g. "01-Jan").
+ * `label` is what is shown in the header cell.
+ * `align` controls text alignment for the header and cells of this column.
+ */
+export interface ComparatorColumn {
+    key: string;
+    label?: string;
+    /** Text alignment for the column header and cells. Defaults to "left". */
+    align?: "left" | "center" | "right";
+}
+/**
+ * Granularity hint. Used by the default header sorter to parse keys
+ * like "01-Jan", "01-Jan-07-Jan", "Jan-2025".
+ * Pass any string the consumer wants — only the three built-ins are sorted
+ * automatically; everything else falls back to lexical/insertion order.
+ */
+export type Granularity = "Daily" | "Weekly" | "Monthly" | (string & {});
+/**
+ * Renders the value inside a cell (body or footer total).
+ * Stays in the consumer so number formatting / currency / locale stay there.
+ *
+ * @param value     The raw numeric value from the row (or footer total).
+ * @param row       The original row passed in `data` (undefined for footer cells).
+ * @param columnKey The comparator column key (or "__total" / "__group" for fixed cols).
+ */
+export type FormatValue<TRow> = (value: number, row: TRow | undefined, columnKey: string) => ReactNode;
+/**
+ * Returns a CSS class name describing how `current` differs from `previous`.
+ * The library applies this class to the cell wrapper — it never decides colors itself.
+ *
+ * @param current   Current cell value.
+ * @param previous  Value of the previous selected (or adjacent) column.
+ * @param precision Suggested decimal precision (0 for big values, 2 for small).
+ */
+export type CompareValues = (current: number, previous: number, precision: number) => string;
+export interface CostComparatorTableProps<TRow extends Record<string, unknown>> {
+    /** Source rows. */
+    data: TRow[];
+    /** Ordered list of date/period columns to render between group and total. */
+    comparatorColumns: ComparatorColumn[];
+    /** Field on each row that holds the row's display label (e.g. "groupValue"). */
+    groupKey: keyof TRow;
+    /** Field on each row that holds the row total (e.g. "totalCost"). */
+    totalKey: keyof TRow;
+    /** Field on each row that holds the per-column value map (e.g. "costDates"). */
+    valueKey: keyof TRow;
+    /** Header text for the first (group) column. Defaults to "Service". */
+    serviceHeader?: string;
+    /** Label for the first cell of the totals row. Defaults to "Total". */
+    footerTotalKey?: string;
+    /** Hint used to sort selected headers chronologically. */
+    granularity?: Granularity;
+    /**
+     * Format any numeric value into the cell. The library does not format numbers itself.
+     */
+    formatValue: FormatValue<TRow>;
+    /**
+     * Return a class name that styles the diff between current and previous values.
+     * The class is applied to the cell wrapper.
+     */
+    compareValues: CompareValues;
+    /** Optional legend (e.g. ColorCode component) rendered next to the toggle. */
+    legend?: ReactNode;
+    /** Optional override for the toggle label. */
+    toggleLabel?: string;
+    /** Forwarded to CustomTable. */
+    maxHeight?: string;
+    /** Forwarded to CustomTable. Defaults to false (cost grids are usually small). */
+    virtualization?: boolean;
+    /** Sticky behaviour. Defaults to first + last (group + total). */
+    stickyStart?: "none" | "first" | "firstTwo";
+    stickyEnd?: "none" | "last";
+    /** Text alignment for the group (service) column. Defaults to "left". */
+    groupColumnAlign?: "left" | "center" | "right";
+    /** Text alignment for the total column. Defaults to "left". */
+    totalColumnAlign?: "left" | "center" | "right";
+}
+/**
+ * Shape of every row CustomTable actually receives after we flatten.
+ * Internal — not exported from the library entry point.
+ */
+export interface FlatComparatorRow<TRow> extends Record<string, unknown> {
+    __group: unknown;
+    __total: number;
+    __original: TRow;
+}
+//# sourceMappingURL=costComparatorTable.types.d.ts.map

package/dist/components/CostComparatorTable/_types/costComparatorTable.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"costComparatorTable.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/CostComparatorTable/_types/costComparatorTable.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAEzE;;;;;;;GAOG;AACH,MAAM,MAAM,WAAW,CAAC,IAAI,IAAI,CAC9B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,IAAI,GAAG,SAAS,EACrB,SAAS,EAAE,MAAM,KACd,SAAS,CAAC;AAEf;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG,CAC1B,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,MAAM,KACd,MAAM,CAAC;AAEZ,MAAM,WAAW,wBAAwB,CAAC,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC5E,mBAAmB;IACnB,IAAI,EAAE,IAAI,EAAE,CAAC;IAEb,6EAA6E;IAC7E,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IAEtC,gFAAgF;IAChF,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,qEAAqE;IACrE,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,gFAAgF;IAChF,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,uEAAuE;IACvE,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,WAAW,CAAC;IAE1B;;OAEG;IACH,WAAW,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IAE/B;;;OAGG;IACH,aAAa,EAAE,aAAa,CAAC;IAE7B,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,gCAAgC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,kFAAkF;IAClF,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,kEAAkE;IAClE,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B,yEAAyE;IACzE,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAE/C,+DAA+D;IAC/D,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;CAChD;AAED;;;GAGG;AACH,MAAM,WAAW,iBAAiB,CAAC,IAAI,CAAE,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACtE,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,IAAI,CAAC;CAClB"}

package/dist/components/CostComparatorTable/_types/costComparatorTable.types.js

@@ -0,0 +1 @@
+

package/dist/components/CostComparatorTable/_utils/costComparator.utils.d.ts

@@ -0,0 +1,22 @@
+import { ComparatorColumn, Granularity } from '../_types/costComparatorTable.types';
+/**
+ * Parse a header key into a comparable timestamp. Supports the three built-in
+ * granularities. Anything else returns NaN (callers fall back to insertion order).
+ *
+ * Note: this is a small, dependency-free parser. It deliberately doesn't pull
+ * moment/dayjs into the library bundle — keys outside the built-in formats
+ * are left to the consumer to provide pre-sorted.
+ */
+export declare function parseDateKey(key: string, granularity: Granularity): number;
+/**
+ * Sort selected header keys so cell-to-cell comparison always walks
+ * left-to-right in time order. Falls back to the original column order
+ * when keys can't be parsed.
+ */
+export declare function sortSelectedHeaders(selected: string[], granularity: Granularity, orderedColumns: ComparatorColumn[]): string[];
+/**
+ * Cost-comparator color thresholds use 2 decimals for small values
+ * and 0 for large ones. Mirrors the legacy behavior.
+ */
+export declare function pickPrecision(value: number): number;
+//# sourceMappingURL=costComparator.utils.d.ts.map