@uni-design-system/uni-angular 5.1.0 → 5.2.0

package/types/uni-design-system-uni-angular.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { Signal, WritableSignal, InjectionToken, ElementRef, TemplateRef, OnInit, OnDestroy, AfterViewInit } from '@angular/core';
 import * as _uni_design_system_uni_core from '@uni-design-system/uni-core';
-import { Icons, Variant, ContainerColorToken, PaletteConfig, GenerateColorsConfig, UniTheme, ComponentName, ComponentTheme, NullableSize, ThemeName, TextRole, ContentColorToken, Size, Thickness, NullableStyleExpression, ColorKey, ColorToken, Typeface, Radius, OptionalSize, Border, Shadow, ZIndexableElements, RadiiSize, Elevation, TextColor, JustifyContent, StyleExpression, Orientation, OptionalAlignSelf, OptionalAlignItems, OptionalAlignContent, OptionalJustifyContent, OptionalDisplay, OptionalPosition, OptionalOverflow, OptionalFlexDirection, OptionalTextAlign, OptionalWrap, ColorScheme, ColorCategory } from '@uni-design-system/uni-core';
+import { Icons, Variant, ContainerColorToken, PaletteConfig, GenerateColorsConfig, Radii, UniTheme, ComponentName, ComponentTheme, NullableSize, ThemeName, TextRole, ContentColorToken, Size, Thickness, NullableStyleExpression, ColorKey, ColorToken, Typeface, Radius, OptionalSize, Border, Shadow, ZIndexableElements, Elevation, RadiiSize, TextColor, JustifyContent, StyleExpression, Orientation, OptionalAlignSelf, OptionalAlignItems, OptionalAlignContent, OptionalJustifyContent, OptionalDisplay, OptionalPosition, OptionalOverflow, OptionalFlexDirection, OptionalTextAlign, OptionalWrap, ColorScheme, ColorCategory, ThemeShape, ContrastCheck, Colors, GenerationInput } from '@uni-design-system/uni-core';
 import { FormCheckboxControl, FormValueControl } from '@angular/forms/signals';
 
 /**
@@ -263,7 +263,10 @@ declare const getFileExtension: (file: File) => string;
  * strengths: `brand` pins are emitted verbatim (may fail contrast), `targets`
  * are brand-faithful but the WCAG guard-rail may adjust their lightness.
  */
-type BrandPaletteConfig = Required<Pick<PaletteConfig, 'seed' | 'scheme' | 'category'>> & Pick<GenerateColorsConfig, 'mode' | 'accentSaturationFloor' | 'brand' | 'targets'>;
+type BrandPaletteConfig = Required<Pick<PaletteConfig, 'seed' | 'scheme' | 'category'>> & Pick<GenerateColorsConfig, 'mode' | 'accentSaturationFloor' | 'brand' | 'targets'> & {
+    /** Radii override (e.g. a `ShapeRadii` shape-language preset). */
+    radii?: Radii;
+};
 declare class ThemeService {
     /** localStorage key marking the custom brand theme as active. */
     static readonly CUSTOM_KEY = "CustomTheme";
@@ -356,19 +359,6 @@ declare class ThemeService {
 
 declare const UNI_THEMES: InjectionToken<Record<string, UniTheme>>;
 
-type ImagePosition = 'top' | 'bottom' | 'left' | 'right' | 'center' | string;
-declare class UniBackgroundComponent {
-    theme: ThemeService;
-    image: _angular_core.InputSignal<string>;
-    imagePosition: _angular_core.InputSignal<string>;
-    imageSize: _angular_core.InputSignal<string | number>;
-    height: _angular_core.InputSignal<string | number>;
-    width: _angular_core.InputSignal<string | number>;
-    protected readonly className: _angular_core.Signal<string>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniBackgroundComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniBackgroundComponent, "uni-background, Background", never, { "image": { "alias": "image"; "required": false; "isSignal": true; }; "imagePosition": { "alias": "imagePosition"; "required": false; "isSignal": true; }; "imageSize": { "alias": "imageSize"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
-}
-
 declare class BaseComponent<T = unknown> {
     protected componentName: ComponentName;
     theme: ThemeService;
@@ -383,6 +373,109 @@ declare class BaseComponent<T = unknown> {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<BaseComponent<any>, "ng-component", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/** Theme-level options for `uni-app-bar`, resolved by token name. */
+interface UniAppBarOptions {
+    /** Bar surface color token (with its paired on-color). */
+    color?: ContainerColorToken;
+    /** Bar height in px. */
+    height?: number;
+    /** Rule under the bar, as a border primitive token. */
+    divider?: Border;
+    /** Title typography token. */
+    typeface?: Typeface;
+    /** Horizontal padding, as a spacing token. */
+    padding?: OptionalSize;
+    /** Space between bar children, as a spacing token. */
+    gap?: OptionalSize;
+    /** Optional elevation shadow token (e.g. 'raised'). */
+    elevation?: Elevation;
+}
+
+/**
+ * Horizontal application bar: project leading controls (menu button, logo)
+ * with the `leading` attribute, actions with `trailing` (pushed to the far
+ * edge), and either pass `title` or project custom center content. Surface,
+ * divider, height, typography and spacing all resolve from `appBar` tokens.
+ * Place it inside your page's `<header>` landmark.
+ */
+declare class UniAppBarComponent extends BaseComponent<UniAppBarOptions> {
+    /** Bar title; alternatively project your own center content. */
+    title: _angular_core.InputSignal<string>;
+    /** Stick the bar to the top of its scroll container. */
+    sticky: _angular_core.InputSignal<boolean>;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniAppBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniAppBarComponent, "uni-app-bar, AppBar", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; }, {}, never, ["[leading]", "*", "[trailing]"], true, never>;
+}
+
+/** Theme-level options for `uni-avatar`, resolved by token name. */
+interface UniAvatarOptions {
+    /** Corner radius token — `max` renders circles; `sharp` themes get squares. */
+    borderRadius?: Radius;
+    /** Typeface token for the initials. */
+    typeface?: Typeface;
+    /** Symbol shown when there is no image and no name to take initials from. */
+    fallbackSymbol?: string;
+}
+/** Theme-level options for `uni-avatar-group`. */
+interface UniAvatarGroupOptions {
+    /** How far stacked avatars overlap, as a spacing token. */
+    overlap?: OptionalSize;
+    /** Ring color separating stacked avatars from each other. */
+    ringColor?: ColorKey;
+    /** Ring width in px. */
+    ringWidth?: number;
+}
+
+/**
+ * Identity avatar with a graceful fallback chain: image → initials from
+ * `name` → themed symbol. Coloring, radius, typeface and sizes all resolve
+ * from `avatar` theme tokens; `variant` picks the container palette.
+ */
+declare class UniAvatarComponent extends BaseComponent<UniAvatarOptions> {
+    /** Image URL; on load error the avatar falls back to initials/symbol. */
+    src: _angular_core.InputSignal<string>;
+    /** Person's name: drives the initials and the accessible label. */
+    name: _angular_core.InputSignal<string>;
+    /** Verbatim text instead of derived initials (e.g. a group's “+3”). */
+    text: _angular_core.InputSignal<string>;
+    protected readonly imageFailed: _angular_core.WritableSignal<boolean>;
+    protected readonly showImage: _angular_core.Signal<boolean>;
+    protected readonly initials: _angular_core.Signal<string>;
+    protected readonly label: _angular_core.Signal<string>;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniAvatarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniAvatarComponent, "uni-avatar, Avatar", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Overlapping stack of avatars. `max` collapses the overflow into a themed
+ * “+N” chip (itself a `uni-avatar`). Overlap and separator ring resolve from
+ * `avatarGroup` theme tokens.
+ */
+declare class UniAvatarGroupComponent extends BaseComponent<UniAvatarGroupOptions> {
+    /** Show at most this many avatars; the rest collapse into a “+N” chip. */
+    max: _angular_core.InputSignal<number>;
+    private readonly avatars;
+    protected readonly surplus: _angular_core.Signal<number>;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniAvatarGroupComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniAvatarGroupComponent, "uni-avatar-group, AvatarGroup", never, { "max": { "alias": "max"; "required": false; "isSignal": true; }; }, {}, ["avatars"], ["*"], true, never>;
+}
+
+type ImagePosition = 'top' | 'bottom' | 'left' | 'right' | 'center' | string;
+declare class UniBackgroundComponent {
+    theme: ThemeService;
+    image: _angular_core.InputSignal<string>;
+    imagePosition: _angular_core.InputSignal<string>;
+    imageSize: _angular_core.InputSignal<string | number>;
+    height: _angular_core.InputSignal<string | number>;
+    width: _angular_core.InputSignal<string | number>;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniBackgroundComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniBackgroundComponent, "uni-background, Background", never, { "image": { "alias": "image"; "required": false; "isSignal": true; }; "imagePosition": { "alias": "imagePosition"; "required": false; "isSignal": true; }; "imageSize": { "alias": "imageSize"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
 interface UniBadgeOptions {
     borderRadius?: RadiiSize;
 }
@@ -396,6 +489,62 @@ declare class UniBadgeComponent extends BaseComponent<UniBadgeOptions> {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniBadgeComponent, "div[uni-badge], Badge", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "useVariant": { "alias": "useVariant"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+/** One step in the trail. The last item is treated as the current page. */
+interface BreadcrumbItem {
+    label: string;
+    /** Link target. Omit for SPA routing and handle `itemClicked` instead. */
+    href?: string;
+}
+/** Theme-level options for `uni-breadcrumb`, resolved by token name. */
+interface UniBreadcrumbOptions {
+    /** Trail typography token. */
+    typeface?: Typeface;
+    /** Link color for ancestor items. */
+    color?: ColorKey;
+    /** Color of the current (last) item. */
+    currentColor?: ColorKey;
+    /** Material symbol drawn between items. */
+    separatorSymbol?: string;
+    /** Space around separators, as a spacing token. */
+    gap?: OptionalSize;
+}
+
+/**
+ * WAI-ARIA breadcrumb: a `nav` landmark wrapping an ordered list; the last
+ * item is the current page (`aria-current="page"`), separators are decorative.
+ * Items with `href` render as real links; without one they render as
+ * link-styled buttons emitting `itemClicked` — wire that to your router.
+ */
+declare class UniBreadcrumbComponent extends BaseComponent<UniBreadcrumbOptions> {
+    /** The trail, root first; the last item is the current page. */
+    items: _angular_core.InputSignal<BreadcrumbItem[]>;
+    /** Landmark label distinguishing this nav from others on the page. */
+    ariaLabel: _angular_core.InputSignal<string>;
+    /** Emits the clicked ancestor item (also fires for `href` links). */
+    itemClicked: _angular_core.OutputEmitterRef<BreadcrumbItem>;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniBreadcrumbComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniBreadcrumbComponent, "uni-breadcrumb, Breadcrumb", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "itemClicked": "itemClicked"; }, never, never, true, never>;
+}
+
+/** Theme-level options for `uni-text-button`, resolved by token name. */
+interface UniButtonOptions {
+    /**
+     * Corner radius as a radii token. The default theme uses `max` (pill);
+     * because this is a token, the theme's radii scale — including generated
+     * shape languages (`sharp`/`modern`/`playful`) and custom primitives —
+     * restyles every button without touching component code.
+     */
+    borderRadius?: RadiiSize;
+    /**
+     * Label typography as a typeface token. Defaults to the type scale's
+     * `button` role (family/weight/transform); per-size `fontSize` overrides
+     * from the theme's `sizes` still apply on top. Point it at any typeface —
+     * including custom primitives added to the theme's typography.
+     */
+    typeface?: Typeface;
+}
+
 declare class RippleDirective {
     private renderer;
     el: ElementRef<any>;
@@ -408,7 +557,7 @@ declare class RippleDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RippleDirective, "[uniRipple]", never, {}, {}, never, never, true, never>;
 }
 
-declare class UniButtonComponent extends BaseComponent {
+declare class UniButtonComponent extends BaseComponent<UniButtonOptions> {
     readonly disable: _angular_core.InputSignal<boolean>;
     readonly loading: _angular_core.InputSignal<boolean>;
     readonly fullWidth: _angular_core.InputSignal<boolean>;
@@ -456,14 +605,31 @@ declare class UniCardHeaderComponent extends BaseComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniCardHeaderComponent, "uni-card-header, CardHeader", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "titleTextRole": { "alias": "titleTextRole"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+/** Theme-level options for `uni-card`, resolved by token name. */
 interface UniCardOptions {
-    defaultVariant: Variant;
-    borderRadius: Radius;
-    transitionSpeed: number;
+    defaultVariant?: Variant;
+    /** Corner radius as a radii token. The default theme uses `xs`. */
+    borderRadius?: Radius;
+    /**
+     * Frame as a border primitive token. When unset, the card follows its
+     * variant — `borders.primary`, `borders.warn`, … — so redefining a border
+     * primitive restyles every card (and every other component) sharing it.
+     */
+    border?: Border;
+    /** Optional elevation shadow token; cards are flat by default. */
     elevation?: Elevation;
+    transitionSpeed?: number;
 }
 
 declare class UniCardComponent extends BaseComponent<UniCardOptions> {
+    /**
+     * Token-resolved frame (variant-named border primitive, radii, elevation)
+     * under the merged theme style, so hand-authored fixed/variant styles from
+     * older themes keep winning.
+     */
+    protected readonly cardStyle: _angular_core.Signal<{
+        boxShadow: string;
+    }>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniCardComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniCardComponent, "uni-card, Card", never, {}, {}, never, ["*"], true, never>;
 }
@@ -689,6 +855,62 @@ declare class UniDividerComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniDividerComponent, "uni-divider, Divider", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "border": { "alias": "border"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/** How the drawer coexists with page content. */
+type DrawerMode = 'side' | 'over';
+/** Which edge the drawer attaches to (logical: start = left in LTR). */
+type DrawerPosition = 'start' | 'end';
+/** Theme-level options for `uni-drawer`, resolved by token name. */
+interface UniDrawerOptions {
+    /** Panel surface color token (with its paired on-color). */
+    color?: ContainerColorToken;
+    /** Panel width in px. */
+    width?: number;
+    /** Edge rule separating a side drawer from content, as a border primitive. */
+    divider?: Border;
+    /** Elevation shadow token for the overlay mode. */
+    elevation?: Elevation;
+    /** Inner padding, as a spacing token. */
+    padding?: OptionalSize;
+    /** Backdrop styling for the overlay mode. */
+    backdrop?: StyleExpression;
+}
+
+/**
+ * Navigation drawer with two modes sharing one content slot:
+ *
+ * - `side` — an in-flow `<aside>` that pushes content (dashboard sidenav);
+ *   opening/closing animates its width, and the divider border primitive
+ *   separates it from the page.
+ * - `over` — a native `<dialog>` in the top layer: focus trap, Escape and
+ *   scrim backdrop come from the platform (same machinery as `uni-dialog`),
+ *   sliding in from its edge.
+ *
+ * Surface, width, divider, elevation, padding and backdrop all resolve from
+ * `drawer` theme tokens.
+ */
+declare class UniDrawerComponent extends BaseComponent<UniDrawerOptions> {
+    /** Two-way bindable open state: [(open)]. */
+    readonly open: _angular_core.ModelSignal<boolean>;
+    mode: _angular_core.InputSignal<DrawerMode>;
+    position: _angular_core.InputSignal<DrawerPosition>;
+    /** Accessible name for the overlay mode's dialog. */
+    ariaLabel: _angular_core.InputSignal<string>;
+    protected readonly contentTemplate: _angular_core.Signal<TemplateRef<unknown>>;
+    private readonly overlay;
+    constructor();
+    protected onBackdropClick(event: Event): void;
+    /** Route Escape through the animated close, keeping `open` in sync. */
+    protected onCancel(event: Event): void;
+    protected onAnimationEnd(event: AnimationEvent): void;
+    private readonly edge;
+    private readonly slideIn;
+    private readonly slideOut;
+    protected readonly sideClass: _angular_core.Signal<string>;
+    protected readonly overClass: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniDrawerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniDrawerComponent, "uni-drawer, Drawer", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*"], true, never>;
+}
+
 interface UniDropdownOptions {
     border: Border;
     borderRadius: Radius;
@@ -838,7 +1060,9 @@ declare class UniIconComponent {
 
 declare class UniIconButtonComponent {
     private theme;
-    config: _angular_core.Signal<_uni_design_system_uni_core.ComponentTheme<unknown>>;
+    config: _angular_core.Signal<_uni_design_system_uni_core.ComponentTheme<{
+        borderRadius?: RadiiSize;
+    }>>;
     /**
      * Accessible name for the button. Alternative to projecting text content
      * (`<button icon-button>Close</button>`); one of the two is required for
@@ -905,12 +1129,14 @@ declare class UniInputBoxComponent extends BaseComponent<UniInputBoxOptions> {
     disabled: _angular_core.InputSignal<boolean>;
     error: _angular_core.InputSignal<boolean>;
     minWidth: _angular_core.InputSignal<string>;
+    /** Override the themed field height, e.g. `'auto'` for multi-line fields. */
+    height: _angular_core.InputSignal<string | number>;
     protected readonly color: _angular_core.Signal<_uni_design_system_uni_core.ContainerColorToken>;
     protected readonly border: _angular_core.Signal<string>;
     protected readonly shadow: _angular_core.Signal<string>;
     protected readonly inputBoxClass: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniInputBoxComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniInputBoxComponent, "uni-input-box", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniInputBoxComponent, "uni-input-box", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 declare class UniJsonViewComponent {
@@ -1473,6 +1699,196 @@ declare class UniSelectComponent<T> implements FormValueControl<T | null> {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniSelectComponent<any>, "uni-select, SelectInput", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
+/** Placeholder geometry: a text line block, a rectangle, or a circle. */
+type SkeletonShape = 'text' | 'rect' | 'circle';
+/** Theme-level options for `uni-skeleton`, resolved by token name. */
+interface UniSkeletonOptions {
+    /** Base placeholder color. */
+    color?: ColorKey;
+    /** Sweep highlight color for the shimmer. */
+    highlightColor?: ColorKey;
+    /** Corner radius token for text/rect shapes (circles are always round). */
+    borderRadius?: Radius;
+    /** 'shimmer' animates a highlight sweep; 'none' renders static blocks. */
+    animation?: 'shimmer' | 'none';
+    /** Shimmer sweep duration in seconds. */
+    duration?: number;
+    /** Vertical gap between text lines, as a spacing token. */
+    gap?: OptionalSize;
+}
+
+/**
+ * Loading placeholder painted with surface tokens. `text` renders one or more
+ * lines (the last line shortened, as real text would be), `rect` and `circle`
+ * render fixed shapes. The shimmer only animates when the user allows motion;
+ * it degrades to static blocks under `prefers-reduced-motion`.
+ */
+declare class UniSkeletonComponent extends BaseComponent<UniSkeletonOptions> {
+    shape: _angular_core.InputSignal<SkeletonShape>;
+    /** CSS width; defaults to 100% for text/rect and `height` for circles. */
+    width: _angular_core.InputSignal<string | number>;
+    /** CSS height per block; defaults to 1em (text), 96px (rect), 40px (circle). */
+    height: _angular_core.InputSignal<string | number>;
+    /** Number of text lines (text shape only). */
+    lines: _angular_core.InputSignal<number>;
+    private readonly cssSize;
+    protected readonly resolvedHeight: _angular_core.Signal<string>;
+    protected readonly lineWidths: _angular_core.Signal<string[]>;
+    private readonly sweep;
+    protected readonly className: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniSkeletonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniSkeletonComponent, "uni-skeleton, Skeleton", never, { "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "lines": { "alias": "lines"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/** Theme-level options for `uni-slider`, resolved by token name. */
+interface UniSliderOptions {
+    /** Fill and thumb color. */
+    color?: ColorKey;
+    /** Unfilled track color. */
+    trackColor?: ColorKey;
+    /** Track and thumb radius token. */
+    borderRadius?: Radius;
+    /** Track height in px. */
+    trackHeight?: number;
+    /** Thumb diameter in px. */
+    thumbSize?: number;
+}
+
+/**
+ * Range slider on a native `<input type="range">` — keyboard interaction and
+ * the ARIA slider contract come from the platform. Fill, track, thumb and
+ * radii resolve from `slider` theme tokens; the fill percentage rides a CSS
+ * custom property so dragging never regenerates styles.
+ */
+declare class UniSliderComponent extends BaseComponent<UniSliderOptions> implements FormValueControl<number> {
+    readonly value: _angular_core.ModelSignal<number>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
+    readonly invalid: _angular_core.InputSignal<boolean>;
+    readonly dirty: _angular_core.InputSignal<boolean>;
+    /** Synced from required() validators by the Signal Forms [field] directive. */
+    readonly required: _angular_core.InputSignal<boolean>;
+    /**
+     * Id(s) of external element(s) describing this control — typically your
+     * app-rendered value or error text — exposed as aria-describedby.
+     */
+    readonly ariaDescribedBy: _angular_core.InputSignal<string>;
+    label: _angular_core.InputSignal<string>;
+    min: _angular_core.InputSignal<number>;
+    max: _angular_core.InputSignal<number>;
+    step: _angular_core.InputSignal<number>;
+    protected readonly resolvedMin: _angular_core.Signal<number>;
+    protected readonly resolvedMax: _angular_core.Signal<number>;
+    markAsTouched(): void;
+    handleInput(event: Event): void;
+    protected readonly fillPercent: _angular_core.Signal<string>;
+    protected readonly inputClass: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniSliderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniSliderComponent, "uni-slider, Slider", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+}
+
+/**
+ * One tab inside `uni-tabs`: a label for the tablist plus projected panel
+ * content. Content is captured in a template and only instantiated while the
+ * tab is selected, so inactive panels cost nothing.
+ */
+declare class UniTabComponent {
+    label: _angular_core.InputSignal<string>;
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Stable ids wiring tab ↔ panel ARIA relationships. */
+    readonly id: string;
+    readonly panelId: string;
+    readonly content: _angular_core.Signal<TemplateRef<unknown>>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniTabComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniTabComponent, "uni-tab, Tab", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Theme-level options for `uni-tabs`, resolved by token name. The defaults
+ * render Material-style underline tabs; a theme can re-point the tokens to
+ * get pills (`borderRadius: 'max'` + `activeColor`) or any custom treatment.
+ */
+interface UniTabsOptions {
+    /** Tab label typography. */
+    typeface?: Typeface;
+    /** Inactive tab label color. */
+    textColor?: ColorKey;
+    /** Active tab label color. */
+    activeTextColor?: ColorKey;
+    /** Active indicator (underline) color. */
+    indicatorColor?: ColorKey;
+    /** Active indicator height as a thickness token. */
+    indicatorThickness?: Thickness;
+    /** Rule under the whole tablist, as a border primitive token. */
+    divider?: Border;
+    /** Space between tabs, as a spacing token. */
+    gap?: OptionalSize;
+    /** Tab corner radius — 'max' plus `activeColor` gives segmented pills. */
+    borderRadius?: Radius;
+    /** Horizontal padding inside each tab, as a spacing token. */
+    padding?: OptionalSize;
+    /** Optional active tab background color (pill styles). */
+    activeColor?: ColorKey;
+}
+
+/**
+ * WAI-ARIA tabs: roving tabindex, automatic activation (arrow keys move focus
+ * and select), Home/End, disabled tabs skipped. Only the selected panel is
+ * instantiated. All styling resolves from `tabs` theme option tokens.
+ */
+declare class UniTabsComponent extends BaseComponent<UniTabsOptions> {
+    /** Index of the selected tab; two-way bindable. */
+    readonly selectedIndex: _angular_core.ModelSignal<number>;
+    protected readonly tabs: _angular_core.Signal<readonly UniTabComponent[]>;
+    private readonly tabButtons;
+    /** The selection, snapped to the nearest enabled tab. */
+    protected readonly activeIndex: _angular_core.Signal<number>;
+    protected readonly activeTab: _angular_core.Signal<UniTabComponent>;
+    protected select(index: number): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    protected readonly tablistClass: _angular_core.Signal<string>;
+    protected readonly tabClass: _angular_core.Signal<string>;
+    protected readonly panelClass: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniTabsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniTabsComponent, "uni-tabs, Tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; }, ["tabs"], never, true, never>;
+}
+
+declare class UniTextareaComponent implements FormValueControl<string> {
+    private theme;
+    readonly value: _angular_core.ModelSignal<string>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
+    readonly invalid: _angular_core.InputSignal<boolean>;
+    readonly dirty: _angular_core.InputSignal<boolean>;
+    /** Synced from required() validators by the Signal Forms [field] directive. */
+    readonly required: _angular_core.InputSignal<boolean>;
+    /**
+     * Id(s) of external element(s) describing this control — typically your
+     * app-rendered error message — exposed as aria-describedby.
+     */
+    readonly ariaDescribedBy: _angular_core.InputSignal<string>;
+    label: _angular_core.InputSignal<string>;
+    placeholder: _angular_core.InputSignal<string>;
+    /** Visible text rows. Defaults to the theme's `textarea` options. */
+    rows: _angular_core.InputSignal<number>;
+    private options;
+    protected readonly resolvedRows: _angular_core.Signal<number>;
+    protected readonly showError: _angular_core.Signal<boolean>;
+    protected readonly textareaClass: _angular_core.Signal<string>;
+    markAsTouched(): void;
+    handleInput(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UniTextareaComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UniTextareaComponent, "uni-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+}
+
+/** Theme-level options for `uni-textarea`. */
+interface UniTextareaOptions {
+    /** Default visible text rows when the component doesn't set `rows`. */
+    rows?: number;
+    /** CSS resize behavior of the field. */
+    resize?: 'none' | 'vertical' | 'horizontal' | 'both';
+}
+
 declare class UniSortHeaderComponent<T> {
     column: _angular_core.InputSignal<keyof T>;
     datasource: _angular_core.InputSignal<UniDatasource<T>>;
@@ -1537,6 +1953,7 @@ declare class UniThemeBuilderComponent {
     protected theme: ThemeService;
     protected readonly schemes: ColorScheme[];
     protected readonly categories: ColorCategory[];
+    protected readonly shapes: ThemeShape[];
     protected readonly variants: Variant[];
     protected readonly sizes: readonly ["sm", "md", "lg", "xl"];
     protected readonly swatches: {
@@ -1548,6 +1965,7 @@ declare class UniThemeBuilderComponent {
     protected seed: _angular_core.WritableSignal<string>;
     protected scheme: _angular_core.WritableSignal<ColorScheme>;
     protected category: _angular_core.WritableSignal<ColorCategory>;
+    protected shape: _angular_core.WritableSignal<ThemeShape>;
     protected floor: _angular_core.WritableSignal<number>;
     protected mode: _angular_core.WritableSignal<"light" | "dark">;
     protected pinPrimary: _angular_core.WritableSignal<boolean>;
@@ -1556,14 +1974,43 @@ declare class UniThemeBuilderComponent {
     protected secondaryHex: _angular_core.WritableSignal<string>;
     /** Soft brand targets carried by the active preset (cleared on seed edits). */
     protected targets: _angular_core.WritableSignal<Partial<Record<_uni_design_system_uni_core.BrandRole, string>>>;
+    protected copied: _angular_core.WritableSignal<"file" | "ngadd" | "dtcg">;
+    protected showAllPairs: _angular_core.WritableSignal<boolean>;
     constructor();
     protected config: _angular_core.Signal<BrandPaletteConfig>;
+    /**
+     * Both modes generated on every input change (< 15 ms each), independent of
+     * the storybook-wide theme — the side-by-side preview and the contrast
+     * report always show the full light+dark picture.
+     */
+    protected palettes: _angular_core.Signal<{
+        light: Partial<Record<string, string>>;
+        dark: Partial<Record<string, string>>;
+        checks: ContrastCheck[];
+    }>;
+    protected modePanels: _angular_core.Signal<{
+        label: "light" | "dark";
+        colors: Colors;
+    }[]>;
+    protected report: _angular_core.Signal<{
+        checks: ContrastCheck[];
+        failing: ContrastCheck[];
+        worst: number;
+    }>;
+    protected visibleChecks: _angular_core.Signal<ContrastCheck[]>;
     protected snippet: _angular_core.Signal<string>;
+    /** The builder state expressed as engine input — drives all three exports. */
+    protected generationInput: _angular_core.Signal<GenerationInput>;
     protected color(token: ColorToken): string;
     private apply;
+    private copyToClipboard;
+    protected copyThemeFile(): void;
+    protected copyNgAdd(): void;
+    protected copyDtcg(): void;
     protected setSeed(v: string): void;
     protected setScheme(v: ColorScheme): void;
     protected setCategory(v: ColorCategory): void;
+    protected setShape(v: ThemeShape): void;
     protected setFloor(v: string): void;
     protected setMode(v: 'light' | 'dark'): void;
     protected setPinPrimary(v: boolean): void;
@@ -1673,5 +2120,5 @@ declare class DragAndDropDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DragAndDropDirective, "[uni-drag-n-drop], [dragAndDrop]", never, {}, { "onFileDropped": "onFileDropped"; }, never, never, true, never>;
 }
 
-export { BodyRenderDirective, ConfirmationDialogComponent, DragAndDropDirective, FOCUSABLE_SELECTOR, LocalStorageService, NotificationService, NotificationsComponent, RippleDirective, ThemeService, UNI_THEMES, UniAlertComponent, UniBackgroundComponent, UniBadgeComponent, UniBaseDatasource, UniBoxComponent, UniButtonComponent, UniButtonGroupComponent, UniCardComponent, UniCardContentComponent, UniCardHeaderComponent, UniCenterComponent, UniCheckboxComponent, UniDataSearchComponent, UniDataTableComponent, UniDebounceInputComponent, UniDialogButtonsComponent, UniDialogComponent, UniDialogHeaderComponent, UniDividerComponent, UniDropdownComponent, UniExpandAreaComponent, UniExpandComponent, UniExpandToggleComponent, UniFileDropZoneComponent, UniGridAreaComponent, UniGridComponent, UniIconButtonComponent, UniIconComponent, UniInputBoxComponent, UniInputComponent, UniJsonViewComponent, UniMenuComponent, UniMultiSelectComponent, UniMultiSelectDropdownComponent, UniNotificationBadgeComponent, UniPaginatorComponent, UniPopoverComponent, UniProgressBarComponent, UniProgressGaugeComponent, UniRadioComponent, UniRecordDatasource, UniRowComponent, UniScrollAreaComponent, UniSearchInputComponent, UniSelectComponent, UniServerSideDatasource, UniSnackbarComponent, UniSortHeaderComponent, UniStackComponent, UniSymbolComponent, UniTagComponent, UniTextComponent, UniThemeBuilderComponent, UniToggleComponent, UniTooltipComponent, UniWrapComponent, acceptableFile, anchorArrowStyles, anchorStyles, getFileExtension, motionSafe, newAnchorName, resolveFocusTarget, uniqueId, useTimer, visuallyHidden };
-export type { Alert, AnchorOffset, BrandPaletteConfig, ButtonGroupConfig, ButtonGroupItem, ColumnDefinition, Confirmation, DataLoader, ImagePosition, MenuItem, MenuItemWithLabel, MenuItemWithTemplate, Option, Options, PageRequest, PageResponse, Placement, ScrollbarAppearance, Snackbar, Sort, SortDirection, UniCheckboxOptions, UniDataSearchOptions, UniDataTableOptions, UniDatasource, UniInputBoxOptions, UniMultiSelectDropdownOptions, UniNotificationBadgeOptions, UniPaginatorOptions, UniRadioOption, UniRadioOptions, UniToggleOptions };
+export { BodyRenderDirective, ConfirmationDialogComponent, DragAndDropDirective, FOCUSABLE_SELECTOR, LocalStorageService, NotificationService, NotificationsComponent, RippleDirective, ThemeService, UNI_THEMES, UniAlertComponent, UniAppBarComponent, UniAvatarComponent, UniAvatarGroupComponent, UniBackgroundComponent, UniBadgeComponent, UniBaseDatasource, UniBoxComponent, UniBreadcrumbComponent, UniButtonComponent, UniButtonGroupComponent, UniCardComponent, UniCardContentComponent, UniCardHeaderComponent, UniCenterComponent, UniCheckboxComponent, UniDataSearchComponent, UniDataTableComponent, UniDebounceInputComponent, UniDialogButtonsComponent, UniDialogComponent, UniDialogHeaderComponent, UniDividerComponent, UniDrawerComponent, UniDropdownComponent, UniExpandAreaComponent, UniExpandComponent, UniExpandToggleComponent, UniFileDropZoneComponent, UniGridAreaComponent, UniGridComponent, UniIconButtonComponent, UniIconComponent, UniInputBoxComponent, UniInputComponent, UniJsonViewComponent, UniMenuComponent, UniMultiSelectComponent, UniMultiSelectDropdownComponent, UniNotificationBadgeComponent, UniPaginatorComponent, UniPopoverComponent, UniProgressBarComponent, UniProgressGaugeComponent, UniRadioComponent, UniRecordDatasource, UniRowComponent, UniScrollAreaComponent, UniSearchInputComponent, UniSelectComponent, UniServerSideDatasource, UniSkeletonComponent, UniSliderComponent, UniSnackbarComponent, UniSortHeaderComponent, UniStackComponent, UniSymbolComponent, UniTabComponent, UniTabsComponent, UniTagComponent, UniTextComponent, UniTextareaComponent, UniThemeBuilderComponent, UniToggleComponent, UniTooltipComponent, UniWrapComponent, acceptableFile, anchorArrowStyles, anchorStyles, getFileExtension, motionSafe, newAnchorName, resolveFocusTarget, uniqueId, useTimer, visuallyHidden };
+export type { Alert, AnchorOffset, BrandPaletteConfig, BreadcrumbItem, ButtonGroupConfig, ButtonGroupItem, ColumnDefinition, Confirmation, DataLoader, DrawerMode, DrawerPosition, ImagePosition, MenuItem, MenuItemWithLabel, MenuItemWithTemplate, Option, Options, PageRequest, PageResponse, Placement, ScrollbarAppearance, SkeletonShape, Snackbar, Sort, SortDirection, UniAppBarOptions, UniAvatarGroupOptions, UniAvatarOptions, UniBreadcrumbOptions, UniCheckboxOptions, UniDataSearchOptions, UniDataTableOptions, UniDatasource, UniDrawerOptions, UniInputBoxOptions, UniMultiSelectDropdownOptions, UniNotificationBadgeOptions, UniPaginatorOptions, UniRadioOption, UniRadioOptions, UniSkeletonOptions, UniSliderOptions, UniTabsOptions, UniTextareaOptions, UniToggleOptions };