@factorialco/f0-react 2.44.0 → 2.46.0

package/dist/f0.d.ts

@@ -2045,6 +2045,22 @@ declare type CardAvatarVariant = AvatarVariant | {
 } | {
     type: "icon";
     icon: IconType;
+} | {
+    type: "module";
+    module: ModuleId;
+} | {
+    type: "alert";
+    variant: AlertAvatarProps["type"];
+} | {
+    type: "date";
+    date: Date;
+} | {
+    type: "pulse";
+    firstName: string;
+    lastName: string;
+    src?: string;
+    pulse?: Pulse;
+    onPulseClick: () => void;
 };
 
 /**
@@ -2259,6 +2275,33 @@ declare const cardPropertyRenderers: {
 
 declare type CardPropertyType = keyof typeof cardPropertyRenderers;
 
+declare interface CardRowConfirmAction {
+    onClick: () => void;
+    /** Accessible label and tooltip. Defaults to "Confirm" / "Reject". */
+    label?: string;
+    disabled?: boolean;
+}
+
+/**
+ * Container breakpoint at which the card row switches between its inline and its
+ * stacked (actions-on-their-own-line) layout. `never` keeps it inline at every
+ * width.
+ */
+declare type CardRowStackAt = "sm" | "md" | "lg" | "never";
+
+/**
+ * Resolved state shown at the trailing edge in place of the actions: a coloured
+ * icon (e.g. `Check` for accepted, `Cross` for rejected) carrying the outcome.
+ */
+declare interface CardRowStatus {
+    /** The icon to render (e.g. `Check` for accepted, `Cross` for rejected). */
+    icon: IconType;
+    /** Colour family. */
+    variant: StatusVariant;
+    /** Accessible label; the icon carries meaning, so this is required. */
+    label: string;
+}
+
 declare interface CardSecondaryAction {
     label: string;
     icon?: IconType;
@@ -6850,6 +6893,98 @@ compact?: boolean;
 
 export declare type F0CardProps = Omit<CardInternalProps, (typeof privateProps_3)[number]>;
 
+export declare const F0CardRow: WithDataTestIdReturnType_3<ForwardRefExoticComponent<F0CardRowProps & RefAttributes<HTMLDivElement>> & {
+Skeleton: ({ compact }: {
+compact?: boolean;
+}) => JSX_2.Element;
+}>;
+
+export declare interface F0CardRowProps {
+    /**
+     * The primary line of text.
+     */
+    title: string;
+    /**
+     * Optional secondary line shown beneath the title (wraps across multiple
+     * lines when long).
+     */
+    description?: string;
+    /**
+     * Optional avatar rendered at a fixed `lg` size on the left (the size is not
+     * configurable). Accepts any avatar type in the system: person, company, team,
+     * file, flag, icon, emoji, module, alert, date, pulse. Types without a `lg`
+     * variant (date, pulse) render at their intrinsic size.
+     */
+    avatar?: CardAvatarVariant;
+    /**
+     * The primary action button, shown at the trailing edge of the row.
+     */
+    primaryAction?: CardPrimaryAction;
+    /**
+     * Secondary actions (buttons) or a single link, shown before the primary action.
+     */
+    secondaryActions?: CardSecondaryAction[] | CardSecondaryLink;
+    /**
+     * Overflow (⋯) menu actions, rendered as the trailing control of the row.
+     */
+    otherActions?: DropdownItem[];
+    /**
+     * Confirm/reject variant: renders an icon-only ✗ (reject) + ✓ (confirm) pair
+     * instead of the standard actions. Provide either or both.
+     */
+    confirmAction?: CardRowConfirmAction;
+    /**
+     * Reject (✗) action of the confirm/reject variant. See {@link confirmAction}.
+     */
+    rejectAction?: CardRowConfirmAction;
+    /**
+     * Resolved-state icon shown at the trailing edge in place of any actions — the
+     * outcome of a confirm/reject row, e.g.
+     * `{ icon: Check, variant: "positive", label: "Accepted" }`.
+     * Takes precedence over the action props.
+     */
+    status?: CardRowStatus;
+    /**
+     * Strikes through and dims the title/description, marking the row's subject as
+     * void or closed (e.g. a rejected request). Purely presentational — pair it
+     * with the matching `status` tag at the call site.
+     */
+    inactive?: boolean;
+    /**
+     * Compact layout: tighter padding and smaller controls.
+     */
+    compact?: boolean;
+    /**
+     * Container width at which the actions drop to their own line (below it) vs.
+     * sit inline (at/above it). `never` keeps them inline at every width.
+     * @default "never"
+     */
+    stackAt?: CardRowStackAt;
+    /**
+     * When set, the whole row becomes a link to this href.
+     */
+    link?: string;
+    /**
+     * Stretch to fill the height of its container.
+     */
+    fullHeight?: boolean;
+    /**
+     * Alert banner displayed above the row with a coloured header strip and matching
+     * border. Supports info, warning, critical and positive variants.
+     * Use `visible` + `onDismiss` for controlled dismiss behaviour.
+     */
+    alert?: CardAlertProps;
+    /**
+     * Called when the row is clicked.
+     */
+    onClick?: () => void;
+    /**
+     * Disables the full-row overlay link so a parent can manage drag-and-drop while
+     * still allowing click navigation via `onClick`.
+     */
+    disableOverlayLink?: boolean;
+}
+
 declare interface F0CardSelectConfig {
     options: CardSelectOption[];
     hideLabel?: boolean;
@@ -8879,30 +9014,51 @@ export declare type F0HeadingProps = Omit<TextProps, "className" | "variant" | "
     as?: HeadingTags;
 };
 
-export declare const F0HILActionConfirmation: ({ text, confirmationText, onConfirm, cancelText, onCancel, }: F0HILActionConfirmationProps) => JSX_2.Element;
+export declare const F0HILActionConfirmation: ({ text, description, avatar, confirmationText, onConfirm, cancelText, onCancel, stackAt, }: F0HILActionConfirmationProps) => JSX_2.Element;
 
 /**
- * Props for the F0HILActionConfirmation component
+ * Props for the F0HILActionConfirmation component.
+ *
+ * Renders an inline approve/reject row built on `F0CardRow`'s confirm/reject
+ * variant: the prompt as the row title, with icon-only ✓ (confirm) and ✗
+ * (reject) buttons at the trailing edge.
  */
 export declare type F0HILActionConfirmationProps = {
     /**
-     * Optional descriptive text shown above the action buttons
+     * The prompt shown as the row title (e.g. the action awaiting confirmation).
+     * Required — a confirmation without a prompt has no meaning.
      */
-    text?: string;
+    text: string;
     /**
-     * Text displayed on the confirmation button
+     * Optional secondary line shown beneath the title (single line, truncated).
+     */
+    description?: F0CardRowProps["description"];
+    /**
+     * Optional avatar rendered on the left of the row. Accepts any avatar type in
+     * the system (person, company, team, file, icon, emoji, …).
+     */
+    avatar?: F0CardRowProps["avatar"];
+    /**
+     * Container width at which the ✓/✗ actions drop onto their own line instead of
+     * staying inline. Prevents the buttons from overlapping the prompt in narrow
+     * containers. Set to `"never"` to keep them inline at every width.
+     * @default "sm"
+     */
+    stackAt?: F0CardRowProps["stackAt"];
+    /**
+     * Accessible label and tooltip for the confirm (✓) button.
      */
     confirmationText: string;
     /**
-     * Callback fired when the confirmation button is clicked
+     * Callback fired when the confirm button is clicked.
      */
     onConfirm: () => void;
     /**
-     * Text displayed on the cancel button
+     * Accessible label and tooltip for the reject (✗) button.
      */
     cancelText: string;
     /**
-     * Callback fired when the cancel button is clicked
+     * Callback fired when the reject button is clicked.
      */
     onCancel: () => void;
 };
@@ -12909,6 +13065,10 @@ declare type Props_3 = {
 
 declare type Props_4 = {} & Pick<BaseHeaderProps, "avatar" | "title" | "description" | "primaryAction" | "secondaryActions" | "otherActions" | "metadata" | "status" | "deactivated" | "showBottomBorder">;
 
+declare type Pulse = (typeof pulses)[number];
+
+declare const pulses: readonly ["superNegative", "negative", "neutral", "positive", "superPositive"];
+
 export declare type QuestionActionParams = {
     questionId: string;
     type: ActionType;
@@ -15587,9 +15747,9 @@ declare namespace Calendar {
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        aiBlock: {
-            insertAIBlock: (data: AIBlockData, config: AIBlockConfig) => ReturnType;
-            executeAIAction: (actionType: string, config: AIBlockConfig) => ReturnType;
+        enhanceHighlight: {
+            setEnhanceHighlight: (from: number, to: number) => ReturnType;
+            clearEnhanceHighlight: () => ReturnType;
         };
     }
 }
@@ -15597,9 +15757,9 @@ declare module "@tiptap/core" {
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        enhanceHighlight: {
-            setEnhanceHighlight: (from: number, to: number) => ReturnType;
-            clearEnhanceHighlight: () => ReturnType;
+        aiBlock: {
+            insertAIBlock: (data: AIBlockData, config: AIBlockConfig) => ReturnType;
+            executeAIAction: (actionType: string, config: AIBlockConfig) => ReturnType;
         };
     }
 }