@fluityy/designsystem 0.2.10 → 0.2.11

package/dist/components/Chart/AreaChart.d.ts

@@ -0,0 +1,17 @@
+import { ChartSeries } from './chartTheme';
+export interface AreaChartProps {
+    data: Array<Record<string, string | number>>;
+    series: ChartSeries[];
+    xKey: string;
+    height?: number;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    showBrush?: boolean;
+    smooth?: boolean;
+    /** Empilha as series (stacked area). */
+    stacked?: boolean;
+    formatValue?: (value: number) => string;
+    formatLabel?: (label: string | number) => string;
+    className?: string;
+}
+export declare function AreaChart({ data, series, xKey, height, showGrid, showLegend, showBrush, smooth, stacked, formatValue, formatLabel, className, }: AreaChartProps): import("react").JSX.Element;

package/dist/components/Chart/BarChart.d.ts

@@ -0,0 +1,21 @@
+import { ChartSeries } from './chartTheme';
+export interface BarChartProps {
+    data: Array<Record<string, string | number>>;
+    series: ChartSeries[];
+    xKey: string;
+    height?: number;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    /** "vertical" = barras em pe (default). "horizontal" = barras deitadas. */
+    orientation?: "vertical" | "horizontal";
+    /** Empilha as series (stacked bars). */
+    stacked?: boolean;
+    /** Raio das pontas das barras. */
+    radius?: number;
+    /** Largura maxima de cada barra em px. Default: 24. */
+    maxBarSize?: number;
+    formatValue?: (value: number) => string;
+    formatLabel?: (label: string | number) => string;
+    className?: string;
+}
+export declare function BarChart({ data, series, xKey, height, showGrid, showLegend, orientation, stacked, radius, maxBarSize, formatValue, formatLabel, className, }: BarChartProps): import("react").JSX.Element;

package/dist/components/Chart/ChartLegend.d.ts

@@ -0,0 +1,12 @@
+export interface ChartLegendItem {
+    dataKey: string;
+    name: string;
+    color: string;
+}
+export interface ChartLegendProps {
+    items: ChartLegendItem[];
+    hidden: Set<string>;
+    onToggle: (dataKey: string) => void;
+    className?: string;
+}
+export declare function ChartLegend({ items, hidden, onToggle, className }: ChartLegendProps): import("react").JSX.Element;

package/dist/components/Chart/ChartTooltip.d.ts

@@ -0,0 +1,8 @@
+import { TooltipContentProps } from 'recharts';
+export interface ChartTooltipProps extends Partial<TooltipContentProps<number, string>> {
+    /** Formata o valor numerico exibido. */
+    formatValue?: (value: number) => string;
+    /** Formata o titulo (label do eixo X). */
+    formatLabel?: (label: string | number) => string;
+}
+export declare function ChartTooltip({ active, payload, label, formatValue, formatLabel, }: ChartTooltipProps): import("react").JSX.Element | null;

package/dist/components/Chart/DonutChart.d.ts

@@ -0,0 +1,24 @@
+export interface DonutDatum {
+    /** Rotulo da fatia. */
+    name: string;
+    /** Valor numerico. */
+    value: number;
+    /** Cor da fatia. Default: cor da paleta pelo indice. */
+    color?: string;
+}
+export interface DonutChartProps {
+    data: DonutDatum[];
+    height?: number;
+    /** Raio interno (0 = pie/pizza, >0 = donut/rosca). Default: 60. */
+    innerRadius?: number;
+    /** Raio externo. Default: 90. */
+    outerRadius?: number;
+    showLegend?: boolean;
+    /** Texto exibido no centro (apenas donut). */
+    centerLabel?: React.ReactNode;
+    /** Sublabel abaixo do centerLabel. */
+    centerSublabel?: React.ReactNode;
+    formatValue?: (value: number) => string;
+    className?: string;
+}
+export declare function DonutChart({ data, height, innerRadius, outerRadius, showLegend, centerLabel, centerSublabel, formatValue, className, }: DonutChartProps): import("react").JSX.Element;

package/dist/components/Chart/LineChart.d.ts

@@ -0,0 +1,17 @@
+import { ChartSeries } from './chartTheme';
+export interface LineChartProps {
+    data: Array<Record<string, string | number>>;
+    series: ChartSeries[];
+    /** Chave do eixo X (categoria/tempo). */
+    xKey: string;
+    height?: number;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    showBrush?: boolean;
+    /** Linhas suavizadas (curva) ao inves de retas. */
+    smooth?: boolean;
+    formatValue?: (value: number) => string;
+    formatLabel?: (label: string | number) => string;
+    className?: string;
+}
+export declare function LineChart({ data, series, xKey, height, showGrid, showLegend, showBrush, smooth, formatValue, formatLabel, className, }: LineChartProps): import("react").JSX.Element;

package/dist/components/Chart/chartTheme.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Paleta categorica para charts. Os valores sao CSS vars geradas pelos tokens
+ * do DS (semantic.chart.*) — trocar tema/marca/modo cascateia automaticamente.
+ */
+export declare const CHART_PALETTE: readonly ["var(--flui-semantic-chart-1)", "var(--flui-semantic-chart-2)", "var(--flui-semantic-chart-3)", "var(--flui-semantic-chart-4)", "var(--flui-semantic-chart-5)", "var(--flui-semantic-chart-6)"];
+export declare const CHART_GRID = "var(--flui-semantic-chart-grid)";
+export declare const CHART_AXIS = "var(--flui-semantic-chart-axis)";
+export declare function paletteColor(index: number): string;
+export interface ChartSeries {
+    /** Chave do objeto `data` que contem o valor desta serie. */
+    dataKey: string;
+    /** Rotulo exibido em tooltip/legenda. Default: dataKey. */
+    name?: string;
+    /** Cor da serie. Default: cor da paleta pelo indice. */
+    color?: string;
+}

package/dist/components/Chart/index.d.ts

@@ -0,0 +1,7 @@
+export { LineChart, type LineChartProps } from './LineChart';
+export { AreaChart, type AreaChartProps } from './AreaChart';
+export { BarChart, type BarChartProps } from './BarChart';
+export { DonutChart, type DonutChartProps, type DonutDatum } from './DonutChart';
+export { ChartTooltip, type ChartTooltipProps } from './ChartTooltip';
+export { ChartLegend, type ChartLegendProps, type ChartLegendItem } from './ChartLegend';
+export { CHART_PALETTE, CHART_GRID, CHART_AXIS, paletteColor, type ChartSeries, } from './chartTheme';

package/dist/components/index.d.ts

@@ -23,5 +23,6 @@ export * from './Drawer/Drawer';
 export * from './Toast/Toast';
 export * from './Textarea/Textarea';
 export * from './CodeBlock/CodeBlock';
+export * from './Chart';
 export * from './ProfileSettingsModal/ProfileSettingsModal';
 export * from '../theme/ThemeProvider';