@slotted/angular 0.0.0-stage → 0.1.0-beta.1

package/docs/wizard.md

@@ -0,0 +1,295 @@
+<!-- index: ./index.md -->
+# wizard
+
+`data-ui="wizard"` · Multi-step form with validation per step.
+
+## Import
+
+```ts
+import { SlWizard, SlWizardStep, SlWizardForm, SlWizardComplete, SlWizardEdit, provideWizardDefaults } from '@slotted/angular/wizard';
+```
+
+Selector: `[slWizard], ng-template[slWizardStep], form[slWizardForm], ng-template[slWizardComplete], ng-template[slWizardActions], button[slWizardEdit]` · exportAs: `slWizard`
+
+## Minimal example
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [submitWizard]="open">
+  <ng-template slWizardStep="account" label="Account">
+    <form slForm slWizardForm [formGroup]="account">
+      <div slField>
+        <label slFieldLabel>Work email</label>
+        <div slTextField>
+          <input slTextFieldInput formControlName="email" type="email" />
+        </div>
+      </div>
+    </form>
+  </ng-template>
+  <ng-template slWizardComplete>…</ng-template>
+</div>
+```
+
+## Anatomy
+
+| Part | Element | Required |
+| --- | --- | --- |
+| `root` | the element slWizard is on | yes |
+| `layout` | div | yes |
+| `progress` | div | no |
+| `progress-toggle` | button | no |
+| `progress-position` | span | no |
+| `progress-track` | span | no |
+| `progress-segment` | span | no |
+| `main` | div | yes |
+| `error` | div around an slAlert | no |
+| `step` | div | yes |
+| `step-header` | div | yes |
+| `step-title` | h2, h3 or h4 | yes |
+| `position` | span | yes |
+| `optional` | span around an slTag | no |
+| `step-description` | p | no |
+| `actions` | div | yes |
+| `actions-start` | div (slWizardActionsStart) | yes |
+| `actions-end` | div (slWizardActionsEnd) | yes |
+| `cancel` | button[slWizardCancel] | no |
+| `save-draft` | button[slWizardSaveDraft] | no |
+| `draft-status` | [slWizardDraftStatus] role="status" | no |
+| `skip` | button[slWizardSkip] | no |
+| `previous` | button[slWizardPrevious] | no |
+| `next` | button[slWizardNext] | no |
+| `submit` | button[slWizardNext] | no |
+| `edit` | button[slWizardEdit] | no |
+| `complete` | div | no |
+| `skeleton` | div | no |
+
+## Props
+
+| Name | Type | Default | Applies to | Description |
+| --- | --- | --- | --- | --- |
+| `step` | `model<string \| undefined>` | — | slWizard | The current step’s name; [(step)] binds it |
+| `defaultStep` | `string` | the first incomplete step | slWizard | Where an unbound wizard starts, read once and clamped |
+| `value` | `model<WizardValue \| undefined>` | — | slWizard | The accepted answers; [(value)] binds it |
+| `defaultValue` | `WizardValue` | {} | slWizard | The unbound answers, read once |
+| `progressOpen` | `model<boolean>` | false | slWizard | Whether the compact list is open; [(progressOpen)] binds it |
+| `defaultProgressOpen` | `boolean` | false | slWizard | Whether an unbound list starts open, read once |
+| `progress` | `'start' \| 'top' \| 'none'` | start | slWizard, provideWizardDefaults | Where the list of steps stands |
+| `scroll` | `'ancestor' \| 'self'` | ancestor | slWizard, provideWizardDefaults | self takes the height given and pins the actions |
+| `linear` | `boolean` | true | slWizard, provideWizardDefaults | A step ahead is reached only once every step before it is complete |
+| `level` | `2 \| 3 \| 4` | 2 | slWizard, provideWizardDefaults | The step heading’s level |
+| `messages` | `PartialMessages<WizardMessages>` | — | slWizard | Words laid over the language in force, key by key: position, progress (the name of the list of steps), previous, next, submit, return, cancel, saveDraft, saving, saved with {time}, draftFailed, skip, optional, edit, incomplete, submitFailed, restoring |
+| `error` | `string` | — | slWizard | An error of your own above the step |
+| `disabled` | `boolean` | false | slWizard | Every action refused |
+| `submitWizard` | `(values, request) => void \| WizardFailure \| Promise<…>` | — | slWizard | Called with the steps present once the last step is accepted |
+| `persistence` | `WizardPersistence` | — | slWizard | load, save and clear; storagePersistence keeps drafts in Storage |
+| `version` | `string \| number` | — | slWizard | A draft of another version is not restored |
+| `autosave` | `'none' \| 'step'` | step with persistence | slWizard | step writes a draft after every accepted step |
+| `guardUnsaved` | `boolean` | false | slWizard | A beforeunload guard while anything is unsubmitted |
+| `cancellable` | `boolean` | false | slWizard | Shows the cancel action |
+| `draftable` | `boolean` | false | slWizard | Shows save draft without persistence |
+| `delay` | `number` | 200 | slWizard, provideWizardDefaults | How long a restore may take before its skeleton is drawn |
+| `minDuration` | `number` | 400 | slWizard, provideWizardDefaults | How long a drawn skeleton stays |
+| `slWizardStep` | `string` | — | ng-template[slWizardStep] | The step’s name |
+| `label` | `string` | — | ng-template[slWizardStep] | The step’s name in the heading and the progress |
+| `description` | `string` | — | ng-template[slWizardStep] | A sentence under the heading |
+| `optional` | `boolean` | false | ng-template[slWizardStep] | Marked Optional, and skippable |
+| `disabled` | `boolean` | false | ng-template[slWizardStep] | Out of reach and stepped over |
+| `validate` | `WizardValidate` | — | ng-template[slWizardStep] | Runs after the group’s validators; errors by control name |
+| `values` | `StepValues` | the group’s raw value | ng-template[slWizardStep] | Typed answers to accept instead |
+| `template context` | `{ $implicit: values, values, name, complete, optional, errors }` | — | ng-template[slWizardStep] | errors is what a failed submission sent back, for the form’s [defaultErrors] |
+| `slWizardEdit` | `string` | — | button[slWizardEdit] | The step to change and come back from |
+| `exportAs slWizard` | `next, previous, goTo, edit, skip, saveDraft, clearDraft, reset, focus` | — | slWizard | The imperative moves, from a template reference |
+
+## Events
+
+| Name | Payload | When |
+| --- | --- | --- |
+| `stepChangeRequest` | `ChangeRequest<string> & { reason }` | Before the step moves: an accepted step or Enter (submit), a header or Back (pointer, keyboard), a clamp or a restore (programmatic). cancel() refuses it; otherwise step is written. |
+| `valueChangeRequest` | `ChangeRequest<WizardValue> & { reason }` | Before the accepted answers move: a step accepted (submit), reset (clear), a restored draft (programmatic). |
+| `progressOpenChangeRequest` | `ChangeRequest<boolean> & { reason }` | Before the compact list opens or closes: its bar (pointer, keyboard), a step chosen (select), Escape (escape). |
+| `cancelRequest` | `{ dirty, source }` | When cancel is pressed. The family closes nothing. |
+| `draftSave` | `{ snapshot, reason, source }` | When a draft is written, before persistence keeps it. |
+| `completed` | `WizardValue` | After submitWizard accepted the submission. |
+
+## Axes and defaults
+
+| Axis | Values | Default |
+| --- | --- | --- |
+| `progress` | `start`, `top`, `none` | `start` |
+| `scroll` | `ancestor`, `self` | `ancestor` |
+| `level` | `2`, `3`, `4` | `2` |
+| `autosave` | `none`, `step` | — |
+
+## Rules
+
+- No WAI-ARIA pattern names a wizard; the WAI Multi-page Forms tutorial is the source. The progress is the slStepper, an ordered list whose current header carries aria-current="step" and whose headers say their status.
+- Every step change moves focus to the step’s heading, which starts with its position, so a reader hears “Step 2 of 4, Company”; focus is not moved on the first render.
+- Each step’s form is the consumer’s form[slForm]: Enter in a text field submits it, Reactive Forms marks every control touched on a refused step, and the error summary takes focus.
+- A failed submission shows an slAlert above the step and moves focus to it; an accepted one moves focus to the complete part. The draft status is a polite status.
+- Back and a header behind the current step keep what was typed; a header ahead is reached only once the steps before it are complete, and stays in the tab order with aria-disabled until then.
+
+## Tokens
+
+`--slotted-border-subtle`, `--slotted-border-width-thin`, `--slotted-control-border-color`, `--slotted-control-border-width`, `--slotted-control-gap-md`, `--slotted-control-height-lg`, `--slotted-control-padding-inline-md`, `--slotted-control-radius`, `--slotted-control-shadow`, `--slotted-control-shadow-focus-geometry`, `--slotted-control-surface`, `--slotted-control-transition-duration`, `--slotted-control-transition-easing`, `--slotted-disabled-foreground`, `--slotted-duration-medium`, `--slotted-duration-short`, `--slotted-easing-standard`, `--slotted-focus-ring-color`, `--slotted-focus-ring-offset`, `--slotted-focus-ring-width`, `--slotted-font-family-heading`, `--slotted-font-family-sans`, `--slotted-font-size-2xl`, `--slotted-font-size-md`, `--slotted-font-size-sm`, `--slotted-font-weight-medium`, `--slotted-font-weight-semibold`, `--slotted-line-height-2xl`, `--slotted-line-height-md`, `--slotted-line-height-sm`, `--slotted-page-ground`, `--slotted-radius-full`, `--slotted-radius-xs`, `--slotted-space-1`, `--slotted-space-2`, `--slotted-space-3`, `--slotted-space-4`, `--slotted-space-5`, `--slotted-space-6`, `--slotted-space-8`, `--slotted-space-9`, `--slotted-surface`, `--slotted-surface-sunken`, `--slotted-text`, `--slotted-text-muted`, `--slotted-tone-accent-border`, `--slotted-tone-accent-solid`, `--slotted-tone-accent-text`, `--slotted-tone-danger-solid`, `--slotted-tone-secondary-subtle-hover`, `--slotted-wizard-border`, `--slotted-wizard-edit-color`, `--slotted-wizard-gap`, `--slotted-wizard-header-gap`, `--slotted-wizard-progress-inline-size`, `--slotted-wizard-rhythm`, `--slotted-wizard-segment-color`, `--slotted-wizard-segment-color-complete`, `--slotted-wizard-segment-color-invalid`, `--slotted-wizard-toggle-active-background`, `--slotted-wizard-toggle-hover-border-color`
+
+## Examples
+
+### Where the progress stands
+
+progress="start" is a column beside the step, "top" a row above it, "none" leaves the position in the heading alone.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard progress="top">…</div>
+```
+
+### A step refused, by Reactive Forms and by the server
+
+The email is required, and validate asks the server whether it is taken: Next waits, the answer lands in the form’s summary, and the step turns red in the progress.
+
+Excerpt — not a complete module
+
+```html
+<ng-template slWizardStep="account" label="Account" [validate]="emailFree">
+  <form slForm slWizardForm [formGroup]="account">…</form>
+</ng-template>
+```
+
+### Steps that depend on an answer
+
+Choose Business and accept the step: a Company step appears after it. Choose Personal again and it leaves — its answers are kept and never submitted.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [(value)]="value">
+  <ng-template slWizardStep="account" label="Account">…</ng-template>
+  @if (value()?.account?.type === 'business') {
+    <ng-template slWizardStep="company" label="Company">…</ng-template>
+  }
+  <ng-template slWizardStep="billing" label="Billing">…</ng-template>
+</div>
+```
+
+### An optional step
+
+The heading and the progress both say Optional; Skip accepts the step with no answers.
+
+Excerpt — not a complete module
+
+```html
+<ng-template slWizardStep="invite" label="Invite teammates" optional> … </ng-template>
+```
+
+### Review, change and come back
+
+Change goes to the step and Next reads Save and return: accepting it comes back to the review.
+
+Excerpt — not a complete module
+
+```html
+<dd slDescriptionListAction>
+  <button slWizardEdit="billing"></button>
+</dd>
+```
+
+### Submitting, failing and finishing
+
+The first try is refused with the step and the field named: the wizard goes back to Account with the error above it. The second succeeds and the complete part takes focus.
+
+Excerpt — not a complete module
+
+```ts
+const open: WizardSubmit = async (values) => {
+  const answer = await api.openAccount(values);
+  if (answer.error === 'email-taken') {
+    return { step: 'account', errors: { email: 'Taken since you started' } };
+  }
+};
+```
+
+### Drafts, reload and a draft of another version
+
+Save draft writes to sessionStorage and the status says when. Reload the page and the wizard opens where the draft left it; a slow store shows the step’s own skeleton meanwhile.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [persistence]="drafts" [version]="3" guardUnsaved>…</div>
+```
+
+### The step in the address
+
+A router binds step two-way. A link to a step past the work done is clamped to the first incomplete one.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [(step)]="step" (stepChangeRequest)="navigate($event.value)">…</div>
+```
+
+### On a phone
+
+Below 600 pixels the progress folds behind a bar that says the position; the actions stack.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [(progressOpen)]="open">…</div>
+```
+
+### Inside a layer
+
+scroll="self" takes the height it is given: the step scrolls and the actions stay at the bottom.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard progress="none" scroll="self">…</div>
+```
+
+### Seven steps, in German
+
+Long translated names wrap in the column and in the heading; the row of actions wraps before it squeezes a button.
+
+Excerpt — not a complete module
+
+```html
+<ng-template slWizardStep="zahlung" label="Zahlungsinformationen und Rechnungsanschrift">
+  …
+</ng-template>
+```
+
+### Reactive Forms
+
+The group lives in your component and keeps what was typed across steps; its raw value is the step’s answers, and a pending async validator holds Next.
+
+Excerpt — not a complete module
+
+```html
+<form slForm slWizardForm [formGroup]="billing">
+  <input slTextFieldInput formControlName="city" />
+</form>
+```
+
+### Words for another product
+
+Every word is a message; provideSlotted sets the language once, and a wizard lays its own words over it.
+
+Excerpt — not a complete module
+
+```ts
+providers: [provideSlotted({ locale: 'pt-BR', catalogs: { 'pt-BR': PT_BR } })];
+```
+
+### What a screen reader hears
+
+Each step change moves focus to the heading, which says “Step 2 of 4, Company”; Enter in any text field submits the step.
+
+Excerpt — not a complete module
+
+```html
+<div slWizard [messages]="{ progress: 'Account opening' }">…</div>
+```

package/fesm2022/slotted-angular-accordion.mjs

@@ -0,0 +1,247 @@
+import { isHeldOpen, nextOpenValues, sameOpenValues } from '@slotted/core/disclosure';
+import { createArrowNavigation } from '@slotted/core/focus';
+import { createControllable } from '@slotted/core/state';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Injectable, model, input, booleanAttribute, output, ElementRef, DestroyRef, computed, afterNextRender, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+
+const FALLBACK = {
+    headingLevel: '3',
+    indicator: 'chevron',
+    loop: true,
+    mount: 'eager',
+    multiple: false,
+    requireOpen: false,
+    size: 'md',
+    togglePlacement: 'end',
+    truncate: false,
+    variant: 'ruled',
+};
+const ACCORDION_DEFAULTS = new InjectionToken('slotted accordion defaults', { providedIn: 'root', factory: () => FALLBACK });
+/**
+ * An application decides once how its accordions look and behave, rather than
+ * repeating the same ten inputs on every set in a product. A set that states
+ * any of them itself still wins.
+ */
+function provideAccordionDefaults(defaults) {
+    return {
+        provide: ACCORDION_DEFAULTS,
+        useFactory: () => ({ ...FALLBACK, ...defaults }),
+    };
+}
+/** What an accordion renders as here, before it states anything of its own. */
+function injectAccordionDefaults() {
+    return inject(ACCORDION_DEFAULTS);
+}
+/**
+ * Application-scoped rather than module-scoped, for the reason `field` records:
+ * a module-level counter produces colliding sequences when two applications
+ * render in one server process, and the server and the client sequences must
+ * match for hydration.
+ */
+class SlAccordionIdFactory {
+    count = 0;
+    next() {
+        this.count += 1;
+        return `slotted-collapsible-${this.count}`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlAccordionIdFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlAccordionIdFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlAccordionIdFactory, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/**
+ * The header of every item this set owns, and of no set nested inside it.
+ * `:scope` is what keeps a nested accordion's headers out of the outer one's
+ * arrow ring: root, item, header, trigger is exactly four levels.
+ */
+const ACCORDION_TRIGGER_SELECTOR = ':scope > * > [data-part="header"] > [data-part="trigger"]';
+/** The variant the set hands its items, per variant the set is drawn in. */
+const ITEM_VARIANT = {
+    plain: 'plain',
+    ruled: 'ruled',
+    framed: 'ruled',
+    separated: 'framed',
+};
+/**
+ * A set of disclosures that share a value.
+ *
+ * **The keyboard is the pattern's, plus four keys that are not.** `Enter`,
+ * `Space`, `Tab` and `Shift + Tab` are the platform's, and every header stays
+ * in the page tab sequence — `w3c/aria-practices#3434` removed the roving
+ * alternative from the pattern, and Base UI deprecated its own `loopFocus` and
+ * `orientation` in the same change. `ArrowDown`, `ArrowUp`, `Home` and `End`
+ * are shipped on top of that sequence, because Radix and Ark both ship them and
+ * readers have learned them; they move focus and write no `tabindex`.
+ *
+ * **`requireOpen` marks the header it holds.** The pattern asks an accordion
+ * that does not permit a panel to be collapsed to write `aria-disabled="true"`
+ * on that header, and the APG's own example is the only surveyed source that
+ * ships it.
+ *
+ * **The items are `collapsible`s, and nothing here selects into them.** The set
+ * hands each one its appearance as a value, which is the rule `checkbox-group`
+ * set for every group family in the library.
+ */
+class SlAccordion {
+    /** The set of open values. Two-way, so a template may bind it directly. */
+    value = model([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether the set refuses to empty. The one open header then carries
+     * `aria-disabled="true"`, which is what the pattern asks of an accordion that
+     * does not permit its panel to be collapsed.
+     */
+    requireOpen = input(false, { ...(ngDevMode ? { debugName: "requireOpen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    size = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    variant = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    indicator = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "indicator" }] : /* istanbul ignore next */ []));
+    togglePlacement = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "togglePlacement" }] : /* istanbul ignore next */ []));
+    headingLevel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []));
+    mount = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mount" }] : /* istanbul ignore next */ []));
+    truncate = input(undefined, { ...(ngDevMode ? { debugName: "truncate" } : /* istanbul ignore next */ {}), transform: (state) => (state === undefined ? undefined : booleanAttribute(state)) });
+    loop = input(undefined, { ...(ngDevMode ? { debugName: "loop" } : /* istanbul ignore next */ {}), transform: (state) => (state === undefined ? undefined : booleanAttribute(state)) });
+    /**
+     * One output for one transition, carrying the reason and the event. `value`
+     * is the two-way half the ecosystem expects; this is the half a boolean
+     * cannot say.
+     */
+    valueChangeRequest = output();
+    defaults = injectAccordionDefaults();
+    host = inject(ElementRef).nativeElement;
+    destroyRef = inject(DestroyRef);
+    resolvedSize = computed(() => this.size() ?? this.defaults.size, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedSize" }] : /* istanbul ignore next */ []));
+    resolvedVariant = computed(() => this.variant() ?? this.defaults.variant, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedVariant" }] : /* istanbul ignore next */ []));
+    resolvedIndicator = computed(() => this.indicator() ?? this.defaults.indicator, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedIndicator" }] : /* istanbul ignore next */ []));
+    resolvedTogglePlacement = computed(() => this.togglePlacement() ?? this.defaults.togglePlacement, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedTogglePlacement" }] : /* istanbul ignore next */ []));
+    resolvedHeadingLevel = computed(() => this.headingLevel() ?? this.defaults.headingLevel, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedHeadingLevel" }] : /* istanbul ignore next */ []));
+    resolvedMount = computed(() => this.mount() ?? this.defaults.mount, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedMount" }] : /* istanbul ignore next */ []));
+    resolvedTruncate = computed(() => this.truncate() ?? this.defaults.truncate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedTruncate" }] : /* istanbul ignore next */ []));
+    resolvedLoop = computed(() => this.loop() ?? this.defaults.loop, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedLoop" }] : /* istanbul ignore next */ []));
+    resolvedMultiple = computed(() => this.multiple() ?? this.defaults.multiple, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedMultiple" }] : /* istanbul ignore next */ []));
+    resolvedRequireOpen = computed(() => this.requireOpen() ?? this.defaults.requireOpen, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedRequireOpen" }] : /* istanbul ignore next */ []));
+    /** The variant this set hands each of its items, which is not always its own. */
+    itemVariant = computed(() => ITEM_VARIANT[this.resolvedVariant()], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "itemVariant" }] : /* istanbul ignore next */ []));
+    constructor() {
+        /**
+         * The arrows move focus and nothing else. The engine writes no `tabindex`,
+         * which is the whole difference between it and the roving stop `tabs` uses.
+         */
+        afterNextRender(() => {
+            const navigation = createArrowNavigation(this.host, {
+                itemSelector: ACCORDION_TRIGGER_SELECTOR,
+                loop: () => this.resolvedLoop(),
+                orientation: () => 'vertical',
+            });
+            const observer = new MutationObserver(() => navigation.refresh());
+            observer.observe(this.host, { childList: true, subtree: true });
+            this.destroyRef.onDestroy(() => {
+                observer.disconnect();
+                navigation.destroy();
+            });
+        });
+    }
+    options() {
+        return { multiple: this.resolvedMultiple(), requireOpen: this.resolvedRequireOpen() };
+    }
+    /** Whether this value is one of the open ones. */
+    holds(value) {
+        return this.value().includes(value);
+    }
+    /** Whether this value is open and the set refuses to let it close. */
+    isHeld(value) {
+        return isHeldOpen(this.value(), value, this.options());
+    }
+    /** Asks the set to open or close one value. */
+    toggle(value, reason, source) {
+        const next = nextOpenValues(this.value(), value, this.options());
+        if (next === this.value())
+            return;
+        this.commit(next, reason, source);
+    }
+    /**
+     * Opens every item that is not disabled. It is Angular Material's `openAll`,
+     * and it is reached through `exportAs` rather than through a handle.
+     */
+    openAll() {
+        const values = this.items()
+            .filter((item) => !item.hasAttribute('data-disabled'))
+            .map((item) => item.getAttribute('data-value') ?? '');
+        this.commit(this.resolvedMultiple() ? values : values.slice(0, 1), 'programmatic');
+    }
+    /** Closes every item, unless `requireOpen` holds the last one. */
+    closeAll() {
+        const current = this.value();
+        if (this.resolvedRequireOpen() && current.length > 0) {
+            this.commit(current.slice(0, 1), 'programmatic');
+            return;
+        }
+        this.commit([], 'programmatic');
+    }
+    /**
+     * The items, read from the DOM rather than from a registry. It is the one
+     * order that is never stale, and it is how `tabs` reads its own collection.
+     */
+    items() {
+        return [...this.host.querySelectorAll(':scope > [data-value]')];
+    }
+    commit(next, reason, source) {
+        let cancelled = false;
+        const state = createControllable({
+            /* A `model` writes the change back itself, so the state is owned here and
+               the request is what a consumer inspects and may refuse. */
+            initial: this.value(),
+            /* Two arrays are never `Object.is`, so a set states its own equality or
+               emits a request on every change detection. */
+            equals: sameOpenValues,
+            onRequest: (request) => {
+                this.valueChangeRequest.emit(request);
+                cancelled = request.cancelled;
+            },
+        });
+        const moved = state.request(next, reason, source);
+        if (cancelled || !moved)
+            return;
+        this.value.set(next);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlAccordion, isStandalone: true, selector: "[slAccordion]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, requireOpen: { classPropertyName: "requireOpen", publicName: "requireOpen", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, togglePlacement: { classPropertyName: "togglePlacement", publicName: "togglePlacement", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, mount: { classPropertyName: "mount", publicName: "mount", isSignal: true, isRequired: false, transformFunction: null }, truncate: { classPropertyName: "truncate", publicName: "truncate", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChangeRequest: "valueChangeRequest" }, host: { attributes: { "data-ui": "accordion", "data-part": "root" }, properties: { "attr.data-size": "resolvedSize()", "attr.data-variant": "resolvedVariant()", "attr.data-disabled": "disabled() ? '' : null" } }, exportAs: ["slAccordion"], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer slotted.components{[data-ui=accordion]{--_rule-size: var(--slotted-border-width-thin, 1px);--_gap: var(--slotted-space-4, .5rem);display:grid;grid-auto-flow:row;grid-auto-rows:min-content;min-inline-size:0}[data-ui=accordion][data-size=sm]{--_gap: var(--slotted-space-3, .375rem)}[data-ui=accordion][data-size=lg]{--_gap: var(--slotted-space-5, .75rem)}[data-ui=accordion][data-variant=ruled]{border-block-end:var(--_rule-size) solid var(--slotted-accordion-rule-color, var(--slotted-border-subtle, ButtonBorder))}[data-ui=accordion][data-variant=framed]{background-color:var(--slotted-accordion-surface, var(--slotted-surface-raised, Canvas));border:var(--_rule-size) solid var(--slotted-accordion-rule-color, var(--slotted-border-subtle, ButtonBorder));border-radius:var(--slotted-accordion-radius, var(--slotted-radius-md, 6px));overflow:clip}[data-ui=accordion][data-variant=framed]>:first-child{border-block-start-color:transparent}[data-ui=accordion][data-variant=separated]{row-gap:var(--slotted-accordion-gap, var(--_gap))}[data-ui=accordion][data-disabled]{color:var(--slotted-disabled-foreground, GrayText)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlAccordion, decorators: [{
+            type: Component,
+            args: [{ selector: '[slAccordion]', standalone: true, exportAs: 'slAccordion', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        'data-ui': 'accordion',
+                        'data-part': 'root',
+                        '[attr.data-size]': 'resolvedSize()',
+                        '[attr.data-variant]': 'resolvedVariant()',
+                        '[attr.data-disabled]': "disabled() ? '' : null",
+                    }, styles: ["@layer slotted.components{[data-ui=accordion]{--_rule-size: var(--slotted-border-width-thin, 1px);--_gap: var(--slotted-space-4, .5rem);display:grid;grid-auto-flow:row;grid-auto-rows:min-content;min-inline-size:0}[data-ui=accordion][data-size=sm]{--_gap: var(--slotted-space-3, .375rem)}[data-ui=accordion][data-size=lg]{--_gap: var(--slotted-space-5, .75rem)}[data-ui=accordion][data-variant=ruled]{border-block-end:var(--_rule-size) solid var(--slotted-accordion-rule-color, var(--slotted-border-subtle, ButtonBorder))}[data-ui=accordion][data-variant=framed]{background-color:var(--slotted-accordion-surface, var(--slotted-surface-raised, Canvas));border:var(--_rule-size) solid var(--slotted-accordion-rule-color, var(--slotted-border-subtle, ButtonBorder));border-radius:var(--slotted-accordion-radius, var(--slotted-radius-md, 6px));overflow:clip}[data-ui=accordion][data-variant=framed]>:first-child{border-block-start-color:transparent}[data-ui=accordion][data-variant=separated]{row-gap:var(--slotted-accordion-gap, var(--_gap))}[data-ui=accordion][data-disabled]{color:var(--slotted-disabled-foreground, GrayText)}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], requireOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "requireOpen", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], indicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicator", required: false }] }], togglePlacement: [{ type: i0.Input, args: [{ isSignal: true, alias: "togglePlacement", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], mount: [{ type: i0.Input, args: [{ isSignal: true, alias: "mount", required: false }] }], truncate: [{ type: i0.Input, args: [{ isSignal: true, alias: "truncate", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], valueChangeRequest: [{ type: i0.Output, args: ["valueChangeRequest"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ACCORDION_DEFAULTS, ACCORDION_TRIGGER_SELECTOR, SlAccordion, SlAccordionIdFactory, injectAccordionDefaults, provideAccordionDefaults };
+//# sourceMappingURL=slotted-angular-accordion.mjs.map

package/fesm2022/slotted-angular-accordion.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-accordion.mjs","sources":["../../accordion/src/accordion-defaults.ts","../../accordion/src/accordion.ts","../../accordion/src/slotted-angular-accordion.ts"],"sourcesContent":["import { inject, Injectable, InjectionToken } from '@angular/core';\n\n/** The type step the set and its items sit at. */\nexport type AccordionSize = 'sm' | 'md' | 'lg';\n\n/**\n * How the set is drawn. `plain` paints nothing, `ruled` puts one hairline per\n * seam, `framed` wraps the ruled set in one frame, and `separated` gives every\n * item a card of its own.\n */\nexport type AccordionVariant = 'plain' | 'ruled' | 'framed' | 'separated';\n\n/** The mark each header carries. Handed to every item. */\nexport type AccordionIndicator = 'chevron' | 'plus-minus' | 'none';\n\n/** Which side of the words that mark stands on. Handed to every item. */\nexport type AccordionTogglePlacement = 'end' | 'start';\n\n/**\n * The heading level every item's header answers to. `3` is the default, which\n * is the level the APG's own example uses for a set inside a section.\n */\nexport type AccordionHeadingLevel = 'none' | '1' | '2' | '3' | '4' | '5' | '6';\n\n/** When each panel's content exists. Handed to every item. */\nexport type AccordionMount = 'active' | 'lazy' | 'eager' | 'until-found';\n\n/** Why the set of open panels moved. */\nexport type AccordionSelectionReason = 'pointer' | 'keyboard' | 'select' | 'programmatic';\n\nexport interface AccordionDefaults {\n  headingLevel: AccordionHeadingLevel;\n  indicator: AccordionIndicator;\n  loop: boolean;\n  mount: AccordionMount;\n  multiple: boolean;\n  requireOpen: boolean;\n  size: AccordionSize;\n  togglePlacement: AccordionTogglePlacement;\n  truncate: boolean;\n  variant: AccordionVariant;\n}\n\nconst FALLBACK: AccordionDefaults = {\n  headingLevel: '3',\n  indicator: 'chevron',\n  loop: true,\n  mount: 'eager',\n  multiple: false,\n  requireOpen: false,\n  size: 'md',\n  togglePlacement: 'end',\n  truncate: false,\n  variant: 'ruled',\n};\n\nexport const ACCORDION_DEFAULTS = new InjectionToken<AccordionDefaults>(\n  'slotted accordion defaults',\n  { providedIn: 'root', factory: () => FALLBACK },\n);\n\n/**\n * An application decides once how its accordions look and behave, rather than\n * repeating the same ten inputs on every set in a product. A set that states\n * any of them itself still wins.\n */\nexport function provideAccordionDefaults(defaults: Partial<AccordionDefaults>) {\n  return {\n    provide: ACCORDION_DEFAULTS,\n    useFactory: (): AccordionDefaults => ({ ...FALLBACK, ...defaults }),\n  };\n}\n\n/** What an accordion renders as here, before it states anything of its own. */\nexport function injectAccordionDefaults(): AccordionDefaults {\n  return inject(ACCORDION_DEFAULTS);\n}\n\n/**\n * Application-scoped rather than module-scoped, for the reason `field` records:\n * a module-level counter produces colliding sequences when two applications\n * render in one server process, and the server and the client sequences must\n * match for hydration.\n */\n@Injectable({ providedIn: 'root' })\nexport class SlAccordionIdFactory {\n  private count = 0;\n\n  next() {\n    this.count += 1;\n    return `slotted-collapsible-${this.count}`;\n  }\n}\n","import { isHeldOpen, nextOpenValues, sameOpenValues } from '@slotted/core/disclosure';\nimport { createArrowNavigation } from '@slotted/core/focus';\nimport { createControllable } from '@slotted/core/state';\nimport type { ChangeRequest } from '@slotted/core/state';\nimport {\n  afterNextRender,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DestroyRef,\n  ElementRef,\n  inject,\n  input,\n  model,\n  output,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { ACCORDION_DEFAULTS, injectAccordionDefaults } from './accordion-defaults';\nimport type {\n  AccordionHeadingLevel,\n  AccordionIndicator,\n  AccordionMount,\n  AccordionSelectionReason,\n  AccordionSize,\n  AccordionTogglePlacement,\n  AccordionVariant,\n} from './accordion-defaults';\n\nexport type {\n  AccordionDefaults,\n  AccordionHeadingLevel,\n  AccordionIndicator,\n  AccordionMount,\n  AccordionSelectionReason,\n  AccordionSize,\n  AccordionTogglePlacement,\n  AccordionVariant,\n} from './accordion-defaults';\n\n/**\n * The header of every item this set owns, and of no set nested inside it.\n * `:scope` is what keeps a nested accordion's headers out of the outer one's\n * arrow ring: root, item, header, trigger is exactly four levels.\n */\nexport const ACCORDION_TRIGGER_SELECTOR =\n  ':scope > * > [data-part=\"header\"] > [data-part=\"trigger\"]';\n\n/** The variant the set hands its items, per variant the set is drawn in. */\nconst ITEM_VARIANT: Record<AccordionVariant, 'plain' | 'ruled' | 'framed'> = {\n  plain: 'plain',\n  ruled: 'ruled',\n  framed: 'ruled',\n  separated: 'framed',\n};\n\n/**\n * A set of disclosures that share a value.\n *\n * **The keyboard is the pattern's, plus four keys that are not.** `Enter`,\n * `Space`, `Tab` and `Shift + Tab` are the platform's, and every header stays\n * in the page tab sequence — `w3c/aria-practices#3434` removed the roving\n * alternative from the pattern, and Base UI deprecated its own `loopFocus` and\n * `orientation` in the same change. `ArrowDown`, `ArrowUp`, `Home` and `End`\n * are shipped on top of that sequence, because Radix and Ark both ship them and\n * readers have learned them; they move focus and write no `tabindex`.\n *\n * **`requireOpen` marks the header it holds.** The pattern asks an accordion\n * that does not permit a panel to be collapsed to write `aria-disabled=\"true\"`\n * on that header, and the APG's own example is the only surveyed source that\n * ships it.\n *\n * **The items are `collapsible`s, and nothing here selects into them.** The set\n * hands each one its appearance as a value, which is the rule `checkbox-group`\n * set for every group family in the library.\n */\n@Component({\n  selector: '[slAccordion]',\n  standalone: true,\n  exportAs: 'slAccordion',\n  template: '<ng-content />',\n  styleUrl: '../../../styles/src/accordion/accordion.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    'data-ui': 'accordion',\n    'data-part': 'root',\n    '[attr.data-size]': 'resolvedSize()',\n    '[attr.data-variant]': 'resolvedVariant()',\n    '[attr.data-disabled]': \"disabled() ? '' : null\",\n  },\n})\nexport class SlAccordion {\n  /** The set of open values. Two-way, so a template may bind it directly. */\n  readonly value = model<readonly string[]>([]);\n  readonly multiple = input(false, { transform: booleanAttribute });\n  /**\n   * Whether the set refuses to empty. The one open header then carries\n   * `aria-disabled=\"true\"`, which is what the pattern asks of an accordion that\n   * does not permit its panel to be collapsed.\n   */\n  readonly requireOpen = input(false, { transform: booleanAttribute });\n  readonly disabled = input(false, { transform: booleanAttribute });\n  readonly size = input<AccordionSize | undefined>(undefined);\n  readonly variant = input<AccordionVariant | undefined>(undefined);\n  readonly indicator = input<AccordionIndicator | undefined>(undefined);\n  readonly togglePlacement = input<AccordionTogglePlacement | undefined>(undefined);\n  readonly headingLevel = input<AccordionHeadingLevel | undefined>(undefined);\n  readonly mount = input<AccordionMount | undefined>(undefined);\n  readonly truncate = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n  readonly loop = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n\n  /**\n   * One output for one transition, carrying the reason and the event. `value`\n   * is the two-way half the ecosystem expects; this is the half a boolean\n   * cannot say.\n   */\n  readonly valueChangeRequest = output<ChangeRequest<readonly string[]>>();\n\n  private readonly defaults = injectAccordionDefaults();\n  private readonly host: HTMLElement = inject(ElementRef).nativeElement;\n  private readonly destroyRef = inject(DestroyRef);\n\n  readonly resolvedSize = computed(() => this.size() ?? this.defaults.size);\n  readonly resolvedVariant = computed(() => this.variant() ?? this.defaults.variant);\n  readonly resolvedIndicator = computed(() => this.indicator() ?? this.defaults.indicator);\n  readonly resolvedTogglePlacement = computed(\n    () => this.togglePlacement() ?? this.defaults.togglePlacement,\n  );\n  readonly resolvedHeadingLevel = computed(() => this.headingLevel() ?? this.defaults.headingLevel);\n  readonly resolvedMount = computed(() => this.mount() ?? this.defaults.mount);\n  readonly resolvedTruncate = computed(() => this.truncate() ?? this.defaults.truncate);\n  readonly resolvedLoop = computed(() => this.loop() ?? this.defaults.loop);\n  readonly resolvedMultiple = computed(() => this.multiple() ?? this.defaults.multiple);\n  readonly resolvedRequireOpen = computed(() => this.requireOpen() ?? this.defaults.requireOpen);\n\n  /** The variant this set hands each of its items, which is not always its own. */\n  readonly itemVariant = computed(() => ITEM_VARIANT[this.resolvedVariant()]);\n\n  constructor() {\n    /**\n     * The arrows move focus and nothing else. The engine writes no `tabindex`,\n     * which is the whole difference between it and the roving stop `tabs` uses.\n     */\n    afterNextRender(() => {\n      const navigation = createArrowNavigation(this.host, {\n        itemSelector: ACCORDION_TRIGGER_SELECTOR,\n        loop: () => this.resolvedLoop(),\n        orientation: () => 'vertical',\n      });\n      const observer = new MutationObserver(() => navigation.refresh());\n      observer.observe(this.host, { childList: true, subtree: true });\n\n      this.destroyRef.onDestroy(() => {\n        observer.disconnect();\n        navigation.destroy();\n      });\n    });\n  }\n\n  private options() {\n    return { multiple: this.resolvedMultiple(), requireOpen: this.resolvedRequireOpen() };\n  }\n\n  /** Whether this value is one of the open ones. */\n  holds(value: string): boolean {\n    return this.value().includes(value);\n  }\n\n  /** Whether this value is open and the set refuses to let it close. */\n  isHeld(value: string): boolean {\n    return isHeldOpen(this.value(), value, this.options());\n  }\n\n  /** Asks the set to open or close one value. */\n  toggle(value: string, reason: AccordionSelectionReason, source?: Event) {\n    const next = nextOpenValues(this.value(), value, this.options());\n    if (next === this.value()) return;\n    this.commit(next, reason, source);\n  }\n\n  /**\n   * Opens every item that is not disabled. It is Angular Material's `openAll`,\n   * and it is reached through `exportAs` rather than through a handle.\n   */\n  openAll() {\n    const values = this.items()\n      .filter((item) => !item.hasAttribute('data-disabled'))\n      .map((item) => item.getAttribute('data-value') ?? '');\n    this.commit(this.resolvedMultiple() ? values : values.slice(0, 1), 'programmatic');\n  }\n\n  /** Closes every item, unless `requireOpen` holds the last one. */\n  closeAll() {\n    const current = this.value();\n    if (this.resolvedRequireOpen() && current.length > 0) {\n      this.commit(current.slice(0, 1), 'programmatic');\n      return;\n    }\n    this.commit([], 'programmatic');\n  }\n\n  /**\n   * The items, read from the DOM rather than from a registry. It is the one\n   * order that is never stale, and it is how `tabs` reads its own collection.\n   */\n  private items(): HTMLElement[] {\n    return [...this.host.querySelectorAll<HTMLElement>(':scope > [data-value]')];\n  }\n\n  private commit(next: readonly string[], reason: AccordionSelectionReason, source?: Event) {\n    let cancelled = false;\n    const state = createControllable<readonly string[]>({\n      /* A `model` writes the change back itself, so the state is owned here and\n         the request is what a consumer inspects and may refuse. */\n      initial: this.value(),\n      /* Two arrays are never `Object.is`, so a set states its own equality or\n         emits a request on every change detection. */\n      equals: sameOpenValues,\n      onRequest: (request) => {\n        this.valueChangeRequest.emit(request);\n        cancelled = request.cancelled;\n      },\n    });\n    const moved = state.request(next, reason, source);\n    if (cancelled || !moved) return;\n    this.value.set(next);\n  }\n}\n\nexport { ACCORDION_DEFAULTS, injectAccordionDefaults };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}