@nldd/design-system 0.8.79 → 0.8.82

package/dist/components/shell-C61GCsJA.js

@@ -0,0 +1,223 @@
+//#region node_modules/@codemirror/legacy-modes/mode/shell.js
+var words = {};
+function define(style, dict) {
+	for (var i = 0; i < dict.length; i++) words[dict[i]] = style;
+}
+var commonAtoms = ["true", "false"];
+var commonKeywords = [
+	"if",
+	"then",
+	"do",
+	"else",
+	"elif",
+	"while",
+	"until",
+	"for",
+	"in",
+	"esac",
+	"fi",
+	"fin",
+	"fil",
+	"done",
+	"exit",
+	"set",
+	"unset",
+	"export",
+	"function"
+];
+var commonCommands = [
+	"ab",
+	"awk",
+	"bash",
+	"beep",
+	"cat",
+	"cc",
+	"cd",
+	"chown",
+	"chmod",
+	"chroot",
+	"clear",
+	"cp",
+	"curl",
+	"cut",
+	"diff",
+	"echo",
+	"find",
+	"gawk",
+	"gcc",
+	"get",
+	"git",
+	"grep",
+	"hg",
+	"kill",
+	"killall",
+	"ln",
+	"ls",
+	"make",
+	"mkdir",
+	"openssl",
+	"mv",
+	"nc",
+	"nl",
+	"node",
+	"npm",
+	"ping",
+	"ps",
+	"restart",
+	"rm",
+	"rmdir",
+	"sed",
+	"service",
+	"sh",
+	"shopt",
+	"shred",
+	"source",
+	"sort",
+	"sleep",
+	"ssh",
+	"start",
+	"stop",
+	"su",
+	"sudo",
+	"svn",
+	"tee",
+	"telnet",
+	"top",
+	"touch",
+	"vi",
+	"vim",
+	"wall",
+	"wc",
+	"wget",
+	"who",
+	"write",
+	"yes",
+	"zsh"
+];
+define("atom", commonAtoms);
+define("keyword", commonKeywords);
+define("builtin", commonCommands);
+function tokenBase(stream, state) {
+	if (stream.eatSpace()) return null;
+	var sol = stream.sol();
+	var ch = stream.next();
+	if (ch === "\\") {
+		stream.next();
+		return null;
+	}
+	if (ch === "'" || ch === "\"" || ch === "`") {
+		state.tokens.unshift(tokenString(ch, ch === "`" ? "quote" : "string"));
+		return tokenize(stream, state);
+	}
+	if (ch === "#") {
+		if (sol && stream.eat("!")) {
+			stream.skipToEnd();
+			return "meta";
+		}
+		stream.skipToEnd();
+		return "comment";
+	}
+	if (ch === "$") {
+		state.tokens.unshift(tokenDollar);
+		return tokenize(stream, state);
+	}
+	if (ch === "+" || ch === "=") return "operator";
+	if (ch === "-") {
+		stream.eat("-");
+		stream.eatWhile(/\w/);
+		return "attribute";
+	}
+	if (ch == "<") {
+		if (stream.match("<<")) return "operator";
+		var heredoc = stream.match(/^<-?\s*(?:['"]([^'"]*)['"]|([^'"\s]*))/);
+		if (heredoc) {
+			state.tokens.unshift(tokenHeredoc(heredoc[1] || heredoc[2]));
+			return "string.special";
+		}
+	}
+	if (/\d/.test(ch)) {
+		stream.eatWhile(/\d/);
+		if (stream.eol() || !/\w/.test(stream.peek())) return "number";
+	}
+	stream.eatWhile(/[\w-]/);
+	var cur = stream.current();
+	if (stream.peek() === "=" && /\w+/.test(cur)) return "def";
+	return words.hasOwnProperty(cur) ? words[cur] : null;
+}
+function tokenString(quote, style) {
+	var close = quote == "(" ? ")" : quote == "{" ? "}" : quote;
+	return function(stream, state) {
+		var next, escaped = false;
+		while ((next = stream.next()) != null) {
+			if (next === close && !escaped) {
+				state.tokens.shift();
+				break;
+			} else if (next === "$" && !escaped && quote !== "'" && stream.peek() != close) {
+				escaped = true;
+				stream.backUp(1);
+				state.tokens.unshift(tokenDollar);
+				break;
+			} else if (!escaped && quote !== close && next === quote) {
+				state.tokens.unshift(tokenString(quote, style));
+				return tokenize(stream, state);
+			} else if (!escaped && /['"]/.test(next) && !/['"]/.test(quote)) {
+				state.tokens.unshift(tokenStringStart(next, "string"));
+				stream.backUp(1);
+				break;
+			}
+			escaped = !escaped && next === "\\";
+		}
+		return style;
+	};
+}
+function tokenStringStart(quote, style) {
+	return function(stream, state) {
+		state.tokens[0] = tokenString(quote, style);
+		stream.next();
+		return tokenize(stream, state);
+	};
+}
+var tokenDollar = function(stream, state) {
+	if (state.tokens.length > 1) stream.eat("$");
+	var ch = stream.next();
+	if (/['"({]/.test(ch)) {
+		state.tokens[0] = tokenString(ch, ch == "(" ? "quote" : ch == "{" ? "def" : "string");
+		return tokenize(stream, state);
+	}
+	if (!/\d/.test(ch)) stream.eatWhile(/\w/);
+	state.tokens.shift();
+	return "def";
+};
+function tokenHeredoc(delim) {
+	return function(stream, state) {
+		if (stream.sol() && stream.string == delim) state.tokens.shift();
+		stream.skipToEnd();
+		return "string.special";
+	};
+}
+function tokenize(stream, state) {
+	return (state.tokens[0] || tokenBase)(stream, state);
+}
+var shell = {
+	name: "shell",
+	startState: function() {
+		return { tokens: [] };
+	},
+	token: function(stream, state) {
+		return tokenize(stream, state);
+	},
+	languageData: {
+		autocomplete: commonAtoms.concat(commonKeywords, commonCommands),
+		closeBrackets: { brackets: [
+			"(",
+			"[",
+			"{",
+			"'",
+			"\"",
+			"`"
+		] },
+		commentTokens: { line: "#" }
+	}
+};
+//#endregion
+export { shell };

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

@@ -1,18 +1,28 @@
 /**
  * Nederlandse Digitale Dienst Badge Component (Lit + TypeScript)
  *
- * Een notificatie-indicator, vaak voor ongelezen aantallen of statusdots. Kan tekst,
- * een getal en/of een icoon tonen. Zonder inhoud verschijnt automatisch een stip.
- * Gebruik in een hoek van een ander element (bijv. een icon) of standalone.
+ * Shows the state of something, or how much of it there is: a status, a number
+ * of unread messages, a dot saying something is new. What it says is decided by
+ * the system, and it changes without anyone touching it. A badge is never
+ * interactive.
+ *
+ * It shows text, a number and/or an icon; with no content it becomes a dot. Put
+ * it in a corner of another element (an icon, for instance) or on its own.
+ *
+ * For a property someone assigns to something, such as a category, a role or a
+ * certification, use `nldd-tag`. For standalone data the user works with, such
+ * as a chosen person or an active filter, use `nldd-token`.
  *
  * @element nldd-badge
- * @attr {string} color - Semantisch ('critical' | 'accent' | 'neutral' | 'warning' | 'success') of een Rijkskleur ('lintblauw' | 'hemelblauw' | 'oranje' | …). Default: 'critical'
- * @attr {string} size - Grootte: 'sm' | 'md' (default: 'md')
- * @attr {string} text - Tekst (heeft voorrang op number)
- * @attr {number} number - Numerieke waarde. Wordt beknopt als meer dan max
- * @attr {number} max - Maximum waarde boven welke number wordt getoond als "{max}+" (default: 99)
- * @attr {string} icon - Icoon naam. Icon-only wordt als vierkant gerenderd; met text/number komt het icoon links.
- * @attr {string} accessible-label - Toegankelijk label voor screenreaders. Fallback naar text/number; anders naar i18n default ("Notificatie").
+ * @attr {string} size - Size: 'sm' | 'md' (default: 'md')
+ * @attr {string} color - Semantic ('critical' | 'accent' | 'neutral' | 'warning' | 'success') or a Rijkshuisstijl color ('lintblauw' | 'hemelblauw' | 'oranje' | …). Default: 'critical'
+ * @attr {boolean} pulse - Grows a ring out of the badge and fades it, for something happening right now (a live connection, an outage). Respects `prefers-reduced-motion`.
+ * @attr {string} text - Text (takes precedence over number)
+ * @attr {number} number - Numeric value. Shortened when it is over max
+ * @attr {number} max - Value above which number is shown as "{max}+" (default: 99)
+ * @attr {string} icon - Icon name. Icon-only renders as a square; with text or number the icon goes on the left.
+ * @attr {string} accessible-label - Accessible label for screen readers. Falls back to text/number; otherwise to the i18n default ("Notificatie").
+ * @attr {boolean} decorative - Hides the badge from assistive software (use when the text beside it says the same, such as a dot next to a status word)
  */
 import { LitElement } from 'lit';
 import './../../content/icon/icon.js';
@@ -26,13 +36,15 @@ declare const NLDDBadge_base: (abstract new (...args: any[]) => LitElement & {
 }) & typeof LitElement;
 export declare class NLDDBadge extends NLDDBadge_base {
     static styles: import("lit").CSSResult;
-    color: Color;
     size: Size;
+    color: Color;
+    pulse: boolean;
     text: string;
     number: number | undefined;
     max: number;
     icon: string;
     accessibleLabel: string;
+    decorative: boolean;
     get _hasText(): boolean;
     get _isDot(): boolean;
     get _isIconOnly(): boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,OAAO,8BAA8B,CAAC;AAEtC,KAAK,KAAK,GACP,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GACzD,WAAW,GAAG,aAAa,GAAG,YAAY,GAAG,YAAY,GACzD,OAAO,GAAG,QAAQ,GAClB,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GACzC,YAAY,GAAG,MAAM,GACrB,aAAa,GAAG,OAAO,GACvB,aAAa,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,CAAC;AACtD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;;;;;;;AAExB,qBACa,SAAU,SAAQ,cAAmD;IACjF,OAAgB,MAAM,0BAAe;IAGrC,KAAK,EAAE,KAAK,CAAc;IAG1B,IAAI,EAAE,IAAI,CAAQ;IAGlB,IAAI,SAAM;IAGV,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAGvC,GAAG,SAAM;IAGT,IAAI,SAAM;IAGV,eAAe,SAAM;IAErB,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,MAAM,IAAI,OAAO,CAEpB;IAED,IAAI,WAAW,IAAI,OAAO,CAEzB;IAED,IAAI,aAAa,IAAI,MAAM,CAM1B;IAED,IAAI,UAAU,IAAI,MAAM,CAIvB;IAEQ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,OAAO,8BAA8B,CAAC;AAEtC,KAAK,KAAK,GACP,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GACzD,WAAW,GAAG,aAAa,GAAG,YAAY,GAAG,YAAY,GACzD,OAAO,GAAG,QAAQ,GAClB,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GACzC,YAAY,GAAG,MAAM,GACrB,aAAa,GAAG,OAAO,GACvB,aAAa,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,CAAC;AACtD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;;;;;;;AAExB,qBACa,SAAU,SAAQ,cAAmD;IACjF,OAAgB,MAAM,0BAAe;IAGrC,IAAI,EAAE,IAAI,CAAQ;IAGlB,KAAK,EAAE,KAAK,CAAc;IAG1B,KAAK,UAAS;IAGd,IAAI,SAAM;IAGV,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAGvC,GAAG,SAAM;IAGT,IAAI,SAAM;IAGV,eAAe,SAAM;IAGrB,UAAU,UAAS;IAEnB,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,MAAM,IAAI,OAAO,CAEpB;IAED,IAAI,WAAW,IAAI,OAAO,CAEzB;IAED,IAAI,aAAa,IAAI,MAAM,CAM1B;IAED,IAAI,UAAU,IAAI,MAAM,CAIvB;IAEQ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}

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

@@ -1,18 +1,28 @@
 /**
  * Nederlandse Digitale Dienst Badge Component (Lit + TypeScript)
  *
- * Een notificatie-indicator, vaak voor ongelezen aantallen of statusdots. Kan tekst,
- * een getal en/of een icoon tonen. Zonder inhoud verschijnt automatisch een stip.
- * Gebruik in een hoek van een ander element (bijv. een icon) of standalone.
+ * Shows the state of something, or how much of it there is: a status, a number
+ * of unread messages, a dot saying something is new. What it says is decided by
+ * the system, and it changes without anyone touching it. A badge is never
+ * interactive.
+ *
+ * It shows text, a number and/or an icon; with no content it becomes a dot. Put
+ * it in a corner of another element (an icon, for instance) or on its own.
+ *
+ * For a property someone assigns to something, such as a category, a role or a
+ * certification, use `nldd-tag`. For standalone data the user works with, such
+ * as a chosen person or an active filter, use `nldd-token`.
  *
  * @element nldd-badge
- * @attr {string} color - Semantisch ('critical' | 'accent' | 'neutral' | 'warning' | 'success') of een Rijkskleur ('lintblauw' | 'hemelblauw' | 'oranje' | …). Default: 'critical'
- * @attr {string} size - Grootte: 'sm' | 'md' (default: 'md')
- * @attr {string} text - Tekst (heeft voorrang op number)
- * @attr {number} number - Numerieke waarde. Wordt beknopt als meer dan max
- * @attr {number} max - Maximum waarde boven welke number wordt getoond als "{max}+" (default: 99)
- * @attr {string} icon - Icoon naam. Icon-only wordt als vierkant gerenderd; met text/number komt het icoon links.
- * @attr {string} accessible-label - Toegankelijk label voor screenreaders. Fallback naar text/number; anders naar i18n default ("Notificatie").
+ * @attr {string} size - Size: 'sm' | 'md' (default: 'md')
+ * @attr {string} color - Semantic ('critical' | 'accent' | 'neutral' | 'warning' | 'success') or a Rijkshuisstijl color ('lintblauw' | 'hemelblauw' | 'oranje' | …). Default: 'critical'
+ * @attr {boolean} pulse - Grows a ring out of the badge and fades it, for something happening right now (a live connection, an outage). Respects `prefers-reduced-motion`.
+ * @attr {string} text - Text (takes precedence over number)
+ * @attr {number} number - Numeric value. Shortened when it is over max
+ * @attr {number} max - Value above which number is shown as "{max}+" (default: 99)
+ * @attr {string} icon - Icon name. Icon-only renders as a square; with text or number the icon goes on the left.
+ * @attr {string} accessible-label - Accessible label for screen readers. Falls back to text/number; otherwise to the i18n default ("Notificatie").
+ * @attr {boolean} decorative - Hides the badge from assistive software (use when the text beside it says the same, such as a dot next to a status word)
  */
 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;
@@ -31,13 +41,15 @@ import './../../content/icon/icon.js';
 let NLDDBadge = class NLDDBadge extends withTranslations(LitElement, nlddBadgeTranslations) {
     constructor() {
         super(...arguments);
-        this.color = 'critical';
         this.size = 'md';
+        this.color = 'critical';
+        this.pulse = false;
         this.text = '';
         this.number = undefined;
         this.max = 99;
         this.icon = '';
         this.accessibleLabel = '';
+        this.decorative = false;
     }
     get _hasText() {
         return !!this.text || typeof this.number === 'number';
@@ -68,12 +80,15 @@ let NLDDBadge = class NLDDBadge extends withTranslations(LitElement, nlddBadgeTr
     }
 };
 NLDDBadge.styles = badgeStyles;
+__decorate([
+    property({ reflect: true, converter: reflectNonDefault('md') })
+], NLDDBadge.prototype, "size", void 0);
 __decorate([
     property({ reflect: true, converter: reflectNonDefault('critical') })
 ], NLDDBadge.prototype, "color", void 0);
 __decorate([
-    property({ reflect: true, converter: reflectNonDefault('md') })
-], NLDDBadge.prototype, "size", void 0);
+    property({ type: Boolean, reflect: true })
+], NLDDBadge.prototype, "pulse", void 0);
 __decorate([
     property({ reflect: true, converter: reflectNonDefault('') })
 ], NLDDBadge.prototype, "text", void 0);
@@ -81,7 +96,7 @@ __decorate([
     property({ type: Number, reflect: true })
 ], NLDDBadge.prototype, "number", void 0);
 __decorate([
-    property({ type: Number, reflect: true })
+    property({ reflect: true, converter: reflectNonDefault(99) })
 ], NLDDBadge.prototype, "max", void 0);
 __decorate([
     property({ type: String })
@@ -89,6 +104,9 @@ __decorate([
 __decorate([
     property({ type: String, attribute: 'accessible-label' })
 ], NLDDBadge.prototype, "accessibleLabel", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NLDDBadge.prototype, "decorative", void 0);
 NLDDBadge = __decorate([
     customElement('nldd-badge')
 ], NLDDBadge);

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

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

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,yBAmPvB,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,yBA4SvB,CAAC"}

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

@@ -17,9 +17,11 @@ export const badgeStyles = css `
 		--_gap: var(--primitives-space-3);
 		--_content-color: var(--semantics-categories-critical-filled-content-color);
 		--_font: var(--primitives-font-body-xs-medium-flat);
-		--_dot-size: var(--primitives-space-10);
+		--_dot-size: var(--primitives-space-12);
 		--_icon-size: var(--primitives-space-14);
 		--_icon-offset-correction: var(--primitives-space-1);
+		--_pulse-spread: var(--primitives-space-8);
+		--_pulse-duration: 1.5s;
 
 		${inheritedTextReset}
 		display: inline-flex;
@@ -27,11 +29,12 @@ export const badgeStyles = css `
 	}
 
 	:host([size="sm"]) {
+		--_pulse-spread: var(--primitives-space-6);
 		--_height: var(--primitives-space-16);
 		--_inline-padding: var(--primitives-space-4);
 		--_gap: var(--primitives-space-2);
 		--_font: var(--primitives-font-body-xxs-medium-flat);
-		--_dot-size: var(--primitives-space-6);
+		--_dot-size: var(--primitives-space-8);
 		--_icon-size: var(--primitives-space-12);
 	}
 
@@ -182,6 +185,7 @@ export const badgeStyles = css `
 	.badge {
 		box-sizing: border-box;
 		display: inline-flex;
+		position: relative;
 		border-radius: var(--components-badge-corner-radius);
 		box-shadow:
 			0 0 0 1px var(--context-parent-background-color, var(--semantics-surfaces-base-background-color)),
@@ -206,6 +210,59 @@ export const badgeStyles = css `
 		}
 	}
 
+	/* Grows out of the badge and fades: it borrows the badge's own shape and
+	   colour, so it works on a dot as well as on a counter. Behind the content
+	   and inert, so it never affects layout or hit area.
+
+	   A growing box-shadow rather than a scale: scaling multiplies, so a wide
+	   badge would throw a halo that is far wider than it is tall. A spread adds
+	   the same distance on every side, whatever the badge measures.
+
+	   Painted after the badge, so the ring passes over the contrast border the
+	   badge draws in the surface colour instead of starting behind it. The
+	   element itself is transparent (the ring is the shadow, which paints
+	   outside the box), so nothing covers the badge's own fill or text. */
+	.badge__pulse {
+		position: absolute;
+		inset: 0;
+		border-radius: inherit;
+		box-shadow: 0 0 0 0 var(--_background-color);
+		pointer-events: none;
+		animation: badge-pulse var(--_pulse-duration) infinite;
+	}
+
+	/* The ring rides on the shadow's own colour rather than on the element's
+	   opacity: at spread zero the shadow has no area, so it can start at full
+	   strength without a flash, and it is already transparent when the spread
+	   snaps back for the next cycle. Same shape as Shoelace's badge pulse. */
+	@keyframes badge-pulse {
+		0% {
+			box-shadow: 0 0 0 0 var(--_background-color);
+		}
+		70% {
+			box-shadow: 0 0 0 var(--_pulse-spread) transparent;
+		}
+		100% {
+			box-shadow: 0 0 0 0 transparent;
+		}
+	}
+
+	/* The ring is decoration on top of a badge that is visible anyway, so it
+	   simply goes away rather than pulsing its opacity in place. */
+	@media (prefers-reduced-motion: reduce) {
+		.badge__pulse {
+			display: none;
+		}
+	}
+
+	/* Forced colors paints the badge in system colours; a ring in the same
+	   Canvas would read as a second, half-drawn badge. */
+	@media (forced-colors: active) {
+		.badge__pulse {
+			display: none;
+		}
+	}
+
 	.badge--dot {
 		min-width: var(--_dot-size);
 		width: var(--_dot-size);

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;;;;;;;;;;;;;;;;;;;;;IAqB1B,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,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;IAuB1B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqRrB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"badge.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,wBAAgB,QAAQ,CAAC,SAAS,EAAE,SAAS,wCAoB5C"}
+{"version":3,"file":"badge.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,wBAAgB,QAAQ,CAAC,SAAS,EAAE,SAAS,wCAyB5C"}

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

@@ -6,12 +6,17 @@ export function template(component) {
     if (component._isIconOnly)
         modifiers.push('badge--icon-only');
     const classes = ['badge', ...modifiers].join(' ');
-    const needsAriaImg = component._isDot || component._isIconOnly;
+    // A badge without text or an icon-only badge has nothing to read, so it carries
+    // its own label. Unless it is decorative: then the words beside it already say
+    // what the colour says, and announcing it again is noise.
+    const needsAriaImg = !component.decorative && (component._isDot || component._isIconOnly);
     return html `
 		<span class=${classes}
 			role=${needsAriaImg ? 'img' : nothing}
 			aria-label=${needsAriaImg ? component._ariaLabel : nothing}
+			aria-hidden=${component.decorative ? 'true' : nothing}
 		>
+			${component.pulse ? html `<span class="badge__pulse"></span>` : ''}
 			${component.icon ? html `
 				<span class="badge__icon">
 					<nldd-icon name=${component.icon}></nldd-icon>

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

@@ -1 +1 @@
-{"version":3,"file":"badge.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpC,MAAM,UAAU,QAAQ,CAAC,SAAoB;IAC5C,MAAM,SAAS,GAAG,EAAE,CAAC;IACrB,IAAI,SAAS,CAAC,MAAM;QAAE,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACnD,IAAI,SAAS,CAAC,WAAW;QAAE,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC9D,MAAM,OAAO,GAAG,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAClD,MAAM,YAAY,GAAG,SAAS,CAAC,MAAM,IAAI,SAAS,CAAC,WAAW,CAAC;IAE/D,OAAO,IAAI,CAAA;gBACI,OAAO;UACb,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;gBACxB,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO;;KAExD,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;;uBAEH,SAAS,CAAC,IAAI;;IAEjC,CAAC,CAAC,CAAC,EAAE;KACJ,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,6BAA6B,SAAS,CAAC,aAAa,SAAS,CAAC,CAAC,CAAC,EAAE;;EAE9F,CAAC;AACH,CAAC"}
+{"version":3,"file":"badge.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/badge/badge.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpC,MAAM,UAAU,QAAQ,CAAC,SAAoB;IAC5C,MAAM,SAAS,GAAG,EAAE,CAAC;IACrB,IAAI,SAAS,CAAC,MAAM;QAAE,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACnD,IAAI,SAAS,CAAC,WAAW;QAAE,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC9D,MAAM,OAAO,GAAG,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAClD,gFAAgF;IAChF,+EAA+E;IAC/E,0DAA0D;IAC1D,MAAM,YAAY,GAAG,CAAC,SAAS,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,SAAS,CAAC,WAAW,CAAC,CAAC;IAE1F,OAAO,IAAI,CAAA;gBACI,OAAO;UACb,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;gBACxB,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO;iBAC5C,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;KAEnD,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,oCAAoC,CAAC,CAAC,CAAC,EAAE;KAC/D,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;;uBAEH,SAAS,CAAC,IAAI;;IAEjC,CAAC,CAAC,CAAC,EAAE;KACJ,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,6BAA6B,SAAS,CAAC,aAAa,SAAS,CAAC,CAAC,CAAC,EAAE;;EAE9F,CAAC;AACH,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,yBA8KxB,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,yBAoLxB,CAAC"}

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

@@ -136,14 +136,20 @@ export const bannerStyles = css `
 		padding-top: calc(var(--_text-icon-offset) - var(--primitives-space-2));
 	}
 
+	/* A banner carries text it did not write: a server message, an identifier, a
+	   URL. One token longer than the banner is wide would otherwise run past the
+	   edge and get clipped, so a word that cannot fit on a line of its own is
+	   broken rather than lost. */
 	.banner__text {
 		margin: 0;
+		overflow-wrap: break-word;
 		font: var(--primitives-font-body-md-bold-tight);
 		text-wrap: pretty;
 	}
 
 	.banner__supporting-text {
 		margin: 0;
+		overflow-wrap: break-word;
 		font: var(--primitives-font-body-md-regular-tight);
 		text-wrap: pretty;
 	}

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;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4B3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkJrB,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,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4B3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwJrB,CAAC"}

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

@@ -34,6 +34,8 @@ export declare class NLDDModalDialog extends LitElement {
     accessibleLabel: string;
     private _closing;
     private get _dialog();
+    /** Cancels a `show()` that is waiting for the first render; null when none is. */
+    private _cancelPendingOpen;
     show(): void;
     private _manageFocus;
     hide(): void;

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

@@ -1 +1 @@
-{"version":3,"file":"modal-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAYjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAC7E,OAAO,mCAAmC,CAAC;AAE3C,qBACa,eAAgB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAAqB;IAG3C,OAAO,EAAE,mBAAmB,GAAG,EAAE,CAAM;IAGvC,IAAI,SAAM;IAGV,IAAI,SAAM;IAGV,cAAc,SAAM;IAEpB,oFAAoF;IAEpF,eAAe,SAAM;IAErB,OAAO,CAAC,QAAQ,CAAS;IAEzB,OAAO,KAAK,OAAO,GAElB;IAED,IAAI,IAAI,IAAI;IAQZ,OAAO,CAAC,YAAY;IAapB,IAAI,IAAI,IAAI;IA+BZ,6CAA6C;IAC7C,OAAO,CAAC,cAAc,CAAK;IAE3B;;;mEAG+D;IAC/D,OAAO,CAAC,sBAAsB,CAAS;IAEvC,wBAAwB,GAAI,GAAG,YAAY,KAAG,IAAI,CAEhD;IAEF;;;;2EAIuE;IACvE,OAAO,CAAC,aAAa;IASrB,oBAAoB,GAAI,GAAG,UAAU,KAAG,IAAI,CAO3C;IAED,aAAa,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAKpB,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mBAAmB,EAAE,eAAe,CAAC;KACrC;CACD"}
+{"version":3,"file":"modal-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAajC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAC7E,OAAO,mCAAmC,CAAC;AAE3C,qBACa,eAAgB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAAqB;IAG3C,OAAO,EAAE,mBAAmB,GAAG,EAAE,CAAM;IAGvC,IAAI,SAAM;IAGV,IAAI,SAAM;IAGV,cAAc,SAAM;IAEpB,oFAAoF;IAEpF,eAAe,SAAM;IAErB,OAAO,CAAC,QAAQ,CAAS;IAEzB,OAAO,KAAK,OAAO,GAElB;IAED,kFAAkF;IAClF,OAAO,CAAC,kBAAkB,CAA6B;IAEvD,IAAI,IAAI,IAAI;IAqBZ,OAAO,CAAC,YAAY;IAapB,IAAI,IAAI,IAAI;IAmCZ,6CAA6C;IAC7C,OAAO,CAAC,cAAc,CAAK;IAE3B;;;mEAG+D;IAC/D,OAAO,CAAC,sBAAsB,CAAS;IAEvC,wBAAwB,GAAI,GAAG,YAAY,KAAG,IAAI,CAEhD;IAEF;;;;2EAIuE;IACvE,OAAO,CAAC,aAAa;IASrB,oBAAoB,GAAI,GAAG,UAAU,KAAG,IAAI,CAO3C;IAED,aAAa,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAKpB,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mBAAmB,EAAE,eAAe,CAAC;KACrC;CACD"}

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

@@ -38,6 +38,7 @@ import { modalDialogStyles } from './modal-dialog.styles.js';
 import { modalDialogTemplate } from './modal-dialog.template.js';
 import { isPointerMode } from '../../../utilities/input-modality.js';
 import { focusAutofocusTarget } from '../../../utilities/autofocus.js';
+import { openWhenRendered } from '../../../utilities/open-when-rendered.js';
 import '../inline-dialog/inline-dialog.js';
 let NLDDModalDialog = class NLDDModalDialog extends LitElement {
     constructor() {
@@ -49,6 +50,8 @@ let NLDDModalDialog = class NLDDModalDialog extends LitElement {
         /** Accessible name for the dialog — forwarded as aria-label. Falls back to text. */
         this.accessibleLabel = '';
         this._closing = false;
+        /** Cancels a `show()` that is waiting for the first render; null when none is. */
+        this._cancelPendingOpen = null;
         /** Timer id for the close fallback above. */
         this._closeFallback = 0;
         /** Whether the press preceding a click started on the backdrop rather than
@@ -73,7 +76,14 @@ let NLDDModalDialog = class NLDDModalDialog extends LitElement {
     }
     show() {
         const dialog = this._dialog;
-        if (!dialog || dialog.open)
+        if (!dialog) {
+            this._cancelPendingOpen?.();
+            this._cancelPendingOpen = openWhenRendered(this, () => this._dialog, () => this.show());
+            return;
+        }
+        this._cancelPendingOpen?.();
+        this._cancelPendingOpen = null;
+        if (dialog.open)
             return;
         dialog.showModal();
         this._manageFocus();
@@ -93,6 +103,9 @@ let NLDDModalDialog = class NLDDModalDialog extends LitElement {
         dialog.focus();
     }
     hide() {
+        // A hide() beats a show() that is still waiting for the first render.
+        this._cancelPendingOpen?.();
+        this._cancelPendingOpen = null;
         const dialog = this._dialog;
         if (!dialog || !dialog.open || this._closing)
             return;