@ufoui/core 0.0.12 → 0.0.58

package/assets/icons.d.ts

@@ -1,11 +1,14 @@
+export declare const ChevronRightIcon: import("react/jsx-runtime").JSX.Element;
+export declare const CloseIcon: import("react/jsx-runtime").JSX.Element;
+export declare const ArrowBackIcon: import("react/jsx-runtime").JSX.Element;
+export declare const MoreVertIcon: import("react/jsx-runtime").JSX.Element;
 export declare const CheckmarkIcon: import("react/jsx-runtime").JSX.Element;
 export declare const IndeterminateIcon: import("react/jsx-runtime").JSX.Element;
 export declare const RadioIcon: import("react/jsx-runtime").JSX.Element;
-export declare const ArrowRightIcon: import("react/jsx-runtime").JSX.Element;
 export declare const CheckboxIcon: import("react/jsx-runtime").JSX.Element;
+export declare const MenuCheckIcon: import("react/jsx-runtime").JSX.Element;
 export declare const RadioCheckedIcon: import("react/jsx-runtime").JSX.Element;
 export declare const RadioUncheckedIcon: import("react/jsx-runtime").JSX.Element;
-export declare const MenuCheckIcon: import("react/jsx-runtime").JSX.Element;
 export declare const ExpandIcon: import("react/jsx-runtime").JSX.Element;
 export declare const StarIcon: import("react/jsx-runtime").JSX.Element;
 export declare const StarFilledIcon: import("react/jsx-runtime").JSX.Element;

package/components/accordion/accordion.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { BoxBaseProps } from '../base';
-import { BorderColor, ElementBorder, ElementDensity, ElementElevation, ElementFont, ElementShape, SurfaceColor } from '../../utils';
+import { BaseColor, BorderColor, ElementBorder, ElementDensity, ElementElevation, ElementFont, ElementShape } from '../../utils';
 import { MotionAnimation, MotionStyle } from '../../types';
 export type AccordionVariant = 'text' | 'pills' | 'grouped' | 'segmented';
 export type AccordionConfig = {
@@ -15,7 +15,7 @@ export type AccordionConfig = {
     animation?: MotionAnimation;
     motionStyle?: MotionStyle;
     duration?: number;
-    color?: SurfaceColor;
+    color?: BaseColor;
     disabled?: boolean;
 };
 /**

package/components/avatar/avatar.d.ts

@@ -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 { ElementAlign, ElementBorder, ElementElevation, ElementFont, 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.
@@ -10,7 +10,7 @@ import { BorderColor, SemanticColor } from '../../utils/color';
  */
 export interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'ref' | 'size'> {
     /** Position relative to the parent element. */
-    align?: ElementAlign;
+    align?: ElementPlacement;
     /** Accessible label for screen readers when badge conveys information. */
     ariaLabel?: string;
     /** Border width when outlined. */

package/components/base/boxBase.d.ts

@@ -1,5 +1,5 @@
 import { CSSProperties, ElementType, HTMLAttributes, ReactNode } from 'react';
-import { BorderColor, ElementBorder, ElementElevation, ElementFont, ElementShape, SurfaceColor, WrapperProps } from '../../utils';
+import { BaseColor, BorderColor, ElementBorder, ElementElevation, ElementFont, ElementShape, WrapperProps } from '../../utils';
 /**
  * Layout mode for {@link BoxBase}.
  *
@@ -41,7 +41,7 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     /** Layout direction shortcut. Same as `direction="col"`. */
     col?: boolean;
     /** Surface background token. Default: `'surface'`. */
-    color?: SurfaceColor;
+    color?: BaseColor;
     /** Grid template columns (`3` → `repeat(3, 1fr)`). */
     cols?: number | string;
     /** Custom HTML element/component. Default: `div`. */
@@ -59,9 +59,9 @@ export interface BoxBaseProps extends Omit<HTMLAttributes<HTMLElement>, 'color'
     /** Font token controlling typography (size, weight, line-height). */
     font?: ElementFont;
     /** Forces full height (100%). */
-    hf?: boolean;
+    fullHeight?: boolean;
     /** Forces full width (100%). */
-    wf?: boolean;
+    fullWidth?: boolean;
     /** Gap between children (flex/grid). */
     gap?: number | string;
     /** Horizontal gap (`column-gap`). */

package/components/base/buttonBase.d.ts

@@ -1,5 +1,5 @@
 import { default as React, ReactNode } from 'react';
-import { BorderColor, ElementAlign, ElementDensity, ElementElevation, ElementFocusEffect, ElementFont, ElementHoverEffect, ElementOutline, ElementPressedEffect, ElementSelectedEffect, ElementShape, ElementSize, ElementTouchEffect, SemanticColor, SurfaceColor } from '../../utils';
+import { BaseColor, BorderColor, ElementDensity, ElementElevation, ElementFocusEffect, ElementFont, ElementHoverEffect, ElementOutline, ElementPlacement, ElementPressedEffect, ElementSelectedEffect, ElementShape, ElementSize, ElementTouchEffect, SemanticColor } from '../../utils';
 /**
  * Props for the ButtonBase component.
  *
@@ -37,7 +37,7 @@ export interface ButtonBaseProps extends Omit<React.ButtonHTMLAttributes<HTMLBut
     /** Font token for label and content. */
     font?: ElementFont;
     /** Expands button to full width. */
-    wf?: boolean;
+    fullWidth?: boolean;
     /** Hover visual effects. */
     hoverEffects?: ElementHoverEffect[];
     /** Icon rendered at the start of the button. */
@@ -77,13 +77,13 @@ export interface ButtonBaseProps extends Omit<React.ButtonHTMLAttributes<HTMLBut
     /** Shape override when selected. */
     selectedShape?: ElementShape;
     /** Text color override when selected. */
-    selectedTextColor?: SurfaceColor;
+    selectedTextColor?: BaseColor;
     /** Shape of the button. */
     shape?: ElementShape;
     /** Predefined button size. Default: medium */
     size?: ElementSize;
     /** Text color override. */
-    textColor?: SurfaceColor;
+    textColor?: BaseColor;
     /** Tooltip text and accessibility label fallback. */
     title?: string;
     /** Enables toggle button behavior. */
@@ -91,7 +91,7 @@ export interface ButtonBaseProps extends Omit<React.ButtonHTMLAttributes<HTMLBut
     /** Enables tonal style. */
     tonal?: boolean;
     /** Tooltip alignment relative to the button. */
-    tooltipAlign?: ElementAlign;
+    tooltipAlign?: ElementPlacement;
     /** Touch and click visual effects. */
     touchEffects?: ElementTouchEffect[];
     /** Custom trailing content. */

package/components/base/checkboxBase.d.ts

@@ -1,5 +1,5 @@
 import { default as React, ReactNode } from 'react';
-import { BorderColor, ElementAlign, ElementBorder, ElementDensity, ElementElevation, ElementFocusEffect, ElementFont, ElementHoverEffect, ElementOutline, ElementPressedEffect, ElementSelectedEffect, ElementShape, ElementSize, ElementTextPlacement, ElementTouchEffect, SemanticColor, SurfaceColor } from '../../utils';
+import { BorderColor, ElementBorder, ElementDensity, ElementElevation, ElementFocusEffect, ElementFont, ElementHoverEffect, ElementOutline, ElementPlacement, ElementPressedEffect, ElementSelectedEffect, ElementShape, ElementSize, ElementTextPlacement, ElementTouchEffect, SemanticColor, SurfaceColor } from '../../utils';
 import { MotionAnimation, MotionStyle } from '../../types';
 /**
  * Props for the CheckboxBase component.
@@ -83,7 +83,7 @@ export interface CheckboxBaseProps extends Omit<React.InputHTMLAttributes<HTMLIn
     /** Placement of text relative to the control. */
     textPlacement?: ElementTextPlacement;
     /** Tooltip alignment relative to the control. */
-    tooltipAlign?: ElementAlign;
+    tooltipAlign?: ElementPlacement;
     /** Touch and click visual effects. */
     touchEffects?: ElementTouchEffect[];
     /** Input type. */

package/components/base/dialogBase.d.ts

@@ -1,34 +1,130 @@
-import { default as React, ReactNode } from 'react';
-import { BorderColor, ElementElevation, ElementOutline, ElementShape, ElementSize, SurfaceColor } from '../../utils';
-import { MotionAnimation, MotionStyle } from '../../types';
-export type DialogType = 'basic' | 'fullscreen' | 'dockRight' | 'dockLeft' | 'dockTop' | 'dockBottom';
-export type DialogAnimation = 'none' | MotionAnimation;
+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';
+/**
+ * Props for the DialogBase component.
+ *
+ * Supports backdrop and portal rendering, transitions, Escape and backdrop
+ * dismiss, and optional modal focus trap and scroll locking.
+ *
+ * @category Base components
+ */
 export interface DialogBaseProps {
+    /** Semantic UUI element class for the dialog panel. */
     elementClass?: string;
+    /** Whether the dialog is open. */
     open: boolean;
+    /** Handler invoked when the dialog should close. */
     onClose?: () => void;
+    /** Layout mode. Default: basic */
     type?: DialogType;
+    /** Surface background token. */
     color?: SurfaceColor;
+    /** Elevation level. Default: 3 for non-fullscreen layouts. */
     elevation?: ElementElevation;
+    /** Predefined panel size. Default: small for horizontal docks, medium otherwise. */
     size?: ElementSize;
+    /** Shape of the dialog panel. */
     shape?: ElementShape;
+    /** Outline thickness when outlined. */
     border?: ElementOutline;
+    /** Outline color when outlined. */
     borderColor?: BorderColor;
-    wf?: boolean;
-    hf?: boolean;
+    /** Expands panel to full width. */
+    fullWidth?: boolean;
+    /** Expands panel to full height. */
+    fullHeight?: boolean;
+    /** Fits content to the panel. */
     fit?: boolean;
+    /** Renders the panel in detached layout style. */
     detached?: boolean;
+    /** Animation preset; `'none'` disables motion. */
     animation?: DialogAnimation;
+    /** Duration in milliseconds for open and close animations. Default: 500 */
     duration?: number;
-    disableBackdropClose?: boolean;
-    disableEscapeKey?: boolean;
+    /** Whether the dialog closes when the backdrop is clicked. Default: true */
+    closeOnBackdrop?: boolean;
+    /** Whether the dialog closes when Escape is pressed. Default: true */
+    closeOnEsc?: boolean;
+    /** Dialog content. */
     children?: ReactNode;
+    /** Visual title text. Referenced via aria-labelledby on the dialog element. */
+    label?: string;
+    /** Accessible label for dialogs without a visible title. */
+    'aria-label'?: string;
+    /** Icon rendered in the dialog. Position controlled by iconSlot. */
+    icon?: ReactElement;
+    showIcon?: boolean;
+    iconColor?: SurfaceColor;
+    /** Where the icon is placed. Default: leading */
+    iconSlot?: DialogIconSlot;
+    /** Alignment of the title text. Default: start */
+    titleAlign?: 'start' | 'center' | 'end';
+    /** Full leading slot content for the title area. */
+    leading?: ReactNode;
+    /** Trailing slot content for the title area. */
+    trailing?: ReactNode;
+    /** Action buttons rendered in the dialog. */
+    actions?: ReactNode;
+    /** Where actions are placed. Default: inline for fullscreen, bottom otherwise (MD3) */
+    actionsPlacement?: 'top' | 'subtitle' | 'bottom' | 'inline';
+    /** Alignment of action buttons. Default: end (MD3) */
+    actionsAlign?: 'start' | 'center' | 'end';
+    /** Stack actions vertically instead of horizontally. Default: false (MD3) */
+    actionsStack?: boolean;
+    /** Maximum number of visible actions before the rest collapse into an overflow menu. Only applies when actionsPosition is inline. */
+    maxActions?: number;
+    /** Accessible label for the overflow actions button. Default: "More actions" */
+    moreLabel?: string;
+    /** Custom icon for the overflow actions button. */
+    moreIcon?: ReactElement;
+    /** Renders a close button in the trailing slot. */
+    showClose?: boolean;
+    /** Custom icon for the close button. */
+    closeIcon?: ReactElement;
+    /** Renders a back button in the leading slot. */
+    showBack?: boolean;
+    /** Custom icon for the back button. */
+    backIcon?: ReactElement;
+    /** Handler for the back button. Defaults to onClose. */
+    onBack?: () => void;
+    /** Additional class names for the dialog panel. */
     className?: string;
+    /** Motion style helper classes for the panel. */
     motionStyle?: MotionStyle;
+    /** Enables modal behaviour, focus trap, aria-modal, and body scroll lock when applicable. */
     modal?: boolean;
+    /** Focuses the dialog when opened (with modal focus trap). */
     autoFocus?: boolean;
+    /** Removes default panel padding. */
     flush?: boolean;
+    /** Renders inline without a portal (e.g. docked regions). */
     docked?: boolean;
+    /** Skips portaling and modal body scroll lock; for anchored overlays. */
     anchored?: boolean;
+    font?: ElementFont;
+    titleFont?: ElementFont;
 }
+/**
+ * Low-level base component for modal and docked dialogs.
+ *
+ * Renders a backdrop and panel (via BoxBase), portaled to `#dialog-root` (created if
+ * missing; see {@link renderPortal}) unless `docked` or `anchored`.
+ *
+ *
+ * @param props Component properties.
+ * @function
+ *
+ * @example
+ * <DialogBase open={open} onClose={() => setOpen(false)} modal>
+ * {children}
+ * </DialogBase>
+ *
+ * @example
+ * <DialogBase open type="dockRight" anchored >
+ * {children}
+ * </DialogBase>
+ *
+ * @category Base components
+ */
 export declare const DialogBase: React.ForwardRefExoticComponent<DialogBaseProps & React.RefAttributes<HTMLDivElement>>;

package/components/base/fieldBase.d.ts

@@ -21,7 +21,7 @@ export interface FieldBaseProps extends Omit<React.InputHTMLAttributes<HTMLInput
     outlined?: boolean;
     filled?: boolean;
     classic?: boolean;
-    wFull?: boolean;
+    fullWidth?: boolean;
     /** Control shape variant. */
     shape?: ElementShape;
     /** Text color override for the label. */

package/components/card/card.d.ts

@@ -1,15 +1,80 @@
-import { HTMLProps } from 'react';
-import { ElementAlign, 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?: ElementAlign;
-    size?: ElementSize;
+import { default as React, ElementType, ReactElement, ReactNode } from 'react';
+import { BorderColor, ElementElevation, ElementFont, ElementShape, SurfaceColor } from '../../utils';
+import { DialogAnimation, DialogIconSlot, 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`. */
+    component?: ElementType;
+    /** Card content. */
+    children?: ReactNode;
+    /** Card variant. Default: `elevated`. */
+    variant?: CardVariant;
+    /** Whether the card is visible. */
+    open?: boolean;
+    /** Entry/exit animation preset. Use `none` to disable. */
+    animation?: DialogAnimation;
+    /** 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;
+    /** 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: import('react').ForwardRefExoticComponent<CardProps & import('react').RefAttributes<HTMLSpanElement>>;
+export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLElement>>;

package/components/dialogs/dialogActions.d.ts

@@ -1,14 +1,26 @@
 import { ReactNode } from 'react';
-import { BorderColor, ElementOutline, SurfaceColor } from '../../utils';
+/** Slot contract for components that can act as dialog actions. */
+export interface DialogActionProps {
+    label?: string;
+    'aria-label'?: string;
+    icon?: ReactNode;
+    leading?: ReactNode;
+    trailing?: ReactNode;
+    disabled?: boolean;
+}
 export interface DialogActionsProps {
-    children?: ReactNode;
+    actions?: ReactNode;
+    placement?: 'top' | 'subtitle' | 'bottom' | 'inline';
+    align?: 'start' | 'center' | 'end';
+    stack?: boolean;
     className?: string;
-    color?: SurfaceColor;
-    borderTop?: boolean;
-    borderTopWidth?: ElementOutline;
-    borderColor?: BorderColor;
+    /** 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;
+    moreIcon?: ReactNode;
 }
 export declare const DialogActions: {
-    ({ children, className, color, borderTop, borderTopWidth, borderColor, }: DialogActionsProps): import("react/jsx-runtime").JSX.Element | null;
+    ({ actions, className, placement, align, stack, maxActions, moreLabel, }: DialogActionsProps): import("react/jsx-runtime").JSX.Element | null;
     displayName: string;
 };

package/components/dialogs/dialogActions.guards.d.ts

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

package/components/dialogs/dialogContent.d.ts

@@ -1,9 +1,15 @@
 import { ReactNode } from 'react';
+import { SurfaceColor } from '../../utils';
+import { DialogIconSlot } from '../../types';
 export interface DialogContentProps {
     children?: ReactNode;
+    icon?: ReactNode;
+    showIcon?: boolean;
+    iconColor?: SurfaceColor;
+    iconSlot?: DialogIconSlot;
     className?: string;
 }
 export declare const DialogContent: {
-    ({ children, className }: DialogContentProps): import("react/jsx-runtime").JSX.Element | null;
+    ({ children, iconSlot, icon, showIcon, iconColor, className }: DialogContentProps): import("react/jsx-runtime").JSX.Element | null;
     displayName: string;
 };

package/components/dialogs/dialogHeader.d.ts

@@ -0,0 +1,60 @@
+import { ReactElement, ReactNode } from 'react';
+import { DialogActionsProps } from './dialogActions';
+import { ElementFont, SurfaceColor } from '../../utils';
+import { DialogIconSlot } from '../../types';
+/**
+ * Props for {@link DialogHeader}.
+ *
+ * @category Dialog
+ */
+export interface DialogHeaderProps {
+    /** Optional content before the back button and title row. */
+    leading?: ReactNode;
+    /** When true, renders the back affordance with {@link backIcon}. */
+    showBack?: boolean;
+    /** Invoked when the back control is activated. */
+    onBack?: () => void;
+    /** Icon element for the back control. */
+    backIcon?: ReactElement;
+    /** Resolved icon wrapper for leading/top slots; omit when no dialog icon. */
+    icon?: ReactElement;
+    showIcon?: boolean;
+    iconColor?: SurfaceColor;
+    /** Where the icon is placed inside the header vs content (see {@link DialogIconSlot}). */
+    iconSlot: DialogIconSlot;
+    /** Title alignment passed to {@link DialogTitle}. */
+    titleAlign?: 'start' | 'center' | 'end';
+    /** Title text. */
+    label?: string;
+    /** Action buttons (see {@link DialogActions}). */
+    actions?: DialogActionsProps['actions'];
+    actionsAlign?: DialogActionsProps['align'];
+    actionsStack?: DialogActionsProps['stack'];
+    maxActions?: DialogActionsProps['maxActions'];
+    moreLabel?: DialogActionsProps['moreLabel'];
+    moreIcon?: DialogActionsProps['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;
+}
+/**
+ * Dialog title row: leading/back/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 Dialog
+ */
+export declare const DialogHeader: {
+    ({ leading, showBack, onBack, backIcon, icon, showIcon, iconColor, iconSlot, titleAlign, label, actions, actionsAlign, actionsStack, maxActions, moreLabel, moreIcon, trailing, showClose, onClose, closeIcon, font, }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/components/dialogs/dialogTitle.d.ts

@@ -1,15 +1,19 @@
 import { ReactNode } from 'react';
 import { ElementFont, SurfaceColor } from '../../utils';
+import { DialogIconSlot } from '../../types';
 export interface DialogTitleProps {
-    icon?: ReactNode;
     label?: string;
-    children?: ReactNode;
     className?: string;
     font?: ElementFont;
-    color?: SurfaceColor;
-    textColor?: SurfaceColor;
+    /** Resolved icon wrapper for leading/top slots; omit when no dialog icon. */
+    icon?: ReactNode | null;
+    /** Where the icon is placed inside the header vs content (see {@link DialogIconSlot}). */
+    iconSlot?: DialogIconSlot;
+    showIcon?: boolean;
+    iconColor?: SurfaceColor;
+    align?: 'start' | 'center' | 'end';
 }
 export declare const DialogTitle: {
-    ({ icon, label, children, className, font }: DialogTitleProps): import("react/jsx-runtime").JSX.Element | null;
+    ({ label, icon, iconSlot, className, iconColor, showIcon, align, font, }: DialogTitleProps): import("react/jsx-runtime").JSX.Element | null;
     displayName: string;
 };

package/components/dialogs/index.d.ts

@@ -1,6 +1,7 @@
 export * from './dialog';
 export * from './dialogActions';
 export * from './dialogContent';
+export * from './dialogHeader';
 export * from './dialogTitle';
 export * from './drawer';
 export * from './bottomSheet';

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/menu/menu.d.ts

@@ -1,6 +1,6 @@
 import { default as React, HTMLAttributes, ReactNode, RefObject } from 'react';
 import { MotionAnimation, MotionStyle } from '../../types';
-import { BorderColor, ElementAlign, ElementBorder, ElementDensity, ElementElevation, ElementFloatingMode, ElementFocusEffect, ElementFont, ElementSelectedEffect, ElementShape, ElementTouchEffect, SurfaceColor } from '../../utils';
+import { BorderColor, ElementBorder, ElementDensity, ElementElevation, ElementFloatingMode, ElementFocusEffect, ElementFont, ElementPlacement, ElementSelectedEffect, ElementShape, ElementTouchEffect, SurfaceColor } from '../../utils';
 /**
  * Visual style preset for the Menu component.
  *
@@ -85,7 +85,7 @@ export interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'>
     /** Opens the menu on pointer hover. */
     openOnHover?: boolean;
     /** Preferred placement relative to the anchor. */
-    placement?: ElementAlign;
+    placement?: ElementPlacement;
     /** Icon used for checked radio items. */
     radioCheckedIcon?: ReactNode;
     /** Icon used for unchecked radio items. */

package/components/rating/rating.d.ts

@@ -1,5 +1,5 @@
 import { default as React, ReactNode } from 'react';
-import { ElementAlign, ElementDensity, ElementFocusEffect, ElementFont, ElementSize, ElementTextPlacement, SurfaceColor } from '../../utils';
+import { ElementDensity, ElementFocusEffect, ElementFont, ElementPlacement, ElementSize, ElementTextPlacement, SurfaceColor } from '../../utils';
 /**
  * Props for the Rating component.
  *
@@ -51,7 +51,7 @@ export interface RatingProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
     /** Placement of label and description relative to the control. */
     textPlacement?: ElementTextPlacement;
     /** Tooltip alignment relative to the control. */
-    tooltipAlign?: ElementAlign;
+    tooltipAlign?: ElementPlacement;
     /** Current rating value when used as a controlled component. */
     value?: number;
 }