beez-ui 0.6.2 → 0.8.0

package/dist/components/confirm-delete-button.js

@@ -0,0 +1,254 @@
+"use client";
+import { c as _c } from "react/compiler-runtime";
+/** Row action menu whose destructive item asks for an inline confirmation before running. */
+import { useId, useRef, useState } from "react";
+import { MoreVertical, Trash2 } from "lucide-react";
+import { cn } from "../lib/utils.js";
+import { Button } from "./button.js";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "./dropdown-menu.js";
+import { Popover, PopoverAnchor, PopoverContent } from "./popover.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const CONFIRM_DELETE_DEFAULT_LABELS = {
+	cancel: "Cancelar",
+	confirm: "Confirmar",
+	delete: "Eliminar",
+	menu: "Abrir acciones"
+};
+/**
+* Renders an icon menu with a destructive item. Choosing it opens a confirmation anchored to
+* the trigger; only its confirm button runs `onConfirm`. Escape, an outside click or Cancel
+* dismiss it without side effects.
+* @param props - Confirmation copy, callback, extra items and optional labels.
+* @returns The menu trigger with its confirmation.
+*/
+export function ConfirmDeleteButton(t0) {
+	const $ = _c(43);
+	const { message, onConfirm, extraMenuItems: t1, labels, className } = t0;
+	const extraMenuItems = t1 === undefined ? null : t1;
+	let t2;
+	if ($[0] !== labels) {
+		t2 = {
+			...CONFIRM_DELETE_DEFAULT_LABELS,
+			...labels
+		};
+		$[0] = labels;
+		$[1] = t2;
+	} else {
+		t2 = $[1];
+	}
+	const resolvedLabels = t2;
+	const [isConfirming, setIsConfirming] = useState(false);
+	const isOpeningConfirmationRef = useRef(false);
+	const messageId = useId();
+	let t3;
+	if ($[2] !== className) {
+		t3 = cn("inline-flex justify-end", className);
+		$[2] = className;
+		$[3] = t3;
+	} else {
+		t3 = $[3];
+	}
+	let t4;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ _jsx(MoreVertical, { "aria-hidden": "true" });
+		$[4] = t4;
+	} else {
+		t4 = $[4];
+	}
+	let t5;
+	if ($[5] !== resolvedLabels.menu) {
+		t5 = /* @__PURE__ */ _jsx(PopoverAnchor, {
+			asChild: true,
+			children: /* @__PURE__ */ _jsx(DropdownMenuTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ _jsx(Button, {
+					"aria-label": resolvedLabels.menu,
+					size: "icon-sm",
+					type: "button",
+					variant: "ghost",
+					children: t4
+				})
+			})
+		});
+		$[5] = resolvedLabels.menu;
+		$[6] = t5;
+	} else {
+		t5 = $[6];
+	}
+	let t6;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = (event) => {
+			if (!isOpeningConfirmationRef.current) {
+				return;
+			}
+			isOpeningConfirmationRef.current = false;
+			event.preventDefault();
+		};
+		$[7] = t6;
+	} else {
+		t6 = $[7];
+	}
+	let t7;
+	let t8;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = () => {
+			isOpeningConfirmationRef.current = true;
+			setIsConfirming(true);
+		};
+		t8 = /* @__PURE__ */ _jsx(Trash2, { "aria-hidden": "true" });
+		$[8] = t7;
+		$[9] = t8;
+	} else {
+		t7 = $[8];
+		t8 = $[9];
+	}
+	let t9;
+	if ($[10] !== resolvedLabels.delete) {
+		t9 = /* @__PURE__ */ _jsxs(DropdownMenuItem, {
+			variant: "destructive",
+			onSelect: t7,
+			children: [t8, resolvedLabels.delete]
+		});
+		$[10] = resolvedLabels.delete;
+		$[11] = t9;
+	} else {
+		t9 = $[11];
+	}
+	let t10;
+	if ($[12] !== extraMenuItems || $[13] !== t9) {
+		t10 = /* @__PURE__ */ _jsxs(DropdownMenuContent, {
+			align: "end",
+			onCloseAutoFocus: t6,
+			children: [extraMenuItems, t9]
+		});
+		$[12] = extraMenuItems;
+		$[13] = t9;
+		$[14] = t10;
+	} else {
+		t10 = $[14];
+	}
+	let t11;
+	if ($[15] !== t10 || $[16] !== t5) {
+		t11 = /* @__PURE__ */ _jsxs(DropdownMenu, { children: [t5, t10] });
+		$[15] = t10;
+		$[16] = t5;
+		$[17] = t11;
+	} else {
+		t11 = $[17];
+	}
+	let t12;
+	if ($[18] !== message || $[19] !== messageId) {
+		t12 = /* @__PURE__ */ _jsx("p", {
+			id: messageId,
+			className: "m-0 text-sm text-foreground",
+			children: message
+		});
+		$[18] = message;
+		$[19] = messageId;
+		$[20] = t12;
+	} else {
+		t12 = $[20];
+	}
+	let t13;
+	if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
+		t13 = () => setIsConfirming(false);
+		$[21] = t13;
+	} else {
+		t13 = $[21];
+	}
+	let t14;
+	if ($[22] !== resolvedLabels.cancel) {
+		t14 = /* @__PURE__ */ _jsx(Button, {
+			size: "sm",
+			type: "button",
+			variant: "outline",
+			onClick: t13,
+			children: resolvedLabels.cancel
+		});
+		$[22] = resolvedLabels.cancel;
+		$[23] = t14;
+	} else {
+		t14 = $[23];
+	}
+	let t15;
+	if ($[24] !== onConfirm) {
+		t15 = () => {
+			setIsConfirming(false);
+			onConfirm();
+		};
+		$[24] = onConfirm;
+		$[25] = t15;
+	} else {
+		t15 = $[25];
+	}
+	let t16;
+	if ($[26] !== resolvedLabels.confirm || $[27] !== t15) {
+		t16 = /* @__PURE__ */ _jsx(Button, {
+			size: "sm",
+			type: "button",
+			variant: "destructive",
+			onClick: t15,
+			children: resolvedLabels.confirm
+		});
+		$[26] = resolvedLabels.confirm;
+		$[27] = t15;
+		$[28] = t16;
+	} else {
+		t16 = $[28];
+	}
+	let t17;
+	if ($[29] !== t14 || $[30] !== t16) {
+		t17 = /* @__PURE__ */ _jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [t14, t16]
+		});
+		$[29] = t14;
+		$[30] = t16;
+		$[31] = t17;
+	} else {
+		t17 = $[31];
+	}
+	let t18;
+	if ($[32] !== messageId || $[33] !== t12 || $[34] !== t17) {
+		t18 = /* @__PURE__ */ _jsxs(PopoverContent, {
+			align: "end",
+			"aria-labelledby": messageId,
+			className: "w-[min(18rem,calc(100vw-2rem))] gap-3 p-3.5",
+			children: [t12, t17]
+		});
+		$[32] = messageId;
+		$[33] = t12;
+		$[34] = t17;
+		$[35] = t18;
+	} else {
+		t18 = $[35];
+	}
+	let t19;
+	if ($[36] !== isConfirming || $[37] !== t11 || $[38] !== t18) {
+		t19 = /* @__PURE__ */ _jsxs(Popover, {
+			open: isConfirming,
+			onOpenChange: setIsConfirming,
+			children: [t11, t18]
+		});
+		$[36] = isConfirming;
+		$[37] = t11;
+		$[38] = t18;
+		$[39] = t19;
+	} else {
+		t19 = $[39];
+	}
+	let t20;
+	if ($[40] !== t19 || $[41] !== t3) {
+		t20 = /* @__PURE__ */ _jsx("div", {
+			"data-slot": "confirm-delete-button",
+			className: t3,
+			children: t19
+		});
+		$[40] = t19;
+		$[41] = t3;
+		$[42] = t20;
+	} else {
+		t20 = $[42];
+	}
+	return t20;
+}

package/dist/components/data-table.js

@@ -3,6 +3,7 @@ import * as React from "react";
 import { flexRender, getCoreRowModel, getFilteredRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
 import { CircleAlert, ChevronDown, ChevronRight, Ellipsis, Eraser, X } from "lucide-react";
 import { cn } from "../lib/utils.js";
+import { matchesColumnFilterValue, normalizeFilterToken } from "../lib/column-filter-value.js";
 import { MotionSlot } from "../motion/motion-slot.js";
 import { Button } from "./button.js";
 import { Badge } from "./badge.js";
@@ -12,7 +13,6 @@ import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMe
 import { Input } from "./input.js";
 import { Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./table.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const DIACRITICS_PATTERN = /[\u0300-\u036f]/g;
 const CLEAR_FILTER_ARIA_LABEL = "Limpiar filtro";
 const ACTIVE_EXCLUSIONS_SR_LABEL = "Filtros de exclusión activos";
 const HIDE_EXCLUDE_FILTERS_ARIA_LABEL = "Ocultar filtros de exclusión";
@@ -22,8 +22,37 @@ const EXCLUDED_ROWS_SUMMARY_LABEL = "Total excluidas";
 const CLEAR_ALL_EXCLUSIONS_ARIA_LABEL = "Quitar todas las exclusiones";
 const CLEAR_ALL_EXCLUSIONS_FROM_INPUT_ARIA_LABEL = "Limpiar filtros excluidos";
 const REVERSE_FILTER_PENDING_MESSAGE = "Estás escribiendo una exclusión. Presioná Enter para aplicarla.";
-function normalizeFilterToken(value) {
-	return value.normalize("NFD").replace(DIACRITICS_PATTERN, "").toLocaleLowerCase().trim();
+/** Filters a column with the structured values the query bar writes, or plain text. */
+const columnFilterValueFn = (row, columnId, filterValue) => matchesColumnFilterValue(row.getValue(columnId), filterValue);
+/** Mirrors TanStack's column id resolution: explicit id, else the accessor key with dots as `_`. */
+function getColumnDefId(column) {
+	if (column.id) return column.id;
+	const accessorKey = column.accessorKey;
+	return typeof accessorKey === "string" ? accessorKey.replaceAll(".", "_") : undefined;
+}
+/**
+* Gives the columns targeted by query qualifiers a filter that understands the query bar's
+* structured values. TanStack would otherwise infer one from the data (`inNumberRange` for
+* numbers, which crashes on an object). A consumer's own `filterFn` always wins.
+*/
+function withQueryFilterFns(columns, targetedColumnIds) {
+	if (targetedColumnIds.size === 0) return columns;
+	return columns.map((column) => {
+		if ("columns" in column && column.columns) {
+			return {
+				...column,
+				columns: withQueryFilterFns(column.columns, targetedColumnIds)
+			};
+		}
+		const columnId = getColumnDefId(column);
+		if (column.filterFn != null || columnId == null || !targetedColumnIds.has(columnId)) {
+			return column;
+		}
+		return {
+			...column,
+			filterFn: columnFilterValueFn
+		};
+	});
 }
 function getTableFilterValue(filterValue, showExcludeFilterToggle) {
 	const normalizedFilterValue = filterValue.trimStart();
@@ -310,8 +339,9 @@ export function DataTable({ columns, data, emptyMessage, toolbarActions, onVisib
 		onColumnVisibilityChange?.(updater);
 	}, [controlledColumnVisibility, onColumnVisibilityChange]);
 	// TanStack Table manages internal reactive state through this hook.
+	const tableColumns = React.useMemo(() => withQueryFilterFns(columns, advancedFilterColumnIds), [columns, advancedFilterColumnIds]);
 	const table = useReactTable({
-		columns,
+		columns: tableColumns,
 		data,
 		// La tabla no pagina (no hay `getPaginationRowModel`). Con el auto-reset por
 		// defecto, cada cambio de filtro dispara `resetPageIndex` → `setPagination`,

package/dist/components/dropdown-menu.js

@@ -586,7 +586,7 @@ function DropdownMenuSubTrigger(t0) {
 	}
 	let t1;
 	if ($[5] !== className) {
-		t1 = cn("flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className);
+		t1 = cn("flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground data-open:*:data-[slot=dropdown-menu-sub-trigger-icon]:translate-x-0.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className);
 		$[5] = className;
 		$[6] = t1;
 	} else {
@@ -594,7 +594,10 @@ function DropdownMenuSubTrigger(t0) {
 	}
 	let t2;
 	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
-		t2 = /* @__PURE__ */ _jsx(ChevronRightIcon, { className: "ml-auto" });
+		t2 = /* @__PURE__ */ _jsx(ChevronRightIcon, {
+			"data-slot": "dropdown-menu-sub-trigger-icon",
+			className: "ml-auto transition-transform duration-200 ease-out"
+		});
 		$[7] = t2;
 	} else {
 		t2 = $[7];

package/dist/components/empty-state.d.ts

@@ -0,0 +1,24 @@
+/** Placeholder for regions without content yet: empty lists, sections in construction or first steps. */
+import type { ReactNode } from "react";
+export type EmptyStateTitleElement = "h1" | "h2" | "h3" | "p";
+export interface EmptyStateProps {
+    title: ReactNode;
+    /** Heading level that fits the surrounding outline; a paragraph for minor regions. */
+    titleAs?: EmptyStateTitleElement;
+    /** Short uppercase label above the title, such as "Próximamente". */
+    eyebrow?: ReactNode;
+    description?: ReactNode;
+    /** Actions or extra content, such as buttons or a template list. */
+    children?: ReactNode;
+    align?: "start" | "center";
+    /** `page` uses display typography for full sections; `inline` stays compact inside panels. */
+    size?: "page" | "inline";
+    className?: string;
+}
+/**
+ * Renders the empty region as a labelled section. It does not add a landmark besides the
+ * section, so it composes inside an existing `main`.
+ * @param props - Title, optional eyebrow, description, actions and layout.
+ * @returns The empty state.
+ */
+export declare function EmptyState({ title, titleAs: TitleElement, eyebrow, description, children, align, size, className, }: EmptyStateProps): import("react").JSX.Element;

package/dist/components/empty-state.js

@@ -0,0 +1,37 @@
+import { cn } from "../lib/utils.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** Copy settles in one line after another; reduced motion drops it through the shared fallback. */
+const ENTER_CLASS_NAME = "animate-in fade-in slide-in-from-bottom-1.5 fill-mode-both duration-300";
+/**
+* Renders the empty region as a labelled section. It does not add a landmark besides the
+* section, so it composes inside an existing `main`.
+* @param props - Title, optional eyebrow, description, actions and layout.
+* @returns The empty state.
+*/
+export function EmptyState({ title, titleAs: TitleElement = "h2", eyebrow, description, children, align = "start", size = "inline", className }) {
+	const isCentered = align === "center";
+	const isPage = size === "page";
+	return /* @__PURE__ */ _jsxs("section", {
+		"data-slot": "empty-state",
+		"data-size": size,
+		className: cn("grid gap-2", isCentered ? "justify-items-center text-center" : "justify-items-start", isPage ? "max-w-2xl gap-2.5 py-6" : "py-6", className),
+		children: [
+			eyebrow ? /* @__PURE__ */ _jsx("p", {
+				className: cn("m-0 text-[0.78rem] font-bold tracking-[0.08em] text-[color-mix(in_oklab,var(--primary)_76%,var(--foreground))] uppercase", ENTER_CLASS_NAME),
+				children: eyebrow
+			}) : null,
+			/* @__PURE__ */ _jsx(TitleElement, {
+				className: cn("m-0 text-balance [overflow-wrap:anywhere]", isPage ? "font-display text-[clamp(2rem,6vw,4rem)] leading-[1.05] font-semibold" : "font-semibold", ENTER_CLASS_NAME, "delay-40"),
+				children: title
+			}),
+			description ? /* @__PURE__ */ _jsx("p", {
+				className: cn("m-0 max-w-xl text-pretty text-muted-foreground", isPage && "text-[clamp(1rem,2vw,1.15rem)] leading-relaxed", ENTER_CLASS_NAME, "delay-80"),
+				children: description
+			}) : null,
+			children ? /* @__PURE__ */ _jsx("div", {
+				className: cn("mt-2 flex w-full flex-wrap gap-2", isCentered && "justify-center", ENTER_CLASS_NAME, "delay-120"),
+				children
+			}) : null
+		]
+	});
+}

package/dist/components/error-state.d.ts

@@ -0,0 +1,20 @@
+/** Full-page recovery view for route and global error boundaries: explains the failure and offers a retry. */
+import type { ReactNode } from "react";
+export interface ErrorStateProps {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    description: ReactNode;
+    retryLabel: string;
+    onRetry: () => void;
+    /** Destination of the secondary action. Without it, only the retry action is shown. */
+    homeHref?: string;
+    homeLabel?: string;
+    className?: string;
+}
+/**
+ * Renders a full-height section with the error copy, a retry button and an optional way home.
+ * The home link uses the router adapter configured in `BeezUIProvider`.
+ * @param props - Copy, retry callback and optional home destination.
+ * @returns The error view.
+ */
+export declare function ErrorState({ eyebrow, title, description, retryLabel, onRetry, homeHref, homeLabel, className }: ErrorStateProps): import("react").JSX.Element;

package/dist/components/error-state.js

@@ -0,0 +1,145 @@
+"use client";
+import { c as _c } from "react/compiler-runtime";
+import { cn } from "../lib/utils.js";
+import { Button } from "./button.js";
+import { Link } from "./link.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** Copy and actions settle in one after another; reduced motion drops it through the shared fallback. */
+const ENTER_CLASS_NAME = "animate-in fade-in slide-in-from-bottom-1.5 fill-mode-both duration-300";
+/**
+* Renders a full-height section with the error copy, a retry button and an optional way home.
+* The home link uses the router adapter configured in `BeezUIProvider`.
+* @param props - Copy, retry callback and optional home destination.
+* @returns The error view.
+*/
+export function ErrorState(t0) {
+	const $ = _c(26);
+	const { eyebrow, title, description, retryLabel, onRetry, homeHref, homeLabel, className } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = cn("relative isolate grid h-full min-h-svh w-full content-center justify-items-start gap-5 overflow-hidden bg-background p-[clamp(2rem,5vw,5rem)] text-foreground", className);
+		$[0] = className;
+		$[1] = t1;
+	} else {
+		t1 = $[1];
+	}
+	let t2;
+	if ($[2] !== eyebrow) {
+		t2 = eyebrow ? /* @__PURE__ */ _jsx("p", {
+			className: cn("m-0 font-mono text-[0.8rem] tracking-[0.2em] text-foreground/60 uppercase", ENTER_CLASS_NAME),
+			children: eyebrow
+		}) : null;
+		$[2] = eyebrow;
+		$[3] = t2;
+	} else {
+		t2 = $[3];
+	}
+	let t3;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = cn("m-0 max-w-[14ch] font-display text-[clamp(2.8rem,8vw,5.5rem)] leading-[0.96] font-semibold text-balance sm:max-w-[12ch]", ENTER_CLASS_NAME, "delay-40");
+		$[4] = t3;
+	} else {
+		t3 = $[4];
+	}
+	let t4;
+	if ($[5] !== title) {
+		t4 = /* @__PURE__ */ _jsx("h1", {
+			className: t3,
+			children: title
+		});
+		$[5] = title;
+		$[6] = t4;
+	} else {
+		t4 = $[6];
+	}
+	let t5;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = cn("m-0 max-w-[40rem] text-[clamp(1rem,2vw,1.15rem)] leading-[1.75] text-pretty text-muted-foreground", ENTER_CLASS_NAME, "delay-80");
+		$[7] = t5;
+	} else {
+		t5 = $[7];
+	}
+	let t6;
+	if ($[8] !== description) {
+		t6 = /* @__PURE__ */ _jsx("p", {
+			className: t5,
+			children: description
+		});
+		$[8] = description;
+		$[9] = t6;
+	} else {
+		t6 = $[9];
+	}
+	let t7;
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = cn("flex w-full flex-wrap gap-3.5 pt-2 sm:w-auto", ENTER_CLASS_NAME, "delay-120");
+		$[10] = t7;
+	} else {
+		t7 = $[10];
+	}
+	let t8;
+	if ($[11] !== onRetry || $[12] !== retryLabel) {
+		t8 = /* @__PURE__ */ _jsx(Button, {
+			size: "lg",
+			type: "button",
+			onClick: onRetry,
+			children: retryLabel
+		});
+		$[11] = onRetry;
+		$[12] = retryLabel;
+		$[13] = t8;
+	} else {
+		t8 = $[13];
+	}
+	let t9;
+	if ($[14] !== homeHref || $[15] !== homeLabel) {
+		t9 = homeHref && homeLabel ? /* @__PURE__ */ _jsx(Button, {
+			asChild: true,
+			size: "lg",
+			variant: "outline",
+			children: /* @__PURE__ */ _jsx(Link, {
+				href: homeHref,
+				children: homeLabel
+			})
+		}) : null;
+		$[14] = homeHref;
+		$[15] = homeLabel;
+		$[16] = t9;
+	} else {
+		t9 = $[16];
+	}
+	let t10;
+	if ($[17] !== t8 || $[18] !== t9) {
+		t10 = /* @__PURE__ */ _jsxs("div", {
+			className: t7,
+			children: [t8, t9]
+		});
+		$[17] = t8;
+		$[18] = t9;
+		$[19] = t10;
+	} else {
+		t10 = $[19];
+	}
+	let t11;
+	if ($[20] !== t1 || $[21] !== t10 || $[22] !== t2 || $[23] !== t4 || $[24] !== t6) {
+		t11 = /* @__PURE__ */ _jsxs("section", {
+			"data-slot": "error-state",
+			className: t1,
+			children: [
+				t2,
+				t4,
+				t6,
+				t10
+			]
+		});
+		$[20] = t1;
+		$[21] = t10;
+		$[22] = t2;
+		$[23] = t4;
+		$[24] = t6;
+		$[25] = t11;
+	} else {
+		t11 = $[25];
+	}
+	return t11;
+}

package/dist/components/external-browser-handoff.d.ts

@@ -0,0 +1,27 @@
+export interface ExternalBrowserHandoffCopy {
+    eyebrow?: string;
+    title: string;
+    description: string;
+    countdownDescription: string;
+    primaryAction: string;
+    fallbackLink: string;
+}
+export interface ExternalBrowserHandoffProps {
+    /** Deep link that opens the page in the default browser (see `buildExternalBrowserUrl`). */
+    externalBrowserUrl: string;
+    /** In-app destination used when the deep link does not open another app. */
+    fallbackUrl: string;
+    countdownSeconds?: number;
+    copy?: Partial<ExternalBrowserHandoffCopy>;
+    /** Navigates to the fallback. Defaults to a full browser navigation. */
+    onFallback?: (fallbackUrl: string) => void;
+    className?: string;
+}
+/**
+ * Counts down and then follows `fallbackUrl`, unless the page was hidden because the external
+ * browser opened. Repeated taps on the primary action restart one fallback window instead of
+ * stacking redirects.
+ * @param props - Deep link, fallback, countdown and copy.
+ * @returns The handoff section.
+ */
+export declare function ExternalBrowserHandoff({ externalBrowserUrl, fallbackUrl, countdownSeconds, copy, onFallback, className, }: ExternalBrowserHandoffProps): import("react").JSX.Element;