@adam-milo/ui 1.0.30 → 1.0.32

package/dist/index24.js

@@ -1,16 +1,301 @@
-import { useCallback } from "react";
-function useMergedRef(...refs) {
-  return useCallback((element) => {
-    refs.forEach((ref) => {
-      if (!ref) return;
-      if (typeof ref === "function") {
-        ref(element);
-      } else {
-        ref.current = element;
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, useState, useRef, useId, useMemo, useEffect } from "react";
+import { cn } from "./index22.js";
+/* empty css        */
+import { useMergedRef } from "./index25.js";
+import { debounce } from "./index42.js";
+const Input = forwardRef(
+  ({
+    type = "text",
+    label,
+    error: externalError,
+    helperText,
+    fullWidth = false,
+    showPasswordToggle = true,
+    showLastChar = true,
+    lastCharDelay = 500,
+    validate,
+    onValidationChange,
+    className,
+    id: providedId,
+    onChange,
+    onBlur,
+    required,
+    value: controlledValue,
+    "data-cy": dataCy,
+    "data-testid": dataTestId,
+    ...props
+  }, ref) => {
+    const [isPasswordVisible, setIsPasswordVisible] = useState(false);
+    const [internalError, setInternalError] = useState();
+    const [isFocused, setIsFocused] = useState(false);
+    const [isHovered, setIsHovered] = useState(false);
+    const touchedRef = useRef(false);
+    const [displayPassword, setDisplayPassword] = useState("");
+    const actualPasswordRef = useRef("");
+    const timeoutRef = useRef(null);
+    const inputRef = useRef(null);
+    const mergedRef = useMergedRef(ref, inputRef);
+    const generatedId = useId();
+    const id = providedId || generatedId;
+    const errorId = `${id}-error`;
+    const helperId = `${id}-helper`;
+    const finalDataCy = dataCy || "input";
+    const finalTestId = dataTestId || "input";
+    const isPasswordType = type === "password";
+    const showToggle = isPasswordType && showPasswordToggle;
+    const shouldEnableLastCharPreview = isPasswordType && showLastChar && !isPasswordVisible;
+    const inputType = isPasswordType && (isPasswordVisible || shouldEnableLastCharPreview && actualPasswordRef.current.length > 0) ? "text" : type;
+    const displayLabel = label && required && !label.includes("*") ? `${label} *` : label;
+    const togglePasswordVisibility = () => {
+      setIsPasswordVisible((prev) => !prev);
+      setTimeout(() => {
+        var _a;
+        return (_a = inputRef.current) == null ? void 0 : _a.focus();
+      }, 0);
+    };
+    const debouncedValidate = useMemo(
+      () => debounce((value) => {
+        if (validate && touchedRef.current) {
+          const validationError = validate(value);
+          setInternalError(validationError);
+          onValidationChange == null ? void 0 : onValidationChange(!validationError);
+        }
+      }, 300),
+      [validate, onValidationChange]
+    );
+    const debouncedValidateRef = useRef(debouncedValidate);
+    useEffect(() => {
+      debouncedValidateRef.current = debouncedValidate;
+    }, [debouncedValidate]);
+    useEffect(() => {
+      if (process.env.NODE_ENV === "development") {
+        if (isPasswordType && showLastChar && controlledValue !== void 0) {
+          console.warn(
+            "[Input] Password last character preview (showLastChar) only works in uncontrolled mode. Remove the value prop to use this feature, or set showLastChar={false}."
+          );
+        }
       }
-    });
-  }, refs);
-}
+    }, [isPasswordType, showLastChar, controlledValue]);
+    useEffect(() => {
+      return () => {
+        if (timeoutRef.current) {
+          clearTimeout(timeoutRef.current);
+        }
+        debouncedValidateRef.current.cancel();
+      };
+    }, []);
+    const inputValue = shouldEnableLastCharPreview && controlledValue === void 0 ? displayPassword : isPasswordVisible && isPasswordType && controlledValue === void 0 ? actualPasswordRef.current || "" : controlledValue;
+    const handleChange = (e) => {
+      onChange == null ? void 0 : onChange(e);
+      let value = e.target.value;
+      if (shouldEnableLastCharPreview) {
+        const input = e.target;
+        const newValue = input.value;
+        actualPasswordRef.current = newValue;
+        const masked = newValue ? "•".repeat(newValue.length - 1) + newValue.slice(-1) : "";
+        setDisplayPassword(masked);
+        input.value = masked;
+        value = newValue;
+        if (timeoutRef.current) {
+          clearTimeout(timeoutRef.current);
+        }
+        timeoutRef.current = setTimeout(() => {
+          setDisplayPassword("•".repeat(newValue.length));
+        }, lastCharDelay);
+      }
+      if (touchedRef.current) {
+        debouncedValidate(value);
+      }
+    };
+    const handleFocus = (e) => {
+      var _a;
+      setIsFocused(true);
+      (_a = props.onFocus) == null ? void 0 : _a.call(props, e);
+    };
+    const handleBlur = (e) => {
+      setIsFocused(false);
+      touchedRef.current = true;
+      if (validate) {
+        const valueToValidate = shouldEnableLastCharPreview ? actualPasswordRef.current : e.target.value;
+        const validationError = validate(valueToValidate);
+        setInternalError(validationError);
+        onValidationChange == null ? void 0 : onValidationChange(!validationError);
+      }
+      onBlur == null ? void 0 : onBlur(e);
+    };
+    const handleMouseEnter = () => {
+      setIsHovered(true);
+    };
+    const handleMouseLeave = () => {
+      setIsHovered(false);
+    };
+    const displayError = externalError || internalError;
+    const inputState = props.disabled ? "disabled" : displayError ? "error" : isFocused ? "focus" : isHovered ? "hover" : "idle";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn("input-wrapper", fullWidth && "input-wrapper--full-width"),
+        "data-cy": `${finalDataCy}-wrapper`,
+        "data-testid": `${finalTestId}-wrapper`,
+        children: [
+          label && /* @__PURE__ */ jsx(
+            "label",
+            {
+              htmlFor: id,
+              className: "input__label",
+              "data-cy": `${finalDataCy}-label`,
+              "data-testid": `${finalTestId}-label`,
+              children: displayLabel
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "input__field-container", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: mergedRef,
+                id,
+                type: inputType,
+                value: inputValue,
+                className: cn(
+                  "input",
+                  displayError && "input--error",
+                  fullWidth && "input--full-width",
+                  showToggle && "input--with-toggle",
+                  className
+                ),
+                "aria-invalid": displayError ? "true" : "false",
+                "aria-required": required ? "true" : void 0,
+                "aria-describedby": displayError ? errorId : helperText ? helperId : void 0,
+                "data-cy": finalDataCy,
+                "data-testid": finalTestId,
+                "data-state": inputState,
+                onChange: handleChange,
+                onFocus: handleFocus,
+                onBlur: handleBlur,
+                onMouseEnter: handleMouseEnter,
+                onMouseLeave: handleMouseLeave,
+                required,
+                ...props
+              }
+            ),
+            showToggle && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "input__toggle",
+                onClick: togglePasswordVisibility,
+                "aria-label": isPasswordVisible ? "Hide password" : "Show password",
+                "data-cy": `${finalDataCy}-toggle`,
+                "data-testid": `${finalTestId}-toggle`,
+                children: isPasswordVisible ? /* @__PURE__ */ jsxs(
+                  "svg",
+                  {
+                    width: "20",
+                    height: "20",
+                    viewBox: "0 0 20 20",
+                    fill: "none",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    "aria-hidden": "true",
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M10 4C5.5 4 2 10 2 10s3.5 6 8 6 8-6 8-6-3.5-6-8-6z",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          fill: "none"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "circle",
+                        {
+                          cx: "10",
+                          cy: "10",
+                          r: "2.5",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          fill: "none"
+                        }
+                      )
+                    ]
+                  }
+                ) : /* @__PURE__ */ jsxs(
+                  "svg",
+                  {
+                    width: "20",
+                    height: "20",
+                    viewBox: "0 0 20 20",
+                    fill: "none",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    "aria-hidden": "true",
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M10 4C5.5 4 2 10 2 10s3.5 6 8 6 8-6 8-6-3.5-6-8-6z",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          fill: "none"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "circle",
+                        {
+                          cx: "10",
+                          cy: "10",
+                          r: "2.5",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          fill: "none"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M3 3l14 14",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round"
+                        }
+                      )
+                    ]
+                  }
+                )
+              }
+            )
+          ] }),
+          displayError && /* @__PURE__ */ jsx(
+            "span",
+            {
+              id: errorId,
+              className: "input__error",
+              role: "alert",
+              "data-cy": `${finalDataCy}-error`,
+              "data-testid": `${finalTestId}-error`,
+              children: displayError
+            }
+          ),
+          helperText && !displayError && /* @__PURE__ */ jsx(
+            "span",
+            {
+              id: helperId,
+              className: "input__helper",
+              "data-cy": `${finalDataCy}-helper`,
+              "data-testid": `${finalTestId}-helper`,
+              children: helperText
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Input.displayName = "Input";
 export {
-  useMergedRef
+  Input
 };

package/dist/index25.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react");exports.useMergedRef=function(...r){return e.useCallback(e=>{r.forEach(r=>{r&&("function"==typeof r?r(e):r.current=e)})},r)};

package/dist/index25.js

@@ -0,0 +1,16 @@
+import { useCallback } from "react";
+function useMergedRef(...refs) {
+  return useCallback((element) => {
+    refs.forEach((ref) => {
+      if (!ref) return;
+      if (typeof ref === "function") {
+        ref(element);
+      } else {
+        ref.current = element;
+      }
+    });
+  }, refs);
+}
+export {
+  useMergedRef
+};

package/dist/index3.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),t=require("./index22.cjs"),i=require("./index23.cjs"),r=a.forwardRef(({validateEmail:r=!0,invalidEmailMessage:l="Not a valid email address",validate:d,"data-cy":s,"data-testid":u,...n},c)=>{const o=a.useCallback(e=>{if(e)return t.validate(e)?void 0:l},[l]),m=a.useCallback(e=>r?d?o(e)||d(e):o(e):null==d?void 0:d(e),[r,d,o]);return e.jsx(i.Input,{ref:c,type:"email",validate:m,"data-cy":s||"email-input","data-testid":u||"email-input",...n})});r.displayName="EmailInput",exports.EmailInput=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("react"),t=require("email-validator"),i=require("./index24.cjs"),l=e.forwardRef(({validateEmail:l=!0,invalidEmailMessage:r="Not a valid email address",validate:d,"data-cy":s,"data-testid":u,...n},o)=>{const m=e.useCallback(a=>{if(a)return t.validate(a)?void 0:r},[r]),c=e.useCallback(a=>l?d?m(a)||d(a):m(a):null==d?void 0:d(a),[l,d,m]);return a.jsx(i.Input,{ref:o,type:"email",validate:c,"data-cy":s||"email-input","data-testid":u||"email-input",...n})});l.displayName="EmailInput",exports.EmailInput=l;

package/dist/index3.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback } from "react";
-import { validate } from "./index22.js";
-import { Input } from "./index23.js";
+import { validate } from "email-validator";
+import { Input } from "./index24.js";
 const EmailInput = forwardRef(
   ({
     validateEmail = true,

package/dist/index4.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),s=require("./index23.cjs"),r=t.forwardRef(({showToggle:t=!0,"data-cy":r,"data-testid":a,...o},d)=>e.jsx(s.Input,{ref:d,type:"password",showPasswordToggle:t,"data-cy":r||"password-input","data-testid":a||"password-input",...o}));r.displayName="PasswordInput",exports.PasswordInput=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),s=require("./index24.cjs"),r=t.forwardRef(({showToggle:t=!0,"data-cy":r,"data-testid":a,...o},d)=>e.jsx(s.Input,{ref:d,type:"password",showPasswordToggle:t,"data-cy":r||"password-input","data-testid":a||"password-input",...o}));r.displayName="PasswordInput",exports.PasswordInput=r;

package/dist/index4.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Input } from "./index23.js";
+import { Input } from "./index24.js";
 const PasswordInput = forwardRef(
   ({ showToggle = true, "data-cy": dataCy, "data-testid": dataTestId, ...props }, ref) => {
     return /* @__PURE__ */ jsx(

package/dist/index42.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),exports.clamp=function(t,[e,r]){return Math.min(r,Math.max(e,t))};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),exports.debounce=function(e,t){let l=null;const n=function(...n){l&&clearTimeout(l);const o=this;l=setTimeout(()=>{e.apply(o,n),l=null},t)};return n.cancel=()=>{l&&(clearTimeout(l),l=null)},n};

package/dist/index42.js

@@ -1,6 +1,21 @@
-function clamp(value, [min, max]) {
-  return Math.min(max, Math.max(min, value));
+function debounce(func, wait) {
+  let timeoutId = null;
+  const debounced = function(...args) {
+    if (timeoutId) clearTimeout(timeoutId);
+    const context = this;
+    timeoutId = setTimeout(() => {
+      func.apply(context, args);
+      timeoutId = null;
+    }, wait);
+  };
+  debounced.cancel = () => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+      timeoutId = null;
+    }
+  };
+  return debounced;
 }
 export {
-  clamp
+  debounce
 };

package/dist/index5.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("./index23.cjs"),r=t.forwardRef(({min:r,max:i,step:s=1,allowDecimals:u=!1,validate:n,"data-cy":l,"data-testid":c,...d},o)=>{const m=t.useCallback(e=>{if(!e)return;const t=parseFloat(e);return isNaN(t)?"Please enter a valid number":u||Number.isInteger(t)?void 0!==r&&t<r?`Must be at least ${r}`:void 0!==i&&t>i?`Must be at most ${i}`:void 0:"Decimals are not allowed"},[r,i,u]),p=t.useCallback(e=>n?m(e)||n(e):m(e),[m,n]);return e.jsx(a.Input,{ref:o,type:"number",min:r,max:i,validate:p,"data-cy":l||"numeric-input","data-testid":c||"numeric-input",...d,step:u?"any":s})});r.displayName="NumericInput",exports.NumericInput=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("./index24.cjs"),r=t.forwardRef(({min:r,max:i,step:s=1,allowDecimals:u=!1,validate:n,"data-cy":l,"data-testid":c,...d},o)=>{const m=t.useCallback(e=>{if(!e)return;const t=parseFloat(e);return isNaN(t)?"Please enter a valid number":u||Number.isInteger(t)?void 0!==r&&t<r?`Must be at least ${r}`:void 0!==i&&t>i?`Must be at most ${i}`:void 0:"Decimals are not allowed"},[r,i,u]),p=t.useCallback(e=>n?m(e)||n(e):m(e),[m,n]);return e.jsx(a.Input,{ref:o,type:"number",min:r,max:i,validate:p,"data-cy":l||"numeric-input","data-testid":c||"numeric-input",...d,step:u?"any":s})});r.displayName="NumericInput",exports.NumericInput=r;

package/dist/index5.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback } from "react";
-import { Input } from "./index23.js";
+import { Input } from "./index24.js";
 const NumericInput = forwardRef(
   ({
     min,

package/dist/index6.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("./index23.cjs"),n=require("./index24.cjs"),l=t.forwardRef(({allowHyphen:l=!1,allowUnderscore:r=!1,allowSpace:s=!1,minLength:u,maxLength:i,validate:c,onChange:o,"data-cy":p,"data-testid":d,...h},g)=>{const m=t.useRef(null),f=n.useMergedRef(g,m),v=t.useMemo(()=>{let e="^[a-zA-Z0-9";return l&&(e+="\\-"),r&&(e+="_"),s&&(e+=" "),e+="]*$",new RegExp(e)},[l,r,s]),x=t.useMemo(()=>{let e="[a-zA-Z0-9";return l&&(e+="\\-"),r&&(e+="_"),s&&(e+=" "),e+="]",new RegExp(e)},[l,r,s]),y=t.useCallback(e=>{if(e){if(!v.test(e)){let e="letters and numbers";const t=[];return l&&t.push("hyphens"),r&&t.push("underscores"),s&&t.push("spaces"),t.length>0&&(e+=`, ${t.join(", ")}`),`Only ${e} are allowed`}return void 0!==u&&e.length<u?`Must be at least ${u} characters`:void 0!==i&&e.length>i?`Must be at most ${i} characters`:void 0}},[v,u,i,l,r,s]),b=t.useCallback(e=>c?y(e)||c(e):y(e),[y,c]),[j,w]=t.useState(null);t.useEffect(()=>{null!==j&&m.current&&(m.current.setSelectionRange(j,j),w(null))},[h.value,j]);const R=t.useCallback(e=>{const t=e.target,a=t.value,n=t.selectionStart||0,l=a.split("").filter(e=>x.test(e)).join(""),r=n-a.slice(0,n).split("").filter(e=>!x.test(e)).length;t.value=l;void 0!==h.value?w(r):t.setSelectionRange(r,r),null==o||o(e)},[x,o,h.value]);return e.jsx(a.Input,{ref:f,type:"text",minLength:u,maxLength:i,validate:b,onChange:R,"data-cy":p||"alphanumeric-input","data-testid":d||"alphanumeric-input",...h})});l.displayName="AlphanumericInput",exports.AlphanumericInput=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("./index24.cjs"),n=require("./index25.cjs"),l=t.forwardRef(({allowHyphen:l=!1,allowUnderscore:r=!1,allowSpace:s=!1,minLength:u,maxLength:i,validate:c,onChange:o,"data-cy":p,"data-testid":d,...h},g)=>{const m=t.useRef(null),f=n.useMergedRef(g,m),v=t.useMemo(()=>{let e="^[a-zA-Z0-9";return l&&(e+="\\-"),r&&(e+="_"),s&&(e+=" "),e+="]*$",new RegExp(e)},[l,r,s]),x=t.useMemo(()=>{let e="[a-zA-Z0-9";return l&&(e+="\\-"),r&&(e+="_"),s&&(e+=" "),e+="]",new RegExp(e)},[l,r,s]),y=t.useCallback(e=>{if(e){if(!v.test(e)){let e="letters and numbers";const t=[];return l&&t.push("hyphens"),r&&t.push("underscores"),s&&t.push("spaces"),t.length>0&&(e+=`, ${t.join(", ")}`),`Only ${e} are allowed`}return void 0!==u&&e.length<u?`Must be at least ${u} characters`:void 0!==i&&e.length>i?`Must be at most ${i} characters`:void 0}},[v,u,i,l,r,s]),b=t.useCallback(e=>c?y(e)||c(e):y(e),[y,c]),[j,w]=t.useState(null);t.useEffect(()=>{null!==j&&m.current&&(m.current.setSelectionRange(j,j),w(null))},[h.value,j]);const R=t.useCallback(e=>{const t=e.target,a=t.value,n=t.selectionStart||0,l=a.split("").filter(e=>x.test(e)).join(""),r=n-a.slice(0,n).split("").filter(e=>!x.test(e)).length;t.value=l;void 0!==h.value?w(r):t.setSelectionRange(r,r),null==o||o(e)},[x,o,h.value]);return e.jsx(a.Input,{ref:f,type:"text",minLength:u,maxLength:i,validate:b,onChange:R,"data-cy":p||"alphanumeric-input","data-testid":d||"alphanumeric-input",...h})});l.displayName="AlphanumericInput",exports.AlphanumericInput=l;

package/dist/index6.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef, useRef, useMemo, useCallback, useState, useEffect } from "react";
-import { Input } from "./index23.js";
-import { useMergedRef } from "./index24.js";
+import { Input } from "./index24.js";
+import { useMergedRef } from "./index25.js";
 const AlphanumericInput = forwardRef(
   ({
     allowHyphen = false,

package/dist/index7.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),a=require("./index20.cjs");;/* empty css          */const c=r.forwardRef(({label:c,error:t,helperText:d,indeterminate:i=!1,className:s,id:l,required:n,disabled:o,checked:u,"data-cy":b,"data-testid":h,...x},p)=>{const k=r.useId(),m=l||k,y=`${m}-error`,_=`${m}-helper`,$=b||"checkbox",f=h||"checkbox",j=r.useRef(null),N=r.useCallback(e=>{j.current=e,p&&("function"==typeof p?p(e):"current"in p&&(p.current=e))},[p]);r.useEffect(()=>{j.current&&(j.current.indeterminate=i)},[i]);const q=c&&n&&!c.includes("*")?`${c} *`:c;return e.jsxs("div",{className:a.cn("checkbox-wrapper",o&&"checkbox-wrapper--disabled"),"data-cy":`${$}-wrapper`,"data-testid":`${f}-wrapper`,children:[e.jsxs("div",{className:"checkbox__container",children:[e.jsx("input",{ref:N,id:m,type:"checkbox",checked:u,className:a.cn("checkbox__input",t&&"checkbox__input--error",s),"aria-invalid":t?"true":"false","aria-required":n?"true":void 0,"aria-describedby":t?y:d?_:void 0,"data-cy":$,"data-testid":f,"data-indeterminate":i?"true":void 0,disabled:o,required:n,...x}),c&&e.jsx("label",{htmlFor:m,className:"checkbox__label","data-cy":`${$}-label`,"data-testid":`${f}-label`,children:q})]}),t&&e.jsx("span",{id:y,className:"checkbox__error",role:"alert","data-cy":`${$}-error`,"data-testid":`${f}-error`,children:t}),d&&!t&&e.jsx("span",{id:_,className:"checkbox__helper","data-cy":`${$}-helper`,"data-testid":`${f}-helper`,children:d})]})});c.displayName="Checkbox",exports.Checkbox=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),a=require("./index22.cjs");;/* empty css          */const c=r.forwardRef(({label:c,error:t,helperText:d,indeterminate:i=!1,className:s,id:l,required:n,disabled:o,checked:u,"data-cy":b,"data-testid":h,...x},p)=>{const k=r.useId(),m=l||k,y=`${m}-error`,_=`${m}-helper`,$=b||"checkbox",f=h||"checkbox",j=r.useRef(null),N=r.useCallback(e=>{j.current=e,p&&("function"==typeof p?p(e):"current"in p&&(p.current=e))},[p]);r.useEffect(()=>{j.current&&(j.current.indeterminate=i)},[i]);const q=c&&n&&!c.includes("*")?`${c} *`:c;return e.jsxs("div",{className:a.cn("checkbox-wrapper",o&&"checkbox-wrapper--disabled"),"data-cy":`${$}-wrapper`,"data-testid":`${f}-wrapper`,children:[e.jsxs("div",{className:"checkbox__container",children:[e.jsx("input",{ref:N,id:m,type:"checkbox",checked:u,className:a.cn("checkbox__input",t&&"checkbox__input--error",s),"aria-invalid":t?"true":"false","aria-required":n?"true":void 0,"aria-describedby":t?y:d?_:void 0,"data-cy":$,"data-testid":f,"data-indeterminate":i?"true":void 0,disabled:o,required:n,...x}),c&&e.jsx("label",{htmlFor:m,className:"checkbox__label","data-cy":`${$}-label`,"data-testid":`${f}-label`,children:q})]}),t&&e.jsx("span",{id:y,className:"checkbox__error",role:"alert","data-cy":`${$}-error`,"data-testid":`${f}-error`,children:t}),d&&!t&&e.jsx("span",{id:_,className:"checkbox__helper","data-cy":`${$}-helper`,"data-testid":`${f}-helper`,children:d})]})});c.displayName="Checkbox",exports.Checkbox=c;

package/dist/index7.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useId, useRef, useCallback, useEffect } from "react";
-import { cn } from "./index20.js";
+import { cn } from "./index22.js";
 /* empty css        */
 const Checkbox = forwardRef(
   ({

package/dist/index8.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),a=require("./index20.cjs");;/* empty css          */const d=r.forwardRef(({label:d,error:i,helperText:t,className:s,id:l,required:c,disabled:o,checked:n,"data-cy":p,"data-testid":u,...b},h)=>{const x=r.useId(),y=l||x,_=`${y}-error`,m=`${y}-helper`,$=p||"radio",j=u||"radio",N=r.useRef(null),f=r.useCallback(e=>{N.current=e,h&&("function"==typeof h?h(e):"current"in h&&(h.current=e))},[h]),q=d&&c&&!d.includes("*")?`${d} *`:d;return e.jsxs("div",{className:a.cn("radio-wrapper",o&&"radio-wrapper--disabled"),"data-cy":`${$}-wrapper`,"data-testid":`${j}-wrapper`,children:[e.jsxs("div",{className:"radio__container",children:[e.jsx("input",{ref:f,id:y,type:"radio",checked:n,className:a.cn("radio__input",i&&"radio__input--error",s),"aria-describedby":i?_:t?m:void 0,"data-cy":$,"data-testid":j,disabled:o,required:c,...b}),d&&e.jsx("label",{htmlFor:y,className:"radio__label","data-cy":`${$}-label`,"data-testid":`${j}-label`,children:q})]}),i&&e.jsx("span",{id:_,className:"radio__error",role:"alert","data-cy":`${$}-error`,"data-testid":`${j}-error`,children:i}),t&&!i&&e.jsx("span",{id:m,className:"radio__helper","data-cy":`${$}-helper`,"data-testid":`${j}-helper`,children:t})]})});d.displayName="Radio",exports.Radio=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),a=require("./index22.cjs");;/* empty css          */const d=r.forwardRef(({label:d,error:i,helperText:t,className:s,id:l,required:c,disabled:o,checked:n,"data-cy":p,"data-testid":u,...b},h)=>{const x=r.useId(),y=l||x,_=`${y}-error`,m=`${y}-helper`,$=p||"radio",j=u||"radio",N=r.useRef(null),f=r.useCallback(e=>{N.current=e,h&&("function"==typeof h?h(e):"current"in h&&(h.current=e))},[h]),q=d&&c&&!d.includes("*")?`${d} *`:d;return e.jsxs("div",{className:a.cn("radio-wrapper",o&&"radio-wrapper--disabled"),"data-cy":`${$}-wrapper`,"data-testid":`${j}-wrapper`,children:[e.jsxs("div",{className:"radio__container",children:[e.jsx("input",{ref:f,id:y,type:"radio",checked:n,className:a.cn("radio__input",i&&"radio__input--error",s),"aria-describedby":i?_:t?m:void 0,"data-cy":$,"data-testid":j,disabled:o,required:c,...b}),d&&e.jsx("label",{htmlFor:y,className:"radio__label","data-cy":`${$}-label`,"data-testid":`${j}-label`,children:q})]}),i&&e.jsx("span",{id:_,className:"radio__error",role:"alert","data-cy":`${$}-error`,"data-testid":`${j}-error`,children:i}),t&&!i&&e.jsx("span",{id:m,className:"radio__helper","data-cy":`${$}-helper`,"data-testid":`${j}-helper`,children:t})]})});d.displayName="Radio",exports.Radio=d;

package/dist/index8.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useId, useRef, useCallback } from "react";
-import { cn } from "./index20.js";
+import { cn } from "./index22.js";
 /* empty css        */
 const Radio = forwardRef(
   ({

package/dist/index9.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),r=require("./index27.cjs"),a=require("./index20.cjs");;/* empty css          */const l=r.Root,s=t.forwardRef(({className:l,children:s,label:c,error:d,helperText:i,fullWidth:o=!1,hasValue:n=!1,id:p,"data-cy":f,"data-testid":h,disabled:x,required:_,...g},m)=>{const b=t.useId(),u=p||b,N=`${u}-error`,j=`${u}-helper`,y=f||"select-trigger",w=h||"select-trigger",S=n;return e.jsxs("div",{className:a.cn("select-wrapper",o&&"select-wrapper--full-width"),"data-cy":`${y}-wrapper`,"data-testid":`${w}-wrapper`,children:[e.jsxs("div",{className:"select-field",children:[e.jsxs("div",{className:"select-field__top",children:[e.jsx("div",{className:a.cn("select-field__border-left",d&&"select-field__border-left--error",S&&"select-field__border-left--floating",x&&"select-field__border-left--disabled")}),c&&S&&e.jsx("div",{className:a.cn("select-field__label-container",d&&"select-field__label-container--error"),children:e.jsx("span",{className:a.cn("select-field__label select-field__label--floating",d&&"select-field__label--error",x&&"select-field__label--disabled"),"data-cy":`${y}-label`,"data-testid":`${w}-label`,children:c})}),e.jsx("div",{className:a.cn("select-field__border-right",d&&"select-field__border-right--error",S&&"select-field__border-right--floating",x&&"select-field__border-right--disabled")})]}),e.jsxs(r.Trigger,{ref:m,id:u,className:a.cn("select-trigger",d&&"select-trigger--error",o&&"select-trigger--full-width",S&&"select-trigger--floating",l),"aria-invalid":d?"true":"false","aria-describedby":d?N:i?j:void 0,"aria-required":_?"true":void 0,"data-cy":y,"data-testid":w,disabled:x,...g,children:[c&&!S&&e.jsx("span",{className:"select-trigger__placeholder-label","data-cy":`${y}-placeholder`,"data-testid":`${w}-placeholder`,children:c}),S&&s,e.jsx(r.Icon,{className:"select-trigger__icon","data-cy":`${y}-icon`,"data-testid":`${w}-icon`,children:e.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:e.jsx("path",{d:"M7 10L12 15L17 10H7Z",fill:"currentColor"})})})]})]}),d&&e.jsx("span",{id:N,className:"select__error",role:"alert","data-cy":`${y}-error`,"data-testid":`${w}-error`,children:d}),i&&!d&&e.jsx("span",{id:j,className:"select__helper","data-cy":`${y}-helper`,"data-testid":`${w}-helper`,children:i})]})});s.displayName="SelectTrigger";const c=r.Value,d=t.forwardRef(({className:t,children:l,position:s="popper","data-cy":c,"data-testid":d,...i},o)=>{const n=c||"select-content",p=d||"select-content";return e.jsx(r.Portal,{children:e.jsx(r.Content,{ref:o,className:a.cn("select-content",t),position:s,sideOffset:8,"data-cy":n,"data-testid":p,...i,children:e.jsx(r.Viewport,{className:"select-viewport",children:l})})})});d.displayName="SelectContent";const i=t.forwardRef(({className:t,children:l,value:s,"data-cy":c,"data-testid":d,...i},o)=>{const n=c||`select-item-${s}`,p=d||`select-item-${s}`;return e.jsx(r.Item,{ref:o,className:a.cn("select-item",t),value:s,"data-cy":n,"data-testid":p,...i,children:e.jsx(r.ItemText,{children:l})})});i.displayName="SelectItem";const o=r.Group,n=t.forwardRef(({className:t,"data-cy":l,"data-testid":s,...c},d)=>{const i=l||"select-label",o=s||"select-label";return e.jsx(r.Label,{ref:d,className:a.cn("select-group-label",t),"data-cy":i,"data-testid":o,...c})});n.displayName="SelectLabel";const p=t.forwardRef(({className:t,"data-cy":l,"data-testid":s,...c},d)=>{const i=l||"select-separator",o=s||"select-separator";return e.jsx(r.Separator,{ref:d,className:a.cn("select-separator",t),"data-cy":i,"data-testid":o,...c})});p.displayName="SelectSeparator",exports.Select=l,exports.SelectContent=d,exports.SelectGroup=o,exports.SelectItem=i,exports.SelectLabel=n,exports.SelectSeparator=p,exports.SelectTrigger=s,exports.SelectValue=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),r=require("@radix-ui/react-select"),a=require("./index22.cjs");function l(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const r in e)if("default"!==r){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}return t.default=e,Object.freeze(t)};/* empty css          */const s=l(r),c=s.Root,d=t.forwardRef(({className:r,children:l,label:c,error:d,helperText:i,fullWidth:o=!1,hasValue:n=!1,id:p,"data-cy":f,"data-testid":g,disabled:h,required:u,...b},m)=>{const x=t.useId(),_=p||x,j=`${_}-error`,y=`${_}-helper`,N=f||"select-trigger",w=g||"select-trigger",S=n;return e.jsxs("div",{className:a.cn("select-wrapper",o&&"select-wrapper--full-width"),"data-cy":`${N}-wrapper`,"data-testid":`${w}-wrapper`,children:[e.jsxs("div",{className:"select-field",children:[e.jsxs("div",{className:"select-field__top",children:[e.jsx("div",{className:a.cn("select-field__border-left",d&&"select-field__border-left--error",S&&"select-field__border-left--floating",h&&"select-field__border-left--disabled")}),c&&S&&e.jsx("div",{className:a.cn("select-field__label-container",d&&"select-field__label-container--error"),children:e.jsx("span",{className:a.cn("select-field__label select-field__label--floating",d&&"select-field__label--error",h&&"select-field__label--disabled"),"data-cy":`${N}-label`,"data-testid":`${w}-label`,children:c})}),e.jsx("div",{className:a.cn("select-field__border-right",d&&"select-field__border-right--error",S&&"select-field__border-right--floating",h&&"select-field__border-right--disabled")})]}),e.jsxs(s.Trigger,{ref:m,id:_,className:a.cn("select-trigger",d&&"select-trigger--error",o&&"select-trigger--full-width",S&&"select-trigger--floating",r),"aria-invalid":d?"true":"false","aria-describedby":d?j:i?y:void 0,"aria-required":u?"true":void 0,"data-cy":N,"data-testid":w,disabled:h,...b,children:[c&&!S&&e.jsx("span",{className:"select-trigger__placeholder-label","data-cy":`${N}-placeholder`,"data-testid":`${w}-placeholder`,children:c}),S&&l,e.jsx(s.Icon,{className:"select-trigger__icon","data-cy":`${N}-icon`,"data-testid":`${w}-icon`,children:e.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:e.jsx("path",{d:"M7 10L12 15L17 10H7Z",fill:"currentColor"})})})]})]}),d&&e.jsx("span",{id:j,className:"select__error",role:"alert","data-cy":`${N}-error`,"data-testid":`${w}-error`,children:d}),i&&!d&&e.jsx("span",{id:y,className:"select__helper","data-cy":`${N}-helper`,"data-testid":`${w}-helper`,children:i})]})});d.displayName="SelectTrigger";const i=s.Value,o=t.forwardRef(({className:t,children:r,position:l="popper","data-cy":c,"data-testid":d,...i},o)=>{const n=c||"select-content",p=d||"select-content";return e.jsx(s.Portal,{children:e.jsx(s.Content,{ref:o,className:a.cn("select-content",t),position:l,sideOffset:8,"data-cy":n,"data-testid":p,...i,children:e.jsx(s.Viewport,{className:"select-viewport",children:r})})})});o.displayName="SelectContent";const n=t.forwardRef(({className:t,children:r,value:l,"data-cy":c,"data-testid":d,...i},o)=>{const n=c||`select-item-${l}`,p=d||`select-item-${l}`;return e.jsx(s.Item,{ref:o,className:a.cn("select-item",t),value:l,"data-cy":n,"data-testid":p,...i,children:e.jsx(s.ItemText,{children:r})})});n.displayName="SelectItem";const p=s.Group,f=t.forwardRef(({className:t,"data-cy":r,"data-testid":l,...c},d)=>{const i=r||"select-label",o=l||"select-label";return e.jsx(s.Label,{ref:d,className:a.cn("select-group-label",t),"data-cy":i,"data-testid":o,...c})});f.displayName="SelectLabel";const g=t.forwardRef(({className:t,"data-cy":r,"data-testid":l,...c},d)=>{const i=r||"select-separator",o=l||"select-separator";return e.jsx(s.Separator,{ref:d,className:a.cn("select-separator",t),"data-cy":i,"data-testid":o,...c})});g.displayName="SelectSeparator",exports.Select=c,exports.SelectContent=o,exports.SelectGroup=p,exports.SelectItem=n,exports.SelectLabel=f,exports.SelectSeparator=g,exports.SelectTrigger=d,exports.SelectValue=i;

package/dist/index9.js

@@ -1,9 +1,9 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useId } from "react";
-import { Root as Root2, Value, Group, Trigger, Icon, Portal, Content as Content2, Viewport, Item, ItemText, Label, Separator } from "./index27.js";
-import { cn } from "./index20.js";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { cn } from "./index22.js";
 /* empty css        */
-const Select = Root2;
+const Select = SelectPrimitive.Root;
 const SelectTrigger = forwardRef(
   ({
     className,
@@ -82,7 +82,7 @@ const SelectTrigger = forwardRef(
               )
             ] }),
             /* @__PURE__ */ jsxs(
-              Trigger,
+              SelectPrimitive.Trigger,
               {
                 ref,
                 id,
@@ -112,7 +112,7 @@ const SelectTrigger = forwardRef(
                   ),
                   isFloating && children,
                   /* @__PURE__ */ jsx(
-                    Icon,
+                    SelectPrimitive.Icon,
                     {
                       className: "select-trigger__icon",
                       "data-cy": `${finalDataCy}-icon`,
@@ -162,7 +162,7 @@ const SelectTrigger = forwardRef(
   }
 );
 SelectTrigger.displayName = "SelectTrigger";
-const SelectValue = Value;
+const SelectValue = SelectPrimitive.Value;
 const SelectContent = forwardRef(
   ({
     className,
@@ -174,8 +174,8 @@ const SelectContent = forwardRef(
   }, ref) => {
     const finalDataCy = dataCy || "select-content";
     const finalTestId = dataTestId || "select-content";
-    return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(
-      Content2,
+    return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+      SelectPrimitive.Content,
       {
         ref,
         className: cn("select-content", className),
@@ -184,7 +184,7 @@ const SelectContent = forwardRef(
         "data-cy": finalDataCy,
         "data-testid": finalTestId,
         ...props,
-        children: /* @__PURE__ */ jsx(Viewport, { className: "select-viewport", children })
+        children: /* @__PURE__ */ jsx(SelectPrimitive.Viewport, { className: "select-viewport", children })
       }
     ) });
   }
@@ -195,7 +195,7 @@ const SelectItem = forwardRef(
     const finalDataCy = dataCy || `select-item-${value}`;
     const finalTestId = dataTestId || `select-item-${value}`;
     return /* @__PURE__ */ jsx(
-      Item,
+      SelectPrimitive.Item,
       {
         ref,
         className: cn("select-item", className),
@@ -203,19 +203,19 @@ const SelectItem = forwardRef(
         "data-cy": finalDataCy,
         "data-testid": finalTestId,
         ...props,
-        children: /* @__PURE__ */ jsx(ItemText, { children })
+        children: /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
       }
     );
   }
 );
 SelectItem.displayName = "SelectItem";
-const SelectGroup = Group;
+const SelectGroup = SelectPrimitive.Group;
 const SelectLabel = forwardRef(
   ({ className, "data-cy": dataCy, "data-testid": dataTestId, ...props }, ref) => {
     const finalDataCy = dataCy || "select-label";
     const finalTestId = dataTestId || "select-label";
     return /* @__PURE__ */ jsx(
-      Label,
+      SelectPrimitive.Label,
       {
         ref,
         className: cn("select-group-label", className),
@@ -231,7 +231,7 @@ const SelectSeparator = forwardRef(({ className, "data-cy": dataCy, "data-testid
   const finalDataCy = dataCy || "select-separator";
   const finalTestId = dataTestId || "select-separator";
   return /* @__PURE__ */ jsx(
-    Separator,
+    SelectPrimitive.Separator,
     {
       ref,
       className: cn("select-separator", className),

package/dist/src/components/layout/divider/Divider.component.d.ts

@@ -0,0 +1,39 @@
+import { ComponentPropsWithoutRef } from 'react';
+
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+export interface DividerProps extends Omit<ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>, 'decorative'> {
+    /**
+     * The orientation of the divider
+     * @default 'horizontal'
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Whether the divider is decorative (hidden from screen readers)
+     * If true, uses aria-hidden. If false, uses role="separator"
+     * @default true
+     */
+    decorative?: boolean;
+    /**
+     * Spacing around the divider (uses design system spacing scale)
+     * Applied as margin-block for horizontal or margin-inline for vertical
+     * @default '0'
+     */
+    spacing?: '0' | '1' | '2' | '3' | '4' | '5' | '6' | '8' | '10' | '12';
+    /**
+     * Custom color for the divider line
+     * If not provided, uses --color-border from design tokens
+     */
+    color?: string;
+    /**
+     * Custom data-cy attribute for Cypress testing
+     * Auto-generates as "divider-{orientation}" if not provided
+     */
+    'data-cy'?: string;
+    /**
+     * Custom data-testid attribute for unit testing
+     * Auto-generates as "divider-{orientation}" if not provided
+     */
+    'data-testid'?: string;
+}
+export declare const Divider: import('react').ForwardRefExoticComponent<DividerProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Divider.component.d.ts.map