@webority/ui-react 0.88.0 → 0.89.0

package/dist/types/components/AppButton.d.ts

@@ -4,47 +4,99 @@ export declare function buttonVariantClass(variant: any): string;
  *
  * @param {object} props
  * @param {import('react').ReactNode} props.children The label.
- * @param {"primary"|"secondary"|"outline"|"ghost"|"text"|"danger"|"success"|"secondary-danger"|"outline-danger"|"light"|"warning"|"neutral"|"outline-light"|"outline-secondary"|"subtle"} [props.variant="primary"] Emphasis level. subtle is deprecated (use neutral) and is removed in 0.79.0.
- * @param {"sm"|"md"|"lg"} [props.size="md"] Control size.
- * @param {"button"|"submit"|"reset"} [props.type="button"] The native button type; not emitted on a link-shaped button.
- * @param {boolean} [props.loading=false] Shows a spinner and disables the button while work runs; hides both icons.
- * @param {boolean} [props.disabled=false] Disables the button.
- * @param {boolean} [props.block=false] Full width of its container.
- * @param {string|import('react').ReactNode} [props.leftIcon=null] An icon name, or a node drawn as given.
- * @param {string|import('react').ReactNode} [props.rightIcon=null] An icon name, or a node drawn as given.
- * @param {string} [props.href] Render as a button-styled link (an <a href>) instead of a <button>; matches Razor <app-button href>.
- * @param {boolean} [props.static=false] Render as a NON-interactive element (a <span>) that keeps the
- *   button's chrome but does not click, focus, or hover — a resolved/confirmation label (e.g. "Verified")
- *   sized to sit where its action button was. Ignores loading/disabled/type/href.
- * @param {string} [props.tooltip] A collision-aware hover/focus tooltip (via AppTooltip / Popper) — flips to stay on-screen. For a labelled button use it sparingly (the label already says what it does); most useful on a terse or icon-led action.
- * @param {"auto"|"top"|"bottom"|"start"|"end"} [props.tooltipPlacement="auto"] Preferred tooltip side; `auto` picks the side with the most room.
- * @param {string} [props.shortcut] The key that runs this action ("A", "E", "/"), drawn as a key chip: in the tooltip when the button has one, otherwise after the label. Sets aria-keyshortcuts; the page binds the key itself (useListShortcuts). Ignored on a static button.
- * @param {"sheen"|"fill"|"expand"|"glow"|"roll"|"none"} [props.animation] Hover animation; omit for the default sheen. `roll` rolls the label up and slides a trailing `rightIcon` through a round well.
- * @param {boolean} [props.pinRightIcon=false] Pin the rightIcon (or the roll animation's icon well) to the button's end edge and centre the label; for a wide or full-width button.
- * @param {"rounded"|"pill"|"sharp"} [props.shape="rounded"] Corner shape: the default rounded squircle, a fully rounded pill, or sharp square corners.
- * @param {"linear"|"outline"|"bold"|"bulk"|"broken"|"twotone"} [props.iconVariant="linear"] The iconsax style of a named leftIcon / rightIcon; a node icon is drawn as given.
- * @param {string} [props.className=""] Extra classes on the button.
+ * @param {"primary"|"secondary"|"outline"|"ghost"|"text"|"danger"|"success"|"secondary-danger"|"outline-danger"|"light"|"warning"|"neutral"|"outline-light"|"outline-secondary"|"subtle"} [props.variant]
+ * @param {"sm"|"md"|"lg"} [props.size]
+ * @param {"button"|"submit"|"reset"} [props.type]
+ * @param {boolean} [props.loading]
+ * @param {boolean} [props.disabled]
+ * @param {boolean} [props.block]
+ * @param {string|import('react').ReactNode} [props.leftIcon]
+ * @param {string|import('react').ReactNode} [props.rightIcon]
+ * @param {string} [props.href]
+ * @param {boolean} [props.static]
+ * @param {string} [props.tooltip]
+ * @param {"auto"|"top"|"bottom"|"start"|"end"} [props.tooltipPlacement]
+ * @param {string} [props.shortcut]
+ * @param {"sheen"|"fill"|"expand"|"glow"|"roll"|"none"} [props.animation]
+ * @param {boolean} [props.pinRightIcon]
+ * @param {"rounded"|"pill"|"sharp"} [props.shape]
+ * @param {"linear"|"outline"|"bold"|"bulk"|"broken"|"twotone"} [props.iconVariant]
+ * @param {string} [props.className]
  * @param {(event: import('react').MouseEvent<HTMLElement>) => void} [props.onClick] Runs on a click; ignored on a static button.
  */
 export default function AppButton(props: {
     children: import('react').ReactNode;
+    /**
+     * Emphasis level. subtle is deprecated (use neutral) and is removed in 0.79.0.
+     * @default "primary"
+     */
     variant?: "primary" | "secondary" | "outline" | "ghost" | "text" | "danger" | "success" | "secondary-danger" | "outline-danger" | "light" | "warning" | "neutral" | "outline-light" | "outline-secondary" | "subtle";
+    /**
+     * Control size.
+     * @default "md"
+     */
     size?: "sm" | "md" | "lg";
+    /**
+     * The native button type; not emitted on a link-shaped button.
+     * @default "button"
+     */
     type?: "button" | "submit" | "reset";
+    /**
+     * Shows a spinner and disables the button while work runs; hides both icons.
+     * @default false
+     */
     loading?: boolean;
+    /**
+     * Disables the button.
+     * @default false
+     */
     disabled?: boolean;
+    /**
+     * Full width of its container.
+     * @default false
+     */
     block?: boolean;
+    /** An icon name, or a node drawn as given. */
     leftIcon?: string | import('react').ReactNode;
+    /** An icon name, or a node drawn as given. */
     rightIcon?: string | import('react').ReactNode;
+    /** Render as a button-styled link (an <a href>) instead of a <button>; matches Razor <app-button href>. */
     href?: string;
+    /**
+     * Render as a non-interactive element (a span) that keeps the button's chrome but does not click, focus or hover: a resolved or confirmation label (for example Verified) sized to sit where its action button was. Ignores loading, disabled, type and href.
+     * @default false
+     */
     static?: boolean;
+    /** A collision-aware hover and focus tooltip (through AppTooltip and Popper) that flips to stay on screen. For a labelled button use it sparingly, since the label already says what it does; it is most useful on a terse or icon-led action. */
     tooltip?: string;
+    /**
+     * Preferred tooltip side; auto picks the side with the most room.
+     * @default "auto"
+     */
     tooltipPlacement?: "auto" | "top" | "bottom" | "start" | "end";
+    /** The key that runs this action ("A", "E", "/"), drawn as a key chip: in the tooltip when the button has one, otherwise after the label. Sets aria-keyshortcuts; the page binds the key itself. Ignored on a static button. */
     shortcut?: string;
+    /** Hover animation; omit for the default sheen. roll rolls the label up and slides a trailing rightIcon through a round well. */
     animation?: "sheen" | "fill" | "expand" | "glow" | "roll" | "none";
+    /**
+     * Pin the rightIcon (or the roll animation's icon well) to the button's end edge and centre the label; for a wide or full-width button.
+     * @default false
+     */
     pinRightIcon?: boolean;
+    /**
+     * Corner shape: the default rounded squircle, a fully rounded pill, or sharp square corners.
+     * @default "rounded"
+     */
     shape?: "rounded" | "pill" | "sharp";
+    /**
+     * The iconsax style of a named leftIcon / rightIcon; a node icon is drawn as given.
+     * @default "linear"
+     */
     iconVariant?: "linear" | "outline" | "bold" | "bulk" | "broken" | "twotone";
+    /**
+     * Extra classes on the button.
+     * @default ""
+     */
     className?: string;
     onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
 }): any;

package/dist/types/components/AppButtonGroup.d.ts

@@ -6,18 +6,32 @@
  * actions, not a single-choice control; for one choice of several use `AppSegmented`).
  *
  * @param {object} props
- * @param {string} props.label Accessible name for the group ("Text style").
+ * @param {string} props.label
  * @param {import('react').ReactNode} props.children `AppButton`s (or button-styled links).
- * @param {'sm'|'md'|'lg'} [props.size='md'] One size for every button in the group.
- * @param {boolean} [props.vertical=false] Stack the buttons top to bottom.
- * @param {boolean} [props.fullWidth=false] Fill the container, the buttons sharing the row equally.
+ * @param {'sm'|'md'|'lg'} [props.size]
+ * @param {boolean} [props.vertical]
+ * @param {boolean} [props.fullWidth]
  * @param {string} [props.className]
  */
 export default function AppButtonGroup(props: {
+    /** Accessible name for the group ("Text style"). */
     label: string;
     children: import('react').ReactNode;
+    /**
+     * One size for every button in the group.
+     * @default "md"
+     */
     size?: 'sm' | 'md' | 'lg';
+    /**
+     * Stack the buttons top to bottom.
+     * @default false
+     */
     vertical?: boolean;
+    /**
+     * Fill the container, the buttons sharing the row equally.
+     * @default false
+     */
     fullWidth?: boolean;
+    /** Extra classes on the group. */
     className?: string;
 }): import("react").JSX.Element;

package/dist/types/components/AppCalendar.d.ts

@@ -1,5 +1,10 @@
 declare const AppCalendar: import("react").ForwardRefExoticComponent<{
+    /**
+     * The name a screen reader hears for the calendar.
+     * @default "Calendar"
+     */
     label?: string;
+    /** The events, instead of `eventsUrl`. Extra keys are kept and come back in `onEventClick`. */
     events?: {
         id?: string | number;
         title: string;
@@ -9,11 +14,17 @@ declare const AppCalendar: import("react").ForwardRefExoticComponent<{
         tone?: 'neutral' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
         url?: string;
     }[];
+    /** Called with `start` and `end` (IST days) whenever the visible period changes; answers a JSON list of events. */
     eventsUrl?: string;
+    /** The view to show. Without it a calendar opens on the month, or on the list when it is narrower than a phone. */
     view?: 'month' | 'week' | 'day' | 'list';
+    /** The IST day (`YYYY-MM-DD`) to show; today when omitted. Changing it moves the calendar. */
     date?: string;
+    /** What a list with no events says. */
     emptyText?: string;
+    /** First weekday of the calendar, 0 Sunday to 6 Saturday. Unset, it follows the theme's `--wui-first-day` token, which is 1 (Monday) unless the product sets it. */
     firstDay?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /** What is said when `eventsUrl` could not be loaded, and when the calendar's code could not. */
     errorText?: string;
     onEventClick?: (event: object) => (void | false);
     onDateClick?: (detail: {
@@ -28,7 +39,9 @@ declare const AppCalendar: import("react").ForwardRefExoticComponent<{
         end: string;
         title: string;
     }) => void;
+    /** Extra classes on the element. */
     className?: string;
+    /** Inline style on the element. */
     style?: import('react').CSSProperties;
 } & import("react").RefAttributes<HTMLElement>>;
 export default AppCalendar;

package/dist/types/components/AppCard.d.ts

@@ -7,61 +7,100 @@
  *
  * @param {object} props
  * @param {import('react').ReactNode} [props.title]
- * @param {import('react').ReactNode} [props.subtitle] Muted line under the title.
- * @param {string} [props.headerIcon] Leading header glyph — an Icon name (or a node).
+ * @param {import('react').ReactNode} [props.subtitle]
+ * @param {string} [props.headerIcon]
  * @param {string} [props.titleClassName]
- * @param {"sans"|"serif"} [props.titleFont="sans"] Face of the title. `serif` draws it in the display typeface.
- * @param {import('react').ReactNode} [props.header] Fully custom header — overrides title/subtitle/icon/extra/actions.
+ * @param {"sans"|"serif"} [props.titleFont]
+ * @param {import('react').ReactNode} [props.header]
  * @param {import('react').ReactNode} [props.headerExtra]
- * @param {import('react').ReactNode} [props.headerActions] Right-aligned header controls.
- * @param {import('react').ReactNode} [props.footer] Footer row (actions/meta), below the body.
- * @param {import('react').ReactNode} [props.media] Top media band (image/video), above the header.
+ * @param {import('react').ReactNode} [props.headerActions]
+ * @param {import('react').ReactNode} [props.footer]
+ * @param {import('react').ReactNode} [props.media]
  * @param {import('react').ReactNode} props.children
- * @param {"default"|"elevated"|"outlined"|"muted"|"accent"} [props.variant="default"]
- * @param {"primary"|"success"|"warning"|"danger"|"info"} [props.tone="primary"] Colours the `accent` stripe.
- * @param {"none"|"sm"|"md"|"lg"} [props.padding="md"] Header/body/footer padding preset. The
- *   default (md) is a uniform 20px; `none` clears only the body, for a table or list that runs
- *   edge to edge, and keeps the header and footer inset. For an arbitrary inset, add a class (see
- *   `className`) that sets the `--wui-card-pad` token instead of using this preset scale.
- * @param {"xs"|"sm"|"md"|"lg"|number|string} [props.maxWidth] Cap + centre a standalone card.
- * @param {string} [props.className] Extra classes on the `.card` root — the padding hook: a class
- *   here can set `--wui-card-pad` to retune the inset (the Razor counterpart is a plain `class`).
+ * @param {"default"|"elevated"|"outlined"|"muted"|"accent"} [props.variant]
+ * @param {"primary"|"success"|"warning"|"danger"|"info"} [props.tone]
+ * @param {"none"|"sm"|"md"|"lg"} [props.padding]
+ * @param {"xs"|"sm"|"md"|"lg"|number|string} [props.maxWidth]
+ * @param {string} [props.className]
  * @param {string} [props.bodyClassName]
  * @param {string} [props.headerClassName]
- * @param {boolean} [props.body=true] Wrap children in `.card-body`. False for a flush card.
- * @param {boolean} [props.lifted=false] 1px hover translate (.card-lifted) — not a drop shadow.
- * @param {string} [props.href] Makes the whole card a link.
+ * @param {boolean} [props.body]
+ * @param {boolean} [props.lifted]
+ * @param {string} [props.href]
  * @param {(e) => void} [props.onClick] Makes the whole card a button (when no href).
  * @param {import('react').ElementType} [props.linkComponent] Router link; receives `to` instead of `href`.
  * @param {() => void} [props.onClose] Called when the close button is pressed; the card then hides itself.
- * @param {boolean} [props.dismissible] Show a close button at the end of the header (defaults to true when onClose is set).
- * @param {string} [props.closeLabel="Close"] Accessible name of the close button.
+ * @param {boolean} [props.dismissible]
+ * @param {string} [props.closeLabel]
  */
 export default function AppCard(props: {
+    /** The heading shown in the card header. */
     title?: import('react').ReactNode;
+    /** Muted line under the title. */
     subtitle?: import('react').ReactNode;
+    /** Leading header glyph: an icon name (or a node). */
     headerIcon?: string;
+    /** Extra classes on the title. */
     titleClassName?: string;
+    /**
+     * Face of the title. `serif` draws it in the display typeface.
+     * @default "sans"
+     */
     titleFont?: "sans" | "serif";
+    /** Fully custom header: overrides title, subtitle, icon, extra and actions. */
     header?: import('react').ReactNode;
+    /** Extra content in the header, after the title. */
     headerExtra?: import('react').ReactNode;
+    /** Right-aligned header controls. */
     headerActions?: import('react').ReactNode;
+    /** Footer row (actions or meta), below the body. */
     footer?: import('react').ReactNode;
+    /** Top media band (image or video), above the header. */
     media?: import('react').ReactNode;
     children: import('react').ReactNode;
+    /**
+     * The visual treatment of the card.
+     * @default "default"
+     */
     variant?: "default" | "elevated" | "outlined" | "muted" | "accent";
+    /**
+     * Colours the `accent` stripe.
+     * @default "primary"
+     */
     tone?: "primary" | "success" | "warning" | "danger" | "info";
+    /**
+     * Header, body and footer padding preset. The default (md) is a uniform 20px; `none` clears only the body, for a table or list that runs edge to edge, and keeps the header and footer inset. For an arbitrary inset, add a class (see `className`) that sets the `--wui-card-pad` token instead of using this preset scale.
+     * @default "md"
+     */
     padding?: "none" | "sm" | "md" | "lg";
+    /** Cap and centre a standalone card. A preset (xs, sm, md, lg), a number of pixels or a CSS length. */
     maxWidth?: "xs" | "sm" | "md" | "lg" | number | string;
+    /** Extra classes on the `.card` root. The padding hook: a class here can set `--wui-card-pad` to retune the inset (the Razor counterpart is a plain `class`). */
     className?: string;
+    /** Extra classes on the card body. */
     bodyClassName?: string;
+    /** Extra classes on the card header. */
     headerClassName?: string;
+    /**
+     * Wrap children in `.card-body`. False for a flush card.
+     * @default true
+     */
     body?: boolean;
+    /**
+     * 1px hover translate (`.card-lifted`), not a drop shadow.
+     * @default false
+     */
     lifted?: boolean;
+    /** Makes the whole card a link. */
     href?: string;
     onClick?: (e: any) => void;
     linkComponent?: import('react').ElementType;
     onClose?: () => void;
+    /** Show a close button at the end of the header (defaults to true when onClose is set). */
     dismissible?: boolean;
+    /**
+     * Accessible name of the close button.
+     * @default "Close"
+     */
     closeLabel?: string;
 }): import("react").JSX.Element;

package/dist/types/components/AppCarousel.d.ts

@@ -15,38 +15,80 @@ import "@webority/ui-elements/elements/carousel";
  * stepping and the autoplay; the Razor `<app-carousel>` renders the same markup.
  *
  * @param {object} props
- * @param {string} props.label What the slides are ("Customer stories"): the carousel's accessible name.
- * @param {number} [props.autoplay] Milliseconds between automatic steps (5000 is typical). Omit for none.
- * @param {boolean} [props.loop=false] The previous and next buttons wrap around at the ends.
- * @param {number} [props.perView=1] Slides in view on a phone.
- * @param {number} [props.perViewMd] Slides in view from the md breakpoint. Defaults to `perView`.
- * @param {number} [props.perViewLg] Slides in view from the lg breakpoint. Defaults to `perViewMd`.
- * @param {boolean} [props.arrows=true] Show the previous and next buttons.
- * @param {boolean} [props.dots=true] Show the page dots.
- * @param {string} [props.previousLabel="Previous slide"] The previous button's name.
- * @param {string} [props.nextLabel="Next slide"] The next button's name.
- * @param {string} [props.dotLabel="Go to slide"] The words before the slide number in each dot's name.
- * @param {string} [props.pauseLabel="Pause"] The pause button's text and name while playing.
- * @param {string} [props.playLabel="Play"] The pause button's text and name while paused.
+ * @param {string} props.label
+ * @param {number} [props.autoplay]
+ * @param {boolean} [props.loop]
+ * @param {number} [props.perView]
+ * @param {number} [props.perViewMd]
+ * @param {number} [props.perViewLg]
+ * @param {boolean} [props.arrows]
+ * @param {boolean} [props.dots]
+ * @param {string} [props.previousLabel]
+ * @param {string} [props.nextLabel]
+ * @param {string} [props.dotLabel]
+ * @param {string} [props.pauseLabel]
+ * @param {string} [props.playLabel]
  * @param {string} [props.className]
- * @param {import('react').CSSProperties} [props.style] Merged after the per-view custom properties.
+ * @param {import('react').CSSProperties} [props.style]
  * @param {import('react').ReactNode} props.children The slides.
  */
 export default function AppCarousel(props: {
+    /** What the slides are ("Customer stories"): the carousel's accessible name. */
     label: string;
+    /** Milliseconds between automatic steps (5000 is typical). Omit for none. */
     autoplay?: number;
+    /**
+     * The previous and next buttons wrap around at the ends.
+     * @default false
+     */
     loop?: boolean;
+    /**
+     * Slides in view on a phone.
+     * @default 1
+     */
     perView?: number;
+    /** Slides in view from the md breakpoint. Defaults to `perView`. */
     perViewMd?: number;
+    /** Slides in view from the lg breakpoint. Defaults to `perViewMd`. */
     perViewLg?: number;
+    /**
+     * Show the previous and next buttons.
+     * @default true
+     */
     arrows?: boolean;
+    /**
+     * Show the page dots.
+     * @default true
+     */
     dots?: boolean;
+    /**
+     * The previous button's name.
+     * @default "Previous slide"
+     */
     previousLabel?: string;
+    /**
+     * The next button's name.
+     * @default "Next slide"
+     */
     nextLabel?: string;
+    /**
+     * The words before the slide number in each dot's name.
+     * @default "Go to slide"
+     */
     dotLabel?: string;
+    /**
+     * The pause button's text and name while playing.
+     * @default "Pause"
+     */
     pauseLabel?: string;
+    /**
+     * The pause button's text and name while paused.
+     * @default "Play"
+     */
     playLabel?: string;
+    /** Extra classes on the element. */
     className?: string;
+    /** Merged after the per-view custom properties. */
     style?: import('react').CSSProperties;
     children: import('react').ReactNode;
 }): import("react").JSX.Element;

package/dist/types/components/AppChart.d.ts

@@ -1,54 +1,90 @@
 declare const AppChart: import("react").ForwardRefExoticComponent<{
+    /** `column` is vertical bars, `bar` horizontal. `multiples` draws each series as its own small chart under one shared x axis. */
     type: 'line' | 'area' | 'column' | 'bar' | 'donut' | 'heatmap' | 'calendar' | 'funnel' | 'gauge' | 'waterfall' | 'treemap' | 'sankey' | 'scatter' | 'bubble' | 'multiples';
+    /** Required. Names the chart for assistive tech and names exported files. An empty string counts as not given. */
     title: string;
+    /** One sentence a screen reader hears before the automatic summary. */
     description?: string;
+    /** One row per x position, slice, cell, stage, flow or point: what a row is depends on the type. */
     data: Record<string, string | number | null>[];
+    /** The column holding the x value. `time` takes epoch ms, an ISO instant or a "YYYY-MM-DD" day; `value` (scatter and bubble) is a number. A calendar is always `time`, a scatter and a bubble always `value`. */
     x: {
         key: string;
         kind?: 'category' | 'time' | 'value';
         format?: object;
         label?: string;
     };
+    /** The value columns, in the order they take colours: at most 8. Every type but line, area, column, bar and multiples takes one. */
     series: {
         key: string;
         label: string;
         format?: object;
     }[];
+    /** The second dimension: a heatmap's rows, a treemap's parents, a scatter or bubble's colour groups (at most 3). Required for a heatmap and a treemap. */
     group?: {
         key: string;
         label?: string;
     };
+    /** Where each sankey flow ends; `x` is where it starts. Required for a sankey. */
     to?: {
         key: string;
         label?: string;
     };
+    /** A bubble's area. Required for a bubble. */
     size?: {
         key: string;
         label?: string;
         format?: object;
     };
+    /** A scatter or bubble's straight trend line through the visible points. */
     trend?: boolean;
+    /** A zoom slider under a line or area. On by default above 5,000 rows. */
     zoom?: boolean;
+    /** A gauge's named stretches of its scale, each up to a value. */
     bands?: {
         upTo: number;
         label: string;
     }[];
+    /**
+     * For area, column and bar.
+     * @default "none"
+     */
     stack?: 'none' | 'stacked' | 'percent';
+    /** The one value axis. There is no second axis: show another measure as its own chart. */
     y?: {
         label?: string;
         format?: object;
         min?: number;
         max?: number;
     };
+    /** A dashed reference line. */
     target?: {
         value: number;
         label: string;
     };
+    /**
+     * In px, the axis labels included. A value that is not above 0 draws at the default.
+     * @default 320
+     */
     height?: number;
+    /**
+     * `loading` after a first draw keeps that picture on screen, dimmed.
+     * @default "ready"
+     */
     state?: 'ready' | 'loading' | 'empty' | 'error';
+    /** Replaces the default empty message. */
     emptyText?: string;
+    /** Replaces the default error message. Say what the person can do. */
     errorText?: string;
+    /**
+     * `auto` draws SVG, and canvas above 5,000 points.
+     * @default "auto"
+     */
     renderer?: 'auto' | 'svg' | 'canvas';
+    /**
+     * `table` shows the data table in the chart's place.
+     * @default "chart"
+     */
     view?: 'chart' | 'table';
     onSelect?: (detail: {
         series: string;
@@ -64,7 +100,9 @@ declare const AppChart: import("react").ForwardRefExoticComponent<{
     onReady?: (detail: {
         renderer: string;
     }) => void;
+    /** Extra classes on the element. */
     className?: string;
+    /** Inline style on the element. */
     style?: import('react').CSSProperties;
 } & import("react").RefAttributes<HTMLElement>>;
 export default AppChart;

package/dist/types/components/AppChartCard.d.ts

@@ -20,20 +20,28 @@
  * ```
  *
  * @param {object} props
- * @param {string} props.title The card's heading. Also names the menu button for assistive tech.
- * @param {string} [props.subtitle] A muted line under the title: the unit or the period.
- * @param {boolean} [props.toolbar=true] Show the view controls.
+ * @param {string} props.title
+ * @param {string} [props.subtitle]
+ * @param {boolean} [props.toolbar]
  * @param {() => void} [props.onRetry] Adds a Try again button that shows while the chart is in its error state.
- * @param {import('react').ReactNode} [props.footer] A row under the chart: a source, an updated-at time, a link.
+ * @param {import('react').ReactNode} [props.footer]
  * @param {import('react').ReactNode} props.children The chart.
- * @param {string} [props.className] Extra classes on the card.
+ * @param {string} [props.className]
  */
 export default function AppChartCard(props: {
+    /** The card's heading. Also names the menu button for assistive tech. */
     title: string;
+    /** A muted line under the title: the unit or the period. */
     subtitle?: string;
+    /**
+     * Show the view controls.
+     * @default true
+     */
     toolbar?: boolean;
     onRetry?: () => void;
+    /** A row under the chart: a source, an updated-at time, a link. */
     footer?: import('react').ReactNode;
     children: import('react').ReactNode;
+    /** Extra classes on the card. */
     className?: string;
 }): import("react").JSX.Element;

package/dist/types/components/AppCheckbox.d.ts

@@ -1,13 +1,22 @@
 declare const AppCheckbox: import("react").ForwardRefExoticComponent<{
+    /** The text beside the box. Clicking it ticks the box. */
     label?: import('react').ReactNode;
+    /** The input's id. A unique id is generated when none is given. */
     id?: string;
+    /** The form field name, sent with the value on submit. */
     name?: string;
+    /** Controlled ticked state; pair with `onChange`. */
     checked?: boolean;
+    /** Starting state when the checkbox is uncontrolled. */
     defaultChecked?: boolean;
+    /** Locks the checkbox and dims it. */
     disabled?: boolean;
     onChange?: (event: import('react').ChangeEvent<HTMLInputElement>) => void;
+    /** Error message, rendered below the control. Replaces the hint. */
     error?: string;
+    /** Helper text below the control. Hidden while an error is shown. */
     hint?: string;
+    /** Extra classes on the element. */
     className?: string;
 } & import("react").RefAttributes<HTMLInputElement>>;
 export default AppCheckbox;

package/dist/types/components/AppChip.d.ts

@@ -10,32 +10,51 @@
  *   - neither    → a static, presentational chip.
  *
  * @param {object} props
- * @param {import('react').ReactNode} [props.label] Chip text (or use `children`).
+ * @param {import('react').ReactNode} [props.label]
  * @param {import('react').ReactNode} [props.children]
- * @param {"neutral"|"primary"|"success"|"warning"|"danger"|"info"} [props.tone="neutral"]
- * @param {"soft"|"outline"|"solid"} [props.variant="soft"] Colour treatment — a tinted
- *   surface (`soft`, default), a tinted surface with a coloured border (`outline`), or a
- *   filled pill with contrasting text (`solid`).
- * @param {"sm"|"md"} [props.size="md"]
- * @param {string} [props.leadingIcon] Semantic icon name for a leading glyph.
- * @param {string|import('react').ReactNode} [props.avatar] Leading avatar — an image URL or a node.
+ * @param {"neutral"|"primary"|"success"|"warning"|"danger"|"info"} [props.tone]
+ * @param {"soft"|"outline"|"solid"} [props.variant]
+ * @param {"sm"|"md"} [props.size]
+ * @param {string} [props.leadingIcon]
+ * @param {string|import('react').ReactNode} [props.avatar]
  * @param {() => void} [props.onRemove] Present → shows the dismiss ✕.
  * @param {() => void} [props.onClick] Present → the chip body is clickable.
- * @param {boolean} [props.disabled=false]
- * @param {string} [props.removeLabel] aria-label for the dismiss button.
+ * @param {boolean} [props.disabled]
+ * @param {string} [props.removeLabel]
  * @param {string} [props.className]
  */
 export default function AppChip(props: {
+    /** Chip text (or use `children`). */
     label?: import('react').ReactNode;
     children?: import('react').ReactNode;
+    /**
+     * The colour meaning: neutral by default, or a state or category.
+     * @default "neutral"
+     */
     tone?: "neutral" | "primary" | "success" | "warning" | "danger" | "info";
+    /**
+     * Colour treatment: a tinted surface (soft, the default), a tinted surface with a coloured border (outline), or a filled pill with contrasting text (solid).
+     * @default "soft"
+     */
     variant?: "soft" | "outline" | "solid";
+    /**
+     * sm for a denser chip; md by default.
+     * @default "md"
+     */
     size?: "sm" | "md";
+    /** Semantic icon name for a leading glyph. */
     leadingIcon?: string;
+    /** Leading avatar: an image URL or a node. */
     avatar?: string | import('react').ReactNode;
     onRemove?: () => void;
     onClick?: () => void;
+    /**
+     * Dims the chip and stops it from being pressed.
+     * @default false
+     */
     disabled?: boolean;
+    /** aria-label for the dismiss button. */
     removeLabel?: string;
+    /** Extra classes on the element. */
     className?: string;
 }): import("react").JSX.Element;