@plenustech/design-system 0.2.1 → 0.2.3

package/dist/types/components/actions/ButtonIcon/ButtonIcon.d.ts

@@ -0,0 +1,12 @@
+import type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';
+import { type ButtonSize, type ButtonVariant } from '../Button/index.js';
+export interface ButtonIconProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'aria-label' | 'children'> {
+    icon: ReactNode;
+    /** Nome do botao: o leitor de tela o ouve, e a dica o mostra a quem passa o ponteiro ou chega pelo teclado. */
+    label: string;
+    ref?: Ref<HTMLButtonElement>;
+    size?: ButtonSize;
+    /** `secondary` por padrao: um quadrado na cor principal chamaria mais atencao do que uma acao de icone pede. */
+    variant?: ButtonVariant;
+}
+export declare function ButtonIcon({ className, icon, label, size, variant, ...props }: ButtonIconProps): import("react").JSX.Element;

package/dist/types/components/actions/ButtonIcon/index.d.ts

@@ -0,0 +1,2 @@
+export { ButtonIcon } from './ButtonIcon.js';
+export type { ButtonIconProps } from './ButtonIcon.js';

package/dist/types/components/actions/ButtonTile/ButtonTile.d.ts

@@ -0,0 +1,14 @@
+import type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';
+export type ButtonTileSize = 'sm' | 'md';
+export interface ButtonTileProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'aria-label' | 'aria-pressed' | 'children'> {
+    /** Mostrada como dica no foco e no ponteiro, e ligada ao botão por `aria-describedby`. */
+    description?: string;
+    icon: ReactNode;
+    /** Texto visível e nome do botão. */
+    label: string;
+    ref?: Ref<HTMLButtonElement>;
+    /** Para o ladrilho que alterna: vira `aria-pressed`. Sem ele, o ladrilho é um botão comum. */
+    selected?: boolean;
+    size?: ButtonTileSize;
+}
+export declare function ButtonTile({ className, description, icon, label, selected, size, type, ...props }: ButtonTileProps): import("react").JSX.Element;

package/dist/types/components/actions/ButtonTile/index.d.ts

@@ -0,0 +1,2 @@
+export { ButtonTile } from './ButtonTile.js';
+export type { ButtonTileProps, ButtonTileSize } from './ButtonTile.js';

package/dist/types/components/actions/Toolbar/Toolbar.d.ts

@@ -0,0 +1,27 @@
+import { type ComponentPropsWithRef, type ReactNode, type RefObject } from 'react';
+import type { PopoverPlacement } from '../../overlays/Popover/index.js';
+export type ToolbarOrientation = 'horizontal' | 'vertical';
+export type ToolbarAppearance = 'floating' | 'flat';
+export type ToolbarPlacement = PopoverPlacement;
+export interface ToolbarProps extends Omit<ComponentPropsWithRef<'div'>, 'aria-label' | 'role'> {
+    /** A barra flutua ancorada a este elemento, num portal, sem tirar o foco de quem o tem. */
+    anchorRef?: RefObject<HTMLElement | null>;
+    appearance?: ToolbarAppearance;
+    children: ReactNode;
+    label: string;
+    orientation?: ToolbarOrientation;
+    placement?: ToolbarPlacement;
+    /** Gruda a barra no topo da área que rola. Vale para a barra no fluxo, sem `anchorRef`. */
+    sticky?: boolean;
+}
+export declare function Toolbar({ anchorRef, placement, ...props }: ToolbarProps): import("react").JSX.Element | null;
+export declare namespace Toolbar {
+    var Group: typeof ToolbarGroup;
+}
+export interface ToolbarGroupProps extends Omit<ComponentPropsWithRef<'div'>, 'aria-label' | 'role'> {
+    children: ReactNode;
+    /** Nome do grupo, quando os botões dele formam um conjunto, como os alinhamentos. */
+    label?: string;
+}
+declare function ToolbarGroup({ className, label, ...props }: ToolbarGroupProps): import("react").JSX.Element;
+export {};

package/dist/types/components/actions/Toolbar/index.d.ts

@@ -0,0 +1,2 @@
+export { Toolbar } from './Toolbar.js';
+export type { ToolbarAppearance, ToolbarGroupProps, ToolbarOrientation, ToolbarPlacement, ToolbarProps } from './Toolbar.js';

package/dist/types/components/charts/ChartArea/ChartArea.d.ts

@@ -1,4 +1,4 @@
-import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition, type MarkVisibility } from '../core/index.js';
 import { type SeriesAppearance } from '../palette/index.js';
 export interface ChartAreaSeries extends SeriesAppearance {
     label: string;
@@ -10,6 +10,8 @@ export interface ChartAreaProps {
     curve?: ChartCurve;
     defaultHiddenSeries?: readonly string[];
     emptyMessage?: string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     /**
      * Inclui o zero no dominio do eixo de valor. Ligado por padrao, porque marca
@@ -23,13 +25,22 @@ export interface ChartAreaProps {
     legend?: ChartLegendPosition;
     legendAlign?: ChartLegendAlign;
     onHiddenSeriesChange?: (hidden: readonly string[]) => void;
+    /** Indice da categoria mais proxima do ponteiro, ou `null` ao sair. */
+    onHoverCategory?: (index: number | null) => void;
     series: readonly ChartAreaSeries[];
-    showDataLabels?: boolean;
-    showDots?: boolean;
+    /** Valor acima de cada ponto: sempre, nunca, ou so os da serie mais proxima do ponteiro. */
+    showDataLabels?: MarkVisibility;
+    /** Pontos de cada valor: sempre, nunca, ou so os da serie mais proxima do ponteiro. */
+    showDots?: MarkVisibility;
+    /**
+     * Balao com as series da categoria mais proxima do ponteiro. Desligue para montar o proprio
+     * `ChartTooltip` pela costura; sem balao nem costura, o ponto volta a ter o `<title>`.
+     */
+    showTooltip?: boolean;
     stacked?: boolean;
     title: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
     yAxisRight?: AxisVisibility;
 }
-export declare function ChartArea({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatValue, height, includeZero, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, series, showDataLabels, showDots, stacked, title, xAxis, yAxis, yAxisRight, }: ChartAreaProps): import("react").JSX.Element;
+export declare function ChartArea({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatTooltipValue, formatValue, height, includeZero, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, series, showDataLabels, showDots, showTooltip, stacked, title, xAxis, yAxis, yAxisRight, }: ChartAreaProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartBar/ChartBar.d.ts

@@ -1,4 +1,4 @@
-import { type AxisLabelAngle, type AxisVisibility, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type AxisLabelAngle, type AxisVisibility, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition, type MarkVisibility } from '../core/index.js';
 import { type SeriesAppearance } from '../palette/index.js';
 export type ChartBarOrientation = 'vertical' | 'horizontal';
 export interface ChartBarSeries extends SeriesAppearance {
@@ -10,6 +10,8 @@ export interface ChartBarProps {
     categories: readonly string[];
     defaultHiddenSeries?: readonly string[];
     emptyMessage?: string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenSeries?: readonly string[];
@@ -21,12 +23,17 @@ export interface ChartBarProps {
     onHoverCategory?: (index: number | null) => void;
     orientation?: ChartBarOrientation;
     series: readonly ChartBarSeries[];
-    /** Valor alem da ponta de cada barra; empilhada, o total da categoria alem da ponta da pilha. */
-    showDataLabels?: boolean;
+    /**
+     * Valor alem da ponta de cada barra; empilhada, o total da categoria alem da ponta da pilha. Em `onHover`,
+     * so os da serie da barra sob o ponteiro, ou o total da pilha sob ele.
+     */
+    showDataLabels?: MarkVisibility;
+    /** Balao com o detalhe do que esta sob o ponteiro. Desligue para montar o proprio `ChartTooltip` pela costura. */
+    showTooltip?: boolean;
     stacked?: boolean;
     title: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
     yAxisRight?: AxisVisibility;
 }
-export declare function ChartBar({ accent, categories, defaultHiddenSeries, emptyMessage, formatValue, height, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, orientation, series, showDataLabels, stacked, title, xAxis, yAxis, yAxisRight, }: ChartBarProps): import("react").JSX.Element;
+export declare function ChartBar({ accent, categories, defaultHiddenSeries, emptyMessage, formatTooltipValue, formatValue, height, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, orientation, series, showDataLabels, showTooltip, stacked, title, xAxis, yAxis, yAxisRight, }: ChartBarProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartCombo/ChartCombo.d.ts

@@ -1,4 +1,4 @@
-import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition, type MarkVisibility } from '../core/index.js';
 import { type SeriesAppearance } from '../palette/index.js';
 export type ChartComboKind = 'bar' | 'line';
 /**
@@ -19,6 +19,11 @@ export interface ChartComboProps {
     defaultHiddenSeries?: readonly string[];
     emptyMessage?: string;
     formatRightValue?: (value: number) => string;
+    /**
+     * Formato no balao das series da esquerda. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o
+     * balao, exato. As da direita seguem `formatRightValue`.
+     */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenSeries?: readonly string[];
@@ -29,8 +34,15 @@ export interface ChartComboProps {
     /** Indice da categoria sob o ponteiro, ou `null` ao sair dela. */
     onHoverCategory?: (index: number | null) => void;
     series: readonly ChartComboSeries[];
-    showDataLabels?: boolean;
-    showDots?: boolean;
+    /**
+     * Valor de cada barra e de cada ponto. Em `onHover`, nas barras os da serie da barra sob o ponteiro; nas
+     * linhas, que nao tem alvo proprio, os da categoria sob o ponteiro.
+     */
+    showDataLabels?: MarkVisibility;
+    /** Pontos das linhas. Em `onHover`, os da categoria sob o ponteiro. */
+    showDots?: MarkVisibility;
+    /** Balao com as series da categoria sob o ponteiro, cada uma no formato do seu eixo. Desligue para montar o proprio `ChartTooltip`. */
+    showTooltip?: boolean;
     title: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
@@ -41,4 +53,4 @@ export interface ChartComboProps {
  * eixo de valor pertence; sem nenhuma a direita, o dominio e unico e o eixo
  * direito espelha o esquerdo.
  */
-export declare function ChartCombo({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatRightValue, formatValue, height, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, series, showDataLabels, showDots, title, xAxis, yAxis, yAxisRight, }: ChartComboProps): import("react").JSX.Element;
+export declare function ChartCombo({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatRightValue, formatTooltipValue, formatValue, height, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, series, showDataLabels, showTooltip, showDots, title, xAxis, yAxis, yAxisRight, }: ChartComboProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartDonut/ChartDonut.d.ts

@@ -7,6 +7,8 @@ export interface ChartDonutProps {
     defaultHiddenSlices?: readonly string[];
     emptyMessage?: string;
     formatPercent?: (ratio: number) => string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenSlices?: readonly string[];
@@ -21,6 +23,8 @@ export interface ChartDonutProps {
     sliceRadius?: number;
     showCenter?: boolean;
     showLegendValues?: boolean;
+    /** Balao com a fatia sob o ponteiro, o valor e a parte do total. Desligue para montar o proprio `ChartTooltip`. */
+    showTooltip?: boolean;
     slices: readonly ChartSlice[];
     /** Fracao do total abaixo da qual a fatia entra no agrupamento. */
     smallSliceThreshold?: number;
@@ -28,4 +32,4 @@ export interface ChartDonutProps {
     thickness?: number;
     title: string;
 }
-export declare function ChartDonut({ accent, centerLabel, defaultHiddenSlices, emptyMessage, formatPercent, formatValue, height, hiddenSlices, legend, legendAlign, onHiddenSlicesChange, onHoverSlice, otherLabel, showCenter, showLegendValues, sliceRadius, slices, smallSliceThreshold, thickness, title, }: ChartDonutProps): import("react").JSX.Element;
+export declare function ChartDonut({ accent, centerLabel, defaultHiddenSlices, emptyMessage, formatPercent, formatTooltipValue, formatValue, height, hiddenSlices, legend, legendAlign, onHiddenSlicesChange, onHoverSlice, otherLabel, showCenter, showLegendValues, showTooltip, sliceRadius, slices, smallSliceThreshold, thickness, title, }: ChartDonutProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartLine/ChartLine.d.ts

@@ -1,4 +1,4 @@
-import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type AxisLabelAngle, type AxisVisibility, type ChartCurve, type ChartHeight, type ChartLegendAlign, type ChartLegendPosition, type MarkVisibility } from '../core/index.js';
 import { type SeriesAppearance } from '../palette/index.js';
 export interface ChartLineSeries extends SeriesAppearance {
     label: string;
@@ -10,6 +10,8 @@ export interface ChartLineProps {
     curve?: ChartCurve;
     defaultHiddenSeries?: readonly string[];
     emptyMessage?: string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     /**
      * Inclui o zero no dominio do eixo de valor. Ligado por padrao, porque marca
@@ -23,12 +25,21 @@ export interface ChartLineProps {
     legend?: ChartLegendPosition;
     legendAlign?: ChartLegendAlign;
     onHiddenSeriesChange?: (hidden: readonly string[]) => void;
+    /** Indice da categoria mais proxima do ponteiro, ou `null` ao sair. */
+    onHoverCategory?: (index: number | null) => void;
     series: readonly ChartLineSeries[];
-    showDataLabels?: boolean;
-    showDots?: boolean;
+    /** Valor acima de cada ponto: sempre, nunca, ou so os da serie mais proxima do ponteiro. */
+    showDataLabels?: MarkVisibility;
+    /** Pontos de cada valor: sempre, nunca, ou so os da serie mais proxima do ponteiro. */
+    showDots?: MarkVisibility;
+    /**
+     * Balao com as series da categoria mais proxima do ponteiro. Desligue para montar o proprio
+     * `ChartTooltip` pela costura; sem balao nem costura, o ponto volta a ter o `<title>`.
+     */
+    showTooltip?: boolean;
     title: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
     yAxisRight?: AxisVisibility;
 }
-export declare function ChartLine({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatValue, height, includeZero, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, series, showDataLabels, showDots, title, xAxis, yAxis, yAxisRight, }: ChartLineProps): import("react").JSX.Element;
+export declare function ChartLine({ accent, categories, curve, defaultHiddenSeries, emptyMessage, formatTooltipValue, formatValue, height, includeZero, hiddenSeries, labelAngle, legend, legendAlign, onHiddenSeriesChange, onHoverCategory, series, showDataLabels, showDots, showTooltip, title, xAxis, yAxis, yAxisRight, }: ChartLineProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartPie/ChartPie.d.ts

@@ -5,6 +5,8 @@ export interface ChartPieProps {
     defaultHiddenSlices?: readonly string[];
     emptyMessage?: string;
     formatPercent?: (ratio: number) => string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenSlices?: readonly string[];
@@ -17,6 +19,8 @@ export interface ChartPieProps {
     otherLabel?: string;
     showDataLabels?: boolean;
     showLegendValues?: boolean;
+    /** Balao com a fatia sob o ponteiro, o valor e a parte do total. Desligue para montar o proprio `ChartTooltip`. */
+    showTooltip?: boolean;
     /** Raio dos cantos de cada fatia. Sem valor, o token de raio pequeno. */
     sliceRadius?: number;
     slices: readonly ChartSlice[];
@@ -24,4 +28,4 @@ export interface ChartPieProps {
     smallSliceThreshold?: number;
     title: string;
 }
-export declare function ChartPie({ accent, defaultHiddenSlices, emptyMessage, formatPercent, formatValue, height, hiddenSlices, legend, legendAlign, onHiddenSlicesChange, onHoverSlice, otherLabel, showDataLabels, showLegendValues, sliceRadius, slices, smallSliceThreshold, title, }: ChartPieProps): import("react").JSX.Element;
+export declare function ChartPie({ accent, defaultHiddenSlices, emptyMessage, formatPercent, formatTooltipValue, formatValue, height, hiddenSlices, legend, legendAlign, onHiddenSlicesChange, onHoverSlice, otherLabel, showDataLabels, showLegendValues, showTooltip, sliceRadius, slices, smallSliceThreshold, title, }: ChartPieProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartRadial/ChartRadial.d.ts

@@ -14,6 +14,8 @@ export interface ChartRadialProps {
     emptyMessage?: string;
     /** Angulo final da volta, em graus a partir do topo. Meia-lua usa 180. */
     endAngle?: number;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenTracks?: readonly string[];
@@ -22,6 +24,8 @@ export interface ChartRadialProps {
     onHiddenTracksChange?: (hidden: readonly string[]) => void;
     /** Valor no centro. Ele reserva o proprio espaco, ate metade do raio: com muitos aneis, quem cede e a espessura deles. */
     showCenter?: boolean;
+    /** Balao com o detalhe do que esta sob o ponteiro. Desligue para nao mostrar nada alem do `<title>` nativo. */
+    showTooltip?: boolean;
     startAngle?: number;
     /** Raio das pontas do arco. Sem valor, o token de raio pequeno. */
     trackRadius?: number;
@@ -30,4 +34,4 @@ export interface ChartRadialProps {
     title: string;
     tracks: readonly ChartRadialTrack[];
 }
-export declare function ChartRadial({ accent, centerLabel, defaultHiddenTracks, emptyMessage, endAngle, formatValue, height, hiddenTracks, legend, legendAlign, onHiddenTracksChange, showCenter, startAngle, thickness, trackRadius, title, tracks, }: ChartRadialProps): import("react").JSX.Element;
+export declare function ChartRadial({ accent, centerLabel, defaultHiddenTracks, emptyMessage, endAngle, formatTooltipValue, formatValue, height, hiddenTracks, legend, legendAlign, onHiddenTracksChange, showCenter, showTooltip, startAngle, thickness, trackRadius, title, tracks, }: ChartRadialProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartSankey/ChartSankey.d.ts

@@ -26,6 +26,8 @@ export interface ChartSankeyProps {
     flowColor?: ChartSankeyFlowColor;
     flowValuePosition?: ChartSankeyFlowValuePosition;
     flows: readonly ChartSankeyFlow[];
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     nodeAlign?: ChartSankeyAlign;
@@ -36,6 +38,8 @@ export interface ChartSankeyProps {
     nodeWidth?: number;
     showFlowValues?: boolean;
     showLabels?: boolean;
+    /** Balao com o detalhe do que esta sob o ponteiro. Desligue para nao mostrar nada alem do `<title>` nativo. */
+    showTooltip?: boolean;
     title: string;
 }
-export declare function ChartSankey({ accent, cyclicMessage, emptyMessage, flowColor, flowValuePosition, flows, formatValue, height, nodeAlign, nodes, nodePadding, nodeWidth, showFlowValues, showLabels, title, }: ChartSankeyProps): import("react").JSX.Element;
+export declare function ChartSankey({ accent, cyclicMessage, emptyMessage, flowColor, flowValuePosition, flows, formatTooltipValue, formatValue, height, nodeAlign, nodes, nodePadding, nodeWidth, showFlowValues, showLabels, showTooltip, title, }: ChartSankeyProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartScatter/ChartScatter.d.ts

@@ -29,9 +29,15 @@ export interface ChartScatterProps {
     legendAlign?: ChartLegendAlign;
     onHiddenSeriesChange?: (hidden: readonly string[]) => void;
     series: readonly ChartScatterSeries[];
+    /** Balao com o detalhe do que esta sob o ponteiro. Desligue para nao mostrar nada alem do `<title>` nativo. */
+    showTooltip?: boolean;
     title: string;
+    /** Nome de cada medida no balao. */
+    xLabel?: string;
+    yLabel?: string;
+    zLabel?: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
     yAxisRight?: AxisVisibility;
 }
-export declare function ChartScatter({ accent, defaultHiddenSeries, emptyMessage, formatX, formatY, formatZ, height, includeZero, hiddenSeries, legend, legendAlign, onHiddenSeriesChange, series, title, xAxis, yAxis, yAxisRight, }: ChartScatterProps): import("react").JSX.Element;
+export declare function ChartScatter({ accent, defaultHiddenSeries, emptyMessage, formatX, formatY, formatZ, height, includeZero, hiddenSeries, legend, legendAlign, onHiddenSeriesChange, series, showTooltip, title, xLabel, yLabel, zLabel, xAxis, yAxis, yAxisRight, }: ChartScatterProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartSunburst/ChartSunburst.d.ts

@@ -1,4 +1,4 @@
-import { type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type ChartHeight, type ChartHoveredNode, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
 import { type SeriesAppearance } from '../palette/index.js';
 export interface ChartSunburstNode extends SeriesAppearance {
     children?: readonly ChartSunburstNode[];
@@ -10,6 +10,8 @@ export interface ChartSunburstProps {
     defaultHiddenGroups?: readonly string[];
     emptyMessage?: string;
     formatPercent?: (ratio: number) => string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     hiddenGroups?: readonly string[];
@@ -17,11 +19,18 @@ export interface ChartSunburstProps {
     legendAlign?: ChartLegendAlign;
     nodes: readonly ChartSunburstNode[];
     onHiddenGroupsChange?: (hidden: readonly string[]) => void;
+    /** Caminho ate o no sob o ponteiro, do grupo ao no, cada nivel com o valor somado, ou `null` ao sair. */
+    onHoverNode?: (path: readonly ChartHoveredNode[] | null) => void;
     /** Folga entre dois aneis vizinhos. */
     ringGap?: number;
     /** Raio das pontas de cada arco. Sem valor, o token de raio pequeno. */
     sliceRadius?: number;
     showLabels?: boolean;
+    /**
+     * Balao com o caminho ate o no sob o ponteiro. Desligue para montar o proprio `ChartTooltip`
+     * pela costura; sem balao nem costura, o no volta a ter o `<title>`.
+     */
+    showTooltip?: boolean;
     title: string;
 }
-export declare function ChartSunburst({ accent, defaultHiddenGroups, emptyMessage, formatPercent, formatValue, height, hiddenGroups, legend, legendAlign, nodes, onHiddenGroupsChange, ringGap, showLabels, sliceRadius, title, }: ChartSunburstProps): import("react").JSX.Element;
+export declare function ChartSunburst({ accent, defaultHiddenGroups, emptyMessage, formatPercent, formatTooltipValue, formatValue, height, hiddenGroups, legend, legendAlign, nodes, onHiddenGroupsChange, onHoverNode, ringGap, showLabels, showTooltip, sliceRadius, title, }: ChartSunburstProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartTooltip/ChartTooltip.d.ts

@@ -3,6 +3,8 @@ export interface ChartTooltipRow {
     color?: string;
     /** Realca a linha, como a serie sob o ponteiro entre as demais. */
     emphasis?: boolean;
+    /** Formato dos valores desta linha, quando difere do da coluna, como a serie do eixo da direita. */
+    format?: (value: number) => string;
     label: string;
     values: readonly number[];
 }

package/dist/types/components/charts/ChartTreemap/ChartTreemap.d.ts

@@ -1,4 +1,4 @@
-import { type ChartHeight, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
+import { type ChartHeight, type ChartHoveredNode, type ChartLegendAlign, type ChartLegendPosition } from '../core/index.js';
 import { type SeriesAppearance, type SeriesIntent } from '../palette/index.js';
 export interface ChartTreemapNode extends SeriesAppearance {
     children?: readonly ChartTreemapNode[];
@@ -9,6 +9,8 @@ export interface ChartTreemapProps {
     accent?: string;
     defaultHiddenGroups?: readonly string[];
     emptyMessage?: string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     /** Folga entre dois retangulos vizinhos. */
     gap?: number;
@@ -24,7 +26,14 @@ export interface ChartTreemapProps {
     legendAlign?: ChartLegendAlign;
     nodes: readonly ChartTreemapNode[];
     onHiddenGroupsChange?: (hidden: readonly string[]) => void;
+    /** Caminho ate o no sob o ponteiro, do grupo ao no, cada nivel com o valor somado, ou `null` ao sair. */
+    onHoverNode?: (path: readonly ChartHoveredNode[] | null) => void;
     showDataLabels?: boolean;
+    /**
+     * Balao com o caminho ate o no sob o ponteiro. Desligue para montar o proprio `ChartTooltip`
+     * pela costura; sem balao nem costura, o no volta a ter o `<title>`.
+     */
+    showTooltip?: boolean;
     title: string;
 }
-export declare function ChartTreemap({ accent, defaultHiddenGroups, emptyMessage, formatValue, gap, height, hiddenGroups, intentLabels, legend, legendAlign, nodes, onHiddenGroupsChange, showDataLabels, title, }: ChartTreemapProps): import("react").JSX.Element;
+export declare function ChartTreemap({ accent, defaultHiddenGroups, emptyMessage, formatTooltipValue, formatValue, gap, height, hiddenGroups, intentLabels, legend, legendAlign, nodes, onHiddenGroupsChange, onHoverNode, showDataLabels, showTooltip, title, }: ChartTreemapProps): import("react").JSX.Element;

package/dist/types/components/charts/ChartWaterfall/ChartWaterfall.d.ts

@@ -1,4 +1,4 @@
-import { type AxisLabelAngle, type AxisVisibility, type ChartHeight } from '../core/index.js';
+import { type AxisLabelAngle, type AxisVisibility, type MarkVisibility, type ChartHeight } from '../core/index.js';
 import { type SeriesIntent } from '../palette/index.js';
 export interface ChartWaterfallStep {
     color?: string;
@@ -9,16 +9,21 @@ export interface ChartWaterfallStep {
 }
 export interface ChartWaterfallProps {
     emptyMessage?: string;
+    /** Formato dos valores no balao. Sem ele, vale o `formatValue`: o eixo pode sair compacto e o balao, exato. */
+    formatTooltipValue?: (value: number) => string;
     formatValue?: (value: number) => string;
     height?: ChartHeight;
     labelAngle?: AxisLabelAngle;
     /** Indice do passo sob o ponteiro, ou `null` ao sair dele. */
     onHoverStep?: (index: number | null) => void;
-    showDataLabels?: boolean;
+    /** Variacao acima de cada passo. Em `onHover`, so a do passo sob o ponteiro. */
+    showDataLabels?: MarkVisibility;
+    /** Balao com a variacao do passo sob o ponteiro e o acumulado ate ele. Desligue para montar o proprio `ChartTooltip`. */
+    showTooltip?: boolean;
     steps: readonly ChartWaterfallStep[];
     title: string;
     xAxis?: AxisVisibility;
     yAxis?: AxisVisibility;
     yAxisRight?: AxisVisibility;
 }
-export declare function ChartWaterfall({ emptyMessage, formatValue, height, labelAngle, onHoverStep, showDataLabels, steps, title, xAxis, yAxis, yAxisRight, }: ChartWaterfallProps): import("react").JSX.Element;
+export declare function ChartWaterfall({ emptyMessage, formatTooltipValue, formatValue, height, labelAngle, onHoverStep, showDataLabels, showTooltip, steps, title, xAxis, yAxis, yAxisRight, }: ChartWaterfallProps): import("react").JSX.Element;

package/dist/types/components/charts/core/CartesianFrame.d.ts

@@ -1,8 +1,10 @@
 import type { ReactNode } from 'react';
 import { type AxisTick } from './Axis.js';
 import type { ChartLegendAlign, ChartLegendEntry, ChartLegendPosition } from './ChartLegend.js';
+import type { ChartFrameProps } from './ChartFrame.js';
 import { type GridOrientation } from './Grid.js';
 import type { AxisLabelRotation, AxisVisibility, ChartMargins, ChartPlot } from './cartesianLayout.js';
+import type { AxisReveal } from './useCartesianLayout.js';
 export interface CartesianAxis {
     hideLine?: boolean;
     labelRotation?: AxisLabelRotation;
@@ -15,6 +17,8 @@ export interface CartesianGrid {
     orientation: GridOrientation;
 }
 export interface CartesianFrameProps {
+    /** Estado e gatilhos dos eixos `onHover`, vindos de `useCartesianLayout`. */
+    axisReveal?: AxisReveal;
     children: ReactNode;
     containerRef: (node: HTMLElement | null) => void;
     empty: boolean;
@@ -29,6 +33,7 @@ export interface CartesianFrameProps {
     onToggleSeries?: (label: string) => void;
     plot: ChartPlot;
     title: string;
+    tooltip?: ChartFrameProps['tooltip'];
     width: number;
     xAxis: CartesianAxis;
     yAxis: CartesianAxis;
@@ -38,4 +43,4 @@ export interface CartesianFrameProps {
  * Camada cartesiana sobre a moldura comum: grade, os dois eixos e as marcas,
  * todos dentro das margens ja calculadas a partir dos rotulos.
  */
-export declare function CartesianFrame({ children, containerRef, empty, emptyMessage, fillHeight, grid, height, legend, legendAlign, legendPosition, margins, onToggleSeries, plot, title, width, xAxis, yAxis, yAxisRight, }: CartesianFrameProps): import("react").JSX.Element;
+export declare function CartesianFrame({ axisReveal, children, containerRef, empty, emptyMessage, fillHeight, grid, height, legend, legendAlign, legendPosition, margins, onToggleSeries, plot, title, tooltip, width, xAxis, yAxis, yAxisRight, }: CartesianFrameProps): import("react").JSX.Element;

package/dist/types/components/charts/core/ChartFrame.d.ts

@@ -1,5 +1,6 @@
 import { type ReactNode } from 'react';
 import { type ChartLegendAlign, type ChartLegendEntry, type ChartLegendPosition, type ChartLegendSwatch } from './ChartLegend.js';
+import { type ChartTooltipProps } from '../ChartTooltip/ChartTooltip.js';
 export interface ChartFrameProps {
     /** Marcas do grafico, em coordenadas da area de desenho. */
     children: ReactNode;
@@ -18,9 +19,14 @@ export interface ChartFrameProps {
     legendPosition: ChartLegendPosition;
     /** A partir de quantas entradas a legenda aparece. */
     minLegendEntries?: number;
+    /** Ponteiro entrando e saindo da area de desenho, para quem revela os eixos `onHover`. */
+    onPointerEnter?: () => void;
+    onPointerLeave?: () => void;
     onToggleSeries?: (label: string) => void;
     swatch?: ChartLegendSwatch;
     title: string;
+    /** O balao do que esta sob o ponteiro, montado pelo grafico. Sem linhas, nao aparece. */
+    tooltip?: Omit<ChartTooltipProps, 'children'>;
     width: number;
 }
 /**
@@ -28,4 +34,4 @@ export interface ChartFrameProps {
  * O que muda entre as familias e o que se desenha dentro dela — eixos, aneis ou
  * a area inteira —, e nao o cerco, que era o mesmo repetido tres vezes.
  */
-export declare function ChartFrame({ children, centerOrigin, containerRef, empty, emptyMessage, fillHeight, height, legend, legendAlign, legendPosition, minLegendEntries, onToggleSeries, swatch, title, width, }: ChartFrameProps): import("react").JSX.Element;
+export declare function ChartFrame({ children, centerOrigin, containerRef, empty, emptyMessage, fillHeight, height, legend, legendAlign, legendPosition, minLegendEntries, onPointerEnter, onPointerLeave, onToggleSeries, swatch, title, tooltip, width, }: ChartFrameProps): import("react").JSX.Element;

package/dist/types/components/charts/core/PointBands.d.ts

@@ -0,0 +1,22 @@
+import type { ChartPlot } from './cartesianLayout.js';
+import type { ChartPoint } from './shapes.js';
+export interface PointBandsProps {
+    onHover: (index: number | null) => void;
+    /** Altura do ponteiro na area de desenho, para quem escolhe a serie mais proxima dele. */
+    onPointerY?: (y: number | null) => void;
+    plot: ChartPlot;
+    /** Posicao de cada categoria no eixo, na ordem das categorias. */
+    positions: readonly number[];
+}
+/**
+ * Faixas invisiveis sobre a area de desenho, uma por categoria, que vao do ponto
+ * ate o meio do caminho para cada vizinho: o ponteiro sempre cai no ponto mais proximo.
+ */
+export declare function PointBands({ onHover, onPointerY, plot, positions }: PointBandsProps): import("react").JSX.Element;
+/** Guia vertical no ponto sob o ponteiro, atras das marcas. */
+export declare function PointCursor({ plot, position }: {
+    plot: ChartPlot;
+    position: number;
+}): import("react").JSX.Element;
+/** A serie visivel com ponto na categoria cujo ponto fica mais perto da altura do ponteiro. */
+export declare function nearestSeriesAt(pointsBySeries: readonly (readonly (ChartPoint | null)[])[], category: number | null, y: number | null, isHidden: (seriesIndex: number) => boolean): null;

package/dist/types/components/charts/core/cartesianLayout.d.ts

@@ -3,11 +3,15 @@ import { type NumericRange } from '../scales/index.js';
 export type AxisLabelRotation = 0 | 45 | 90;
 export type AxisLabelAngle = AxisLabelRotation | 'auto';
 /**
- * Como o eixo se mostra. `onHover` reserva a calha e desliza o eixo para dentro
- * dela, de modo que o desenho nao se mexa sob o ponteiro; `hidden` dispensa a
- * calha, e e o unico modo em que a area de desenho realmente cresce.
+ * Como o eixo se mostra. `onHover` nao reserva a calha: o desenho ocupa o espaco
+ * todo e, depois de um instante com o ponteiro sobre o grafico, encolhe para o
+ * eixo entrar; `hidden` dispensa o eixo de vez.
  */
 export type AxisVisibility = 'visible' | 'hidden' | 'onHover';
+/** Como pontos e rotulos de valor se mostram. `onHover` mostra os da serie sob o ponteiro, e so eles. */
+export type MarkVisibility = 'visible' | 'hidden' | 'onHover';
+/** Se a marca da serie aparece: sempre, nunca, ou so com a serie sob o ponteiro. */
+export declare function markShown(visibility: MarkVisibility, seriesFocused: boolean): boolean;
 /** Altura do desenho: um numero fixa, `fill` entrega a decisao ao contêiner. */
 export type ChartHeight = number | 'fill';
 export interface ResolvedHeight {
@@ -36,6 +40,8 @@ export interface CartesianLayoutOptions {
     height: number;
     labelAngle: AxisLabelAngle;
     leftLabels: readonly string[];
+    /** Os eixos `onHover` estao a vista e ocupam a calha. */
+    revealed?: boolean;
     rightLabels: readonly string[];
     topRoom: number;
     width: number;
@@ -60,7 +66,7 @@ export declare function bottomLabelRotation(labels: readonly string[], font: Lab
  * util define o passo entre categorias, o passo define o angulo dos rotulos e o
  * angulo define a altura que eles ocupam embaixo.
  */
-export declare function cartesianLayout({ bottomLabels, font, height, labelAngle, leftLabels, rightLabels, topRoom, width, xAxis, yAxis, yAxisRight, }: CartesianLayoutOptions): CartesianLayout;
+export declare function cartesianLayout({ bottomLabels, font, height, labelAngle, leftLabels, revealed, rightLabels, topRoom, width, xAxis, yAxis, yAxisRight, }: CartesianLayoutOptions): CartesianLayout;
 /**
  * Rotulos de valor usados apenas para medir a calha do eixo, antes de a area de
  * desenho existir. Eles saem da altura total em vez da altura util, o que pode

package/dist/types/components/charts/core/hoverPath.d.ts

@@ -0,0 +1,10 @@
+import type { HierarchyNode } from 'd3-hierarchy';
+/** Um nivel do caminho ate o no sob o ponteiro, com o valor somado daquele nivel. */
+export interface ChartHoveredNode {
+    label: string;
+    value: number;
+}
+/** Caminho do grupo de topo ate o no, sem a raiz que o layout cria por fora. */
+export declare function hoverPath(node: HierarchyNode<{
+    label: string;
+}>): ChartHoveredNode[];

package/dist/types/components/charts/core/index.d.ts

@@ -2,10 +2,18 @@ export { BandCursor } from './BandCursor.js';
 export type { BandCursorProps, BandOrientation } from './BandCursor.js';
 export { Axis } from './Axis.js';
 export type { AxisOrientation, AxisProps, AxisTick } from './Axis.js';
+export { nearestSeriesAt, PointBands, PointCursor } from './PointBands.js';
+export { pointLabelPlacement } from './pointLabels.js';
+export type { PointLabelPlacement } from './pointLabels.js';
+export type { PointBandsProps } from './PointBands.js';
+export { categoryTooltip, pathTooltip, sliceTooltip } from './tooltips.js';
+export type { CategoryTooltipOptions, CategoryTooltipSeries, ChartFrameTooltip, PathTooltipOptions, SliceTooltipOptions } from './tooltips.js';
+export { hoverPath } from './hoverPath.js';
+export type { ChartHoveredNode } from './hoverPath.js';
 export { Grid } from './Grid.js';
 export type { GridOrientation, GridProps } from './Grid.js';
-export { bottomLabelRotation, cartesianLayout, chartHeight, valueLabelsFor, } from './cartesianLayout.js';
-export type { AxisLabelAngle, AxisLabelRotation, AxisVisibility, CartesianLayout, CartesianLayoutOptions, ChartHeight, ChartMargins, ChartPlot, ResolvedHeight, } from './cartesianLayout.js';
+export { bottomLabelRotation, cartesianLayout, chartHeight, markShown, valueLabelsFor, } from './cartesianLayout.js';
+export type { AxisLabelAngle, AxisLabelRotation, AxisVisibility, CartesianLayout, CartesianLayoutOptions, ChartHeight, ChartMargins, ChartPlot, MarkVisibility, ResolvedHeight, } from './cartesianLayout.js';
 export { arcAnchor, arcCentroid, arcPath, sliceAngles, VOLTA } from './arcs.js';
 export type { ArcAngles, ArcShape, SliceAnglesOptions } from './arcs.js';
 export { centerTextRadius, fitCenterText } from './centerText.js';
@@ -24,11 +32,13 @@ export { areaPath, linePath, roundedBarPath } from './shapes.js';
 export { groupSmallSlices } from './slices.js';
 export type { ChartSlice, GroupSmallSlicesOptions } from './slices.js';
 export type { ChartBand, ChartCurve, ChartPoint, CornerRadii } from './shapes.js';
+export { useCartesianLayout } from './useCartesianLayout.js';
+export type { AxisReveal } from './useCartesianLayout.js';
 export { useChartMetrics } from './useChartMetrics.js';
 export type { ChartMetrics } from './useChartMetrics.js';
 export { useHoveredBand } from './useHoveredBand.js';
 export type { HoveredBand } from './useHoveredBand.js';
-export { useSeriesToggle } from './useSeriesToggle.js';
+export { seriesInScale, useSeriesToggle } from './useSeriesToggle.js';
 export type { SeriesToggle, UseSeriesToggleOptions } from './useSeriesToggle.js';
 export { useSliceRing } from './useSliceRing.js';
 export type { SliceRing, UseSliceRingOptions } from './useSliceRing.js';