@ufoui/core 0.0.58 → 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. */

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,6 +1,6 @@
-import { default as React, ElementType, ReactElement, ReactNode } from 'react';
-import { BorderColor, ElementElevation, ElementFont, ElementShape, SurfaceColor } from '../../utils';
-import { DialogAnimation, DialogIconSlot, MotionStyle } from '../../types';
+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';
 /**
@@ -12,15 +12,17 @@ export type CardVariant = 'elevated' | 'filled' | 'outlined';
  */
 export interface CardProps extends Omit<BoxBaseProps, 'type' | 'elementClass' | 'color' | 'elevation' | 'borderColor'> {
     /** Underlying element/component. Default: `article`. */
-    component?: ElementType;
+    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?: DialogAnimation;
+    animation?: MotionAnimation;
     /** Animation duration in ms. */
     duration?: number;
     /** Motion style helper classes. */
@@ -33,48 +35,7 @@ export interface CardProps extends Omit<BoxBaseProps, 'type' | 'elementClass' |
     shape?: ElementShape;
     /** Border color override (used by outlined cards). */
     borderColor?: BorderColor;
-    /** Visual title text. */
-    label?: string;
     /** Accessible label for cards without visible title. */
     'aria-label'?: string;
-    /** Card icon. */
-    icon?: ReactElement;
-    showIcon?: boolean;
-    iconColor?: SurfaceColor;
-    iconSlot?: DialogIconSlot;
-    /** Title alignment. */
-    titleAlign?: 'start' | 'center' | 'end';
-    /** Header leading slot content. */
-    leading?: ReactNode;
-    /** Header trailing slot content. */
-    trailing?: ReactNode;
-    /** Header/content actions. */
-    actions?: ReactNode;
-    /** Actions placement. Default: `bottom`. */
-    actionsPlacement?: 'top' | 'subtitle' | 'bottom' | 'inline';
-    /** Actions alignment. */
-    actionsAlign?: 'start' | 'center' | 'end';
-    /** Stack actions vertically. */
-    actionsStack?: boolean;
-    /** Maximum number of visible actions before overflow. */
-    maxActions?: number;
-    /** Overflow button label. */
-    moreLabel?: string;
-    /** Overflow button icon. */
-    moreIcon?: ReactElement;
-    /** Shows close button in header. */
-    showClose?: boolean;
-    /** Close button icon override. */
-    closeIcon?: ReactElement;
-    /** Shows back button in header. */
-    showBack?: boolean;
-    /** Back button icon override. */
-    backIcon?: ReactElement;
-    /** Back button handler. Defaults to onClose. */
-    onBack?: () => void;
-    /** Close button handler. */
-    onClose?: () => void;
-    /** Header title font token. */
-    titleFont?: ElementFont;
 }
 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/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/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.

package/components/typography/h4.d.ts

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

package/components/typography/h5.d.ts

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

package/components/typography/h6.d.ts

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

package/components/typography/label.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type LabelProps = Omit<TextBaseProps, 'component'>;
+export type LabelProps = Omit<TextBaseProps, 'as'>;
 /**
  * Label semantic text.
  * Renders native label element with default labelLarge font.

package/components/typography/p.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type PProps = Omit<TextBaseProps, 'component'>;
+export type PProps = Omit<TextBaseProps, 'as'>;
 /**
  * P semantic paragraph.
  * Renders native p element.

package/components/typography/span.d.ts

@@ -5,7 +5,7 @@ import { TextBaseProps } from '../base/textBase';
  *
  * @category Typography
  */
-export type SpanProps = Omit<TextBaseProps, 'component'>;
+export type SpanProps = Omit<TextBaseProps, 'as'>;
 /**
  * Span semantic inline text wrapper.
  * Renders native span element.