xertica-ui 2.4.0 → 2.5.0

package/dist/components/blocks/audio-player/AudioPlayer.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Props for the AudioPlayer component.
+ */
+interface AudioPlayerProps {
+    /** Whether the player is currently visible and open */
+    isOpen: boolean;
+    /** Callback to close the player bar */
+    onClose: () => void;
+    /** Pass sidebar expansion state to adjust layout positioning (optional, now uses LayoutContext) */
+    sidebarExpanded?: boolean;
+    /** Title of the audio track/podcast */
+    title?: string;
+    /** Subtitle or source information */
+    subtitle?: string;
+    /** Total duration in seconds */
+    duration?: number;
+    /** Initial or current playback time in seconds */
+    currentTime?: number;
+}
+/**
+ * Global floating Audio Player bar.
+ *
+ * @description
+ * A fixed-position playback bar that handles audio progress, volume,
+ * and specific podcast actions (reset, speed, info, refresh).
+ * It transitions smoothly from the bottom of the screen.
+ *
+ * @ai-rules
+ * 1. Placement: This component should typically be rendered once at the top level (e.g., in a Layout) and controlled via global state.
+ * 2. Positional logic: It automatically offsets itself based on `sidebarExpanded` to avoid overlapping navigation.
+ * 3. Use `duration` and `currentTime` to synchronize with external audio state if needed.
+ */
+export declare function AudioPlayer({ isOpen, onClose, title, subtitle, duration, // 20:00
+currentTime }: AudioPlayerProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/blocks/audio-player/index.d.ts

@@ -0,0 +1 @@
+export * from './AudioPlayer';

package/dist/components/blocks/document-editor/DocumentEditor.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Props for the DocumentEditor component.
+ */
+interface DocumentEditorProps {
+    /** Initial markdown or plain text content */
+    initialContent: string;
+    /** Title for the document (default: 'New Document') */
+    initialTitle?: string;
+    /** Callback to close the editor */
+    onClose: () => void;
+}
+/**
+ * Rich-text document editor with markdown compatibility.
+ *
+ * @description
+ * Provides a content-editable environment for document editing. It supports
+ * basic formatting (bold, italic, headers, lists) and maintains an edit history
+ * for Undo/Redo. It also handles simple markdown-to-HTML conversion for initial loading.
+ *
+ * @ai-rules
+ * 1. Use this component for full-screen editing experiences or side-panel document refinement.
+ * 2. It tracks unsaved changes internally; ensure you handle persistence via future prop extensions or external state.
+ * 3. The `convertMarkdownToHtml` helper is basic — it does not support complex nested markdown structures.
+ */
+export declare function DocumentEditor({ initialContent, initialTitle, onClose }: DocumentEditorProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/blocks/document-editor/index.d.ts

@@ -0,0 +1 @@
+export * from './DocumentEditor';

package/dist/components/blocks/podcast-player/PodcastPlayer.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Props for the PodcastPlayer component.
+ */
+interface PodcastPlayerProps {
+    /** Whether the player is currently visible and open */
+    isOpen: boolean;
+    /** Callback to close the player bar */
+    onClose: () => void;
+    /** Pass sidebar expansion state to adjust layout positioning (optional, now uses LayoutContext) */
+    sidebarExpanded?: boolean;
+    /** Title of the podcast/process track */
+    title?: string;
+    /** Subtitle or source information */
+    subtitle?: string;
+    /** Total duration in seconds */
+    duration?: number;
+    /** Initial or current playback time in seconds */
+    currentTime?: number;
+    /** Display mode of the player */
+    variant?: 'fixed' | 'inline';
+    /** How the fixed player occupies space */
+    layoutMode?: 'viewport' | 'container';
+    /** Optional state of the right-side panel for layout adjustments */
+    rightSidebarState?: 'none' | 'collapsed' | 'expanded';
+}
+/**
+ * Advanced Podcast Player component.
+ *
+ * @description
+ * An enhanced version of the Audio Player that supports multiple layout modes
+ * (fixed or inline), viewport portals, and responsive mobile rendering. It uses
+ * a theme-aware primary background when fixed.
+ *
+ * @ai-rules
+ * 1. Portals: When `variant="fixed"` and `layoutMode="viewport"`, it uses `createPortal` to render at the document root.
+ * 2. Variant: Use `variant="fixed"` for global playback; use `variant="inline"` for embedding directly in content cards.
+ * 3. Mobile: This component has a dedicated vertical layout for mobile screens (< 768px).
+ */
+export declare function PodcastPlayer({ isOpen, onClose, title, subtitle, duration, // 20:00
+currentTime, variant, layoutMode, rightSidebarState }: PodcastPlayerProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/blocks/podcast-player/index.d.ts

@@ -0,0 +1 @@
+export * from './PodcastPlayer';

package/dist/components/brand/xertica-provider/XerticaProvider.d.ts

@@ -12,6 +12,8 @@ interface XerticaProviderProps {
     googleMapsApiKey?: string;
     /** Default theme name for branding ('default', 'dark', etc.) */
     defaultBrandTheme?: string;
+    /** Color theme ID (e.g. 'xertica-original', 'blue', 'rose') — selects a full ColorTheme preset */
+    defaultColorTheme?: string;
     /** Primary brand color hex value */
     primaryColor?: string;
     /** Whether to use custom theme tokens from CSS */
@@ -53,5 +55,5 @@ interface XerticaProviderProps {
  * This component aggregates all necessary context providers. It should be placed at the
  * root of your application, ideally inside the App component.
  */
-export declare function XerticaProvider({ children, apiKey, googleMapsApiKey, defaultBrandTheme, primaryColor, useCustomTokens, disableDarkMode, availableLanguages, defaultLanguage, }: XerticaProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function XerticaProvider({ children, apiKey, googleMapsApiKey, defaultBrandTheme, defaultColorTheme, primaryColor, useCustomTokens, disableDarkMode, availableLanguages, defaultLanguage, }: XerticaProviderProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ui/chart/chart.d.ts

@@ -75,15 +75,24 @@ declare const ChartStyle: ({ id, config }: {
     config: ChartConfig;
 }) => import("react/jsx-runtime").JSX.Element | null;
 declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
-declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<'div'> & {
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<'div'> & {
+    active?: boolean;
+    payload?: RechartsPrimitive.TooltipPayload;
+    label?: React.ReactNode;
+    labelFormatter?: (label: React.ReactNode, payload: RechartsPrimitive.TooltipPayload) => React.ReactNode;
+    labelClassName?: string;
     hideLabel?: boolean;
     hideIndicator?: boolean;
     indicator?: 'line' | 'dot' | 'dashed';
     nameKey?: string;
     labelKey?: string;
+    color?: string;
+    formatter?: RechartsPrimitive.DefaultTooltipContentProps['formatter'];
 }): import("react/jsx-runtime").JSX.Element | null;
-declare const ChartLegend: typeof RechartsPrimitive.Legend;
-declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<'div'> & Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {
+declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<'div'> & {
+    payload?: RechartsPrimitive.LegendPayload[];
+    verticalAlign?: 'top' | 'middle' | 'bottom';
     hideIcon?: boolean;
     nameKey?: string;
 }): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ui/chart/parts/chart-dashboard.d.ts

@@ -0,0 +1,113 @@
+import * as React from "react";
+import type { ChartBarSize, ChartCurveType, ChartStateProps, DashboardChartColors, DashboardChartDatum, DashboardChartSeries, ChartPeriod } from "./chart-primitives";
+import { ChartContainer } from "./chart-primitives";
+export interface DashboardBarChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    indexKey?: string;
+    series?: DashboardChartSeries[];
+    colors?: DashboardChartColors;
+    barSize?: ChartBarSize;
+    stacked?: boolean;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    valueFormatter?: (value: number | string) => string;
+}
+export declare function DashboardBarChart({ data, config, indexKey, series, colors, barSize, stacked, showGrid, showLegend, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: DashboardBarChartProps): import("react/jsx-runtime").JSX.Element;
+export interface DashboardLineChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    indexKey?: string;
+    series?: DashboardChartSeries[];
+    colors?: DashboardChartColors;
+    showDots?: boolean;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    curveType?: ChartCurveType;
+    strokeWidth?: number;
+    valueFormatter?: (value: number | string) => string;
+}
+export declare function DashboardLineChart({ data, config, indexKey, series, colors, showDots, showGrid, showLegend, curveType, strokeWidth, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: DashboardLineChartProps): import("react/jsx-runtime").JSX.Element;
+export interface HorizontalBarChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    indexKey?: string;
+    series?: DashboardChartSeries[];
+    colors?: DashboardChartColors;
+    barSize?: ChartBarSize;
+    stacked?: boolean;
+    categoryWidth?: number;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    valueFormatter?: (value: number | string) => string;
+}
+export declare function HorizontalBarChart({ data, config, indexKey, series, colors, barSize, stacked, categoryWidth, showGrid, showLegend, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: HorizontalBarChartProps): import("react/jsx-runtime").JSX.Element;
+export interface InteractiveTimeSeriesChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    indexKey?: string;
+    series?: DashboardChartSeries[];
+    colors?: DashboardChartColors;
+    periods?: ChartPeriod[];
+    defaultPeriod?: string;
+    defaultSeries?: string;
+    filterData?: (data: DashboardChartDatum[], period: string) => DashboardChartDatum[];
+    showGrid?: boolean;
+    showLegend?: boolean;
+    showDots?: boolean;
+    gradientFill?: boolean;
+    curveType?: ChartCurveType;
+    strokeWidth?: number;
+    valueFormatter?: (value: number | string) => string;
+}
+export declare function InteractiveTimeSeriesChart({ data, config, indexKey, series, colors, periods, defaultPeriod, defaultSeries, filterData, showGrid, showLegend, showDots, gradientFill, curveType, strokeWidth, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: InteractiveTimeSeriesChartProps): import("react/jsx-runtime").JSX.Element;
+export interface ComboMetricChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    indexKey?: string;
+    series?: DashboardChartSeries[];
+    colors?: DashboardChartColors;
+    barSize?: ChartBarSize;
+    showGrid?: boolean;
+    showLegend?: boolean;
+    gradientFill?: boolean;
+    curveType?: ChartCurveType;
+    valueFormatter?: (value: number | string) => string;
+}
+export declare function ComboMetricChart({ data, config, indexKey, series, colors, barSize, showGrid, showLegend, gradientFill, curveType, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: ComboMetricChartProps): import("react/jsx-runtime").JSX.Element;
+export interface DonutBreakdownChartProps extends Omit<React.ComponentProps<typeof ChartContainer>, "children">, ChartStateProps {
+    data: DashboardChartDatum[];
+    nameKey?: string;
+    valueKey?: string;
+    colors?: DashboardChartColors;
+    centerLabel?: React.ReactNode;
+    centerValue?: React.ReactNode;
+    showLegend?: boolean;
+    /** Inner radius as percentage string (e.g. "58%") or number */
+    innerRadius?: string | number;
+    /** Outer radius as percentage string (e.g. "82%") or number */
+    outerRadius?: string | number;
+}
+export declare function DonutBreakdownChart({ data, config, nameKey, valueKey, colors, centerLabel, centerValue, showLegend, innerRadius, outerRadius, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, ...props }: DonutBreakdownChartProps): import("react/jsx-runtime").JSX.Element;
+export interface SparklineChartProps {
+    /** Data array — each item must have the `dataKey` field */
+    data: DashboardChartDatum[];
+    /** Key to plot on the Y axis */
+    dataKey: string;
+    /** Color for the line/area — defaults to `var(--chart-1)` */
+    color?: string;
+    /** Show filled area under the line */
+    filled?: boolean;
+    /** Show the last data point as a dot */
+    showEndDot?: boolean;
+    /** Curve interpolation type */
+    curveType?: ChartCurveType;
+    /** Stroke width */
+    strokeWidth?: number;
+    className?: string;
+}
+/**
+ * Minimal inline sparkline chart — no axes, no grid, no tooltip.
+ * Ideal for embedding inside stat cards or table cells.
+ *
+ * @ai-rules
+ * - Use `filled` for area-style sparklines.
+ * - Keep `className` height small (e.g. `h-12` or `h-16`).
+ * - Do NOT wrap in `ChartCard` — it is designed to be inline.
+ */
+export declare function SparklineChart({ data, dataKey, color, filled, showEndDot, curveType, strokeWidth, className, }: SparklineChartProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/chart/parts/chart-metric.d.ts

@@ -0,0 +1,118 @@
+import * as React from "react";
+import type { ChartStateProps, DashboardChartColors, DashboardChartDatum, DashboardChartSeries } from "./chart-primitives";
+export interface RadarMetricChartProps extends ChartStateProps {
+    /** Data array — each item is one axis point on the radar */
+    data: DashboardChartDatum[];
+    /** Key in each datum used as the axis label */
+    labelKey: string;
+    /**
+     * Series to render. Each entry maps to one `<Radar>` element.
+     * Use a single entry for a simple radar, multiple for comparison.
+     */
+    series: DashboardChartSeries[];
+    /** Override colors per series key or as an ordered array */
+    colors?: DashboardChartColors;
+    /** Fill the radar polygon (default: true) */
+    filled?: boolean;
+    /** Fill opacity when `filled` is true (default: 0.25) */
+    fillOpacity?: number;
+    /** Show dots on each axis point (default: false) */
+    showDots?: boolean;
+    /** Show the polar grid lines (default: true) */
+    showGrid?: boolean;
+    /** Show the legend (default: true when multiple series) */
+    showLegend?: boolean;
+    /** Format axis tick values */
+    valueFormatter?: (value: number | string) => string;
+    className?: string;
+}
+export declare function RadarMetricChart({ data, labelKey, series, colors, filled, fillOpacity, showDots, showGrid, showLegend, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, }: RadarMetricChartProps): import("react/jsx-runtime").JSX.Element;
+export interface PieMetricChartProps extends ChartStateProps {
+    /** Data array — each item is one slice */
+    data: DashboardChartDatum[];
+    /** Key in each datum used as the slice name/label */
+    nameKey: string;
+    /** Key in each datum used as the slice value */
+    valueKey: string;
+    /** Override colors as an ordered array or per-name map */
+    colors?: DashboardChartColors;
+    /** Outer radius of the pie (default: "80%") */
+    outerRadius?: number | string;
+    /** Inner radius — set > 0 to make a donut (default: 0) */
+    innerRadius?: number | string;
+    /** Show percentage labels inside/outside each slice (default: false) */
+    showLabels?: boolean;
+    /** Show the legend (default: true) */
+    showLegend?: boolean;
+    /**
+     * Index of the slice to "explode" (offset outward).
+     * Pass -1 or undefined to disable.
+     */
+    explodeIndex?: number;
+    /** Offset distance for the exploded slice in px (default: 12) */
+    explodeOffset?: number;
+    /** Format tooltip values */
+    valueFormatter?: (value: number | string) => string;
+    className?: string;
+}
+export declare function PieMetricChart({ data, nameKey, valueKey, colors, outerRadius, innerRadius, showLabels, showLegend, explodeIndex, explodeOffset, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, }: PieMetricChartProps): import("react/jsx-runtime").JSX.Element;
+export interface RadialBarMetricChartProps extends ChartStateProps {
+    /**
+     * Data array. Each item should have a `name` field (for labels) and
+     * the `dataKey` field (for values, 0–100 for percentage-based display).
+     */
+    data: DashboardChartDatum[];
+    /** Key in each datum used as the bar value (default: "value") */
+    dataKey?: string;
+    /** Key in each datum used as the bar label (default: "name") */
+    nameKey?: string;
+    /** Override colors as an ordered array or per-name map */
+    colors?: DashboardChartColors;
+    /** Inner radius of the radial bar (default: "30%") */
+    innerRadius?: number | string;
+    /** Outer radius of the radial bar (default: "100%") */
+    outerRadius?: number | string;
+    /** Start angle in degrees (default: 90 — top) */
+    startAngle?: number;
+    /** End angle in degrees (default: -270 — full circle) */
+    endAngle?: number;
+    /** Show background track behind each bar (default: true) */
+    showBackground?: boolean;
+    /** Show the legend (default: true) */
+    showLegend?: boolean;
+    /** Format tooltip values */
+    valueFormatter?: (value: number | string) => string;
+    className?: string;
+}
+export declare function RadialBarMetricChart({ data, dataKey, nameKey, colors, innerRadius, outerRadius, startAngle, endAngle, showBackground, showLegend, valueFormatter, isLoading, error, onRetry, retryLabel, emptyTitle, emptyDescription, errorTitle, errorDescription, loadingLabel, stateClassName, className, }: RadialBarMetricChartProps): import("react/jsx-runtime").JSX.Element;
+export interface GaugeChartThreshold {
+    /** Upper bound of this zone (0–100) */
+    value: number;
+    /** Color for this zone */
+    color: string;
+    /** Optional label for this zone */
+    label?: string;
+}
+export interface GaugeChartProps {
+    /** Current value (must be within [min, max]) */
+    value: number;
+    /** Minimum value (default: 0) */
+    min?: number;
+    /** Maximum value (default: 100) */
+    max?: number;
+    /**
+     * Color zones. Each threshold defines the upper bound of a zone.
+     * Zones are evaluated in order; the first zone whose `value >= current %`
+     * determines the active color.
+     * If omitted, uses `--chart-1`.
+     */
+    thresholds?: GaugeChartThreshold[];
+    /** Label shown below the value (e.g. "CPU Usage") */
+    label?: React.ReactNode;
+    /** Format the center value text (default: shows percentage) */
+    valueFormatter?: (value: number, percent: number) => string;
+    /** Show the needle indicator (default: true) */
+    showNeedle?: boolean;
+    className?: string;
+}
+export declare function GaugeChart({ value, min, max, thresholds, label, valueFormatter, showNeedle, className, }: GaugeChartProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/chart/parts/chart-primitives.d.ts

@@ -0,0 +1,101 @@
+import * as React from "react";
+import * as RechartsPrimitive from "recharts";
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+export type ChartConfig = {
+    [k in string]: {
+        label?: React.ReactNode;
+        icon?: React.ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+type ChartContextProps = {
+    config: ChartConfig;
+};
+export type DashboardChartDatum = Record<string, string | number | null | undefined>;
+export type DashboardChartSeries = {
+    key: string;
+    label?: React.ReactNode;
+    type?: "bar" | "line" | "area";
+    stackId?: string;
+    yAxisId?: string;
+};
+export type DashboardChartColors = string[] | Record<string, string>;
+export type ChartPeriod = {
+    value: string;
+    label: string;
+};
+export type ChartBarSize = "sm" | "md" | "lg" | "xl" | number;
+/** Curve interpolation type for line and area charts */
+export type ChartCurveType = "monotone" | "linear" | "step" | "stepBefore" | "stepAfter" | "natural" | "basis";
+export type ChartErrorState = boolean | string | Error | React.ReactNode;
+export type ChartStateProps = {
+    isLoading?: boolean;
+    error?: ChartErrorState;
+    onRetry?: () => void;
+    retryLabel?: React.ReactNode;
+    emptyTitle?: React.ReactNode;
+    emptyDescription?: React.ReactNode;
+    errorTitle?: React.ReactNode;
+    errorDescription?: React.ReactNode;
+    loadingLabel?: React.ReactNode;
+    stateClassName?: string;
+};
+export declare const defaultPeriods: ChartPeriod[];
+export declare const defaultChartColors: string[];
+export declare const chartBarSizes: Record<Exclude<ChartBarSize, number>, number>;
+export declare function useChart(): ChartContextProps;
+/**
+ * Root container for Recharts-based charts with theme-aware color injection.
+ *
+ * @description
+ * Wraps Recharts' `ResponsiveContainer` and injects CSS custom properties
+ * (`--color-*`) from a `ChartConfig` object, enabling full dark-mode
+ * support without hard-coded hex values in chart elements.
+ *
+ * @ai-rules
+ * 1. NEVER pass hex colors directly to Recharts elements (e.g., `fill="#4F46E5"`).
+ *    Always use `fill="var(--color-keyName)"` referencing the injected CSS variables.
+ * 2. This wrapper is REQUIRED to use `ChartTooltipContent` and `ChartLegendContent`.
+ * 3. Set height via `className="h-[300px]"` on `ChartContainer`, not on Recharts components.
+ * 4. Do NOT add another `<ResponsiveContainer>` — it is already included inside.
+ */
+export declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<"div"> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
+}): import("react/jsx-runtime").JSX.Element;
+export declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+export declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<"div"> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+}): import("react/jsx-runtime").JSX.Element | null;
+export declare const ChartLegend: typeof RechartsPrimitive.Legend;
+export declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<"div"> & Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+}): import("react/jsx-runtime").JSX.Element | null;
+export declare function getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string): ({
+    label?: React.ReactNode;
+    icon?: React.ComponentType;
+} & ({
+    color?: string;
+    theme?: never;
+} | {
+    color?: never;
+    theme: Record<keyof typeof THEMES, string>;
+})) | undefined;
+export {};

package/dist/components/ui/chart/parts/chart-shared.d.ts

@@ -0,0 +1,20 @@
+import * as React from "react";
+import { Card } from "../../card";
+import type { ChartStateProps } from "./chart-primitives";
+export declare function getChartState(state: ChartStateProps, hasData: boolean, className?: string): import("react/jsx-runtime").JSX.Element | null;
+export interface ChartCardProps extends Omit<React.ComponentProps<typeof Card>, "title"> {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    action?: React.ReactNode;
+    footer?: React.ReactNode;
+    contentClassName?: string;
+}
+export declare function ChartCard({ title, description, action, footer, children, className, contentClassName, ...props }: ChartCardProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Renders SVG `<defs>` with linear gradients for each series key.
+ * Used internally by area charts when `gradientFill` is enabled.
+ */
+export declare function AreaGradientDefs({ seriesKeys, opacity, }: {
+    seriesKeys: string[];
+    opacity?: number;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/chart/parts/chart-utils.d.ts

@@ -0,0 +1,12 @@
+import type { ChartConfig, ChartBarSize, ChartErrorState, DashboardChartColors, DashboardChartDatum, DashboardChartSeries } from "./chart-primitives";
+export declare function getChartSeries(config: ChartConfig, series?: DashboardChartSeries[]): DashboardChartSeries[];
+export declare function getSeriesColor(key: string, index: number, colors?: DashboardChartColors): string;
+export declare function getChartConfigWithColors(config: ChartConfig, keys: string[], colors?: DashboardChartColors): ChartConfig;
+/** Build a ChartConfig from a list of keys (no pre-existing config needed). */
+export declare function buildChartConfig(keys: string[], colors?: DashboardChartColors): ChartConfig;
+export declare function formatTick(value: number | string): string;
+export declare function defaultFilterData(data: DashboardChartDatum[], period: string): DashboardChartDatum[];
+export declare function getErrorDescription(error: ChartErrorState): string | undefined;
+export declare function getBarSize(barSize?: ChartBarSize): number;
+export declare function hasChartData(data: DashboardChartDatum[], series: DashboardChartSeries[]): boolean;
+export declare function hasPieData(data: DashboardChartDatum[], nameKey: string, valueKey: string): boolean;

package/dist/components/ui/chart/parts/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./chart-primitives";
+export * from "./chart-utils";
+export * from "./chart-shared";
+export * from "./chart-dashboard";
+export * from "./chart-metric";

package/dist/components/ui/stats-card/stats-card.d.ts

@@ -8,6 +8,16 @@ interface StatsCardProps extends React.HTMLAttributes<HTMLDivElement> {
         label?: string;
     };
     icon?: React.ReactNode;
+    /**
+     * Tailwind class for the icon text/foreground color.
+     * @default "text-muted-foreground"
+     */
+    iconColor?: string;
+    /**
+     * Tailwind class for the icon background color.
+     * @default "bg-muted"
+     */
+    iconBg?: string;
 }
 /**
  * KPI metric card for dashboard overview pages.

package/dist/contexts/theme-data.d.ts

@@ -6,6 +6,10 @@ export interface BrandColors {
     primaryForegroundDark: string;
     sidebarLight: string;
     sidebarDark: string;
+    darkBackground: string;
+    darkCard: string;
+    darkMuted: string;
+    darkBorder: string;
     gradientStart: string;
     gradientEnd: string;
     gradientStartDark: string;