@factorialco/f0-react 4.58.0 → 4.59.0

package/dist/experimental.d.ts

@@ -79,6 +79,7 @@ import { PieChartProps as PieChartProps_2 } from './experimental';
 import { PopoverProps } from '@radix-ui/react-popover';
 import { ProgressBarCellValue } from './types/progressBar';
 import { ProgressBarCellValue as ProgressBarCellValue_2 } from './experimental';
+import { ProgressSeriesCellValue } from './types/progressSeries';
 import { Props as Props_5 } from './types';
 import { PropsWithChildren } from 'react';
 import { Provider } from 'react';
@@ -3855,6 +3856,10 @@ declare const defaultTranslations: {
             readonly description: "Try a different date or fewer filters";
         };
     };
+    readonly progressSeries: {
+        readonly noData: "No data";
+        readonly canceled: "Canceled";
+    };
     readonly select: {
         readonly noResults: "No results found";
         readonly loadingMore: "Loading...";
@@ -5960,6 +5965,85 @@ export declare const F0NumberInput: ForwardRefExoticComponent<Omit<F0NumberInput
 
 export declare type F0NumberInputProps = Omit<NumberInputInternalProps, (typeof privateProps_4)[number]>;
 
+/**
+ * @experimental This is an experimental component, use it at your own risk.
+ */
+export declare const F0ProgressSeries: WithDataTestIdReturnType_2<ForwardRefExoticComponent<F0ProgressSeriesProps & RefAttributes<HTMLDivElement>>>;
+
+/**
+ * One progress bar in the series — e.g. a period (Q1, Jan, 2026…). Each bar is
+ * an independent progress bar (its own track + proportional fill), unlike a
+ * category bar where the segments are parts of a single whole.
+ */
+export declare interface F0ProgressSeriesBar {
+    /**
+     * Attained value. `undefined` (or a non-finite value / `max <= 0`) renders an
+     * empty/future bar: track only, no fill.
+     */
+    value: number | undefined;
+    /** Target. Defaults to 100. */
+    max?: number;
+    /**
+     * f0 chart color token for the fill. Defaults to `"categorical-1"`. Ignored
+     * when `canceled` is set.
+     */
+    color?: F0ProgressSeriesColor;
+    /** Renders a hatched grey bar (e.g. a cancelled period). */
+    canceled?: boolean;
+    /** Title shown under the bar (e.g. "Q1", "Jan", "2026"). Optional. */
+    label?: string;
+    /**
+     * Short text shown under the bar next to the label. Optional; defaults to the
+     * computed percentage (which may exceed 100%). Pass "" to hide it.
+     */
+    caption?: string;
+    /** Tooltip text. Defaults to `label · value / max (percentage)`. */
+    tooltip?: string;
+}
+
+export declare type F0ProgressSeriesColor = (typeof f0ProgressSeriesColors)[number];
+
+/**
+ * The `--chart-*` tokens `getColor` can resolve (see `f0-core`'s `base.css`).
+ * Same set as `F0SegmentedBar`'s `SegmentColorToken`; the two are not shared yet
+ * because `kits/F0DataChart` already owns the `ChartColorToken` name for a
+ * different palette (`baseColors`). Unifying them is tracked separately.
+ */
+export declare const f0ProgressSeriesColors: readonly ["categorical-1", "categorical-2", "categorical-3", "categorical-4", "categorical-5", "categorical-6", "categorical-7", "categorical-8", "feedback-positive", "feedback-neutral", "feedback-negative"];
+
+/** Shared by the component and the `progressSeries` value-display cell. */
+export declare interface F0ProgressSeriesOptions {
+    /** 1..N bars (N up to 12: half-yearly = 2, quarterly = 4, monthly = 12). */
+    bars: F0ProgressSeriesBar[];
+    /**
+     * Max labels rendered under the row. When there are more bars than this, the
+     * labels are spread evenly (e.g. 12 bars → indices 0, 3, 6, 9). Defaults to 4.
+     */
+    maxLabels?: number;
+    /** Hide the per-bar tooltips. */
+    hideTooltip?: boolean;
+    /**
+     * Formats `value`/`max` in the default tooltip — the component only knows raw
+     * numbers, so pass this to render currencies, separators, units…
+     * Defaults to `String(value)`.
+     */
+    formatValue?: (value: number) => string;
+    /**
+     * Renders a skeleton (same height as the loaded bar) instead of the series
+     * while the data is still loading.
+     */
+    loading?: boolean;
+}
+
+export declare interface F0ProgressSeriesProps extends F0ProgressSeriesOptions, WithDataTestIdProps {
+    /** Bar height. Defaults to `"md"`. */
+    size?: F0ProgressSeriesSize;
+}
+
+export declare type F0ProgressSeriesSize = (typeof f0ProgressSeriesSizes)[number];
+
+export declare const f0ProgressSeriesSizes: readonly ["sm", "md", "lg"];
+
 /**
  * @experimental This is an experimental component, use it at your own risk
  */
@@ -7224,7 +7308,7 @@ export declare type InfiniteScrollPaginatedResponse<TRecord> = BasePaginatedResp
  */
 export declare const Input: ForwardRefExoticComponent<Omit<F0TextInputProps, "ref"> & RefAttributes<HTMLInputElement>>;
 
-declare const Input_2: React_2.ForwardRefExoticComponent<Omit<React_2.InputHTMLAttributes<HTMLInputElement>, "onChange" | "size"> & Pick<InputFieldProps<string>, "label" | "onChange" | "size" | "icon" | "role" | "onFocus" | "onBlur" | "transparent" | "status" | "loading" | "disabled" | "maxLength" | "required" | "error" | "append" | "hideLabel" | "hint" | "labelIcon" | "onClickContent" | "readonly" | "clearable" | "autocomplete" | "onClear" | "isEmpty" | "emptyValue" | "hideMaxLength" | "appendTag" | "lengthProvider" | "buttonToggle"> & React_2.RefAttributes<HTMLInputElement>>;
+declare const Input_2: React_2.ForwardRefExoticComponent<Omit<React_2.InputHTMLAttributes<HTMLInputElement>, "onChange" | "size"> & Pick<InputFieldProps<string>, "label" | "onChange" | "size" | "icon" | "role" | "onFocus" | "onBlur" | "transparent" | "status" | "loading" | "disabled" | "maxLength" | "required" | "error" | "append" | "hideLabel" | "hint" | "isEmpty" | "labelIcon" | "onClickContent" | "readonly" | "clearable" | "autocomplete" | "onClear" | "emptyValue" | "hideMaxLength" | "appendTag" | "lengthProvider" | "buttonToggle"> & React_2.RefAttributes<HTMLInputElement>>;
 
 declare const INPUTFIELD_SIZES: readonly ["sm", "md"];
 
@@ -10938,6 +11022,7 @@ declare const valueDisplayRenderers: {
     readonly person: (args: PersonCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element;
     readonly percentage: (args: PercentageCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element | null;
     readonly progressBar: (args: ProgressBarCellValue, _meta: ValueDisplayRendererContext) => JSX_2.Element | null;
+    readonly progressSeries: (args: ProgressSeriesCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element;
     readonly barSeries: (args: BarSeriesCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element;
     readonly categoryBarChart: (args: CategoryBarChartCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element;
     readonly hourDistribution: (args: HourDistributionCellValue, meta: ValueDisplayRendererContext) => JSX_2.Element;