@ufoui/core 0.0.40 → 0.0.88

package/assets/index.d.ts

@@ -1 +1,2 @@
 export * from './icons';
+export * from './spinners';

package/assets/spinners.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+type SvgProps = React.ComponentPropsWithoutRef<'svg'>;
+type CircleProps = React.ComponentPropsWithoutRef<'circle'>;
+interface SpinnerRingSvgProps extends SvgProps {
+    trackProps?: CircleProps;
+    indicatorProps?: CircleProps;
+}
+export declare const SpinnerRingSvg: ({ trackProps, indicatorProps, ...props }: SpinnerRingSvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerDotsSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerBladeSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerBarsSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerOrbitSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerArcSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerStepBarSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerDualRingSvg: (props: SvgProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/components/actions/actions.d.ts

@@ -0,0 +1,55 @@
+import { default as React, ReactElement, ReactNode } from 'react';
+/**
+ * Slot contract for components that can act as actions.
+ *
+ * @category Actions
+ */
+export interface ActionProps {
+    /** Text label for the action. */
+    label?: string;
+    /** Accessible label for actions without visible text. */
+    'aria-label'?: string;
+    /** Leading icon for the action. */
+    icon?: React.ReactElement;
+    /** Custom leading slot content. */
+    leading?: ReactNode;
+    /** Custom trailing slot content. */
+    trailing?: ReactNode;
+    /** Disables the action. */
+    disabled?: boolean;
+}
+/**
+ * Props for action groups used by surface components such as cards and dialogs.
+ *
+ * @category Actions
+ */
+export interface ActionsProps {
+    /** Action elements rendered inside the group. */
+    actions?: ReactNode;
+    /** Alignment of the action group. */
+    align?: 'start' | 'center' | 'end';
+    /** Stacks actions vertically instead of horizontally. */
+    stack?: boolean;
+    /** Additional class names for the action wrapper. */
+    className?: string;
+    /** Maximum number of visible actions before the rest collapse into an overflow menu. */
+    maxActions?: number;
+    /** Accessible label for the overflow actions button. Default: "More actions" */
+    moreLabel?: string;
+    /** Custom icon for the overflow actions button. */
+    moreIcon?: ReactElement;
+}
+/**
+ * Shared action group renderer used by components that expose footer or inline actions.
+ *
+ * Filters children to known action elements and applies placement, alignment,
+ * and stacking styles.
+ *
+ * @category Actions
+ */
+declare const Actions: {
+    ({ actions, className, align, stack, maxActions, moreLabel, moreIcon }: ActionsProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export { Actions as DialogActions, Actions as CardActions };
+export type { ActionsProps as DialogActionsProps, ActionsProps as CardActionsProps };

package/components/actions/actions.guards.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { ActionProps } from './actions';
+export declare const IS_ACTION: unique symbol;
+/**
+ * Type guard that checks whether a React node is an action component.
+ *
+ * Identifies action elements by the internal {@link IS_ACTION} symbol
+ * attached to the component type.
+ *
+ * @param el - React node to test.
+ * @returns `true` if the node is an action element.
+ *
+ * @internal
+ */
+export declare function isAction(el: ReactNode): el is ReactElement<ActionProps>;

package/components/avatar/avatar.d.ts

@@ -6,7 +6,7 @@ import { ElementSize } from '../../utils';
  *
  * @category Avatar
  */
-export interface AvatarProps extends Omit<BoxBaseProps, 'component' | 'elementClass'> {
+export interface AvatarProps extends Omit<BoxBaseProps, 'as' | 'elementClass'> {
     /** Size token controlling width and height. */
     size?: ElementSize;
     /** Image source URL. */
@@ -21,8 +21,8 @@ export interface AvatarProps extends Omit<BoxBaseProps, 'component' | 'elementCl
 /**
  * Avatar identity component displaying image, initials, or custom content.
  *
- * Automatically derives a background color from name when no image
- * and no explicit color are provided.
+ * Automatically derives a fallback background color from name when no image
+ * and no explicit color are provided, using semantic and extended color pools.
  *
  * @function
  * @param props Component properties.

package/components/badge/badge.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import { ElementBorder, ElementElevation, ElementFont, ElementPlacement, ElementShape, ElementSize } from '../../utils/utils';
+import { ElementBorder, ElementElevation, ElementFont, ElementPlacement, ElementShape, ElementSize } from '../../utils';
 import { BorderColor, SemanticColor } from '../../utils/color';
 /**
  * Props for the Badge component.

package/components/base/boxBase.d.ts

@@ -32,6 +32,8 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     alignContent?: CSSProperties['alignContent'];
     /** Maps to `align-items` (cross-axis alignment). */
     alignItems?: CSSProperties['alignItems'];
+    /** Custom HTML element/component. Default: `div`. */
+    as?: ElementType;
     /** Border width (0–5). */
     border?: ElementBorder;
     /** Border color token. */
@@ -44,8 +46,6 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     color?: BaseColor;
     /** Grid template columns (`3` → `repeat(3, 1fr)`). */
     cols?: number | string;
-    /** Custom HTML element/component. Default: `div`. */
-    component?: ElementType;
     /** Layout direction (`row` or `col`) for flex. Ignored if `row` or `col` is set. */
     direction?: BoxDirection;
     /** Native disabled attribute. Applied when supported by the rendered element. */
@@ -70,6 +70,8 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     gapY?: number | string;
     /** Enables flex-grow (fills remaining space). */
     grow?: boolean;
+    /** Height. */
+    h?: number | string;
     /** Renders as `inline-flex`, `inline-grid` or `inline-block`. */
     inline?: boolean;
     /** Maps to `justify-content` (main-axis alignment). */
@@ -98,12 +100,10 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     shape?: ElementShape;
     /** Layout mode (`flex`, `grid`, `block`). Default: `flex`. */
     type?: BoxType;
-    /** Enables wrapping (`flex-wrap: wrap`). */
-    wrap?: boolean;
     /** Width. */
     w?: number | string;
-    /** Height. */
-    h?: number | string;
+    /** Enables wrapping (`flex-wrap: wrap`). */
+    wrap?: boolean;
 }
 /**
  * `BoxBase` — core layout primitive powering all semantic containers

package/components/base/dialogBase.d.ts

@@ -1,6 +1,6 @@
 import { default as React, ReactElement, ReactNode } from 'react';
 import { BorderColor, ElementElevation, ElementFont, ElementOutline, ElementShape, ElementSize, SurfaceColor } from '../../utils';
-import { DialogAnimation, DialogIconSlot, DialogType, MotionStyle } from '../../types';
+import { DialogIconSlot, DialogType, MotionAnimation, MotionStyle } from '../../types';
 /**
  * Props for the DialogBase component.
  *
@@ -39,7 +39,7 @@ export interface DialogBaseProps {
     /** Renders the panel in detached layout style. */
     detached?: boolean;
     /** Animation preset; `'none'` disables motion. */
-    animation?: DialogAnimation;
+    animation?: MotionAnimation;
     /** Duration in milliseconds for open and close animations. Default: 500 */
     duration?: number;
     /** Whether the dialog closes when the backdrop is clicked. Default: true */

package/components/base/textBase.d.ts

@@ -10,23 +10,23 @@ import { BorderColor, ElementBorder, ElementElevation, ElementFont, ElementShape
  */
 export interface TextBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'> {
     /** Custom HTML element/component. Default: span. */
-    component?: React.ElementType;
-    /** Font token controlling typography (size, weight, line-height). */
-    font?: ElementFont;
-    /** Surface background token. */
-    color?: SurfaceColor;
-    /** Elevation level (0–5). */
-    elevation?: ElementElevation;
-    /** Shape/border-radius token. */
-    shape?: ElementShape;
+    as?: React.ElementType;
     /** Border width (0–5). */
     border?: ElementBorder;
     /** Border color token. */
     borderColor?: BorderColor;
-    /** Semantic UUI element class (e.g. uui-text, uui-heading). */
-    elementClass?: string;
     /** Text content. */
     children?: ReactNode;
+    /** Surface background token. */
+    color?: SurfaceColor;
+    /** Semantic UUI element class (e.g. uui-text, uui-heading). */
+    elementClass?: string;
+    /** Elevation level (0–5). */
+    elevation?: ElementElevation;
+    /** Font token controlling typography (size, weight, line-height). */
+    font?: ElementFont;
+    /** Shape/border-radius token. */
+    shape?: ElementShape;
 }
 /**
  * TextBase — core typography primitive powering semantic text components.

package/components/breadcrumbs/breadcrumbs.d.ts

@@ -30,7 +30,7 @@ export interface BreadcrumbsProps extends BoxBaseProps {
     renderItem?: (item: BreadcrumbItem, index: number) => ReactNode;
     renderSeparator?: (index: number) => ReactNode;
     renderCollapse?: (items: BreadcrumbItem[]) => ReactNode;
-    component?: ElementType;
+    as?: ElementType;
     itemComponent?: ElementType;
     density?: ElementDensity;
     font?: ElementFont;

package/components/button/button.d.ts

@@ -1,4 +1,4 @@
-import { ButtonBaseProps } from '../base/buttonBase';
+import { ButtonBaseProps } from '../base';
 /**
  * Props for {@link Button}.
  * Extends {@link ButtonBaseProps}.

package/components/card/card.d.ts

@@ -1,15 +1,41 @@
-import { HTMLProps } from 'react';
-import { ElementPlacement, ElementShape, ElementSize } from '../../utils/utils';
-import { SemanticColor } from '../../utils/color';
-export interface CardProps extends Omit<HTMLProps<HTMLSpanElement>, 'ref' | 'size'> {
-    value: string | number;
-    color?: SemanticColor;
-    position?: ElementPlacement;
-    size?: ElementSize;
+import { default as React, ElementType, ReactNode } from 'react';
+import { BorderColor, ElementElevation, ElementShape, SurfaceColor } from '../../utils';
+import { MotionAnimation, MotionStyle } from '../../types';
+import { BoxBaseProps } from '../base';
+export type CardVariant = 'elevated' | 'filled' | 'outlined';
+/**
+ * Props for {@link Card}.
+ *
+ * Card surface built on top of {@link BoxBase}.
+ *
+ * @category Card
+ */
+export interface CardProps extends Omit<BoxBaseProps, 'type' | 'elementClass' | 'color' | 'elevation' | 'borderColor'> {
+    /** Underlying element/component. Default: `article`. */
+    as?: ElementType;
+    /** Card content. */
+    children?: ReactNode;
+    /** Removes default inner spacing from the card content area. */
+    flush?: boolean;
+    /** Card variant. Default: `elevated`. */
+    variant?: CardVariant;
+    /** Whether the card is visible. */
+    open?: boolean;
+    /** Entry/exit animation preset. Use `none` to disable. */
+    animation?: MotionAnimation;
+    /** Animation duration in ms. */
+    duration?: number;
+    /** Motion style helper classes. */
+    motionStyle?: MotionStyle;
+    /** Surface color token override. */
+    color?: SurfaceColor;
+    /** Elevation override. */
+    elevation?: ElementElevation;
+    /** Shape token. Default: `rounded` (MD3 medium corner). */
     shape?: ElementShape;
-    raised?: boolean;
-    elevated?: boolean;
-    outlined?: boolean;
-    filled?: boolean;
+    /** Border color override (used by outlined cards). */
+    borderColor?: BorderColor;
+    /** Accessible label for cards without visible title. */
+    'aria-label'?: string;
 }
-export declare const Card: import('react').ForwardRefExoticComponent<CardProps & import('react').RefAttributes<HTMLSpanElement>>;
+export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLElement>>;

package/components/card/cardHeader.d.ts

@@ -0,0 +1,49 @@
+import { ReactElement, ReactNode } from 'react';
+import { CardActionsProps } from '../actions/actions';
+import { ElementFont } from '../../utils';
+/**
+ * Props for {@link CardHeader}.
+ *
+ * @category Card
+ */
+export interface CardHeaderProps {
+    /** Optional content before the title row. */
+    leading?: ReactNode;
+    /** Title alignment passed to {@link CardTitle}. */
+    titleAlign?: 'start' | 'center' | 'end';
+    /** Title text. */
+    label?: string;
+    /** Secondary text shown below the title. */
+    subtitle?: string;
+    /** Action buttons (see {@link CardActions}). */
+    actions?: CardActionsProps['actions'];
+    actionsAlign?: CardActionsProps['align'];
+    actionsStack?: CardActionsProps['stack'];
+    maxActions?: CardActionsProps['maxActions'];
+    moreLabel?: CardActionsProps['moreLabel'];
+    moreIcon?: CardActionsProps['moreIcon'];
+    /** Optional content after actions / before close in the header row. */
+    trailing?: ReactNode;
+    /** When true, renders the close control with {@link closeIcon}. */
+    showClose?: boolean;
+    /** Invoked when the close control is activated. */
+    onClose?: () => void;
+    /** Icon element for the close control (already resolved to default or override). */
+    closeIcon?: ReactElement;
+    font?: ElementFont;
+}
+/**
+ * Card title row: leading/icon, title, inline actions, trailing, and close.
+ *
+ * @remarks
+ * Non-inline actions are omitted here and rendered below the content by the parent.
+ *
+ * @function
+ * @param props Component properties.
+ *
+ * @category Card
+ */
+export declare const CardHeader: {
+    ({ leading, titleAlign, label, actions, actionsAlign, actionsStack, maxActions, moreLabel, moreIcon, trailing, showClose, onClose, closeIcon, font, }: CardHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/components/card/cardMedia.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+export interface CardMediaProps {
+    children?: ReactNode;
+    className?: string;
+}
+export declare const CardMedia: {
+    ({ children, className }: CardMediaProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/components/card/cardTitle.d.ts

@@ -0,0 +1,11 @@
+import { ElementFont } from '../../utils';
+export interface CardTitleProps {
+    label?: string;
+    className?: string;
+    font?: ElementFont;
+    align?: 'start' | 'center' | 'end';
+}
+export declare const CardTitle: {
+    ({ label, className, align, font, }: CardTitleProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};

package/components/dialogs/dialogHeader.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement, ReactNode } from 'react';
-import { DialogActionsProps } from './dialogActions';
+import { DialogActionsProps } from '../actions/actions';
 import { ElementFont, SurfaceColor } from '../../utils';
 import { DialogIconSlot } from '../../types';
 /**

package/components/dialogs/index.d.ts

@@ -1,5 +1,5 @@
 export * from './dialog';
-export * from './dialogActions';
+export * from '../actions/actions';
 export * from './dialogContent';
 export * from './dialogHeader';
 export * from './dialogTitle';

package/components/fieldset/fieldset.d.ts

@@ -7,7 +7,7 @@ import { BoxBaseProps } from '../base';
  *
  * @category Fieldset
  */
-export interface FieldsetProps extends Omit<BoxBaseProps, 'component' | 'elementClass'> {
+export interface FieldsetProps extends Omit<BoxBaseProps, 'as' | 'elementClass'> {
     /** Supporting text displayed below the fieldset content. */
     description?: string;
     /** Text color of the description. */

package/components/layout/article.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type ArticleProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type ArticleProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<article>` element.
  * Intended for self-contained content units composed of Sections and optional Aside.

package/components/layout/aside.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type AsideProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type AsideProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<aside>` element.
  *

package/components/layout/content.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type ContentProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type ContentProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Layout wrapper for the main article content.
  *

package/components/layout/footer.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type FooterProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type FooterProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<footer>` element.
  *

package/components/layout/header.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type HeaderProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type HeaderProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<header>` element.
  *

package/components/layout/main.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type MainProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type MainProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<main>` element.
  *

package/components/layout/nav.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type NavProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type NavProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<nav>` element.
  *

package/components/layout/section.d.ts

@@ -5,7 +5,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Box
  */
-export type SectionProps = Omit<BoxBaseProps, 'elementClass' | 'component'>;
+export type SectionProps = Omit<BoxBaseProps, 'elementClass' | 'as'>;
 /**
  * Semantic layout wrapper for the native `<section>` element.
  *

package/components/link/link.d.ts

@@ -1,9 +1,10 @@
 import { default as React, ElementType, ReactNode } from 'react';
-import { ElementFocusEffect, ElementFont, ElementHoverEffect, ElementPressedEffect, SurfaceColor } from '../../utils';
+import { BaseColor, ElementFocusEffect, ElementFont, ElementHoverEffect, ElementPressedEffect } from '../../utils';
 /**
- * Props for the Link component.
+ * Props for {@link Link}.
  *
- * Inline link element with optional leading and trailing content and animated underline.
+ * Polymorphic inline link that can render as a native anchor or custom navigation component.
+ * Supports optional leading/trailing visuals, underline behavior, and interaction effects.
  *
  * @category Link
  */
@@ -18,14 +19,14 @@ export type LinkProps<T extends ElementType = 'a'> = {
     leading?: ReactNode;
     /** Trailing visual element. */
     trailing?: ReactNode;
-    /** Surface color token applied to text. */
-    color?: SurfaceColor;
+    /** Color token applied to text. */
+    color?: BaseColor;
     /** Underline visibility behavior. */
     underline?: 'none' | 'hover' | 'always';
     /** Font token applied to content. */
     font?: ElementFont;
     /** Opens link in new tab with security attributes. */
-    isExternal?: boolean;
+    external?: boolean;
     /** Accessibility label override. */
     'aria-label'?: string;
     /** Additional class applied to the root element. */
@@ -44,15 +45,13 @@ export type LinkProps<T extends ElementType = 'a'> = {
     underlineAnimation?: 'scale' | 'fade';
 } & Omit<React.ComponentPropsWithoutRef<T>, 'as' | 'color' | 'children' | 'className'>;
 export interface LinkComponent {
+    /**
+     * Renders a polymorphic link element.
+     *
+     * @typeParam T - Element type rendered by the component.
+     * @param props - Link configuration and props for the rendered element type.
+     */
     <T extends ElementType = 'a'>(props: LinkProps<T>): ReactNode;
     displayName?: string;
 }
-/**
- * Inline link component with optional leading and trailing content and animated underline.
- *
- * @function
- * @param props Component properties.
- *
- * @category Link
- */
 export declare const Link: LinkComponent;

package/components/spinner/spinner.d.ts

@@ -1,7 +1,32 @@
-export type SpinnerVariant = 'circular' | 'dots' | 'bars' | 'ring' | 'bars2' | 'orbit' | 'arc' | 'stepBar';
+import { BaseColor, ElementSize } from '../../utils';
+export type SpinnerVariant = 'ring' | 'dots' | 'blade' | 'bars' | 'orbit' | 'arc' | 'stepBar' | 'dualRing';
+/**
+ * Props for the spinner component.
+ *
+ * @category Spinner
+ */
 export interface SpinnerProps {
+    /** Visual spinner variant. */
     variant?: SpinnerVariant;
+    /** Semantic color token applied to the spinner. */
+    color?: BaseColor;
+    /** Size token controlling spinner dimensions. */
+    size?: ElementSize;
+    /** Additional class names for the root svg element. */
     className?: string;
+    /** Applies inline alignment (`vertical-align: middle`) for text-flow usage. */
     inline?: boolean;
+    /** Accessible label. When provided, spinner is announced as a status. */
+    ariaLabel?: string;
 }
-export declare function Spinner({ variant, inline, className, }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Renders a loading spinner in one of the supported variants.
+ *
+ * By default spinner is decorative. Provide `ariaLabel` to expose it as an accessible status.
+ *
+ * @function Spinner
+ * @param props Component properties.
+ *
+ * @category Spinner
+ */
+export declare const Spinner: ({ variant, color, size, inline, className, ariaLabel }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;

package/components/themeProvider/themeProvider.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+import { PartialThemeBreakpoints, PartialThemeFonts, ThemeCustomColors } from '../../types';
 export interface ThemeProviderProps {
     /** React children to render within the theme context. */
     children: ReactNode;
@@ -12,8 +13,12 @@ export interface ThemeProviderProps {
      * Defaults to #6750A4 if omitted.
      */
     seedColor?: string;
-    /** Optional custom colors map used to define or override generated theme roles. */
-    colors?: Record<string, string>;
+    /** Optional semantic seed colors map (core + augmented). */
+    colors?: ThemeCustomColors;
+    /** Optional responsive breakpoints map. */
+    breakpoints?: PartialThemeBreakpoints;
+    /** Optional font class map keyed by theme font token name. */
+    fonts?: PartialThemeFonts;
 }
 /**
  * Provides a ThemeContext to all descendant components using Material Design 3 color tokens.
@@ -34,7 +39,7 @@ export interface ThemeProviderProps {
  * @param props.children - React children rendered within the theme context.
  * @param props.colorMode - Optional color mode: `'light'` or `'dark'`. Defaults to `'light'`.
  * @param props.seedColor - Optional base color used to generate the theme. Defaults to `#6750A4`.
- * @param props.colors - Optional custom colors map used to define or override generated theme roles.
+ * @param props.colors - Optional semantic seed colors map (core + augmented via `CustomColors`).
  *
  * @example
  * ```tsx
@@ -43,7 +48,12 @@ export interface ThemeProviderProps {
  * </ThemeProvider>
  * ```
  *
+ * @privateRemarks
+ * The provider intentionally computes generated schemes during state initialization and once again
+ * in the `[colors, seedColor]` effect. This keeps theme token names available on first render,
+ * including setups without `ColorRegistry`, at the cost of an extra computation.
+ *
  * @category Components
  * @group Theme
  */
-export declare const ThemeProvider: ({ children, colorMode, seedColor, colors }: ThemeProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ThemeProvider: ({ children, colorMode, seedColor, colors, breakpoints, fonts }: ThemeProviderProps) => import("react/jsx-runtime").JSX.Element;

package/components/toolbar/toolbar.d.ts

@@ -7,7 +7,7 @@ import { BoxBaseProps } from '../base/boxBase';
  *
  * @category Toolbar
  */
-export interface ToolbarProps extends Omit<BoxBaseProps, 'component' | 'elementClass' | 'direction' | 'row' | 'col'> {
+export interface ToolbarProps extends Omit<BoxBaseProps, 'as' | 'elementClass' | 'direction' | 'row' | 'col'> {
     /** Visual variant of the toolbar. */
     variant?: 'docked' | 'floating';
     /** Surface color token applied to container. */

package/components/typography/h1.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type H1Props = Omit<TextBaseProps, 'component'>;
+export type H1Props = Omit<TextBaseProps, 'as'>;
 /**
  * H1 semantic heading.
  * Renders native h1 element with default headlineLarge font.

package/components/typography/h2.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type H2Props = Omit<TextBaseProps, 'component'>;
+export type H2Props = Omit<TextBaseProps, 'as'>;
 /**
  * H2 semantic heading.
  * Renders native h2 element with default headlineMedium font.

package/components/typography/h3.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type H3Props = Omit<TextBaseProps, 'component'>;
+export type H3Props = Omit<TextBaseProps, 'as'>;
 /**
  * H3 semantic heading.
  * Renders native h3 element with default headlineSmall font.