@cloudflare/kumo 2.2.1 → 2.3.0

package/dist/chunks/{sensitive-input-hokm527ollnz9dqc.js → sensitive-input-bjg6m791yz7g6bn3.js}

@@ -1,87 +1,90 @@
 "use client";
-import { jsxs as y, Fragment as ce, jsx as a } from "react/jsx-runtime";
+import { jsxs as b, Fragment as ce, jsx as a } from "react/jsx-runtime";
 import { EyeSlash as ue, Eye as pe } from "@phosphor-icons/react";
-import { forwardRef as de, useState as C, useRef as N, useId as T, useCallback as c, useEffect as fe } from "react";
+import { forwardRef as de, useState as C, useRef as N, useId as T, useCallback as c, useEffect as me } from "react";
 import { c as p } from "./cn-ct4n7r74mh8y0f48.js";
-import { K as me, i as he } from "./input-i3os21puacqw4r75.js";
-import { F as ge } from "./field-l1oapopp6kjnephi.js";
-import { I as ve } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
-const Te = me, M = {
+import { K as fe, i as he } from "./input-mv7giprcc6hfkpq3.js";
+import { F as ve } from "./field-n16udu32tpyq5udz.js";
+import { I as ge } from "./vendor-base-ui-mzjqwv5teijixz8h.js";
+const Se = fe, ye = {
   size: "base",
   variant: "default"
 }, be = de(
   ({
-    value: R,
+    value: S,
     defaultValue: B = "",
-    onChange: S,
-    onValueChange: E,
+    onChange: E,
+    onValueChange: R,
     onCopy: k,
-    size: t = M.size,
-    variant: j = M.variant,
-    disabled: r = !1,
+    size: t = ye.size,
+    variant: V,
+    disabled: i = !1,
     readOnly: d = !1,
-    id: $,
-    autoComplete: H = "off",
-    className: L,
-    label: v,
-    labelTooltip: X,
-    description: Y,
-    error: b,
-    required: W,
-    ...q
+    id: j,
+    autoComplete: $ = "off",
+    className: H,
+    label: y,
+    labelTooltip: L,
+    description: X,
+    error: m,
+    required: Y,
+    ...O
   }, f) => {
-    const G = typeof v == "string" ? v : "Sensitive value", x = R !== void 0, [J, O] = C(B), m = x ? R : J, o = m.length > 0, [n, l] = C(
+    process.env.NODE_ENV !== "production" && V === "error" && console.warn(
+      '[Kumo SensitiveInput]: variant="error" is deprecated. Error styling is now automatically applied when the `error` prop is truthy. Simply remove the variant prop and pass an error message instead.'
+    );
+    const W = V ?? (m ? "error" : "default"), q = typeof y == "string" ? y : "Sensitive value", x = S !== void 0, [G, J] = C(B), h = x ? S : G, o = h.length > 0, [n, l] = C(
       () => o ? "masked" : "empty"
-    ), [h, w] = C(!1), I = N(null), u = N(null), V = T(), Q = T(), Z = $ ?? Q, K = T(), z = c(
+    ), [v, w] = C(!1), I = N(null), u = N(null), K = T(), Q = T(), Z = j ?? Q, A = T(), z = c(
       (e) => {
         I.current = e, typeof f == "function" ? f(e) : f && (f.current = e);
       },
       [f]
     );
-    fe(() => {
-      if (h) {
+    me(() => {
+      if (v) {
         const e = setTimeout(() => w(!1), 2e3);
         return () => clearTimeout(e);
       }
-    }, [h]);
+    }, [v]);
     const ee = c(
       async (e) => {
         e.stopPropagation();
         try {
           if (typeof navigator < "u" && navigator.clipboard && typeof navigator.clipboard.writeText == "function") {
-            await navigator.clipboard.writeText(m), w(!0), k?.();
+            await navigator.clipboard.writeText(h), w(!0), k?.();
             return;
           }
         } catch {
         }
         if (typeof document < "u") {
-          const i = document.createElement("textarea");
-          i.value = m, i.setAttribute("readonly", ""), i.style.position = "absolute", i.style.left = "-9999px", document.body.appendChild(i);
-          const g = document.getSelection(), F = g?.rangeCount ? g.getRangeAt(0) : null;
-          i.select();
+          const r = document.createElement("textarea");
+          r.value = h, r.setAttribute("readonly", ""), r.style.position = "absolute", r.style.left = "-9999px", document.body.appendChild(r);
+          const g = document.getSelection(), M = g?.rangeCount ? g.getRangeAt(0) : null;
+          r.select();
           try {
             document.execCommand("copy"), w(!0), k?.();
           } catch (le) {
             console.warn("Clipboard copy failed", le);
           } finally {
-            document.body.removeChild(i), F && (g?.removeAllRanges(), g?.addRange(F));
+            document.body.removeChild(r), M && (g?.removeAllRanges(), g?.addRange(M));
           }
         }
       },
-      [m, k]
-    ), A = N(o);
-    A.current !== o && (A.current = o, !o && n === "masked" && l("empty"));
+      [h, k]
+    ), _ = N(o);
+    _.current !== o && (_.current = o, !o && n === "masked" && l("empty"));
     const te = c(
       (e) => {
-        if (!r) {
+        if (!i) {
           if (u.current) {
-            const i = u.current.getBoundingClientRect();
-            if (!(e.clientX >= i.left && e.clientX <= i.right && e.clientY >= i.top && e.clientY <= i.bottom)) return;
+            const r = u.current.getBoundingClientRect();
+            if (!(e.clientX >= r.left && e.clientX <= r.right && e.clientY >= r.top && e.clientY <= r.bottom)) return;
           }
           n === "masked" && o && (l("revealed"), d || setTimeout(() => I.current?.focus(), 0));
         }
       },
-      [n, o, r, d]
+      [n, o, i, d]
     ), ne = c(
       (e) => {
         e.stopPropagation(), n === "revealed" ? l("masked") : n === "empty" && o && l("revealed");
@@ -89,47 +92,47 @@ const Te = me, M = {
       [n, o]
     ), oe = c(
       (e) => {
-        const i = e.target.value;
-        x || O(i), n === "empty" && i.length > 0 && l("revealed"), S?.(e), E?.(i);
+        const r = e.target.value;
+        x || J(r), n === "empty" && r.length > 0 && l("revealed"), E?.(e), R?.(r);
       },
-      [x, S, E, n]
-    ), ie = c(
+      [x, E, R, n]
+    ), re = c(
       (e) => {
         u.current && e.relatedTarget instanceof Node && u.current.contains(e.relatedTarget) || o && l("masked");
       },
       [o]
-    ), re = c(
+    ), ie = c(
       (e) => {
-        r || n === "masked" && o && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), l("revealed"), d || setTimeout(() => I.current?.focus(), 0));
+        i || n === "masked" && o && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), l("revealed"), d || setTimeout(() => I.current?.focus(), 0));
       },
-      [n, o, r, d]
+      [n, o, i, d]
     ), ae = c(
       (e) => {
         n === "revealed" && e.key === "Escape" && (l("masked"), setTimeout(() => u.current?.focus(), 0));
       },
       [n]
-    ), s = n === "masked" && o, _ = !r && (n === "revealed" || n === "empty" && o), se = t === "xs" || t === "sm" ? "size-3" : "size-4", D = p(
-      he({ size: t, variant: j, parentFocusIndicator: !0 }),
+    ), s = n === "masked" && o, D = !i && (n === "revealed" || n === "empty" && o), se = t === "xs" || t === "sm" ? "size-3" : "size-4", U = p(
+      he({ size: t, variant: W, parentFocusIndicator: !0 }),
       "group/container relative flex w-full items-center",
       // Show browser-native focus outline on container when child input is focused
       "focus-within:outline focus-within:outline-2 focus-within:outline-kumo-focus",
-      s && !r && "cursor-pointer",
-      r && "cursor-not-allowed",
-      L
-    ), P = /* @__PURE__ */ y(ce, { children: [
+      s && !i && "cursor-pointer",
+      i && "cursor-not-allowed",
+      H
+    ), F = /* @__PURE__ */ b(ce, { children: [
       /* @__PURE__ */ a(
-        ve,
+        ge,
         {
           ref: z,
           id: Z,
           type: n === "revealed" ? "text" : "password",
-          value: m,
+          value: h,
           onChange: oe,
-          onBlur: ie,
+          onBlur: re,
           onKeyDown: ae,
-          disabled: r,
+          disabled: i,
           readOnly: d || s,
-          autoComplete: H,
+          autoComplete: $,
           tabIndex: s ? -1 : 0,
           className: p(
             "w-full border-0 bg-transparent p-0 text-kumo-default ring-0 outline-none kumo-input-placeholder disabled:cursor-not-allowed disabled:text-kumo-subtle",
@@ -140,7 +143,7 @@ const Te = me, M = {
             s && "pointer-events-none text-transparent"
           ),
           "aria-hidden": s,
-          ...q
+          ...O
         }
       ),
       /* @__PURE__ */ a(
@@ -168,17 +171,17 @@ const Te = me, M = {
             "group/mask"
           ),
           "aria-hidden": "true",
-          children: /* @__PURE__ */ y("span", { className: "relative", children: [
+          children: /* @__PURE__ */ b("span", { className: "relative", children: [
             /* @__PURE__ */ a(
               "span",
               {
                 className: p(
-                  s && !r && "group-focus-within/container:invisible group-hover/mask:invisible"
+                  s && !i && "group-focus-within/container:invisible group-hover/mask:invisible"
                 ),
                 children: "••••••••"
               }
             ),
-            s && !r && /* @__PURE__ */ a("span", { className: "invisible absolute left-0 top-0 whitespace-nowrap text-kumo-subtle group-focus-within/container:visible group-hover/mask:visible", children: "Click to reveal" })
+            s && !i && /* @__PURE__ */ a("span", { className: "invisible absolute left-0 top-0 whitespace-nowrap text-kumo-subtle group-focus-within/container:visible group-hover/mask:visible", children: "Click to reveal" })
           ] })
         }
       ),
@@ -189,7 +192,7 @@ const Te = me, M = {
           onClick: ne,
           onKeyDown: (e) => e.stopPropagation(),
           "aria-label": n === "revealed" ? "Hide value" : "Reveal value",
-          tabIndex: _ ? 0 : -1,
+          tabIndex: D ? 0 : -1,
           className: p(
             "absolute top-1/2 right-0 -translate-y-1/2 cursor-pointer text-kumo-subtle hover:text-kumo-default focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:rounded-sm",
             // Defensive styles to prevent global CSS pollution (e.g., button { background: gray })
@@ -200,65 +203,65 @@ const Te = me, M = {
             t === "base" && "right-3",
             t === "lg" && "right-4",
             se,
-            !_ && "pointer-events-none opacity-0"
+            !D && "pointer-events-none opacity-0"
           ),
           children: n === "revealed" ? /* @__PURE__ */ a(ue, { className: "size-full" }) : /* @__PURE__ */ a(pe, { className: "size-full" })
         }
       ),
-      o && !r && /* @__PURE__ */ a(
+      o && !i && /* @__PURE__ */ a(
         "button",
         {
           type: "button",
           onClick: ee,
           onKeyDown: (e) => e.stopPropagation(),
-          "aria-label": h ? "Copied" : "Copy to clipboard",
+          "aria-label": v ? "Copied" : "Copy to clipboard",
           className: p(
             "absolute -top-px right-2 -translate-y-full cursor-pointer rounded-t-md bg-kumo-brand px-2 py-0.5 text-xs text-white opacity-0 transition-opacity group-focus-within/container:opacity-100 group-hover/container:opacity-100 hover:brightness-120 focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand",
             // Defensive styles to prevent global CSS pollution
             "border-none shadow-none m-0 h-auto min-h-0"
           ),
-          children: h ? "Copied" : "Copy"
+          children: v ? "Copied" : "Copy"
         }
       )
-    ] }), U = /* @__PURE__ */ y("div", { children: [
+    ] }), P = /* @__PURE__ */ b("div", { children: [
       s ? /* @__PURE__ */ a(
         "div",
         {
           ref: u,
           role: "button",
-          tabIndex: r ? -1 : 0,
-          className: D,
+          tabIndex: i ? -1 : 0,
+          className: U,
           onClick: te,
-          onKeyDown: re,
-          "aria-label": `${G}, masked.`,
-          "aria-describedby": `${K} ${V}`,
-          "aria-disabled": r,
-          children: P
+          onKeyDown: ie,
+          "aria-label": `${q}, masked.`,
+          "aria-describedby": `${A} ${K}`,
+          "aria-disabled": i,
+          children: F
         }
-      ) : /* @__PURE__ */ a("div", { ref: u, className: D, children: P }),
-      s && /* @__PURE__ */ a("span", { id: K, className: "sr-only", children: "Click or press Enter to reveal." }),
-      /* @__PURE__ */ y("span", { id: V, className: "sr-only", "aria-live": "polite", children: [
+      ) : /* @__PURE__ */ a("div", { ref: u, className: U, children: F }),
+      s && /* @__PURE__ */ a("span", { id: A, className: "sr-only", children: "Click or press Enter to reveal." }),
+      /* @__PURE__ */ b("span", { id: K, className: "sr-only", "aria-live": "polite", children: [
         n === "masked" && o && "Value hidden",
-        h && "Copied to clipboard"
+        v && "Copied to clipboard"
       ] })
     ] });
-    return v ? /* @__PURE__ */ a(
-      ge,
+    return y ? /* @__PURE__ */ a(
+      ve,
       {
-        label: v,
-        required: W,
-        labelTooltip: X,
-        description: Y,
-        error: b ? typeof b == "string" ? { message: b, match: !0 } : b : void 0,
-        children: U
+        label: y,
+        required: Y,
+        labelTooltip: L,
+        description: X,
+        error: m ? typeof m == "string" ? { message: m, match: !0 } : m : void 0,
+        children: P
       }
-    ) : U;
+    ) : P;
   }
 );
 be.displayName = "SensitiveInput";
 export {
-  Te as K,
+  Se as K,
   be as S,
-  M as a
+  ye as a
 };
-//# sourceMappingURL=sensitive-input-hokm527ollnz9dqc.js.map
+//# sourceMappingURL=sensitive-input-bjg6m791yz7g6bn3.js.map

package/dist/chunks/sensitive-input-bjg6m791yz7g6bn3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sensitive-input-bjg6m791yz7g6bn3.js","sources":["../../src/components/sensitive-input/sensitive-input.tsx"],"sourcesContent":["import { Eye, EyeSlash } from \"@phosphor-icons/react\";\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport {\n  inputVariants,\n  KUMO_INPUT_VARIANTS,\n  type KumoInputSize,\n  type KumoInputVariant,\n} from \"../input/input\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\n\nexport const KUMO_SENSITIVE_INPUT_VARIANTS = KUMO_INPUT_VARIANTS;\n\nexport const KUMO_SENSITIVE_INPUT_DEFAULT_VARIANTS = {\n  size: \"base\",\n  variant: \"default\",\n} as const;\n\ntype Mode = \"masked\" | \"revealed\" | \"empty\";\n\n/**\n * SensitiveInput component props.\n *\n * @example\n * ```tsx\n * <SensitiveInput label=\"API Key\" defaultValue=\"sk_live_abc123xyz789\" />\n * <SensitiveInput label=\"Secret\" value={secret} onValueChange={setSecret} />\n * ```\n */\nexport interface SensitiveInputProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"input\">,\n    \"size\" | \"type\" | \"value\" | \"defaultValue\"\n  > {\n  /** Controlled value */\n  value?: string;\n  /** Uncontrolled default value */\n  defaultValue?: string;\n  /** Simplified change handler receiving just the value */\n  onValueChange?: (value: string) => void;\n  /** Callback fired after value is copied to clipboard */\n  onCopy?: () => void;\n  /**\n   * Size of the input.\n   * - `\"xs\"` — Extra small for compact UIs\n   * - `\"sm\"` — Small for secondary fields\n   * - `\"base\"` — Default input size\n   * - `\"lg\"` — Large for prominent fields\n   * @default \"base\"\n   */\n  size?: KumoInputSize;\n  /**\n   * Style variant of the input.\n   * - `\"default\"` — Default input appearance\n   * - `\"error\"` — Error state for validation failures\n   * @default \"default\"\n   */\n  variant?: KumoInputVariant;\n  /** Label content for the input (enables Field wrapper and sets masked state label) - can be a string or any React node */\n  label?: ReactNode;\n  /** Tooltip content to display next to the label via an info icon */\n  labelTooltip?: ReactNode;\n  /** Helper text displayed below the input */\n  description?: ReactNode;\n  /** Error message or validation error object */\n  error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\n/**\n * Password/secret input that masks its value by default and reveals on click.\n * Includes a built-in copy-to-clipboard button on hover.\n *\n * @example\n * ```tsx\n * <SensitiveInput label=\"API Key\" defaultValue=\"sk_live_abc123xyz789\" />\n * ```\n */\nexport const SensitiveInput = forwardRef<HTMLInputElement, SensitiveInputProps>(\n  (\n    {\n      value: controlledValue,\n      defaultValue = \"\",\n      onChange,\n      onValueChange,\n      onCopy,\n      size = KUMO_SENSITIVE_INPUT_DEFAULT_VARIANTS.size,\n      variant: variantProp,\n      disabled = false,\n      readOnly = false,\n      id,\n      autoComplete = \"off\",\n      className,\n      label,\n      labelTooltip,\n      description,\n      error,\n      required,\n      ...inputProps\n    },\n    ref,\n  ) => {\n    // Deprecation warning for variant=\"error\"\n    if (process.env.NODE_ENV !== \"production\" && variantProp === \"error\") {\n      console.warn(\n        '[Kumo SensitiveInput]: variant=\"error\" is deprecated. ' +\n          \"Error styling is now automatically applied when the `error` prop is truthy. \" +\n          \"Simply remove the variant prop and pass an error message instead.\",\n      );\n    }\n\n    // Auto-apply error styling when error prop is truthy\n    // Explicit variant prop takes precedence for backwards compatibility\n    const variant = variantProp ?? (error ? \"error\" : \"default\");\n    // For aria-label, only use string labels (ReactNode labels can't be used for aria-label)\n    const ariaLabelFallback =\n      typeof label === \"string\" ? label : \"Sensitive value\";\n    const isControlled = controlledValue !== undefined;\n    const [internalValue, setInternalValue] = useState(defaultValue);\n    const value = isControlled ? controlledValue : internalValue;\n    const hasValue = value.length > 0;\n\n    const [mode, setMode] = useState<Mode>(() =>\n      hasValue ? \"masked\" : \"empty\",\n    );\n\n    const [copied, setCopied] = useState(false);\n\n    const inputRef = useRef<HTMLInputElement | null>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const liveRegionId = useId();\n    const generatedId = useId();\n    const inputId = id ?? generatedId;\n    const maskedInstructionId = useId();\n\n    const mergedRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        inputRef.current = node;\n        if (typeof ref === \"function\") {\n          ref(node);\n        } else if (ref) {\n          ref.current = node;\n        }\n      },\n      [ref],\n    );\n\n    // Reset copied state after 2 seconds\n    useEffect(() => {\n      if (copied) {\n        const timeoutId = setTimeout(() => setCopied(false), 2000);\n        return () => clearTimeout(timeoutId);\n      }\n    }, [copied]);\n\n    const copyToClipboard = useCallback(\n      async (e: React.MouseEvent<HTMLButtonElement>) => {\n        e.stopPropagation();\n        try {\n          if (\n            typeof navigator !== \"undefined\" &&\n            navigator.clipboard &&\n            typeof navigator.clipboard.writeText === \"function\"\n          ) {\n            await navigator.clipboard.writeText(value);\n            setCopied(true);\n            onCopy?.();\n            return;\n          }\n        } catch {\n          // Fall through to manual fallback\n        }\n\n        if (typeof document !== \"undefined\") {\n          const textarea = document.createElement(\"textarea\");\n          textarea.value = value;\n          textarea.setAttribute(\"readonly\", \"\");\n          textarea.style.position = \"absolute\";\n          textarea.style.left = \"-9999px\";\n          document.body.appendChild(textarea);\n          const selection = document.getSelection();\n          const previousRange = selection?.rangeCount\n            ? selection.getRangeAt(0)\n            : null;\n          textarea.select();\n          try {\n            document.execCommand(\"copy\");\n            setCopied(true);\n            onCopy?.();\n          } catch (error) {\n            console.warn(\"Clipboard copy failed\", error);\n          } finally {\n            document.body.removeChild(textarea);\n            if (previousRange) {\n              selection?.removeAllRanges();\n              selection?.addRange(previousRange);\n            }\n          }\n        }\n      },\n      [value, onCopy],\n    );\n\n    // Sync mode when value changes externally\n    const prevHasValueRef = useRef(hasValue);\n    if (prevHasValueRef.current !== hasValue) {\n      prevHasValueRef.current = hasValue;\n      if (!hasValue && mode === \"masked\") {\n        setMode(\"empty\");\n      }\n    }\n\n    const handleContainerClick = useCallback(\n      (e: React.MouseEvent) => {\n        if (disabled) return;\n        // Ignore clicks that originated from outside (e.g., label click focusing input)\n        // Label clicks trigger a click on the input, but the click coordinates are outside the container\n        if (containerRef.current) {\n          const rect = containerRef.current.getBoundingClientRect();\n          const isClickInsideContainer =\n            e.clientX >= rect.left &&\n            e.clientX <= rect.right &&\n            e.clientY >= rect.top &&\n            e.clientY <= rect.bottom;\n          if (!isClickInsideContainer) return;\n        }\n        if (mode === \"masked\" && hasValue) {\n          setMode(\"revealed\");\n          if (!readOnly) {\n            setTimeout(() => inputRef.current?.focus(), 0);\n          }\n        }\n      },\n      [mode, hasValue, disabled, readOnly],\n    );\n\n    const handleToggleVisibility = useCallback(\n      (e: React.MouseEvent<HTMLButtonElement>) => {\n        e.stopPropagation();\n        if (mode === \"revealed\") {\n          setMode(\"masked\");\n        } else if (mode === \"empty\" && hasValue) {\n          setMode(\"revealed\");\n        }\n      },\n      [mode, hasValue],\n    );\n\n    const handleChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const newValue = e.target.value;\n        if (!isControlled) {\n          setInternalValue(newValue);\n        }\n        // When typing into an empty field, switch to revealed mode\n        // so the input shows as type=\"text\" instead of type=\"password\"\n        if (mode === \"empty\" && newValue.length > 0) {\n          setMode(\"revealed\");\n        }\n        onChange?.(e);\n        onValueChange?.(newValue);\n      },\n      [isControlled, onChange, onValueChange, mode],\n    );\n\n    const handleBlur = useCallback(\n      (e: React.FocusEvent<HTMLInputElement>) => {\n        // Don't mask if focus is moving to a button inside the container (copy/eye buttons)\n        if (\n          containerRef.current &&\n          e.relatedTarget instanceof Node &&\n          containerRef.current.contains(e.relatedTarget)\n        ) {\n          return;\n        }\n        if (hasValue) {\n          setMode(\"masked\");\n        }\n      },\n      [hasValue],\n    );\n\n    const handleContainerKeyDown = useCallback(\n      (e: React.KeyboardEvent<HTMLDivElement>) => {\n        if (disabled) return;\n        if (mode === \"masked\" && hasValue) {\n          if (e.key === \"Enter\" || e.key === \" \") {\n            e.preventDefault();\n            setMode(\"revealed\");\n            if (!readOnly) {\n              setTimeout(() => inputRef.current?.focus(), 0);\n            }\n          }\n        }\n      },\n      [mode, hasValue, disabled, readOnly],\n    );\n\n    const handleInputKeyDown = useCallback(\n      (e: React.KeyboardEvent<HTMLInputElement>) => {\n        if (mode === \"revealed\" && e.key === \"Escape\") {\n          setMode(\"masked\");\n          // Move focus to container to avoid focus trap (input becomes tabIndex={-1})\n          setTimeout(() => containerRef.current?.focus(), 0);\n        }\n      },\n      [mode],\n    );\n\n    const isMaskedWithValue = mode === \"masked\" && hasValue;\n    const showEyeButton =\n      !disabled && (mode === \"revealed\" || (mode === \"empty\" && hasValue));\n\n    // Icon sizes matching input sizes\n    const iconSize = size === \"xs\" || size === \"sm\" ? \"size-3\" : \"size-4\";\n\n    const containerClassName = cn(\n      inputVariants({ size, variant, parentFocusIndicator: true }),\n      \"group/container relative flex w-full items-center\",\n      // Show browser-native focus outline on container when child input is focused\n      \"focus-within:outline focus-within:outline-2 focus-within:outline-kumo-focus\",\n      isMaskedWithValue && !disabled && \"cursor-pointer\",\n      disabled && \"cursor-not-allowed\",\n      className,\n    );\n\n    const containerContent = (\n      <>\n        {/* Input - defines the width, always rendered */}\n        <BaseInput\n          ref={mergedRef}\n          id={inputId}\n          type={mode === \"revealed\" ? \"text\" : \"password\"}\n          value={value}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          onKeyDown={handleInputKeyDown}\n          disabled={disabled}\n          readOnly={readOnly || isMaskedWithValue}\n          autoComplete={autoComplete}\n          tabIndex={isMaskedWithValue ? -1 : 0}\n          className={cn(\n            \"w-full border-0 bg-transparent p-0 text-kumo-default ring-0 outline-none kumo-input-placeholder disabled:cursor-not-allowed disabled:text-kumo-subtle\",\n            size === \"xs\" && \"pr-5\",\n            size === \"sm\" && \"pr-6\",\n            size === \"base\" && \"pr-8\",\n            size === \"lg\" && \"pr-10\",\n            isMaskedWithValue && \"pointer-events-none text-transparent\",\n          )}\n          aria-hidden={isMaskedWithValue}\n          {...inputProps}\n        />\n\n        {/* Mask overlay - absolutely positioned, doesn't affect layout */}\n        <span\n          className={cn(\n            \"pointer-events-none absolute inset-y-0 left-0 flex items-center overflow-hidden select-none\",\n            // Match input pr padding (space for icon)\n            size === \"xs\" && \"right-5\",\n            size === \"sm\" && \"right-6\",\n            size === \"base\" && \"right-8\",\n            size === \"lg\" && \"right-10\",\n            // Match the padding from inputVariants\n            size === \"xs\" && \"px-1.5\",\n            size === \"sm\" && \"px-2\",\n            size === \"base\" && \"px-3\",\n            size === \"lg\" && \"px-4\",\n            // Hidden when not masked\n            !isMaskedWithValue && \"invisible\",\n            // When masked: enable pointer events\n            isMaskedWithValue && \"pointer-events-auto\",\n            // Text color - use text-kumo-default to contrast with bg-kumo-control input background\n            \"text-kumo-default\",\n            // Hover state - pure CSS, no React state (group for children)\n            \"group/mask\",\n          )}\n          aria-hidden=\"true\"\n        >\n          {/* Both texts rendered, stacked. Visibility toggled on hover to prevent layout shift */}\n          <span className=\"relative\">\n            <span\n              className={cn(\n                isMaskedWithValue &&\n                  !disabled &&\n                  \"group-focus-within/container:invisible group-hover/mask:invisible\",\n              )}\n            >\n              ••••••••\n            </span>\n            {isMaskedWithValue && !disabled && (\n              <span className=\"invisible absolute left-0 top-0 whitespace-nowrap text-kumo-subtle group-focus-within/container:visible group-hover/mask:visible\">\n                Click to reveal\n              </span>\n            )}\n          </span>\n        </span>\n\n        {/* Eye button - absolutely positioned to the right */}\n        <button\n          type=\"button\"\n          onClick={handleToggleVisibility}\n          onKeyDown={(e) => e.stopPropagation()}\n          aria-label={mode === \"revealed\" ? \"Hide value\" : \"Reveal value\"}\n          tabIndex={showEyeButton ? 0 : -1}\n          className={cn(\n            \"absolute top-1/2 right-0 -translate-y-1/2 cursor-pointer text-kumo-subtle hover:text-kumo-default focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:rounded-sm\",\n            // Defensive styles to prevent global CSS pollution (e.g., button { background: gray })\n            \"bg-transparent border-none shadow-none p-0 m-0 h-auto min-h-0 inline-flex items-center justify-center\",\n            // Match right padding from inputVariants\n            size === \"xs\" && \"right-1.5\",\n            size === \"sm\" && \"right-2\",\n            size === \"base\" && \"right-3\",\n            size === \"lg\" && \"right-4\",\n            iconSize,\n            !showEyeButton && \"pointer-events-none opacity-0\",\n          )}\n        >\n          {mode === \"revealed\" ? (\n            <EyeSlash className=\"size-full\" />\n          ) : (\n            <Eye className=\"size-full\" />\n          )}\n        </button>\n\n        {/* Copy tab - appears on hover/focus at top right (hidden when disabled) */}\n        {hasValue && !disabled && (\n          <button\n            type=\"button\"\n            onClick={copyToClipboard}\n            onKeyDown={(e) => e.stopPropagation()}\n            aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n            className={cn(\n              \"absolute -top-px right-2 -translate-y-full cursor-pointer rounded-t-md bg-kumo-brand px-2 py-0.5 text-xs text-white opacity-0 transition-opacity group-focus-within/container:opacity-100 group-hover/container:opacity-100 hover:brightness-120 focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n              // Defensive styles to prevent global CSS pollution\n              \"border-none shadow-none m-0 h-auto min-h-0\",\n            )}\n          >\n            {copied ? \"Copied\" : \"Copy\"}\n          </button>\n        )}\n      </>\n    );\n\n    const input = (\n      <div>\n        {isMaskedWithValue ? (\n          <div\n            ref={containerRef}\n            // Cannot use <button> here because containerContent contains interactive button elements (Copy, Reveal).\n            // Using role=\"button\" with proper keyboard handling instead.\n            // oxlint-disable-next-line prefer-tag-over-role\n            role=\"button\"\n            tabIndex={disabled ? -1 : 0}\n            className={containerClassName}\n            onClick={handleContainerClick}\n            onKeyDown={handleContainerKeyDown}\n            aria-label={`${ariaLabelFallback}, masked.`}\n            aria-describedby={`${maskedInstructionId} ${liveRegionId}`}\n            aria-disabled={disabled}\n          >\n            {containerContent}\n          </div>\n        ) : (\n          <div ref={containerRef} className={containerClassName}>\n            {containerContent}\n          </div>\n        )}\n        {isMaskedWithValue && (\n          <span id={maskedInstructionId} className=\"sr-only\">\n            Click or press Enter to reveal.\n          </span>\n        )}\n        <span id={liveRegionId} className=\"sr-only\" aria-live=\"polite\">\n          {mode === \"masked\" && hasValue && \"Value hidden\"}\n          {copied && \"Copied to clipboard\"}\n        </span>\n      </div>\n    );\n\n    // Render with Field wrapper if label is provided\n    if (label) {\n      return (\n        <Field\n          label={label}\n          required={required}\n          labelTooltip={labelTooltip}\n          description={description}\n          error={\n            error\n              ? typeof error === \"string\"\n                ? { message: error, match: true }\n                : error\n              : undefined\n          }\n        >\n          {input}\n        </Field>\n      );\n    }\n\n    // Render bare input without Field wrapper\n    return input;\n  },\n);\n\nSensitiveInput.displayName = \"SensitiveInput\";\n"],"names":["KUMO_SENSITIVE_INPUT_VARIANTS","KUMO_INPUT_VARIANTS","KUMO_SENSITIVE_INPUT_DEFAULT_VARIANTS","SensitiveInput","forwardRef","controlledValue","defaultValue","onChange","onValueChange","onCopy","size","variantProp","disabled","readOnly","id","autoComplete","className","label","labelTooltip","description","error","required","inputProps","ref","variant","ariaLabelFallback","isControlled","internalValue","setInternalValue","useState","value","hasValue","mode","setMode","copied","setCopied","inputRef","useRef","containerRef","liveRegionId","useId","generatedId","inputId","maskedInstructionId","mergedRef","useCallback","node","useEffect","timeoutId","copyToClipboard","textarea","selection","previousRange","prevHasValueRef","handleContainerClick","rect","handleToggleVisibility","handleChange","newValue","handleBlur","handleContainerKeyDown","handleInputKeyDown","isMaskedWithValue","showEyeButton","iconSize","containerClassName","cn","inputVariants","containerContent","jsxs","Fragment","jsx","BaseInput","EyeSlash","Eye","input","Field"],"mappings":"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"}

package/dist/chunks/{sidebar-oan40ylmqkyui21w.js → sidebar-izcfqkrzt4vqn8ez.js}

@@ -1,11 +1,11 @@
 "use client";
-import { jsx as s, jsxs as P, Fragment as ke } from "react/jsx-runtime";
-import ye, { forwardRef as u, useState as y, useCallback as D, useMemo as W, createContext as A, useContext as R, useRef as L, useEffect as Ne } from "react";
+import { jsx as s, jsxs as A, Fragment as ye } from "react/jsx-runtime";
+import ke, { forwardRef as u, useState as k, useCallback as D, useMemo as W, createContext as E, useContext as R, useRef as O, useEffect as Ne } from "react";
 import { CaretRightIcon as F, MagnifyingGlassIcon as Ce, SidebarSimpleIcon as Me } from "@phosphor-icons/react";
 import { c as r } from "./cn-ct4n7r74mh8y0f48.js";
 import { u as X } from "./link-provider-mn2voeohon7cj9o4.js";
-import { a as Ie, T as Re } from "./tooltip-icvb67awe1zolz61.js";
-import { aO as U, aQ as V, aq as Te, av as ze, aw as _e, ax as Be, aP as De } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
+import { a as Ie, T as Re } from "./tooltip-o6xfw9jjclv9pxaj.js";
+import { aP as U, aR as V, aq as Te, aw as ze, ax as _e, ay as Be, aQ as De } from "./vendor-base-ui-mzjqwv5teijixz8h.js";
 const $e = {
   variant: {
     sidebar: {
@@ -57,22 +57,22 @@ const $e = {
   mobile: {
     breakpoint: 768
   }
-}, j = "16rem", Oe = "3rem", Pe = 768;
-function Ae() {
-  const [t, a] = y(!1);
+}, j = "16rem", Pe = "3rem", Ae = 768;
+function Ee() {
+  const [t, a] = k(!1);
   return Ne(() => {
-    const e = window.matchMedia(`(max-width: ${Pe - 1}px)`), i = () => a(e.matches);
+    const e = window.matchMedia(`(max-width: ${Ae - 1}px)`), i = () => a(e.matches);
     return e.addEventListener("change", i), a(e.matches), () => e.removeEventListener("change", i);
   }, []), t;
 }
-const K = A(null);
+const K = E(null);
 function T() {
   const t = R(K);
   if (!t)
     throw new Error("useSidebar must be used within a Sidebar.Provider");
   return t;
 }
-const Ee = 256, Le = 200, Ge = 480;
+const Le = 256, Oe = 200, Ge = 480;
 function q({
   defaultOpen: t = !0,
   open: a,
@@ -81,21 +81,21 @@ function q({
   side: n = G.side,
   collapsible: o = G.collapsible,
   resizable: b = !1,
-  defaultWidth: m = Ee,
-  minWidth: d = Le,
+  defaultWidth: m = Le,
+  minWidth: d = Oe,
   maxWidth: l = Ge,
   onWidthChange: c,
   children: x,
   className: g,
   style: h
 }) {
-  const p = Ae(), [f, S] = y(!1), [N, z] = y(m), [w, C] = y(!1), _ = D(
+  const p = Ee(), [f, S] = k(!1), [N, z] = k(m), [w, C] = k(!1), _ = D(
     (v) => {
       const I = Math.min(l, Math.max(d, v));
       z(I), c?.(I);
     },
     [d, l, c]
-  ), [k, ve] = y(t), M = a ?? k, B = D(
+  ), [y, ve] = k(t), M = a ?? y, B = D(
     (v) => {
       const I = typeof v == "function" ? v(M) : v;
       e?.(I), ve(I);
@@ -103,9 +103,9 @@ function q({
     [e, M]
   ), H = D(() => {
     p ? S((v) => !v) : B((v) => !v);
-  }, [p, B]), E = M ? "expanded" : "collapsed", Se = b ? `${N}px` : j, we = W(
+  }, [p, B]), L = M ? "expanded" : "collapsed", Se = b ? `${N}px` : j, we = W(
     () => ({
-      state: E,
+      state: L,
       open: M,
       setOpen: B,
       openMobile: f,
@@ -124,7 +124,7 @@ function q({
       setWidth: _
     }),
     [
-      E,
+      L,
       M,
       B,
       f,
@@ -147,11 +147,11 @@ function q({
     "div",
     {
       "data-sidebar-wrapper": "",
-      "data-state": E,
+      "data-state": L,
       "data-side": n,
       style: {
         "--sidebar-width": Se,
-        "--sidebar-width-icon": Oe,
+        "--sidebar-width-icon": Pe,
         ...h
       },
       className: r(
@@ -204,7 +204,7 @@ const $ = u(
         }
       );
     if (o)
-      return /* @__PURE__ */ s(Te, { open: b, onOpenChange: m, children: /* @__PURE__ */ P(ze, { children: [
+      return /* @__PURE__ */ s(Te, { open: b, onOpenChange: m, children: /* @__PURE__ */ A(ze, { children: [
         /* @__PURE__ */ s(_e, { "data-sidebar-backdrop": "", className: "fixed inset-0 bg-black/50 transition-opacity duration-200 data-[ending-style]:opacity-0 data-[starting-style]:opacity-0" }),
         /* @__PURE__ */ s(
           Be,
@@ -316,7 +316,7 @@ const J = u(({ className: t, ...a }, e) => /* @__PURE__ */ s(
   }
 ));
 J.displayName = "Sidebar.Footer";
-const O = A({
+const P = E({
   isCollapsible: !1,
   isOpen: !0
 }), Z = u(
@@ -329,7 +329,7 @@ const O = A({
     children: o,
     ...b
   }, m) => {
-    const [d, l] = y(e), c = i ?? d, x = D(
+    const [d, l] = k(e), c = i ?? d, x = D(
       (p) => {
         l(p), n?.(p);
       },
@@ -352,7 +352,7 @@ const O = A({
         children: o
       }
     );
-    return a ? /* @__PURE__ */ s(O.Provider, { value: g, children: /* @__PURE__ */ s(
+    return a ? /* @__PURE__ */ s(P.Provider, { value: g, children: /* @__PURE__ */ s(
       U,
       {
         defaultOpen: e,
@@ -361,13 +361,13 @@ const O = A({
         className: "min-w-0",
         children: h
       }
-    ) }) : /* @__PURE__ */ s(O.Provider, { value: g, children: h });
+    ) }) : /* @__PURE__ */ s(P.Provider, { value: g, children: h });
   }
 );
 Z.displayName = "Sidebar.Group";
 const ee = u(({ className: t, children: a, ...e }, i) => {
-  const { isCollapsible: n } = R(O);
-  return n ? /* @__PURE__ */ P(
+  const { isCollapsible: n } = R(P);
+  return n ? /* @__PURE__ */ A(
     V,
     {
       ref: i,
@@ -408,7 +408,7 @@ const ee = u(({ className: t, children: a, ...e }, i) => {
 });
 ee.displayName = "Sidebar.GroupLabel";
 const ae = u(({ className: t, children: a, ...e }, i) => {
-  const { isCollapsible: n, isOpen: o } = R(O);
+  const { isCollapsible: n, isOpen: o } = R(P);
   return n ? /* @__PURE__ */ s(
     "div",
     {
@@ -440,7 +440,7 @@ const ae = u(({ className: t, children: a, ...e }, i) => {
   );
 });
 ae.displayName = "Sidebar.GroupContent";
-const te = A(!1), se = A(!1), ie = u(({ className: t, ...a }, e) => /* @__PURE__ */ s(
+const te = E(!1), se = E(!1), ie = u(({ className: t, ...a }, e) => /* @__PURE__ */ s(
   "ul",
   {
     ref: e,
@@ -476,12 +476,12 @@ const ne = u(
     children: b,
     ...m
   }, d) => {
-    const { state: l } = T(), c = X(), x = R(te), g = a ? ye.isValidElement(a) ? a : /* @__PURE__ */ s(
+    const { state: l } = T(), c = X(), x = R(te), g = a ? ke.isValidElement(a) ? a : /* @__PURE__ */ s(
       a,
       {
         className: r("shrink-0", i === "base" ? "size-4" : "size-3.5")
       }
-    ) : null, h = /* @__PURE__ */ P(ke, { children: [
+    ) : null, h = /* @__PURE__ */ A(ye, { children: [
       g,
       /* @__PURE__ */ s(
         "span",
@@ -653,7 +653,7 @@ const be = u(({ className: t, ...a }, e) => /* @__PURE__ */ s(
 ));
 be.displayName = "Sidebar.Separator";
 const pe = u(
-  ({ className: t, placeholder: a = "Search...", shortcut: e, children: i, ...n }, o) => /* @__PURE__ */ P(
+  ({ className: t, placeholder: a = "Search...", shortcut: e, children: i, ...n }, o) => /* @__PURE__ */ A(
     "button",
     {
       ref: o,
@@ -730,7 +730,7 @@ const ge = u(({ className: t, ...a }, e) => {
 });
 ge.displayName = "Sidebar.Rail";
 const fe = u(({ className: t, ...a }, e) => {
-  const { side: i, resizable: n, setIsResizing: o, setWidth: b, setOpen: m, open: d, minWidth: l } = T(), c = L(0), x = L(0), g = L(!1);
+  const { side: i, resizable: n, setIsResizing: o, setWidth: b, setOpen: m, open: d, minWidth: l } = T(), c = O(0), x = O(0), g = O(!1);
   if (!n) return null;
   const h = (p) => {
     p.preventDefault(), o(!0), c.current = p.clientX, g.current = !d;
@@ -741,16 +741,16 @@ const fe = u(({ className: t, ...a }, e) => {
     const N = () => {
       o(!1), document.removeEventListener("pointermove", z), document.removeEventListener("pointerup", w);
     }, z = (C) => {
-      const _ = i === "left" ? C.clientX - c.current : c.current - C.clientX, k = x.current + _;
+      const _ = i === "left" ? C.clientX - c.current : c.current - C.clientX, y = x.current + _;
       if (g.current) {
-        k >= l && (g.current = !1, m(!0), b(k));
+        y >= l && (g.current = !1, m(!0), b(y));
         return;
       }
-      if (k < l) {
+      if (y < l) {
         m(!1), g.current = !0;
         return;
       }
-      b(k);
+      b(y);
     }, w = () => {
       N();
     };
@@ -872,4 +872,4 @@ export {
   xe as y,
   T as z
 };
-//# sourceMappingURL=sidebar-oan40ylmqkyui21w.js.map
+//# sourceMappingURL=sidebar-izcfqkrzt4vqn8ez.js.map