@plenustech/design-system 0.2.2 → 0.2.3

package/dist/index.js

@@ -1,131 +1,193 @@
 /* empty css                  */
 /* empty css                */
-import { Accordion as p } from "./components/data-display/Accordion/Accordion.js";
-import { Alert as a } from "./components/feedback/Alert/Alert.js";
-import { Avatar as x } from "./components/data-display/Avatar/Avatar.js";
+import { Accordion as n } from "./components/data-display/Accordion/Accordion.js";
+import { Alert as p } from "./components/feedback/Alert/Alert.js";
+import { Avatar as f } from "./components/data-display/Avatar/Avatar.js";
 import { Badge as c } from "./components/data-display/Badge/Badge.js";
-import { Breadcrumb as i } from "./components/navigation/Breadcrumb/Breadcrumb.js";
-import { Button as l } from "./components/actions/Button/Button.js";
-import { ButtonIcon as u } from "./components/actions/ButtonIcon/ButtonIcon.js";
-import { Card as d } from "./components/data-display/Card/Card.js";
-import { ChartArea as b } from "./components/charts/ChartArea/ChartArea.js";
-import { ChartBar as T } from "./components/charts/ChartBar/ChartBar.js";
-import { ChartCombo as B } from "./components/charts/ChartCombo/ChartCombo.js";
-import { ChartDonut as A } from "./components/charts/ChartDonut/ChartDonut.js";
+import { Breadcrumb as l } from "./components/navigation/Breadcrumb/Breadcrumb.js";
+import { Button as C } from "./components/actions/Button/Button.js";
+import { ButtonIcon as s } from "./components/actions/ButtonIcon/ButtonIcon.js";
+import { ButtonTile as d } from "./components/actions/ButtonTile/ButtonTile.js";
+import { Card as k } from "./components/data-display/Card/Card.js";
+import { ChartArea as S } from "./components/charts/ChartArea/ChartArea.js";
+import { ChartBar as P } from "./components/charts/ChartBar/ChartBar.js";
+import { ChartCombo as D } from "./components/charts/ChartCombo/ChartCombo.js";
+import { ChartDonut as L } from "./components/charts/ChartDonut/ChartDonut.js";
 import { ChartLine as w } from "./components/charts/ChartLine/ChartLine.js";
-import { ChartPie as L } from "./components/charts/ChartPie/ChartPie.js";
-import { ChartRadial as y } from "./components/charts/ChartRadial/ChartRadial.js";
-import { ChartSankey as E } from "./components/charts/ChartSankey/ChartSankey.js";
-import { ChartScatter as U } from "./components/charts/ChartScatter/ChartScatter.js";
-import { ChartSunburst as F } from "./components/charts/ChartSunburst/ChartSunburst.js";
-import { ChartTooltip as H } from "./components/charts/ChartTooltip/ChartTooltip.js";
-import { ChartTreemap as j } from "./components/charts/ChartTreemap/ChartTreemap.js";
-import { ChartWaterfall as z } from "./components/charts/ChartWaterfall/ChartWaterfall.js";
-import { Checkbox as K } from "./components/forms/Checkbox/Checkbox.js";
-import { CodeBlock as V } from "./components/data-display/CodeBlock/CodeBlock.js";
-import { ComboBox as Y } from "./components/forms/ComboBox/ComboBox.js";
-import { DatePicker as _ } from "./components/forms/DatePicker/DatePicker.js";
-import { DateTimePicker as rr } from "./components/forms/DateTimePicker/DateTimePicker.js";
-import { Dialog as er } from "./components/overlays/Dialog/Dialog.js";
-import { EmptyState as pr } from "./components/feedback/EmptyState/EmptyState.js";
-import { Field as ar } from "./components/forms/Field/Field.js";
-import { IconArrowDown as xr, IconArrowUp as nr, IconCalendar as cr, IconChartBar as Cr, IconChevronDown as ir, IconChevronExpand as hr, IconChevronLeft as lr, IconChevronRight as Ir, IconChevronUp as ur, IconClock as sr, IconClose as dr, IconMinusCircle as Pr, IconPlusCircle as br, IconQuestionCircle as Sr, IconSearch as Tr } from "./components/icons/icons.js";
-import { InputCurrency as Br } from "./components/forms/InputCurrency/InputCurrency.js";
-import { InputNumber as Ar } from "./components/forms/InputNumber/InputNumber.js";
-import { InputPassword as wr } from "./components/forms/InputPassword/InputPassword.js";
-import { InputText as Lr } from "./components/forms/InputText/InputText.js";
-import { Label as yr } from "./components/forms/Label/Label.js";
-import { List as Er } from "./components/data-display/List/List.js";
-import { Menu as Ur } from "./components/overlays/Menu/Menu.js";
-import { Pagination as Fr } from "./components/navigation/Pagination/Pagination.js";
-import { Popover as Hr } from "./components/overlays/Popover/Popover.js";
-import { Progress as jr } from "./components/feedback/Progress/Progress.js";
-import { Radio as zr } from "./components/forms/RadioGroup/Radio.js";
-import { RadioGroup as Kr } from "./components/forms/RadioGroup/RadioGroup.js";
-import { Select as Vr } from "./components/forms/Select/Select.js";
-import { Spinner as Yr } from "./components/feedback/Spinner/Spinner.js";
-import { Switch as _r } from "./components/forms/Switch/Switch.js";
-import { Table as ro } from "./components/data-display/Table/Table.js";
-import { Tabs as eo } from "./components/navigation/Tabs/Tabs.js";
-import { Textarea as po } from "./components/forms/Textarea/Textarea.js";
-import { TimePicker as ao } from "./components/forms/TimePicker/TimePicker.js";
-import { Tooltip as xo } from "./components/overlays/Tooltip/Tooltip.js";
-import { formatarData as co, formatarHora as Co } from "./utils/formatters/formatarData.js";
-import { formatarMoeda as ho, formatarNumero as lo, formatarPercentual as Io } from "./utils/formatters/formatarNumero.js";
-import { paletteWithAccent as so, seriesColors as Po } from "./components/charts/palette/palette.js";
-import { resolveSeriesColors as So } from "./components/charts/palette/seriesColor.js";
+import { ChartPie as E } from "./components/charts/ChartPie/ChartPie.js";
+import { ChartRadial as U } from "./components/charts/ChartRadial/ChartRadial.js";
+import { ChartSankey as F } from "./components/charts/ChartSankey/ChartSankey.js";
+import { ChartScatter as H } from "./components/charts/ChartScatter/ChartScatter.js";
+import { ChartSunburst as W } from "./components/charts/ChartSunburst/ChartSunburst.js";
+import { ChartTooltip as Q } from "./components/charts/ChartTooltip/ChartTooltip.js";
+import { ChartTreemap as z } from "./components/charts/ChartTreemap/ChartTreemap.js";
+import { ChartWaterfall as K } from "./components/charts/ChartWaterfall/ChartWaterfall.js";
+import { Checkbox as V } from "./components/forms/Checkbox/Checkbox.js";
+import { CheckboxGroup as Y } from "./components/forms/CheckboxGroup/CheckboxGroup.js";
+import { CodeBlock as _ } from "./components/data-display/CodeBlock/CodeBlock.js";
+import { ColorPicker as oo } from "./components/forms/ColorPicker/ColorPicker.js";
+import { ComboBox as eo } from "./components/forms/ComboBox/ComboBox.js";
+import { DatePicker as no } from "./components/forms/DatePicker/DatePicker.js";
+import { DateTimePicker as po } from "./components/forms/DateTimePicker/DateTimePicker.js";
+import { Dialog as fo } from "./components/overlays/Dialog/Dialog.js";
+import { Drawer as co } from "./components/overlays/Drawer/Drawer.js";
+import { EmptyState as lo } from "./components/feedback/EmptyState/EmptyState.js";
+import { Field as Co } from "./components/forms/Field/Field.js";
+import { FileUpload as so } from "./components/forms/FileUpload/FileUpload.js";
+import { IconAlignCenter as To, IconAlignLeft as ko, IconAlignRight as go, IconArrowDown as So, IconArrowUp as bo, IconBold as Po, IconCalendar as Ao, IconChartBar as Do, IconCheck as Bo, IconCheckCircle as Lo, IconChevronDown as vo, IconChevronExpand as wo, IconChevronLeft as Ro, IconChevronRight as Eo, IconChevronUp as Mo, IconClock as Uo, IconClose as yo, IconDesktop as Fo, IconDragHandle as Go, IconExclamationCircle as Ho, IconExclamationTriangle as No, IconExternalLink as Wo, IconEye as qo, IconFile as Qo, IconFilter as jo, IconInfoCircle as zo, IconItalic as Jo, IconLightning as Ko, IconLink as Oo, IconMinusCircle as Vo, IconMobile as Xo, IconMore as Yo, IconPencil as Zo, IconPlus as _o, IconPlusCircle as $o, IconQuestionCircle as or, IconRedo as rr, IconSearch as er, IconSidebar as tr, IconStructure as nr, IconTablet as mr, IconTrash as pr, IconUndo as ar, IconUpload as fr } from "./components/icons/icons.js";
+import { InputCurrency as cr } from "./components/forms/InputCurrency/InputCurrency.js";
+import { InputNumber as lr } from "./components/forms/InputNumber/InputNumber.js";
+import { InputPassword as Cr } from "./components/forms/InputPassword/InputPassword.js";
+import { InputText as sr } from "./components/forms/InputText/InputText.js";
+import { Label as dr } from "./components/forms/Label/Label.js";
+import { List as kr } from "./components/data-display/List/List.js";
+import { Menu as Sr } from "./components/overlays/Menu/Menu.js";
+import { Pagination as Pr } from "./components/navigation/Pagination/Pagination.js";
+import { Popover as Dr } from "./components/overlays/Popover/Popover.js";
+import { Progress as Lr } from "./components/feedback/Progress/Progress.js";
+import { Radio as wr } from "./components/forms/RadioGroup/Radio.js";
+import { RadioGroup as Er } from "./components/forms/RadioGroup/RadioGroup.js";
+import { SegmentedControl as Ur } from "./components/forms/SegmentedControl/SegmentedControl.js";
+import { Select as Fr } from "./components/forms/Select/Select.js";
+import { Skeleton as Hr } from "./components/feedback/Skeleton/Skeleton.js";
+import { SkipLink as Wr } from "./components/navigation/SkipLink/SkipLink.js";
+import { SortableList as Qr } from "./components/data-display/SortableList/SortableList.js";
+import { Spinner as zr } from "./components/feedback/Spinner/Spinner.js";
+import { Steps as Kr } from "./components/navigation/Steps/Steps.js";
+import { Switch as Vr } from "./components/forms/Switch/Switch.js";
+import { Table as Yr } from "./components/data-display/Table/Table.js";
+import { Tabs as _r } from "./components/navigation/Tabs/Tabs.js";
+import { Tag as oe } from "./components/data-display/Tag/Tag.js";
+import { Textarea as ee } from "./components/forms/Textarea/Textarea.js";
+import { TimePicker as ne } from "./components/forms/TimePicker/TimePicker.js";
+import { Timeline as pe } from "./components/data-display/Timeline/Timeline.js";
+import { ToastRegion as fe } from "./components/feedback/Toast/ToastRegion.js";
+import { Toolbar as ce } from "./components/actions/Toolbar/Toolbar.js";
+import { Tooltip as le } from "./components/overlays/Tooltip/Tooltip.js";
+import { dismissToast as Ce, showToast as he } from "./components/feedback/Toast/toastStore.js";
+import { formatarData as ue, formatarHora as de } from "./utils/formatters/formatarData.js";
+import { formatarMoeda as ke, formatarNumero as ge, formatarPercentual as Se } from "./utils/formatters/formatarNumero.js";
+import { formatarTamanhoDeArquivo as Pe } from "./utils/formatters/formatarTamanhoDeArquivo.js";
+import { paletteWithAccent as De, seriesColors as Be } from "./components/charts/palette/palette.js";
+import { resolveSeriesColors as ve } from "./components/charts/palette/seriesColor.js";
 export {
-  p as Accordion,
-  a as Alert,
-  x as Avatar,
+  n as Accordion,
+  p as Alert,
+  f as Avatar,
   c as Badge,
-  i as Breadcrumb,
-  l as Button,
-  u as ButtonIcon,
-  d as Card,
-  b as ChartArea,
-  T as ChartBar,
-  B as ChartCombo,
-  A as ChartDonut,
+  l as Breadcrumb,
+  C as Button,
+  s as ButtonIcon,
+  d as ButtonTile,
+  k as Card,
+  S as ChartArea,
+  P as ChartBar,
+  D as ChartCombo,
+  L as ChartDonut,
   w as ChartLine,
-  L as ChartPie,
-  y as ChartRadial,
-  E as ChartSankey,
-  U as ChartScatter,
-  F as ChartSunburst,
-  H as ChartTooltip,
-  j as ChartTreemap,
-  z as ChartWaterfall,
-  K as Checkbox,
-  V as CodeBlock,
-  Y as ComboBox,
-  _ as DatePicker,
-  rr as DateTimePicker,
-  er as Dialog,
-  pr as EmptyState,
-  ar as Field,
-  xr as IconArrowDown,
-  nr as IconArrowUp,
-  cr as IconCalendar,
-  Cr as IconChartBar,
-  ir as IconChevronDown,
-  hr as IconChevronExpand,
-  lr as IconChevronLeft,
-  Ir as IconChevronRight,
-  ur as IconChevronUp,
-  sr as IconClock,
-  dr as IconClose,
-  Pr as IconMinusCircle,
-  br as IconPlusCircle,
-  Sr as IconQuestionCircle,
-  Tr as IconSearch,
-  Br as InputCurrency,
-  Ar as InputNumber,
-  wr as InputPassword,
-  Lr as InputText,
-  yr as Label,
-  Er as List,
-  Ur as Menu,
-  Fr as Pagination,
-  Hr as Popover,
-  jr as Progress,
-  zr as Radio,
-  Kr as RadioGroup,
-  Vr as Select,
-  Yr as Spinner,
-  _r as Switch,
-  ro as Table,
-  eo as Tabs,
-  po as Textarea,
-  ao as TimePicker,
-  xo as Tooltip,
-  co as formatarData,
-  Co as formatarHora,
-  ho as formatarMoeda,
-  lo as formatarNumero,
-  Io as formatarPercentual,
-  so as paletteWithAccent,
-  So as resolveSeriesColors,
-  Po as seriesColors
+  E as ChartPie,
+  U as ChartRadial,
+  F as ChartSankey,
+  H as ChartScatter,
+  W as ChartSunburst,
+  Q as ChartTooltip,
+  z as ChartTreemap,
+  K as ChartWaterfall,
+  V as Checkbox,
+  Y as CheckboxGroup,
+  _ as CodeBlock,
+  oo as ColorPicker,
+  eo as ComboBox,
+  no as DatePicker,
+  po as DateTimePicker,
+  fo as Dialog,
+  co as Drawer,
+  lo as EmptyState,
+  Co as Field,
+  so as FileUpload,
+  To as IconAlignCenter,
+  ko as IconAlignLeft,
+  go as IconAlignRight,
+  So as IconArrowDown,
+  bo as IconArrowUp,
+  Po as IconBold,
+  Ao as IconCalendar,
+  Do as IconChartBar,
+  Bo as IconCheck,
+  Lo as IconCheckCircle,
+  vo as IconChevronDown,
+  wo as IconChevronExpand,
+  Ro as IconChevronLeft,
+  Eo as IconChevronRight,
+  Mo as IconChevronUp,
+  Uo as IconClock,
+  yo as IconClose,
+  Fo as IconDesktop,
+  Go as IconDragHandle,
+  Ho as IconExclamationCircle,
+  No as IconExclamationTriangle,
+  Wo as IconExternalLink,
+  qo as IconEye,
+  Qo as IconFile,
+  jo as IconFilter,
+  zo as IconInfoCircle,
+  Jo as IconItalic,
+  Ko as IconLightning,
+  Oo as IconLink,
+  Vo as IconMinusCircle,
+  Xo as IconMobile,
+  Yo as IconMore,
+  Zo as IconPencil,
+  _o as IconPlus,
+  $o as IconPlusCircle,
+  or as IconQuestionCircle,
+  rr as IconRedo,
+  er as IconSearch,
+  tr as IconSidebar,
+  nr as IconStructure,
+  mr as IconTablet,
+  pr as IconTrash,
+  ar as IconUndo,
+  fr as IconUpload,
+  cr as InputCurrency,
+  lr as InputNumber,
+  Cr as InputPassword,
+  sr as InputText,
+  dr as Label,
+  kr as List,
+  Sr as Menu,
+  Pr as Pagination,
+  Dr as Popover,
+  Lr as Progress,
+  wr as Radio,
+  Er as RadioGroup,
+  Ur as SegmentedControl,
+  Fr as Select,
+  Hr as Skeleton,
+  Wr as SkipLink,
+  Qr as SortableList,
+  zr as Spinner,
+  Kr as Steps,
+  Vr as Switch,
+  Yr as Table,
+  _r as Tabs,
+  oe as Tag,
+  ee as Textarea,
+  ne as TimePicker,
+  pe as Timeline,
+  fe as ToastRegion,
+  ce as Toolbar,
+  le as Tooltip,
+  Ce as dismissToast,
+  ue as formatarData,
+  de as formatarHora,
+  ke as formatarMoeda,
+  ge as formatarNumero,
+  Se as formatarPercentual,
+  Pe as formatarTamanhoDeArquivo,
+  De as paletteWithAccent,
+  ve as resolveSeriesColors,
+  Be as seriesColors,
+  he as showToast
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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;