@factorialco/f0-react 2.53.0 → 2.55.0

package/dist/experimental.js

@@ -2,8 +2,8 @@ import { g as ca, B as da, h as ua, i as fa, j as Ft, k as De, l as ma, m as g,
 import { bW as Ac, bV as Lc, c6 as Ec, bS as _c, bT as Oc, bL as Dc, bM as Tc, bN as zc, c7 as Pc, bU as Bc, c2 as Rc, c3 as $c, bO as Wc, bY as Mc, bX as jc, bP as Vc, bQ as Gc, c4 as Hc, c8 as Uc, c5 as Kc, c1 as qc, b_ as Yc, c0 as Zc, bZ as Xc, bR as Jc, b$ as Qc } from "./F0CanvasPanel-Cb-XPsWw.js";
 import { jsx as e, jsxs as o, Fragment as U } from "react/jsx-runtime";
 import se, { forwardRef as j, useRef as G, useTransition as Kr, useState as _, useLayoutEffect as Fn, useId as ct, useContext as Ke, createContext as yt, useEffect as $, useCallback as Q, useMemo as q, Fragment as qr, isValidElement as Yr, cloneElement as An, Children as Ln } from "react";
-import { C as Zr, P as Xr, a as En, M as Jr, R as Dt, b as _n, u as Qr, c as On, S as el, A as tl, B as nl, L as al, d as rl, V as ll, e as il, f as sl, g as ol, O as cl } from "./useDataCollectionSource-B5h-cwWc.js";
-import { l as td, m as nd, j as ad, x as rd, n as ld, s as id, a3 as sd, w as od, k as cd, D as dd, F as ud, J as fd, E as md, z as hd, a9 as gd, I as pd, K as bd, Q as xd, o as vd, a5 as wd, a6 as yd, a4 as Nd, a7 as Cd, N as kd, U as Sd, a0 as Id, a2 as Fd, p as Ad, r as Ld, t as Ed, G as _d, a8 as Od, H as Dd, T as Td, q as zd, v as Pd, h as Bd, i as Rd, X as $d, Y as Wd, a1 as Md, y as jd, Z as Vd, _ as Gd, W as Hd, $ as Ud } from "./useDataCollectionSource-B5h-cwWc.js";
+import { C as Zr, P as Xr, a as En, M as Jr, R as Dt, b as _n, u as Qr, c as On, S as el, A as tl, B as nl, L as al, d as rl, V as ll, e as il, f as sl, g as ol, O as cl } from "./useDataCollectionSource-D0OxkURJ.js";
+import { l as td, m as nd, j as ad, x as rd, n as ld, s as id, a3 as sd, w as od, k as cd, D as dd, F as ud, J as fd, E as md, z as hd, a9 as gd, I as pd, K as bd, Q as xd, o as vd, a5 as wd, a6 as yd, a4 as Nd, a7 as Cd, N as kd, U as Sd, a0 as Id, a2 as Fd, p as Ad, r as Ld, t as Ed, G as _d, a8 as Od, H as Dd, T as Td, q as zd, v as Pd, h as Bd, i as Rd, X as $d, Y as Wd, a1 as Md, y as jd, Z as Vd, _ as Gd, W as Hd, $ as Ud } from "./useDataCollectionSource-D0OxkURJ.js";
 const dl = ca("Search", [
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
   ["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]

package/dist/f0.d.ts

@@ -1048,6 +1048,11 @@ declare const alertAvatarVariants: (props?: ({
     className?: ClassValue;
 })) | undefined) => string;
 
+export declare type AlertDialogOptions = NotificationDialogBaseOptions & {
+    /** The alert action (default: label "Ok", value true). */
+    confirm?: DialogSimpleAction;
+};
+
 declare type AlertTagProps = ComponentProps<typeof F0TagAlert>;
 
 export declare type AlertVariant = (typeof alertVariantOptions)[number];
@@ -3097,6 +3102,13 @@ declare const componentTypes: readonly ["layout", "info", "action", "form"];
 
 export declare function computeSectionEndIds(elements: SurveyFormBuilderElement[]): Set<string>;
 
+export declare type ConfirmDialogOptions = NotificationDialogBaseOptions & {
+    /** The confirm action (default: label "Ok", value true). */
+    confirm?: DialogSimpleAction;
+    /** The cancel action (default: label "Cancel", value false). */
+    cancel?: DialogSimpleAction;
+};
+
 export declare type ContentType = (typeof contentTypes)[number];
 
 export declare const contentTypes: readonly ["text", "person", "people", "team", "company", "alert", "balance", "sparkline"];
@@ -5033,6 +5045,41 @@ declare type DetailsItemContent = (ComponentProps<typeof DataList.Item> & {
     type: "file";
 });
 
+/**
+ * Imperative API for centered dialogs. Requires `<F0Provider>` (which mounts
+ * `DialogsAlikeLayoutProvider`) to be present in the tree.
+ *
+ * @example
+ * const result = await dialog.open({ title, content, actions: { primary: { label: "OK", value: true } } })
+ */
+export declare const dialog: {
+    /** Open a dialog. Resolves with the value of the action the user picked. */
+    open: (definition: Optional<DialogDefinition, "id">) => Promise<DialogActionValue>;
+    /** Open a notification-style dialog (info/warning/critical/positive). */
+    notification: (options: NotificationDialogOptions) => Promise<DialogActionValue>;
+    /** Notification dialog with a single confirm action (defaults to "Ok"). */
+    alert: (options: AlertDialogOptions) => Promise<DialogActionValue>;
+    /** Notification dialog with confirm + cancel actions (defaults to Ok/Cancel). */
+    confirm: (options: ConfirmDialogOptions) => Promise<DialogActionValue>;
+    /** Programmatically close a dialog by id (resolves its promise with undefined). */
+    close: (id: DialogId) => void;
+};
+
+export declare type DialogAction = Optional<Pick<F0ButtonProps, "label" | "icon" | "disabled">, "icon" | "disabled"> & {
+    value: DialogActionValue;
+    keepOpen?: boolean;
+    nonBlocking?: boolean;
+};
+
+export declare type DialogActions = {
+    primary: DialogAction | DialogAction[];
+    secondary?: DialogAction | DialogAction[];
+};
+
+export declare type DialogActionValue = DialogActionValuePrimitive | (() => Promise<DialogActionValuePrimitive>);
+
+declare type DialogActionValuePrimitive = string | boolean | number | undefined | null;
+
 declare type DialogAlikeAction = {
     value?: string;
     label: string;
@@ -5065,10 +5112,58 @@ export declare type DialogControls = {
     onClick: () => void;
 };
 
+export declare type DialogDefinition = {
+    size?: F0DialogSize;
+    id: DialogId;
+    title: string;
+    description?: string;
+    content: ReactNode;
+    actions: DialogActions;
+    keepOpen?: boolean;
+    /**
+     * If true, the dialog will be modal (cannot be closed by clicking outside or pressing Escape).
+     * @default false
+     */
+    modal?: boolean;
+    /**
+     * The module of the dialog.
+     */
+    module?: DialogModule;
+};
+
+export declare type DialogId = string;
+
+/**
+ * Module configuration shown in a dialog/drawer header.
+ *
+ * Kept in its own module (free of any F0Dialog/F0Drawer dependency) so the
+ * shared `dialog-alike/common` layer can reference it without creating a
+ * circular dependency back through `dialogs-alike/types`.
+ */
+declare type DialogModule = {
+    id: ModuleId;
+    label: string;
+    href: string;
+};
+
+declare type DialogNotificationType = (typeof dialogNotificationTypes)[number];
+
+/**
+ * The levels of the alert.
+ */
+declare const dialogNotificationTypes: readonly ["info", "warning", "critical", "positive"];
+
 export declare type DialogPosition = (typeof dialogPositions)[number];
 
 declare const dialogPositions: readonly ["center", "left", "right", "fullscreen"];
 
+declare type DialogSimpleAction = {
+    label?: string;
+    value?: DialogActionValue;
+};
+
+declare const dialogSizes: readonly ["sm", "md", "lg", "xl", "fullscreen"];
+
 export declare type DialogWidth = (typeof dialogWidths)[number];
 
 declare const dialogWidths: readonly ["sm", "md", "lg", "xl"];
@@ -5148,8 +5243,54 @@ export declare type DragPayload<T = unknown> = {
     data?: T;
 };
 
+/**
+ * Imperative API for side drawers. Requires `<F0Provider>` to be present.
+ *
+ * @example
+ * const result = await drawer.open({ title, content, actions: { primary: { label: "Save", value: "save" } } })
+ */
+export declare const drawer: {
+    /** Open a drawer. Resolves with the value of the action the user picked. */
+    open: (definition: Optional<DrawerDefinition, "id">) => Promise<DialogActionValue>;
+    /** Programmatically close a drawer by id (resolves its promise with undefined). */
+    close: (id: DialogId) => void;
+};
+
+export declare type DrawerDefinition = {
+    /** The size of the drawer. */
+    size?: DrawerSize;
+    /** The id of the drawer. Auto-generated if not provided. */
+    id: DialogId;
+    /** The title of the drawer. */
+    title: string;
+    /** The description of the drawer. */
+    description?: string;
+    /** The content of the drawer. */
+    content: ReactNode;
+    /** The actions of the drawer. */
+    actions: DialogActions;
+    /**
+     * If true, the drawer will not be closed automatically when an action is
+     * clicked. Useful for drawers that need to be closed manually.
+     */
+    keepOpen?: boolean;
+    /**
+     * The position of the drawer.
+     * @default "right"
+     */
+    position?: F0DrawerPosition;
+    /** If true, the drawer will be modal. */
+    modal?: boolean;
+    /** The module of the drawer. */
+    module?: DialogModule;
+};
+
 declare const drawerPositions: readonly ["left", "right"];
 
+declare type DrawerSize = (typeof drawerSizes)[number];
+
+declare const drawerSizes: readonly ["md"];
+
 declare type DropdownItem = DropdownItemObject | DropdownItemSeparator | DropdownItemLabel;
 
 declare type DropdownItemLabel = {
@@ -7931,6 +8072,8 @@ export declare type F0DialogSecondaryAction = {
 
 export declare type F0DialogSecondaryActionItem = F0DialogActionItem;
 
+declare type F0DialogSize = (typeof dialogSizes)[number];
+
 /**
  * @experimental This is an experimental component use it at your own risk
  */
@@ -10323,7 +10466,10 @@ declare interface F0WizardFormBaseProps {
     isOpen: boolean;
     onClose?: () => void;
     title?: string;
+    /** @deprecated Use `size` instead. */
     width?: DialogWidth;
+    /** The size of the wizard dialog. Preferred over the deprecated `width`. */
+    size?: F0DialogSize;
     defaultStepIndex?: number;
     nextLabel?: string;
     previousLabel?: string;
@@ -12275,6 +12421,15 @@ export declare class NotesTextEditorUnsupportedPatchTypeError extends Error {
     constructor(patchType: unknown);
 }
 
+declare type NotificationDialogBaseOptions = Optional<Pick<DialogDefinition, "id" | "title">, "id"> & {
+    msg: string;
+    type?: DialogNotificationType;
+};
+
+export declare type NotificationDialogOptions = NotificationDialogBaseOptions & {
+    actions: DialogActions;
+};
+
 declare type NumberCellConfig<R extends RecordType = RecordType> = {
     min?: number;
     max?: number;