rich-react-component 0.3.2 → 0.4.1

package/README.md

@@ -20,30 +20,36 @@ Each layer **reuses** the one below it instead of reimplementing it — `RemoteC
 npm install rich-react-component bootstrap react react-dom
 ```
 
-`bootstrap`, `react`, and `react-dom` are peer dependencies — the library ships no CSS of its own beyond what Bootstrap classes provide.
+`bootstrap`, `react`, and `react-dom` are peer dependencies. Bootstrap is still
+loaded by the application:
 
 ```tsx
 import "bootstrap/dist/css/bootstrap.min.css";
 ```
 
-The library ships one opt-in stylesheet: a repository-owned **Metronic Bootstrap
-visual skin** covering every public component. It is emitted as a separate
-`dist/style.css` asset, so importing the package entry point stays
-side-effect-free for SSR. Load it after Bootstrap and before your own overrides:
-
-```tsx
-import "bootstrap/dist/css/bootstrap.min.css";
-import "rich-react-component/style.css";
-// ...then your application's own overrides
-```
-
-Every rule in it is anchored on a library-owned `rrc-*` class, so importing it
-cannot repaint your own Bootstrap markup — components emit both their Bootstrap
-class and their `rrc-*` class, and a consumer who skips the import keeps plain
-Bootstrap. It is **not** the official Metronic stylesheet: no licensed Metronic
-or KeenIcons asset is used. Typography prefers Inter but the package never
-fetches a font; supply Inter from your application and it is picked up, or opt
-the whole page in with `body { font-family: var(--rrc-font-sans); }`.
+The library ships one opt-in stylesheet: a repository-owned **Metronic Bootstrap
+visual skin** covering every public component. It is emitted as a separate
+`dist/style.css` asset, so importing the package entry point stays
+side-effect-free for SSR. Load it after Bootstrap:
+
+```tsx
+import "bootstrap/dist/css/bootstrap.min.css";
+import "rich-react-component/style.css";
+```
+
+Every rule in it is anchored on a library-owned `rrc-*` class, so importing it
+cannot repaint your own Bootstrap markup — components emit both their Bootstrap
+class and their `rrc-*` class, and a consumer who skips the import keeps plain
+Bootstrap. It is **not** the official Metronic stylesheet: no licensed Metronic
+or KeenIcons asset is used. Typography prefers Inter but the package never
+fetches a font; supply Inter from your application and it is picked up, or opt
+the whole page in with `body { font-family: var(--rrc-font-sans); }`.
+
+The same philosophy applies to application chrome in this repository's
+showcase: no separate app stylesheet is required. Reusable showcase hooks live
+under `rrc-showcase-*` and are delivered through the public package stylesheet,
+so the demo app consumes the component library the way an application should:
+through component APIs and the package CSS entry, not a local `demo.css`.
 
 ## Quick example
 
@@ -83,7 +89,7 @@ import { RemoteComboBox } from "rich-react-component";
 
 ## What's in each layer
 
-**Base** (57 components) — form fields (`Input`, `NumberInput`, `PasswordInput`, `FileInput`, `CheckBox`, `Switch`, `RadioGroup`, `Select`, `MultiSelect`, `DatePicker`, `TimePicker`, `DateTimePicker`, `ComboBox`, `AutoComplete`, `FormField`), feedback (`Modal`, `Toast`, `Confirm`, `Alert`, `Spinner`, `Badge`, `Skeleton`), data display (`DataGrid`, `Pagination`, `Avatar`, `Tag`, `Rating`, `ProgressBar`, `ListItem`, `Sparkline`, `Statistic`), navigation (`Breadcrumb`, `Menu`, `Stepper`, `Tabs`, `Navbar`, `Sidebar`, `PageHeader`), layout (`Card`, `Divider`, `Stack`, `Flex`, `Container`, `Row`, `Col`), typography (`Text`), and more (`Button`, `IconButton`, `Tooltip`, `Popover`, `Accordion`, `Icon`, `RichComponentBase`, `ContextMenu`).
+**Base** (67 components) — form fields (`Input`, `NumberInput`, `PasswordInput`, `FileInput`, `CheckBox`, `Switch`, `RadioGroup`, `Select`, `MultiSelect`, `DatePicker`, `TimePicker`, `DateTimePicker`, `ComboBox`, `AutoComplete`, `FormField`), feedback (`Modal`, `Toast`, `Confirm`, `Alert`, `Spinner`, `Badge`, `Skeleton`), data display (`DataGrid`, `Pagination`, `Avatar`, `Tag`, `Rating`, `ProgressBar`, `ListItem`, `Sparkline`, `Statistic`), data visualization (`Chart`, `ChartLegend`, `LineChart`, `AreaChart`, `BarChart`, `StackedBarChart`, `DonutChart`, `PieChart`), scheduling (`Calendar`), documents (`DocumentViewer`), navigation (`Breadcrumb`, `Menu`, `Stepper`, `Tabs`, `Navbar`, `Sidebar`, `PageHeader`), layout (`Card`, `Divider`, `Stack`, `Flex`, `Container`, `Row`, `Col`), typography (`Text`), and more (`Button`, `IconButton`, `Tooltip`, `Popover`, `Accordion`, `Icon`, `RichComponentBase`, `ContextMenu`).
 
 `DataGrid` columns are declarative by default (`{ field: "conversion", header: "CONV.", align: "end" }`) — `render` stays available as the escape hatch for genuinely custom cells, and `format`/`formatter` cover the common presentation cases (`dataGridFormatters` exports the built-in `text`/`date`/`currency`/`boolean` set). `Card` accepts `title`/`subtitle`/`icon`/`avatar`/`actions`/`loading` directly, with `header` remaining as the raw escape hatch. `Tabs` supports `variant` (`default`/`underline`/`pill`/`card`/`button`), `orientation`, `size`, `stretch`, and per-item `icon`/`badge`, with roving-tabindex keyboard navigation.
 
@@ -295,25 +301,154 @@ nor Metronic ships a dark variant of those variables, and the light-mode shades
 measure about 2:1 on a dark neutral. An application with its own dark palette
 overrides the `--rrc-*` tokens, which are the documented integration point.
 
+## Charts
+
+Six full-size chart types share one responsive, accessible foundation — no SVG,
+Canvas, ResizeObserver or tooltip portal in your own code:
+
+```tsx
+import { LineChart } from "rich-react-component";
+
+<LineChart
+  title="Monthly training completion"
+  data={data}
+  xKey="month"
+  series={[
+    { key: "completed", label: "Completed" },
+    { key: "missing", label: "Missing" },
+  ]}
+/>
+```
+
+`LineChart`, `AreaChart`, `BarChart` (grouped, `orientation="vertical" |
+"horizontal"`), `StackedBarChart`, `DonutChart` and `PieChart` all accept
+`loading`/`error`/`isEmpty`, `showLegend`/`showTooltip`/`showDataLabels`,
+per-series `color`/`hidden`/`valueFormatter`, and `animate` (also forced off
+under `prefers-reduced-motion`). `Chart` is the shared responsive shell itself
+— public for a custom SVG/Canvas visualization that still wants the same
+sizing/status chrome — and `ChartLegend` is the shared, keyboard-operable
+series legend both `LineChart`/`AreaChart`/`BarChart`/`StackedBarChart` compose.
+
+Colors always come from theme tokens — `--rrc-chart-1` … `--rrc-chart-5` for
+the categorical palette, `--rrc-chart-grid`/`--rrc-chart-axis` for the grid
+and axis text, `--rrc-chart-tooltip-bg`/`--rrc-chart-tooltip-text` for the
+tooltip — never hardcoded in a component, so a custom color scheme repaints
+charts along with everything else.
+
+**Accessibility.** Every data point/bar/slice is a real, individually
+focusable, labelled target — arrow keys move between them, Enter/Space fires
+`onDataPointClick`/`onSliceClick`, exactly like a mouse click on the same
+point. A visually-hidden data table (or, for the circular charts, a
+name/value list) carries the same numbers for a screen reader user, so the
+chart's information is never conveyed by the drawing alone.
+
+**Known limitation.** Very large series (tens of thousands of points) are not
+virtualized or canvas-rendered — plain SVG, matching the same choice already
+made for `Sparkline`, rather than a new charting dependency.
+
+## Calendar
+
+A month-view event calendar — locale-aware, keyboard-operable, controlled or
+uncontrolled:
+
+```tsx
+<Calendar
+  locale="tr-TR"
+  weekStartsOn={1}          // 0 = Sunday, 1 = Monday
+  value={selectedDate}
+  onDateChange={setSelectedDate}
+  events={events}           // { id, title, start, end?, variant?, color?, disabled? }
+  onEventClick={handleEventClick}
+  onMonthChange={loadMonthEvents}
+/>
+```
+
+Month/weekday names come from native `Intl.DateTimeFormat` — no date library
+dependency. A day with more events than `maxEventsPerDay` (default 3) shows a
+"+N more" control instead of overflowing the cell; below the `md` breakpoint
+an agenda list of the selected day's events renders alongside the grid, via
+plain Bootstrap responsive utility classes (no `matchMedia`, so it stays
+SSR-safe).
+
+**Timezone contract.** Every comparison uses the `Date` object's own local
+getters (`getFullYear`/`getMonth`/`getDate`), never `Date.UTC` or ISO-string
+parsing for day-bucketing — an event never silently shifts a day across a
+timezone or DST boundary.
+
+**Known limitation.** Only `view="month"` renders in this release. The `view`
+prop and the `CalendarEvent` shape already accept `"week" | "day" | "agenda" |
+"scheduler"` so a future release can add them without a breaking prop change;
+passing one today falls back to month view with a development-mode warning.
+Drag-and-drop event moving is not supported.
+
+## DocumentViewer
+
+Previews a PDF or a common image format without your application touching
+PDF.js, a `<canvas>`, or a blob URL:
+
+```tsx
+<DocumentViewer
+  source={documentUrl}     // string URL, or a Blob/ArrayBuffer already in hand
+  fileName="risk-assessment.pdf"
+  mimeType="application/pdf"
+  onDownload={handleDownload}
+  onError={handlePreviewError}
+/>
+```
+
+Supports PDF, PNG, JPEG/JPG, WEBP and GIF. Page navigation, zoom, rotate,
+fit-to-width/fit-to-view and fullscreen (which reuses the existing `Modal`,
+escape-to-close included) are all built in. An unsupported file type never
+renders a broken viewer — it shows the file's name/type and a download action
+instead. Every built-in toolbar string can be overridden through the `labels`
+prop, since no central i18n catalog lives in the Base layer.
+
+**Dependency.** PDF rendering is powered by `pdfjs-dist`, this library's first
+runtime dependency — but it is only ever `import()`-ed when a PDF is actually
+previewed, so it lands in its own lazy chunk (verified via the real
+`vite build` output: `pdf-*.js` and `pdf.worker.min-*.js` are separate from
+`index.js`) and costs nothing for an application that only renders `Calendar`
+or a chart. Its Web Worker is resolved through a bundler-native asset import,
+so no manual worker configuration is needed in a Vite (or comparably
+capable) consumer build.
+
+**CORS/CSP.** A remote `source` URL is loaded the same way `<img src>` already
+is elsewhere in this library — the browser (or, for a PDF, `pdfjs-dist`'s own
+fetch/range-request handling) loads it directly, so the usual cross-origin
+rules apply: the URL's own server must allow it, and a strict CSP needs
+`worker-src` (for the PDF worker) and, for a cross-origin document, an
+appropriate `connect-src`/`img-src` entry.
+
+**Known limitations.** Fullscreen reuses `Modal` rather than the native
+Fullscreen API (consistent with `Modal`'s own documented not-yet-portalled
+limitation). No print action, text selection/search, or annotation layer
+inside a previewed PDF — page rendering only. `FilePreview` was deliberately
+not added as a second export; `DocumentViewer` is the only public name.
+
 ## Component showcase
 
-A dev-only application exercises the library live — not part of the published package:
+A dev-only application exercises the library live:
 
 ```bash
 npm run dev
 ```
 
-The showcase is a routed single-page application: a persistent shell (categorized
-Sidebar, header, appearance drawer) with one route per public visual component,
-each page showing a live Preview and the source that produced it.
-
-- `/overview/introduction` — the landing route
-- `/components/<category>/<component>` — one route per Base component
-- `/remote/<component>` and `/smart/<component>` — the Remote and Smart layers
-
-The demo consumes the library through its real public specifier
-(`rich-react-component`), never through private source paths, so the package
-boundary is exercised the way a consumer exercises it.
+The showcase is a routed single-page application: a persistent shell
+(categorized Sidebar, header, appearance drawer) with one route per public
+visual component, each page showing a live Preview and the source that produced
+it.
+
+- `/overview/introduction` — the landing route
+- `/overview/ensa-dashboard-example` — an application-style ENSA dashboard
+  example built from `rich-react-component` components only
+- `/components/<category>/<component>` — one route per Base component
+- `/remote/<component>` and `/smart/<component>` — the Remote and Smart layers
+
+The demo consumes the library through its real public specifier
+(`rich-react-component`) and the public stylesheet
+(`rich-react-component/style.css`), never through private source paths and never
+through a separate `demo.css`. Showcase-specific surface classes are
+`rrc-showcase-*`, owned by the package stylesheet.
 
 ## Scripts
 
@@ -336,13 +471,17 @@ src/
 ├── smart/    # Smart layer (Phases 1-5) — may depend on base/ and remote/
 └── index.ts  # public entry point
 
-demo/         # dev-only routed showcase application (not published)
-  registry/   #   authoritative route/category metadata + public-export inventory
-  shell/      #   persistent app shell: sidebar, header, drawers, preferences
-  pages/      #   one lazily loaded module per category
-  ui/         #   page standard and the Preview/Code example viewer
-  mocks/      #   deterministic in-memory HttpClient for the Remote demos
-```
+demo/         # dev-only routed showcase application (not published)
+  registry/   #   authoritative route/category metadata + public-export inventory
+  shell/      #   persistent app shell: sidebar, header, drawers, preferences
+  pages/      #   one lazily loaded module per category
+  ui/         #   page standard and the Preview/Code example viewer
+  mocks/      #   deterministic in-memory HttpClient for the Remote demos
+```
+
+`src/styles/showcase.css` contains the reusable `rrc-showcase-*` application
+surface that the showcase uses through `rich-react-component/style.css`; it is
+not imported directly by the demo app.
 
 ## Testing
 

package/dist/base/AreaChart.d.ts

@@ -0,0 +1,4 @@
+import { CartesianChartCoreProps } from './chart/CartesianChart';
+export type AreaChartProps = Omit<CartesianChartCoreProps, "kind" | "orientation" | "stacked">;
+/** Same API and interaction model as `LineChart`, filled to its baseline. See `CartesianChart`. */
+export declare function AreaChart(props: AreaChartProps): import("react").JSX.Element;

package/dist/base/BarChart.d.ts

@@ -0,0 +1,4 @@
+import { CartesianChartCoreProps } from './chart/CartesianChart';
+export type BarChartProps = Omit<CartesianChartCoreProps, "kind" | "stacked">;
+/** Grouped bars — each series in a category sits side by side. For stacked segments, use `StackedBarChart`. */
+export declare function BarChart(props: BarChartProps): import("react").JSX.Element;

package/dist/base/Calendar.d.ts

@@ -0,0 +1,54 @@
+import { ReactNode } from 'react';
+export type CalendarView = "month" | "week" | "day" | "agenda" | "scheduler";
+export type CalendarEventVariant = "primary" | "success" | "warning" | "danger" | "info" | "secondary";
+export interface CalendarEvent {
+    id: string;
+    title: string;
+    start: Date | string;
+    end?: Date | string;
+    allDay?: boolean;
+    color?: string;
+    variant?: CalendarEventVariant;
+    description?: string;
+    disabled?: boolean;
+    metadata?: Record<string, unknown>;
+}
+export interface CalendarProps {
+    value?: Date | null;
+    defaultValue?: Date | null;
+    onDateChange?: (date: Date) => void;
+    events?: CalendarEvent[];
+    /**
+     * Only `"month"` is implemented in this release. The type accepts the rest
+     * of the family so a future release can add them without a breaking prop
+     * change; passing one today falls back to `"month"` with a dev warning
+     * (known limitation — no week/day/agenda/scheduler view yet).
+     */
+    view?: CalendarView;
+    /** BCP 47 locale for month/weekday names via `Intl.DateTimeFormat`. */
+    locale?: string;
+    /** 0 = Sunday, 1 = Monday. */
+    weekStartsOn?: 0 | 1;
+    min?: Date;
+    max?: Date;
+    disabledDates?: (date: Date) => boolean;
+    maxEventsPerDay?: number;
+    loading?: boolean;
+    error?: ReactNode;
+    className?: string;
+    "aria-label"?: string;
+    todayLabel?: string;
+    moreLabel?: (count: number) => string;
+    noEventsLabel?: string;
+    onMonthChange?: (year: number, month: number) => void;
+    onEventClick?: (event: CalendarEvent) => void;
+}
+/**
+ * Month-view event calendar. Composes `Button`/`IconButton`/`Skeleton`/`Alert`
+ * for chrome rather than reimplementing them (doc: reuse, don't duplicate).
+ *
+ * Known limitations: only `view="month"` renders; no week/day/agenda/
+ * scheduler view and no drag-and-drop event moving yet — the `view` prop and
+ * `CalendarEvent` shape are deliberately future-proof for both.
+ */
+export declare function Calendar({ value, defaultValue, onDateChange, events, view, locale, weekStartsOn, min, max, disabledDates, maxEventsPerDay, loading, error, className, "aria-label": ariaLabel, todayLabel, moreLabel, noEventsLabel, onMonthChange, onEventClick, }: CalendarProps): import("react").JSX.Element;

package/dist/base/Chart.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { ChartCommonProps } from './chart/chartTypes';
+export interface ChartProps extends ChartCommonProps {
+    /** Render prop — receives the measured surface size once a real width is known (never called at width 0). */
+    children: (size: {
+        width: number;
+        height: number;
+    }) => ReactNode;
+    /** No data to plot (distinct from `loading`/`error`) — renders `emptyMessage` instead of an empty SVG. */
+    isEmpty?: boolean;
+    legend?: ReactNode;
+    /** Visually-hidden textual/table fallback for screen reader and keyboard users who don't perceive the SVG (doc: chart data needs a non-visual summary). */
+    summary?: ReactNode;
+}
+/**
+ * Low-level responsive shell every concrete chart (LineChart, BarChart, ...)
+ * composes for sizing + loading/empty/error chrome (doc: "Chart" is part of
+ * the public surface in its own right, for a consumer building a custom
+ * visualization without reimplementing that infrastructure).
+ *
+ * Deliberately not `role="img"`: a chart's data points are individually
+ * focusable (keyboard navigation between them), and `img` tells assistive
+ * tech to ignore all descendants. `group` plus the visually-hidden `summary`
+ * is what stays correct for an interactive chart.
+ */
+export declare function Chart({ title, height, loading, error, emptyMessage, disabled, className, animate, "aria-label": ariaLabel, isEmpty, legend, summary, children, }: ChartProps): import("react").JSX.Element;

package/dist/base/ChartLegend.d.ts

@@ -0,0 +1,22 @@
+import { ChartSeries } from './chart/chartTypes';
+export interface ChartLegendItem {
+    key: string;
+    label: string;
+    color: string;
+    hidden?: boolean;
+}
+export interface ChartLegendProps {
+    items: readonly ChartLegendItem[];
+    /** Toggles one series' visibility. Omit to render a read-only legend. */
+    onToggle?: (key: string) => void;
+    className?: string;
+}
+/**
+ * Series swatches + labels, shared by every chart (doc section 5 — public,
+ * reused rather than reimplemented per chart type). Each item is a real
+ * `<button>` when `onToggle` is supplied, so toggling a series is keyboard-
+ * and screen-reader-accessible, not a `<div onClick>`.
+ */
+export declare function ChartLegend({ items, onToggle, className }: ChartLegendProps): import("react").JSX.Element;
+/** Convenience: builds legend items straight from a chart's series list + resolved colors — the shape every concrete chart needs. */
+export declare function legendItemsFromSeries(series: readonly ChartSeries[], colorOverrides: string[] | undefined, hiddenKeys: ReadonlySet<string>): ChartLegendItem[];

package/dist/base/DocumentViewer.d.ts

@@ -0,0 +1,57 @@
+export type DocumentViewerSource = string | Blob | ArrayBuffer;
+export type DocumentViewerErrorKind = "unsupported" | "password-protected" | "corrupted" | "network" | "unknown";
+export interface DocumentViewerError {
+    kind: DocumentViewerErrorKind;
+    message: string;
+}
+export interface DocumentViewerLabels {
+    loading?: string;
+    unsupported?: string;
+    passwordProtected?: string;
+    corrupted?: string;
+    networkError?: string;
+    download?: string;
+    zoomIn?: string;
+    zoomOut?: string;
+    fitToWidth?: string;
+    fitToView?: string;
+    rotate?: string;
+    fullscreen?: string;
+    exitFullscreen?: string;
+    previousPage?: string;
+    nextPage?: string;
+    page?: string;
+    of?: string;
+    openInNewTab?: string;
+}
+export interface DocumentViewerProps {
+    source: DocumentViewerSource;
+    fileName?: string;
+    /** MIME type, when known. Falls back to a safe guess from `fileName`'s extension when omitted. */
+    mimeType?: string;
+    className?: string;
+    /** Viewer surface height. Defaults to a fixed comfortable reading height rather than growing unbounded with page content. */
+    height?: number | string;
+    initialPage?: number;
+    toolbar?: boolean;
+    allowFullscreen?: boolean;
+    allowNewTab?: boolean;
+    /** No central i18n catalog lives in Base (doc: Smart owns the one exception) — override the visible strings here instead. */
+    labels?: DocumentViewerLabels;
+    /** Called instead of the built-in download behavior when supplied. */
+    onDownload?: () => void;
+    onError?: (error: DocumentViewerError) => void;
+    onPageChange?: (page: number, totalPages: number) => void;
+}
+/**
+ * Previews PDF and common image formats without leaking SVG/canvas/portal
+ * plumbing to the consumer — a document/file card, a native `<embed>`, a
+ * third-party viewer, or a bespoke zoom/rotate/pagination toolbar are never
+ * something a consumer of this library builds by hand.
+ *
+ * `pdfjs-dist` is imported lazily (only once a PDF `source` is actually
+ * rendered), so an app that only ever previews images never pays for it.
+ * SVG/HTML/script sources are never rendered directly — anything outside the
+ * five supported formats below falls back to a file-info + download panel.
+ */
+export declare function DocumentViewer({ source, fileName, mimeType, className, height, initialPage, toolbar, allowFullscreen, allowNewTab, labels, onDownload, onError, onPageChange, }: DocumentViewerProps): import("react").JSX.Element;

package/dist/base/DonutChart.d.ts

@@ -0,0 +1,4 @@
+import { CircularChartBaseProps } from './chart/CircularChartBase';
+export type DonutChartProps = Omit<CircularChartBaseProps, "variant">;
+/** A `PieChart` with a cutout center — `centerLabel`/`centerValue` render inside it. */
+export declare function DonutChart(props: DonutChartProps): import("react").JSX.Element;

package/dist/base/LineChart.d.ts

@@ -0,0 +1,9 @@
+import { CartesianChartCoreProps } from './chart/CartesianChart';
+export type LineChartProps = Omit<CartesianChartCoreProps, "kind" | "orientation" | "stacked">;
+/**
+ * `<LineChart title="..." data={data} xKey="month" series={[...]} />` — a
+ * consumer never touches SVG, ResizeObserver or a tooltip portal (doc section
+ * 5). Composes the shared `CartesianChart` renderer with `AreaChart`,
+ * `BarChart` and `StackedBarChart`.
+ */
+export declare function LineChart(props: LineChartProps): import("react").JSX.Element;

package/dist/base/PieChart.d.ts

@@ -0,0 +1,4 @@
+import { CircularChartBaseProps } from './chart/CircularChartBase';
+export type PieChartProps = Omit<CircularChartBaseProps, "variant" | "innerRadiusRatio" | "centerLabel" | "centerValue">;
+/** A single metric broken into categories (`nameKey`/`valueKey` over `data`). For a cutout center, use `DonutChart`. */
+export declare function PieChart(props: PieChartProps): import("react").JSX.Element;

package/dist/base/StackedBarChart.d.ts

@@ -0,0 +1,4 @@
+import { CartesianChartCoreProps } from './chart/CartesianChart';
+export type StackedBarChartProps = Omit<CartesianChartCoreProps, "kind" | "stacked">;
+/** Every visible series stacks into one column per category. See `BarChart` for grouped bars. */
+export declare function StackedBarChart(props: StackedBarChartProps): import("react").JSX.Element;

package/dist/base/chart/CartesianChart.d.ts

@@ -0,0 +1,31 @@
+import { ChartCommonProps, ChartDatum, ChartInteraction, ChartSeries, ChartValue } from './chartTypes';
+export interface CartesianChartCoreProps extends ChartCommonProps {
+    kind: "line" | "area" | "bar";
+    data: ChartDatum[];
+    xKey: string;
+    series: ChartSeries[];
+    xAxisLabel?: string;
+    yAxisLabel?: string;
+    showGrid?: boolean;
+    showDataLabels?: boolean;
+    xFormatter?: (value: ChartValue) => string;
+    yFormatter?: (value: number) => string;
+    /** Bar/StackedBar only. */
+    orientation?: "vertical" | "horizontal";
+    /** Bar only — StackedBarChart always passes `true` and hides the prop from its own public API. */
+    stacked?: boolean;
+    onDataPointClick?: (interaction: ChartInteraction) => void;
+    onLegendItemClick?: (seriesKey: string, hidden: boolean) => void;
+    locale?: string;
+}
+/**
+ * Shared renderer behind LineChart/AreaChart/BarChart/StackedBarChart (doc:
+ * compose, don't reimplement per chart type — the only real differences
+ * between them are the mark shape and, for bars, orientation/stacking).
+ *
+ * Plain SVG, no charting dependency (the same call already made for
+ * `Sparkline`): a public API shaped around `data`/`xKey`/`series` stays
+ * implementation-agnostic, and the repository's Base layer has zero runtime
+ * dependencies today.
+ */
+export declare function CartesianChart({ kind, title, data, xKey, series, height, loading, error, emptyMessage, disabled, showLegend, showTooltip, showGrid, showDataLabels, animate, xAxisLabel, yAxisLabel, xFormatter, yFormatter, orientation, stacked, colors, className, onDataPointClick, onLegendItemClick, locale, "aria-label": ariaLabel, }: CartesianChartCoreProps): import("react").JSX.Element;

package/dist/base/chart/ChartSliceSummary.d.ts

@@ -0,0 +1,13 @@
+export interface ChartSliceSummaryProps {
+    items: readonly {
+        label: string;
+        value: number;
+    }[];
+}
+/**
+ * Visually-hidden textual/table fallback of a circular chart's data (doc:
+ * "ekran okuyucu için tablo veya metinsel veri özeti") — name/value pairs,
+ * the shape Donut/Pie slices actually have (`CartesianChart` builds its own
+ * equivalent table inline, since its shape — a series per column — differs).
+ */
+export declare function ChartSliceSummary({ items }: ChartSliceSummaryProps): import("react").JSX.Element;

package/dist/base/chart/ChartStatus.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { ChartStatusProps } from './chartTypes';
+export interface ChartStatusOverlayProps extends ChartStatusProps {
+    height: number;
+    emptyMessage?: ReactNode;
+}
+/**
+ * Loading/error/empty presentation shared by every chart (doc: "Chart,
+ * ChartLegend, ChartTooltip, ChartEmptyState" common infrastructure — kept as
+ * one internal piece rather than three, since none of the three states is
+ * ever shown without the others in this family).
+ *
+ * Not part of the public surface: each concrete chart decides when to render
+ * it, so there is nothing here a consumer would use standalone.
+ */
+export declare function ChartStatusOverlay({ loading, error, emptyMessage, height }: ChartStatusOverlayProps): import("react").JSX.Element;

package/dist/base/chart/ChartTooltip.d.ts

@@ -0,0 +1,22 @@
+export interface ChartTooltipPayloadItem {
+    key: string;
+    label: string;
+    value: string;
+    color: string;
+}
+export interface ChartTooltipPayload {
+    label: string;
+    items: ChartTooltipPayloadItem[];
+}
+export interface ChartTooltipProps {
+    payload: ChartTooltipPayload;
+    className?: string;
+}
+/**
+ * Summary of the currently focused/hovered data point (doc: tooltip).
+ * Deliberately not a cursor-following floating panel: that would need its own
+ * portal/collision-avoidance system duplicating `Popup`'s, for marginal gain —
+ * a fixed slot next to the chart (positioned by CSS, `.rrc-chart__tooltip`) is
+ * equally readable and stays keyboard- and touch-friendly without one.
+ */
+export declare function ChartTooltip({ payload, className }: ChartTooltipProps): import("react").JSX.Element;

package/dist/base/chart/CircularChartBase.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { ChartCommonProps, ChartDatum, ChartSliceInteraction } from './chartTypes';
+export interface CircularChartBaseProps extends ChartCommonProps {
+    variant: "donut" | "pie";
+    data: ChartDatum[];
+    nameKey: string;
+    valueKey: string;
+    /** Donut only — ratio of the inner cutout radius to the outer radius. Ignored (forced to 0) for `variant="pie"`. */
+    innerRadiusRatio?: number;
+    /** Donut only — rendered in the center cutout. */
+    centerLabel?: ReactNode;
+    centerValue?: ReactNode;
+    valueFormatter?: (value: number) => string;
+    showDataLabels?: boolean;
+    onSliceClick?: (interaction: ChartSliceInteraction) => void;
+}
+/** Shared renderer for DonutChart and PieChart. */
+export declare function CircularChartBase({ variant, data, nameKey, valueKey, innerRadiusRatio, centerLabel, centerValue, valueFormatter, showDataLabels, showLegend, colors, onSliceClick, ...chartProps }: CircularChartBaseProps): import("react").JSX.Element;

package/dist/base/chart/chartColors.d.ts

@@ -0,0 +1,4 @@
+import { ChartSeries } from './chartTypes';
+export declare function resolveChartColor(index: number, explicit: string | undefined, overrides: string[] | undefined): string;
+/** Resolves a color for every series in order — the shape `ChartLegend` and every concrete chart need. */
+export declare function chartSeriesColorList(series: readonly ChartSeries[], overrides: string[] | undefined): string[];

package/dist/base/chart/chartScales.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Minimal scale/tick math, written in-house rather than adding a dependency
+ * (d3-scale et al.) — the same call this repo already made for `Sparkline`.
+ * A handful of pure functions is enough for a band + linear axis and stays
+ * inside the library's zero-runtime-dependency footprint for the Base layer.
+ */
+export declare function linearScale(domain: [number, number], range: [number, number]): (value: number) => number;
+/** "Nice" round tick values spanning at least [min, max] — the standard d3-style rounding step. */
+export declare function niceTicks(min: number, max: number, count?: number): number[];
+/** Evenly divides `size` into `count` bands, returning each band's start offset and width. */
+export declare function bandScale(count: number, size: number, paddingRatio?: number): {
+    bandWidth: number;
+    offset: (index: number) => number;
+};
+export declare function defaultNumberFormatter(locale?: string): (value: number) => string;