@factorialco/f0-react 9.0.0 → 9.2.0

package/dist/f0.d.ts

@@ -1612,7 +1612,7 @@ declare type AvatarFileSize = (typeof avatarFileSizes)[number];
 
 declare const avatarFileSizes: readonly ["xs", "sm", "md", "lg"];
 
-declare const avatarIconSizes: readonly ["sm", "md", "lg"];
+declare const avatarIconSizes: readonly ["xs", "sm", "md", "lg"];
 
 export declare type AvatarListSize = (typeof avatarListSizes)[number];
 
@@ -2090,7 +2090,7 @@ export declare type BoxShadowToken = "none" | "sm" | "md" | "lg" | "xl";
 declare type BoxVariantProps = VariantProps<typeof boxVariants>;
 
 declare const boxVariants: (props?: ({
-    zIndex?: "0" | "auto" | "10" | "20" | "50" | "40" | "30" | undefined;
+    zIndex?: "0" | "auto" | "10" | "20" | "40" | "30" | "50" | undefined;
     boxShadow?: "none" | "lg" | "md" | "sm" | "xl" | undefined;
     divider?: "x" | "y" | undefined;
     dividerColor?: "bold" | "selected" | "default" | "info" | "secondary" | "critical" | "warning" | "positive" | "promote" | "critical-bold" | "info-bold" | "warning-bold" | "positive-bold" | "selected-bold" | undefined;
@@ -2103,11 +2103,11 @@ declare const boxVariants: (props?: ({
     borderBottom?: "none" | "default" | "thick" | undefined;
     borderLeft?: "none" | "default" | "thick" | undefined;
     borderRight?: "none" | "default" | "thick" | undefined;
-    borderRadius?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "full" | "3xl" | undefined;
-    borderRadiusTopLeft?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "full" | "3xl" | undefined;
-    borderRadiusTopRight?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "full" | "3xl" | undefined;
-    borderRadiusBottomLeft?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "full" | "3xl" | undefined;
-    borderRadiusBottomRight?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "full" | "3xl" | undefined;
+    borderRadius?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "3xl" | "full" | undefined;
+    borderRadiusTopLeft?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "3xl" | "full" | undefined;
+    borderRadiusTopRight?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "3xl" | "full" | undefined;
+    borderRadiusBottomLeft?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "3xl" | "full" | undefined;
+    borderRadiusBottomRight?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "2xs" | "3xl" | "full" | undefined;
     borderStyle?: "none" | "dashed" | "dotted" | "double" | "solid" | undefined;
     background?: "bold" | "selected" | "info" | "secondary" | "inverse" | "critical" | "accent" | "warning" | "positive" | "promote" | "critical-bold" | "transparent" | "overlay" | "primary" | "tertiary" | "inverse-secondary" | "accent-bold" | "info-bold" | "warning-bold" | "positive-bold" | "selected-secondary" | "selected-bold" | undefined;
     width?: SizeToken_2 | undefined;
@@ -2124,7 +2124,7 @@ declare const boxVariants: (props?: ({
     gap?: "none" | "lg" | "md" | "sm" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | undefined;
     alignItems?: "center" | "end" | "start" | "baseline" | "stretch" | undefined;
     justifyContent?: "center" | "end" | "start" | "between" | "stretch" | "around" | "evenly" | undefined;
-    flexDirection?: "row" | "column" | "column-reverse" | "row-reverse" | undefined;
+    flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
     flexWrap?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
     grow?: boolean | undefined;
     shrink?: boolean | undefined;
@@ -4190,7 +4190,10 @@ export declare interface DashboardItemBase {
     id: string;
     /** Widget title displayed in the header */
     title: string;
-    /** Optional description below the title */
+    /**
+     * Optional description below the title. For a table, its non-empty lines
+     * also head the Excel download, under the title and above the headers.
+     */
     description?: string;
     /**
      * Optional help copy for what the widget measures, revealed by an ⓘ icon
@@ -6144,6 +6147,11 @@ export declare const defaultTranslations: {
             readonly fromPrevious: "from previous";
             readonly fromStage: "from {{stage}}";
         };
+        readonly aria: {
+            readonly moreValues: "{{count}} more values";
+            readonly moreSeries: "{{count}} more series";
+            readonly gaugeValue: "{{value}}, range {{min}} to {{max}}";
+        };
     };
     readonly progressSeries: {
         readonly noData: "No data";
@@ -7016,6 +7024,16 @@ declare type DropdownInternalProps = {
     children?: default_2.ReactNode;
     align?: "start" | "end" | "center";
     alignOffset?: number;
+    /** Edge the menu opens from. @default "bottom" */
+    side?: "top" | "right" | "bottom" | "left";
+    /** Gap between the trigger and the menu, in px. @default 4 */
+    sideOffset?: number;
+    /**
+     * Floor for the menu's width, in px. The menu is still never narrower than
+     * its trigger. By default it is as wide as its trigger or its longest row,
+     * whichever is wider.
+     */
+    minWidth?: number;
     disableExitAnimation?: boolean;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -7056,7 +7074,7 @@ declare type DropdownInternalProps = {
     modal?: boolean;
 } & DataAttributes_2;
 
-export declare type DropdownItem = DropdownItemObject | DropdownItemSeparator | DropdownItemLabel | DropdownItemSubmenu | DropdownItemSwitch;
+export declare type DropdownItem = DropdownItemObject | DropdownItemSeparator | DropdownItemLabel | DropdownItemSubmenu | DropdownItemSwitch | DropdownItemPanel;
 
 declare type DropdownItemLabel = {
     type: "label";
@@ -7074,6 +7092,32 @@ declare type DropdownItemObject = Pick<NavigationItem, "label" | "href"> & Omit<
      * item's `pointer-events: none`.
      */
     disabledTooltip?: string;
+    /**
+     * The one that is already true: the workspace you are in, the sort you are
+     * on. It draws a check at the end of the row. The menu does not enforce
+     * that only one item has it.
+     */
+    checked?: boolean;
+    /** Where the link opens. `"_blank"` gets the row its external arrow. */
+    target?: AnchorHTMLAttributes<HTMLAnchorElement>["target"];
+    /**
+     * Draws the trailing "opens elsewhere" arrow, for a row that opens a window
+     * from `onClick`, or links out without `target="_blank"` (which marks
+     * itself).
+     */
+    external?: boolean;
+};
+
+/**
+ * A block the menu shows rather than a row it offers, such as an account card
+ * under the menu's caption. It takes no focus and closes nothing, so it is not
+ * a `DropdownMenuItem`: the arrow keys pass over it. Keep its content static:
+ * the menu keeps keyboard focus on its rows, so a control inside a panel cannot
+ * be reached with the keyboard.
+ */
+declare type DropdownItemPanel = {
+    type: "panel";
+    content: default_2.ReactNode;
 };
 
 declare type DropdownItemSeparator = {
@@ -10205,7 +10249,13 @@ declare interface F0DataChartBaseProps extends F0DataChartCommonProps, F0DataCha
     showLabels?: boolean;
     /** Format the value axis tick labels (e.g. `(v) => \`${v}M\`` ) */
     valueFormatter?: (value: number) => string;
-    /** Format category axis tick labels */
+    /**
+     * Format category axis tick labels. Only the axis uses it: the chart's
+     * screen-reader summary reads `categories` as passed. So pass full names
+     * ("January", "Monday") and shorten them here, e.g.
+     * `(category) => category.slice(0, 3)`, rather than passing abbreviations a
+     * screen reader would read out as "Jan".
+     */
     categoryFormatter?: (value: string) => string;
     /** Escape hatch: raw ECharts options merged (shallow) on top of the generated config */
     echartsOptions?: Partial<echarts_2.EChartsOption>;
@@ -10215,6 +10265,13 @@ declare interface F0DataChartBaseProps extends F0DataChartCommonProps, F0DataCha
  * Props shared by every `F0DataChart` variant.
  */
 declare interface F0DataChartCommonProps<Point extends F0DataChartPointClick = F0DataChartMarkPointClick> {
+    /**
+     * What the chart is about, e.g. "Headcount by department, Q3". Screen
+     * readers announce it as the chart's name, followed by the summary of its
+     * data that every chart generates on its own. Pass the chart's visible
+     * title when it has one: the data alone can't say what was measured.
+     */
+    ariaLabel?: string;
     /** Customize or opt out of the empty state shown when data is empty. */
     emptyState?: F0DataChartEmptyStateProps;
     /**
@@ -10401,7 +10458,7 @@ declare interface F0DataChartLegendInteractionProps {
     /**
      * Reports the chart's live legend visibility after an interactive toggle.
      * Primarily used by accessible companion surfaces that must expose the same
-     * data currently shown on the canvas.
+     * data currently shown in the chart.
      */
     onLegendSelectionChange?: (selected: Record<string, boolean>) => void;
 }
@@ -10712,7 +10769,8 @@ export declare interface F0DataChartReferenceLine {
  *
  * The bare `[x, y]` tuple is the terse form. The object form additionally
  * carries `label` — the point's identity (e.g. an employee or team name),
- * shown as the tooltip header.
+ * shown as the tooltip header — and an optional `avatar` drawn in place of
+ * the dot.
  */
 export declare type F0DataChartScatterDataPoint = [number, number] | {
     /** Horizontal position, plotted on the value X axis */
@@ -10723,6 +10781,13 @@ export declare type F0DataChartScatterDataPoint = [number, number] | {
     label?: string;
     /** Override color for this individual point. Must be an F0 design token name. */
     color?: ChartColorToken;
+    /**
+     * Draw this avatar in place of the dot, e.g. the employee the point
+     * stands for. It sits on a dot of the series color, so a color split
+     * still reads. Rendered at the largest avatar size that fits
+     * `pointSize`, and never below `xs` (20px).
+     */
+    avatar?: AvatarVariant;
 };
 
 /**
@@ -10738,7 +10803,10 @@ export declare interface F0DataChartScatterProps extends F0DataChartCommonProps,
     type: "scatter";
     /** One or more point groups. Multiple series render as a color split. */
     series: F0DataChartScatterSeries[];
-    /** Point diameter in pixels. @default 12 */
+    /**
+     * Point diameter in pixels. Points with an `avatar` use the largest avatar
+     * size that fits it, and never go below 20px. @default 12
+     */
     pointSize?: number;
     /**
      * Fit each axis to its data range instead of anchoring it at zero. Turn off
@@ -10792,7 +10860,8 @@ export declare interface F0DataChartScatterProps extends F0DataChartCommonProps,
     showPointLabels?: boolean;
     /**
      * Merge points that land on nearly the same spot into one dot. The merged dot
-     * prints no label; hovering it lists every point it holds. @default false
+     * prints no label or avatar; hovering it lists every point it holds.
+     * @default false
      */
     groupNearbyPoints?: boolean;
     /** Render `xAxisName`/`yAxisName` as axis titles, not only in the tooltip. @default false */
@@ -23039,16 +23108,6 @@ declare namespace Calendar {
 }
 
 
-declare module "@tiptap/core" {
-    interface Commands<ReturnType> {
-        fontSize: {
-            setFontSize: (fontSize: string) => ReturnType;
-            unsetFontSize: () => ReturnType;
-        };
-    }
-}
-
-
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         aiBlock: {
@@ -23061,10 +23120,9 @@ declare module "@tiptap/core" {
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        indent: {
-            setIndent: (level: number) => ReturnType;
-            unsetIndent: () => ReturnType;
-            outdent: () => ReturnType;
+        fontSize: {
+            setFontSize: (fontSize: string) => ReturnType;
+            unsetFontSize: () => ReturnType;
         };
     }
 }
@@ -23082,6 +23140,17 @@ declare module "@tiptap/core" {
 }
 
 
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        indent: {
+            setIndent: (level: number) => ReturnType;
+            unsetIndent: () => ReturnType;
+            outdent: () => ReturnType;
+        };
+    }
+}
+
+
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         moodTracker: {