@nldd/design-system 0.8.94 → 0.8.96

package/dist/components/status-and-feedback/step-indicator/step-indicator.js

@@ -1,216 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-/**
- * Nederlandse Digitale Dienst Step Indicator Component (Lit + TypeScript)
- *
- * Shows where you are in a process of several steps: a row of discs with a
- * number (or a check mark on what is done), a label under each and a line
- * connecting them.
- *
- * The parent holds the truth: `current` (1-based) derives the status of every
- * child — `past` before it, `future` after. A child can override that with a
- * `status` of its own, for flows that jump back or skip a step.
- *
- * Horizontal only. For steps under each other, build an `nldd-list` with an
- * `nldd-timeline-track-cell` and an `nldd-title-cell` per row: vertical steps
- * usually carry more than a title, and a list row already does that.
- *
- * Below the sm breakpoint (a container query, so measured on the component
- * itself rather than on the viewport) it folds into one line of text plus a
- * segmented bar. The full list of steps stays in the DOM, only visually hidden,
- * so assistive software hears no less than a wide screen shows.
- *
- * Accessibility: a `nav` with a label, holding a `role="list"` with a
- * `role="listitem"` per step. The current step gets `aria-current="step"`, the
- * only notion WAI-ARIA has for this. "Done" and "still to do" do not exist as
- * ARIA tokens and travel along as visually hidden text instead.
- *
- * @element nldd-step-indicator
- *
- * @attr {string} accessible-label - Name of the nav; defaults to the i18n value ("Voortgang")
- * @attr {object} translations - Override translation keys; unset keys fall back to Dutch
- * @attr {number} current - 1-based number of the current step (default 1)
- *
- * @slot - `nldd-step-indicator-item` children
- *
- * @example
- * ```html
- * <nldd-step-indicator
- * 	current="2"
- * 	accessible-label="Voortgang aanvraag"
- * >
- *   <nldd-step-indicator-item text="Gegevens"></nldd-step-indicator-item>
- *   <nldd-step-indicator-item text="Controle"></nldd-step-indicator-item>
- *   <nldd-step-indicator-item text="Bevestigen"></nldd-step-indicator-item>
- * </nldd-step-indicator>
- * ```
- */
-import { LitElement } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import { reflectNonDefault } from '../../../utilities/reflect-non-default.js';
-import { withTranslations } from '../../../utilities/with-translations.js';
-import { nlddStepIndicatorTranslations } from './step-indicator.i18n.js';
-import { stepIndicatorStyles, stepIndicatorItemStyles } from './step-indicator.styles.js';
-import { stepIndicatorTemplate, stepIndicatorItemTemplate } from './step-indicator.template.js';
-import '../../content/icon/icon.js';
-// # nldd-step-indicator-item
-/**
- * One step in an `nldd-step-indicator`. The parent decides the status and the
- * number; those live here as internal state rather than as public API, except
- * for `status`, which overrides what `current` derives.
- *
- * @element nldd-step-indicator-item
- *
- * @attr {string} status - `past` | `current` | `future`; overrides what the parent derives
- * @attr {string} text   - Label under the disc
- * @attr {string} icon   - Icon in the disc instead of the number or the check mark
- * @attr {string} href   - Makes the step a link (back to a completed step, for instance)
- * @attr {boolean} button - Makes the step a button, for flows without a URL per step; ignored when `href` is set
- *
- * @slot - Label (an alternative to `text`)
- */
-export class NLDDStepIndicatorItem extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.text = '';
-        this.icon = '';
-        this.href = '';
-        /** For flows without a URL per step (a wizard inside one window). Ignored
-         *  once `href` is set: one step is one action, and a link outranks a button
-         *  -- the same rule as nldd-card and nldd-avatar. */
-        this.button = false;
-        /** Set by the parent: the derived status when the item has none of its own,
-         *  the position number, and the status text for assistive tech. */
-        this._derivedStatus = 'future';
-        this._index = 1;
-        this._statusText = '';
-    }
-    /** The status that counts: the item's own wins over the derived one. */
-    get resolvedStatus() {
-        return this.status ?? this._derivedStatus;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        // Explicit ARIA, like nldd-breadcrumbs: the implicit <li> mapping does not
-        // travel reliably across the slot boundary.
-        if (!this.hasAttribute('role'))
-            this.setAttribute('role', 'listitem');
-    }
-    updated(changed) {
-        if (changed.has('status') || changed.has('_derivedStatus')) {
-            // On the host (the listitem), because that is what assistive tech announces.
-            if (this.resolvedStatus === 'current')
-                this.setAttribute('aria-current', 'step');
-            else
-                this.removeAttribute('aria-current');
-        }
-    }
-    render() {
-        return stepIndicatorItemTemplate(this);
-    }
-}
-NLDDStepIndicatorItem.styles = stepIndicatorItemStyles;
-__decorate([
-    property({ type: String, reflect: true })
-], NLDDStepIndicatorItem.prototype, "status", void 0);
-__decorate([
-    property({ reflect: true, converter: reflectNonDefault('') })
-], NLDDStepIndicatorItem.prototype, "text", void 0);
-__decorate([
-    property({ type: String })
-], NLDDStepIndicatorItem.prototype, "icon", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], NLDDStepIndicatorItem.prototype, "href", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], NLDDStepIndicatorItem.prototype, "button", void 0);
-__decorate([
-    state()
-], NLDDStepIndicatorItem.prototype, "_derivedStatus", void 0);
-__decorate([
-    state()
-], NLDDStepIndicatorItem.prototype, "_index", void 0);
-__decorate([
-    state()
-], NLDDStepIndicatorItem.prototype, "_statusText", void 0);
-// Sub-component of nldd-step-indicator. The guard registration (like
-// nldd-breadcrumbs-item's) keeps the first registration authoritative across HMR
-// and test re-imports.
-if (!customElements.get('nldd-step-indicator-item')) {
-    customElements.define('nldd-step-indicator-item', NLDDStepIndicatorItem);
-}
-// # nldd-step-indicator
-let NLDDStepIndicator = class NLDDStepIndicator extends withTranslations(LitElement, nlddStepIndicatorTranslations) {
-    constructor() {
-        super(...arguments);
-        this.accessibleLabel = '';
-        this.current = 1;
-        /** The steps, tracked so the compact view (text + bar) is driven by the same
-         *  source as the row of markers. */
-        this._items = [];
-        this._onSlotChange = (e) => {
-            const slot = e.target;
-            this._items = slot.assignedElements({ flatten: true })
-                .filter((el) => el.localName === 'nldd-step-indicator-item');
-        };
-    }
-    get total() {
-        return this._items.length;
-    }
-    /** The current step, clamped to the number of steps: an out-of-range
-     *  `current` would otherwise mark every step past (or none at all). */
-    get resolvedCurrent() {
-        if (this.total === 0)
-            return this.current;
-        return Math.min(Math.max(this.current, 1), this.total);
-    }
-    get currentItem() {
-        return this._items.find(item => item.resolvedStatus === 'current')
-            ?? this._items[this.resolvedCurrent - 1];
-    }
-    /** Before render, not after: the compact view reads the current item back out
-     *  of the children, so their statuses have to be fresh by the time this
-     *  element renders. */
-    willUpdate(changed) {
-        // withTranslations merges a consumer's `translations` override in its own
-        // willUpdate; without this call the override is silently ignored.
-        super.willUpdate(changed);
-        if (changed.has('current') || changed.has('_items'))
-            this._syncItems();
-    }
-    /** Push position, derived status and status text down to the children. Push
-     *  rather than pull: a child reading its own parent has no way of knowing
-     *  when `current` changes. */
-    _syncItems() {
-        const current = this.resolvedCurrent;
-        this._items.forEach((item, index) => {
-            const position = index + 1;
-            item._index = position;
-            item._derivedStatus = position < current ? 'past' : position === current ? 'current' : 'future';
-            item._statusText = this._t(`components.step-indicator.status-${item.resolvedStatus}-label`);
-        });
-    }
-    render() {
-        return stepIndicatorTemplate(this);
-    }
-};
-NLDDStepIndicator.styles = stepIndicatorStyles;
-__decorate([
-    property({ type: String, attribute: 'accessible-label' })
-], NLDDStepIndicator.prototype, "accessibleLabel", void 0);
-__decorate([
-    property({ type: Number, reflect: true })
-], NLDDStepIndicator.prototype, "current", void 0);
-__decorate([
-    state()
-], NLDDStepIndicator.prototype, "_items", void 0);
-NLDDStepIndicator = __decorate([
-    customElement('nldd-step-indicator')
-], NLDDStepIndicator);
-export { NLDDStepIndicator };
-//# sourceMappingURL=step-indicator.js.map

package/dist/components/status-and-feedback/step-indicator/step-indicator.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"step-indicator.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/step-indicator/step-indicator.ts"],"names":[],"mappings":"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"}

package/dist/components/status-and-feedback/step-indicator/step-indicator.styles.d.ts

@@ -1,3 +0,0 @@
-export declare const stepIndicatorStyles: import("lit").CSSResult;
-export declare const stepIndicatorItemStyles: import("lit").CSSResult;
-//# sourceMappingURL=step-indicator.styles.d.ts.map

package/dist/components/status-and-feedback/step-indicator/step-indicator.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"step-indicator.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/step-indicator/step-indicator.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,mBAAmB,yBAqG/B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yBA0LnC,CAAC"}

package/dist/components/status-and-feedback/step-indicator/step-indicator.styles.js

@@ -1,294 +0,0 @@
-import { css, unsafeCSS } from 'lit';
-import { breakpoints } from '../../../assets/styles/breakpoints.js';
-import { inheritedTextReset } from '../../../assets/styles/shadow-resets.js';
-const smMax = unsafeCSS(breakpoints.smMax);
-export const stepIndicatorStyles = css `
-	:host {
-		box-sizing: border-box;
-	}
-
-	:host {
-		--_compact-text-gap: var(--primitives-space-8);
-		--_compact-text-color: var(--semantics-content-color);
-		--_compact-count-color: var(--semantics-content-secondary-color);
-		--_compact-bar-gap: var(--primitives-space-4);
-		--_compact-bar-segment-gap: var(--primitives-space-2);
-		--_compact-bar-corner-radius: var(--primitives-corner-radius-full);
-		--_track-color: light-dark(var(--primitives-color-neutral-100), var(--primitives-color-neutral-200));
-		--_compact-bar-height: var(--primitives-space-6);
-		--_progress-color: var(--semantics-content-accent-color);
-		--_item-gap: var(--primitives-space-4);
-		--_marker-size: var(--primitives-space-24);
-		--_track-thickness: var(--primitives-space-2);
-		--_marker-z-index: 1;
-		--_marker-corner-radius: var(--primitives-corner-radius-full);
-		--_ring-thickness: var(--semantics-surfaces-ring-thickness);
-		--_ring-color: var(--context-parent-background-color, var(--semantics-surfaces-base-background-color));
-		--_marker-content-color: var(--semantics-content-secondary-color);
-		--_progress-content-color: var(--semantics-content-contrast-color);
-		--_current-fill-color: light-dark(var(--primitives-color-accent-75), var(--primitives-color-accent-100));
-		--_icon-size: var(--primitives-space-16);
-		--_title-color: var(--semantics-content-secondary-color);
-		--_current-title-color: var(--semantics-content-color);
-		--_control-corner-radius: var(--semantics-controls-md-corner-radius);
-		--_control-bleed-block: var(--primitives-space-4);
-		--_control-bleed-inline: var(--primitives-space-8);
-		--_control-fill-z-index: -1;
-		--_control-ring-z-index: 1;
-		--_control-hover-background-color: light-dark(var(--primitives-color-neutral-50), var(--primitives-color-neutral-150));
-
-		${inheritedTextReset}
-		isolation: isolate;
-		display: block;
-		container-type: inline-size;
-	}
-
-	:host([hidden]) {
-		display: none;
-	}
-
-	.step-indicator__items {
-		display: flex;
-		align-items: start;
-
-		/* Stays in the DOM for assistive tech when the compact view takes over.
-		   Standard visually-hidden recipe. */
-		@container (max-width: ${smMax}) {
-			position: absolute;
-			width: 1px;
-			height: 1px;
-			overflow: hidden;
-			clip-path: inset(50%);
-			white-space: nowrap;
-		}
-	}
-
-	.step-indicator__compact-text {
-		display: none;
-		margin: 0;
-		gap: var(--_compact-text-gap);
-		justify-content: space-between;
-		align-items: baseline;
-		color: var(--_compact-text-color);
-		font: var(--primitives-font-body-md-regular-flat);
-
-		@container (max-width: ${smMax}) {
-			display: flex;
-		}
-	}
-
-	.step-indicator__compact-count {
-		color: var(--_compact-count-color);
-		font-variant-numeric: tabular-nums;
-		white-space: nowrap;
-	}
-
-	.step-indicator__compact-bar {
-		display: none;
-		margin-top: var(--_compact-bar-gap);
-		gap: var(--_compact-bar-segment-gap);
-
-		@container (max-width: ${smMax}) {
-			display: flex;
-		}
-	}
-
-	.step-indicator__compact-bar-segment {
-		flex: 1;
-		border-radius: var(--_compact-bar-corner-radius);
-		background-color: var(--_track-color);
-		height: var(--_compact-bar-height);
-	}
-
-	.step-indicator__compact-bar-segment[data-filled] {
-		background-color: var(--_progress-color);
-	}
-`;
-export const stepIndicatorItemStyles = css `
-	:host {
-		box-sizing: border-box;
-	}
-
-	:host {
-		${inheritedTextReset}
-		display: block;
-		flex: 1;
-		min-width: 0;
-	}
-
-	:host([hidden]) {
-		display: none;
-	}
-
-	.step-indicator__item {
-		position: relative;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		gap: var(--_item-gap);
-		text-align: center;
-	}
-
-	.step-indicator__item::before,
-	.step-indicator__item::after {
-		position: absolute;
-		top: calc(var(--_marker-size) / 2 - var(--_track-thickness) / 2);
-		height: var(--_track-thickness);
-		content: "";
-		background-color: var(--_track-color);
-	}
-
-	.step-indicator__item::before {
-		left: 0;
-		right: 50%;
-	}
-
-	.step-indicator__item::after {
-		left: 50%;
-		right: 0;
-	}
-
-	:host(:first-of-type) .step-indicator__item::before {
-		content: none;
-	}
-
-	:host(:last-of-type) .step-indicator__item::after {
-		content: none;
-	}
-
-	.step-indicator__item.is-past::before {
-		background-color: var(--_progress-color);
-	}
-
-	.step-indicator__item.is-past::after {
-		background-color: var(--_progress-color);
-	}
-
-	.step-indicator__item.is-current::before {
-		background-color: var(--_progress-color);
-	}
-
-	.step-indicator__item-marker {
-		box-sizing: border-box;
-		position: relative;
-		z-index: var(--_marker-z-index);
-		display: flex;
-		width: var(--_marker-size);
-		height: var(--_marker-size);
-		align-items: center;
-		justify-content: center;
-		border-radius: var(--_marker-corner-radius);
-		/* Ring in the background color: masks the track running underneath, so
-		   the marker gets breathing room without shortening the track. */
-		box-shadow: 0 0 0 var(--_ring-thickness) var(--_ring-color);
-		background-color: var(--_track-color);
-		color: var(--_marker-content-color);
-		font: var(--primitives-font-body-sm-medium-flat);
-
-		@media (forced-colors: active) {
-			border: var(--primitives-border-width-regular) solid CanvasText;
-		}
-	}
-
-	.step-indicator__item.is-past .step-indicator__item-marker {
-		background-color: var(--_progress-color);
-		color: var(--_progress-content-color);
-	}
-
-	.step-indicator__item.is-current .step-indicator__item-marker {
-		border: var(--_track-thickness) solid var(--_progress-color);
-		background-color: var(--_current-fill-color);
-		color: var(--_progress-color);
-	}
-
-	.step-indicator__item-icon {
-		width: var(--_icon-size);
-		height: var(--_icon-size);
-	}
-
-	.step-indicator__item-title {
-		color: var(--_title-color);
-		font: var(--primitives-font-body-sm-regular-flat);
-		overflow-wrap: anywhere;
-	}
-
-	.step-indicator__item.is-current .step-indicator__item-title {
-		color: var(--_current-title-color);
-	}
-
-	/* Standard visually-hidden recipe. */
-	.step-indicator__item-status {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		overflow: hidden;
-		clip-path: inset(50%);
-		white-space: nowrap;
-	}
-
-	.step-indicator__item-control {
-		position: relative;
-		display: flex;
-		width: fit-content;
-		max-width: 100%;
-		flex-direction: column;
-		align-items: center;
-		gap: var(--_item-gap);
-		padding: 0;
-		border: none;
-		border-radius: var(--_control-corner-radius);
-		background: none;
-		color: inherit;
-		cursor: var(--semantics-controls-link-cursor);
-		font: inherit;
-		text-decoration: none;
-	}
-
-	/* Two layers on the same box, bleeding past the control rather than padding
-	   it: padding would move the marker down while the track sits at a fixed
-	   offset, and the two would no longer line up. ::before carries the fill and
-	   stays under the track; ::after carries the focus ring and goes over it. */
-	.step-indicator__item-control::before,
-	.step-indicator__item-control::after {
-		position: absolute;
-		inset: calc(var(--_control-bleed-block) * -1) calc(var(--_control-bleed-inline) * -1);
-		border-radius: var(--_control-corner-radius);
-		content: "";
-		pointer-events: none;
-	}
-
-	.step-indicator__item-control::before {
-		z-index: var(--_control-fill-z-index);
-	}
-
-	.step-indicator__item-control::after {
-		z-index: var(--_control-ring-z-index);
-	}
-
-	.step-indicator__item-control:focus-visible {
-		/* The ring lives on ::after, so the control's own must go — two rings on
-		   one control is what the browser default would add here. */
-		outline: none;
-	}
-
-	.step-indicator__item-control:focus-visible::after {
-		outline: var(--semantics-focus-ring-outline);
-		outline-offset: var(--semantics-focus-ring-outline-offset);
-		box-shadow: var(--semantics-focus-ring-box-shadow);
-	}
-
-	/* Hover only on hover-capable devices: keeps a touch-scroll from lighting up
-	   the step under the finger. */
-	@media (hover: hover) {
-		.step-indicator__item-control:hover {
-			/* The marker's ring masks the track in the surrounding color, so it
-			   has to follow the hover fill or it paints a halo on top of it. */
-			--_ring-color: var(--_control-hover-background-color);
-		}
-
-		.step-indicator__item-control:hover::before {
-			background-color: var(--_control-hover-background-color);
-		}
-	}
-`;
-//# sourceMappingURL=step-indicator.styles.js.map

package/dist/components/status-and-feedback/step-indicator/step-indicator.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"step-indicator.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/step-indicator/step-indicator.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAE3C,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAmClC,kBAAkB;;;;;;;;;;;;;;;;2BAgBK,KAAK;;;;;;;;;;;;;;;;;;;2BAmBL,KAAK;;;;;;;;;;;;;;;;2BAgBL,KAAK;;;;;;;;;;;;;;;CAe/B,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;;;;;IAMtC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoLrB,CAAC"}

package/dist/components/status-and-feedback/step-indicator/step-indicator.template.d.ts

@@ -1,5 +0,0 @@
-import { type TemplateResult } from 'lit';
-import type { NLDDStepIndicator, NLDDStepIndicatorItem } from './step-indicator.js';
-export declare function stepIndicatorTemplate(component: NLDDStepIndicator): TemplateResult;
-export declare function stepIndicatorItemTemplate(component: NLDDStepIndicatorItem): TemplateResult;
-//# sourceMappingURL=step-indicator.template.d.ts.map

package/dist/components/status-and-feedback/step-indicator/step-indicator.template.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"step-indicator.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/step-indicator/step-indicator.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AACzD,OAAO,KAAK,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEpF,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,iBAAiB,GAAG,cAAc,CAmClF;AAED,wBAAgB,yBAAyB,CAAC,SAAS,EAAE,qBAAqB,GAAG,cAAc,CAiC1F"}

package/dist/components/status-and-feedback/step-indicator/step-indicator.template.js

@@ -1,69 +0,0 @@
-import { html, nothing } from 'lit';
-export function stepIndicatorTemplate(component) {
-    const label = component.accessibleLabel || component._t('components.step-indicator.accessible-label');
-    const current = component.resolvedCurrent;
-    const total = component.total;
-    const currentTitle = component.currentItem?.text ?? '';
-    const compactText = component._t('components.step-indicator.compact-text', { current, total });
-    return html `
-		<nav class="step-indicator"
-			aria-label=${label || nothing}
-		>
-			<div class="step-indicator__items"
-				role="list"
-			>
-				<slot @slotchange=${component._onSlotChange}></slot>
-			</div>
-			${total > 0 ? html `
-				<p class="step-indicator__compact-text"
-					aria-hidden="true"
-				>
-					${currentTitle ? html `<span class="step-indicator__compact-title">${currentTitle}</span>` : nothing}
-					<span class="step-indicator__compact-count">${compactText}</span>
-				</p>
-				<div class="step-indicator__compact-bar"
-					aria-hidden="true"
-				>
-					${Array.from({ length: total }, (_, index) => html `
-						<span class="step-indicator__compact-bar-segment"
-							?data-filled=${index + 1 <= current}
-						></span>
-					`)}
-				</div>
-			` : nothing}
-		</nav>
-	`;
-}
-export function stepIndicatorItemTemplate(component) {
-    const status = component.resolvedStatus;
-    // A past step shows a check mark instead of its number; the number stays in
-    // the status text for anyone who can't see it.
-    const marker = component.icon
-        ? html `<nldd-icon class="step-indicator__item-icon" icon=${component.icon}></nldd-icon>`
-        : status === 'past'
-            ? html `<nldd-icon class="step-indicator__item-icon" icon="check-mark"></nldd-icon>`
-            : html `<span class="step-indicator__item-number">${component._index}</span>`;
-    const content = html `
-		<span class="step-indicator__item-marker"
-			aria-hidden="true"
-		>${marker}</span>
-		<span class="step-indicator__item-title">
-			${component.text || html `<slot></slot>`}
-			<span class="step-indicator__item-status">, ${component._statusText}</span>
-		</span>
-	`;
-    return html `
-		<div class="step-indicator__item is-${status}">
-			${component.href ? html `
-				<a class="step-indicator__item-control"
-					href=${component.href}
-				>${content}</a>
-			` : component.button ? html `
-				<button class="step-indicator__item-control"
-					type="button"
-				>${content}</button>
-			` : content}
-		</div>
-	`;
-}
-//# sourceMappingURL=step-indicator.template.js.map

package/dist/components/status-and-feedback/step-indicator/step-indicator.template.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"step-indicator.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/step-indicator/step-indicator.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAGzD,MAAM,UAAU,qBAAqB,CAAC,SAA4B;IACjE,MAAM,KAAK,GAAG,SAAS,CAAC,eAAe,IAAI,SAAS,CAAC,EAAE,CAAC,4CAA4C,CAAC,CAAC;IACtG,MAAM,OAAO,GAAG,SAAS,CAAC,eAAe,CAAC;IAC1C,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;IAC9B,MAAM,YAAY,GAAG,SAAS,CAAC,WAAW,EAAE,IAAI,IAAI,EAAE,CAAC;IACvD,MAAM,WAAW,GAAG,SAAS,CAAC,EAAE,CAAC,wCAAwC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IAE/F,OAAO,IAAI,CAAA;;gBAEI,KAAK,IAAI,OAAO;;;;;wBAKR,SAAS,CAAC,aAAa;;KAE1C,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;;;;OAId,YAAY,CAAC,CAAC,CAAC,IAAI,CAAA,+CAA+C,YAAY,SAAS,CAAC,CAAC,CAAC,OAAO;mDACrD,WAAW;;;;;OAKvD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAA;;sBAEjC,KAAK,GAAG,CAAC,IAAI,OAAO;;MAEpC,CAAC;;IAEH,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,SAAgC;IACzE,MAAM,MAAM,GAAG,SAAS,CAAC,cAAc,CAAC;IACxC,4EAA4E;IAC5E,+CAA+C;IAC/C,MAAM,MAAM,GAAG,SAAS,CAAC,IAAI;QAC5B,CAAC,CAAC,IAAI,CAAA,qDAAqD,SAAS,CAAC,IAAI,eAAe;QACxF,CAAC,CAAC,MAAM,KAAK,MAAM;YAClB,CAAC,CAAC,IAAI,CAAA,6EAA6E;YACnF,CAAC,CAAC,IAAI,CAAA,6CAA6C,SAAS,CAAC,MAAM,SAAS,CAAC;IAE/E,MAAM,OAAO,GAAG,IAAI,CAAA;;;KAGhB,MAAM;;KAEN,SAAS,CAAC,IAAI,IAAI,IAAI,CAAA,eAAe;iDACO,SAAS,CAAC,WAAW;;EAEpE,CAAC;IAEF,OAAO,IAAI,CAAA;wCAC4B,MAAM;KACzC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;;YAEd,SAAS,CAAC,IAAI;OACnB,OAAO;IACV,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA;;;OAGvB,OAAO;IACV,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC"}