haze-ui 1.32.0 → 1.34.0

package/dist/types/components/BackToTop/index.d.ts

@@ -1,2 +1,2 @@
-export { default as BackToTop } from './BackToTop';
-export type { BackToTopProps } from './BackToTop';
+export { default as BackToTop } from './BackToTop.js';
+export type { BackToTopProps } from './BackToTop.js';

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

@@ -1,10 +1,13 @@
-import type { CSSProperties, ReactNode } from 'react';
+import type { CSSProperties, ReactNode, Ref } from 'react';
 type BadgeProps = {
-    variant?: 'default' | 'success' | 'warning' | 'danger' | 'info';
+    /** Semantic status color. */
+    color?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
     size?: 'sm' | 'md';
     className?: string;
     style?: CSSProperties;
     children: ReactNode;
+    /** Forwarded to the root span (data-slot='badge'). */
+    ref?: Ref<HTMLSpanElement>;
 };
-export default function Badge({ variant, size, className, style, children, }: BadgeProps): import("react").JSX.Element;
+export default function Badge({ color, size, className, style, children, ref, }: BadgeProps): import("react").JSX.Element;
 export type { BadgeProps };

package/dist/types/components/Badge/badge-styles.d.ts

@@ -1,15 +1,16 @@
 /**
- * Shared Badge skin — the base, variant and size classes the `Badge`
+ * Shared Badge skin — the base, color and size classes the `Badge`
  * component wears. Living in their own module keeps the component file
  * free of style internals (react-refresh boundary) and lets the
- * variants/sizes maps ship as public constants (`badgeVariants` /
+ * colors/sizes maps ship as public constants (`badgeVariants` /
  * `badgeSizes`, the shadcn `buttonVariants` precedent) for consumers
  * composing custom elements with the same skin; split-css groups the
  * emitted CSS into `haze-ui/css/badge.css` with them.
  */
 export declare const base: import("@linaria/core").LinariaClassName;
-export declare const variants: {
+export declare const colors: {
     readonly default: import("@linaria/core").LinariaClassName;
+    readonly primary: import("@linaria/core").LinariaClassName;
     readonly success: import("@linaria/core").LinariaClassName;
     readonly warning: import("@linaria/core").LinariaClassName;
     readonly danger: import("@linaria/core").LinariaClassName;

package/dist/types/components/Badge/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Badge } from './Badge';
-export type { BadgeProps } from './Badge';
-export { variants as badgeVariants, sizes as badgeSizes } from './badge-styles';
+export { default as Badge } from './Badge.js';
+export type { BadgeProps } from './Badge.js';
+export { colors as badgeVariants, sizes as badgeSizes } from './badge-styles.js';

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

@@ -1,11 +1,14 @@
-import type { ReactNode } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { ControlOrValue } from 'react-use-control';
 type BannerProps = {
     visible?: ControlOrValue<boolean>;
     onClose?: () => void;
-    variant?: 'info' | 'success' | 'warning' | 'danger';
+    /** Semantic status color. */
+    color?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
     children: ReactNode;
     className?: string;
+    /** Forwarded to the root div (data-slot='banner'). */
+    ref?: Ref<HTMLDivElement>;
 };
-export default function Banner({ visible: visibleControl, onClose, variant, children, className, }: BannerProps): import("react").JSX.Element | null;
+export default function Banner({ visible: visibleControl, onClose, color, children, className, ref, }: BannerProps): import("react").JSX.Element | null;
 export type { BannerProps };

package/dist/types/components/Banner/banner-styles.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Shared Banner skin — the base and color classes the `Banner`
+ * component wears. Living in their own module keeps the component file
+ * free of style internals (react-refresh boundary) and lets the
+ * colors map ship as a public constant (`bannerVariants`, the shadcn
+ * `buttonVariants` precedent) for consumers composing custom elements
+ * with the same skin; split-css groups the emitted CSS into
+ * `haze-ui/css/banner.css` with them.
+ */
+export declare const banner: import("@linaria/core").LinariaClassName;
+export declare const colors: {
+    default: import("@linaria/core").LinariaClassName;
+    primary: import("@linaria/core").LinariaClassName;
+    info: import("@linaria/core").LinariaClassName;
+    success: import("@linaria/core").LinariaClassName;
+    warning: import("@linaria/core").LinariaClassName;
+    danger: import("@linaria/core").LinariaClassName;
+};
+export declare const closeBtn: import("@linaria/core").LinariaClassName;
+export declare const content: import("@linaria/core").LinariaClassName;

package/dist/types/components/Banner/index.d.ts

@@ -1,2 +1,3 @@
-export { default as Banner } from './Banner';
-export type { BannerProps } from './Banner';
+export { default as Banner } from './Banner.js';
+export type { BannerProps } from './Banner.js';
+export { colors as bannerVariants } from './banner-styles.js';

package/dist/types/components/BottomSheet/index.d.ts

@@ -1,2 +1,2 @@
-export { default as BottomSheet } from './BottomSheet';
-export type { BottomSheetProps, BottomSheetHandle } from './BottomSheet';
+export { default as BottomSheet } from './BottomSheet.js';
+export type { BottomSheetProps, BottomSheetHandle } from './BottomSheet.js';

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

@@ -1,8 +1,8 @@
-import type { ReactNode } from 'react';
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 type BreadcrumbProps = {
     separator?: ReactNode;
     className?: string;
     children: ReactNode;
-};
-export default function Breadcrumb({ separator, className, children, }: BreadcrumbProps): import("react").JSX.Element;
+} & Omit<ComponentPropsWithoutRef<'nav'>, 'children' | 'className'>;
+export default function Breadcrumb({ separator, 'aria-label': ariaLabel, className, children, ...rest }: BreadcrumbProps): import("react").JSX.Element;
 export type { BreadcrumbProps };

package/dist/types/components/Breadcrumb/BreadcrumbItem.d.ts

@@ -1,8 +1,26 @@
-import type { ReactNode } from 'react';
-type BreadcrumbItemProps = {
+import type { ComponentPropsWithRef, ElementType, ReactNode } from 'react';
+type BreadcrumbItemOwnProps = {
+    /** Link URL; omit for the current page (renders a non-link span). */
     href?: string;
-    className?: string;
     children: ReactNode;
 };
-export default function BreadcrumbItem({ href, className, children, }: BreadcrumbItemProps): import("react").JSX.Element;
-export type { BreadcrumbItemProps };
+/**
+ * MUI-OverridableComponent-shaped polymorphism (Button's pattern): own
+ * props first, then the target element's props minus the colliding keys.
+ * The skin and `data-slot` always land on the rendered element; the
+ * parent `<li>`'s `aria-current` wiring (Breadcrumb.tsx) is untouched by
+ * `as` — the trail semantics survive any element.
+ */
+type BreadcrumbItemProps<T extends ElementType = 'a'> = BreadcrumbItemOwnProps & {
+    /**
+     * Render element. Omitted (default) keeps the historical
+     * href-driven duality: `href` renders an `<a>` wearing the link
+     * skin, no `href` renders a `<span>` wearing the current-page skin.
+     * An explicit `as` overrides the element and opts into the link
+     * skin — the router-Link shape whose navigation lives in `to`
+     * rather than `href` (`href` still lands when actually passed).
+     */
+    as?: T;
+} & Omit<ComponentPropsWithRef<T>, keyof BreadcrumbItemOwnProps | 'as'>;
+export default function BreadcrumbItem<T extends ElementType = 'a'>({ href, as, className, children, ...rest }: BreadcrumbItemProps<T>): import("react").JSX.Element;
+export type { BreadcrumbItemOwnProps, BreadcrumbItemProps };

package/dist/types/components/Breadcrumb/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Breadcrumb } from './Breadcrumb';
-export type { BreadcrumbProps } from './Breadcrumb';
-export { default as BreadcrumbItem } from './BreadcrumbItem';
-export type { BreadcrumbItemProps } from './BreadcrumbItem';
+export { default as Breadcrumb } from './Breadcrumb.js';
+export type { BreadcrumbProps } from './Breadcrumb.js';
+export { default as BreadcrumbItem } from './BreadcrumbItem.js';
+export type { BreadcrumbItemProps } from './BreadcrumbItem.js';

package/dist/types/components/Button/ButtonLink.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
 /**
  * A real `<a>` with the full Button appearance — for navigation that
  * must look like a button.
@@ -31,16 +31,8 @@ type ButtonLinkProps = {
         icon?: ReactNode;
         text?: ReactNode;
     };
+    /** The rendered anchor (React 19 ref-as-prop — no forwardRef wrapper). */
+    ref?: Ref<HTMLAnchorElement>;
 } & ComponentPropsWithoutRef<'a'>;
-declare const ButtonLink: import("react").ForwardRefExoticComponent<{
-    variant?: "solid" | "outline" | "ghost";
-    size?: "sm" | "md" | "lg";
-    square?: boolean;
-    /** Busy state — same visual contract as Button's `loading`. */
-    loading?: boolean | {
-        icon?: ReactNode;
-        text?: ReactNode;
-    };
-} & Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
-export default ButtonLink;
+export default function ButtonLink({ size: sizeProp, ref, ...props }: ButtonLinkProps): import("react").JSX.Element;
 export type { ButtonLinkProps };

package/dist/types/components/Button/index.d.ts

@@ -1,5 +1,5 @@
-export { default as Button } from './Button';
-export type { ButtonProps } from './Button';
-export { default as ButtonLink } from './ButtonLink';
-export type { ButtonLinkProps } from './ButtonLink';
-export { variants as buttonVariants, sizes as buttonSizes } from './styles';
+export { default as Button } from './Button.js';
+export type { ButtonProps } from './Button.js';
+export { default as ButtonLink } from './ButtonLink.js';
+export type { ButtonLinkProps } from './ButtonLink.js';
+export { variants as buttonVariants, sizes as buttonSizes } from './styles.js';

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

@@ -0,0 +1,52 @@
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+/**
+ * Semantic slot classes for ButtonGroup (AntD v6 `classNames` shape;
+ * keys follow the data-slot names). The `separator` slot is inherited
+ * by every ButtonGroupSeparator child through context, so dividers are
+ * re-skinned once on the group.
+ */
+type ButtonGroupClassNames = {
+    /** The bar wrapper (data-slot='button-group'). */
+    root?: string;
+    /** Every divider (data-slot='separator'). */
+    separator?: string;
+};
+type ButtonGroupOwnProps = {
+    /** Group-wide size: the size every child Button wears unless the
+     * child sets its own. Same three steps as Button. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Group-wide variant: the variant every child Button wears unless
+     * the child sets its own (a bar reads best in one variant). */
+    variant?: 'solid' | 'outline' | 'ghost';
+    /** Stack the bar vertically; the seam merge switches to the block
+     * axis and buttons cross-stretch to the widest. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Disables every child button that does not disable itself — a
+     * child's explicit `disabled={false}` still wins. */
+    disabled?: boolean;
+    /** Slot classes (see {@link ButtonGroupClassNames}); `separator` is
+     * inherited by ButtonGroupSeparator children. */
+    classNames?: ButtonGroupClassNames;
+};
+type ButtonGroupProps = ButtonGroupOwnProps & {
+    /** The bar's buttons — real `Button` (or ButtonLink) elements. The
+     * group fills in `size`/`variant`/`disabled` where a child leaves
+     * them unset; non-element nodes pass through untouched. */
+    children: ReactNode;
+    className?: string;
+    /** Forwarded to the wrapper `<div>` (data-slot='button-group'). */
+    ref?: Ref<HTMLDivElement>;
+} & Omit<ComponentPropsWithoutRef<'div'>, keyof ButtonGroupOwnProps | 'className' | 'children'>;
+/**
+ * A row (or column) of buttons visually merged into one bar: leading
+ * corners, seam borders and divider rules collapse via CSS on the
+ * wrapper, while the children stay real, individually focusable
+ * buttons. The group is named — pass `aria-label` so screen readers
+ * announce the collection (`role='group'` is built in).
+ *
+ * The composition layer keeps no state: clicks, loading and busy UI
+ * stay on each Button. `size`/`variant`/`disabled` are group-wide
+ * defaults every child inherits unless it sets its own.
+ */
+export default function ButtonGroup({ size, variant, orientation, disabled, classNames, className, children, ref, ...rest }: ButtonGroupProps): import("react").JSX.Element;
+export type { ButtonGroupClassNames, ButtonGroupProps };

package/dist/types/components/ButtonGroup/ButtonGroupContext.d.ts

@@ -0,0 +1,28 @@
+/**
+ * The resolved skin a ButtonGroup hands down to its subtree: the
+ * group-wide `size`/`variant`, whether the group is `disabled`, and the
+ * bar's `orientation`. `ButtonGroupSeparator` consumes it to orient and
+ * ink itself; `Button` children pick the skin up through prop
+ * injection instead (Button is not wired to this context), so the
+ * context serves custom children composing the exported
+ * `buttonVariants`/`buttonSizes` skin classes.
+ */
+type ButtonGroupValue = {
+    size: 'sm' | 'md' | 'lg';
+    variant: 'solid' | 'outline' | 'ghost';
+    disabled: boolean;
+    orientation: 'horizontal' | 'vertical';
+    /** The group's `classNames.separator` slot, inherited by every
+     * ButtonGroupSeparator child (TagGroup's item-slot precedent). */
+    separatorClass?: string;
+};
+declare const ButtonGroupContext: import("react").Context<ButtonGroupValue | undefined>;
+declare const ButtonGroupProvider: import("react").Provider<ButtonGroupValue | undefined>;
+/**
+ * Reads the enclosing ButtonGroup's resolved skin. Returns `undefined`
+ * outside a group (a standalone ButtonGroupSeparator falls back to the
+ * horizontal-rule look and the group-less default ink).
+ */
+declare function useButtonGroup(): ButtonGroupValue | undefined;
+export { ButtonGroupContext, ButtonGroupProvider, useButtonGroup };
+export type { ButtonGroupValue };

package/dist/types/components/ButtonGroup/ButtonGroupSeparator.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+type ButtonGroupSeparatorProps = {
+    /** Divider glyph — an icon or a short label ("or") rendered as the
+     * split between the merged buttons. Omitted, the divider is the 1px
+     * rule. */
+    children?: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'span'>, 'children' | 'className'>;
+/**
+ * A divider between merged buttons. Not a button — it takes no focus
+ * and no clicks. Reads the owning group's skin from context: the rule
+ * runs across the bar's cross axis (a vertical rule inside a
+ * horizontal bar and vice versa) and inks inverse on solid bars, where
+ * the border color would vanish against the primary field. Renders a
+ * plain spanning rule outside a group.
+ */
+export default function ButtonGroupSeparator({ children, className, ...rest }: ButtonGroupSeparatorProps): import("react").JSX.Element;
+export type { ButtonGroupSeparatorProps };

package/dist/types/components/ButtonGroup/button-group-styles.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Shared ButtonGroup skin — the attached-bar merging rules the group
+ * wrapper wears, plus the divider classes `ButtonGroupSeparator`
+ * applies. Living in its own module keeps the component files free of
+ * style internals (react-refresh boundary); split-css groups the
+ * emitted CSS into `haze-ui/css/button-group.css`.
+ *
+ * ## Merging model
+ *
+ * Adjacent buttons merge into one bar with pure CSS — the group never
+ * rewraps its children (real `Button` elements render as-authored):
+ *
+ * - every child except the first loses its leading edge: a -1px margin
+ *   pulls it over the previous child's trailing border (two 1px borders
+ *   collapse onto the same seam pixel) and the leading border turns
+ *   transparent, so only the previous child's border ever paints the
+ *   seam — deterministic no matter which sibling is hovered, because
+ *   the two rules never touch the same element;
+ * - every child except the last loses its trailing corner radii, so the
+ *   bar keeps the rounded profile of a single button at both ends;
+ * - `role='separator'` children ride the same -1px pull: a 1px rule
+ *   lands exactly on the seam pixel it replaces.
+ *
+ * Orientation rides a `data-orientation` attribute on the wrapper. The
+ * `:not([data-orientation='vertical'])` / `[data-orientation='vertical']`
+ * branches are mutually exclusive, so no cascade order is ever
+ * load-bearing between them.
+ */
+export declare const group: import("@linaria/core").LinariaClassName;
+/** Shared divider chassis: centred content, takes no bar space beyond
+ * its own box. The 1px rule mode and the glyph mode both start here. */
+export declare const separatorBase: import("@linaria/core").LinariaClassName;
+/** Rule mode inside a horizontal bar: a vertical rule, inset from the
+ * button edges so it reads as a divider, not a broken border. */
+export declare const separatorRule: import("@linaria/core").LinariaClassName;
+/** Rule mode inside a vertical bar: the rule runs horizontally. */
+export declare const separatorRuleHorizontal: import("@linaria/core").LinariaClassName;
+/** Glyph mode: the divider is its children (an icon, a short "or"
+ * label). Sits between the merged buttons as its own cell. */
+export declare const separatorIcon: import("@linaria/core").LinariaClassName;
+/** Solid-bar ink: on a primary-colored field the border-colored rule
+ * would vanish, so the seam turns inverse with a dimmed opacity. */
+export declare const separatorInverse: import("@linaria/core").LinariaClassName;
+/** Glyph-mode counterpart of the inverse rule. */
+export declare const separatorIconInverse: import("@linaria/core").LinariaClassName;

package/dist/types/components/ButtonGroup/index.d.ts

@@ -0,0 +1,6 @@
+export { default as ButtonGroup } from './ButtonGroup.js';
+export type { ButtonGroupProps, ButtonGroupClassNames } from './ButtonGroup.js';
+export { default as ButtonGroupSeparator } from './ButtonGroupSeparator.js';
+export type { ButtonGroupSeparatorProps } from './ButtonGroupSeparator.js';
+export { useButtonGroup } from './ButtonGroupContext.js';
+export type { ButtonGroupValue } from './ButtonGroupContext.js';

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

@@ -1,4 +1,4 @@
-import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
 import type { ControlOrValue } from 'react-use-control';
 /** Granularity Calendar picks at. Each mode serializes its `value` and
  * `onSelect` payload to a plain string: `"YYYY-MM-DD"` (date), an ISO
@@ -18,6 +18,68 @@ type CalendarCellRender = (date: {
     month: number;
     day: number;
 }, mode: CalendarPickerMode) => ReactNode;
+/**
+ * Semantic slot classes (AntD v6 `classNames` shape): keys mirror the
+ * data-slot each part carries (`today-button`-style kebab slots surface
+ * as camelCase keys). Consumer classes are appended at the end of each
+ * part's class list (able to override component defaults) and compose
+ * with the root `className`; slots not rendered by the current
+ * `picker`/view (drill-down toolbars, quarter grid, dual-month panels,
+ * …) are ignored.
+ */
+type CalendarClassNames = {
+    /** The root wrapper `<div>` (`data-slot='calendar'`). */
+    root?: string;
+    /** The navigation header (`data-slot='header'`) — every mode's main
+     * header and the dual-month second pane's header. */
+    header?: string;
+    /** Every title node (`data-slot='title'`) — the header's drill-down
+     * month/year titles, the drill toolbars' decade/year titles and the
+     * dual-month pane titles, spans and buttons alike. */
+    title?: string;
+    /** Every ‹ previous button (`data-slot='prev'`). */
+    prev?: string;
+    /** Every › next button (`data-slot='next'`). */
+    next?: string;
+    /** The header's trailing actions cluster (`data-slot='actions'`) —
+     * Today button + next in the mode pickers. */
+    actions?: string;
+    /** The header's Today button (`data-slot='today-button'`). */
+    todayButton?: string;
+    /** Toolbar of a drill-down view (`data-slot='toolbar'`) — the
+     * quick-select month grid's year stepper and the decade grid's
+     * decade stepper. */
+    toolbar?: string;
+    /** One month pane's day grid (`data-slot='month'`, `role='grid'`). */
+    month?: string;
+    /** The weekday header row (`data-slot='weekday-row'`, `role='row'`). */
+    weekdayRow?: string;
+    /** One weekday column header (`data-slot='weekday'`). */
+    weekday?: string;
+    /** The week-number column header and row cells
+     * (`data-slot='week-number'`). */
+    weekNumber?: string;
+    /** One day cell button (`data-slot='day'`). */
+    day?: string;
+    /** Dual-month layout: the panes wrapper (`data-slot='months'`). */
+    months?: string;
+    /** Dual-month layout: one pane wrapper (`data-slot='month-panel'`). */
+    monthPanel?: string;
+    /** A month-cell grid (`data-slot='month-grid'`) — the quick-select
+     * month grid and the month picker mode's grid. */
+    monthGrid?: string;
+    /** One month cell button (`data-slot='month-cell'`). */
+    monthCell?: string;
+    /** The quarter picker mode's grid (`data-slot='quarter-grid'`). */
+    quarterGrid?: string;
+    /** One quarter cell button (`data-slot='quarter-cell'`). */
+    quarterCell?: string;
+    /** A year-cell grid (`data-slot='year-grid'`) — the decade drill-down
+     * and the year picker mode's grid. */
+    yearGrid?: string;
+    /** One year cell button (`data-slot='year-cell'`). */
+    yearCell?: string;
+};
 type CalendarProps = {
     /**
      * Granularity the calendar picks at. `"date"` (default) renders the
@@ -105,6 +167,15 @@ type CalendarProps = {
      * renders in. Opt-in: without it the cells render exactly as before.
      */
     cellRender?: CalendarCellRender;
+    /** Slot classes (see {@link CalendarClassNames}); each key lands on
+     * the parts carrying the matching data-slot, after the component
+     * defaults. */
+    classNames?: CalendarClassNames;
+    /**
+     * Forwarded to the root wrapper `<div>` (`data-slot='calendar'`) —
+     * the element tests and `ref.current.focus()` reach.
+     */
+    ref?: Ref<HTMLDivElement>;
 } & Omit<ComponentPropsWithoutRef<'div'>, 'onSelect'>;
-export default function Calendar({ picker, value: valueControl, min, max, disabledDate, locale, weekStartsOn, showWeekNumbers, months, rangeStart, rangeEnd, onSelect, cellRender, className, ...rest }: CalendarProps): import("react").JSX.Element;
-export type { CalendarProps, CalendarPickerMode, CalendarCellRender };
+export default function Calendar({ picker, value: valueControl, min, max, disabledDate, locale, weekStartsOn, showWeekNumbers, months, rangeStart, rangeEnd, onSelect, cellRender, classNames, className, ref, ...rest }: CalendarProps): import("react").JSX.Element;
+export type { CalendarProps, CalendarPickerMode, CalendarCellRender, CalendarClassNames };

package/dist/types/components/Calendar/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Calendar } from './Calendar';
-export type { CalendarProps, CalendarPickerMode, CalendarCellRender } from './Calendar';
+export { default as Calendar } from './Calendar.js';
+export type { CalendarProps, CalendarPickerMode, CalendarCellRender, CalendarClassNames } from './Calendar.js';

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

@@ -1,8 +1,35 @@
-import type { ReactNode } from 'react';
-type CardProps = {
+import type { ComponentPropsWithRef, ElementType, ReactNode } from 'react';
+type CardOwnProps = {
     variant?: 'elevated' | 'outlined' | 'filled';
-    className?: string;
     children: ReactNode;
 };
-export default function Card({ variant, className, children, }: CardProps): import("react").JSX.Element;
-export type { CardProps };
+/**
+ * MUI-OverridableComponent-shaped polymorphism (Button's pattern): own
+ * props first, then the target element's props minus the colliding keys.
+ * The skin and `data-slot` always land on the rendered element — the
+ * same "wiring wins" precedence as Button's `as`.
+ */
+type CardProps<T extends ElementType = 'div'> = CardOwnProps & {
+    /**
+     * Render element. `'div'` (default) keeps the plain container;
+     * `'a'` renders the whole card as a link — `href`, `target`, `rel`
+     * and the rest of the anchor surface flow through, and the anchor
+     * shape resets the UA link styling (block layout, no underline) so
+     * the card looks identical to the `div` form. Any component that
+     * forwards props to a DOM element works the same way (e.g. a router
+     * Link).
+     *
+     * A whole-card link must not contain nested interactive elements
+     * (anchors and buttons don't nest — invalid HTML and an SR/keyboard
+     * trap): keep secondary actions outside the card, or overlay a
+     * stretched link on a non-interactive card body.
+     */
+    as?: T;
+} & Omit<ComponentPropsWithRef<T>, keyof CardOwnProps | 'as'>;
+export declare const variants: {
+    readonly elevated: import("@linaria/core").LinariaClassName;
+    readonly outlined: import("@linaria/core").LinariaClassName;
+    readonly filled: import("@linaria/core").LinariaClassName;
+};
+export default function Card<T extends ElementType = 'div'>({ variant, as, className, children, ...rest }: CardProps<T>): import("react").JSX.Element;
+export type { CardOwnProps, CardProps };

package/dist/types/components/Card/index.d.ts

@@ -1,2 +1,3 @@
-export { default as Card } from './Card';
-export type { CardProps } from './Card';
+export { default as Card } from './Card.js';
+export type { CardProps } from './Card.js';
+export { variants as cardVariants } from './Card.js';

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

@@ -1,5 +1,23 @@
-import type { ReactNode } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { ControlOrValue } from 'react-use-control';
+/**
+ * Imperative handle exposed through the React 19 `ref` prop (same API
+ * choice as VirtualList/Dialog). All three methods only write the active
+ * index through the same control path the arrows and dots use, so
+ * controlled/uncontrolled semantics stay intact and the slide effect
+ * (scrollIntoView / data-active swap) remains single-sourced.
+ */
+type CarouselHandle = {
+    /** Step to the next slide (wraps past the last). */
+    next: () => void;
+    /** Step to the previous slide (wraps before the first). */
+    prev: () => void;
+    /**
+     * Jump to `index` — floored and clamped into the slide range, driving
+     * the same value path as the dot buttons.
+     */
+    scrollTo: (index: number) => void;
+};
 type CarouselProps = {
     value?: ControlOrValue<number>;
     autoPlay?: boolean;
@@ -10,6 +28,12 @@ type CarouselProps = {
     pauseOnHover?: boolean;
     className?: string;
     children: ReactNode;
+    /**
+     * Imperative handle: `next()` / `prev()` step with wrap-around,
+     * `scrollTo(index)` jumps (floored, clamped into the slide range).
+     * Writes go through the same control path as the arrows/dots.
+     */
+    ref?: Ref<CarouselHandle>;
 };
-export default function Carousel({ value: valueControl, autoPlay, interval, effect, pauseOnHover, className, children, }: CarouselProps): import("react").JSX.Element;
-export type { CarouselProps };
+export default function Carousel({ value: valueControl, autoPlay, interval, effect, pauseOnHover, className, children, ref, }: CarouselProps): import("react").JSX.Element;
+export type { CarouselProps, CarouselHandle };

package/dist/types/components/Carousel/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Carousel } from './Carousel';
-export type { CarouselProps } from './Carousel';
-export { default as CarouselSlide } from './CarouselSlide';
-export type { CarouselSlideProps } from './CarouselSlide';
+export { default as Carousel } from './Carousel.js';
+export type { CarouselProps, CarouselHandle } from './Carousel.js';
+export { default as CarouselSlide } from './CarouselSlide.js';
+export type { CarouselSlideProps } from './CarouselSlide.js';

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

@@ -19,6 +19,45 @@ type CascaderVirtualizedConfig = {
      * to VirtualList's 5. */
     overscan?: number;
 };
+/**
+ * Semantic slot classes (AntD v6 `classNames` shape): keys mirror the
+ * data-slot each part carries (`today-button`-style kebab slots surface
+ * as camelCase keys). Consumer classes are appended at the end of each
+ * part's class list (able to override component defaults); slots not
+ * rendered by the current mode (search input, loading/empty blocks,
+ * virtualized columns) are ignored.
+ */
+type CascaderClassNames = {
+    /** The root wrapper `<div>` (no data-slot — the family's root). */
+    root?: string;
+    /** The trigger `<button>` (`data-slot='trigger'`). */
+    trigger?: string;
+    /** The path-label row inside the trigger (`data-slot='value'`). */
+    value?: string;
+    /** Placeholder text while no value is committed (`data-slot='placeholder'`). */
+    placeholder?: string;
+    /** Path separators between levels (`data-slot='separator'`), and the
+     * option chevrons / trigger caret (`data-slot='icon'`). */
+    separator?: string;
+    /** The trigger caret and option chevrons (`data-slot='icon'`). */
+    icon?: string;
+    /** The floating drill-down panel (`data-slot='content'`). */
+    content?: string;
+    /** Search input of the remote-search panel (`data-slot='input'`). */
+    input?: string;
+    /** Columns host of the searchable panel (`data-slot='columns'`). */
+    columns?: string;
+    /** One drill-down column (`data-slot='column'`). */
+    column?: string;
+    /** One option row button (`data-slot='option'`). */
+    option?: string;
+    /** An option's label span (`data-slot='label'`). */
+    label?: string;
+    /** Loading state block (`data-slot='loading'`). */
+    loading?: string;
+    /** No-match block of the searchable panel (`data-slot='empty'`). */
+    empty?: string;
+};
 type CascaderProps = {
     /** Full option tree; each level becomes one column in the drill-down panel. */
     options: CascaderOption[];
@@ -61,11 +100,14 @@ type CascaderProps = {
      */
     virtualized?: boolean | CascaderVirtualizedConfig;
     className?: string;
+    /** Slot classes (see {@link CascaderClassNames}); each key lands on the
+     * part carrying the matching data-slot, after the component defaults. */
+    classNames?: CascaderClassNames;
     /**
      * Forwarded to the trigger `<button>` (not the root div) — the element
      * form bridges and `ref.current.focus()` reach.
      */
     ref?: Ref<HTMLButtonElement>;
 } & Omit<ComponentPropsWithoutRef<'div'>, 'onChange' | 'className'>;
-export default function Cascader({ options, value: valueControl, onChange, placeholder, changeOnSelect, expandTrigger, onSearch, loading, virtualized, className, ref, ...rest }: CascaderProps): import("react").JSX.Element;
-export type { CascaderProps, CascaderVirtualizedConfig };
+export default function Cascader({ options, value: valueControl, onChange, placeholder, changeOnSelect, expandTrigger, onSearch, loading, virtualized, className, classNames, ref, ...rest }: CascaderProps): import("react").JSX.Element;
+export type { CascaderProps, CascaderVirtualizedConfig, CascaderClassNames };

package/dist/types/components/Cascader/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Cascader } from './Cascader';
-export type { CascaderProps, CascaderOption } from './Cascader';
+export { default as Cascader } from './Cascader.js';
+export type { CascaderProps, CascaderOption, CascaderClassNames } from './Cascader.js';