@malva-ui/core 0.1.12 → 0.1.14

package/docs/ai/timeline.md

@@ -31,12 +31,27 @@ The timeline renders as an ordered list (`role="list"`) with each item as a `rol
 
 The container component. Renders as a flex column list (`display: flex; flex-direction: column`). Content-projects `mlv-timeline-item` children directly with `<ng-content />`.
 
+It also queries its projected items (`contentChildren(MlvTimelineItem, { descendants: true })`) to decide whether the timeline is **single-sided** — see below.
+
+#### Automatic single-side collapse
+
+A `mlv-timeline-item` is a three-column grid (`[content-left] [spine] [content-right]`) so items can alternate sides. When **every** projected item shares the same `direction`, the opposite column carries nothing, so the timeline collapses its items to a **two-column** grid instead of reserving `1fr` plus a column gap for an empty track. Since `direction` defaults to `'right'`, a plain timeline collapses by default and its content gets the full width.
+
+- No consumer opt-in — it is driven entirely by the projected items' `direction`.
+- Fully reactive: `direction` is a signal input and the item query is a signal, so the modifier follows runtime direction flips and items being added/removed.
+- An **empty** timeline gets neither modifier.
+- A timeline that **mixes** directions gets neither modifier and keeps the full three-column layout.
+- The unused track is _removed_, not zeroed — a `0`-width column would still emit the `1.5rem` column gap and leave a visible dead inset next to the spine.
+- The modifier lives on the parent, so a bare `mlv-timeline-item` used **outside** a `mlv-timeline` renders exactly as before (full three-column grid).
+
 #### Host Bindings
 
-| Binding | Value                     |
-| ------- | ------------------------- |
-| `class` | `'mlv-timeline'` (static) |
-| `role`  | `'list'` (static)         |
+| Binding                              | Value                                                           |
+| ------------------------------------ | --------------------------------------------------------------- |
+| `class`                              | `'mlv-timeline'` (static)                                       |
+| `role`                               | `'list'` (static)                                               |
+| `[class.mlv-timeline--single-left]`  | `_isSingleLeft()` — has items, none of them `direction="right"` |
+| `[class.mlv-timeline--single-right]` | `_isSingleRight()` — has items, none of them `direction="left"` |
 
 #### Inputs
 
@@ -46,17 +61,21 @@ None.
 
 None.
 
+#### Content Children (protected)
+
+| Name     | Type                                                      | Description                                                                 |
+| -------- | --------------------------------------------------------- | --------------------------------------------------------------------------- |
+| `_items` | `contentChildren(MlvTimelineItem, { descendants: true })` | Projected timeline items; drives the single-side collapse computed signals. |
+
 #### SCSS
 
 BEM block: `.mlv-timeline`
 
-```scss
-.mlv-timeline {
-  display: flex;
-  flex-direction: column;
-  list-style: none;
-}
-```
+| Class                         | Description                                                                                                                              |
+| ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
+| `.mlv-timeline`               | Block root; `display: flex; flex-direction: column; list-style: none`                                                                    |
+| `.mlv-timeline--single-right` | All items on the right — items become `grid-template-columns: var(--mlv-tli-node-size) 1fr`; spine → column 1, `__col--right` → column 2 |
+| `.mlv-timeline--single-left`  | All items on the left — items become `grid-template-columns: 1fr var(--mlv-tli-node-size)`; `__col--left` → column 1, spine → column 2   |
 
 ---
 
@@ -69,6 +88,8 @@ BEM block: `.mlv-timeline`
 
 A single event entry rendered in a 3-column CSS grid. The node circle sits in the centre column; content appears in the left or right column depending on `direction()`. The connector line extends below the node and is hidden on `:last-child` via CSS.
 
+A single content column is rendered and moved between grid tracks by the `direction()` class binding, so no empty `role="generic"` column box lands in the accessibility tree. Both children are pinned to an explicit `grid-column`, so placement never depends on DOM order. When the parent `mlv-timeline` is single-sided the grid drops to two tracks; see [Automatic single-side collapse](#automatic-single-side-collapse).
+
 #### Host Bindings
 
 | Binding                                     | Value                            |
@@ -100,9 +121,9 @@ None.
 
 #### Template Summary
 
-The template is a 3-column grid:
+The template renders exactly **two** children into the grid — one content column and the spine. The column is declared once and _moves_ between grid tracks via a class binding; there is no second, empty column.
 
-1. **Left column** (`.mlv-timeline-item__col--left`) — renders content when `direction() === 'left'`:
+1. **Content column** (`.mlv-timeline-item__col`) — always rendered, always populated. It picks up `--left` or `--right` from `direction()`, which pins it to grid column 1 or 3:
    - `.mlv-timeline-item__header`: title span, optional `<time>` timestamp, optional meta slot.
    - `.mlv-timeline-item__description`: default `<ng-content />` for the event description.
 
@@ -110,38 +131,37 @@ The template is a 3-column grid:
    - `.mlv-timeline-item__node-circle`: coloured circle (tone-driven). Renders `_iconRef` template if present (`aria-hidden="true"` on the icon wrapper).
    - `.mlv-timeline-item__connector`: vertical line below the node (`aria-hidden="true"`); hidden on `:last-child`.
 
-3. **Right column** (`.mlv-timeline-item__col--right`) — renders content when `direction() === 'right'` (default):
-   - Same header + description structure as the left column.
+The column always precedes the spine in DOM order, so the reading order is content-then-decoration for both directions while CSS grid handles the visual side. Because DOM order is therefore **not** monotonic in column index for `direction="left"`, both children also carry an explicit `grid-row: 1`; without it, sparse auto-placement pushes the spine onto a second implicit row and the node drifts below its own header. The header layout for `direction === 'left'` uses `flex-direction: row-reverse` so the timestamp appears before the title visually.
 
-The header layout for `direction === 'left'` uses `flex-direction: row-reverse` so the timestamp appears before the title visually.
+> The column used to be declared **twice** — once per side, with the inactive one rendered as an empty box — and each copy carried its own `<ng-content />`. Two default-selector `<ng-content />` outlets cannot both receive the projected nodes, so `direction="left"` items silently dropped their description. Declaring the column once fixes that and keeps the accessibility tree free of empty `role="generic"` boxes.
 
 #### SCSS
 
 BEM block: `.mlv-timeline-item`
 
-| Class                                | Description                                                                |
-| ------------------------------------ | -------------------------------------------------------------------------- |
-| `.mlv-timeline-item`                 | Block root; 3-column CSS grid (`1fr <node-size> 1fr`)                      |
-| `.mlv-timeline-item__col`            | Grid column wrapper                                                        |
-| `.mlv-timeline-item__col--left`      | Left text column (`text-align: right`)                                     |
-| `.mlv-timeline-item__col--right`     | Right text column (`text-align: left`)                                     |
-| `.mlv-timeline-item__spine`          | Centre column flex container (node + connector)                            |
-| `.mlv-timeline-item__node-circle`    | Coloured circle; size: `--mlv-tli-node-size` (2.5rem)                      |
-| `.mlv-timeline-item__node-icon`      | Icon wrapper inside node circle (`aria-hidden`)                            |
-| `.mlv-timeline-item__connector`      | Vertical line; `min-height: --mlv-spacing-8`; hidden on `:last-child`      |
-| `.mlv-timeline-item__content`        | Padded content area; `padding-bottom: --mlv-spacing-8`; 0 on `:last-child` |
-| `.mlv-timeline-item__content--left`  | Right-aligns text for left-direction items                                 |
-| `.mlv-timeline-item__header`         | Flex row (title + timestamp + meta); `gap: 0.5rem`                         |
-| `.mlv-timeline-item__title`          | Semibold heading; `--mlv-font-size-m`                                      |
-| `.mlv-timeline-item__timestamp`      | Muted secondary text; `--mlv-typography-ui-s`; `white-space: nowrap`       |
-| `.mlv-timeline-item__meta`           | Inline-flex container for badge/chip slots                                 |
-| `.mlv-timeline-item__description`    | Secondary-colour body text; `--mlv-font-size-m`                            |
-| `.mlv-timeline-item--default`        | Node colour: `--mlv-border-normal`                                         |
-| `.mlv-timeline-item--success`        | Node colour: `--mlv-background-success-1`                                  |
-| `.mlv-timeline-item--warning`        | Node colour: `--mlv-background-warning-1`                                  |
-| `.mlv-timeline-item--danger`         | Node colour: `--mlv-background-danger-1`                                   |
-| `.mlv-timeline-item--info`           | Node colour: `--mlv-background-info-1`                                     |
-| `.mlv-timeline-item--direction-left` | Header flex-direction reversed                                             |
+| Class                                | Description                                                                      |
+| ------------------------------------ | -------------------------------------------------------------------------------- |
+| `.mlv-timeline-item`                 | Block root; 3-column CSS grid (`1fr <node-size> 1fr`)                            |
+| `.mlv-timeline-item__col`            | The single content column wrapper (gains `--left` or `--right`); `grid-row: 1`   |
+| `.mlv-timeline-item__col--left`      | Left text column (`grid-column: 1`; `text-align: right`)                         |
+| `.mlv-timeline-item__col--right`     | Right text column (`grid-column: 3`; `text-align: left`)                         |
+| `.mlv-timeline-item__spine`          | Centre column flex container (`grid-row: 1`; `grid-column: 2`; node + connector) |
+| `.mlv-timeline-item__node-circle`    | Coloured circle; size: `--mlv-tli-node-size` (2.5rem)                            |
+| `.mlv-timeline-item__node-icon`      | Icon wrapper inside node circle (`aria-hidden`)                                  |
+| `.mlv-timeline-item__connector`      | Vertical line; `min-height: --mlv-spacing-8`; hidden on `:last-child`            |
+| `.mlv-timeline-item__content`        | Padded content area; `padding-bottom: --mlv-spacing-8`; 0 on `:last-child`       |
+| `.mlv-timeline-item__content--left`  | Right-aligns text for left-direction items                                       |
+| `.mlv-timeline-item__header`         | Flex row (title + timestamp + meta); `gap: 0.5rem`                               |
+| `.mlv-timeline-item__title`          | Semibold heading; `--mlv-font-size-m`                                            |
+| `.mlv-timeline-item__timestamp`      | Muted secondary text; `--mlv-typography-ui-s`; `white-space: nowrap`             |
+| `.mlv-timeline-item__meta`           | Inline-flex container for badge/chip slots                                       |
+| `.mlv-timeline-item__description`    | Secondary-colour body text; `--mlv-font-size-m`                                  |
+| `.mlv-timeline-item--default`        | Node colour: `--mlv-border-normal`                                               |
+| `.mlv-timeline-item--success`        | Node colour: `--mlv-background-success-1`                                        |
+| `.mlv-timeline-item--warning`        | Node colour: `--mlv-background-warning-1`                                        |
+| `.mlv-timeline-item--danger`         | Node colour: `--mlv-background-danger-1`                                         |
+| `.mlv-timeline-item--info`           | Node colour: `--mlv-background-info-1`                                           |
+| `.mlv-timeline-item--direction-left` | Header flex-direction reversed                                                   |
 
 CSS custom properties (component-scoped):
 
@@ -214,6 +234,8 @@ Controls which column (left or right of the centre spine) shows the event conten
 | `'right'` (default) | Right column   | (none)                               |
 | `'left'`            | Left column    | `.mlv-timeline-item--direction-left` |
 
+Mixing both values within one `mlv-timeline` is what keeps the wide three-column layout. A timeline whose items all share one value collapses to two columns automatically — see [Automatic single-side collapse](#automatic-single-side-collapse).
+
 ---
 
 ## Usage Examples
@@ -268,6 +290,8 @@ Controls which column (left or right of the centre spine) shows the event conten
 
 ### Alternating left/right layout
 
+Mixing `direction` values keeps the full three-column layout. Uniform-direction timelines (including the default, all-`'right'` case) collapse to two columns on their own.
+
 ```html
 <mlv-timeline>
   <mlv-timeline-item title="Step 1" timestamp="Jan 2025" tone="info" direction="right"> First step content on the right. </mlv-timeline-item>

package/docs/ai/tokenizer.md

@@ -26,11 +26,27 @@ Exported from `@malva-ui/core/tokenizer`:
 - **Change Detection:** `OnPush`
 - **Extends:** `MlvSignalFormControlBase<MlvSelectOption<T>[]>`
 
-#### Model (two-way binding)
-
-| Name     | Type                   | Default |
-| -------- | ---------------------- | ------- |
-| `tokens` | `MlvSelectOption<T>[]` | `[]`    |
+#### Models (two-way binding)
+
+| Name     | Type                   | Default | Notes                                                           |
+| -------- | ---------------------- | ------- | --------------------------------------------------------------- |
+| `value`  | `MlvSelectOption<T>[]` | `[]`    | Canonical collection; what every Angular forms API reads/writes |
+| `tokens` | `MlvSelectOption<T>[]` | `[]`    | Legacy alias of `value`, kept in sync in both directions        |
+
+**Alias contract.** `value` and `tokens` are two views of one collection — bind
+either, both, or neither:
+
+- Bind **one side only** and the unbound alias adopts it. It never writes its `[]`
+  default back over a seeded binding, and nothing is emitted to the consumer on
+  first render (no phantom edit staged).
+- Bind **both** and they stay pinned to the same array reference.
+- On the rare flush where both sides change at once, **`value` wins** — it is the
+  canonical surface.
+
+Internally only the side that actually changed propagates (tracked against the
+last reference the component published), which is what makes a one-sided binding
+safe. Every internal commit (`Enter`, click-removal, Backspace deletion) sets both
+models to the same array.
 
 #### Inputs (own)
 

package/docs/ai/tooltip.md

@@ -14,7 +14,7 @@ Exported from `@malva-ui/core/tooltip`:
 |--------|------|-------------|
 | `MlvTooltip` | Directive | `[mlvTooltip]` — main public API; attach to any element |
 | `MlvTooltipPanel` | Component | `mlv-tooltip-panel` — internal floating panel (not for direct use) |
-| `MlvTooltipTone` | Type | `MlvTone \| 'dark' \| 'light' \| 'primary'` |
+| `MlvTooltipTone` | Type | `MlvTone \| 'neutral' \| 'surface' \| 'primary'` |
 | `MlvTooltipPlacement` | Type | `'top' \| 'bottom' \| 'left' \| 'right'` |
 
 ---
@@ -33,7 +33,7 @@ The primary consumer API. Attach to any element — button, icon, input, etc.
 | ------------------ | --------------------- | -------- | --------------------------------------------------------------- |
 | `mlvTooltip`       | `string` (required)   | —        | Tooltip text content                                            |
 | `tooltipPlacement` | `MlvTooltipPlacement` | `'top'`  | Preferred placement; CDK flips to opposite if no viewport space |
-| `tooltipTone`      | `MlvTooltipTone`      | `'dark'` | Tone variant of the tooltip panel                               |
+| `tooltipTone`      | `MlvTooltipTone`      | `'neutral'` | Tone variant of the tooltip panel                               |
 | `tooltipDelay`     | `number`              | `300`    | Milliseconds before tooltip appears after hover/focus           |
 | `tooltipDisabled`  | `BooleanInput`        | `false`  | Suppresses the tooltip entirely                                 |
 | `tooltipArrow`     | `BooleanInput`        | `true`   | Shows/hides the directional arrow                               |
@@ -62,7 +62,7 @@ Created programmatically by `MlvTooltip`. Not intended for direct consumer use.
 | Name        | Type                  | Description                        |
 | ----------- | --------------------- | ---------------------------------- |
 | `content`   | `string` (required)   | Tooltip text                       |
-| `tone`      | `MlvTooltipTone`      | Tone variant (default `'dark'`)    |
+| `tone`      | `MlvTooltipTone`      | Tone variant (default `'neutral'`)    |
 | `showArrow` | `boolean`             | Whether the arrow is visible       |
 | `placement` | `MlvTooltipPlacement` | Drives arrow direction CSS class   |
 | `tooltipId` | `string` (required)   | Unique `id` for `aria-describedby` |
@@ -100,8 +100,8 @@ Created programmatically by `MlvTooltip`. Not intended for direct consumer use.
 
 | `tooltipTone`    | Background                   | Text                             |
 | ---------------- | ---------------------------- | -------------------------------- |
-| `dark` (default) | `--mlv-palette-neutral-900`  | `--mlv-text-inverse`             |
-| `light`          | `--mlv-background-base`      | `--mlv-text-primary`             |
+| `neutral` (default) | `--mlv-palette-neutral-900`  | `--mlv-text-primary-on-accent-1` |
+| `surface`           | `--mlv-background-base`      | `--mlv-text-primary`             |
 | `primary`        | `--mlv-background-accent-1`  | `--mlv-text-primary-on-accent-1` |
 | `success`        | `--mlv-background-success-1` | `--mlv-text-on-success`          |
 | `warning`        | `--mlv-background-warning-1` | `--mlv-text-on-warning`          |

package/docs/ai/view-variant.md

@@ -0,0 +1,75 @@
+# Library: view-variant
+
+> packaging, tests, or implementation changes.
+
+## Overview
+
+`@malva-ui/core/view-variant` provides controlled, generic saved-view
+navigation and dirty-state actions for consumer-owned named snapshots. It never
+persists data, looks up authorization, owns dirty state, or confirms discarded
+changes; hosts supply those values and respond to the emitted requests.
+
+## Public API
+
+| Export                                | Kind      | Purpose                                                                                                                     |
+| ------------------------------------- | --------- | --------------------------------------------------------------------------------------------------------------------------- |
+| `MlvViewVariantScope`                 | Type      | Ownership scope: `system`, `team`, or `personal`.                                                                           |
+| `MlvViewVariantAction`                | Type      | Supported action: create, clone, update, rename, delete, or share.                                                          |
+| `MlvViewVariantCapabilities`          | Interface | Immutable per-view permissions for clone, update, rename, delete, and share.                                                |
+| `MlvViewVariant<TState>`              | Interface | Immutable named saved view with host-owned durable `state`, scope, capabilities, and optional persistence/display metadata. |
+| `MlvViewVariantBusyAction`            | Interface | Immutable in-progress action with an optional target view identifier.                                                       |
+| `MlvViewVariantCreateRequest<TState>` | Interface | Immutable request for a new personal or team view; its scope excludes `system`.                                             |
+| `MlvViewVariantGroupLabels`           | Interface | Immutable labels for the system, team, and personal view groups.                                                            |
+| `MlvViewVariantList<TState>`          | Component | Controlled, searchable System/Team/My views navigation with create and overflow action requests.                            |
+| `MlvViewVariantStatus<TState>`        | Component | Controlled dirty/read-only status band with permission-aware reset, clone, update, and create requests.                     |
+
+### `MlvViewVariantList<TState>`
+
+Required input: `variants`. Models: `activeId` (default `null`) and `query`
+(default empty). Inputs: `canCreate` (default `false`), `createScopes`
+(default `['personal']`), `groupLabels` (System, Team, My views defaults),
+`busyAction`, `errorMessage`, and `deferSelection` (default `false`).
+
+Outputs: `variantSelect`, `createRequest`, `renameRequest`, `deleteRequest`,
+`shareRequest`, `retryRequest`, and `dismissError`. Groups always render in
+System, Team, Personal order after the local case- and diacritic-insensitive
+query is applied. By default it emits `variantSelect` before optimistically
+writing `activeId`. Set `deferSelection` when selection requires host approval:
+the component then emits without writing the model, so rejected requests keep
+the actual active row current and can be selected again. Re-clicking the true
+active row remains a no-op in either mode. Create is only shown for a permitted
+non-system scope; row overflow actions are only shown for the corresponding
+capability.
+
+### `MlvViewVariantStatus<TState>`
+
+Inputs: `variant` (default `null`), `dirty` (default `false`), `canCreate`
+(default `false`), `busyAction`, and `errorMessage`. Outputs: `resetRequest`,
+`cloneRequest`, `updateRequest`, `createRequest`, `retryRequest`, and
+`dismissError`.
+
+The internal modes are `unsaved`, `locked-clean`, `locked-dirty`,
+`editable-dirty`, and `editable-clean`. `editable-clean` intentionally renders
+no status band. The other modes expose only allowed actions: update requires a
+dirty update-capable active view, clone requires clone capability, and create
+requires `canCreate`. Only the matching pending action becomes busy. Errors are
+polite `role="status"` content with retry and dismiss requests.
+
+### `mlvViewStateEqual()`
+
+`mlvViewStateEqual(first, second, normalize)` compares the JSON serialization
+of two host-normalized states. The host normalizer must omit transient values
+and return stable object-key and array ordering. This helper intentionally is
+not generic deep equality and never reorders values itself.
+
+## Verification
+
+Run the focused checks:
+
+```sh
+yarn nx test core-view-variant --skipNxCache
+yarn nx typecheck core-view-variant --skipNxCache
+yarn nx lint core-view-variant --skipNxCache
+yarn nx run styles:check-padding-tokens --skipNxCache
+yarn nx run docs:check-doc-api --skipNxCache
+```

package/fesm2022/malva-ui-core-accordion.mjs

@@ -0,0 +1,167 @@
+import * as i0 from '@angular/core';
+import { inject, ChangeDetectionStrategy, ViewEncapsulation, Component, input, model, Directive } from '@angular/core';
+import * as i1 from '@angular/aria/accordion';
+import { AccordionGroup, AccordionTrigger, AccordionPanel, AccordionContent } from '@angular/aria/accordion';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { MlvExpand } from '@malva-ui/core/expand';
+import { LucideChevronDown } from '@lucide/angular';
+
+/**
+ * Vertical accordion container built on the `@angular/aria` `AccordionGroup`
+ * headless pattern. Projects one or more `mlv-accordion-item` children and
+ * coordinates their expand/collapse behaviour, single- vs multi-expand mode,
+ * and roving keyboard navigation (Arrow Up/Down, Home, End) across the item
+ * headers.
+ *
+ * The `@angular/aria` `AccordionGroup` is applied as a host directive so the
+ * `ACCORDION_GROUP` DI token it provides is visible to the triggers rendered
+ * inside each projected `mlv-accordion-item`. Its inputs are re-exposed
+ * verbatim on `<mlv-accordion>` — the aria directive owns the roles, keyboard
+ * event listeners, roving tabindex, and `aria-*` wiring.
+ *
+ * @example Single-expand (default aria behaviour is multi-expand)
+ * ```html
+ * <mlv-accordion [multiExpandable]="false">
+ *   <mlv-accordion-item header="Shipping">…</mlv-accordion-item>
+ *   <mlv-accordion-item header="Returns">…</mlv-accordion-item>
+ * </mlv-accordion>
+ * ```
+ *
+ * @example Programmatic expand/collapse all
+ * ```html
+ * <mlv-accordion #acc [multiExpandable]="true">…</mlv-accordion>
+ * <button (click)="acc.expandAll()">Expand all</button>
+ * <button (click)="acc.collapseAll()">Collapse all</button>
+ * ```
+ */
+class MlvAccordion {
+    /**
+     * @private The host `@angular/aria` `AccordionGroup` directive instance,
+     * used to delegate the imperative `expandAll()` / `collapseAll()` calls.
+     */
+    _group = inject(AccordionGroup);
+    /**
+     * Expands every accordion item. Only has an effect when `multiExpandable`
+     * is `true`; in single-expand mode the aria pattern keeps at most one panel
+     * open.
+     */
+    expandAll() {
+        this._group.expandAll();
+    }
+    /** Collapses every accordion item. */
+    collapseAll() {
+        this._group.collapseAll();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: MlvAccordion, isStandalone: true, selector: "mlv-accordion", host: { classAttribute: "mlv-accordion" }, hostDirectives: [{ directive: i1.AccordionGroup, inputs: ["multiExpandable", "multiExpandable", "disabled", "disabled", "softDisabled", "softDisabled", "wrap", "wrap"] }], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer mlv.components{.mlv-accordion{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-typography-body-m-size)}.mlv-accordion *{box-sizing:border-box}.mlv-accordion{display:block;border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-card);overflow:hidden;background-color:var(--mlv-background-raised)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordion, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-accordion', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: AccordionGroup,
+                            inputs: ['multiExpandable', 'disabled', 'softDisabled', 'wrap'],
+                        },
+                    ], host: {
+                        class: 'mlv-accordion',
+                    }, styles: ["@layer mlv.components{.mlv-accordion{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-typography-body-m-size)}.mlv-accordion *{box-sizing:border-box}.mlv-accordion{display:block;border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-card);overflow:hidden;background-color:var(--mlv-background-raised)}}\n"] }]
+        }] });
+
+/**
+ * A single expandable section of a `mlv-accordion`.
+ *
+ * Renders a header button (the `@angular/aria` `AccordionTrigger`) and a
+ * lazily-rendered content region (`AccordionPanel` + `AccordionContent`). The
+ * visual open/close animation is provided by wrapping the panel content in
+ * `mlv-expand`; the aria directives own the `role`, `aria-expanded`,
+ * `aria-controls`/`aria-labelledby` linkage, `inert`, and keyboard handling.
+ *
+ * Panel content is rendered lazily on first expand via aria's `DeferredContent`
+ * and then kept mounted (`preserveContent`) so the `mlv-expand`
+ * grid-row animation is never torn down mid-transition — the collapse hides the
+ * content through `mlv-expand`'s own `@if`, not by unmounting the panel.
+ *
+ * @example
+ * ```html
+ * <mlv-accordion>
+ *   <mlv-accordion-item header="Billing" [(expanded)]="billingOpen">
+ *     <p>Manage your billing details…</p>
+ *   </mlv-accordion-item>
+ * </mlv-accordion>
+ * ```
+ */
+class MlvAccordionItem {
+    /**
+     * Plain-text header shown in the trigger button. For rich header content
+     * (icons, badges) project an element marked with the `mlvAccordionHeader`
+     * directive instead.
+     */
+    header = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
+    /**
+     * Disables this item: the trigger becomes non-interactive and gets
+     * `aria-disabled="true"`. Whether it stays keyboard-focusable is governed by
+     * the parent `mlv-accordion`'s `softDisabled` input (aria default: focusable).
+     * Supports attribute syntax: `<mlv-accordion-item disabled>`.
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * Two-way bindable expanded state of this item. Bind with
+     * `[(expanded)]="mySignal"`, or observe changes with
+     * `(expandedChange)="onToggle($event)"`. Kept in sync with the aria
+     * `AccordionTrigger` expansion model.
+     */
+    expanded = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordionItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: MlvAccordionItem, isStandalone: true, selector: "mlv-accordion-item", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "class.mlv-accordion-item--open": "expanded()", "class.mlv-accordion-item--disabled": "disabled()" }, classAttribute: "mlv-accordion-item" }, ngImport: i0, template: "<h3 class=\"mlv-accordion-item__heading\">\n  <button\n    type=\"button\"\n    ngAccordionTrigger\n    class=\"mlv-accordion-item__trigger\"\n    [panel]=\"panel\"\n    [disabled]=\"disabled()\"\n    [(expanded)]=\"expanded\"\n  >\n    <span class=\"mlv-accordion-item__title\">\n      {{ header() }}<ng-content select=\"[mlvAccordionHeader]\" />\n    </span>\n    <svg\n      lucideChevronDown\n      class=\"mlv-accordion-item__icon\"\n      [size]=\"18\"\n      aria-hidden=\"true\"\n    ></svg>\n  </button>\n</h3>\n\n<div\n  ngAccordionPanel\n  #panel=\"ngAccordionPanel\"\n  class=\"mlv-accordion-item__panel\"\n  [preserveContent]=\"true\"\n>\n  <ng-template ngAccordionContent>\n    <mlv-expand [opened]=\"expanded()\">\n      <div class=\"mlv-accordion-item__content\">\n        <ng-content />\n      </div>\n    </mlv-expand>\n  </ng-template>\n</div>\n", styles: ["@layer mlv.components{.mlv-accordion-item{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-typography-body-m-size)}.mlv-accordion-item *{box-sizing:border-box}.mlv-accordion-item{display:block}.mlv-accordion-item+.mlv-accordion-item{border-top:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-accordion-item__heading{margin:0;font-size:inherit;font-weight:inherit;line-height:inherit}.mlv-accordion-item__trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--mlv-spacing-3);width:100%;padding:var(--mlv-padding-l);border:none;background:transparent;color:var(--mlv-text-primary);font-family:inherit;font-size:var(--mlv-typography-heading-h6-size);font-weight:var(--mlv-typography-heading-h6-weight);line-height:var(--mlv-typography-heading-h6-line-height);text-align:start;cursor:pointer;transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}.mlv-accordion-item__trigger:hover,.mlv-accordion-item__trigger[aria-expanded=true]{--mlv-accordion-icon-opacity: 1}.mlv-accordion-item__trigger:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:calc(var(--mlv-focus-ring-offset) * -1)}.mlv-accordion-item__trigger[aria-disabled=true]{cursor:not-allowed;color:var(--mlv-text-disabled)}.mlv-accordion-item__title{display:inline-flex;align-items:center;gap:var(--mlv-spacing-3);min-width:0}.mlv-accordion-item__icon{flex:none;color:var(--mlv-text-secondary);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default),opacity var(--mlv-duration-normal) var(--mlv-ease-default);opacity:var(--mlv-accordion-icon-opacity, .5)}@media(prefers-reduced-motion:reduce){.mlv-accordion-item__icon{transition:none}}.mlv-accordion-item__content{padding:var(--mlv-padding-l);color:var(--mlv-text-secondary)}.mlv-accordion-item--open .mlv-accordion-item__icon{transform:rotate(180deg)}.mlv-accordion-item--disabled{opacity:var(--mlv-disabled-opacity)}}\n"], dependencies: [{ kind: "directive", type: AccordionTrigger, selector: "[ngAccordionTrigger]", inputs: ["panel", "id", "disabled", "expanded"], outputs: ["expandedChange"], exportAs: ["ngAccordionTrigger"] }, { kind: "directive", type: AccordionPanel, selector: "[ngAccordionPanel]", inputs: ["id"], exportAs: ["ngAccordionPanel"] }, { kind: "directive", type: AccordionContent, selector: "ng-template[ngAccordionContent]" }, { kind: "component", type: MlvExpand, selector: "mlv-expand", inputs: ["opened", "disabled", "ariaLabel", "ariaLabelledBy"], outputs: ["openedChange"] }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordionItem, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-accordion-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        AccordionTrigger,
+                        AccordionPanel,
+                        AccordionContent,
+                        MlvExpand,
+                        LucideChevronDown,
+                    ], host: {
+                        class: 'mlv-accordion-item',
+                        '[class.mlv-accordion-item--open]': 'expanded()',
+                        '[class.mlv-accordion-item--disabled]': 'disabled()',
+                    }, template: "<h3 class=\"mlv-accordion-item__heading\">\n  <button\n    type=\"button\"\n    ngAccordionTrigger\n    class=\"mlv-accordion-item__trigger\"\n    [panel]=\"panel\"\n    [disabled]=\"disabled()\"\n    [(expanded)]=\"expanded\"\n  >\n    <span class=\"mlv-accordion-item__title\">\n      {{ header() }}<ng-content select=\"[mlvAccordionHeader]\" />\n    </span>\n    <svg\n      lucideChevronDown\n      class=\"mlv-accordion-item__icon\"\n      [size]=\"18\"\n      aria-hidden=\"true\"\n    ></svg>\n  </button>\n</h3>\n\n<div\n  ngAccordionPanel\n  #panel=\"ngAccordionPanel\"\n  class=\"mlv-accordion-item__panel\"\n  [preserveContent]=\"true\"\n>\n  <ng-template ngAccordionContent>\n    <mlv-expand [opened]=\"expanded()\">\n      <div class=\"mlv-accordion-item__content\">\n        <ng-content />\n      </div>\n    </mlv-expand>\n  </ng-template>\n</div>\n", styles: ["@layer mlv.components{.mlv-accordion-item{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-typography-body-m-size)}.mlv-accordion-item *{box-sizing:border-box}.mlv-accordion-item{display:block}.mlv-accordion-item+.mlv-accordion-item{border-top:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-accordion-item__heading{margin:0;font-size:inherit;font-weight:inherit;line-height:inherit}.mlv-accordion-item__trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--mlv-spacing-3);width:100%;padding:var(--mlv-padding-l);border:none;background:transparent;color:var(--mlv-text-primary);font-family:inherit;font-size:var(--mlv-typography-heading-h6-size);font-weight:var(--mlv-typography-heading-h6-weight);line-height:var(--mlv-typography-heading-h6-line-height);text-align:start;cursor:pointer;transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}.mlv-accordion-item__trigger:hover,.mlv-accordion-item__trigger[aria-expanded=true]{--mlv-accordion-icon-opacity: 1}.mlv-accordion-item__trigger:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:calc(var(--mlv-focus-ring-offset) * -1)}.mlv-accordion-item__trigger[aria-disabled=true]{cursor:not-allowed;color:var(--mlv-text-disabled)}.mlv-accordion-item__title{display:inline-flex;align-items:center;gap:var(--mlv-spacing-3);min-width:0}.mlv-accordion-item__icon{flex:none;color:var(--mlv-text-secondary);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default),opacity var(--mlv-duration-normal) var(--mlv-ease-default);opacity:var(--mlv-accordion-icon-opacity, .5)}@media(prefers-reduced-motion:reduce){.mlv-accordion-item__icon{transition:none}}.mlv-accordion-item__content{padding:var(--mlv-padding-l);color:var(--mlv-text-secondary)}.mlv-accordion-item--open .mlv-accordion-item__icon{transform:rotate(180deg)}.mlv-accordion-item--disabled{opacity:var(--mlv-disabled-opacity)}}\n"] }]
+        }], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }] } });
+
+/**
+ * Marks projected content as the rich header of a `mlv-accordion-item`.
+ *
+ * Use it when the header needs more than the plain `header` string input
+ * (icons, badges, multi-line markup). When present, it renders inside the
+ * accordion trigger button alongside — or instead of — the `header` text.
+ *
+ * @example
+ * ```html
+ * <mlv-accordion-item>
+ *   <span mlvAccordionHeader>
+ *     <svg lucideFolder [size]="16" /> Documents
+ *   </span>
+ *   <p>Panel content…</p>
+ * </mlv-accordion-item>
+ * ```
+ */
+class MlvAccordionHeader {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordionHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MlvAccordionHeader, isStandalone: true, selector: "[mlvAccordionHeader]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvAccordionHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mlvAccordionHeader]',
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MlvAccordion, MlvAccordionHeader, MlvAccordionItem };
+//# sourceMappingURL=malva-ui-core-accordion.mjs.map

package/fesm2022/malva-ui-core-accordion.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-accordion.mjs","sources":["../../../../libs/core/accordion/src/lib/accordion/accordion.ts","../../../../libs/core/accordion/src/lib/accordion-item/accordion-item.ts","../../../../libs/core/accordion/src/lib/accordion-item/accordion-item.html","../../../../libs/core/accordion/src/lib/accordion-item/accordion-header.ts","../../../../libs/core/accordion/src/malva-ui-core-accordion.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  inject,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AccordionGroup } from '@angular/aria/accordion';\n\n/**\n * Vertical accordion container built on the `@angular/aria` `AccordionGroup`\n * headless pattern. Projects one or more `mlv-accordion-item` children and\n * coordinates their expand/collapse behaviour, single- vs multi-expand mode,\n * and roving keyboard navigation (Arrow Up/Down, Home, End) across the item\n * headers.\n *\n * The `@angular/aria` `AccordionGroup` is applied as a host directive so the\n * `ACCORDION_GROUP` DI token it provides is visible to the triggers rendered\n * inside each projected `mlv-accordion-item`. Its inputs are re-exposed\n * verbatim on `<mlv-accordion>` — the aria directive owns the roles, keyboard\n * event listeners, roving tabindex, and `aria-*` wiring.\n *\n * @example Single-expand (default aria behaviour is multi-expand)\n * ```html\n * <mlv-accordion [multiExpandable]=\"false\">\n *   <mlv-accordion-item header=\"Shipping\">…</mlv-accordion-item>\n *   <mlv-accordion-item header=\"Returns\">…</mlv-accordion-item>\n * </mlv-accordion>\n * ```\n *\n * @example Programmatic expand/collapse all\n * ```html\n * <mlv-accordion #acc [multiExpandable]=\"true\">…</mlv-accordion>\n * <button (click)=\"acc.expandAll()\">Expand all</button>\n * <button (click)=\"acc.collapseAll()\">Collapse all</button>\n * ```\n */\n@Component({\n  selector: 'mlv-accordion',\n  template: '<ng-content />',\n  styleUrl: './accordion.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: AccordionGroup,\n      inputs: ['multiExpandable', 'disabled', 'softDisabled', 'wrap'],\n    },\n  ],\n  host: {\n    class: 'mlv-accordion',\n  },\n})\nexport class MlvAccordion {\n  /**\n   * @private The host `@angular/aria` `AccordionGroup` directive instance,\n   * used to delegate the imperative `expandAll()` / `collapseAll()` calls.\n   */\n  private readonly _group = inject(AccordionGroup);\n\n  /**\n   * Expands every accordion item. Only has an effect when `multiExpandable`\n   * is `true`; in single-expand mode the aria pattern keeps at most one panel\n   * open.\n   */\n  expandAll(): void {\n    this._group.expandAll();\n  }\n\n  /** Collapses every accordion item. */\n  collapseAll(): void {\n    this._group.collapseAll();\n  }\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  model,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n  AccordionContent,\n  AccordionPanel,\n  AccordionTrigger,\n} from '@angular/aria/accordion';\nimport { MlvExpand } from '@malva-ui/core/expand';\nimport { LucideChevronDown } from '@lucide/angular';\n\n/**\n * A single expandable section of a `mlv-accordion`.\n *\n * Renders a header button (the `@angular/aria` `AccordionTrigger`) and a\n * lazily-rendered content region (`AccordionPanel` + `AccordionContent`). The\n * visual open/close animation is provided by wrapping the panel content in\n * `mlv-expand`; the aria directives own the `role`, `aria-expanded`,\n * `aria-controls`/`aria-labelledby` linkage, `inert`, and keyboard handling.\n *\n * Panel content is rendered lazily on first expand via aria's `DeferredContent`\n * and then kept mounted (`preserveContent`) so the `mlv-expand`\n * grid-row animation is never torn down mid-transition — the collapse hides the\n * content through `mlv-expand`'s own `@if`, not by unmounting the panel.\n *\n * @example\n * ```html\n * <mlv-accordion>\n *   <mlv-accordion-item header=\"Billing\" [(expanded)]=\"billingOpen\">\n *     <p>Manage your billing details…</p>\n *   </mlv-accordion-item>\n * </mlv-accordion>\n * ```\n */\n@Component({\n  selector: 'mlv-accordion-item',\n  templateUrl: './accordion-item.html',\n  styleUrl: './accordion-item.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    AccordionTrigger,\n    AccordionPanel,\n    AccordionContent,\n    MlvExpand,\n    LucideChevronDown,\n  ],\n  host: {\n    class: 'mlv-accordion-item',\n    '[class.mlv-accordion-item--open]': 'expanded()',\n    '[class.mlv-accordion-item--disabled]': 'disabled()',\n  },\n})\nexport class MlvAccordionItem {\n  /**\n   * Plain-text header shown in the trigger button. For rich header content\n   * (icons, badges) project an element marked with the `mlvAccordionHeader`\n   * directive instead.\n   */\n  readonly header = input<string>('');\n\n  /**\n   * Disables this item: the trigger becomes non-interactive and gets\n   * `aria-disabled=\"true\"`. Whether it stays keyboard-focusable is governed by\n   * the parent `mlv-accordion`'s `softDisabled` input (aria default: focusable).\n   * Supports attribute syntax: `<mlv-accordion-item disabled>`.\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * Two-way bindable expanded state of this item. Bind with\n   * `[(expanded)]=\"mySignal\"`, or observe changes with\n   * `(expandedChange)=\"onToggle($event)\"`. Kept in sync with the aria\n   * `AccordionTrigger` expansion model.\n   */\n  readonly expanded = model<boolean>(false);\n}\n","<h3 class=\"mlv-accordion-item__heading\">\n  <button\n    type=\"button\"\n    ngAccordionTrigger\n    class=\"mlv-accordion-item__trigger\"\n    [panel]=\"panel\"\n    [disabled]=\"disabled()\"\n    [(expanded)]=\"expanded\"\n  >\n    <span class=\"mlv-accordion-item__title\">\n      {{ header() }}<ng-content select=\"[mlvAccordionHeader]\" />\n    </span>\n    <svg\n      lucideChevronDown\n      class=\"mlv-accordion-item__icon\"\n      [size]=\"18\"\n      aria-hidden=\"true\"\n    ></svg>\n  </button>\n</h3>\n\n<div\n  ngAccordionPanel\n  #panel=\"ngAccordionPanel\"\n  class=\"mlv-accordion-item__panel\"\n  [preserveContent]=\"true\"\n>\n  <ng-template ngAccordionContent>\n    <mlv-expand [opened]=\"expanded()\">\n      <div class=\"mlv-accordion-item__content\">\n        <ng-content />\n      </div>\n    </mlv-expand>\n  </ng-template>\n</div>\n","import { Directive } from '@angular/core';\n\n/**\n * Marks projected content as the rich header of a `mlv-accordion-item`.\n *\n * Use it when the header needs more than the plain `header` string input\n * (icons, badges, multi-line markup). When present, it renders inside the\n * accordion trigger button alongside — or instead of — the `header` text.\n *\n * @example\n * ```html\n * <mlv-accordion-item>\n *   <span mlvAccordionHeader>\n *     <svg lucideFolder [size]=\"16\" /> Documents\n *   </span>\n *   <p>Panel content…</p>\n * </mlv-accordion-item>\n * ```\n */\n@Directive({\n  selector: '[mlvAccordionHeader]',\n})\nexport class MlvAccordionHeader {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}