@caspeco/casper-ui-library 10.0.4 → 10.1.0

package/dist/components/input/input-recipe.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-recipe.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input-recipe.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,gBAAgB,EAAwC,MAAM,kBAAkB,CAAC;AA0D/F,eAAO,MAAM,WAAW,EAAE,gBAmExB,CAAC"}
+{"version":3,"file":"input-recipe.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input-recipe.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,gBAAgB,EAAwC,MAAM,kBAAkB,CAAC;AA0D/F,eAAO,MAAM,WAAW,EAAE,gBAwExB,CAAC"}

package/dist/components/input/input-recipe.js

@@ -1,14 +1,14 @@
 import { isTouchScreenDevice as t } from "../../theme/theme-helper.js";
-import { ThemeSpaceToken as e, ThemeFontSizeToken as n, ThemeColorToken as o, ThemeRadiusToken as d, ThemeFontToken as i } from "../../theme/theme-tokens.js";
+import { ThemeSpaceToken as e, ThemeFontSizeToken as n, ThemeColorToken as o, ThemeRadiusToken as i, ThemeFontToken as d } from "../../theme/theme-tokens.js";
 import { ThemeColorVariable as r } from "../../theme/theme-types.js";
 import { defineRecipe as l } from "@chakra-ui/react";
 const a = {
-  fontFamily: i.Body,
+  fontFamily: d.Body,
   color: o.OnSurface,
   borderWidth: "1px",
   borderColor: o.OnSurfaceBorder,
   background: o.Surface,
-  borderRadius: d.Small,
+  borderRadius: i.Small,
   paddingInline: e.Small,
   cursor: "text",
   width: "100%",
@@ -102,6 +102,11 @@ const a = {
       }
     },
     size: {
+      xl: {
+        "--input-height": "3.5rem",
+        fontSize: n.Medium,
+        px: e.Small
+      },
       lg: {
         "--input-height": "3rem",
         fontSize: n.Medium,

package/dist/components/input/input.composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input.composition.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,KAAK,mCAMjB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCAA2C,CAAC;AACjE,eAAO,MAAM,QAAQ,mCAA2C,CAAC;AACjE,eAAO,MAAM,OAAO,mCAInB,CAAC;AACF,eAAO,MAAM,OAAO,mCAA6D,CAAC;AAClF,eAAO,MAAM,OAAO,mCAA6D,CAAC;AAElF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,eAAO,MAAM,aAAa,mCAUzB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAIxB,CAAC"}
+{"version":3,"file":"input.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input.composition.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,KAAK,mCAOjB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCAA2C,CAAC;AACjE,eAAO,MAAM,QAAQ,mCAA2C,CAAC;AACjE,eAAO,MAAM,OAAO,mCAInB,CAAC;AACF,eAAO,MAAM,OAAO,mCAA6D,CAAC;AAClF,eAAO,MAAM,OAAO,mCAA6D,CAAC;AAElF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,eAAO,MAAM,aAAa,mCAUzB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAIxB,CAAC"}

package/dist/components/input/input.d.ts

@@ -9,6 +9,7 @@ export declare const Input: React.ForwardRefExoticComponent<import('./types.js')
     id?: string | undefined | undefined;
     name?: string | undefined | undefined;
     type?: React.HTMLInputTypeAttribute | undefined;
+    onPaste?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
     onFocus?: React.FocusEventHandler<HTMLInputElement> | undefined;
     onBlur?: React.FocusEventHandler<HTMLInputElement> | undefined;
     onChange?: React.ChangeEventHandler<HTMLInputElement, HTMLInputElement> | undefined;

package/dist/components/input/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;GAIG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;wNA2DhB,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../lib/components/input/input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B;;;;GAIG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;wNAoFhB,CAAC"}

package/dist/components/input/input.js

@@ -1,61 +1,85 @@
-import { jsx as z } from "react/jsx-runtime";
-import { c as j } from "../../_virtual/compiler-runtime.js";
-import { Input as C, InputGroup as D } from "@chakra-ui/react";
-import G from "react";
-import { getVisualStateStyle as H } from "./helper.js";
-import { ThemeSpaceVariable as T, ThemeColorVariable as $ } from "../../theme/theme-types.js";
-const K = G.forwardRef((b, E) => {
-  const e = j.c(40);
-  let o, n, d, s, t, r, a, l, v, h, i;
-  e[0] !== b ? ({
-    size: v,
-    visualState: i,
-    leftAddon: s,
-    rightAddon: a,
+import { jsx as $ } from "react/jsx-runtime";
+import { c as N } from "../../_virtual/compiler-runtime.js";
+import { useMeasuredWidth as q } from "../../hooks/use-measured-width.js";
+import { ThemeBreakPointToken as W } from "../../theme/theme-tokens.js";
+import { useBreakpointValue as X, Input as Z, InputGroup as F } from "@chakra-ui/react";
+import L from "react";
+import { getVisualStateStyle as Y } from "./helper.js";
+import { ThemeColorVariable as w, ThemeSpaceVariable as b } from "../../theme/theme-types.js";
+const J = {
+  sm: "2rem",
+  md: "2.5rem",
+  lg: "3rem",
+  xl: "3.5rem"
+}, P = "md";
+function D(p, i, e) {
+  if (p)
+    return i !== null ? `${i}px` : e;
+}
+const re = L.forwardRef((p, i) => {
+  const e = N.c(48);
+  let r, s, a, d, t, m, c, n, S, E, l;
+  e[0] !== p ? ({
+    size: S,
+    visualState: l,
+    leftAddon: d,
+    rightAddon: c,
     leftElement: t,
-    rightElement: l,
-    variant: h,
-    isDisabled: o,
-    isReadOnly: n,
-    isRequired: d,
-    ...r
-  } = b, e[0] = b, e[1] = o, e[2] = n, e[3] = d, e[4] = s, e[5] = t, e[6] = r, e[7] = a, e[8] = l, e[9] = v, e[10] = h, e[11] = i) : (o = e[1], n = e[2], d = e[3], s = e[4], t = e[5], r = e[6], a = e[7], l = e[8], v = e[9], h = e[10], i = e[11]);
-  const m = v === void 0 ? "md" : v, I = h === void 0 ? "outline" : h;
-  let S;
-  e[12] !== i ? (S = i ? H(i) : void 0, e[12] = i, e[13] = S) : S = e[13];
-  const R = S, x = m === "lg" ? T.Medium : T.Small, V = m === "lg" ? "3rem" : m === "md" ? "2.5rem" : "2rem";
+    rightElement: n,
+    variant: E,
+    isDisabled: r,
+    isReadOnly: s,
+    isRequired: a,
+    ...m
+  } = p, e[0] = p, e[1] = r, e[2] = s, e[3] = a, e[4] = d, e[5] = t, e[6] = m, e[7] = c, e[8] = n, e[9] = S, e[10] = E, e[11] = l) : (r = e[1], s = e[2], a = e[3], d = e[4], t = e[5], m = e[6], c = e[7], n = e[8], S = e[9], E = e[10], l = e[11]);
+  const o = S === void 0 ? P : S, T = E === void 0 ? "outline" : E;
   let g;
-  e[14] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (g = {
-    color: $.OnSurface,
+  e[12] !== l ? (g = l ? Y(l) : void 0, e[12] = l, e[13] = g) : g = e[13];
+  const x = g, G = X(typeof o == "string" || o === void 0 ? {
+    [W.Base]: o ?? P
+  } : o, {
+    fallback: P
+  }) ?? P, f = J[G], [R, A] = q(!!t), [k, O] = q(!!n), V = !!t;
+  let h;
+  e[14] !== f || e[15] !== A || e[16] !== V ? (h = D(V, A, f), e[14] = f, e[15] = A, e[16] = V, e[17] = h) : h = e[17];
+  const j = h, z = !!n;
+  let v;
+  e[18] !== O || e[19] !== f || e[20] !== z ? (v = D(z, O, f), e[18] = O, e[19] = f, e[20] = z, e[21] = v) : v = e[21];
+  const C = v;
+  let I;
+  e[22] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (I = {
+    pointerEvents: "auto",
+    height: "100%",
+    color: w.OnSurface,
     _disabled: {
       opacity: 1,
-      color: $.OnSurfaceSubdued
+      color: w.OnSurfaceSubdued
     }
-  }, e[14] = g) : g = e[14];
-  const q = g, _ = t ? x : void 0, w = t ? V : void 0;
-  let c;
-  e[15] !== _ || e[16] !== w ? (c = {
-    paddingInline: _,
-    width: w,
-    ...q
-  }, e[15] = _, e[16] = w, e[17] = c) : c = e[17];
-  const A = l ? x : void 0, O = l ? V : void 0;
-  let f;
-  e[18] !== A || e[19] !== O ? (f = {
-    paddingInline: A,
-    width: O,
-    ...q
-  }, e[18] = A, e[19] = O, e[20] = f) : f = e[20];
-  let u;
-  e[21] !== c || e[22] !== f ? (u = {
-    "& > div:first-of-type": c,
-    "& > div:last-of-type": f
-  }, e[21] = c, e[22] = f, e[23] = u) : u = e[23];
-  let p;
-  e[24] !== R || e[25] !== o || e[26] !== n || e[27] !== d || e[28] !== E || e[29] !== r || e[30] !== m || e[31] !== I ? (p = /* @__PURE__ */ z(C, { ref: E, css: R, size: m, variant: I, disabled: o, readOnly: n, required: d, ...r }), e[24] = R, e[25] = o, e[26] = n, e[27] = d, e[28] = E, e[29] = r, e[30] = m, e[31] = I, e[32] = p) : p = e[32];
+  }, e[22] = I) : I = e[22];
+  const U = I;
+  let _;
+  e[23] !== t || e[24] !== R ? (_ = t ? {
+    ref: R,
+    justifyContent: "flex-start",
+    paddingInlineStart: b.Small,
+    paddingInlineEnd: b.XSmall,
+    ...U
+  } : void 0, e[23] = t, e[24] = R, e[25] = _) : _ = e[25];
+  const H = _;
   let y;
-  return e[33] !== s || e[34] !== t || e[35] !== a || e[36] !== l || e[37] !== u || e[38] !== p ? (y = /* @__PURE__ */ z(D, { startElement: t, endElement: l, startAddon: s, endAddon: a, width: "100%", css: u, children: p }), e[33] = s, e[34] = t, e[35] = a, e[36] = l, e[37] = u, e[38] = p, e[39] = y) : y = e[39], y;
+  e[26] !== k || e[27] !== n ? (y = n ? {
+    ref: k,
+    justifyContent: "flex-end",
+    paddingInlineStart: b.XSmall,
+    paddingInlineEnd: b.Small,
+    ...U
+  } : void 0, e[26] = k, e[27] = n, e[28] = y) : y = e[28];
+  const M = y;
+  let u;
+  e[29] !== x || e[30] !== C || e[31] !== r || e[32] !== s || e[33] !== a || e[34] !== i || e[35] !== m || e[36] !== o || e[37] !== j || e[38] !== T ? (u = /* @__PURE__ */ $(Z, { ref: i, css: x, size: o, variant: T, disabled: r, readOnly: s, required: a, ps: j, pe: C, ...m }), e[29] = x, e[30] = C, e[31] = r, e[32] = s, e[33] = a, e[34] = i, e[35] = m, e[36] = o, e[37] = j, e[38] = T, e[39] = u) : u = e[39];
+  let B;
+  return e[40] !== M || e[41] !== d || e[42] !== t || e[43] !== c || e[44] !== n || e[45] !== H || e[46] !== u ? (B = /* @__PURE__ */ $(F, { startElement: t, endElement: n, startAddon: d, endAddon: c, startElementProps: H, endElementProps: M, width: "100%", children: u }), e[40] = M, e[41] = d, e[42] = t, e[43] = c, e[44] = n, e[45] = H, e[46] = u, e[47] = B) : B = e[47], B;
 });
 export {
-  K as Input
+  re as Input
 };

package/dist/components/input/types.d.ts

@@ -4,7 +4,7 @@ import { ReactNode } from 'react';
 export type VisualInputState = "success" | "warning";
 export type CustomProperties = {
     /** Size of input. Defaults to medium / 'md'. */
-    size?: ConditionalValue<"sm" | "md" | "lg">;
+    size?: ConditionalValue<"sm" | "md" | "lg" | "xl">;
     /** Element to append to the right of input */
     rightAddon?: ReactNode;
     /** Element to append to the left of input */
@@ -22,7 +22,7 @@ export type CustomProperties = {
     isReadOnly?: boolean;
     isRequired?: boolean;
 };
-type ChakraInputProperties = Pick<ChakraInputProps, "id" | "type" | "value" | "placeholder" | "onChange" | "onBlur" | "onFocus" | "onKeyDown" | "name" | "autoComplete" | "autoFocus" | "pattern" | "inputMode" | "defaultValue">;
+type ChakraInputProperties = Pick<ChakraInputProps, "id" | "type" | "value" | "placeholder" | "onChange" | "onBlur" | "onFocus" | "onKeyDown" | "onPaste" | "name" | "autoComplete" | "autoFocus" | "pattern" | "inputMode" | "defaultValue">;
 export type InputProps = CustomProperties & ChakraInputProperties & CustomChakraBoxProps & LayoutProps & MarginProps & PaddingProps & TypographyProps;
 export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/components/input/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/input/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC7G,OAAO,KAAK,EAAE,UAAU,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,CAAC;AAErD,MAAM,MAAM,gBAAgB,GAAG;IAC9B,gDAAgD;IAChD,IAAI,CAAC,EAAE,gBAAgB,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;IAC5C,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uEAAuE;IACvE,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,sEAAsE;IACtE,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;mGAC+F;IAC/F,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,uEAAuE;IACvE,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAG9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,KAAK,qBAAqB,GAAG,IAAI,CAChC,gBAAgB,EACd,IAAI,GACJ,MAAM,GACN,OAAO,GACP,aAAa,GACb,UAAU,GACV,QAAQ,GACR,SAAS,GACT,WAAW,GACX,MAAM,GACN,cAAc,GACd,WAAW,GACX,SAAS,GACT,WAAW,GACX,cAAc,CAChB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,gBAAgB,GACxC,qBAAqB,GACrB,oBAAoB,GACpB,WAAW,GACX,WAAW,GACX,YAAY,GACZ,eAAe,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/input/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC7G,OAAO,KAAK,EAAE,UAAU,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,CAAC;AAErD,MAAM,MAAM,gBAAgB,GAAG;IAC9B,gDAAgD;IAChD,IAAI,CAAC,EAAE,gBAAgB,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;IACnD,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uEAAuE;IACvE,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,sEAAsE;IACtE,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;mGAC+F;IAC/F,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,uEAAuE;IACvE,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAG9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,KAAK,qBAAqB,GAAG,IAAI,CAChC,gBAAgB,EACd,IAAI,GACJ,MAAM,GACN,OAAO,GACP,aAAa,GACb,UAAU,GACV,QAAQ,GACR,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,cAAc,GACd,WAAW,GACX,SAAS,GACT,WAAW,GACX,cAAc,CAChB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,gBAAgB,GACxC,qBAAqB,GACrB,oBAAoB,GACpB,WAAW,GACX,WAAW,GACX,YAAY,GACZ,eAAe,CAAC"}

package/dist/components/menu/menu-box-button.d.ts

@@ -5,5 +5,8 @@ import { ButtonProps } from '@chakra-ui/react';
  * A Box that acts as a trigger for Menu
  * @see Docs https://caspeco.github.io/casper-ui-library/components/menu/
  */
-export declare const MenuBoxButton: import('react').ForwardRefExoticComponent<Omit<BoxProps, InteractionProps> & Pick<ButtonProps, InteractionProps> & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const MenuBoxButton: import('react').ForwardRefExoticComponent<Omit<BoxProps, InteractionProps> & Pick<ButtonProps, "_focus" | InteractionProps> & {
+    /** If `true`, the trigger is disabled and the menu cannot be opened. */
+    isDisabled?: boolean;
+} & import('react').RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=menu-box-button.d.ts.map

package/dist/components/menu/menu-box-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-box-button.d.ts","sourceRoot":"","sources":["../../../lib/components/menu/menu-box-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAA4C,KAAK,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK9F;;;GAGG;AACH,eAAO,MAAM,aAAa,sKAUzB,CAAC"}
+{"version":3,"file":"menu-box-button.d.ts","sourceRoot":"","sources":["../../../lib/components/menu/menu-box-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAA4C,KAAK,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAS9F;;;GAGG;AACH,eAAO,MAAM,aAAa;IARxB,wEAAwE;iBAC3D,OAAO;qDAiBrB,CAAC"}

package/dist/components/menu/menu-box-button.js

@@ -1,18 +1,19 @@
-import { jsx as l } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import { c as m } from "../../_virtual/compiler-runtime.js";
-import { MenuTrigger as s, Button as u } from "@chakra-ui/react";
-import { forwardRef as p } from "react";
-const c = p((i, n) => {
-  const t = m.c(7);
-  let e, o;
-  t[0] !== i ? ({
-    children: e,
-    ...o
-  } = i, t[0] = i, t[1] = e, t[2] = o) : (e = t[1], o = t[2]);
-  let r;
-  return t[3] !== e || t[4] !== o || t[5] !== n ? (r = /* @__PURE__ */ l(s, { asChild: !0, children: /* @__PURE__ */ l(u, { ref: n, unstyled: !0, ...o, children: e }) }), t[3] = e, t[4] = o, t[5] = n, t[6] = r) : r = t[6], r;
+import { MenuTrigger as u, Button as p } from "@chakra-ui/react";
+import { forwardRef as d } from "react";
+const a = d((l, s) => {
+  const e = m.c(9);
+  let t, o, r;
+  e[0] !== l ? ({
+    children: t,
+    isDisabled: o,
+    ...r
+  } = l, e[0] = l, e[1] = t, e[2] = o, e[3] = r) : (t = e[1], o = e[2], r = e[3]);
+  let i;
+  return e[4] !== t || e[5] !== o || e[6] !== r || e[7] !== s ? (i = /* @__PURE__ */ n(u, { asChild: !0, children: /* @__PURE__ */ n(p, { ref: s, unstyled: !0, disabled: o, ...r, children: t }) }), e[4] = t, e[5] = o, e[6] = r, e[7] = s, e[8] = i) : i = e[8], i;
 });
-c.displayName = "MenuBoxButton";
+a.displayName = "MenuBoxButton";
 export {
-  c as MenuBoxButton
+  a as MenuBoxButton
 };

package/dist/components/phone-input/country-data.d.ts

@@ -0,0 +1,22 @@
+import { CountryCode } from 'libphonenumber-js';
+import { Locales } from './translations.js';
+/** Lowercases and strips diacritics for accent-insensitive search (e.g. "espana" matches "España"). */
+export declare function normalizeForSearch(value: string): string;
+/** A country row produced by {@link getLocalizedCountries}. */
+export interface CountryItem {
+    code: CountryCode;
+    /** Name in the UI locale (e.g. "Germany"/"Tyskland"); shown in the list. */
+    name: string;
+    /** Name in the country's own language (e.g. "Deutschland" for DE). */
+    nativeName: string;
+    callingCode: string;
+    /** Normalized search haystack, e.g. "germany deutschland de 49" for DE in en-US. */
+    searchText: string;
+}
+/**
+ * Country list localized to `locale`, sorted by localized name, memoized per locale.
+ * Each item's `searchText` is precomputed so callers filter with one substring match.
+ * The returned array is shared — do not mutate it.
+ */
+export declare function getLocalizedCountries(locale: Locales): CountryItem[];
+//# sourceMappingURL=country-data.d.ts.map

package/dist/components/phone-input/country-data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-data.d.ts","sourceRoot":"","sources":["../../../lib/components/phone-input/country-data.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAC1F,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAE9C,uGAAuG;AACvG,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAKxD;AAQD,+DAA+D;AAC/D,MAAM,WAAW,WAAW;IAC3B,IAAI,EAAE,WAAW,CAAC;IAClB,4EAA4E;IAC5E,IAAI,EAAE,MAAM,CAAC;IACb,sEAAsE;IACtE,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,oFAAoF;IACpF,UAAU,EAAE,MAAM,CAAC;CACnB;AAgBD;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,OAAO,GAAG,WAAW,EAAE,CAmBpE"}

package/dist/components/phone-input/country-data.js

@@ -0,0 +1,38 @@
+import { getCountries as m } from "../../node_modules/libphonenumber-js/min/exports/getCountries.js";
+import { getCountryCallingCode as r } from "../../node_modules/libphonenumber-js/min/exports/getCountryCallingCode.js";
+function l(e) {
+  return e.normalize("NFD").replace(new RegExp("\\p{Diacritic}", "gu"), "").toLowerCase();
+}
+const s = m().map((e) => {
+  const n = new Intl.Locale(`und-${e}`).maximize().language, t = new Intl.DisplayNames([n], {
+    type: "region"
+  }).of(e) ?? e;
+  return {
+    code: e,
+    callingCode: r(e),
+    nativeName: t
+  };
+}), o = /* @__PURE__ */ new Map();
+function C(e) {
+  let n = o.get(e);
+  if (!n) {
+    const t = new Intl.DisplayNames([e], {
+      type: "region"
+    });
+    n = s.map((a) => {
+      const i = t.of(a.code) ?? a.code;
+      return {
+        code: a.code,
+        name: i,
+        nativeName: a.nativeName,
+        callingCode: a.callingCode,
+        searchText: l(`${i} ${a.nativeName} ${a.code} ${a.callingCode}`)
+      };
+    }).sort((a, i) => a.name.localeCompare(i.name, e)), o.set(e, n);
+  }
+  return n;
+}
+export {
+  C as getLocalizedCountries,
+  l as normalizeForSearch
+};

package/dist/components/phone-input/country-data.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=country-data.spec.d.ts.map

package/dist/components/phone-input/country-data.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-data.spec.d.ts","sourceRoot":"","sources":["../../../lib/components/phone-input/country-data.spec.ts"],"names":[],"mappings":""}

package/dist/components/phone-input/country-list.d.ts

@@ -0,0 +1,19 @@
+import { CountryCode } from 'libphonenumber-js';
+import { ReactNode } from 'react';
+import { CountryItem } from './country-data.js';
+interface CountryListProps {
+    items: CountryItem[];
+    /** Renders the row contents for an item (flag, name, calling code). */
+    renderItem: (item: CountryItem) => ReactNode;
+    isReadOnly?: boolean;
+    /** The currently selected country code; its row renders a checkmark. */
+    selectedCode?: CountryCode;
+}
+/**
+ * Virtualized country list: only the visible rows are mounted, so the ~245-country dropdown
+ * stays fast. Rendered inside the Menu content, so clicking a row still selects through the
+ * Menu's `onSelect`.
+ */
+export declare function CountryList({ items, renderItem, isReadOnly, selectedCode }: CountryListProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=country-list.d.ts.map

package/dist/components/phone-input/country-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-list.d.ts","sourceRoot":"","sources":["../../../lib/components/phone-input/country-list.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAMlD,UAAU,gBAAgB;IACzB,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,uEAAuE;IACvE,UAAU,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,SAAS,CAAC;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wEAAwE;IACxE,YAAY,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,UAAkB,EAAE,YAAY,EAAE,EAAE,gBAAgB,+BA2CpG"}

package/dist/components/phone-input/country-list.js

@@ -0,0 +1,27 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Box as i } from "@chakra-ui/react";
+import { useVirtualizer as a } from "../../node_modules/@tanstack/react-virtual/dist/esm/index.js";
+import { useRef as u } from "react";
+import { MenuItem as d } from "../menu/menu-item.js";
+import { CheckIcon as f } from "../icon/icons/check-icon.js";
+const h = 40, p = 250, I = 300;
+function _({
+  items: n,
+  renderItem: s,
+  isReadOnly: c = !1,
+  selectedCode: m
+}) {
+  const l = u(null), o = a({
+    count: n.length,
+    getScrollElement: () => l.current,
+    estimateSize: () => h,
+    overscan: 8
+  });
+  return /* @__PURE__ */ t(i, { ref: l, maxHeight: p, minWidth: I, overflowY: "auto", children: /* @__PURE__ */ t(i, { height: o.getTotalSize(), position: "relative", width: "100%", children: o.getVirtualItems().map((r) => {
+    const e = n[r.index];
+    return e ? /* @__PURE__ */ t(i, { "data-index": r.index, ref: o.measureElement, position: "absolute", top: 0, left: 0, width: "100%", transform: `translateY(${r.start}px)`, children: /* @__PURE__ */ t(d, { value: e.code, isDisabled: c, rightIcon: e.code === m ? f : void 0, children: s(e) }) }, e.code) : null;
+  }) }) });
+}
+export {
+  _ as CountryList
+};

package/dist/components/phone-input/country-selector.d.ts

@@ -0,0 +1,59 @@
+import { Placement } from '../combobox/index.js';
+import { CountryCode } from 'libphonenumber-js';
+import { default as React } from 'react';
+import { Locales } from './translations.js';
+export interface CountrySelectorProps {
+    /**
+     * The currently selected country code (e.g., 'US', 'GB', 'FR')
+     */
+    value?: CountryCode;
+    /**
+     * Callback fired when the selected country changes
+     */
+    onChange: (country: CountryCode) => void;
+    /**
+     * Placeholder text displayed in the input field
+     * @default "Search country..."
+     */
+    placeholder?: string;
+    /**
+     * Whether the selector is disabled
+     * @default false
+     */
+    isDisabled?: boolean;
+    /** Size of the input and menu items
+     * @default "md"
+     */
+    size?: "sm" | "md" | "lg" | "xl";
+    /**
+     * Whether the field is read-only
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /** Menu placement for the dropdown (optional) */
+    menuPlacement?: Placement;
+    /** Locale for translations */
+    locale?: Locales;
+}
+/**
+ * Country selector component for phone input
+ *
+ * Provides a searchable dropdown to select a country. Uses the Menu component
+ * with custom search functionality for efficient searching through 245+ countries/regions.
+ *
+ * @example
+ * ```tsx
+ * const [country, setCountry] = React.useState<CountryCode>("US");
+ *
+ * <CountrySelector
+ *   id="country-selector"
+ *   value={country}
+ *   onChange={setCountry}
+ *   placeholder="Select country..."
+ * />
+ * ```
+ *
+ * @see Docs https://caspeco.github.io/casper-ui-library/components/phone-input
+ */
+export declare function CountrySelector({ value, onChange, placeholder, isReadOnly, size, menuPlacement, locale, isDisabled, }: CountrySelectorProps): React.JSX.Element;
+//# sourceMappingURL=country-selector.d.ts.map

package/dist/components/phone-input/country-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-selector.d.ts","sourceRoot":"","sources":["../../../lib/components/phone-input/country-selector.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAWvD,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,OAAO,EAAgB,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AA2B5D,MAAM,WAAW,oBAAoB;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IAEpB;;OAEG;IACH,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IAEzC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,iDAAiD;IACjD,aAAa,CAAC,EAAE,SAAS,CAAC;IAE1B,8BAA8B;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,eAAe,CAAC,EAC/B,KAAK,EACL,QAAQ,EACR,WAAW,EACX,UAAkB,EAClB,IAAW,EACX,aAAa,EACb,MAAgB,EAChB,UAAkB,GAClB,EAAE,oBAAoB,qBAiHtB"}

package/dist/components/phone-input/country-selector.js

@@ -0,0 +1,120 @@
+import { jsx as l, jsxs as V } from "react/jsx-runtime";
+import { c as Se } from "../../_virtual/compiler-runtime.js";
+import * as ge from "../../node_modules/country-flag-icons/react/3x2/index.js";
+import { useState as Ce, useId as ye } from "react";
+import { getLocalizedCountries as xe, normalizeForSearch as be } from "./country-data.js";
+import { CountryList as ve } from "./country-list.js";
+import { translations as Ie } from "./translations.js";
+import { ModuleWebIcon as _e } from "../icon/icons/module-web-icon.js";
+import { MenuIconButton as Fe } from "../menu/menu-icon-button.js";
+import { SelectIcon as Te } from "../icon/icons/select-icon.js";
+import { Text as te } from "../text/text.js";
+import ze from "../../node_modules/country-flag-icons/modules/hasFlag.js";
+import { Menu as Oe } from "../menu/menu.js";
+import { Flex as fe } from "../flex/flex.js";
+import { MenuBoxButton as Be } from "../menu/menu-box-button.js";
+import { SearchIcon as Me } from "../icon/icons/search-icon.js";
+import { Box as ue } from "../box/box.js";
+import { FormControl as we } from "../form-control/form-control.js";
+import { Input as Le } from "../input/input.js";
+import { Divider as Ee } from "../divider/divider.js";
+import { MenuList as De } from "../menu/menu-list.js";
+import { ThemeSpaceVariable as Y, ThemeColorVariable as oe, ThemeFontSizeVariable as je } from "../../theme/theme-types.js";
+function pe(n) {
+  const e = n.code;
+  if (!ze(e))
+    return null;
+  const t = ge[e];
+  return t ? /* @__PURE__ */ l(t, { "aria-label": n.name, height: 16, width: 24, style: {
+    flexShrink: 0,
+    boxShadow: `0 0 0 1px ${oe.OnSurfaceBorder}`
+  } }) : null;
+}
+const ke = {
+  xs: 12,
+  sm: 12,
+  md: 16,
+  lg: 20,
+  xl: 24
+};
+function it(n) {
+  const e = Se.c(87), {
+    value: t,
+    onChange: P,
+    placeholder: he,
+    isReadOnly: le,
+    size: ne,
+    menuPlacement: Z,
+    locale: re,
+    isDisabled: ie
+  } = n, q = le === void 0 ? !1 : le, se = ne === void 0 ? "md" : ne, $ = re === void 0 ? "en-US" : re, c = ie === void 0 ? !1 : ie, [d, ae] = Ce(""), G = ye(), m = Ie[$], J = se === "sm" ? "xs" : "sm", R = ke[se];
+  let f, u, p, h, S, r, g, i, C, y, x, b, s, v, I, _, F, a, T, z, O, B, M;
+  if (e[0] !== c || e[1] !== $ || e[2] !== R || e[3] !== Z || e[4] !== P || e[5] !== d || e[6] !== t) {
+    const Q = xe($), ce = be(d.trim());
+    r = ce ? Q.filter((o) => o.searchText.includes(ce)) : Q;
+    const me = t ? r.find((o) => o.code === t) : void 0;
+    S = me ? [me, ...r.filter((o) => o.code !== t)] : r;
+    let A;
+    e[30] !== t ? (A = (o) => o.code === t, e[30] = t, e[31] = A) : A = e[31];
+    const de = Q.find(A);
+    let H;
+    e[32] !== P ? (H = (o) => {
+      P(o), ae("");
+    }, e[32] = P, e[33] = H) : H = e[33];
+    const ee = H;
+    let N;
+    e[34] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (N = (o) => {
+      ae(o.target.value);
+    }, e[34] = N) : N = e[34], g = N, h = Re, p = Oe, e[35] !== ee ? (s = (o) => {
+      ee(o.value);
+    }, e[35] = ee, e[36] = s) : s = e[36], v = !0, I = Z, _ = !0, F = "unmount", e[37] !== R ? (a = [-8, R], e[37] = R, e[38] = a) : a = e[38], u = fe, y = "center", x = Y.XSmall, b = "center", f = Be, T = "flex", z = c, O = c ? "disabled" : "pointer", B = -1, M = !0, e[39] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (i = {
+      outline: "none"
+    }, e[39] = i) : i = e[39], C = de ? pe(de) : /* @__PURE__ */ l(_e, {}), e[0] = c, e[1] = $, e[2] = R, e[3] = Z, e[4] = P, e[5] = d, e[6] = t, e[7] = f, e[8] = u, e[9] = p, e[10] = h, e[11] = S, e[12] = r, e[13] = g, e[14] = i, e[15] = C, e[16] = y, e[17] = x, e[18] = b, e[19] = s, e[20] = v, e[21] = I, e[22] = _, e[23] = F, e[24] = a, e[25] = T, e[26] = z, e[27] = O, e[28] = B, e[29] = M;
+  } else
+    f = e[7], u = e[8], p = e[9], h = e[10], S = e[11], r = e[12], g = e[13], i = e[14], C = e[15], y = e[16], x = e[17], b = e[18], s = e[19], v = e[20], I = e[21], _ = e[22], F = e[23], a = e[24], T = e[25], z = e[26], O = e[27], B = e[28], M = e[29];
+  let w;
+  e[40] !== f || e[41] !== i || e[42] !== C || e[43] !== T || e[44] !== z || e[45] !== O || e[46] !== B || e[47] !== M ? (w = /* @__PURE__ */ l(f, { display: T, isDisabled: z, cursor: O, tabIndex: B, "aria-hidden": M, _focus: i, children: C }), e[40] = f, e[41] = i, e[42] = C, e[43] = T, e[44] = z, e[45] = O, e[46] = B, e[47] = M, e[48] = w) : w = e[48];
+  let L;
+  e[49] !== J || e[50] !== c || e[51] !== m.openCountrySelector ? (L = /* @__PURE__ */ l(Fe, { size: J, variant: "ghost", icon: Te, isDisabled: c, "aria-label": m.openCountrySelector }), e[49] = J, e[50] = c, e[51] = m.openCountrySelector, e[52] = L) : L = e[52];
+  let E;
+  e[53] !== u || e[54] !== y || e[55] !== x || e[56] !== b || e[57] !== w || e[58] !== L ? (E = /* @__PURE__ */ V(u, { align: y, gap: x, justify: b, children: [
+    w,
+    L
+  ] }), e[53] = u, e[54] = y, e[55] = x, e[56] = b, e[57] = w, e[58] = L, e[59] = E) : E = e[59];
+  const K = he ?? m.searchCountryPlaceholder;
+  let U;
+  e[60] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (U = /* @__PURE__ */ l(Me, {}), e[60] = U) : U = e[60];
+  let D;
+  e[61] !== g || e[62] !== G || e[63] !== d || e[64] !== K ? (D = /* @__PURE__ */ l(ue, { onClick: Pe, children: /* @__PURE__ */ l(we, { isInvalid: !1, children: /* @__PURE__ */ l(Le, { id: G, placeholder: K, size: "md", value: d, onChange: g, variant: "ghost", leftElement: U }) }) }), e[61] = g, e[62] = G, e[63] = d, e[64] = K, e[65] = D) : D = e[65];
+  let W;
+  e[66] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (W = /* @__PURE__ */ l(Ee, { mb: "3px" }), e[66] = W) : W = e[66];
+  let j;
+  e[67] !== h || e[68] !== S || e[69] !== r.length || e[70] !== q || e[71] !== m.noCountriesFound || e[72] !== t ? (j = r.length > 0 ? /* @__PURE__ */ l(ve, { items: S, renderItem: h, isReadOnly: q, selectedCode: t }) : /* @__PURE__ */ l(te, { padding: Y.Medium, paddingBottom: Y.X2Large, fontSize: je.Large, color: oe.OnBackgroundHeader, fontWeight: "500", textAlign: "center", width: "300px", children: m.noCountriesFound }), e[67] = h, e[68] = S, e[69] = r.length, e[70] = q, e[71] = m.noCountriesFound, e[72] = t, e[73] = j) : j = e[73];
+  let k;
+  e[74] !== D || e[75] !== j ? (k = /* @__PURE__ */ V(De, { overflow: "unset", overflowY: "unset", paddingTop: 0, children: [
+    D,
+    W,
+    j
+  ] }), e[74] = D, e[75] = j, e[76] = k) : k = e[76];
+  let X;
+  return e[77] !== p || e[78] !== s || e[79] !== v || e[80] !== I || e[81] !== _ || e[82] !== F || e[83] !== a || e[84] !== E || e[85] !== k ? (X = /* @__PURE__ */ V(p, { onSelect: s, closeOnSelect: v, placement: I, isLazy: _, lazyBehavior: F, offset: a, children: [
+    E,
+    k
+  ] }), e[77] = p, e[78] = s, e[79] = v, e[80] = I, e[81] = _, e[82] = F, e[83] = a, e[84] = E, e[85] = k, e[86] = X) : X = e[86], X;
+}
+function Pe(n) {
+  return n.stopPropagation();
+}
+function Re(n) {
+  return /* @__PURE__ */ V(fe, { direction: "row", gap: Y.Small, alignItems: "center", children: [
+    pe(n),
+    /* @__PURE__ */ V(ue, { children: [
+      /* @__PURE__ */ l(te, { display: "inline", children: n.name }),
+      " ",
+      /* @__PURE__ */ l(te, { display: "inline", color: oe.OnSurfaceSubdued, children: `(+${n.callingCode})` })
+    ] })
+  ] });
+}
+export {
+  it as CountrySelector
+};

package/dist/components/phone-input/index.d.ts

@@ -0,0 +1,5 @@
+export { PhoneInput } from './phone-input.js';
+export { usePhoneInput } from './use-phone-input.js';
+export type { UsePhoneInputOptions, UsePhoneInputReturn } from './use-phone-input.js';
+export type { CountryCode, PhoneInputControlProps, PhoneInputProps, PhoneValidationResult } from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/phone-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/phone-input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,YAAY,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACnF,YAAY,EAAE,WAAW,EAAE,sBAAsB,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC"}