@boxcustodia/library 2.0.0-alpha.1 → 2.0.0-alpha.2

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
 import { Avatar as AvatarPrimitive } from '@base-ui/react/avatar';
 import { ButtonHTMLAttributes } from 'react';
 import { CheckboxGroup as CheckboxGroup_2 } from '@base-ui/react/checkbox-group';
@@ -22,6 +23,7 @@ import { FieldError } from 'react-hook-form';
 import { FieldPath } from 'react-hook-form';
 import { FieldValues } from 'react-hook-form';
 import { FormEvent } from 'react';
+import { HTMLAttributes } from 'react';
 import { HTMLProps } from 'react';
 import { JSX } from 'react/jsx-runtime';
 import { ListIterateeCustom } from 'lodash';
@@ -57,28 +59,91 @@ import { useRender } from '@base-ui/react/use-render';
 import { VariantProps } from 'class-variance-authority';
 import { z } from 'zod';
 
-export declare const AlertDialog: ({ title, description, trigger, onClose, onAction, variant, triggerProps, contentProps, headerProps, titleProps, descriptionProps, footerProps, closeProps, closeText, actionText, actionProps, asChild, ...props }: AlertDialogProps) => JSX.Element;
+/**
+ * Accessible confirmation dialog with cancel and action buttons.
+ *
+ * The `trigger` prop uses Base UI's `render` prop — no wrapper element is added —
+ * making it composable with `<Tooltip>` at the primitive level.
+ * For full structural control, use the exported primitives directly.
+ *
+ * @example
+ * ```tsx
+ * <AlertDialog
+ *   trigger={<Button variant="error">Delete account</Button>}
+ *   title="Delete account?"
+ *   description="This action cannot be undone."
+ *   variant="error"
+ *   actionText="Delete"
+ *   onAction={handleDelete}
+ * />
+ * ```
+ */
+export declare function AlertDialog({ trigger, title, description, children, onClose, onAction, variant, closeText, actionText, className, ...props }: AlertDialogProps): JSX.Element;
+
+/** Semi-transparent overlay rendered behind the popup. */
+export declare function AlertDialogBackdrop({ className, ...props }: AlertDialogPrimitive.Backdrop.Props): JSX.Element;
+
+/** Closes the dialog and merges an optional `onClick` into the `render` element. */
+export declare function AlertDialogClose({ className, ...props }: AlertDialogPrimitive.Close.Props): JSX.Element;
+
+/** Supplementary description rendered below the title. */
+export declare function AlertDialogDescription({ className, ...props }: AlertDialogPrimitive.Description.Props): JSX.Element;
+
+/** Layout wrapper for action buttons. */
+export declare function AlertDialogFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): JSX.Element;
+
+/** Layout wrapper for title and description. */
+export declare function AlertDialogHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): JSX.Element;
+
+/**
+ * Dialog content container. Includes Portal, Backdrop and Viewport internally.
+ * Pass `portalProps` to configure the portal (e.g. a custom `container`).
+ */
+export declare function AlertDialogPopup({ className, portalProps, ...props }: AlertDialogPrimitive.Popup.Props & {
+    portalProps?: AlertDialogPrimitive.Portal.Props;
+}): JSX.Element;
 
-declare type AlertDialogProps = React.ComponentPropsWithoutRef<typeof DialogRoot> & {
-    title?: React.ReactNode;
-    description?: React.ReactNode;
-    trigger?: React.ReactNode;
+export { AlertDialogPrimitive }
+
+export declare type AlertDialogProps = Omit<AlertDialogPrimitive.Root.Props, "children"> & {
+    /** Element that opens the dialog on click. Passed as Base UI `render` prop — no DOM wrapper added. */
+    trigger?: ReactElement;
+    /** Dialog heading. */
+    title?: ReactNode;
+    /** Supporting text rendered below the title. */
+    description?: ReactNode;
+    /** Custom content rendered between the description and the footer buttons. */
+    children?: ReactNode;
+    /** Called when the cancel button is clicked. */
     onClose?: () => void;
+    /** Called when the action button is clicked. */
     onAction?: () => void;
-    variant?: "default" | "error";
-    triggerProps?: ComponentProps<typeof DialogTrigger>;
-    contentProps?: ComponentProps<typeof DialogContent>;
-    headerProps?: ComponentProps<typeof DialogHeader>;
-    titleProps?: ComponentProps<typeof DialogTitle>;
-    descriptionProps?: ComponentProps<typeof DialogDescription>;
-    footerProps?: ComponentProps<typeof DialogFooter>;
-    closeProps?: ComponentProps<typeof DialogClose> & VariantProps<typeof Button>;
-    actionProps?: ComponentProps<typeof DialogClose> & VariantProps<typeof Button>;
-    closeText?: React.ReactNode;
-    actionText?: React.ReactNode;
-    asChild?: boolean;
+    /** Visual variant for the action button. @default "default" */
+    variant?: VariantProps<typeof buttonVariants>["variant"];
+    /** Label for the cancel button. @default "Cancel" */
+    closeText?: ReactNode;
+    /** Label for the action button. @default "Confirm" */
+    actionText?: ReactNode;
+    /** Additional className forwarded to the popup panel. */
+    className?: string;
 };
 
+/** Context root. Holds open state and wraps all dialog parts. */
+export declare function AlertDialogRoot(props: AlertDialogPrimitive.Root.Props): JSX.Element;
+
+/** Accessible title rendered as `<h2>`. Required for a11y. */
+export declare function AlertDialogTitle({ className, ...props }: AlertDialogPrimitive.Title.Props): JSX.Element;
+
+/**
+ * Renders as its `render` element (defaults to `<button>`).
+ * Because it uses Base UI's render prop — not Radix Slot — it composes cleanly
+ * with `<Tooltip>` and other Base UI triggers on the same DOM element.
+ */
+export declare function AlertDialogTrigger({ className, ...props }: AlertDialogPrimitive.Trigger.Props): JSX.Element;
+
+/** Full-screen container that centers the popup. */
+export declare function AlertDialogViewport({ className, ...props }: AlertDialogPrimitive.Viewport.Props): JSX.Element;
+
 export declare type ArrayUnion<V, T extends ReadonlyArray<V>> = T[number];
 
 declare type ArrowProps = ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>;
@@ -92,7 +157,7 @@ declare interface AsyncState<T> {
 
 export declare type AtLeastOne<T> = [T, ...T[]];
 
-export declare const AutoComplete: ({ items, placeholder, emptyMessage, onSelect, containerClassName, containerProps, inputClassName, inputProps, listClassName, listProps, itemClassName, itemProps, emptyClassName, emptyProps, }: Props_3) => JSX.Element;
+export declare const AutoComplete: ({ items, placeholder, emptyMessage, onSelect, containerClassName, containerProps, inputClassName, inputProps, listClassName, listProps, itemClassName, itemProps, emptyClassName, emptyProps, }: Props) => JSX.Element;
 
 export declare const AutoCompleteDialog: ({ children, ...props }: AutoCompleteDialogProps) => JSX.Element;
 
@@ -141,9 +206,9 @@ declare const avatarVariants: (props?: ({
     size?: "sm" | "lg" | "xs" | "md" | "xl" | null | undefined;
 } & ClassProp) | undefined) => string;
 
-export declare const BackgroundImage: ({ src, ...props }: Props_4) => JSX.Element;
+export declare const BackgroundImage: ({ src, ...props }: Props_2) => JSX.Element;
 
-export declare const BaseButton: ({ asChild, onClick, loading: prop, showLoader, icon, iconPosition, loaderReplace, style, ...props }: Props_2) => JSX.Element;
+export declare const BaseButton: ({ asChild, onClick, loading: prop, showLoader, icon, iconPosition, loaderReplace, style, ...props }: Props_4) => JSX.Element;
 
 declare type BaseButtonProps = ComponentProps<typeof BaseButton>;
 
@@ -157,14 +222,14 @@ declare type BaseProps = {
     rounded?: TagVariant["rounded"];
 } & StyleProps & React.HTMLAttributes<HTMLDivElement>;
 
-export declare const Button: (props: Props) => JSX.Element;
+export declare const Button: (props: Props_3) => JSX.Element;
 
 declare type ButtonProps = ComponentProps<typeof Button>;
 
 declare type ButtonProps_2 = ComponentProps<typeof Button>;
 
-declare const buttonVariants: (props?: ({
-    variant?: "default" | "link" | "success" | "error" | "outline" | "secondary" | "ghost" | null | undefined;
+export declare const buttonVariants: (props?: ({
+    variant?: "default" | "success" | "error" | "link" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "icon" | "sm" | "lg" | null | undefined;
     shape?: "rounded" | "circle" | "square" | null | undefined;
 } & ClassProp) | undefined) => string;
@@ -636,7 +701,7 @@ export declare function Label({ className, render, required, tooltip, children,
 
 declare interface LabelProps extends useRender.ComponentProps<"label"> {
     required?: boolean;
-    tooltip?: default_2.ReactNode;
+    tooltip?: ReactNode;
 }
 
 /**
@@ -926,7 +991,12 @@ declare const progressTrackVariants: (props?: ({
 
 export declare function ProgressValue({ className, ...props }: Progress_2.Value.Props): React_2.ReactElement;
 
-declare type Props = BaseButtonProps & VariantProps<typeof buttonVariants>;
+declare interface Props extends ExtendedProps {
+    items: AutoCompleteItem[];
+    placeholder?: string;
+    emptyMessage?: string;
+    onSelect?: (value: AutoCompleteItem["value"], item: AutoCompleteItem) => any;
+}
 
 declare type Props_10 = ComponentPropsWithoutRef<"div"> & {
     icon?: ReactNode;
@@ -1017,13 +1087,11 @@ declare interface Props_19 {
     offset?: ComponentPropsWithoutRef<typeof PopoverContent>["sideOffset"];
 }
 
-declare interface Props_2 extends ComponentProps<"button"> {
-    asChild?: boolean;
-    loading?: boolean;
-    showLoader?: boolean;
-    icon?: ReactNode;
-    iconPosition?: "start" | "end";
-    loaderReplace?: true;
+declare interface Props_2 extends HTMLProps<HTMLDivElement> {
+    /**
+     * La URL de la imagen
+     */
+    src: string;
 }
 
 declare interface Props_20 extends ComponentPropsWithoutRef<typeof Slot> {
@@ -1055,18 +1123,15 @@ declare interface Props_25<T> extends UseAsyncOptions<T> {
     dependencies?: DependencyList;
 }
 
-declare interface Props_3 extends ExtendedProps {
-    items: AutoCompleteItem[];
-    placeholder?: string;
-    emptyMessage?: string;
-    onSelect?: (value: AutoCompleteItem["value"], item: AutoCompleteItem) => any;
-}
+declare type Props_3 = BaseButtonProps & VariantProps<typeof buttonVariants>;
 
-declare interface Props_4 extends HTMLProps<HTMLDivElement> {
-    /**
-     * La URL de la imagen
-     */
-    src: string;
+declare interface Props_4 extends ComponentProps<"button"> {
+    asChild?: boolean;
+    loading?: boolean;
+    showLoader?: boolean;
+    icon?: ReactNode;
+    iconPosition?: "start" | "end";
+    loaderReplace?: true;
 }
 
 declare type Props_5<TItem extends Record<string, any>> = {
@@ -1617,7 +1682,7 @@ export declare function toastVariants({ variant }?: {
  * </Tooltip>
  * ```
  */
-export declare function Tooltip({ content, children, open, defaultOpen, onOpenChange, side, align, offset, delay, closeDelay, className, arrowClassName, }: TooltipProps): JSX.Element;
+export declare function Tooltip({ content, children, open, defaultOpen, onOpenChange, side, align, offset, delay, closeDelay, className, arrowClassName, ...triggerProps }: TooltipProps): JSX.Element;
 
 export declare function TooltipArrow({ className, ...props }: ArrowProps): JSX.Element;
 
@@ -1625,7 +1690,7 @@ export declare function TooltipPopup({ className, ...props }: PopupProps): JSX.E
 
 export { TooltipPrimitive }
 
-export declare type TooltipProps = Omit<RootProps, "children"> & {
+export declare type TooltipProps = Omit<RootProps, "children"> & Omit<TriggerProps, "render" | "delay" | "closeDelay" | "className" | "content"> & {
     /** The element that triggers the tooltip on hover/focus. */
     children: ReactElement;
     /** Content displayed inside the tooltip popup. */