yukit-web 0.0.3 → 0.0.5

package/types/yukit-web.d.ts

@@ -15,6 +15,7 @@ import * as i2 from 'yukit-web/helm/dropdown-menu';
 import * as i1$5 from 'yukit-web/helm/table';
 import * as _tanstack_angular_table from '@tanstack/angular-table';
 import { columnFilteringFeature, columnVisibilityFeature, rowPaginationFeature, rowSelectionFeature, rowSortingFeature, RowData, ColumnDef, SortingState, ColumnFiltersState, ColumnVisibilityState, RowSelectionState, PaginationState } from '@tanstack/table-core';
+import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as i1$6 from 'yukit-web/helm/item';
 import { HlmItemSeparator } from 'yukit-web/helm/item';
 import * as i1$7 from '@spartan-ng/brain/sheet';
@@ -26,6 +27,7 @@ import * as i1$a from '@spartan-ng/brain/dialog';
 import * as i1$b from '@spartan-ng/brain/alert-dialog';
 import * as i1$c from 'yukit-web/helm/attachment';
 import { HlmAttachmentAction } from 'yukit-web/helm/attachment';
+import { RouterLink } from '@angular/router';
 import * as i1$d from 'yukit-web/helm/sidebar';
 export { HlmSidebarConfig as YuwSidebarConfigDto, HlmSidebarService as YuwSidebarService, SidebarVariant as YuwSidebarServiceVariantDto, provideHlmSidebarConfig as provideYuwSidebarConfig } from 'yukit-web/helm/sidebar';
 
@@ -88,6 +90,7 @@ declare abstract class YuwValueAccessorBase<T> implements ControlValueAccessor {
 
 type YuwInputTypeDto = 'text' | 'email' | 'tel' | 'url' | 'number';
 type YuwInputModeDto = 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+type YuwFieldSizeDto = 'default' | 'xs' | 'sm' | 'lg';
 interface YuwTextFieldContract {
     readonly value: ModelSignal<string>;
     readonly inputId: InputSignal<string | undefined>;
@@ -207,7 +210,8 @@ interface YuwButtonGroupClickDto {
  * ```
  */
 declare class YuwButtonComponent {
-    readonly variant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    private readonly _host;
+    readonly variant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly size: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
     readonly color: _angular_core.InputSignal<YuwColorDto>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -220,16 +224,14 @@ declare class YuwButtonComponent {
     readonly buttons: _angular_core.InputSignal<YuwButtonGroupEntryDto[] | undefined>;
     readonly orientation: _angular_core.InputSignal<"horizontal" | "vertical">;
     readonly groupAriaLabel: _angular_core.InputSignal<string | undefined>;
-    /**
-     * Consumer CSS classes for the inner button/anchor (single and link mode). Merged last with
-     * `cn`, so they win over the component's own variant/transparent classes.
-     */
+    readonly animationDisabled: _angular_core.InputSignal<boolean>;
     readonly userClass: _angular_core.InputSignal<string>;
     readonly clicked: _angular_core.OutputEmitterRef<MouseEvent>;
     readonly buttonClicked: _angular_core.OutputEmitterRef<YuwButtonGroupClickDto>;
-    protected readonly _textClass = "bg-transparent text-foreground";
+    protected readonly _textClass = "bg-transparent text-foreground border-border dark:border-input";
     protected readonly _isGroup: _angular_core.Signal<boolean>;
-    protected readonly _effectiveVariant: _angular_core.Signal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    protected readonly _animationDisabled: _angular_core.Signal<boolean>;
+    protected readonly _effectiveVariant: _angular_core.Signal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     /** Classes for the single-mode button/anchor: our variant layer + the consumer's `class`, which goes last so it wins. */
     protected readonly _btnClass: _angular_core.Signal<string>;
     private readonly _texts;
@@ -247,7 +249,7 @@ declare class YuwButtonComponent {
         kind: "text";
         label?: string;
     } | {
-        variant: "secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined;
+        variant: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
         size: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
         color: YuwColorDto;
         disabled: boolean;
@@ -265,7 +267,7 @@ declare class YuwButtonComponent {
     protected onClick(event: MouseEvent): void;
     protected onGroupClick(button: YuwButtonGroupItemDto, event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwButtonComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwButtonComponent, "yuw-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "transparent": { "alias": "transparent"; "required": false; "isSignal": true; }; "yuwDropdownMenuTrigger": { "alias": "yuwDropdownMenuTrigger"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "buttons": { "alias": "buttons"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "groupAriaLabel": { "alias": "groupAriaLabel"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; "buttonClicked": "buttonClicked"; }, ["_texts"], ["[yuwButtonIcon]", "*", "[yuwButtonIcon]", "*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwButtonComponent, "yuw-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "transparent": { "alias": "transparent"; "required": false; "isSignal": true; }; "yuwDropdownMenuTrigger": { "alias": "yuwDropdownMenuTrigger"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "buttons": { "alias": "buttons"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "groupAriaLabel": { "alias": "groupAriaLabel"; "required": false; "isSignal": true; }; "animationDisabled": { "alias": "animationDisabled"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; "buttonClicked": "buttonClicked"; }, ["_texts"], ["[yuwButtonIcon]", "*", "[yuwButtonIcon]", "*"], true, never>;
 }
 
 /**
@@ -308,7 +310,7 @@ declare class YuwButtonGroupTextDirective {
  * ```
  */
 declare class YuwBadgeComponent {
-    readonly variant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly variant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly color: _angular_core.InputSignal<YuwColorDto>;
     readonly removeLabel: _angular_core.InputSignal<string | undefined>;
     readonly dot: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -454,6 +456,9 @@ type YuwComboboxValue = string | string[] | undefined;
  * - `options`: Required array of option items (`YuwComboboxOptionDto<TData>[]`).
  * - `value`: Two-way selected value(s) (`string` for single mode, `string[]` for multiple mode).
  *   Emits `valueChange` on every selection change.
+ * - `size`: Control height (`'default'` 40px, `'xs'` 28px, `'sm'` 36px, `'lg'` 44px), matching the
+ *   `<yuw-button>` size of the same name. Applies to whichever control shape renders; the popover
+ *   panel and its inner search field keep their own compact sizing.
  * - `multiple`: Enables multi-selection mode with removable tags/chips.
  * - `disabled`: Disables combobox interaction.
  * - `placeholder`: Placeholder text when no option is selected.
@@ -486,6 +491,7 @@ type YuwComboboxValue = string | string[] | undefined;
 declare class YuwComboboxComponent<TData = unknown> extends YuwValueAccessorBase<YuwComboboxValue> {
     readonly options: _angular_core.InputSignal<YuwComboboxOptionDto<TData>[]>;
     readonly value: _angular_core.ModelSignal<YuwComboboxValue>;
+    readonly size: _angular_core.InputSignal<YuwFieldSizeDto>;
     readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly placeholder: _angular_core.InputSignal<string | undefined>;
@@ -501,6 +507,9 @@ declare class YuwComboboxComponent<TData = unknown> extends YuwValueAccessorBase
     private readonly _panel;
     protected readonly _disabled: _angular_core.Signal<boolean>;
     protected readonly _clearVisible: _angular_core.Signal<boolean>;
+    protected readonly _fieldClass: _angular_core.Signal<string>;
+    protected readonly _chipsClass: _angular_core.Signal<string>;
+    protected readonly _triggerClass: _angular_core.Signal<string>;
     private readonly _generatedId;
     protected readonly _controlId: _angular_core.Signal<string>;
     protected readonly _singleValue: _angular_core.Signal<string | undefined>;
@@ -516,7 +525,7 @@ declare class YuwComboboxComponent<TData = unknown> extends YuwValueAccessorBase
     protected onValueChange(next: YuwComboboxValue | null): void;
     protected _onFocusOut(event: FocusEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwComboboxComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwComboboxComponent<any>, "yuw-combobox", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "triggerAriaLabel": { "alias": "triggerAriaLabel"; "required": true; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "readonlyTrigger": { "alias": "readonlyTrigger"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["itemTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwComboboxComponent<any>, "yuw-combobox", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "triggerAriaLabel": { "alias": "triggerAriaLabel"; "required": true; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "readonlyTrigger": { "alias": "readonlyTrigger"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["itemTemplate"], never, true, never>;
 }
 
 /**
@@ -598,6 +607,8 @@ declare const YuwAccordionImports: readonly [typeof YuwAccordion, typeof YuwAcco
  * - `value`: Two-way text string.
  * - `inputId`: `id` applied to the native input, for external `<label for>` association.
  * - `type`: HTML input type (`'text'`, `'email'`, `'number'`, etc.). Default is `'text'`.
+ * - `size`: Control height (`'default'` 40px, `'xs'` 28px, `'sm'` 36px, `'lg'` 44px), matching the
+ *   `<yuw-button>` size of the same name. Default is `'default'`.
  * - `inputmode`: Virtual keyboard hint (e.g. `'numeric'`).
  * - `disabled`: Disables input interaction.
  * - `readonly`: Makes the field read-only.
@@ -625,6 +636,7 @@ declare class YuwInputComponent extends YuwValueAccessorBase<string> implements
     readonly value: _angular_core.ModelSignal<string>;
     readonly inputId: _angular_core.InputSignal<string | undefined>;
     readonly type: _angular_core.InputSignal<YuwInputTypeDto>;
+    readonly size: _angular_core.InputSignal<YuwFieldSizeDto>;
     readonly inputmode: _angular_core.InputSignal<YuwInputModeDto | undefined>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -649,7 +661,7 @@ declare class YuwInputComponent extends YuwValueAccessorBase<string> implements
     protected _emptyValue(): string;
     protected onChange(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwInputComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwInputComponent, "yuw-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "inputmode": { "alias": "inputmode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "committed": "committed"; }, ["_leftAddons", "_rightAddons"], ["yuw-left-addon", "yuw-right-addon"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwInputComponent, "yuw-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inputmode": { "alias": "inputmode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "committed": "committed"; }, ["_leftAddons", "_rightAddons"], ["yuw-left-addon", "yuw-right-addon"], true, never>;
 }
 
 /**
@@ -754,6 +766,8 @@ type YuwSearchInputCollapseFromDto = 'left' | 'right';
  *   app is responsible for translating.
  * - `expandedWidth`: CSS width the field animates out to, e.g. `'18rem'`. Default is `'16rem'`.
  *   Collapsible mode only.
+ * - `transparent`: Removes the field's resting border and background so it sits directly on its
+ *   container — for search inside a toolbar or a colored surface. The focus and invalid rings stay.
  * - `class`: Extra classes merged onto the input group.
  *
  * Outputs:
@@ -797,6 +811,7 @@ declare class YuwSearchInputComponent extends YuwValueAccessorBase<string> imple
     readonly collapseFrom: _angular_core.InputSignal<YuwSearchInputCollapseFromDto | undefined>;
     readonly expandedWidth: _angular_core.InputSignal<string>;
     readonly expandAriaLabel: _angular_core.InputSignal<string | undefined>;
+    readonly transparent: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly userClass: _angular_core.InputSignal<string>;
     private readonly _open;
     protected readonly _autoId: string;
@@ -837,7 +852,7 @@ declare class YuwSearchInputComponent extends YuwValueAccessorBase<string> imple
     protected onEscape(): void;
     protected onBlur(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSearchInputComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSearchInputComponent, "yuw-search-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "collapseFrom": { "alias": "collapseFrom"; "required": false; "isSignal": true; }; "expandedWidth": { "alias": "expandedWidth"; "required": false; "isSignal": true; }; "expandAriaLabel": { "alias": "expandAriaLabel"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "searched": "searched"; "committed": "committed"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSearchInputComponent, "yuw-search-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "collapseFrom": { "alias": "collapseFrom"; "required": false; "isSignal": true; }; "expandedWidth": { "alias": "expandedWidth"; "required": false; "isSignal": true; }; "expandAriaLabel": { "alias": "expandAriaLabel"; "required": false; "isSignal": true; }; "transparent": { "alias": "transparent"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "searched": "searched"; "committed": "committed"; }, never, never, true, never>;
 }
 
 /**
@@ -1601,6 +1616,37 @@ declare class YuwCaptionDirective {
 /** Every table part, for a consumer's `imports`. */
 declare const YuwTableImports: readonly [typeof YuwTableContainerDirective, typeof YuwTableDirective, typeof YuwTHeadDirective, typeof YuwTBodyDirective, typeof YuwTFootDirective, typeof YuwTrDirective, typeof YuwThDirective, typeof YuwTdDirective, typeof YuwCaptionDirective];
 
+type YuwDatatableAlign = 'start' | 'center' | 'end';
+/**
+ * Class maps for `yuw-datatable`, layered on top of the Hlm table directives' own classes.
+ *
+ * `DATATABLE_ALIGN_CLASS` is keyed by a column's `meta.align` and shared by header and body cells,
+ * so a column declares its alignment once and both honour it; `start` maps to an empty string
+ * rather than re-stating what `HlmTh`/`HlmTd` already apply.
+ *
+ * The `appearance` maps are split per element because the treatment is not uniform: `card` frames
+ * the container so the header tint clips to the radius instead of squaring off against a
+ * consumer's wrapper, then drops the header's bottom border, since a rule underneath a filled
+ * strip reads as a seam. `default` resolves to an empty string throughout, leaving a table that
+ * does not opt in byte-identical to what the Hlm directives render alone.
+ */
+declare const DATATABLE_ALIGN_CLASS: Record<YuwDatatableAlign, string>;
+declare const datatableContainerVariants: (props?: ({
+    appearance?: "default" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const datatableHeadVariants: (props?: ({
+    appearance?: "default" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const datatableHeaderCellVariants: (props?: ({
+    appearance?: "default" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const datatableCellVariants: (props?: ({
+    appearance?: "default" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const datatableRowVariants: (props?: ({
+    appearance?: "default" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
 /**
  * The feature set `yuw-datatable` enables.
  *
@@ -1611,14 +1657,28 @@ declare const YuwTableImports: readonly [typeof YuwTableContainerDirective, type
  * (`getState`, `getCanNextPage`, …) missing from the instance type.
  */
 interface YuwDatatableFeatures {
+    columnMeta: YuwDatatableColumnMeta;
     columnFilteringFeature: typeof columnFilteringFeature;
     columnVisibilityFeature: typeof columnVisibilityFeature;
     rowPaginationFeature: typeof rowPaginationFeature;
     rowSelectionFeature: typeof rowSelectionFeature;
     rowSortingFeature: typeof rowSortingFeature;
 }
+/**
+ * Per-column options `yuw-datatable` reads off TanStack's `meta`, where `align` sets the
+ * horizontal alignment of that column's header and body cells and defaults to `'start'`.
+ *
+ * TanStack resolves `columnDef.meta` from a feature set's own `columnMeta` slot when it declares
+ * one, falling back to its global declaration-merged `ColumnMeta` otherwise. Declaring the slot on
+ * `YuwDatatableFeatures` is what constrains our columns to this shape — without it, `meta` is the
+ * empty global interface, which accepts any object and would catch no typo.
+ */
+interface YuwDatatableColumnMeta {
+    align?: YuwDatatableAlign;
+}
 declare const YUW_DATATABLE_FEATURES: YuwDatatableFeatures;
 type YuwDatatableColumnDef<TData extends RowData> = ColumnDef<YuwDatatableFeatures, TData>;
+type YuwDatatableAppearanceDto = 'default' | 'card';
 /**
  * Full-featured data table component supporting sorting, filtering, pagination, row selection,
  * loading skeleton state, and column visibility.
@@ -1649,6 +1709,15 @@ type YuwDatatableColumnDef<TData extends RowData> = ColumnDef<YuwDatatableFeatur
  *   responsible for translating; when absent, no caption is rendered.
  * - `tableClass`: Extra classes merged onto the inner `<table>` element. The host is
  *   `display: contents`, so a plain `class` on `<yuw-datatable>` would never reach the table.
+ * - `appearance`: Visual treatment (`YuwDatatableAppearanceDto`). Default is `'default'` —
+ *   Spartan's plain table. `'card'` frames the table in its own rounded bordered surface with a
+ *   tinted uppercase header strip and taller rows; the consumer needs no wrapper of its own.
+ *
+ * Per-column, through TanStack's `meta`:
+ * - `meta.align`: `'start' | 'center' | 'end'`, applied to both the header and body cells of that
+ *   column. Default is `'start'`. Alignment and the appearance's own cell classes are resolved
+ *   once into a per-column-id lookup rather than in the template, because a template method would
+ *   re-run the class merge for every cell on every change-detection pass.
  * - `sorting`: Two-way sorting state (`SortingState`).
  * - `columnFilters`: Two-way column filters state (`ColumnFiltersState`).
  * - `columnVisibility`: Two-way column visibility state (`ColumnVisibilityState`).
@@ -1665,6 +1734,7 @@ type YuwDatatableColumnDef<TData extends RowData> = ColumnDef<YuwDatatableFeatur
  *   [columns]="columns"
  *   [data]="users"
  *   [(sorting)]="sorting"
+ *   appearance="card"
  *   paginated
  *   selectable
  *   previousPageLabel="Página anterior"
@@ -1672,6 +1742,13 @@ type YuwDatatableColumnDef<TData extends RowData> = ColumnDef<YuwDatatableFeatur
  *   (selectedRowsChange)="onSelect($event)"
  * />
  * ```
+ *
+ * ```ts
+ * const columns: YuwDatatableColumnDef<Client>[] = [
+ *   { accessorKey: 'name', header: 'Nombre' },
+ *   { accessorKey: 'cif', header: 'CIF', meta: { align: 'center' } },
+ * ];
+ * ```
  */
 declare class YuwDatatableComponent<TData extends RowData> implements OnInit {
     readonly columns: _angular_core.InputSignal<YuwDatatableColumnDef<TData>[]>;
@@ -1688,6 +1765,7 @@ declare class YuwDatatableComponent<TData extends RowData> implements OnInit {
     readonly paginationAriaLabel: _angular_core.InputSignal<string>;
     readonly caption: _angular_core.InputSignal<string | undefined>;
     readonly tableClass: _angular_core.InputSignal<string | undefined>;
+    readonly appearance: _angular_core.InputSignal<YuwDatatableAppearanceDto>;
     readonly sorting: _angular_core.ModelSignal<SortingState>;
     readonly columnFilters: _angular_core.ModelSignal<ColumnFiltersState>;
     readonly columnVisibility: _angular_core.ModelSignal<ColumnVisibilityState>;
@@ -1719,9 +1797,17 @@ declare class YuwDatatableComponent<TData extends RowData> implements OnInit {
     protected readonly _columnCount: _angular_core.Signal<number>;
     protected readonly _skeletonRows: _angular_core.Signal<number[]>;
     protected readonly _tableClass: _angular_core.Signal<string>;
+    protected readonly _containerClass: _angular_core.Signal<string>;
+    protected readonly _headClass: _angular_core.Signal<string>;
+    protected readonly _rowClass: _angular_core.Signal<string>;
+    protected readonly _cellClasses: _angular_core.Signal<Map<string, {
+        readonly header: string;
+        readonly cell: string;
+    }>>;
     protected readonly _ariaSort: Record<'asc' | 'desc', 'ascending' | 'descending'>;
+    protected readonly _sortIcon: Record<'asc' | 'desc' | 'none', string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwDatatableComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwDatatableComponent<any>, "yuw-datatable", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "paginated": { "alias": "paginated"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingRows": { "alias": "loadingRows"; "required": false; "isSignal": true; }; "previousPageLabel": { "alias": "previousPageLabel"; "required": true; "isSignal": true; }; "nextPageLabel": { "alias": "nextPageLabel"; "required": true; "isSignal": true; }; "paginationEllipsisSrText": { "alias": "paginationEllipsisSrText"; "required": true; "isSignal": true; }; "paginationAriaLabel": { "alias": "paginationAriaLabel"; "required": true; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "tableClass": { "alias": "tableClass"; "required": false; "isSignal": true; }; "sorting": { "alias": "sorting"; "required": false; "isSignal": true; }; "columnFilters": { "alias": "columnFilters"; "required": false; "isSignal": true; }; "columnVisibility": { "alias": "columnVisibility"; "required": false; "isSignal": true; }; "rowSelection": { "alias": "rowSelection"; "required": false; "isSignal": true; }; "pagination": { "alias": "pagination"; "required": false; "isSignal": true; }; }, { "sorting": "sortingChange"; "columnFilters": "columnFiltersChange"; "columnVisibility": "columnVisibilityChange"; "rowSelection": "rowSelectionChange"; "pagination": "paginationChange"; "selectedRowsChange": "selectedRowsChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwDatatableComponent<any>, "yuw-datatable", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "paginated": { "alias": "paginated"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingRows": { "alias": "loadingRows"; "required": false; "isSignal": true; }; "previousPageLabel": { "alias": "previousPageLabel"; "required": true; "isSignal": true; }; "nextPageLabel": { "alias": "nextPageLabel"; "required": true; "isSignal": true; }; "paginationEllipsisSrText": { "alias": "paginationEllipsisSrText"; "required": true; "isSignal": true; }; "paginationAriaLabel": { "alias": "paginationAriaLabel"; "required": true; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "tableClass": { "alias": "tableClass"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "sorting": { "alias": "sorting"; "required": false; "isSignal": true; }; "columnFilters": { "alias": "columnFilters"; "required": false; "isSignal": true; }; "columnVisibility": { "alias": "columnVisibility"; "required": false; "isSignal": true; }; "rowSelection": { "alias": "rowSelection"; "required": false; "isSignal": true; }; "pagination": { "alias": "pagination"; "required": false; "isSignal": true; }; }, { "sorting": "sortingChange"; "columnFilters": "columnFiltersChange"; "columnVisibility": "columnVisibilityChange"; "rowSelection": "rowSelectionChange"; "pagination": "paginationChange"; "selectedRowsChange": "selectedRowsChange"; }, never, never, true, never>;
 }
 
 /** A single entry in `<yuw-avatar>`'s `group` input, which turns it into a stack of overlapping avatars. */
@@ -1902,7 +1988,7 @@ declare class YuwSheetComponent {
     readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
     readonly closeLabel: _angular_core.InputSignal<string | undefined>;
     readonly panelClass: _angular_core.InputSignal<string | undefined>;
-    readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly triggerVariant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
     protected readonly hasFooter: _angular_core.Signal<YuwSheetFooterDirective | undefined>;
     protected readonly _sheetState: _angular_core.Signal<"open" | "closed">;
@@ -1969,7 +2055,7 @@ declare class YuwPopoverComponent {
     readonly title: _angular_core.InputSignal<string | undefined>;
     readonly description: _angular_core.InputSignal<string | undefined>;
     readonly panelClass: _angular_core.InputSignal<string | undefined>;
-    readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly triggerVariant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
     readonly triggerTransparent: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly triggerClass: _angular_core.InputSignal<string>;
@@ -2216,7 +2302,7 @@ declare class YuwDialogComponent {
     readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
     readonly closeLabel: _angular_core.InputSignal<string | undefined>;
     readonly panelClass: _angular_core.InputSignal<string | undefined>;
-    readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly triggerVariant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
     protected readonly hasFooter: _angular_core.Signal<YuwDialogFooterDirective | undefined>;
     protected readonly _dialogState: _angular_core.Signal<"open" | "closed">;
@@ -2299,9 +2385,9 @@ declare class YuwAlertDialogComponent {
     readonly description: _angular_core.InputSignal<string | undefined>;
     readonly confirmLabel: _angular_core.InputSignal<string>;
     readonly cancelLabel: _angular_core.InputSignal<string>;
-    readonly confirmVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly confirmVariant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly size: _angular_core.InputSignal<YuwAlertDialogSizeDto>;
-    readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
+    readonly triggerVariant: _angular_core.InputSignal<"default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined>;
     readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
     readonly confirmed: _angular_core.OutputEmitterRef<void>;
     readonly cancelled: _angular_core.OutputEmitterRef<void>;
@@ -2463,6 +2549,103 @@ declare class YuwAttachmentTriggerDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentTriggerDirective, "button[yuwAttachmentTrigger], a[yuwAttachmentTrigger]", never, {}, {}, never, never, true, [{ directive: typeof i1$c.HlmAttachmentTrigger; inputs: { "type": "type"; }; outputs: {}; }]>;
 }
 
+/**
+ * Where a sidebar entry points.
+ *
+ * Split across two target fields rather than one, because they drive different mechanisms: `route`
+ * binds `[routerLink]` (in-app navigation, and the source of the entry's automatic active state),
+ * `href` binds a plain `[href]` (full page load, external URLs). `helm/breadcrumb` shows the cost of
+ * conflating them — its DTO field is named `href` but is wired to `routerLink`, so a consumer
+ * passing an external URL gets silent router navigation to a route that doesn't exist.
+ *
+ * An entry with neither renders as a `<button>` and reports through `itemClicked`.
+ *
+ * - `route`: in-app target, accepting anything `[routerLink]` does, including a command array.
+ * - `href`: external or non-router target, bound to a plain anchor.
+ * - `target`: `target` attribute, only meaningful alongside `href`.
+ * - `exact`: whether the active state requires a full URL match, mapping to
+ *   `routerLinkActiveOptions.exact`; applies only to a `route`. Default is `false`, so a parent
+ *   route stays highlighted while a child is open — set it on a root path like `/` that would
+ *   otherwise match everything.
+ */
+interface YuwSidebarNavigationDto {
+    route?: RouterLink['routerLink'];
+    href?: string;
+    target?: string;
+    exact?: boolean;
+}
+/**
+ * A submenu entry, nested under a {@link YuwSidebarItemDto}.
+ *
+ * Deliberately not the same type as its parent: the helm sub-button renders no icon, no badge and
+ * no further nesting, so reusing `YuwSidebarItemDto` here would hand consumers three fields that
+ * silently do nothing. Same reasoning as `YuwButtonGroupTextDto`.
+ *
+ * `label` is supplied already translated — the sidebar owns no user-facing copy.
+ */
+interface YuwSidebarSubItemDto extends YuwSidebarNavigationDto {
+    id: string;
+    label: string;
+    disabled?: boolean;
+}
+/**
+ * A single entry of a sidebar menu.
+ *
+ * Renders an anchor when it carries a `route` or `href`, and a `<button>` otherwise — the data says
+ * which it is, so there is no `kind` field to keep in sync with it.
+ *
+ * - `label`: text of the entry, supplied already translated — the sidebar owns no user-facing copy.
+ * - `icon`: name of a registered `@ng-icons` icon. Because the *consumer* chooses this name, the
+ *   consuming app is responsible for `provideIcons()`-ing it; `provideIcons` is a component-level
+ *   provider, so a name registered on the component hosting the sidebar resolves here through the
+ *   injector chain. Same contract as `<yuw-spinner icon="…">`.
+ * - `badge`: short trailing count or status, hidden automatically while collapsed to icons.
+ * - `tooltip`: label shown while collapsed to icons, where `label` is not visible. Falls back to
+ *   `label` when absent, so the common case needs no second field.
+ */
+interface YuwSidebarItemDto extends YuwSidebarNavigationDto {
+    id: string;
+    label: string;
+    icon?: string;
+    badge?: string;
+    tooltip?: string;
+    disabled?: boolean;
+    children?: YuwSidebarSubItemDto[];
+}
+/**
+ * A titled section of the sidebar.
+ *
+ * `label` is heading text, already translated; omitting it renders the menu with no heading.
+ * `separatorAfter` draws a divider after the group — for separating a settings block from the
+ * main nav.
+ */
+interface YuwSidebarGroupDto {
+    id: string;
+    label?: string;
+    items: YuwSidebarItemDto[];
+    separatorAfter?: boolean;
+}
+/**
+ * What `<yuw-sidebar>`'s `content` and `footer` inputs accept.
+ *
+ * An object rather than a bare `YuwSidebarGroupDto[]` so the shape can grow without a breaking
+ * change to the input's type.
+ */
+interface YuwSidebarContentDto {
+    groups: YuwSidebarGroupDto[];
+}
+/**
+ * What `<yuw-sidebar>` emits from `itemClicked`.
+ *
+ * Only entries with neither `route` nor `href` emit: a navigating entry's click is the router's or
+ * the browser's to handle. Carries the `id` rather than the whole entry, matching
+ * `YuwButtonGroupClickDto`.
+ */
+interface YuwSidebarItemClickDto {
+    id: string;
+    event: MouseEvent;
+}
+
 type YuwSidebarSideDto = 'left' | 'right';
 type YuwSidebarVariantDto = 'sidebar' | 'floating' | 'inset';
 type YuwSidebarCollapsibleDto = 'offcanvas' | 'icon' | 'none';
@@ -2480,6 +2663,25 @@ type YuwSidebarCollapsibleDto = 'offcanvas' | 'icon' | 'none';
  * - `collapsible`: Collapse behaviour (`'offcanvas'` slides away, `'icon'` shrinks to icons, `'none'` always open). Default is `'offcanvas'`.
  * - `sidebarWidthMobile`: Width of the mobile slide-in sheet (any CSS length). Defaults to the helm sidebar config (`18rem`).
  * - `sidebarContainerClass`: Extra classes merged onto the desktop fixed container (the helm merges them last, so they win).
+ * - `content`: Renders the scrollable nav from a `YuwSidebarContentDto` instead of hand-written
+ *   markup. Groups → items → optional one level of children. An item with a `route` becomes a
+ *   `[routerLink]` anchor whose active state, `aria-current` and pointer-lock resolve automatically
+ *   from `routerLinkActive`; one with an `href` becomes a plain anchor; one with neither becomes a
+ *   button that reports through `itemClicked`.
+ * - `footer`: The same, rendered into the footer region.
+ *
+ * Outputs:
+ * - `itemClicked`: Emits `{id, event}` when a non-navigating entry (no `route`, no `href`) is
+ *   activated, in either `content` or `footer`.
+ *
+ * The two forms compose rather than exclude each other, unlike `<yuw-button>`'s `buttons` input
+ * which drops projected content when set. `content`/`footer` render their own region; anything
+ * projected still renders, so a data-driven nav can sit alongside a hand-written block. To place
+ * extra markup *inside* the object-rendered regions — where it scrolls with the nav and inherits the
+ * content area's flex sizing — mark it `[yuwSidebarContentExtra]` or `[yuwSidebarFooterExtra]`; the
+ * default slot keeps everything else, so existing projection-only usage is unaffected.
+ *
+ * `header` has no object form: it is a free-form branding area with no repeating structure to model.
  *
  * Deliberately not exposed from the helm sidebar (add a wrapper only when a real consumer needs
  * them): `HlmSidebarMenuAction`, `HlmSidebarMenuSkeleton`, `HlmSidebarInput` and
@@ -2496,6 +2698,29 @@ type YuwSidebarCollapsibleDto = 'offcanvas' | 'icon' | 'none';
  *   </div>
  * </yuw-sidebar>
  * ```
+ *
+ * Object form:
+ * ```html
+ * <yuw-sidebar collapsible="icon" [content]="nav" [footer]="footerNav"
+ *              (itemClicked)="onAction($event.id)">
+ *   <div yuwSidebarHeader>Yurest</div>
+ * </yuw-sidebar>
+ * ```
+ * ```ts
+ * nav: YuwSidebarContentDto = {
+ *   groups: [{
+ *     id: 'management',
+ *     label: 'Gestión',
+ *     items: [
+ *       {id: 'orders', label: 'Pedidos', icon: 'lucideReceipt', route: '/orders', badge: '12'},
+ *       {id: 'reports', label: 'Informes', icon: 'lucideChartLine', children: [
+ *         {id: 'sales', label: 'Ventas', route: '/reports/sales'},
+ *       ]},
+ *       {id: 'sync', label: 'Sincronizar'},
+ *     ],
+ *   }],
+ * };
+ * ```
  */
 declare class YuwSidebarComponent {
     private readonly config;
@@ -2504,8 +2729,11 @@ declare class YuwSidebarComponent {
     readonly collapsible: _angular_core.InputSignal<YuwSidebarCollapsibleDto>;
     readonly sidebarWidthMobile: _angular_core.InputSignal<string>;
     readonly sidebarContainerClass: _angular_core.InputSignal<string>;
+    readonly content: _angular_core.InputSignal<YuwSidebarContentDto | undefined>;
+    readonly footer: _angular_core.InputSignal<YuwSidebarContentDto | undefined>;
+    readonly itemClicked: _angular_core.OutputEmitterRef<YuwSidebarItemClickDto>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSidebarComponent, "yuw-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "sidebarWidthMobile": { "alias": "sidebarWidthMobile"; "required": false; "isSignal": true; }; "sidebarContainerClass": { "alias": "sidebarContainerClass"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSidebarComponent, "yuw-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "sidebarWidthMobile": { "alias": "sidebarWidthMobile"; "required": false; "isSignal": true; }; "sidebarContainerClass": { "alias": "sidebarContainerClass"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "footer": { "alias": "footer"; "required": false; "isSignal": true; }; }, { "itemClicked": "itemClicked"; }, never, ["[yuwSidebarHeader], yuw-sidebar-header", "[yuwSidebarContentExtra]", "*", "[yuwSidebarFooterExtra]"], true, never>;
 }
 
 /**
@@ -2596,6 +2824,23 @@ declare class YuwSidebarMenuDirective {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuDirective, "ul[yuwSidebarMenu]", never, {}, {}, never, never, true, [{ directive: typeof i1$d.HlmSidebarMenu; inputs: {}; outputs: {}; }]>;
 }
+/**
+ * Marks projected markup that belongs *inside* the region `<yuw-sidebar>` renders from its `content`
+ * input, after the object-driven groups — a hand-written group alongside a data-driven nav.
+ *
+ * Only meaningful when `content` is set; without it the marker is inert and the element falls
+ * through to the default slot like any other projected node. Carries no styling of its own: it is a
+ * projection selector, and whatever it is applied to (usually a `[yuwSidebarGroup]`) keeps its own.
+ */
+declare class YuwSidebarContentExtraDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarContentExtraDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarContentExtraDirective, "[yuwSidebarContentExtra]", never, {}, {}, never, never, true, never>;
+}
+/** The `footer` counterpart of {@link YuwSidebarContentExtraDirective}. */
+declare class YuwSidebarFooterExtraDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarFooterExtraDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarFooterExtraDirective, "[yuwSidebarFooterExtra]", never, {}, {}, never, never, true, never>;
+}
 /** A single entry of a sidebar menu. Apply to an `<li>`. */
 declare class YuwSidebarMenuItemDirective {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuItemDirective, never>;
@@ -2607,9 +2852,17 @@ declare class YuwSidebarMenuItemDirective {
  *
  * To label the item while the sidebar is collapsed to icons, add Spartan's `tooltip` input
  * alongside this directive — it comes from the underlying menu-button primitive and is only shown
- * in the collapsed state.
+ * in the collapsed state. It cannot be re-forwarded through this wrapper's `hostDirectives`
+ * (`tooltip` is the alias `HlmSidebarMenuButton` gives its own composed `BrnTooltip`, not a public
+ * input of its own), so bind it with `[attr.tooltip]` rather than `[tooltip]` when the value comes
+ * from an expression.
+ *
+ * Carries `yuwSidebarMenuButtonClass`, our hover/expanded colouring and collapsed-to-icon geometry.
+ * The `classes()` registration below runs after the composed `HlmSidebarMenuButton`'s own, so our
+ * classes merge last and win — see `sidebar.variants.ts`.
  */
 declare class YuwSidebarMenuButtonDirective {
+    constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuButtonDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuButtonDirective, "button[yuwSidebarMenuButton], a[yuwSidebarMenuButton]", never, {}, {}, never, never, true, [{ directive: typeof i1$d.HlmSidebarMenuButton; inputs: { "variant": "variant"; "size": "size"; "isActive": "isActive"; "closeMobileSidebarOnClick": "closeMobileSidebarOnClick"; }; outputs: {}; }]>;
 }
@@ -2654,5 +2907,5 @@ declare class YuwSidebarInsetDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarInsetDirective, "main[yuwSidebarInset]", never, {}, {}, never, never, true, [{ directive: typeof i1$d.HlmSidebarInset; inputs: {}; outputs: {}; }]>;
 }
 
-export { YUW_DATATABLE_FEATURES, YUW_PASSWORD_REVEAL_STATES, YuwAccordion, YuwAccordionContentComponent, YuwAccordionImports, YuwAccordionItem, YuwAccordionTriggerComponent, YuwAlertActionDirective, YuwAlertComponent, YuwAlertDescriptionDirective, YuwAlertDialogComponent, YuwAlertDialogMediaDirective, YuwAlertDialogTriggerDirective, YuwAlertImports, YuwAlertTitleDirective, YuwAttachmentActionDirective, YuwAttachmentActionsDirective, YuwAttachmentContentDirective, YuwAttachmentDescriptionDirective, YuwAttachmentDirective, YuwAttachmentGroupDirective, YuwAttachmentMediaDirective, YuwAttachmentTitleDirective, YuwAttachmentTriggerDirective, YuwAvatarComponent, YuwBadgeComponent, YuwBreadcrumbComponent, YuwButtonComponent, YuwButtonGroupTextDirective, YuwCaptionDirective, YuwCardActionDirective, YuwCardContentDirective, YuwCardDescriptionDirective, YuwCardDirective, YuwCardFooterDirective, YuwCardHeaderDirective, YuwCardImports, YuwCardTitleDirective, YuwCheckboxComponent, YuwComboboxComponent, YuwComboboxItemDirective, YuwContextMenuCheckboxDirective, YuwContextMenuCheckboxIndicatorComponent, YuwContextMenuDirective, YuwContextMenuGroupDirective, YuwContextMenuImports, YuwContextMenuItemDirective, YuwContextMenuLabelDirective, YuwContextMenuRadioDirective, YuwContextMenuRadioIndicatorComponent, YuwContextMenuSeparatorDirective, YuwContextMenuShortcutDirective, YuwContextMenuSubDirective, YuwContextMenuSubIndicatorComponent, YuwContextMenuSubTriggerDirective, YuwContextMenuTriggerDirective, YuwDatatableComponent, YuwDatepickerComponent, YuwDialogCloseDirective, YuwDialogComponent, YuwDialogFooterDirective, YuwDialogImports, YuwDialogTriggerDirective, YuwEmptyContentDirective, YuwEmptyDescriptionDirective, YuwEmptyDirective, YuwEmptyHeaderDirective, YuwEmptyImports, YuwEmptyMediaDirective, YuwEmptyTitleDirective, YuwInputAddonImports, YuwInputComponent, YuwInputOtpComponent, YuwItemActionsDirective, YuwItemContentDirective, YuwItemDescriptionDirective, YuwItemDirective, YuwItemFooterDirective, YuwItemGroupDirective, YuwItemHeaderDirective, YuwItemImports, YuwItemMediaDirective, YuwItemSeparatorDirective, YuwItemTitleDirective, YuwLabel, YuwLeftAddonDirective, YuwPaginationComponent, YuwPasswordInputComponent, YuwPopoverComponent, YuwPopoverTriggerDirective, YuwRadioGroupComponent, YuwRightAddonDirective, YuwSearchInputComponent, YuwSheetCloseDirective, YuwSheetComponent, YuwSheetFooterDirective, YuwSheetImports, YuwSheetTriggerDirective, YuwSidebarComponent, YuwSidebarContentDirective, YuwSidebarFooterDirective, YuwSidebarGroupContentDirective, YuwSidebarGroupDirective, YuwSidebarGroupLabelDirective, YuwSidebarHeaderDirective, YuwSidebarInsetDirective, YuwSidebarMenuBadgeDirective, YuwSidebarMenuButtonDirective, YuwSidebarMenuDirective, YuwSidebarMenuItemDirective, YuwSidebarMenuSubButtonDirective, YuwSidebarMenuSubDirective, YuwSidebarMenuSubItemDirective, YuwSidebarRailDirective, YuwSidebarSeparatorDirective, YuwSidebarTriggerComponent, YuwSidebarWrapperDirective, YuwSkeletonDirective, YuwSpinnerComponent, YuwSwitchComponent, YuwTBodyDirective, YuwTFootDirective, YuwTHeadDirective, YuwTabPanelDirective, YuwTableContainerDirective, YuwTableDirective, YuwTableImports, YuwTabsComponent, YuwTdDirective, YuwTextareaComponent, YuwThDirective, YuwToasterComponent, YuwTooltipDirective, YuwTrDirective, YuwValueAccessorBase, buildInputOtpGroups, cn, getPaginationRange, provideValueAccessor, totalInputOtpLength };
-export type { YuwAlertDialogSizeDto, YuwAlertVariantDto, YuwAvatarGroupItemDto, YuwAvatarSizeDto, YuwBreadcrumbItemDto, YuwButtonGroupClickDto, YuwButtonGroupEntryDto, YuwButtonGroupItemDto, YuwButtonGroupTextDto, YuwColorDto, YuwComboboxItemContext, YuwComboboxOptionDto, YuwComboboxValue, YuwDatatableColumnDef, YuwDatatableFeatures, YuwDatepickerModeDto, YuwDatepickerValue, YuwInputModeDto, YuwInputOtpGroupDto, YuwInputOtpModeDto, YuwInputTypeDto, YuwPaginationRangeItem, YuwPaginationSizeDto, YuwPasswordRevealStateDto, YuwPopoverAlignDto, YuwRadioOptionDto, YuwSearchInputCollapseFromDto, YuwSheetSideDto, YuwSidebarCollapsibleDto, YuwSidebarSideDto, YuwSidebarVariantDto, YuwSwitchSizeDto, YuwTabItemDto, YuwTabsActivationModeDto, YuwTabsOrientationDto, YuwTabsVariantDto, YuwTextFieldContract, YuwToasterPositionDto, YuwToasterThemeDto, YuwTooltipPositionDto };
+export { DATATABLE_ALIGN_CLASS, YUW_DATATABLE_FEATURES, YUW_PASSWORD_REVEAL_STATES, YuwAccordion, YuwAccordionContentComponent, YuwAccordionImports, YuwAccordionItem, YuwAccordionTriggerComponent, YuwAlertActionDirective, YuwAlertComponent, YuwAlertDescriptionDirective, YuwAlertDialogComponent, YuwAlertDialogMediaDirective, YuwAlertDialogTriggerDirective, YuwAlertImports, YuwAlertTitleDirective, YuwAttachmentActionDirective, YuwAttachmentActionsDirective, YuwAttachmentContentDirective, YuwAttachmentDescriptionDirective, YuwAttachmentDirective, YuwAttachmentGroupDirective, YuwAttachmentMediaDirective, YuwAttachmentTitleDirective, YuwAttachmentTriggerDirective, YuwAvatarComponent, YuwBadgeComponent, YuwBreadcrumbComponent, YuwButtonComponent, YuwButtonGroupTextDirective, YuwCaptionDirective, YuwCardActionDirective, YuwCardContentDirective, YuwCardDescriptionDirective, YuwCardDirective, YuwCardFooterDirective, YuwCardHeaderDirective, YuwCardImports, YuwCardTitleDirective, YuwCheckboxComponent, YuwComboboxComponent, YuwComboboxItemDirective, YuwContextMenuCheckboxDirective, YuwContextMenuCheckboxIndicatorComponent, YuwContextMenuDirective, YuwContextMenuGroupDirective, YuwContextMenuImports, YuwContextMenuItemDirective, YuwContextMenuLabelDirective, YuwContextMenuRadioDirective, YuwContextMenuRadioIndicatorComponent, YuwContextMenuSeparatorDirective, YuwContextMenuShortcutDirective, YuwContextMenuSubDirective, YuwContextMenuSubIndicatorComponent, YuwContextMenuSubTriggerDirective, YuwContextMenuTriggerDirective, YuwDatatableComponent, YuwDatepickerComponent, YuwDialogCloseDirective, YuwDialogComponent, YuwDialogFooterDirective, YuwDialogImports, YuwDialogTriggerDirective, YuwEmptyContentDirective, YuwEmptyDescriptionDirective, YuwEmptyDirective, YuwEmptyHeaderDirective, YuwEmptyImports, YuwEmptyMediaDirective, YuwEmptyTitleDirective, YuwInputAddonImports, YuwInputComponent, YuwInputOtpComponent, YuwItemActionsDirective, YuwItemContentDirective, YuwItemDescriptionDirective, YuwItemDirective, YuwItemFooterDirective, YuwItemGroupDirective, YuwItemHeaderDirective, YuwItemImports, YuwItemMediaDirective, YuwItemSeparatorDirective, YuwItemTitleDirective, YuwLabel, YuwLeftAddonDirective, YuwPaginationComponent, YuwPasswordInputComponent, YuwPopoverComponent, YuwPopoverTriggerDirective, YuwRadioGroupComponent, YuwRightAddonDirective, YuwSearchInputComponent, YuwSheetCloseDirective, YuwSheetComponent, YuwSheetFooterDirective, YuwSheetImports, YuwSheetTriggerDirective, YuwSidebarComponent, YuwSidebarContentDirective, YuwSidebarContentExtraDirective, YuwSidebarFooterDirective, YuwSidebarFooterExtraDirective, YuwSidebarGroupContentDirective, YuwSidebarGroupDirective, YuwSidebarGroupLabelDirective, YuwSidebarHeaderDirective, YuwSidebarInsetDirective, YuwSidebarMenuBadgeDirective, YuwSidebarMenuButtonDirective, YuwSidebarMenuDirective, YuwSidebarMenuItemDirective, YuwSidebarMenuSubButtonDirective, YuwSidebarMenuSubDirective, YuwSidebarMenuSubItemDirective, YuwSidebarRailDirective, YuwSidebarSeparatorDirective, YuwSidebarTriggerComponent, YuwSidebarWrapperDirective, YuwSkeletonDirective, YuwSpinnerComponent, YuwSwitchComponent, YuwTBodyDirective, YuwTFootDirective, YuwTHeadDirective, YuwTabPanelDirective, YuwTableContainerDirective, YuwTableDirective, YuwTableImports, YuwTabsComponent, YuwTdDirective, YuwTextareaComponent, YuwThDirective, YuwToasterComponent, YuwTooltipDirective, YuwTrDirective, YuwValueAccessorBase, buildInputOtpGroups, cn, datatableCellVariants, datatableContainerVariants, datatableHeadVariants, datatableHeaderCellVariants, datatableRowVariants, getPaginationRange, provideValueAccessor, totalInputOtpLength };
+export type { YuwAlertDialogSizeDto, YuwAlertVariantDto, YuwAvatarGroupItemDto, YuwAvatarSizeDto, YuwBreadcrumbItemDto, YuwButtonGroupClickDto, YuwButtonGroupEntryDto, YuwButtonGroupItemDto, YuwButtonGroupTextDto, YuwColorDto, YuwComboboxItemContext, YuwComboboxOptionDto, YuwComboboxValue, YuwDatatableAlign, YuwDatatableAppearanceDto, YuwDatatableColumnDef, YuwDatatableColumnMeta, YuwDatatableFeatures, YuwDatepickerModeDto, YuwDatepickerValue, YuwFieldSizeDto, YuwInputModeDto, YuwInputOtpGroupDto, YuwInputOtpModeDto, YuwInputTypeDto, YuwPaginationRangeItem, YuwPaginationSizeDto, YuwPasswordRevealStateDto, YuwPopoverAlignDto, YuwRadioOptionDto, YuwSearchInputCollapseFromDto, YuwSheetSideDto, YuwSidebarCollapsibleDto, YuwSidebarContentDto, YuwSidebarGroupDto, YuwSidebarItemClickDto, YuwSidebarItemDto, YuwSidebarSideDto, YuwSidebarSubItemDto, YuwSidebarVariantDto, YuwSwitchSizeDto, YuwTabItemDto, YuwTabsActivationModeDto, YuwTabsOrientationDto, YuwTabsVariantDto, YuwTextFieldContract, YuwToasterPositionDto, YuwToasterThemeDto, YuwTooltipPositionDto };