@nldd/design-system 0.8.62 → 0.8.64

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

@@ -15,8 +15,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  *
  * The default indicator is a simple icon-sized circle drawn in `currentColor`,
  * with an optional label below (hidden unless `show-text` is set). Drop a
- * `<nldd-progress-circle>`, `<nldd-progress-bar>` or any element in the slot
- * to override it.
+ * `<nldd-progress-circle>`, `<nldd-progress-bar>` or any element in the
+ * `indicator` slot to override it.
+ *
+ * Overlay mode: put content in the default slot and the indicator wraps it — it
+ * becomes a `position: relative` container, renders the spinner over a dimming
+ * backdrop (opt out with `no-backdrop`), and makes the content `inert` so its
+ * controls can't be focused or clicked. Toggle loading with `complete`
+ * (`?complete=${!isLoading}`). With no slotted content it stays the standalone
+ * placeholder described above.
  *
  * Reconnect behaviour: every `connectedCallback` resets the timer and hides
  * the indicator again. If a consumer toggles the element via a conditional
@@ -37,12 +44,18 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  * @attr {string} text - Label text. Falls back to the translated "Laden" when unset.
  * @attr {'default'|'instant'} timing - 'default' waits 1000ms before showing (anti-flash); 'instant' shows immediately (the fade-in still plays). Default 'default'.
  * @attr {boolean} complete - Mark the loader as finished while keeping the element mounted; clears aria-busy and hides the indicator.
- * @attr {boolean} backdrop - Dim and blur the content underneath with a frosted backdrop while loading (opt-in, default false). Uses the context parent background colour (fallback: base surface) at one minus the disabled opacity, plus a backdrop blur.
+ * @attr {boolean} no-backdrop - Overlay mode dims and blurs the wrapped content with a frosted backdrop by default; set this to show only the indicator panel without dimming. No effect in standalone mode.
  * @attr {object} translations - Override translation keys; unset keys fall back to Dutch
  *
- * @slot - Optional custom indicator; overrides the default circle (and its
- *   visually-hidden label). Consumers replacing the slot supply their own
- *   indicator semantics; the host's role="status" still marks the loading region.
+ * @slot - Content to wrap (overlay mode); made inert while loading. Leave empty
+ *   for the standalone placeholder.
+ * @slot indicator - Optional custom indicator; overrides the default circle (and
+ *   its visually-hidden label). Consumers replacing it supply their own indicator
+ *   semantics; the host's role="status" still marks the loading region.
+ *
+ * @migration The custom-indicator override moved from the default slot to the
+ *   `indicator` slot, since the default slot now holds wrapped content:
+ *   `<nldd-progress-bar slot="indicator">`.
  */
 import { LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
@@ -66,13 +79,25 @@ let NLDDActivityIndicator = class NLDDActivityIndicator extends LitElement {
         /** Mark the loader as finished while keeping the element mounted.
          *  Clears aria-busy and hides the indicator. Default false. */
         this.complete = false;
-        /** Dim and blur the content underneath with a frosted backdrop while
-         *  loading. The layer takes the context parent background colour (fallback:
-         *  base surface) at one minus the disabled opacity, plus a backdrop blur.
-         *  Opt-in; default false. */
-        this.backdrop = false;
+        /** Opt out of the dimming backdrop in overlay mode. With wrapped content the
+         *  backdrop is on by default — the content is inert, so it should read as
+         *  inactive — so set `no-backdrop` to show only the indicator panel without
+         *  dimming/blurring the content. No effect in standalone mode (no content to
+         *  dim). */
+        this.noBackdrop = false;
         this.translations = {};
         this._visible = false;
+        /** Whether the default slot holds wrapped content (overlay mode) instead of
+         *  being empty (standalone placeholder). Drives the host layout and whether
+         *  the content is made inert while loading. */
+        this._hasContent = false;
+        /** Track default-slot content so the component can switch between the
+         *  standalone placeholder and the content-wrapping overlay, and disable the
+         *  wrapped content (via `inert`) while loading. */
+        this._onContentSlotChange = (e) => {
+            const slot = e.target;
+            this._hasContent = slot.assignedElements().length > 0;
+        };
     }
     _t(key) {
         return this.translations[key] ?? nlddActivityIndicatorTranslations[key];
@@ -136,6 +161,13 @@ let NLDDActivityIndicator = class NLDDActivityIndicator extends LitElement {
             this.setAttribute('role', 'status');
         }
     }
+    updated() {
+        // Reflect derived state as host attributes the styles key off: `loading`
+        // drives the indicator + backdrop fade (in AND out); `has-content` switches
+        // between the standalone placeholder and the content-wrapping overlay.
+        this.toggleAttribute('loading', this._visible && !this.complete);
+        this.toggleAttribute('has-content', this._hasContent);
+    }
     render() {
         return activityIndicatorTemplate(this);
     }
@@ -157,14 +189,17 @@ __decorate([
     property({ type: Boolean, reflect: true })
 ], NLDDActivityIndicator.prototype, "complete", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true })
-], NLDDActivityIndicator.prototype, "backdrop", void 0);
+    property({ type: Boolean, reflect: true, attribute: 'no-backdrop' })
+], NLDDActivityIndicator.prototype, "noBackdrop", void 0);
 __decorate([
     property({ type: Object })
 ], NLDDActivityIndicator.prototype, "translations", void 0);
 __decorate([
     state()
 ], NLDDActivityIndicator.prototype, "_visible", void 0);
+__decorate([
+    state()
+], NLDDActivityIndicator.prototype, "_hasContent", void 0);
 NLDDActivityIndicator = __decorate([
     customElement('nldd-activity-indicator')
 ], NLDDActivityIndicator);

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

@@ -1 +1 @@
-{"version":3,"file":"activity-indicator.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAC;AACzE,OAAO,EAAE,yBAAyB,EAAE,MAAM,kCAAkC,CAAC;AAC7E,OAAO,EAAE,iCAAiC,EAAE,MAAM,8BAA8B,CAAC;AAGjF;6EAC6E;AAC7E,MAAM,QAAQ,GAAG,IAAI,CAAC;AAOf,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAA9C;;QAIN,SAAI,GAA0B,IAAI,CAAC;QAEnC;2EACmE;QAEnE,aAAQ,GAAG,KAAK,CAAC;QAGjB,SAAI,GAAG,EAAE,CAAC;QAEV;yDACiD;QAEjD,WAAM,GAA4B,SAAS,CAAC;QAE5C;uEAC+D;QAE/D,aAAQ,GAAG,KAAK,CAAC;QAEjB;;;qCAG6B;QAE7B,aAAQ,GAAG,KAAK,CAAC;QAGjB,iBAAY,GAA+C,EAAE,CAAC;QAG9D,aAAQ,GAAG,KAAK,CAAC;IA0ElB,CAAC;IAtEO,EAAE,CAAC,GAA4C;QACrD,OAAO,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,iCAAiC,CAAC,GAAG,CAAC,CAAC;IACzE,CAAC;IAED,+CAA+C;IAC/C,IAAW,eAAe;QACzB,OAAO,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,CAAC,4CAA4C,CAAC,CAAC;IAC3E,CAAC;IAEQ,iBAAiB;QACzB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,wEAAwE;QACxE,wDAAwD;QACxD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,MAAM,KAAK,SAAS,CAAC;QAC1C,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,cAAc,EAAE,CAAC;IAC7D,CAAC;IAEQ,UAAU,CAAC,OAA6B;QAChD,gEAAgE;QAChE,yDAAyD;QACzD,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YAC7B,IAAI,CAAC,SAAS,EAAE,CAAC;QAClB,CAAC;QACD,yEAAyE;QACzE,0EAA0E;QAC1E,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC3B,IAAI,CAAC,WAAW,EAAE,CAAC;YACnB,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;gBAC/B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACtB,CAAC;iBAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAC7C,IAAI,CAAC,cAAc,EAAE,CAAC;YACvB,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,oBAAoB;QAC5B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,WAAW,EAAE,CAAC;IACpB,CAAC;IAEO,WAAW;QAClB,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YACjC,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC;QAChC,CAAC;IACF,CAAC;IAEO,cAAc;QACrB,IAAI,CAAC,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE;YACpC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC;QAChC,CAAC,EAAE,QAAQ,CAAC,CAAC;IACd,CAAC;IAED;;;iEAG6D;IACrD,SAAS;QAChB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QAC9B,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QACrC,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,yBAAyB,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC;;AA3Ge,4BAAM,GAAG,uBAAuB,AAA1B,CAA2B;AAGjD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACP;AAKnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;uDAClD;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAChC;AAKV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qDACE;AAK5C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDAC1B;AAOjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DACmC;AAG9D;IADC,KAAK,EAAE;uDACS;AAnCL,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CA6GjC"}
+{"version":3,"file":"activity-indicator.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.ts"],"names":[],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"activity-indicator.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,uBAAuB,yBAgLnC,CAAC"}
+{"version":3,"file":"activity-indicator.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,uBAAuB,yBA+OnC,CAAC"}

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

@@ -1,6 +1,9 @@
 import { css } from 'lit';
-import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
+import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
 export const activityIndicatorStyles = css `
+	:host {
+		box-sizing: border-box;
+	}
 
 
 	/* # Host */
@@ -18,6 +21,8 @@ export const activityIndicatorStyles = css `
 		--_gap: var(--primitives-space-4);
 		--_text-font: var(--primitives-font-body-sm-regular-flat);
 		--_backdrop-blur: 3px;
+		--_overlay-panel-padding: var(--primitives-space-12);
+		--_overlay-panel-corner-radius: var(--primitives-corner-radius-md);
 
 		${inheritedTextReset}
 		box-sizing: border-box;
@@ -35,10 +40,13 @@ export const activityIndicatorStyles = css `
 		display: none;
 	}
 
-	/* The opt-in backdrop is an absolutely-positioned layer that fills the host,
-	   so the host has to be its containing block. */
-	:host([backdrop]) {
+	/* Overlay mode (content in the default slot): the host wraps the content and
+	   is the containing block for the absolutely-positioned indicator + backdrop,
+	   so it sizes to the content instead of filling its parent. */
+	:host([has-content]) {
+		display: block;
 		position: relative;
+		height: auto;
 	}
 
 
@@ -59,35 +67,75 @@ export const activityIndicatorStyles = css `
 
 
 	/* # Block
-	   Fades the indicator in once it becomes visible (both timing modes), and
-	   stacks the default circle + label as a centred column. width:100% +
+	   Stacks the default circle + label as a centred column. width:100% +
 	   max-width gives a slotted progress-bar a width to fill; the fixed-size
 	   circle and the label stay centred via align-items. */
 
 	.activity-indicator {
 		/* position:relative so it paints above the absolutely-positioned backdrop
-		   (both are z-index:auto; the backdrop comes first in the DOM). */
+		   (both are z-index:auto; the backdrop comes first in the DOM). Hidden by
+		   default; the loading host attribute fades it (and the backdrop) in and
+		   out — opacity + display via transition-behavior: allow-discrete, with a
+		   starting-style for the entry. */
 		position: relative;
-		display: flex;
-		flex-direction: column;
+		display: none;
+		opacity: 0;
+		pointer-events: none;
 		width: 100%;
 		max-width: var(--_max-width);
+		flex-direction: column;
 		align-items: center;
 		gap: var(--_gap);
-		animation: activity-indicator-fade-in var(--_fade-duration) var(--_fade-easing);
+		transition-property: opacity, display;
+		transition-duration: var(--_fade-duration);
+		transition-timing-function: var(--_fade-easing);
+		transition-behavior: allow-discrete;
+	}
+
+	:host([loading]) .activity-indicator {
+		display: flex;
+		opacity: 1;
+	}
+
+	@starting-style {
+		:host([loading]) .activity-indicator {
+			opacity: 0;
+		}
 	}
 
-	@keyframes activity-indicator-fade-in {
-		from { opacity: 0; }
+	/* Overlay mode: the wrapped content flows normally; the indicator + backdrop
+	   sit on top as absolute layers that fill the host. */
+	.activity-indicator__content {
+		display: block;
 	}
 
-	/* Opt-in dimming layer (the backdrop attribute): the context parent
-	   background colour — fallback the base surface — at one minus the disabled
-	   opacity, so the content underneath reads as inactive while loading. Fades
-	   in with the indicator. */
+	/* Overlay mode: the indicator + label sit on a small rounded base-surface
+	   panel that hugs them with padding (not the full component width) so they
+	   keep contrast over the dimmed content, and read in the content colour
+	   instead of inheriting currentColor. */
+	:host([has-content]) .activity-indicator {
+		box-sizing: border-box;
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		border-radius: var(--_overlay-panel-corner-radius);
+		background-color: var(--semantics-surfaces-base-background-color);
+		width: max-content;
+		max-width: calc(100% - var(--primitives-space-32));
+		padding: var(--_overlay-panel-padding);
+		color: var(--semantics-content-color);
+		transform: translate(-50%, -50%);
+	}
+
+	/* Dimming layer (overlay mode, on by default; opt out with no-backdrop): the
+	   context parent background colour — fallback the base surface — at one minus
+	   the disabled opacity, so the content underneath reads as inactive while
+	   loading. Fades in and out with the indicator via the loading attribute. */
 	.activity-indicator__backdrop {
 		position: absolute;
 		inset: 0;
+		display: none;
+		opacity: 0;
 		/* Frosted dim: the parent surface — fallback base surface — as a
 		   translucent fill at one minus the disabled opacity (a translucent
 		   colour, not element opacity, which would hide the blur), plus a blur so
@@ -96,7 +144,22 @@ export const activityIndicatorStyles = css `
 		background-color: color-mix(in oklab, var(--context-parent-background-color, var(--semantics-surfaces-base-background-color)) calc((1 - var(--primitives-opacity-disabled)) * 100%), transparent);
 		-webkit-backdrop-filter: blur(var(--_backdrop-blur));
 		backdrop-filter: blur(var(--_backdrop-blur));
-		animation: activity-indicator-fade-in var(--_fade-duration) var(--_fade-easing);
+		pointer-events: none;
+		transition-property: opacity, display;
+		transition-duration: var(--_fade-duration);
+		transition-timing-function: var(--_fade-easing);
+		transition-behavior: allow-discrete;
+	}
+
+	:host([loading]) .activity-indicator__backdrop {
+		display: block;
+		opacity: 1;
+	}
+
+	@starting-style {
+		:host([loading]) .activity-indicator__backdrop {
+			opacity: 0;
+		}
 	}
 
 	/* display:contents so the default circle + label (or a slotted override)
@@ -162,7 +225,7 @@ export const activityIndicatorStyles = css `
 	@media (prefers-reduced-motion: reduce) {
 		.activity-indicator,
 		.activity-indicator__backdrop {
-			animation: none;
+			transition: none;
 		}
 
 		.activity-indicator__indicator {

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

@@ -1 +1 @@
-{"version":3,"file":"activity-indicator.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;IAmBtC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6JrB,CAAC"}
+{"version":3,"file":"activity-indicator.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;IAwBtC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuNrB,CAAC"}

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

@@ -1,4 +1,3 @@
-import { nothing } from 'lit';
 import type { NLDDActivityIndicator } from './activity-indicator.js';
-export declare function activityIndicatorTemplate(component: NLDDActivityIndicator): import("lit-html").TemplateResult<1> | typeof nothing;
+export declare function activityIndicatorTemplate(component: NLDDActivityIndicator): import("lit-html").TemplateResult<1>;
 //# sourceMappingURL=activity-indicator.template.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"activity-indicator.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,OAAO,EAAE,MAAM,KAAK,CAAC;AAEpC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAErE,wBAAgB,yBAAyB,CAAC,SAAS,EAAE,qBAAqB,yDAqCzE"}
+{"version":3,"file":"activity-indicator.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.template.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAErE,wBAAgB,yBAAyB,CAAC,SAAS,EAAE,qBAAqB,wCAoDzE"}

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

@@ -1,18 +1,32 @@
 import { html, nothing } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 export function activityIndicatorTemplate(component) {
-    // Render nothing while the delay window is open so the indicator doesn't
-    // even flash for sub-second loads, or once `complete` is set so the
-    // element stays mounted but ARIA / visuals reflect the finished state.
-    if (!component._visible || component.complete)
-        return nothing;
+    // Disable + busy-mark the wrapped content while loading (overlay mode). `inert`
+    // works over the flat tree, so it reaches the slotted (light-DOM) content and
+    // takes its controls out of the tab order — which pointer-events alone can't.
+    // (aria-busy below reflects the busy state explicitly as true/false rather than
+    // toggling the attribute, which some AT track more reliably; note that inert also
+    // removes the subtree from the a11y tree, so AT relies on the role="status" host,
+    // not this aria-busy, for the loading announcement.)
+    const disableContent = component._visible && !component.complete && component._hasContent;
+    // The backdrop dims the inert content in overlay mode (unless opted out). It
+    // renders for the whole overlay-mode lifetime; the `loading` host attribute —
+    // not conditional rendering — drives its (and the indicator's) fade in AND
+    // out, so the overlay can also transition away when loading finishes.
+    const renderBackdrop = component._hasContent && !component.noBackdrop;
     // The label always renders so it is the announced content of the
     // role="status" host; show-text only controls whether it is visible.
     const text = component._accessibleName;
     return html `
-		${component.backdrop ? html `<div class="activity-indicator__backdrop" aria-hidden="true"></div>` : nothing}
+		<div class="activity-indicator__content"
+			?inert=${disableContent}
+			aria-busy=${disableContent ? 'true' : 'false'}
+		>
+			<slot @slotchange=${component._onContentSlotChange}></slot>
+		</div>
+		${renderBackdrop ? html `<div class="activity-indicator__backdrop" aria-hidden="true"></div>` : nothing}
 		<div class="activity-indicator">
-			<slot>
+			<slot name="indicator">
 				<svg class="activity-indicator__circle"
 					viewBox="0 0 24 24"
 					fill="none"

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

@@ -1 +1 @@
-{"version":3,"file":"activity-indicator.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAGvD,MAAM,UAAU,yBAAyB,CAAC,SAAgC;IACzE,yEAAyE;IACzE,oEAAoE;IACpE,uEAAuE;IACvE,IAAI,CAAC,SAAS,CAAC,QAAQ,IAAI,SAAS,CAAC,QAAQ;QAAE,OAAO,OAAO,CAAC;IAC9D,iEAAiE;IACjE,qEAAqE;IACrE,MAAM,IAAI,GAAG,SAAS,CAAC,eAAe,CAAC;IACvC,OAAO,IAAI,CAAA;IACR,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,qEAAqE,CAAC,CAAC,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;kBAqB1F,QAAQ,CAAC;QACvB,0BAA0B,EAAE,IAAI;QAChC,2CAA2C,EAAE,CAAC,SAAS,CAAC,QAAQ;KAChE,CAAC,IAAI,IAAI;;;EAGX,CAAC;AACH,CAAC"}
+{"version":3,"file":"activity-indicator.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/activity-indicator/activity-indicator.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAGvD,MAAM,UAAU,yBAAyB,CAAC,SAAgC;IACzE,gFAAgF;IAChF,8EAA8E;IAC9E,8EAA8E;IAC9E,gFAAgF;IAChF,kFAAkF;IAClF,kFAAkF;IAClF,qDAAqD;IACrD,MAAM,cAAc,GAAG,SAAS,CAAC,QAAQ,IAAI,CAAC,SAAS,CAAC,QAAQ,IAAI,SAAS,CAAC,WAAW,CAAC;IAC1F,6EAA6E;IAC7E,8EAA8E;IAC9E,2EAA2E;IAC3E,sEAAsE;IACtE,MAAM,cAAc,GAAG,SAAS,CAAC,WAAW,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC;IACtE,iEAAiE;IACjE,qEAAqE;IACrE,MAAM,IAAI,GAAG,SAAS,CAAC,eAAe,CAAC;IACvC,OAAO,IAAI,CAAA;;YAEA,cAAc;eACX,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;uBAEzB,SAAS,CAAC,oBAAoB;;IAEjD,cAAc,CAAC,CAAC,CAAC,IAAI,CAAA,qEAAqE,CAAC,CAAC,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;kBAqBtF,QAAQ,CAAC;QACvB,0BAA0B,EAAE,IAAI;QAChC,2CAA2C,EAAE,CAAC,SAAS,CAAC,QAAQ;KAChE,CAAC,IAAI,IAAI;;;EAGX,CAAC;AACH,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,yBAgPvB,CAAC"}
+{"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,yBAmPvB,CAAC"}

package/dist/components/status-and-feedback/badge/badge.styles.js

@@ -1,6 +1,9 @@
 import { css } from 'lit';
-import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
+import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
 export const badgeStyles = css `
+	:host {
+		box-sizing: border-box;
+	}
 
 
 	/* # Host */

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

@@ -1 +1 @@
-{"version":3,"file":"badge.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;IAkB1B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8NrB,CAAC"}
+{"version":3,"file":"badge.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;IAqB1B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8NrB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"banner.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/banner/banner.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,yBAgJxB,CAAC"}
+{"version":3,"file":"banner.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/banner/banner.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,yBAmJxB,CAAC"}

package/dist/components/status-and-feedback/banner/banner.styles.js

@@ -1,6 +1,9 @@
 import { css } from 'lit';
-import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
+import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
 export const bannerStyles = css `
+	:host {
+		box-sizing: border-box;
+	}
 
 
 	/* # Host */

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

@@ -1 +1 @@
-{"version":3,"file":"banner.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/banner/banner.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;IAoB3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4HrB,CAAC"}
+{"version":3,"file":"banner.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/banner/banner.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;IAuB3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4HrB,CAAC"}

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inline-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,4BAA4B,CAAC;AACpC,OAAO,4CAA4C,CAAC;AAEpD,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,SAAS,CAAC;AACtD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAC;AAC3C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AAEhG,qBACa,gBAAiB,SAAQ,UAAU;IAC/C,OAAgB,MAAM,0BAAsB;IAG5C,OAAO,EAAE,mBAAmB,GAAG,EAAE,CAAM;IAGvC,IAAI,EAAE,gBAAgB,CAAQ;IAG9B,IAAI,SAAM;IAGV,SAAS,EAAE,qBAAqB,GAAG,EAAE,CAAM;IAG3C,IAAI,SAAM;IAGV,cAAc,SAAM;IAGpB,YAAY,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAQ;IAGlD,WAAW,UAAS;IAGpB,WAAW,UAAS;IAEpB,IAAI,iBAAiB,IAAI,MAAM,CAK9B;IAEQ,YAAY;IAsBZ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,oBAAoB,EAAE,gBAAgB,CAAC;KACvC;CACD"}
+{"version":3,"file":"inline-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,4BAA4B,CAAC;AACpC,OAAO,4CAA4C,CAAC;AAEpD,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,SAAS,CAAC;AACtD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAC;AAC3C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AAEhG,qBACa,gBAAiB,SAAQ,UAAU;IAC/C,OAAgB,MAAM,0BAAsB;IAG5C,OAAO,EAAE,mBAAmB,GAAG,EAAE,CAAM;IAGvC,IAAI,EAAE,gBAAgB,CAAQ;IAG9B,IAAI,SAAM;IAGV,SAAS,EAAE,qBAAqB,GAAG,EAAE,CAAM;IAG3C,IAAI,SAAM;IAGV,cAAc,SAAM;IAGpB,YAAY,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAQ;IAGlD,WAAW,UAAS;IAGpB,WAAW,UAAS;IAEpB,IAAI,iBAAiB,IAAI,MAAM,CAK9B;IAEQ,YAAY;IAgCZ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,oBAAoB,EAAE,gBAAgB,CAAC;KACvC;CACD"}

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js

@@ -67,8 +67,18 @@ let NLDDInlineDialog = class NLDDInlineDialog extends LitElement {
         const syncActions = () => { this._hasActions = hasMeaningfulContent(actionsSlot); };
         contentSlot?.addEventListener('slotchange', syncContent);
         actionsSlot?.addEventListener('slotchange', syncActions);
-        syncContent();
-        syncActions();
+        // Defer the initial sync out of the update lifecycle: setting reactive
+        // state synchronously here re-enters the current update and triggers Lit's
+        // change-in-update warning. A microtask runs after this update completes,
+        // so the follow-up render (when a slot has content) is scheduled cleanly.
+        // slotchange handles every later change; this covers the initial state.
+        // SSR caveat (no SSR today): on hydration the first paint can land before this
+        // microtask drains, briefly showing the empty-slot state. If SSR is adopted,
+        // move this into willUpdate (or a second requestUpdate in firstUpdated).
+        queueMicrotask(() => {
+            syncContent();
+            syncActions();
+        });
     }
     render() {
         return inlineDialogTemplate(this);

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js.map

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

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inline-dialog.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,yBA2H9B,CAAC"}
+{"version":3,"file":"inline-dialog.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,yBA8H9B,CAAC"}

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js

@@ -1,6 +1,9 @@
 import { css } from 'lit';
-import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
+import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
 export const inlineDialogStyles = css `
+	:host {
+		box-sizing: border-box;
+	}
 
 
 	/* # Host */

package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"inline-dialog.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAA;;;;;;;;;;;IAWjC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgHrB,CAAC"}
+{"version":3,"file":"inline-dialog.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/inline-dialog/inline-dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;IAcjC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgHrB,CAAC"}

package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.d.ts

@@ -0,0 +1,124 @@
+/**
+ * Nederlandse Digitale Dienst Just in Time Education Component (Lit + TypeScript)
+ *
+ * Een guided-discovery coach-mark. Plaats een control (bijv. nldd-search-field)
+ * in de default slot; zolang `active` is gezet tilt het component een callout
+ * (titel + supporting text + dismiss) in de top layer via de Popover API
+ * (`popover="manual"`), geankerd aan het control met Floating UI. Geen backdrop,
+ * non-modaal: de achtergrond blijft interactief. Het control zelf blijft op zijn
+ * plek in de flow staan.
+ *
+ * Met `dismissable` beheert het component het sluiten en vuurt het nldd-close:
+ *  - de gebruiker voert de geadviseerde interactie uit op het control -> close{completed}
+ *  - de dismiss-knop -> close{dismissed}
+ *  - een klik/toets BUITEN de coach-mark -> close{ignored}
+ * Zonder `dismissable` sluit niets vanzelf (geen knop, geen buiten- of slot-klik);
+ * dan bepaalt de consumer het sluiten zelf via `active` of `complete()`. `complete()`
+ * werkt altijd en sluit met close{completed} (bijv. pas bij een echte zoekopdracht).
+ *
+ * @element nldd-just-in-time-education
+ * @attr {boolean} active          - Toon de coach-mark. App-gestuurd; standaard false.
+ * @attr {string}  text            - Titel van de callout.
+ * @attr {string}  supporting-text - Ondersteunende tekst onder de titel.
+ * @attr {string}  placement       - 'auto' | 'top' | 'bottom' | 'left' | 'right' (standaard 'auto').
+ * @attr {boolean} dismissable     - Toon de dismiss-knop en sta sluiten toe via 1 klik/toets buiten de coach-mark. Standaard false: dan beheert de consumer het sluiten zelf.
+ * @attr {string}  arrow-length    - Pijllengte en dus de afstand tussen card en control, als CSS-lengte (bijv. \`333px\`, \`30vh\`). Leeg = DS-standaard; onder 40px wordt geklemd.
+ * @attr {boolean} no-arrow        - Verberg de pijl; de card staat dan dicht tegen het control.
+ *
+ * @slot - Het control waar de coach-mark naar wijst (blijft in de normale flow).
+ *
+ * @fires nldd-close - Wanneer de coach-mark sluit. detail: { reason: 'completed' | 'dismissed' | 'ignored' }.
+ *
+ * @note Rendert via de native Popover API (`popover="manual"`) in de top layer,
+ * dus het escapet ancestor stacking contexts en `overflow: hidden` clipping.
+ * Positionering via Floating UI met `position: absolute` (default strategy) +
+ * `autoUpdate`: de callout staat in de documentstroom en scrollt native mee met
+ * de pagina, dus scrollen vraagt geen herpositionering. De kant wordt bepaald uit
+ * de beschikbare ruimte (horizontaal de viewport, verticaal het hele document)
+ * bij openen en bij window-resize.
+ *
+ * @note Focus-model (dismissable): de callout is een bewust NIET-modale dialog
+ * (`role="dialog"`, geen `aria-modal`, geen focus-trap). Bij openen gaat focus
+ * erin zodat de dismiss-knop bereikbaar is en Escape sluit; Tab verlaat de callout
+ * daarna expres naar de pagina, want de coach-mark wijst naar een control dat de
+ * gebruiker moet kunnen bereiken, dus focus vasthouden zou het doel ondermijnen.
+ * Niet-dismissable gebruikt een benoemde `role="region"` (aria-label = de titel) en
+ * verplaatst focus nooit; de polite live region kondigt de tip aan.
+ */
+import { LitElement } from 'lit';
+import type { PropertyValues } from 'lit';
+import '../../actions/icon-button/icon-button.js';
+type Placement = 'auto' | 'top' | 'bottom' | 'left' | 'right';
+export type JustInTimeEducationCloseReason = 'completed' | 'dismissed' | 'ignored';
+declare const NLDDJustInTimeEducation_base: (abstract new (...args: any[]) => LitElement & {
+    translations: Partial<{
+        'components.just-in-time-education.accessible-label': string;
+        'components.just-in-time-education.dismiss-action': string;
+    }>;
+    _t(key: "components.just-in-time-education.accessible-label" | "components.just-in-time-education.dismiss-action", vars?: Record<string, string | number>): string;
+}) & typeof LitElement;
+export declare class NLDDJustInTimeEducation extends NLDDJustInTimeEducation_base {
+    static styles: import("lit").CSSResult;
+    private static readonly _ownAttributes;
+    active: boolean;
+    text: string;
+    supportingText: string;
+    placement: Placement;
+    dismissable: boolean;
+    arrowLength: string;
+    noArrow: boolean;
+    private _cleanupAutoUpdate;
+    private _attachTimeout;
+    private _attributeObserver;
+    private _boundDocumentInteraction;
+    private _resolvedSide;
+    private _lastViewportWidth;
+    private _lastViewportHeight;
+    readonly _arrowMarkerId: string;
+    updated(changed: PropertyValues): void;
+    private get _containerEl();
+    private get _cardEl();
+    private get _announcerEl();
+    private _getControl;
+    private _getControls;
+    /** Mirror one host attribute onto the slotted control(s) — or remove it —
+     *  unless the component owns that attribute. */
+    private _forwardAttribute;
+    /** Forward every non-owned host attribute to the slotted control(s); run on
+     *  slotchange so a freshly slotted control catches up with what's already set. */
+    _handleSlotChange(): void;
+    private _open;
+    private _closePopover;
+    private _startPositioning;
+    private _stopPositioning;
+    private _updatePosition;
+    private _chooseSide;
+    private _updateArrow;
+    /** Route 1: the advised interaction on the slotted control (only when
+     *  dismissable; otherwise the consumer drives completion via complete()).
+     *  A mouse click fires pointerdown then focusin, both landing here; the
+     *  !this.active guard makes the second call a no-op so 'completed' fires once. */
+    _handleAdvisedInteraction(): void;
+    /** Route 2: a click/keystroke outside the coach-mark (only when dismissable). */
+    private _handleDocumentInteraction;
+    /** Route 3: the dismiss button. */
+    _handleDismiss(): void;
+    /** Escape while focus is inside the callout dismisses it (the ARIA non-modal
+     *  dialog expectation). The document capture listener (route 2) treats inside
+     *  events as not-outside and bails, so Escape is handled here. stopPropagation
+     *  keeps it from also closing an ancestor (e.g. a modal the coach-mark sits in). */
+    _handleCalloutKeydown(e: KeyboardEvent): void;
+    /** Programmatically mark the advised interaction as done (success close). */
+    complete(): void;
+    private _close;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'nldd-just-in-time-education': NLDDJustInTimeEducation;
+    }
+}
+export {};
+//# sourceMappingURL=just-in-time-education.d.ts.map

package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"just-in-time-education.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/just-in-time-education/just-in-time-education.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAQ1C,OAAO,0CAA0C,CAAC;AAElD,KAAK,SAAS,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAC9D,MAAM,MAAM,8BAA8B,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAC;;;;;;;;AAInF,qBACa,uBAAwB,SAAQ,4BAAsG;IAClJ,OAAgB,MAAM,0BAA6B;IAOnD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAGnC;IAGH,MAAM,UAAS;IAGf,IAAI,SAAM;IAGV,cAAc,SAAM;IAGpB,SAAS,EAAE,SAAS,CAAU;IAG9B,WAAW,UAAS;IAGpB,WAAW,SAAM;IAGjB,OAAO,UAAS;IAEhB,OAAO,CAAC,kBAAkB,CAA6B;IACvD,OAAO,CAAC,cAAc,CAA8C;IACpE,OAAO,CAAC,kBAAkB,CAAiC;IAC3D,OAAO,CAAC,yBAAyB,CAAoD;IACrF,OAAO,CAAC,aAAa,CAAoD;IACzE,OAAO,CAAC,kBAAkB,CAAK;IAC/B,OAAO,CAAC,mBAAmB,CAAK;IAChC,QAAQ,CAAC,cAAc,SAAsC;IAEpD,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IA2B/C,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,KAAK,OAAO,GAElB;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,YAAY;IAKpB;oDACgD;IAChD,OAAO,CAAC,iBAAiB;IAUzB;sFACkF;IAClF,iBAAiB,IAAI,IAAI;IAIzB,OAAO,CAAC,KAAK;IA8Bb,OAAO,CAAC,aAAa;IAoBrB,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,gBAAgB;YAMV,eAAe;IAwF7B,OAAO,CAAC,WAAW;IAoBnB,OAAO,CAAC,YAAY;IAiFpB;;;sFAGkF;IAClF,yBAAyB,IAAI,IAAI;IAKjC,iFAAiF;IACjF,OAAO,CAAC,0BAA0B;IASlC,mCAAmC;IACnC,cAAc,IAAI,IAAI;IAItB;;;wFAGoF;IACpF,qBAAqB,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAM7C,6EAA6E;IAC7E,QAAQ,IAAI,IAAI;IAIhB,OAAO,CAAC,MAAM;IASL,iBAAiB,IAAI,IAAI;IAezB,oBAAoB,IAAI,IAAI;IAM5B,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,6BAA6B,EAAE,uBAAuB,CAAC;KACvD;CACD"}

package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.d.ts

@@ -0,0 +1,6 @@
+export declare const nlddJustInTimeEducationTranslations: {
+    'components.just-in-time-education.accessible-label': string;
+    'components.just-in-time-education.dismiss-action': string;
+};
+export type NLDDJustInTimeEducationTranslations = typeof nlddJustInTimeEducationTranslations;
+//# sourceMappingURL=just-in-time-education.i18n.d.ts.map

package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"just-in-time-education.i18n.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mCAAmC;;;CAG/C,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG,OAAO,mCAAmC,CAAC"}