@ck-ui/component-library 0.1.4 → 0.2.0

package/dist/components/Stepper/_helper/StepIcon.js

@@ -0,0 +1,30 @@
+import { jsx as i } from "react/jsx-runtime";
+import * as e from "react";
+import { s as n } from "../../../styles.module-r_cdKgD9.js";
+import { STEP_STATE as r } from "../constants.js";
+import { mergeClasses as o } from "../../../utils/mergeClasses.js";
+const c = (t) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("rect", { x: 0.5, y: 0.5, width: 23, height: 23, rx: 11.5, fill: "#F8FBFF" }), /* @__PURE__ */ e.createElement("rect", { x: 0.5, y: 0.5, width: 23, height: 23, rx: 11.5, stroke: "#D9E6FB" }), /* @__PURE__ */ e.createElement("g", { clipPath: "url(#clip0_3956_2460)" }, /* @__PURE__ */ e.createElement("mask", { id: "mask0_3956_2460", style: {
+  maskType: "luminance"
+}, maskUnits: "userSpaceOnUse", x: 5, y: 5, width: 14, height: 14 }, /* @__PURE__ */ e.createElement("path", { d: "M19 5H5V19H19V5Z", fill: "white" })), /* @__PURE__ */ e.createElement("g", { mask: "url(#mask0_3956_2460)" }, /* @__PURE__ */ e.createElement("path", { d: "M13.1667 6.16666H10.25C7.33332 6.16666 6.16666 7.33333 6.16666 10.25V13.75C6.16666 16.6667 7.33332 17.8333 10.25 17.8333", stroke: "#2B2B2B", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M17.8333 10.8334V12.5834", stroke: "#2B2B2B", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M17.8333 10.8333H15.5C13.75 10.8333 13.1666 10.25 13.1666 8.50001V6.16668L17.8333 10.8333Z", stroke: "#2B2B2B", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M13.0267 15.6516C11.6558 15.7507 11.6558 17.7341 13.0267 17.8332H16.27C16.6608 17.8332 17.0458 17.6874 17.3317 17.4249C18.2942 16.5849 17.7808 14.9049 16.515 14.7474C16.06 12.0116 12.105 13.0499 13.0383 15.6574", stroke: "#2B2B2B", strokeWidth: 0.875, strokeMiterlimit: 10, strokeLinecap: "round", strokeLinejoin: "round" }))), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3956_2460" }, /* @__PURE__ */ e.createElement("rect", { width: 14, height: 14, fill: "white", transform: "translate(5 5)" })))), m = (t) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12C24 18.6274 18.6274 24 12 24C5.37258 24 0 18.6274 0 12Z", fill: "#3060C1" }), /* @__PURE__ */ e.createElement("g", { clipPath: "url(#clip0_3956_2434)" }, /* @__PURE__ */ e.createElement("mask", { id: "mask0_3956_2434", style: {
+  maskType: "luminance"
+}, maskUnits: "userSpaceOnUse", x: 5, y: 5, width: 14, height: 14 }, /* @__PURE__ */ e.createElement("path", { d: "M19 5H5V19H19V5Z", fill: "white" })), /* @__PURE__ */ e.createElement("g", { mask: "url(#mask0_3956_2434)" }, /* @__PURE__ */ e.createElement("path", { d: "M13.1667 6.16666H10.25C7.33332 6.16666 6.16666 7.33333 6.16666 10.25V13.75C6.16666 16.6667 7.33332 17.8333 10.25 17.8333", stroke: "white", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M17.8333 10.8334V12.5834", stroke: "white", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M17.8333 10.8333H15.5C13.75 10.8333 13.1666 10.25 13.1666 8.50001V6.16668L17.8333 10.8333Z", stroke: "white", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ e.createElement("path", { d: "M13.0267 15.6516C11.6558 15.7507 11.6558 17.7341 13.0267 17.8332H16.27C16.6608 17.8332 17.0458 17.6874 17.3317 17.4249C18.2942 16.5849 17.7808 14.9049 16.515 14.7474C16.06 12.0116 12.105 13.0499 13.0383 15.6574", stroke: "white", strokeWidth: 0.875, strokeMiterlimit: 10, strokeLinecap: "round", strokeLinejoin: "round" }))), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3956_2434" }, /* @__PURE__ */ e.createElement("rect", { width: 14, height: 14, fill: "white", transform: "translate(5 5)" })))), h = (t) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("rect", { width: 24, height: 24, rx: 12, fill: "#249C45" }), /* @__PURE__ */ e.createElement("g", { clipPath: "url(#clip0_3956_2449)" }, /* @__PURE__ */ e.createElement("mask", { id: "mask0_3956_2449", style: {
+  maskType: "luminance"
+}, maskUnits: "userSpaceOnUse", x: 5, y: 5, width: 14, height: 14 }, /* @__PURE__ */ e.createElement("path", { d: "M19 5H5V19H19V5Z", fill: "white" })), /* @__PURE__ */ e.createElement("g", { mask: "url(#mask0_3956_2449)" }, /* @__PURE__ */ e.createElement("path", { d: "M8.49996 12L10.8306 14.3306L15.5 9.66942", stroke: "white", strokeLinecap: "round", strokeLinejoin: "round" }))), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3956_2449" }, /* @__PURE__ */ e.createElement("rect", { width: 14, height: 14, fill: "white", transform: "translate(5 5)" }))));
+function w({
+  state: t,
+  customIcon: a
+}) {
+  const l = o(
+    n.icon,
+    t === r.ACTIVE && n["icon-active"],
+    t === r.COMPLETED && n["icon-completed"]
+  ), s = {
+    [r.COMPLETED]: /* @__PURE__ */ i(h, {}),
+    [r.PENDING]: /* @__PURE__ */ i(c, {}),
+    [r.ACTIVE]: /* @__PURE__ */ i(m, {})
+  };
+  return /* @__PURE__ */ i("span", { className: l, "aria-hidden": "true", children: a ?? s[t] });
+}
+export {
+  w as StepIcon
+};

package/dist/components/Stepper/_helper/StepText.d.ts

@@ -0,0 +1,3 @@
+import { StepItem } from '../_types/stepper.type';
+export declare function StepText({ label, heading, }: Pick<StepItem, "label" | "heading">): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StepText.d.ts.map

package/dist/components/Stepper/_helper/StepText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepText.d.ts","sourceRoot":"","sources":["../../../../lib/components/Stepper/_helper/StepText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAGvD,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,OAAO,GACR,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC,2CAOrC"}

package/dist/components/Stepper/_helper/StepText.js

@@ -0,0 +1,14 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { s } from "../../../styles.module-r_cdKgD9.js";
+function l({
+  label: t,
+  heading: a
+}) {
+  return /* @__PURE__ */ n("span", { className: s["step-text"], children: [
+    /* @__PURE__ */ e("span", { className: s["step-label"], children: t }),
+    /* @__PURE__ */ e("span", { className: s["step-heading"], children: a })
+  ] });
+}
+export {
+  l as StepText
+};

package/dist/components/Stepper/_types/stepper.type.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { STEP_STATE } from '../constants';
+export interface StepItem {
+    label: string;
+    heading: string;
+    icon?: ReactNode;
+}
+export type Orientation = "horizontal" | "vertical";
+export interface StepperProps {
+    steps: StepItem[];
+    activeStepIndex?: number;
+    orientation?: Orientation;
+    className?: string;
+}
+export type StepState = (typeof STEP_STATE)[keyof typeof STEP_STATE];
+//# sourceMappingURL=stepper.type.d.ts.map

package/dist/components/Stepper/_types/stepper.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.type.d.ts","sourceRoot":"","sources":["../../../../lib/components/Stepper/_types/stepper.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,MAAM,WAAW,GAAG,YAAY,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,OAAO,UAAU,CAAC,CAAC"}

package/dist/components/Stepper/_types/stepper.type.js

@@ -0,0 +1 @@
+

package/dist/components/Stepper/_utils/stepper.utils.d.ts

@@ -0,0 +1,4 @@
+import { StepState } from '../_types/stepper.type';
+export declare function deriveStepStatesFromActiveIndex(stepCount: number, activeStepIndex: number): StepState[];
+export declare function deriveConnectorFillsFromActiveIndex(stepCount: number, activeStepIndex: number): number[];
+//# sourceMappingURL=stepper.utils.d.ts.map

package/dist/components/Stepper/_utils/stepper.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.utils.d.ts","sourceRoot":"","sources":["../../../../lib/components/Stepper/_utils/stepper.utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAGxD,wBAAgB,+BAA+B,CAC7C,SAAS,EAAE,MAAM,EACjB,eAAe,EAAE,MAAM,GACtB,SAAS,EAAE,CAab;AAED,wBAAgB,mCAAmC,CACjD,SAAS,EAAE,MAAM,EACjB,eAAe,EAAE,MAAM,GACtB,MAAM,EAAE,CAWV"}

package/dist/components/Stepper/_utils/stepper.utils.js

@@ -0,0 +1,18 @@
+import { STEP_STATE as a } from "../constants.js";
+function l(e, c) {
+  if (e === 0) return [];
+  const t = ((n, r, m) => Math.min(m, Math.max(r, n)))(c, 0, e);
+  return Array.from({ length: e }, (n, r) => r < t ? a.COMPLETED : r === t ? a.ACTIVE : a.PENDING);
+}
+function f(e, c) {
+  if (e <= 1) return [];
+  const t = ((n, r, m) => Math.min(m, Math.max(r, n)))(c, 0, e);
+  return Array.from(
+    { length: e - 1 },
+    (n, r) => r < t ? 100 : 0
+  );
+}
+export {
+  f as deriveConnectorFillsFromActiveIndex,
+  l as deriveStepStatesFromActiveIndex
+};

package/dist/components/Stepper/constants.d.ts

@@ -0,0 +1,10 @@
+export declare const STEP_STATE: {
+    readonly PENDING: "pending";
+    readonly ACTIVE: "active";
+    readonly COMPLETED: "completed";
+};
+export declare const ORIENTATION: {
+    readonly HORIZONTAL: "horizontal";
+    readonly VERTICAL: "vertical";
+};
+//# sourceMappingURL=constants.d.ts.map

package/dist/components/Stepper/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../lib/components/Stepper/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;CAIb,CAAC;AAEX,eAAO,MAAM,WAAW;;;CAGd,CAAC"}

package/dist/components/Stepper/constants.js

@@ -0,0 +1,12 @@
+const T = {
+  PENDING: "pending",
+  ACTIVE: "active",
+  COMPLETED: "completed"
+}, E = {
+  HORIZONTAL: "horizontal",
+  VERTICAL: "vertical"
+};
+export {
+  E as ORIENTATION,
+  T as STEP_STATE
+};

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

@@ -0,0 +1,6 @@
+import { StepperProps } from './_types/stepper.type';
+export declare function Stepper({ steps, activeStepIndex, orientation, className, }: StepperProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Stepper {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Stepper/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,eAAmB,EACnB,WAAoC,EACpC,SAAS,GACV,EAAE,YAAY,2CA4Cd;yBAjDe,OAAO"}

package/dist/components/Stepper/index.js

@@ -0,0 +1,47 @@
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
+import { s as e } from "../../styles.module-r_cdKgD9.js";
+import { StepIcon as g } from "./_helper/StepIcon.js";
+import { StepText as N } from "./_helper/StepText.js";
+import { deriveStepStatesFromActiveIndex as T, deriveConnectorFillsFromActiveIndex as I } from "./_utils/stepper.utils.js";
+import { ORIENTATION as m, STEP_STATE as S } from "./constants.js";
+import { mergeClasses as v } from "../../utils/mergeClasses.js";
+function A({
+  steps: t,
+  activeStepIndex: l = 0,
+  orientation: i = m.HORIZONTAL,
+  className: p
+}) {
+  const d = T(t.length, l), h = I(t.length, l), f = v(
+    e["ckds-stepper"],
+    e[i],
+    p
+  );
+  return /* @__PURE__ */ r("ol", { className: f, "aria-label": "Progress", children: t.map((s, o) => {
+    const c = d[o], a = h[o] ?? 0;
+    return /* @__PURE__ */ n(
+      "li",
+      {
+        className: e["step-wrapper"],
+        "aria-current": c === S.ACTIVE ? "step" : void 0,
+        children: [
+          /* @__PURE__ */ n("div", { className: e.step, children: [
+            /* @__PURE__ */ r(g, { state: c, customIcon: s.icon }),
+            /* @__PURE__ */ r(N, { label: s.label, heading: s.heading })
+          ] }),
+          o < t.length - 1 && /* @__PURE__ */ r("div", { className: e.connector, "aria-hidden": "true", children: /* @__PURE__ */ r(
+            "div",
+            {
+              className: e["connector-fill"],
+              style: i === m.VERTICAL ? { height: `${a}%`, width: "100%" } : { width: `${a}%`, height: "100%" }
+            }
+          ) })
+        ]
+      },
+      o
+    );
+  }) });
+}
+A.displayName = "Stepper";
+export {
+  A as Stepper
+};

package/dist/components/Switch/index.js

@@ -1,5 +1,5 @@
 import { jsx as c, jsxs as a } from "react/jsx-runtime";
-import '../../assets/index2.css';const h = "_slider_1eh2o_13", s = {
+import '../../assets/index-fvceox3b.css';const h = "_slider_1eh2o_13", s = {
   "ckcl-switch-wrapper": "_ckcl-switch-wrapper_1eh2o_1",
   "ckcl-switch": "_ckcl-switch_1eh2o_1",
   slider: h

package/dist/components/Tab/_types/tab.types.d.ts

@@ -0,0 +1,23 @@
+interface TooltipContent {
+    title: string;
+    arrow?: boolean;
+    placement?: "top" | "right" | "left" | "bottom";
+}
+export interface TabItem {
+    value: string;
+    label?: React.ReactNode;
+    postIcon?: React.ReactNode;
+    preIcon?: React.ReactNode;
+    disabled?: boolean;
+    tooltip?: TooltipContent;
+}
+export interface TabsProps {
+    value: string;
+    items: TabItem[];
+    onChange: (value: string) => void;
+    className?: string;
+    buttonView?: boolean;
+    size?: "small" | "large";
+}
+export {};
+//# sourceMappingURL=tab.types.d.ts.map

package/dist/components/Tab/_types/tab.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/Tab/_types/tab.types.ts"],"names":[],"mappings":"AACA,UAAU,cAAc;IACpB,KAAK,EAAC,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;CACnD;AAED,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAC,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,cAAc,CAAA;CACzB;AAED,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;CAC1B"}

package/dist/components/Tab/_types/tab.types.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,3 @@
+import { TabsProps } from './_types/tab.types';
+export declare function Tabs({ value, items, onChange, className, buttonView, size, }: TabsProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Tab/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAW,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG7D,wBAAgB,IAAI,CAAC,EACnB,KAAK,EACL,KAAU,EACV,QAAQ,EACR,SAAc,EACd,UAAkB,EAClB,IAAc,GACf,EAAE,SAAS,2CAwEX"}

package/dist/components/Tab/index.js

@@ -0,0 +1,72 @@
+import { jsx as o, jsxs as p } from "react/jsx-runtime";
+import { Tooltip as f } from "../Tooltip/index.js";
+import '../../assets/index-DDdi2wxl.css';const g = "_small_ofgqk_82", u = "_large_ofgqk_85", s = {
+  "ckds-tabs": "_ckds-tabs_ofgqk_4",
+  "ckds-tab": "_ckds-tab_ofgqk_4",
+  "ckds-tab-active": "_ckds-tab-active_ofgqk_58",
+  "ckds-tab-disabled": "_ckds-tab-disabled_ofgqk_68",
+  "ckds-tab-icon": "_ckds-tab-icon_ofgqk_75",
+  "ckds-tab-label": "_ckds-tab-label_ofgqk_79",
+  small: g,
+  large: u,
+  "tab-button": "_tab-button_ofgqk_88",
+  "no-label": "_no-label_ofgqk_123"
+};
+function v({
+  value: b,
+  items: d = [],
+  onChange: e,
+  className: n = "",
+  buttonView: r = !1,
+  size: _ = "small"
+}) {
+  const k = `${s["ckds-tabs"]} ${s[_]} ${r ? s["tab-button"] : ""} ${n}`, i = (a, l) => `
+              ${s["ckds-tab"]}
+              ${a ? s["ckds-tab-active"] : ""}
+              ${l.disabled ? s["ckds-tab-disabled"] : ""}
+              ${l.label ? "" : s["no-label"]}
+            `, t = (a) => `${s["ckds-tab-icon"]} ${s[`${a}-icon`]}`;
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: k,
+      role: "tablist",
+      children: d?.map((a) => {
+        const l = a.value === b, c = /* @__PURE__ */ p(
+          "button",
+          {
+            role: "tab",
+            "aria-selected": l,
+            "aria-disabled": a?.disabled,
+            disabled: a?.disabled,
+            tabIndex: 0,
+            onClick: () => !a.disabled && e(a?.value),
+            className: i(l, a),
+            children: [
+              a?.preIcon && /* @__PURE__ */ o(
+                "span",
+                {
+                  className: t("pre"),
+                  children: a.preIcon
+                }
+              ),
+              a?.label && /* @__PURE__ */ o("span", { className: s["ckds-tab-label"], children: a.label }),
+              a?.postIcon && /* @__PURE__ */ o(
+                "span",
+                {
+                  className: t("post"),
+                  children: a.postIcon
+                }
+              )
+            ]
+          },
+          a?.value
+        );
+        return a?.tooltip ? /* @__PURE__ */ o(f, { title: a?.tooltip?.title, placement: a?.tooltip?.placement, arrow: a?.tooltip?.arrow, children: c }, a?.value) : c;
+      })
+    }
+  );
+}
+export {
+  v as Tabs
+};

package/dist/components/Tag/index.js

@@ -1,5 +1,5 @@
 import { jsx as d } from "react/jsx-runtime";
-import '../../assets/index.css';const g = "_small_1xdr6_16", o = "_medium_1xdr6_21", m = "_large_1xdr6_26", u = "_neutral_1xdr6_32", x = "_danger_1xdr6_39", i = "_success_1xdr6_46", f = "_info_1xdr6_53", k = "_warning_1xdr6_60", r = {
+import '../../assets/index-t78owPAF.css';const g = "_small_1xdr6_16", o = "_medium_1xdr6_21", m = "_large_1xdr6_26", u = "_neutral_1xdr6_32", x = "_danger_1xdr6_39", i = "_success_1xdr6_46", f = "_info_1xdr6_53", k = "_warning_1xdr6_60", r = {
   "ckcl-tag": "_ckcl-tag_1xdr6_1",
   "x-small": "_x-small_1xdr6_11",
   small: g,

package/dist/components/TextArea/_types/textArea.types.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+export interface TextAreaProps {
+    name?: string;
+    label?: string;
+    value?: string;
+    placeholder?: string;
+    error?: string;
+    helperText?: ReactNode;
+    disabled?: boolean;
+    readOnly?: boolean;
+    maxLength?: number;
+    rows?: number;
+    resize?: boolean;
+    showCounter?: boolean;
+    className?: string;
+    mandatory?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    onBlur?: (event: React.FocusEvent<HTMLTextAreaElement>) => void;
+}
+//# sourceMappingURL=textArea.types.d.ts.map

package/dist/components/TextArea/_types/textArea.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textArea.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/TextArea/_types/textArea.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,aAAa;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,KAC1C,IAAI,CAAC;IAEV,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,mBAAmB,CAAC,KACzC,IAAI,CAAC;CACX"}

package/dist/components/TextArea/_types/textArea.types.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,4 @@
+import { TextAreaProps } from './_types/textArea.types';
+declare const TextArea: ({ name, label, value, placeholder, onChange, onBlur, error, helperText, disabled, readOnly, maxLength, rows, resize, showCounter, className, mandatory, }: TextAreaProps) => import("react/jsx-runtime").JSX.Element;
+export default TextArea;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/TextArea/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAG7D,QAAA,MAAM,QAAQ,GAAI,2JAiBf,aAAa,4CAgIf,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/components/TextArea/index.js

@@ -0,0 +1,135 @@
+import { jsxs as c, jsx as o } from "react/jsx-runtime";
+import * as _ from "react";
+import { useState as d, useRef as F, useEffect as k } from "react";
+import '../../assets/index-BOXxnraF.css';const I = "_label_16th2_15", Z = "_mandatory_16th2_23", A = "_counter_16th2_32", P = "_focused_16th2_74", W = "_error_16th2_78", q = "_disabled_16th2_109", e = {
+  "ckds-text-area-wrapper": "_ckds-text-area-wrapper_16th2_1",
+  "top-section": "_top-section_16th2_9",
+  label: I,
+  mandatory: Z,
+  counter: A,
+  "text-area-container": "_text-area-container_16th2_40",
+  "text-area": "_text-area_16th2_40",
+  focused: P,
+  error: W,
+  "read-only": "_read-only_16th2_82",
+  "no-resize": "_no-resize_16th2_86",
+  "resize-icon": "_resize-icon_16th2_90",
+  "helper-text": "_helper-text_16th2_95",
+  "error-text": "_error-text_16th2_102",
+  disabled: q
+}, D = (r) => /* @__PURE__ */ _.createElement("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...r }, /* @__PURE__ */ _.createElement("path", { d: "M9.33333 10.5001L10.5 9.33345L9.33333 10.5001ZM6.41667 10.5001L10.5 6.41678L6.41667 10.5001ZM3.5 10.5L10.5 3.5L3.5 10.5Z", fill: "#737373" }), /* @__PURE__ */ _.createElement("path", { d: "M9.33333 10.5001L10.5 9.33345M6.41667 10.5001L10.5 6.41678M3.5 10.5L10.5 3.5", stroke: "#737373", strokeWidth: 0.875, strokeLinecap: "round", strokeLinejoin: "round" })), J = ({
+  name: r,
+  label: h,
+  value: n = "",
+  placeholder: v = "",
+  onChange: f,
+  onBlur: p,
+  error: l,
+  helperText: a,
+  disabled: s = !1,
+  readOnly: u = !1,
+  maxLength: x = 100,
+  rows: z = 4,
+  resize: m = !1,
+  showCounter: M = !0,
+  className: R = "",
+  mandatory: E = !1
+}) => {
+  const [S, $] = d(!1), [j, g] = d(n.length), i = F(null), [w, B] = d({
+    left: 0,
+    top: 0
+  });
+  k(() => {
+    if (!i.current) return;
+    const t = i.current, b = () => {
+      const N = t.getBoundingClientRect();
+      B({
+        left: N.width - 20,
+        top: N.height - 18
+      });
+    };
+    b();
+    const L = new ResizeObserver(() => {
+      b();
+    });
+    return L.observe(t), () => L.disconnect();
+  }, []), k(() => {
+    g(n.length);
+  }, [n]);
+  const C = (t) => {
+    g(t.target.value.length), f && f(t);
+  }, y = !!l;
+  return /* @__PURE__ */ c("div", { className: `${e["ckds-text-area-wrapper"]} ${R}`, children: [
+    /* @__PURE__ */ c("div", { className: e["top-section"], children: [
+      h && /* @__PURE__ */ o(
+        "label",
+        {
+          htmlFor: r,
+          className: `${e.label} ${E ? e?.mandatory : ""} ${s ? e.disabled : ""} `,
+          children: h
+        }
+      ),
+      M && /* @__PURE__ */ c(
+        "span",
+        {
+          className: `${e.counter} ${s ? e.disabled : ""}`,
+          children: [
+            j,
+            "/",
+            x
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ c("div", { className: e["text-area-container"], children: [
+      /* @__PURE__ */ o(
+        "textarea",
+        {
+          ref: i,
+          id: r,
+          name: r,
+          value: n,
+          placeholder: v,
+          rows: z,
+          maxLength: x,
+          disabled: s,
+          readOnly: u,
+          onChange: C,
+          onFocus: () => $(!0),
+          onBlur: (t) => {
+            $(!1), p && p(t);
+          },
+          className: `
+          ${e["text-area"]}
+          ${S ? e.focused : ""}
+          ${y ? e.error : ""}
+          ${s ? e.disabled : ""}
+          ${u ? e["read-only"] : ""}
+          ${!m && e["no-resize"]}
+        `
+        }
+      ),
+      m && /* @__PURE__ */ o(
+        D,
+        {
+          className: e["resize-icon"],
+          style: {
+            left: `${w.left}px`,
+            top: `${w.top}px`
+          }
+        }
+      )
+    ] }),
+    l && /* @__PURE__ */ o("span", { className: ` ${y ? e["error-text"] : ""}`, children: l }),
+    a && (typeof a == "string" ? /* @__PURE__ */ o(
+      "span",
+      {
+        className: `${e["helper-text"]} ${s ? e.disabled : ""}`,
+        children: a
+      }
+    ) : a)
+  ] });
+};
+export {
+  J as default
+};

package/dist/components/TextField/_types/textField.types.d.ts

@@ -0,0 +1,67 @@
+import { ChangeEvent, FocusEvent, KeyboardEvent, ReactNode } from 'react';
+import { ButtonSize, ButtonVariant } from '../../CKButton/_types/button.types';
+export interface PrefixConfig {
+    text: string;
+    style: string;
+}
+export interface SuffixConfig {
+    text?: string;
+    icon?: ReactNode;
+    style?: string;
+}
+export interface ToolTipConfig {
+    label: string;
+    component: ReactNode;
+}
+export interface ShowInfoMessageConfig {
+    isEnabled?: boolean;
+    component?: ReactNode;
+}
+export interface ActionButtonConfig {
+    buttonText?: string;
+    btnVariant?: ButtonVariant;
+    btnsize?: ButtonSize;
+}
+export interface TextFieldProps {
+    type?: string;
+    name?: string;
+    value?: string;
+    label?: string;
+    error?: string;
+    helperText?: ReactNode;
+    placeHolder?: string;
+    handleChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    onBlurHandler?: (event: FocusEvent<HTMLInputElement>) => void;
+    onFocusHandler?: (event: FocusEvent<HTMLInputElement>) => void;
+    onKeyDownHandler?: (event: KeyboardEvent<HTMLInputElement>) => void;
+    toggleIcon?: boolean;
+    toggleActionButton?: boolean;
+    toggleCallback?: (type?: string, name?: string) => void;
+    toggleActionBtnCallback?: (type?: string, name?: string) => void;
+    selectedVisibilityIcon?: ReactNode;
+    inputIcon?: string | ReactNode;
+    prefixIcon?: ReactNode;
+    inputClass?: string;
+    parentClass?: string;
+    labelClass?: string;
+    suffix?: SuffixConfig;
+    prefix?: PrefixConfig;
+    touched?: boolean;
+    disabled?: boolean;
+    disabledClass?: string;
+    filledStyle?: string;
+    autoComplete?: string;
+    toolTip?: ToolTipConfig;
+    maxLength?: number | null;
+    showLabel?: boolean;
+    showInfoMessage?: ShowInfoMessageConfig;
+    actionButtonConfig?: ActionButtonConfig;
+    labelDescription?: string | ReactNode | (() => ReactNode);
+    disableOnWheel?: boolean;
+    size?: "small" | "medium" | "large";
+    readOnly?: boolean;
+    clearable?: boolean;
+    onClear?: (type?: string, name?: string) => void;
+    mandatory?: boolean;
+}
+//# sourceMappingURL=textField.types.d.ts.map

package/dist/components/TextField/_types/textField.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textField.types.d.ts","sourceRoot":"","sources":["../../../../lib/components/TextField/_types/textField.types.ts"],"names":[],"mappings":"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"}

package/dist/components/TextField/_types/textField.types.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,4 @@
+import { TextFieldProps } from './_types/textField.types';
+export declare function TextField({ type, name, handleChange, value, label, error, placeHolder, toggleIcon, toggleActionButton, toggleCallback, toggleActionBtnCallback, selectedVisibilityIcon, inputIcon, inputClass, suffix, prefixIcon, parentClass, showLabel, touched, onBlurHandler, disabled, disabledClass, filledStyle, autoComplete, toolTip, maxLength, prefix, showInfoMessage, actionButtonConfig, labelDescription, disableOnWheel, onFocusHandler, onKeyDownHandler, mandatory, helperText, readOnly, clearable, onClear, size, }: TextFieldProps): import("react/jsx-runtime").JSX.Element;
+export default TextField;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/TextField/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,wBAAgB,SAAS,CAAC,EACxB,IAAa,EACb,IAAI,EACJ,YAAY,EACZ,KAAU,EACV,KAAU,EACV,KAAK,EACL,WAAW,EACX,UAAU,EACV,kBAAkB,EAClB,cAAc,EACd,uBAAuB,EACvB,sBAAsB,EACtB,SAAS,EACT,UAAe,EACf,MAAM,EACN,UAAU,EACV,WAAgB,EAChB,SAAgB,EAChB,OAAO,EACP,aAAa,EACb,QAAgB,EAChB,aAAkB,EAClB,WAAgB,EAChB,YAAmB,EACnB,OAAO,EACP,SAAgB,EAChB,MAAM,EACN,eAAoB,EACpB,kBAAuB,EACvB,gBAAqB,EACrB,cAAsB,EACtB,cAAc,EACd,gBAAgB,EAChB,SAAiB,EACjB,UAAU,EACV,QAAgB,EAChB,SAAiB,EACjB,OAAO,EACP,IAAe,GAChB,EAAE,cAAc,2CAwLhB;AAED,eAAe,SAAS,CAAC"}