h2o-library 1.8.0 → 2.0.0

package/dist/components/index.d.ts

@@ -1,41 +1,36 @@
-export * from "./src/button";
-export * from "./src/checkbox";
-export * from "./src/icon";
-export * from "./src/radio";
-export * from "./src/tooltip";
-export * from "./src/toggle";
-export * from "./src/expandable";
-export * from "./src/content-switch";
-export * from "./src/input";
-export * from "./src/textarea";
-export * from "./src/dropdown";
-export * from "./src/side-panel";
-export * from "./src/modal";
-export * from "./src/tag";
-export * from "./src/accordion";
-export * from "./src/multi-select";
-export * from "./src/radio-group";
-export * from "./src/tabs";
-export * from "./src/status";
-export * from "./src/popover";
-export * from "./src/pagination";
-export * from "./src/table";
-export * from "./src/toast";
-export * from "./src/logo";
-export * from "./src/calendar";
-export * from "./src/month-calendar";
-export * from "./src/loader";
-export * from "./src/message";
-export * from "./src/multi-menu";
-export * from "./src/chart-heatmap";
-export * from "./src/compact-multi-select";
-export * from "./src/chart-line";
-export * from "./src/chart-bar";
-export * from "./src/chart-pie";
-export * from "./src/chart-stat";
-export * from "./src/date-range-picker";
-export * from "./src/legend";
-export * from "./src/chart";
-export * from "./src/expandable-table";
-export * from "./src/chip";
-export * from "./src/segmented-toggle";
+export * from "./src/button/button";
+export * from "./src/checkbox/checkbox";
+export * from "./src/icon/icon";
+export * from "./src/radio/radio";
+export * from "./src/tooltip/tooltip";
+export * from "./src/toggle/toggle";
+export * from "./src/content-switch/content-switch";
+export * from "./src/input/input";
+export * from "./src/textarea/textarea";
+export * from "./src/dropdown/dropdown";
+export * from "./src/slider/slider";
+export * from "./src/side-panel/side-panel";
+export * from "./src/modal/modal";
+export * from "./src/tag/tag";
+export * from "./src/accordion/accordion";
+export * from "./src/multi-select/multi-select";
+export * from "./src/radio-group/radio-group";
+export * from "./src/tabs/tabs";
+export * from "./src/popover/popover";
+export * from "./src/pagination/pagination";
+export * from "./src/table/table";
+export { ToastProvider, type ToastVariant, type ToastPosition, type ToastOptions, } from "./src/toast/toast";
+export * from "./src/logo/logo";
+export * from "./src/calendar/calendar";
+export * from "./src/month-calendar/month-calendar";
+export * from "./src/loader/loader";
+export * from "./src/message/message";
+export * from "./src/multi-menu/multi-menu";
+export * from "./src/compact-multi-select/compact-multi-select";
+export * from "./src/date-range-picker/date-range-picker";
+export * from "./src/expandable-table/expandable-table";
+export * from "./src/chip/chip";
+export * from "./src/segmented-toggle/segmented-toggle";
+export * from "./src/skeleton/skeleton";
+export * from "./src/date-picker/date-picker";
+export * from "./src/time-picker/time-picker";

package/dist/components/src/accordion/accordion.d.ts

@@ -0,0 +1,32 @@
+import "./accordion.css";
+import type React from "react";
+/**
+ * Props for the `Accordion` component — **fully controlled** open state.
+ *
+ * @property {string} title - Text on the always-visible trigger row.
+ * @property {boolean} isOpen - When true, the content area is expanded.
+ * @property {(isOpen: boolean) => void} onToggle - Called with the new open state when the user toggles.
+ * @property {React.ReactNode} children - Collapsible body content.
+ * @property {string} [description] - Subtitle under the title on the trigger.
+ * @property {boolean} [disabled] - When true, the trigger does not open. Default `false`.
+ */
+interface AccordionProps {
+    title: string;
+    isOpen: boolean;
+    onToggle: (isOpen: boolean) => void;
+    children: React.ReactNode;
+    description?: string;
+    disabled?: boolean;
+    className?: string;
+    containerClassName?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
+}
+/**
+ * Collapsible section with a button trigger, optional description, and height-animated content.
+ *
+ * @param {AccordionProps} props - Controlled `isOpen` + `onToggle` model.
+ * @returns {JSX.Element} The accordion shell, trigger, and panel region.
+ */
+export declare const Accordion: ({ title, isOpen, onToggle, children, description, disabled, containerClassName, className, titleClassName, descriptionClassName, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/button/button.d.ts

@@ -0,0 +1,41 @@
+import "./button.css";
+import type { IconType, TooltipPosition } from "../../../types";
+import React from "react";
+/**
+ * Extends native `HTMLButtonElement` attributes
+ *
+ * @property {"primary"|"secondary"|"ghost"|"danger"|"warning"|"success"} [variant] - Color/semantic style. Default `"primary"`.
+ * @property {"sm"|"md"|"lg"} [size] - Height and padding. Default `"md"`.
+ * @property {string} [label] - Button text; used when `iconOnly` is false.
+ * @property {import("../../../types").IconType} [icon] - Optional icon name from the icon set.
+ * @property {"left"|"right"} [iconPosition] - Icon position relative to the label. Default `"right"`.
+ * @property {boolean} [iconOnly] - Icon without visible text.
+ * @property {number} [iconStrokeWidth] - SVG stroke width for the icon. Default `1.5`.
+ * @property {boolean} [isLoading] - Shows a spinner and disables the button. Default `false`.
+ * @property {boolean} [fullWidth] - Stretches to 100% width of the container. Default `false`.
+ * @property {string} [tooltip] - If set, wraps the button in a `Tooltip` with this text.
+ * @property {import("../../../types").TooltipPosition} [tooltipPosition] - Tooltip position. Default `"top"`.
+ */
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: "primary" | "secondary" | "ghost" | "danger" | "warning" | "success";
+    size?: "sm" | "md" | "lg";
+    label?: string;
+    iconStrokeWidth?: number;
+    icon?: IconType;
+    iconPosition?: "left" | "right";
+    iconOnly?: boolean;
+    isLoading?: boolean;
+    fullWidth?: boolean;
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+    className?: string;
+}
+/**
+ * Renders button or wrapped in tooltip if `tooltip` prop is provided. accepts forwarded ref to the underlying button element.
+ *
+ * @param {ButtonProps} props
+ * @param {React.Ref<HTMLButtonElement>} ref
+ * @returns {React.ReactElement}
+ */
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export {};

package/dist/components/src/calendar/calendar.d.ts

@@ -0,0 +1,43 @@
+import "./calendar.css";
+/**
+ * @type {("single"|"range")} - Single date, or a start/end range (inclusive range mode behavior).
+ */
+export type CalendarMode = "single" | "range";
+/**
+ * Day grid calendar: single day or range, optional week selection, and disabled/min/max bounds.
+ *
+ * @property {CalendarMode} [mode] - `single` vs start/end `range`. Default `"single"`.
+ * @property {Date|[Date|null,Date|null]} [value] - Selected day or a tuple for range (nulls for partial range).
+ * @property {(v:Date|[Date|null,Date|null]) => void} [onChange] - Emits `Date` in single mode, tuple in range.
+ * @property {Date} [minDate] - No selection before this calendar day. Optional.
+ * @property {Date} [maxDate] - No selection after this calendar day. Optional.
+ * @property {boolean} [weekSelection] - In `range` mode, select whole weeks. Default `false`.
+ * @property {Date[]} [disabledDates] - Unselectable specific days.
+ * @property {0|1} [weekStartsOn] - 0 = Sunday, 1 = Monday. Default `0`.
+ */
+interface CalendarProps {
+    mode?: CalendarMode;
+    value?: Date | [Date | null, Date | null];
+    onChange?: (value: Date | [Date | null, Date | null]) => void;
+    minDate?: Date;
+    maxDate?: Date;
+    weekSelection?: boolean;
+    disabledDates?: Date[];
+    month?: Date;
+    onMonthChange?: (month: Date) => void;
+    hideHeader?: boolean;
+    hideOutsideDays?: boolean;
+    hoverDate?: Date | null;
+    onDayMouseEnter?: (date: Date) => void;
+    onDayMouseLeave?: () => void;
+    weekStartsOn?: 0 | 1;
+    className?: string;
+}
+/**
+ * Renders a navigable month grid; supports controlled `month`, hover state for range preview, and outside-month days.
+ *
+ * @param {CalendarProps} props - Mode, value, optional `weekSelection`, and `weekStartsOn`.
+ * @returns {JSX.Element} The calendar root with header and day cells.
+ */
+declare const Calendar: ({ mode, value, onChange, minDate, maxDate, weekSelection, disabledDates, month, onMonthChange, hideHeader, hideOutsideDays, hoverDate: externalHoverDate, onDayMouseEnter, onDayMouseLeave, weekStartsOn, className, }: CalendarProps) => JSX.Element | null;
+export { Calendar };

package/dist/components/src/checkbox/checkbox.d.ts

@@ -0,0 +1,58 @@
+import "./checkbox.css";
+import React from "react";
+import type { TooltipPosition } from "../../../types";
+/**
+ * Checkbox field: extends `HTMLInputElement` props except `type` and design-system `size`.
+ *
+ * @property {boolean} [isIndeterminate] - Sets the native `indeterminate` property (tri-state). Default `false`.
+ * @property {boolean} [isCard] - Card layout vs inline. Default `false`.
+ * @property {"sm"|"md"|"lg"} [size] - Scale. Default `"md"`.
+ * @property {string} [error] - Error text under the field; invalid styles when set.
+ */
+interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    label?: string;
+    containerClassName?: string;
+    labelClassName?: string;
+    isCard?: boolean;
+    isIndeterminate?: boolean;
+    error?: string;
+    note?: string;
+    size?: "sm" | "md" | "lg";
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+}
+/**
+ * Checkbox with optional label, card layout, indeterminate state, note/error rows, and label tooltip.
+ *
+ * @param {CheckboxProps} props - Extends native checkbox props; use `checked` / `onChange` for control.
+ * @param {React.Ref<HTMLInputElement>} ref - Forwarded to `<input type="checkbox">`.
+ * @returns {React.ReactElement} Wrapper and validation region.
+ */
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+/**
+ * Parent row that coordinates `Checkbox` children: tracks `checkedStates[]` and parent `indeterminate`.
+ *
+ * @property {string} label - Parent (select-all) row label.
+ * @property {React.ReactNode} children - Usually `Checkbox` elements whose `checked`/`defaultChecked` seed state.
+ * @property {(checkedStates: boolean[]) => void} [onChange] - Emits the full boolean array on any child toggle.
+ * @property {boolean} [disabled] - Disables the parent and children when `true`.
+ */
+interface CheckboxGroupProps {
+    label: string;
+    children: React.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    /** Called whenever any child changes, with the full array of checked states. */
+    onChange?: (checkedStates: boolean[]) => void;
+    size?: "sm" | "md" | "lg";
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+}
+/**
+ * Select-all / grouped checkboxes with derived parent `indeterminate` from child states.
+ *
+ * @param {CheckboxGroupProps} props - `label`, `children`, optional `onChange`.
+ * @returns {JSX.Element} Parent checkbox row and nested children.
+ */
+export declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
+export {};

package/dist/components/src/chip/chip.d.ts

@@ -0,0 +1,37 @@
+import "./chip.css";
+import type React from "react";
+import type { IconType, TooltipPosition } from "../../../types";
+/**
+ * Props for the `Chip` component: extends `HTMLAttributes<HTMLElement>` with H2O badge fields.
+ * `dot` and `icon` are mutually exclusive; if both are set, `icon` wins.
+ *
+ * @property {string} label - Visible text (required).
+ * @property {import("../../../types").IconType} [icon] - Leading icon; overrides `dot` when present.
+ * @property {"neutral"|"primary"|"success"|"warning"|"error"} [variant] - Color family. Default `"neutral"`.
+ * @property {"sm"|"md"|"lg"} [size] - Padding and font. Default `"md"`.
+ * @property {boolean} [dot] - Renders a status dot instead of an icon when no `icon`.
+ * @property {boolean} [showBorder] - Outlined style. Default `false`.
+ * @property {string} [tooltip] - Optional info tooltip on hover/focus.
+ */
+type ChipProps = React.HTMLAttributes<HTMLElement> & {
+    label: string;
+    icon?: IconType;
+    variant?: "neutral" | "primary" | "success" | "warning" | "error";
+    size?: "sm" | "md" | "lg";
+    iconStrokeWidth?: number;
+    iconClassName?: string;
+    iconSize?: number;
+    disabled?: boolean;
+    showBorder?: boolean;
+    dot?: boolean;
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+};
+/**
+ * Small label with optional icon or status dot, tooltip, and semantic `variant` colors.
+ *
+ * @param {ChipProps} props - Extends native element props; includes `label` and presentation.
+ * @returns {JSX.Element} A `span` or `button`-like chip per `onClick` usage.
+ */
+export declare const Chip: ({ label, icon, variant, size, iconStrokeWidth, iconClassName, iconSize, disabled, showBorder, dot, tooltip, tooltipPosition, className, onClick, ...props }: ChipProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/compact-multi-select/compact-multi-select.d.ts

@@ -0,0 +1,52 @@
+import "./compact-multi-select.css";
+import React from "react";
+import type { TooltipPosition } from "../../../types";
+/**
+ * One row in `CompactMultiSelect` `options`.
+ * @property {string} label - Visible text.
+ * @property {string} value - Stable id in the `onChange` payload.
+ * @property {boolean} [disabled] - Excludes or grays out the option. Default `false`.
+ */
+export interface CompactMultiSelectOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+/**
+ * Compact multi-select: tag list, optional search, max selections, and dropdown direction.
+ * **Controlled** via `value` / `onChange` as an array of {@link CompactMultiSelectOption}.
+ *
+ * @property {CompactMultiSelectOption[]} options - Full list to pick from.
+ * @property {CompactMultiSelectOption[]} [value] - Current selection; default `[]`.
+ * @property {(value: CompactMultiSelectOption[]) => void} [onChange] - Emits the new selection array.
+ * @property {number} [maxSelections] - Upper bound on selected count, if set.
+ */
+interface CompactMultiSelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "value"> {
+    size?: "sm" | "md" | "lg";
+    label?: string;
+    showClear?: boolean;
+    note?: string;
+    error?: string;
+    containerClassName?: string;
+    options: CompactMultiSelectOption[];
+    placeholder?: string;
+    value?: CompactMultiSelectOption[];
+    onChange?: (value: CompactMultiSelectOption[]) => void;
+    disabled?: boolean;
+    enableSearch?: boolean;
+    maxSelections?: number;
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+    direction?: "top" | "bottom" | "auto";
+    onOpen?: () => void;
+    onClose?: () => void;
+}
+/**
+ * Multi-value dropdown in a single row of tags; supports search, tooltips, and panel flip.
+ *
+ * @param {CompactMultiSelectProps} props - Options, selection, and layout props.
+ * @param {React.Ref<HTMLDivElement>} ref - Root wrapper ref.
+ * @returns {React.ReactElement} The field, tags, and open list.
+ */
+export declare const CompactMultiSelect: React.ForwardRefExoticComponent<CompactMultiSelectProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/src/content-switch/content-switch.d.ts

@@ -0,0 +1,39 @@
+import "./content-switch.css";
+import type { IconType } from "../../../types";
+/**
+ * Tab-like option in a `ContentSwitch` row (`role="tablist"` / `role="tab"`).
+ * @property {string} value - Passed to `onChange` when selected.
+ * @property {IconType} [icon] - Optional leading icon on the tab.
+ */
+export type ContentSwitchOption = {
+    label: string;
+    value: string;
+    icon?: IconType;
+    disabled?: boolean;
+};
+/**
+ * **Controlled** `selected` value string; `variant` picks primary vs secondary surface styles.
+ *
+ * @property {ContentSwitchOption[]} options - Tab definitions.
+ * @property {string} selected - Must match one `option.value` for the active tab.
+ * @property {(value: string) => void} onChange - Fires with the chosen `value`.
+ * @property {"primary"|"secondary"} [variant] - Style preset. Default `"primary"`.
+ */
+type ContentSwitchProps = {
+    options: ContentSwitchOption[];
+    variant?: "primary" | "secondary";
+    className?: string;
+    optionClassName?: string;
+    selected: string;
+    onChange: (value: string) => void;
+    disabled?: boolean;
+    ariaLabel?: string;
+};
+/**
+ * Underline / chip style tab strip for switching content; `role="tablist"` with keyboard focus on tabs.
+ *
+ * @param {ContentSwitchProps} props - `options`, `selected`, `onChange`, and global `disabled` to dim all.
+ * @returns {JSX.Element} The tablist container and one `button` tab per option.
+ */
+export declare const ContentSwitch: ({ options, selected, onChange, variant, className, optionClassName, disabled, ariaLabel, }: ContentSwitchProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/date-picker/date-picker.d.ts

@@ -0,0 +1,35 @@
+import "./date-picker.css";
+/**
+ * Date input with inline `Calendar` popover: single `Date` or start/end `range` tuple.
+ *
+ * @property {"single"|"range"} [mode] - Field format and `value`/`onChange` shape. Default `"single"`.
+ * @property {Date|null|[Date|null,Date|null]} [value] - `null` means cleared; range uses tuple with partial `null` while picking.
+ * @property {(v:Date|null|[Date|null,Date|null]) => void} [onChange] - Emits the same shape as `value`.
+ * @property {Date} [minDate] - Inclusive lower bound for the calendar. Optional.
+ * @property {Date} [maxDate] - Inclusive upper bound. Optional.
+ * @property {Date[]} [disabledDates] - Unselectable days. Default `[]`.
+ * @property {string} [placeholder] - Empty input text. Default `"MM/DD/YYYY"`.
+ */
+interface DatePickerProps {
+    mode?: "single" | "range";
+    value?: Date | null | [Date | null, Date | null];
+    onChange?: (value: Date | null | [Date | null, Date | null]) => void;
+    minDate?: Date;
+    maxDate?: Date;
+    disabledDates?: Date[];
+    placeholder?: string;
+    label?: string;
+    endLabel?: string;
+    disabled?: boolean;
+    className?: string;
+    error?: string;
+    note?: string;
+}
+/**
+ * Renders a text field that opens a `Calendar` for one date or a range, with min/max and disabled day rules.
+ *
+ * @param {DatePickerProps} props - `mode` drives value typing; `label` / `endLabel` for field captions.
+ * @returns {JSX.Element} The field group, popover calendar, and optional note/error.
+ */
+export declare const DatePicker: ({ mode, value, onChange, minDate, maxDate, disabledDates, placeholder, label, endLabel, disabled, className, error, note, }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/date-range-picker/date-range-picker.d.ts

@@ -0,0 +1,39 @@
+import "./date-range-picker.css";
+/**
+ * Built-in range shortcut id (e.g. `last_7_days`, `custom` to open the calendar only).
+ * @type {string}
+ */
+export type Preset = "today" | "last_7_days" | "last_30_days" | "last_3_months" | "last_6_months" | "last_12_months" | "month_to_date" | "year_to_date" | "next_7_days" | "next_30_days" | "next_3_months" | "next_6_months" | "next_12_months" | "rest_of_month" | "rest_of_year" | "custom";
+type PresetDirection = "last" | "next";
+/**
+ * Two-field range with preset radio list and embedded `Calendar` for `custom` / adjustments.
+ * **Controlled** via `value: [Date|null, Date|null]`.
+ *
+ * @property {[Date|null,Date|null]} [value] - Inclusive start/end; `null` slot means unset.
+ * @property {(value: [Date|null,Date|null]) => void} [onChange] - Emits the full tuple on change.
+ * @property {PresetDirection} [presetDirection] - `"last"` vs `"next"` preset menu. Default `"last"`.
+ * @property {Preset} [defaultPreset] - Initial active preset. Default `"custom"`.
+ * @property {(date: Date) => string} [formatDate] - Formats the two summary fields; default YYYY/MM/DD.
+ * @property {Date} [minDate] - Forwarded to `Calendar`. Optional.
+ * @property {Date} [maxDate] - Forwarded to `Calendar`. Optional.
+ */
+interface DateRangePickerProps {
+    value?: [Date | null, Date | null];
+    onChange?: (value: [Date | null, Date | null]) => void;
+    minDate?: Date;
+    maxDate?: Date;
+    disabledDates?: Date[];
+    presetDirection?: PresetDirection;
+    defaultPreset?: Preset;
+    /** Custom date display formatter. Defaults to YYYY/MM/DD. */
+    formatDate?: (date: Date) => string;
+    className?: string;
+}
+/**
+ * Renders preset radios plus a range `Calendar` and forwards remaining props (min/max, disabled days) to it.
+ *
+ * @param {DateRangePickerProps} props - `value`/`onChange` tuple, presets, and optional `className`.
+ * @returns {JSX.Element} The preset column, field pair, and popover `Calendar` when `custom` is active.
+ */
+export declare const DateRangePicker: ({ value, onChange, presetDirection, defaultPreset, formatDate, className, ...calendarProps }: DateRangePickerProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/dropdown/dropdown.d.ts

@@ -0,0 +1,53 @@
+import "./dropdown.css";
+import React from "react";
+import type { TooltipPosition } from "../../../types";
+/**
+ * One selectable item in a `Dropdown` `options` list.
+ *
+ * @property {string} label - User-visible text in the list and when selected.
+ * @property {string} value - Stable value passed to `onChange`.
+ * @property {boolean} [disabled] - When true, the option cannot be selected. Default `false`.
+ */
+export interface DropdownOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+/**
+ * Props for the `Dropdown` component. **Controlled** via `value` and `onChange`
+ * (selected option `value` string, or `undefined` when cleared).
+ *
+ * @property {DropdownOption[]} options - The full list to render and filter.
+ * @property {string|undefined} [value] - Selected option’s `value`, or `undefined` when empty/cleared.
+ * @property {(value: string|undefined) => void} [onChange] - Called on select or clear.
+ * @property {boolean} [enableSearch] - When true, filters options by a search string. Default `false`.
+ * @property {"top"|"bottom"|"auto"} [direction] - Where the panel opens relative to the field. Default `"auto"`.
+ */
+interface DropdownProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "value" | "onChange"> {
+    size?: "sm" | "md" | "lg";
+    label?: string;
+    showClear?: boolean;
+    note?: string;
+    error?: string;
+    containerClassName?: string;
+    options: DropdownOption[];
+    placeholder?: string;
+    value?: string;
+    onChange?: (value: string | undefined) => void;
+    enableSearch?: boolean;
+    direction?: "top" | "bottom" | "auto";
+    arrowClassName?: string;
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+    onOpen?: () => void;
+    onClose?: () => void;
+}
+/**
+ * Single-select combobox: trigger button, optional in-list search, clear, and field chrome (label, error, note).
+ *
+ * @param {DropdownProps} props - Controlled `value` / `onChange` and `options` list.
+ * @param {React.Ref<HTMLButtonElement>} ref - Reference to the trigger `<button>`.
+ * @returns {React.ReactElement} The closed trigger and absolutely positioned list when open.
+ */
+export declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLButtonElement>>;
+export {};

package/dist/components/src/expandable-table/expandable-table.d.ts

@@ -0,0 +1,61 @@
+import "./expandable-table.css";
+import React from "react";
+import type { SortDirection } from "../table/table";
+/**
+ * Column model for `ExpandableTable` (like `TableColumn` with an optional per-row expand body).
+ * @template T - Row type.
+ * @property {string} key - Field accessor and React `key` fragment for this column.
+ * @property {function(unknown, T): React.ReactNode} [render] - Custom cell; args are `row[key]` and `row`.
+ */
+export interface ExpandableTableColumn<T> {
+    key: string;
+    label: string;
+    sortable?: boolean;
+    minWidth?: string;
+    maxWidth?: string;
+    width?: string;
+    render?: (value: unknown, row: T) => React.ReactNode;
+}
+/**
+ * @template T
+ * @property {ExpandableTableColumn<T>[]} columns - Display columns; add `__selection` via table utilities if needed.
+ * @property {T[]} data - Row array.
+ * @property {function(T): React.ReactNode} [renderExpandedContent] - Renders under the row when that row is expanded.
+ * @property {T[]} [selectedRows] - **Controlled** selection; paired with `onSelectionChange` and `rowKey`.
+ * @property {keyof T} [rowKey] - Unique per row for selection keys. Default `id` if present.
+ */
+interface ExpandableTableProps<T extends Record<string, unknown>> {
+    columns: ExpandableTableColumn<T>[];
+    data: T[];
+    renderExpandedContent?: (row: T) => React.ReactNode;
+    isLoading?: boolean;
+    className?: string;
+    containerClassName?: string;
+    rowHeight?: string;
+    sortKey?: string;
+    sortDirection?: SortDirection;
+    currentPage?: number;
+    totalPages?: number;
+    perPage?: number;
+    perPageOptions?: {
+        label: string;
+        value: number;
+    }[];
+    onSort?: (key: string, direction: SortDirection) => void;
+    onPageChange?: (page: number) => void;
+    onPerPageChange?: (perPage: number) => void;
+    maxHeight?: string;
+    selectedRows?: T[];
+    onSelectionChange?: (rows: T[]) => void;
+    rowKey?: keyof T;
+    onRowClick?: (row: T, rowIndex: number) => void;
+}
+/**
+ * Data table with optional expandable row body (`renderExpandedContent`), sort, selection, and pagination.
+ *
+ * @template T - `Record<string, any>` row shape; `rowKey` picks stable identity.
+ * @param {object} props - `columns` / `data` plus optional `renderExpandedContent` for the slide-down.
+ * @returns {JSX.Element} The grid, expansion rows, and optional `Pagination` / `Loader`.
+ */
+export declare function ExpandableTable<T extends Record<string, unknown>>({ columns, data, renderExpandedContent, isLoading, className, rowHeight, sortKey, sortDirection, onSort, currentPage, totalPages, perPage, perPageOptions, onPageChange, onPerPageChange, maxHeight, containerClassName, selectedRows, onSelectionChange, rowKey, onRowClick, }: ExpandableTableProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/src/icon/icon-paths.d.ts

@@ -0,0 +1,3 @@
+import type React from "react";
+import type { IconType } from "../../../types";
+export declare const ICON_PATHS: Record<IconType, React.ReactNode>;

package/dist/components/src/icon/icon.d.ts

@@ -0,0 +1,28 @@
+import type React from "react";
+import type { IconType, TooltipPosition } from "../../../types";
+/**
+ * Props for the `Icon` component. Spreads onto the root `<svg>` (size, `className`, `aria-*`, etc.).
+ *
+ * @property {import("../../../types").IconType} icon - Registry key for the glyph to draw.
+ * @property {number} [size] - Width/height in px. Default `24`.
+ * @property {string|React.ReactNode} [tooltip] - If set, wraps the SVG in `Tooltip` (string → `text`; node → `content`).
+ * @property {import("../../../types").TooltipPosition} [tooltipPosition] - Placement when `tooltip` is set. Default `"top"`.
+ * @property {"dark"|"light"} [tooltipVariant] - Tooltip surface style. Default `"dark"`.
+ * @property {number} [strokeWidth] - SVG stroke width. Default `2`.
+ */
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    icon: IconType;
+    size?: number;
+    tooltip?: string | React.ReactNode;
+    tooltipPosition?: TooltipPosition;
+    tooltipVariant?: "dark" | "light";
+    strokeWidth?: number;
+}
+/**
+ * Renders a named vector icon from the library map, optionally inside a `Tooltip`.
+ *
+ * @param {IconProps} props - `icon` plus standard `SVGSVGElement` props.
+ * @returns {JSX.Element} A plain `<svg>` or a `Tooltip`-wrapped `<svg>`.
+ */
+export declare const Icon: ({ icon, size, tooltip, tooltipPosition, tooltipVariant, strokeWidth, ...props }: IconProps) => JSX.Element;
+export {};

package/dist/components/src/input/input.d.ts

@@ -0,0 +1,29 @@
+import "./input.css";
+import type { IconType, TooltipPosition } from "../../../types";
+/**
+ * Extends `HTMLInputElement` attributes
+ *
+ * @property {"sm"|"md"|"lg"} [size] - Field height and font scale. Default `"md"`.
+ * @property {import("../../../types").IconType} [leftIcon] - Optional left decorative/action icon.
+ * @property {import("../../../types").IconType} [rightIcon] - Optional right icon; pair with `onRightIconClick` for an action.
+ * @property {boolean} [showClear] - Shows a clear control when the field has a value. Default `false`.
+ * @property {string} [note] - Helper text below the field (non-error).
+ * @property {string} [error] - Error message; styles the field as invalid when set.
+ * @property {string} [tooltip] - Info `Tooltip` on the label (via info icon) when set.
+ * @property {import("../../../types").TooltipPosition} [tooltipPosition] - Tooltip position for `tooltip`. Default `"top"`.
+ */
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
+    size?: "sm" | "md" | "lg";
+    label?: string;
+    leftIcon?: IconType;
+    rightIcon?: IconType;
+    onRightIconClick?: () => void;
+    showClear?: boolean;
+    note?: string;
+    error?: string;
+    containerClassName?: string;
+    tooltip?: string;
+    tooltipPosition?: TooltipPosition;
+}
+export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};