@gravitee/graphene-charts 2.48.1 → 2.49.0-json-schema-form-context.fc0a461

package/dist/charts/BreakdownChart/BarMeter.d.ts

@@ -0,0 +1,38 @@
+import { MetricTrend, MetricTrendSentiment } from '../Metric';
+import * as React from 'react';
+export interface BarMeterProps extends React.ComponentProps<'div'> {
+    /** Human-readable label. */
+    readonly label: string;
+    /** Pre-formatted display value (e.g. "$222.88", "57ms"). */
+    readonly formattedValue: string;
+    /** Fill ratio from 0 to 1. */
+    readonly ratio: number;
+    /** CSS color for the bar fill. */
+    readonly color: string;
+    /** Secondary text below the bar. */
+    readonly detail?: string;
+    /** Icon rendered before the label. */
+    readonly icon?: React.ComponentType<{
+        className?: string;
+    }>;
+    /** Variation indicator shown next to the value. */
+    readonly trend?: MetricTrend;
+    /** How to color the trend direction. @default 'higher-is-better' */
+    readonly trendSentiment?: MetricTrendSentiment;
+    /** Threshold marker position as a ratio (0–1) of the track width. */
+    readonly threshold?: number;
+    /** 1-based rank shown as a badge before the label. */
+    readonly rank?: number;
+    /** Reduce vertical spacing/padding for a denser layout. */
+    readonly compact?: boolean;
+    /** Animate the bar on mount. */
+    readonly animated?: boolean;
+    /** Whether this item is visually highlighted (hovered). */
+    readonly highlighted?: boolean;
+    /** Whether another item is highlighted (dims this one). */
+    readonly dimmed?: boolean;
+    /** Interactive — shows pointer cursor and hover effects. */
+    readonly interactive?: boolean;
+}
+export declare function BarMeter({ label, formattedValue, ratio, color, detail, icon: Icon, trend, trendSentiment, threshold, rank, compact, animated, highlighted, dimmed, interactive, className, ...rest }: BarMeterProps): React.JSX.Element;
+//# sourceMappingURL=BarMeter.d.ts.map

package/dist/charts/BreakdownChart/BarMeter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarMeter.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BarMeter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,WAAW,EAAE,oBAAoB,EAAqB,MAAM,WAAW,CAAC;AA6BtF,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAChE,4BAA4B;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,4DAA4D;IAC5D,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,8BAA8B;IAC9B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,kCAAkC;IAClC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,oCAAoC;IACpC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,sCAAsC;IACtC,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5D,mDAAmD;IACnD,QAAQ,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC;IAC7B,oEAAoE;IACpE,QAAQ,CAAC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IAC/C,qEAAqE;IACrE,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,sDAAsD;IACtD,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,gCAAgC;IAChC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,2DAA2D;IAC3D,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,2DAA2D;IAC3D,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B,4DAA4D;IAC5D,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,cAAc,EACd,KAAK,EACL,KAAK,EACL,MAAM,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EACL,cAAmC,EACnC,SAAS,EACT,IAAI,EACJ,OAAe,EACf,QAAe,EACf,WAAmB,EACnB,MAAc,EACd,WAAmB,EACnB,SAAS,EACT,GAAG,IAAI,EACR,EAAE,aAAa,qBA8Ff"}

package/dist/charts/BreakdownChart/BreakdownChart.d.ts

@@ -0,0 +1,12 @@
+import { BreakdownChartProps } from './breakdown-chart.types';
+import * as React from 'react';
+export interface BreakdownChartSkeletonProps extends React.ComponentProps<'div'> {
+    /** Number of skeleton rows. @default 3 */
+    readonly rows?: number;
+    /** Reduce vertical spacing/padding to match the compact layout. @default false */
+    readonly compact?: boolean;
+}
+declare function BreakdownChartSkeleton({ rows, compact, className, ...props }: BreakdownChartSkeletonProps): React.JSX.Element;
+export declare function BreakdownChart({ children, ...chartProps }: BreakdownChartProps): React.JSX.Element;
+export { BreakdownChartSkeleton };
+//# sourceMappingURL=BreakdownChart.d.ts.map

package/dist/charts/BreakdownChart/BreakdownChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreakdownChart.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BreakdownChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,mBAAmB,EAAuD,MAAM,yBAAyB,CAAC;AA0DxH,MAAM,WAAW,2BAA4B,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC9E,0CAA0C;IAC1C,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,kFAAkF;IAClF,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;CAC5B;AAID,iBAAS,sBAAsB,CAAC,EAAE,IAAQ,EAAE,OAAe,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,2BAA2B,qBAwB9G;AA0HD,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAAE,mBAAmB,qBAO9E;AAgQD,OAAO,EAAE,sBAAsB,EAAE,CAAC"}

package/dist/charts/BreakdownChart/BreakdownContext.d.ts

@@ -0,0 +1,37 @@
+import { BreakdownItem } from './breakdown-chart.types';
+import * as React from 'react';
+export interface BreakdownTooltipMeta {
+    readonly color: string;
+    readonly index: number;
+    readonly ratio: number;
+    /** Value pre-formatted by the chart's `formatValue` prop (e.g. "$222.88"). */
+    readonly formattedValue: string;
+}
+export type BreakdownTooltipRenderFn = (item: BreakdownItem, meta: BreakdownTooltipMeta) => React.ReactNode;
+interface BreakdownTooltipSlot {
+    content: BreakdownTooltipRenderFn;
+}
+interface BreakdownSlotsContextValue {
+    tooltip: BreakdownTooltipSlot | null;
+    legend: React.ReactNode | null;
+    summary: React.ReactNode | null;
+    setTooltip: (slot: BreakdownTooltipSlot | null) => void;
+    setLegend: (content: React.ReactNode | null) => void;
+    setSummary: (content: React.ReactNode | null) => void;
+}
+/**
+ * Reads the slots registered by `<BreakdownTooltip>`, `<BreakdownLegend>`,
+ * or `<BreakdownSummary>` for the nearest enclosing BreakdownChart.
+ * Returns a no-op fallback when used outside of a chart.
+ */
+export declare function useBreakdownSlots(): BreakdownSlotsContextValue;
+export interface BreakdownSlotsProviderProps {
+    children: React.ReactNode;
+}
+/**
+ * Wraps a BreakdownChart's render tree so that composition markers can
+ * register their content via `useLayoutEffect` before the browser paints.
+ */
+export declare function BreakdownSlotsProvider({ children }: BreakdownSlotsProviderProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=BreakdownContext.d.ts.map

package/dist/charts/BreakdownChart/BreakdownContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreakdownContext.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BreakdownContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAI7D,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,8EAA8E;IAC9E,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;CACjC;AAED,MAAM,MAAM,wBAAwB,GAAG,CAAC,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,oBAAoB,KAAK,KAAK,CAAC,SAAS,CAAC;AAE5G,UAAU,oBAAoB;IAC5B,OAAO,EAAE,wBAAwB,CAAC;CACnC;AAID,UAAU,0BAA0B;IAClC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACrC,MAAM,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;IAC/B,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;IAChC,UAAU,EAAE,CAAC,IAAI,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;IACxD,SAAS,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD,UAAU,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;CACvD;AAID;;;;GAIG;AACH,wBAAgB,iBAAiB,IAAI,0BAA0B,CAa9D;AAED,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,QAAQ,EAAE,EAAE,2BAA2B,qBAW/E"}

package/dist/charts/BreakdownChart/BreakdownLegend.d.ts

@@ -0,0 +1,15 @@
+import { BreakdownItem } from './breakdown-chart.types';
+import * as React from 'react';
+export interface BreakdownLegendProps {
+    readonly children: React.ReactNode;
+}
+declare function BreakdownLegend({ children }: BreakdownLegendProps): null;
+export interface BreakdownLegendContentProps extends React.ComponentProps<'div'> {
+    readonly items: readonly BreakdownItem[];
+    /** Resolved colors matching each item's index. */
+    readonly colors: readonly string[];
+    readonly formatValue?: (value: number) => string;
+}
+declare function BreakdownLegendContent({ items, colors, formatValue, className, ...props }: BreakdownLegendContentProps): React.JSX.Element;
+export { BreakdownLegend, BreakdownLegendContent };
+//# sourceMappingURL=BreakdownLegend.d.ts.map

package/dist/charts/BreakdownChart/BreakdownLegend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreakdownLegend.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BreakdownLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAM7D,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,iBAAS,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,oBAAoB,QAS1D;AAMD,MAAM,WAAW,2BAA4B,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC9E,QAAQ,CAAC,KAAK,EAAE,SAAS,aAAa,EAAE,CAAC;IACzC,kDAAkD;IAClD,QAAQ,CAAC,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IACnC,QAAQ,CAAC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAClD;AAED,iBAAS,sBAAsB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,2BAA2B,qBAkB/G;AAED,OAAO,EAAE,eAAe,EAAE,sBAAsB,EAAE,CAAC"}

package/dist/charts/BreakdownChart/BreakdownSummary.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface BreakdownSummaryProps {
+    readonly children: React.ReactNode;
+}
+declare function BreakdownSummary({ children }: BreakdownSummaryProps): null;
+export { BreakdownSummary };
+//# sourceMappingURL=BreakdownSummary.d.ts.map

package/dist/charts/BreakdownChart/BreakdownSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreakdownSummary.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BreakdownSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE,qBAAqB,QAS5D;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/charts/BreakdownChart/BreakdownTooltip.d.ts

@@ -0,0 +1,58 @@
+import { BreakdownTooltipMeta, BreakdownTooltipRenderFn } from './BreakdownContext';
+import { BreakdownItem } from './breakdown-chart.types';
+import * as React from 'react';
+export interface BreakdownTooltipProps {
+    /**
+     * Tooltip content — either a React element (auto-injected with `item` and
+     * `meta` props via `cloneElement`, like `ChartTooltip`) or a render function
+     * receiving the hovered item and its visual metadata for full control.
+     */
+    readonly content: React.ReactElement | BreakdownTooltipRenderFn;
+}
+declare function BreakdownTooltip({ content }: BreakdownTooltipProps): null;
+export interface BreakdownTooltipPortalProps {
+    readonly pos: {
+        x: number;
+        y: number;
+    };
+    readonly containerRef: React.RefObject<HTMLDivElement | null>;
+    readonly children: React.ReactNode;
+}
+declare function BreakdownTooltipPortal({ pos, containerRef, children }: BreakdownTooltipPortalProps): React.ReactPortal;
+export interface BreakdownTooltipItem {
+    readonly name: string;
+    readonly value: number | string;
+    readonly color?: string;
+}
+export interface BreakdownTooltipContentProps extends React.ComponentProps<'div'> {
+    /**
+     * Hovered breakdown item — injected automatically by the chart in element
+     * mode. When present (and `items` is not provided), `BreakdownTooltipContent`
+     * auto-populates from this item's data.
+     */
+    readonly item?: BreakdownItem;
+    /**
+     * Visual metadata (color, index, ratio) — injected alongside `item` in
+     * element mode.
+     */
+    readonly meta?: BreakdownTooltipMeta;
+    /** Title shown at the top of the tooltip (e.g. the hovered item's label). */
+    readonly label?: string;
+    /** Sub-items to display (e.g. status-code breakdown for the hovered endpoint). */
+    readonly items?: readonly BreakdownTooltipItem[];
+    /** Hide the label row. @default false */
+    readonly hideLabel?: boolean;
+    /** Hide the color indicator next to each sub-item. */
+    readonly hideIndicator?: boolean;
+    /** Visual style of the indicator. @default 'dot' */
+    readonly indicator?: 'dot' | 'line';
+    /** Format each sub-item's value. Defaults to `.toLocaleString()` for numbers. */
+    readonly valueFormatter?: (value: number | string) => React.ReactNode;
+    /** Show a summed total row below the sub-items. */
+    readonly showTotal?: boolean;
+    /** Label for the total row. @default "Total" */
+    readonly totalLabel?: string;
+}
+declare function BreakdownTooltipContent({ item, meta, label: labelProp, items: itemsProp, hideLabel: hideLabelProp, hideIndicator, indicator, valueFormatter, showTotal, totalLabel, className, ...props }: BreakdownTooltipContentProps): React.JSX.Element | null;
+export { BreakdownTooltip, BreakdownTooltipContent, BreakdownTooltipPortal };
+//# sourceMappingURL=BreakdownTooltip.d.ts.map

package/dist/charts/BreakdownChart/BreakdownTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreakdownTooltip.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/BreakdownTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AACzF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAY7D,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAG,wBAAwB,CAAC;CACjE;AAED,iBAAS,gBAAgB,CAAC,EAAE,OAAO,EAAE,EAAE,qBAAqB,QAc3D;AAMD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,CAAC,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC9D,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,iBAAS,sBAAsB,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,2BAA2B,qBAgD3F;AAMD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,4BAA6B,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC/E;;;;OAIG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,oBAAoB,CAAC;IACrC,6EAA6E;IAC7E,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,kFAAkF;IAClF,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,oBAAoB,EAAE,CAAC;IACjD,yCAAyC;IACzC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,sDAAsD;IACtD,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,oDAAoD;IACpD,QAAQ,CAAC,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACpC,iFAAiF;IACjF,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IACtE,mDAAmD;IACnD,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,gDAAgD;IAChD,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;CAC9B;AAMD,iBAAS,uBAAuB,CAAC,EAC/B,IAAI,EACJ,IAAI,EACJ,KAAK,EAAE,SAAS,EAChB,KAAK,EAAE,SAAS,EAChB,SAAS,EAAE,aAAa,EACxB,aAAqB,EACrB,SAAiB,EACjB,cAAsC,EACtC,SAAiB,EACjB,UAAoB,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,4BAA4B,4BAmD9B;AAED,OAAO,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,CAAC"}

package/dist/charts/BreakdownChart/breakdown-chart.types.d.ts

@@ -0,0 +1,110 @@
+import { ChartState } from '../../types';
+import { MetricTrend, MetricTrendSentiment } from '../Metric';
+import type * as React from 'react';
+export interface BreakdownItem {
+    /** Unique identifier used as React key. */
+    readonly key: string;
+    /** Human-readable label. */
+    readonly label: string;
+    /** Numeric value driving the bar width and display. */
+    readonly value: number;
+    /** Secondary text below the bar (e.g. "938 requests"). */
+    readonly detail?: string;
+    /** CSS color override. When omitted, auto-assigned from the chart palette. */
+    readonly color?: string;
+    /** Icon component rendered before the label. */
+    readonly icon?: React.ComponentType<{
+        className?: string;
+    }>;
+    /** Period-over-period variation shown next to the value (chevron + %). */
+    readonly trend?: MetricTrend;
+    /**
+     * Threshold marker drawn as a vertical line over the bar, expressed as a
+     * ratio (0–1) of the full track width (e.g. `0.8` for an 80% quota target).
+     * Track-relative so it is independent of `ratioMode`. List variant only.
+     */
+    readonly threshold?: number;
+    /**
+     * Explicit ratio (0–1) used only when `ratioMode="explicit"`.
+     * Ignored for other ratio modes.
+     */
+    readonly ratio?: number;
+}
+export interface BreakdownSummary {
+    /** Label for the summary row (e.g. "Total cost"). */
+    readonly label: string;
+    /** Pre-formatted value (e.g. "$318.40"). */
+    readonly value: string;
+}
+export type BreakdownVariant = 'list' | 'stacked';
+/**
+ * Controls how individual bar widths are computed.
+ * - `total`    — each bar proportional to the sum of all values (default).
+ * - `max`      — each bar proportional to the highest value.
+ * - `explicit` — consumer provides `ratio` (0–1) per item.
+ */
+export type BreakdownRatioMode = 'total' | 'max' | 'explicit';
+export interface BreakdownChartProps extends React.ComponentProps<'div'> {
+    /** Data items to render. */
+    readonly items: readonly BreakdownItem[];
+    /** Visual variant. @default 'list' */
+    readonly variant?: BreakdownVariant;
+    /** Ratio computation strategy. @default 'total' */
+    readonly ratioMode?: BreakdownRatioMode;
+    /** Custom value formatter. Receives the raw numeric value. */
+    readonly formatValue?: (value: number) => string;
+    /**
+     * How to interpret per-item `trend` direction for coloring.
+     * - `'higher-is-better'` (default): up = green, down = red.
+     * - `'lower-is-better'`: up = red, down = green (e.g. latency, error rate).
+     * - `'neutral'`: always gray.
+     */
+    readonly trendSentiment?: MetricTrendSentiment;
+    /**
+     * Sort items by value before rendering.
+     * - `'desc'` — highest first (typical for top-N leaderboards).
+     * - `'asc'`  — lowest first.
+     * When omitted, the consumer's order is preserved.
+     */
+    readonly sortByValue?: 'asc' | 'desc';
+    /**
+     * Show a rank badge (#1, #2…) before each item, numbered by display order
+     * (after sorting, if `sortByValue` is set).
+     */
+    readonly showRank?: boolean;
+    /** Optional summary row rendered below the items. */
+    readonly summary?: BreakdownSummary;
+    /**
+     * Maximum visible items before collapsing with "N others".
+     * When omitted, all items are shown.
+     */
+    readonly maxItems?: number;
+    /** Animate bar fill on mount. @default true */
+    readonly animated?: boolean;
+    /** Reduce vertical spacing and padding between rows for a denser layout. @default false */
+    readonly compact?: boolean;
+    /**
+     * Highlight the hovered item and dim the others on mouse-over.
+     * Set to `false` for static, presentation-only rendering.
+     * The `onItemHover` callback still fires regardless. @default true
+     */
+    readonly highlightOnHover?: boolean;
+    /**
+     * Lifecycle state. When omitted, inferred from `items.length`:
+     * empty array → `'empty'`, otherwise → `'ready'`.
+     */
+    readonly state?: ChartState;
+    /**
+     * Number of skeleton rows rendered in the loading state. Set this to the
+     * expected item count so the placeholder matches the eventual layout.
+     * @default 3
+     */
+    readonly skeletonRows?: number;
+    /** Accessible label for the chart region. */
+    readonly ariaLabel?: string;
+    /** Called when an item is clicked. */
+    readonly onItemClick?: (item: BreakdownItem) => void;
+    /** Called when hovering an item. */
+    readonly onItemHover?: (item: BreakdownItem | null) => void;
+}
+//# sourceMappingURL=breakdown-chart.types.d.ts.map

package/dist/charts/BreakdownChart/breakdown-chart.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-chart.types.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/breakdown-chart.types.ts"],"names":[],"mappings":"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"}

package/dist/charts/BreakdownChart/index.d.ts

@@ -0,0 +1,13 @@
+export { BreakdownChart, BreakdownChartSkeleton } from './BreakdownChart';
+export type { BreakdownChartSkeletonProps } from './BreakdownChart';
+export { BarMeter } from './BarMeter';
+export type { BarMeterProps } from './BarMeter';
+export { BreakdownTooltip, BreakdownTooltipContent } from './BreakdownTooltip';
+export type { BreakdownTooltipContentProps, BreakdownTooltipItem, BreakdownTooltipProps } from './BreakdownTooltip';
+export { BreakdownLegend, BreakdownLegendContent } from './BreakdownLegend';
+export type { BreakdownLegendContentProps, BreakdownLegendProps } from './BreakdownLegend';
+export { BreakdownSummary } from './BreakdownSummary';
+export type { BreakdownSummaryProps } from './BreakdownSummary';
+export type { BreakdownTooltipMeta, BreakdownTooltipRenderFn } from './BreakdownContext';
+export type { BreakdownChartProps, BreakdownItem, BreakdownRatioMode, BreakdownSummary as BreakdownSummaryData, BreakdownVariant, } from './breakdown-chart.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/charts/BreakdownChart/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/charts/BreakdownChart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1E,YAAY,EAAE,2BAA2B,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAC/E,YAAY,EAAE,4BAA4B,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AACpH,OAAO,EAAE,eAAe,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC;AAC5E,YAAY,EAAE,2BAA2B,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AACzF,YAAY,EACV,mBAAmB,EACnB,aAAa,EACb,kBAAkB,EAClB,gBAAgB,IAAI,oBAAoB,EACxC,gBAAgB,GACjB,MAAM,yBAAyB,CAAC"}

package/dist/index.d.ts

@@ -27,4 +27,5 @@ export * from './charts/MetricGroup';
 export * from './charts/LineChart';
 export * from './charts/AreaChart';
 export * from './charts/TraceWaterfall';
+export * from './charts/BreakdownChart';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGvD,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AAGnC,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,YAAY,IAAI,KAAK,EAAE,SAAS,IAAI,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACvG,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAG3D,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGvD,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AAGnC,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,YAAY,IAAI,KAAK,EAAE,SAAS,IAAI,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACvG,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAG3D,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC"}