@factorialco/f0-react 6.3.2 → 6.4.0

package/dist/experimental.d.ts

@@ -2045,7 +2045,7 @@ declare interface ChatDashboardBarChartConfig extends ChatDashboardChartConfigBa
     stacked?: boolean;
 }
 
-declare type ChatDashboardChartConfig = ChatDashboardBarChartConfig | ChatDashboardLineChartConfig | ChatDashboardFunnelChartConfig | ChatDashboardRadarChartConfig | ChatDashboardPieChartConfig | ChatDashboardGaugeChartConfig | ChatDashboardHeatmapChartConfig;
+declare type ChatDashboardChartConfig = ChatDashboardBarChartConfig | ChatDashboardLineChartConfig | ChatDashboardFunnelChartConfig | ChatDashboardRadarChartConfig | ChatDashboardPieChartConfig | ChatDashboardGaugeChartConfig | ChatDashboardHeatmapChartConfig | ChatDashboardScatterChartConfig;
 
 declare interface ChatDashboardChartConfigBase {
     showLegend?: boolean;
@@ -2057,7 +2057,7 @@ declare interface ChatDashboardChartConfigBase {
 declare interface ChatDashboardChartItem extends ChatDashboardItemBase {
     type: "chart";
     chart: ChatDashboardChartConfig;
-    computation: ChartComputation | RadarComputation | PieComputation | GaugeComputation | HeatmapComputation;
+    computation: ChartComputation | RadarComputation | PieComputation | GaugeComputation | HeatmapComputation | ScatterComputation;
 }
 
 declare interface ChatDashboardCollectionItem extends ChatDashboardItemBase {
@@ -2244,6 +2244,23 @@ declare interface ChatDashboardRadarChartConfig extends ChatDashboardChartConfig
     showArea?: boolean;
 }
 
+declare interface ChatDashboardScatterChartConfig {
+    type: "scatter";
+    pointSize?: number;
+    scaleAxes?: boolean;
+    showGrid?: boolean;
+    /** Only rendered with 2+ series, but still needed so a skeleton can reserve for it. */
+    showLegend?: boolean;
+    /** What the X measure is, e.g. "salary" — labels the x row in the tooltip */
+    xAxisName?: string;
+    /** What the Y measure is, e.g. "tenure" — labels the y row in the tooltip */
+    yAxisName?: string;
+    /** Formats the Y measure */
+    valueFormat?: FormatPreset;
+    /** Formats the X measure, which is a second measure rather than a category */
+    xValueFormat?: FormatPreset;
+}
+
 export declare type ChatWidgetEmptyStateProps = Props_6;
 
 declare type ChildrenPaginationInfo = {
@@ -9622,6 +9639,21 @@ export declare type RichTextEditorProps = F0RichTextEditorProps;
 /** @deprecated Use F0RichTextEditorSkeletonProps */
 export declare type RichTextEditorSkeletonProps = F0RichTextEditorSkeletonProps;
 
+/**
+ * Both axes are measures, so there is no aggregation: a scatter plots one
+ * point per row rather than grouping rows into categories. `label` names the
+ * column identifying each point, and `series` the optional column that splits
+ * the points into colour groups.
+ */
+declare interface ScatterComputation {
+    datasetId: string;
+    xAxis: string;
+    yAxis: string;
+    label?: string;
+    series?: string;
+    limit?: number;
+}
+
 export declare const ScrollArea: WithDataTestIdReturnType<ForwardRefExoticComponent<Omit<Omit<ScrollAreaProps & RefAttributes<HTMLDivElement>, "ref"> & {
 showBar?: boolean;
 viewportRef?: React.RefObject<HTMLDivElement>;

package/dist/experimental.js

@@ -3,8 +3,8 @@ import { cX as a1, cW as s1, d7 as l1, cT as c1, cU as d1, cN as u1, cO as f1, c
 import { jsx as n, jsxs as h, Fragment as Ae } from "react/jsx-runtime";
 import Y, { forwardRef as Oe, useRef as O, useTransition as bu, useState as B, useLayoutEffect as Hn, useId as Ln, useContext as zt, createContext as ht, useEffect as q, useCallback as U, useMemo as de, Fragment as _t, isValidElement as vu, cloneElement as hs, Suspense as Er, lazy as sn, createElement as or, memo as ps, Children as gs } from "react";
 import { d as k, T as xu, a as yu, b as wu, f as Ye, c as Nu, u as Cu } from "./tooltip-Cik7KBQT.js";
-import { C as Iu, P as ku, E as Su, a as Uo, b as Wn, M as Tu, p as Ru, c as Eu, R as Ri, e as bs, u as Lu, f as zu, g as Fu, h as Au, i as Pu, j as Mu, O as vs, k as xs, S as Ou, A as Du, B as Bu, L as _u, l as $u, V as Hu, m as Wu, n as ju, o as Uu } from "./index-DZ4jJo6T.js";
-import { a5 as D1, a6 as B1, v as _1, w as $1, s as H1, N as W1, x as j1, H as U1, ag as V1, K as G1, t as K1, a3 as q1, ai as Y1, ah as X1, X as J1, al as Q1, F as Z1, a0 as ey, Z as ty, T as ny, an as ry, U as oy, a1 as iy, a2 as ay, y as sy, aj as ly, ak as cy, W as dy, a4 as uy, ad as fy, af as my, z as hy, G as py, I as gy, _ as by, am as vy, $ as xy, Y as yy, ao as wy, D as Ny, J as Cy, q as Iy, r as ky, a9 as Sy, aa as Ty, a7 as Ry, ae as Ey, Q as Ly, ab as zy, a8 as Fy, ac as Ay } from "./index-DZ4jJo6T.js";
+import { C as Iu, P as ku, E as Su, a as Uo, b as Wn, M as Tu, p as Ru, c as Eu, R as Ri, e as bs, u as Lu, f as zu, g as Fu, h as Au, i as Pu, j as Mu, O as vs, k as xs, S as Ou, A as Du, B as Bu, L as _u, l as $u, V as Hu, m as Wu, n as ju, o as Uu } from "./index-C5uJNrqj.js";
+import { a5 as D1, a6 as B1, v as _1, w as $1, s as H1, N as W1, x as j1, H as U1, ag as V1, K as G1, t as K1, a3 as q1, ai as Y1, ah as X1, X as J1, al as Q1, F as Z1, a0 as ey, Z as ty, T as ny, an as ry, U as oy, a1 as iy, a2 as ay, y as sy, aj as ly, ak as cy, W as dy, a4 as uy, ad as fy, af as my, z as hy, G as py, I as gy, _ as by, am as vy, $ as xy, Y as yy, ao as wy, D as Ny, J as Cy, q as Iy, r as ky, a9 as Sy, aa as Ty, a7 as Ry, ae as Ey, Q as Ly, ab as zy, a8 as Fy, ac as Ay } from "./index-C5uJNrqj.js";
 import Vu from "react-dom";
 const Gu = hc("Search", [
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
@@ -7899,7 +7899,7 @@ const fl = () => Ut(ol, "useChatJump"), Jh = () => Ut(il, "useChatHighlightedId"
 }, Pr = (e, t) => {
   const r = document.createElement("a");
   r.href = e, r.download = t, r.rel = "noreferrer", r.click();
-}, tp = sn(() => import("./ChatPdfThumbnail-DsiMxESY.js")), np = sn(() => import("./ChatSheetThumbnail-BvnxT-4A.js")), rp = sn(() => import("./ChatDocxThumbnail-DzNPNFya.js")), op = sn(() => import("./ChatTextThumbnail-yVt_iYi7.js")), ip = 288, ap = 160, sp = (e) => {
+}, tp = sn(() => import("./ChatPdfThumbnail-DyDN7a-p.js")), np = sn(() => import("./ChatSheetThumbnail-BvnxT-4A.js")), rp = sn(() => import("./ChatDocxThumbnail-DzNPNFya.js")), op = sn(() => import("./ChatTextThumbnail-yVt_iYi7.js")), ip = 288, ap = 160, sp = (e) => {
   const [t, r] = B(!1);
   return q(() => {
     const o = e.current;
@@ -9942,7 +9942,7 @@ const kp = {
     ] })
   ] }) });
 }, Dp = sn(
-  () => import("./index-BnjwVHNf.js").then((e) => e.i).then((e) => ({
+  () => import("./index-Cdvq3ahA.js").then((e) => e.i).then((e) => ({
     default: e.F0PdfViewer
   }))
 ), Bp = () => {

package/dist/f0.d.ts

@@ -2802,7 +2802,7 @@ export declare interface ChatDashboardBarChartConfig extends ChatDashboardChartC
     stacked?: boolean;
 }
 
-export declare type ChatDashboardChartConfig = ChatDashboardBarChartConfig | ChatDashboardLineChartConfig | ChatDashboardFunnelChartConfig | ChatDashboardRadarChartConfig | ChatDashboardPieChartConfig | ChatDashboardGaugeChartConfig | ChatDashboardHeatmapChartConfig;
+export declare type ChatDashboardChartConfig = ChatDashboardBarChartConfig | ChatDashboardLineChartConfig | ChatDashboardFunnelChartConfig | ChatDashboardRadarChartConfig | ChatDashboardPieChartConfig | ChatDashboardGaugeChartConfig | ChatDashboardHeatmapChartConfig | ChatDashboardScatterChartConfig;
 
 declare interface ChatDashboardChartConfigBase {
     showLegend?: boolean;
@@ -2814,7 +2814,7 @@ declare interface ChatDashboardChartConfigBase {
 export declare interface ChatDashboardChartItem extends ChatDashboardItemBase {
     type: "chart";
     chart: ChatDashboardChartConfig;
-    computation: ChartComputation | RadarComputation | PieComputation | GaugeComputation | HeatmapComputation;
+    computation: ChartComputation | RadarComputation | PieComputation | GaugeComputation | HeatmapComputation | ScatterComputation;
 }
 
 export declare interface ChatDashboardCollectionItem extends ChatDashboardItemBase {
@@ -3001,6 +3001,23 @@ export declare interface ChatDashboardRadarChartConfig extends ChatDashboardChar
     showArea?: boolean;
 }
 
+export declare interface ChatDashboardScatterChartConfig {
+    type: "scatter";
+    pointSize?: number;
+    scaleAxes?: boolean;
+    showGrid?: boolean;
+    /** Only rendered with 2+ series, but still needed so a skeleton can reserve for it. */
+    showLegend?: boolean;
+    /** What the X measure is, e.g. "salary" — labels the x row in the tooltip */
+    xAxisName?: string;
+    /** What the Y measure is, e.g. "tenure" — labels the y row in the tooltip */
+    yAxisName?: string;
+    /** Formats the Y measure */
+    valueFormat?: FormatPreset;
+    /** Formats the X measure, which is a second measure rather than a category */
+    xValueFormat?: FormatPreset;
+}
+
 export declare const ChatSpinner: ForwardRefExoticComponent<ChatSpinnerProps & RefAttributes<HTMLDivElement>>;
 
 declare interface ChatSpinnerProps {
@@ -3645,7 +3662,7 @@ export declare type DashboardCanvasContent = CanvasContentBase & {
  * Chart display configuration — discriminated on `type`.
  * This object is JSON-serializable (no functions, except optional formatters).
  */
-export declare type DashboardChartConfig = BarChartConfig | LineChartConfig | FunnelChartConfig | PieChartConfig | RadarChartConfig | GaugeChartConfig | HeatmapChartConfig;
+export declare type DashboardChartConfig = BarChartConfig | LineChartConfig | FunnelChartConfig | PieChartConfig | RadarChartConfig | GaugeChartConfig | HeatmapChartConfig | ScatterChartConfig;
 
 export declare interface DashboardChartData {
     /** Category axis labels. Required for bar/line charts. */
@@ -3663,6 +3680,12 @@ export declare interface DashboardChartData {
     };
     /** Heatmap data points as [xIndex, yIndex, value] tuples. */
     data?: [number, number, number][];
+    /**
+     * Scatter series — x/y pairs, optionally split into color groups. Kept on
+     * its own field rather than reusing `series` or `data` so shape detection
+     * can never confuse it with a bar/line series array or the heatmap grid.
+     */
+    scatterSeries?: F0DataChartScatterSeries[];
 }
 
 export declare interface DashboardChartItem<Filters extends FiltersDefinition = FiltersDefinition> extends DashboardItemBase {
@@ -8751,9 +8774,9 @@ export declare interface F0DataChartPieSeries {
  * Props for the F0DataChart component.
  *
  * A unified chart component that supports bar, line, funnel, pie, radar,
- * gauge, and heatmap chart types via a discriminated `type` prop.
+ * gauge, heatmap, and scatter chart types via a discriminated `type` prop.
  */
-export declare type F0DataChartProps = F0DataChartBarProps | F0DataChartLineProps | F0DataChartFunnelProps | F0DataChartPieProps | F0DataChartRadarProps | F0DataChartGaugeProps | F0DataChartHeatmapProps;
+export declare type F0DataChartProps = F0DataChartBarProps | F0DataChartLineProps | F0DataChartFunnelProps | F0DataChartPieProps | F0DataChartRadarProps | F0DataChartGaugeProps | F0DataChartHeatmapProps | F0DataChartScatterProps;
 
 /**
  * A radar chart indicator (axis/dimension).
@@ -8808,6 +8831,89 @@ export declare interface F0DataChartRadarSeries {
     color?: ChartColorToken;
 }
 
+/**
+ * A single point in a scatter series.
+ *
+ * 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.
+ */
+export declare type F0DataChartScatterDataPoint = [number, number] | {
+    /** Horizontal position, plotted on the value X axis */
+    x: number;
+    /** Vertical position, plotted on the value Y axis */
+    y: number;
+    /** Identity of this point, used as the tooltip header (e.g. "Ana Ruiz") */
+    label?: string;
+    /** Override color for this individual point. Must be an F0 design token name. */
+    color?: ChartColorToken;
+};
+
+/**
+ * Scatter chart variant props.
+ *
+ * Plots x/y pairs on two value axes to show the relationship between two
+ * measures. Unlike bar/line there is no category axis — both axes are
+ * continuous — so this interface is separate from `F0DataChartBaseProps`.
+ * Pass multiple `series` to color-split the points by a group dimension.
+ */
+export declare interface F0DataChartScatterProps extends F0DataChartCommonProps {
+    /** Chart type */
+    type: "scatter";
+    /** One or more point groups. Multiple series render as a color split. */
+    series: F0DataChartScatterSeries[];
+    /** Point diameter in pixels. @default 12 */
+    pointSize?: number;
+    /**
+     * Fit each axis to its data range instead of anchoring it at zero. Turn off
+     * to force both axes through the origin. @default true
+     */
+    scaleAxes?: boolean;
+    /** Show the legend below the chart. Only rendered with 2+ series. @default true */
+    showLegend?: boolean;
+    /** Show the background grid lines on both axes. @default true */
+    showGrid?: boolean;
+    /** Format the Y axis tick labels */
+    valueFormatter?: (value: number) => string;
+    /** Format the X axis tick labels */
+    xValueFormatter?: (value: number) => string;
+    /**
+     * Formatter for the y value shown in the hover tooltip. Defaults to
+     * {@link valueFormatter}, so a unit or a currency on the Y axis reads the same
+     * on hover, then to a plain localized number. Set it when the axis has to
+     * stay compact ("107.5K") but the tooltip should be exact ("107,505").
+     */
+    tooltipValueFormatter?: (value: number) => string;
+    /**
+     * Formatter for the x value shown in the hover tooltip. Same contract as
+     * {@link tooltipValueFormatter}, against {@link xValueFormatter}.
+     */
+    xTooltipValueFormatter?: (value: number) => string;
+    /**
+     * What the X measure is, e.g. "salary". Labels the x row in the tooltip —
+     * a scatter has no headline value, so both coordinates read as rows and
+     * need naming, the same way radar names its indicators.
+     */
+    xAxisName?: string;
+    /** What the Y measure is, e.g. "tenure". Labels the y row in the tooltip. */
+    yAxisName?: string;
+    /** Escape hatch: raw ECharts options merged (shallow) on top of the generated config */
+    echartsOptions?: Partial<echarts_2.EChartsOption>;
+}
+
+/**
+ * A group of points sharing a color and a legend entry. Use one series per
+ * group value to split a scatter by a dimension (e.g. one per department).
+ */
+export declare interface F0DataChartScatterSeries {
+    /** Display name used in legend and tooltip */
+    name: string;
+    /** Points in this group */
+    data: F0DataChartScatterDataPoint[];
+    /** Override color for this series. Must be an F0 design token name. Falls back to the theme palette. */
+    color?: ChartColorToken;
+}
+
 /**
  * F0 config options specific to date fields
  *
@@ -16287,6 +16393,53 @@ declare type SampleRatingQuestion = {
     maxLabel?: string;
 };
 
+export declare interface ScatterChartConfig {
+    type: "scatter";
+    /** Point diameter in pixels. @default 12 */
+    pointSize?: number;
+    /** Fit each axis to its data range instead of anchoring it at zero. @default true */
+    scaleAxes?: boolean;
+    /** Show the legend below the chart. Only rendered with 2+ series. @default true */
+    showLegend?: boolean;
+    /** Show the background grid lines. @default true */
+    showGrid?: boolean;
+    /** Format the Y axis tick labels */
+    valueFormatter?: (value: number) => string;
+    /** Format the X axis tick labels */
+    xValueFormatter?: (value: number) => string;
+    /** Format the y value in the tooltip, which shows full numbers */
+    tooltipValueFormatter?: (value: number) => string;
+    /** Format the x value in the tooltip, which shows full numbers */
+    xTooltipValueFormatter?: (value: number) => string;
+    /** What the X measure is, e.g. "salary" — labels the x row in the tooltip */
+    xAxisName?: string;
+    /** What the Y measure is, e.g. "tenure" — labels the y row in the tooltip */
+    yAxisName?: string;
+}
+
+/** Skeleton for scatter chart content area — points with no connecting path. */
+export declare function ScatterChartSkeleton({ showLegend, }?: ScatterChartSkeletonProps): JSX_2.Element;
+
+declare interface ScatterChartSkeletonProps {
+    /** Show the legend row below the plot. @default true */
+    showLegend?: boolean;
+}
+
+/**
+ * Both axes are measures, so there is no aggregation: a scatter plots one
+ * point per row rather than grouping rows into categories. `label` names the
+ * column identifying each point, and `series` the optional column that splits
+ * the points into colour groups.
+ */
+export declare interface ScatterComputation {
+    datasetId: string;
+    xAxis: string;
+    yAxis: string;
+    label?: string;
+    series?: string;
+    limit?: number;
+}
+
 export declare type SearchFilterDefinition = BaseFilterDefinition<"search">;
 
 declare type SearchOptions = {