@godxjp/ui 31.31.7 → 32.0.0

package/dist/components/ui/aspect-ratio.js

@@ -1,21 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { Slot } from "../../lib/slot.js";
-import { cn } from "../../lib/utils.js";
-const AspectRatio = React.forwardRef(({ className, ratio = 16 / 9, style, asChild = false, ...props }, ref) => {
-  const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      ref,
-      "data-slot": "aspect-ratio",
-      className: cn("ui-aspect-ratio", className),
-      style: { ...style, position: "relative", width: "100%", aspectRatio: `${ratio}` },
-      ...props
-    }
-  );
-});
-AspectRatio.displayName = "AspectRatio";
-export {
-  AspectRatio
-};

package/dist/components/ui/avatar.d.ts

@@ -1,16 +0,0 @@
-import * as React from "react";
-import { type ImageLoadingStatus } from "../../lib/image-loading-status.js";
-import type { AvatarImageFitProp, AvatarProp } from "../../props/components/data-display.prop.js";
-export declare const Avatar: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-    asChild?: boolean;
-} & Pick<AvatarProp, "appearance" | "presence" | "presenceLabel" | "shape" | "size"> & React.RefAttributes<HTMLSpanElement>>;
-export declare const AvatarImage: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
-    asChild?: boolean;
-    onLoadingStatusChange?: (status: ImageLoadingStatus) => void;
-    /** `cover` (default) crops to fill; `contain` shows a logo or app icon whole (gh#1176). */
-    fit?: AvatarImageFitProp;
-} & React.RefAttributes<HTMLImageElement>>;
-export declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-    asChild?: boolean;
-    delayMs?: number;
-} & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/ui/avatar.js

@@ -1,115 +0,0 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useEffectEvent, useLayoutEffect } from "@react-aria/utils";
-import * as React from "react";
-import { useTranslation } from "../../i18n/use-translation.js";
-import { useImageLoadingStatus } from "../../lib/image-loading-status.js";
-import { Slot } from "../../lib/slot.js";
-import { cn } from "../../lib/utils.js";
-const AvatarContext = React.createContext(null);
-function useAvatarContext(part) {
-  const context = React.useContext(AvatarContext);
-  if (context === null) {
-    throw new Error(`\`${part}\` must be used within \`Avatar\``);
-  }
-  return context;
-}
-const Avatar = React.forwardRef(
-  ({
-    className,
-    shape = "circle",
-    size = "md",
-    appearance = "default",
-    presence,
-    presenceLabel,
-    asChild = false,
-    children,
-    ...props
-  }, ref) => {
-    const { t } = useTranslation();
-    const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
-    const context = React.useMemo(
-      () => ({ imageLoadingStatus, setImageLoadingStatus }),
-      [imageLoadingStatus]
-    );
-    const Comp = asChild ? Slot : "span";
-    return /* @__PURE__ */ jsx(AvatarContext.Provider, { value: context, children: /* @__PURE__ */ jsxs(
-      Comp,
-      {
-        ref,
-        "data-slot": "avatar",
-        "data-shape": shape === "square" ? "square" : void 0,
-        "data-size": size === "md" ? void 0 : size,
-        "data-appearance": appearance === "tinted" ? "tinted" : void 0,
-        "data-presence": presence,
-        className: cn("ui-avatar", className),
-        ...props,
-        children: [
-          children,
-          presence !== void 0 ? /* @__PURE__ */ jsx("span", { "data-slot": "avatar-presence", "data-presence": presence, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: presenceLabel ?? t(`dataDisplay.avatar.presence.${presence}`) }) }) : null
-        ]
-      }
-    ) });
-  }
-);
-Avatar.displayName = "Avatar";
-const AvatarImage = React.forwardRef(({ className, src, onLoadingStatusChange, asChild = false, fit, ...props }, ref) => {
-  const { imageLoadingStatus, setImageLoadingStatus } = useAvatarContext("AvatarImage");
-  const status = useImageLoadingStatus(src, {
-    referrerPolicy: props.referrerPolicy,
-    crossOrigin: props.crossOrigin,
-    loadingStatus: imageLoadingStatus,
-    setLoadingStatus: setImageLoadingStatus
-  });
-  const handleLoadingStatusChange = useEffectEvent((next) => {
-    onLoadingStatusChange?.(next);
-  });
-  const previousStatus = React.useRef(status);
-  useLayoutEffect(() => {
-    const previous = previousStatus.current;
-    previousStatus.current = status;
-    if (status !== previous) {
-      handleLoadingStatusChange(status);
-    }
-  }, [status]);
-  const Comp = asChild ? Slot : "img";
-  return status === "loaded" ? /* @__PURE__ */ jsx(
-    Comp,
-    {
-      ref,
-      "data-slot": "avatar-image",
-      "data-fit": fit === "contain" ? "contain" : void 0,
-      className: cn("ui-avatar-image", className),
-      ...props,
-      src
-    }
-  ) : null;
-});
-AvatarImage.displayName = "AvatarImage";
-const AvatarFallback = React.forwardRef(({ className, delayMs, asChild = false, ...props }, ref) => {
-  const { imageLoadingStatus } = useAvatarContext("AvatarFallback");
-  const [canRender, setCanRender] = React.useState(delayMs === void 0);
-  React.useEffect(() => {
-    if (delayMs === void 0) {
-      return;
-    }
-    const timerId = window.setTimeout(() => setCanRender(true), delayMs);
-    return () => window.clearTimeout(timerId);
-  }, [delayMs]);
-  const Comp = asChild ? Slot : "span";
-  return canRender && imageLoadingStatus !== "loaded" ? /* @__PURE__ */ jsx(
-    Comp,
-    {
-      ref,
-      "data-slot": "avatar-fallback",
-      className: cn("ui-avatar-fallback", className),
-      ...props
-    }
-  ) : null;
-});
-AvatarFallback.displayName = "AvatarFallback";
-export {
-  Avatar,
-  AvatarFallback,
-  AvatarImage
-};

package/dist/components/ui/credential-reveal.d.ts

@@ -1,9 +0,0 @@
-import * as React from "react";
-import type { CredentialRevealProp } from "../../props/components/data-display.prop.js";
-export type { CredentialRevealProp, CredentialRevealProp as CredentialRevealProps, CredentialRevealTone, } from "../../props/components/data-display.prop.js";
-/**
- * CredentialReveal — one-time secret surface (device credential / API key / service-account
- * secret). Masked by default with a show/hide toggle, a copy button that confirms the copy, an
- * optional download, and an optional acknowledge action to pair with a Dialog.
- */
-export declare const CredentialReveal: React.ForwardRefExoticComponent<CredentialRevealProp & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ui/credential-reveal.js

@@ -1,160 +0,0 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { Check, Copy, Download, Eye, EyeOff } from "lucide-react";
-import { useTranslation } from "../../i18n/use-translation.js";
-import { cn } from "../../lib/utils.js";
-import { Text } from "../general/typography.js";
-import { Button } from "../general/button.js";
-import { Alert, AlertDescription } from "../feedback/alert.js";
-const MASK = "\u2022".repeat(24);
-const COPIED_RESET_MS = 2e3;
-const CredentialReveal = React.forwardRef(
-  ({
-    secret,
-    label,
-    warning,
-    revealed,
-    defaultRevealed = false,
-    onRevealedChange,
-    onCopy,
-    onAcknowledge,
-    acknowledgeLabel,
-    downloadable = false,
-    downloadFileName = "credential.txt",
-    size = "md",
-    tone = "warning",
-    className,
-    id,
-    "aria-label": ariaLabel
-  }, ref) => {
-    const { t } = useTranslation();
-    const [internalRevealed, setInternalRevealed] = React.useState(defaultRevealed);
-    const isRevealed = revealed ?? internalRevealed;
-    const [copied, setCopied] = React.useState(false);
-    const copyTimer = React.useRef(null);
-    const labelId = React.useId();
-    React.useEffect(() => {
-      if (revealed === void 0) setInternalRevealed(defaultRevealed);
-      setCopied(false);
-    }, [secret]);
-    React.useEffect(
-      () => () => {
-        if (copyTimer.current) clearTimeout(copyTimer.current);
-      },
-      []
-    );
-    const setRevealed = (next) => {
-      if (revealed === void 0) setInternalRevealed(next);
-      onRevealedChange?.(next);
-    };
-    const copy = async () => {
-      try {
-        await navigator.clipboard.writeText(secret);
-        setCopied(true);
-        onCopy?.(secret);
-        if (copyTimer.current) clearTimeout(copyTimer.current);
-        copyTimer.current = setTimeout(() => setCopied(false), COPIED_RESET_MS);
-      } catch {
-      }
-    };
-    const download = () => {
-      if (typeof URL === "undefined" || typeof URL.createObjectURL !== "function") return;
-      const url = URL.createObjectURL(new Blob([secret], { type: "text/plain" }));
-      const anchor = document.createElement("a");
-      anchor.href = url;
-      anchor.download = downloadFileName;
-      document.body.appendChild(anchor);
-      anchor.click();
-      anchor.remove();
-      URL.revokeObjectURL(url);
-    };
-    const accessibleName = ariaLabel ?? (typeof label === "string" ? label : void 0) ?? t("ui.credentialReveal.secretLabel");
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        id,
-        "data-slot": "credential-reveal",
-        "data-size": size,
-        role: "group",
-        "aria-label": accessibleName,
-        className: cn("ui-credential-reveal", className),
-        children: [
-          warning !== null ? /* @__PURE__ */ jsx(Alert, { tone, className: "ui-credential-reveal-warning", children: /* @__PURE__ */ jsx(AlertDescription, { children: warning ?? t("ui.credentialReveal.warning") }) }) : null,
-          /* @__PURE__ */ jsxs("div", { className: "ui-credential-reveal-surface", children: [
-            label ? /* @__PURE__ */ jsx(
-              Text,
-              {
-                id: labelId,
-                size: "xs",
-                tone: "muted",
-                weight: "medium",
-                className: "ui-credential-reveal-label",
-                children: label
-              }
-            ) : null,
-            /* @__PURE__ */ jsxs("div", { className: "ui-credential-reveal-row", children: [
-              /* @__PURE__ */ jsx(
-                Text,
-                {
-                  mono: true,
-                  size: "sm",
-                  "data-slot": "credential-reveal-secret",
-                  "data-state": isRevealed ? "revealed" : "masked",
-                  "aria-labelledby": label ? labelId : void 0,
-                  "aria-label": label ? void 0 : accessibleName,
-                  className: "ui-credential-reveal-secret",
-                  children: isRevealed ? secret : MASK
-                }
-              ),
-              /* @__PURE__ */ jsxs("div", { className: "ui-credential-reveal-actions", children: [
-                /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    type: "button",
-                    variant: "ghost",
-                    size,
-                    onClick: () => setRevealed(!isRevealed),
-                    "aria-pressed": isRevealed,
-                    "aria-label": isRevealed ? t("ui.credentialReveal.hide") : t("ui.credentialReveal.show"),
-                    children: isRevealed ? /* @__PURE__ */ jsx(EyeOff, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Eye, { "aria-hidden": "true" })
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    type: "button",
-                    variant: "outline",
-                    size,
-                    onClick: copy,
-                    "data-state": copied ? "copied" : "idle",
-                    "aria-label": copied ? t("ui.credentialReveal.copied") : t("ui.credentialReveal.copy"),
-                    children: copied ? /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true" })
-                  }
-                ),
-                downloadable ? /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    type: "button",
-                    variant: "ghost",
-                    size,
-                    onClick: download,
-                    "aria-label": t("ui.credentialReveal.download"),
-                    children: /* @__PURE__ */ jsx(Download, { "aria-hidden": "true" })
-                  }
-                ) : null
-              ] })
-            ] })
-          ] }),
-          onAcknowledge ? /* @__PURE__ */ jsx("div", { className: "ui-credential-reveal-footer", children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "default", size, onClick: onAcknowledge, children: acknowledgeLabel ?? t("ui.credentialReveal.acknowledge") }) }) : null,
-          /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "sr-only", "data-slot": "credential-reveal-status", children: copied ? t("ui.credentialReveal.copiedAnnounce") : "" })
-        ]
-      }
-    );
-  }
-);
-CredentialReveal.displayName = "CredentialReveal";
-export {
-  CredentialReveal
-};

package/dist/components/ui/hover-card.d.ts

@@ -1,47 +0,0 @@
-import * as React from "react";
-type Side = "top" | "right" | "bottom" | "left";
-type Align = "start" | "center" | "end";
-interface HoverCardProps {
-    /** Trạng thái mở, có kiểm soát. */
-    open?: boolean;
-    /** Trạng thái mở ban đầu khi không kiểm soát. */
-    defaultOpen?: boolean;
-    /** Gọi khi trạng thái mở/đóng đổi. */
-    onOpenChange?: (open: boolean) => void;
-    /** Thời gian rê chuột trước khi mở, tính bằng ms. */
-    openDelay?: number;
-    /** Thời gian sau khi con trỏ rời đi trước khi đóng, tính bằng ms. */
-    closeDelay?: number;
-}
-/**
- * HoverCard root. Defaults to a SNAPPY 200ms open / 100ms close (Radix's raw 700/300 default felt
- * laggy); consumers can still pass `openDelay`/`closeDelay`.
- */
-export declare function HoverCard({ open, defaultOpen, onOpenChange, openDelay, closeDelay, children, }: React.PropsWithChildren<HoverCardProps>): React.JSX.Element;
-interface HoverCardTriggerProps extends React.ComponentPropsWithRef<"a"> {
-    /** Mượn thẻ của con thay vì dựng `<a>` riêng. */
-    asChild?: boolean;
-}
-export declare function HoverCardTrigger({ asChild, onPointerEnter, onPointerLeave, onFocus, onBlur, ref, ...props }: HoverCardTriggerProps): React.JSX.Element;
-interface HoverCardContentProps extends React.ComponentPropsWithRef<"div"> {
-    /** Cạnh của trigger mà tấm thẻ bám vào. */
-    side?: Side;
-    /** Canh tấm thẻ theo cạnh của trigger. */
-    align?: Align;
-    /** Khoảng cách theo trục chính, tính bằng px. */
-    sideOffset?: number;
-    /** Khoảng cách theo trục phụ, tính bằng px. */
-    alignOffset?: number;
-    /** Lật tấm thẻ sang cạnh đối diện khi hết chỗ. */
-    avoidCollisions?: boolean;
-    /** Khoảng chừa với mép khung nhìn. RAC chỉ nhận một số; object lấy cạnh lớn nhất. */
-    collisionPadding?: number | Partial<Record<Side, number>>;
-    /** Không còn tác dụng trên nền RAC — giữ trong kiểu vì là API công khai. */
-    sticky?: "partial" | "always";
-    /** Không còn tác dụng trên nền RAC — giữ trong kiểu vì là API công khai. */
-    hideWhenDetached?: boolean;
-    /** Không còn tác dụng trên nền RAC — giữ trong kiểu vì là API công khai. */
-    forceMount?: true;
-}
-export declare function HoverCardContent({ className, style, children, ref, side, align, sideOffset, alignOffset, avoidCollisions, collisionPadding, sticky: _sticky, hideWhenDetached: _hideWhenDetached, forceMount: _forceMount, onPointerEnter, onPointerLeave, ...props }: HoverCardContentProps): React.JSX.Element;
-export {};

package/dist/components/ui/hover-card.js

@@ -1,205 +0,0 @@
-"use client";
-import { jsx } from "react/jsx-runtime";
-import { useOverlayPortalContainer } from "../../lib/overlay-portal.js";
-import * as React from "react";
-import { chain, mergeRefs } from "@react-aria/utils";
-import { Popover as AriaPopover } from "react-aria-components";
-import { cn } from "../../lib/utils.js";
-import { Slot } from "../../lib/slot.js";
-function toPlacement(side, align) {
-  if (align === "center") return side;
-  if (side === "top" || side === "bottom") return `${side} ${align}`;
-  return `${side} ${align === "start" ? "top" : "bottom"}`;
-}
-function toContainerPadding(padding) {
-  if (padding == null) return void 0;
-  if (typeof padding === "number") return padding;
-  const sides = Object.values(padding).filter(
-    (value) => typeof value === "number"
-  );
-  return sides.length ? Math.max(...sides) : void 0;
-}
-const HoverCardContext = React.createContext(null);
-function useHoverCard(component) {
-  const context = React.useContext(HoverCardContext);
-  if (!context) {
-    throw new Error(`\`${component}\` ph\u1EA3i n\u1EB1m trong \`HoverCard\`.`);
-  }
-  return context;
-}
-function HoverCard({
-  open,
-  defaultOpen,
-  onOpenChange,
-  openDelay = 200,
-  closeDelay = 100,
-  children
-}) {
-  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen ?? false);
-  const triggerRef = React.useRef(null);
-  const openTimer = React.useRef(null);
-  const closeTimer = React.useRef(null);
-  const isOpen = open ?? uncontrolledOpen;
-  const setOpenImmediately = React.useCallback(
-    (next) => {
-      if (open === void 0) {
-        setUncontrolledOpen(next);
-      }
-      onOpenChange?.(next);
-    },
-    [open, onOpenChange]
-  );
-  const value = React.useMemo(() => {
-    const clearOpen = () => {
-      if (openTimer.current) clearTimeout(openTimer.current);
-      openTimer.current = null;
-    };
-    const clearClose = () => {
-      if (closeTimer.current) clearTimeout(closeTimer.current);
-      closeTimer.current = null;
-    };
-    return {
-      open: isOpen,
-      triggerRef,
-      setOpenImmediately: (next) => {
-        clearOpen();
-        clearClose();
-        setOpenImmediately(next);
-      },
-      scheduleOpen: () => {
-        clearClose();
-        if (openTimer.current) return;
-        openTimer.current = setTimeout(() => {
-          openTimer.current = null;
-          setOpenImmediately(true);
-        }, openDelay);
-      },
-      scheduleClose: () => {
-        clearOpen();
-        if (closeTimer.current) return;
-        closeTimer.current = setTimeout(() => {
-          closeTimer.current = null;
-          setOpenImmediately(false);
-        }, closeDelay);
-      },
-      cancelClose: clearClose
-    };
-  }, [isOpen, setOpenImmediately, openDelay, closeDelay]);
-  React.useEffect(
-    () => () => {
-      if (openTimer.current) clearTimeout(openTimer.current);
-      if (closeTimer.current) clearTimeout(closeTimer.current);
-    },
-    []
-  );
-  return /* @__PURE__ */ jsx(HoverCardContext.Provider, { value, children });
-}
-function HoverCardTrigger({
-  asChild,
-  onPointerEnter,
-  onPointerLeave,
-  onFocus,
-  onBlur,
-  ref,
-  ...props
-}) {
-  const card = useHoverCard("HoverCardTrigger");
-  const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      "data-state": card.open ? "open" : "closed",
-      ...props,
-      ref: mergeRefs(ref, card.triggerRef),
-      onPointerEnter: chain(onPointerEnter, (event) => {
-        if (event.pointerType === "touch") return;
-        card.scheduleOpen();
-      }),
-      onPointerLeave: chain(onPointerLeave, (event) => {
-        if (event.pointerType === "touch") return;
-        card.scheduleClose();
-      }),
-      onFocus: chain(onFocus, () => card.setOpenImmediately(true)),
-      onBlur: chain(onBlur, () => card.setOpenImmediately(false))
-    }
-  );
-}
-function HoverCardContent({
-  className,
-  style,
-  children,
-  ref,
-  side = "bottom",
-  align = "center",
-  sideOffset = 4,
-  alignOffset,
-  avoidCollisions = true,
-  collisionPadding,
-  sticky: _sticky,
-  hideWhenDetached: _hideWhenDetached,
-  forceMount: _forceMount,
-  onPointerEnter,
-  onPointerLeave,
-  ...props
-}) {
-  const card = useHoverCard("HoverCardContent");
-  const overlayPortalContainer = useOverlayPortalContainer();
-  return /* @__PURE__ */ jsx(
-    AriaPopover,
-    {
-      UNSTABLE_portalContainer: overlayPortalContainer,
-      isOpen: card.open,
-      onOpenChange: card.setOpenImmediately,
-      isNonModal: true,
-      triggerRef: card.triggerRef,
-      placement: toPlacement(side, align),
-      offset: sideOffset,
-      crossOffset: alignOffset,
-      shouldFlip: avoidCollisions,
-      containerPadding: toContainerPadding(collisionPadding),
-      render: (racProps, { isExiting }) => {
-        const {
-          className: _racClassName,
-          "data-rac": _rac,
-          ref: racRef,
-          style: racStyle,
-          ...rest
-        } = racProps;
-        return /* @__PURE__ */ jsx(
-          "div",
-          {
-            ...rest,
-            "data-slot": "hover-card-content",
-            "data-side": side,
-            "data-align": align,
-            "data-state": isExiting ? "closed" : "open",
-            ...props,
-            ref: mergeRefs(ref, racRef),
-            onPointerEnter: chain(onPointerEnter, () => card.cancelClose()),
-            onPointerLeave: chain(onPointerLeave, () => card.scheduleClose()),
-            className: cn(
-              // Match Popover/Tooltip: a directional fade+zoom+slide entrance so it doesn't pop abruptly.
-              "ui-hover-card-content origin-[var(--radix-hover-card-content-transform-origin)]",
-              "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-              "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
-              "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",
-              "data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2",
-              className
-            ),
-            style: {
-              ...racStyle,
-              "--radix-hover-card-content-transform-origin": "var(--trigger-anchor-point)",
-              ...style
-            },
-            children
-          }
-        );
-      }
-    }
-  );
-}
-export {
-  HoverCard,
-  HoverCardContent,
-  HoverCardTrigger
-};

package/dist/components/ui/input-otp.d.ts

@@ -1,48 +0,0 @@
-import * as React from "react";
-/**
- * InputOTP — the code-challenge field.
- *
- * `align` positions the whole row (groups + separators) on the main axis: `start` (default,
- * unchanged), `center` — the canonical auth challenge — or `end`. The attribute lands on the
- * hidden input because `input-otp` owns the container element; `.ui-otp-container` reads it back
- * through `:has()`, exactly as it already does for the invalid and disabled states. A service that
- * wants every code field centred sets `--otp-container-align` once instead.
- *
- * `size`/`status`/`variant` ride the same `controlSurfaceAttrs` helper as Input, Select, Cascader
- * and TagInput, so the code field sits on the shared control-height ladder and paints the same
- * error edge — they reach the CSS by the same `:has()` route as `align`.
- *
- * The VALUE is owned here, not by `input-otp`: `formatter` and `readOnly` have to hold for paste
- * too, and `input-otp` writes its own internal state inside its paste handler, which a wrapper
- * that only intercepted `onChange` could not undo.
- */
-export declare const InputOTP: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "children" | "defaultValue" | "onChange" | "size" | "style" | "value"> & {
-    maxLength: number;
-    value?: string;
-    defaultValue?: string;
-    onValueChange?: (value: string) => void;
-    onChange?: (value: string) => void;
-    onComplete?: (value: string) => void;
-    formatter?: (value: string) => string;
-    mask?: import("./input-otp.js").InputOTPMaskProp;
-    align?: import("./input-otp.js").InputOTPAlignProp;
-    size?: import("../../props/index.js").SizeProp;
-    status?: import("../../props/index.js").ControlStatusProp;
-    variant?: import("../../props/index.js").ControlVariantProp;
-    pattern?: string;
-    pasteTransformer?: (pasted: string) => string;
-    containerClassName?: import("../../props/index.js").ClassNameProp;
-    pushPasswordManagerStrategy?: "increase-width" | "none";
-    noScriptCSSFallback?: string | null;
-    nonce?: string;
-    children?: React.ReactNode;
-    render?: (props: import("input-otp").RenderProps) => React.ReactNode;
-} & React.RefAttributes<HTMLInputElement>>;
-export type { InputOTPAlignProp, InputOTPGroupAppearanceProp, InputOTPGroupProp, InputOTPGroupProp as InputOTPGroupProps, InputOTPMaskProp, InputOTPProp, InputOTPProp as InputOTPProps, } from "../../props/components/data-entry.prop.js";
-export declare const InputOTPGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    appearance?: import("./input-otp.js").InputOTPGroupAppearanceProp;
-} & React.RefAttributes<HTMLDivElement>>;
-export declare const InputOTPSlot: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    index: number;
-} & React.RefAttributes<HTMLDivElement>>;
-export declare const InputOTPSeparator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;