@nldd/design-system 0.8.43 → 0.8.45

package/dist/components/content/icon/icon.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.styles.js","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B5B,CAAC"}
+{"version":3,"file":"icon.styles.js","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8E5B,CAAC"}

package/dist/components/content/icon/icon.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.template.d.ts","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.template.ts"],"names":[],"mappings":"AAGA,wBAAgB,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,wCAU9C"}
+{"version":3,"file":"icon.template.d.ts","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.template.ts"],"names":[],"mappings":"AAGA,wBAAgB,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,wCAM9C"}

package/dist/components/content/icon/icon.template.js

@@ -4,10 +4,6 @@ export function template(iconSvg) {
     if (!iconSvg) {
         return html `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>`;
     }
-    return html `
-		<div class="icon__container">
-			${unsafeHTML(iconSvg)}
-		</div>
-	`;
+    return html `${unsafeHTML(iconSvg)}`;
 }
 //# sourceMappingURL=icon.template.js.map

package/dist/components/content/icon/icon.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.template.js","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAE3D,MAAM,UAAU,QAAQ,CAAC,OAAsB;IAC9C,IAAI,CAAC,OAAO,EAAE,CAAC;QACd,OAAO,IAAI,CAAA,oEAAoE,CAAC;IACjF,CAAC;IAED,OAAO,IAAI,CAAA;;KAEP,UAAU,CAAC,OAAO,CAAC;;EAEtB,CAAC;AACH,CAAC"}
+{"version":3,"file":"icon.template.js","sourceRoot":"","sources":["../../../../src/components/content/icon/icon.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAE3D,MAAM,UAAU,QAAQ,CAAC,OAAsB;IAC9C,IAAI,CAAC,OAAO,EAAE,CAAC;QACd,OAAO,IAAI,CAAA,oEAAoE,CAAC;IACjF,CAAC;IAED,OAAO,IAAI,CAAA,GAAG,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC;AACrC,CAAC"}

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.d.ts

@@ -8,23 +8,45 @@
  * verborgen omdat hij niet aanroepbaar is. Gebruik het `always-visible` attribuut
  * wanneer de shortcut puur informatief is en altijd zichtbaar moet blijven.
  *
+ * Voor cross-platform shortcuts kunnen `mac-keys`, `windows-keys` en `linux-keys`
+ * worden gezet — het component picks de juiste op basis van de gedetecteerde OS,
+ * met `keys` als fallback voor onbekende platforms.
+ *
  * @element nldd-keyboard-shortcut
  * @attr {string} keys - Toetsen gescheiden door '+' (bijv. 'Cmd+K' of 'Ctrl+Shift+P').
  *   Gebruik '+++' voor een letterlijke '+' toets: 'Ctrl+++' wordt 'Ctrl' + '+'.
  *   Voor complexere scenario's (bijv. combo met meerdere '+' keys) kun je in plaats
  *   van het keys-attribuut de default slot gebruiken met eigen <kbd> elementen.
+ * @attr {string} mac-keys - Optionele override voor macOS (incl. iPhone/iPad/iPod).
+ * @attr {string} windows-keys - Optionele override voor Windows.
+ * @attr {string} linux-keys - Optionele override voor Linux/ChromeOS.
  * @attr {string} size - Grootte: 'sm' | 'md' (default: 'md')
  * @attr {boolean} always-visible - Toon ook op touch-only devices waar shortcuts niet aanroepbaar zijn.
  *
  * @slot - Optionele custom <kbd>-elementen. Wordt genegeerd als keys is opgegeven.
  */
 import { LitElement } from 'lit';
+import { type OS } from '../../../utilities/os.js';
 type Size = 'sm' | 'md';
 export declare class NLDDKeyboardShortcut extends LitElement {
     static styles: import("lit").CSSResult;
     keys: string;
+    macKeys: string;
+    windowsKeys: string;
+    linuxKeys: string;
     size: Size;
     alwaysVisible: boolean;
+    /**
+     * @internal — development only.
+     *
+     * Per-instance OS override that bypasses `detectOS()`. Same pattern as
+     * `debug-safe-triangle` on `nldd-menu`: useful in Storybook stories or
+     * documentation comparisons where you need different instances on the
+     * page to render as different operating systems. Don't ship this in
+     * production markup — production should rely on real OS detection.
+     */
+    debugOS: OS | '';
+    get _resolvedKeys(): string;
     get _parsedKeys(): string[];
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.d.ts","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAExB,qBACa,oBAAqB,SAAQ,UAAU;IACnD,OAAgB,MAAM,0BAA0B;IAGhD,IAAI,SAAM;IAGV,IAAI,EAAE,IAAI,CAAQ;IAGlB,aAAa,UAAS;IAEtB,IAAI,WAAW,IAAI,MAAM,EAAE,CAS1B;IAEQ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,wBAAwB,EAAE,oBAAoB,CAAC;KAC/C;CACD"}
+{"version":3,"file":"keyboard-shortcut.d.ts","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,EAAY,KAAK,EAAE,EAAE,MAAM,0BAA0B,CAAC;AAE7D,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAExB,qBACa,oBAAqB,SAAQ,UAAU;IACnD,OAAgB,MAAM,0BAA0B;IAGhD,IAAI,SAAM;IAGV,OAAO,SAAM;IAGb,WAAW,SAAM;IAGjB,SAAS,SAAM;IAGf,IAAI,EAAE,IAAI,CAAQ;IAGlB,aAAa,UAAS;IAEtB;;;;;;;;OAQG;IAEH,OAAO,EAAE,EAAE,GAAG,EAAE,CAAM;IAEtB,IAAI,aAAa,IAAI,MAAM,CAM1B;IAED,IAAI,WAAW,IAAI,MAAM,EAAE,CAU1B;IAEQ,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,wBAAwB,EAAE,oBAAoB,CAAC;KAC/C;CACD"}

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.js

@@ -8,11 +8,18 @@
  * verborgen omdat hij niet aanroepbaar is. Gebruik het `always-visible` attribuut
  * wanneer de shortcut puur informatief is en altijd zichtbaar moet blijven.
  *
+ * Voor cross-platform shortcuts kunnen `mac-keys`, `windows-keys` en `linux-keys`
+ * worden gezet — het component picks de juiste op basis van de gedetecteerde OS,
+ * met `keys` als fallback voor onbekende platforms.
+ *
  * @element nldd-keyboard-shortcut
  * @attr {string} keys - Toetsen gescheiden door '+' (bijv. 'Cmd+K' of 'Ctrl+Shift+P').
  *   Gebruik '+++' voor een letterlijke '+' toets: 'Ctrl+++' wordt 'Ctrl' + '+'.
  *   Voor complexere scenario's (bijv. combo met meerdere '+' keys) kun je in plaats
  *   van het keys-attribuut de default slot gebruiken met eigen <kbd> elementen.
+ * @attr {string} mac-keys - Optionele override voor macOS (incl. iPhone/iPad/iPod).
+ * @attr {string} windows-keys - Optionele override voor Windows.
+ * @attr {string} linux-keys - Optionele override voor Linux/ChromeOS.
  * @attr {string} size - Grootte: 'sm' | 'md' (default: 'md')
  * @attr {boolean} always-visible - Toon ook op touch-only devices waar shortcuts niet aanroepbaar zijn.
  *
@@ -28,19 +35,44 @@ import { LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { keyboardShortcutStyles } from './keyboard-shortcut.styles.js';
 import { template } from './keyboard-shortcut.template.js';
+import { detectOS } from '../../../utilities/os.js';
 let NLDDKeyboardShortcut = class NLDDKeyboardShortcut extends LitElement {
     constructor() {
         super(...arguments);
         this.keys = '';
+        this.macKeys = '';
+        this.windowsKeys = '';
+        this.linuxKeys = '';
         this.size = 'md';
         this.alwaysVisible = false;
+        /**
+         * @internal — development only.
+         *
+         * Per-instance OS override that bypasses `detectOS()`. Same pattern as
+         * `debug-safe-triangle` on `nldd-menu`: useful in Storybook stories or
+         * documentation comparisons where you need different instances on the
+         * page to render as different operating systems. Don't ship this in
+         * production markup — production should rely on real OS detection.
+         */
+        this.debugOS = '';
+    }
+    get _resolvedKeys() {
+        const os = this.debugOS || detectOS();
+        if (os === 'mac' && this.macKeys)
+            return this.macKeys;
+        if (os === 'windows' && this.windowsKeys)
+            return this.windowsKeys;
+        if (os === 'linux' && this.linuxKeys)
+            return this.linuxKeys;
+        return this.keys;
     }
     get _parsedKeys() {
-        if (!this.keys)
+        const spec = this._resolvedKeys;
+        if (!spec)
             return [];
         // '+++' encodes a literal '+' key between separators: Ctrl+++a → [Ctrl, +, a]
         const MARKER = '\u0000';
-        return this.keys
+        return spec
             .replace(/\+\+\+/g, `+${MARKER}+`)
             .split('+')
             .map(k => k.trim().replace(new RegExp(MARKER, 'g'), '+'))
@@ -54,12 +86,24 @@ NLDDKeyboardShortcut.styles = keyboardShortcutStyles;
 __decorate([
     property({ type: String })
 ], NLDDKeyboardShortcut.prototype, "keys", void 0);
+__decorate([
+    property({ type: String, attribute: 'mac-keys' })
+], NLDDKeyboardShortcut.prototype, "macKeys", void 0);
+__decorate([
+    property({ type: String, attribute: 'windows-keys' })
+], NLDDKeyboardShortcut.prototype, "windowsKeys", void 0);
+__decorate([
+    property({ type: String, attribute: 'linux-keys' })
+], NLDDKeyboardShortcut.prototype, "linuxKeys", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDKeyboardShortcut.prototype, "size", void 0);
 __decorate([
     property({ type: Boolean, reflect: true, attribute: 'always-visible' })
 ], NLDDKeyboardShortcut.prototype, "alwaysVisible", void 0);
+__decorate([
+    property({ type: String, attribute: 'debug-os' })
+], NLDDKeyboardShortcut.prototype, "debugOS", void 0);
 NLDDKeyboardShortcut = __decorate([
     customElement('nldd-keyboard-shortcut')
 ], NLDDKeyboardShortcut);

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.js","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAKpD,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAIN,SAAI,GAAG,EAAE,CAAC;QAGV,SAAI,GAAS,IAAI,CAAC;QAGlB,kBAAa,GAAG,KAAK,CAAC;IAgBvB,CAAC;IAdA,IAAI,WAAW;QACd,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO,EAAE,CAAC;QAC1B,8EAA8E;QAC9E,MAAM,MAAM,GAAG,QAAQ,CAAC;QACxB,OAAO,IAAI,CAAC,IAAI;aACd,OAAO,CAAC,SAAS,EAAE,IAAI,MAAM,GAAG,CAAC;aACjC,KAAK,CAAC,GAAG,CAAC;aACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;aACxD,MAAM,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEQ,MAAM;QACd,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;;AAxBe,2BAAM,GAAG,sBAAsB,AAAzB,CAA0B;AAGhD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDACxB;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;2DAClD;AAVV,oBAAoB;IADhC,aAAa,CAAC,wBAAwB,CAAC;GAC3B,oBAAoB,CA0BhC"}
+{"version":3,"file":"keyboard-shortcut.js","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAW,MAAM,0BAA0B,CAAC;AAKtD,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAIN,SAAI,GAAG,EAAE,CAAC;QAGV,YAAO,GAAG,EAAE,CAAC;QAGb,gBAAW,GAAG,EAAE,CAAC;QAGjB,cAAS,GAAG,EAAE,CAAC;QAGf,SAAI,GAAS,IAAI,CAAC;QAGlB,kBAAa,GAAG,KAAK,CAAC;QAEtB;;;;;;;;WAQG;QAEH,YAAO,GAAY,EAAE,CAAC;IAyBvB,CAAC;IAvBA,IAAI,aAAa;QAChB,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,IAAI,QAAQ,EAAE,CAAC;QACtC,IAAI,EAAE,KAAK,KAAK,IAAI,IAAI,CAAC,OAAO;YAAE,OAAO,IAAI,CAAC,OAAO,CAAC;QACtD,IAAI,EAAE,KAAK,SAAS,IAAI,IAAI,CAAC,WAAW;YAAE,OAAO,IAAI,CAAC,WAAW,CAAC;QAClE,IAAI,EAAE,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS;YAAE,OAAO,IAAI,CAAC,SAAS,CAAC;QAC5D,OAAO,IAAI,CAAC,IAAI,CAAC;IAClB,CAAC;IAED,IAAI,WAAW;QACd,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC;QAChC,IAAI,CAAC,IAAI;YAAE,OAAO,EAAE,CAAC;QACrB,8EAA8E;QAC9E,MAAM,MAAM,GAAG,QAAQ,CAAC;QACxB,OAAO,IAAI;aACT,OAAO,CAAC,SAAS,EAAE,IAAI,MAAM,GAAG,CAAC;aACjC,KAAK,CAAC,GAAG,CAAC;aACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;aACxD,MAAM,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC;IAEQ,MAAM;QACd,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;;AAtDe,2BAAM,GAAG,sBAAsB,AAAzB,CAA0B;AAGhD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;qDACrC;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;yDACrC;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;uDACrC;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDACxB;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;2DAClD;AAYtB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;qDAC5B;AA/BV,oBAAoB;IADhC,aAAa,CAAC,wBAAwB,CAAC;GAC3B,oBAAoB,CAwDhC"}

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,sBAAsB,yBA4ElC,CAAC"}
+{"version":3,"file":"keyboard-shortcut.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,sBAAsB,yBAsElC,CAAC"}

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.js

@@ -23,9 +23,6 @@ export const keyboardShortcutStyles = css `
 		display: none;
 	}
 
-	/* Hide on touch-only devices (no hover capability anywhere) since the
-	   shortcut cannot be invoked. Override with [always-visible] when the
-	   shortcut is shown for informational purposes. */
 	@media (any-hover: none) {
 		:host(:not([always-visible])) {
 			display: none;
@@ -37,37 +34,29 @@ export const keyboardShortcutStyles = css `
 
 	.keyboard-shortcut {
 		display: inline-flex;
-		align-items: center;
 		gap: var(--primitives-space-4);
+		align-items: center;
 	}
 
 
 	/* # Elements */
 
 	.keyboard-shortcut__key {
-		display: inline-flex;
-		align-items: center;
-		justify-content: center;
 		box-sizing: border-box;
+		display: inline-flex;
+		border: var(--components-keyboard-shortcut-border-thickness) solid var(--components-keyboard-shortcut-border-color);
+		border-radius: var(--components-keyboard-shortcut-corner-radius);
+		background-color: var(--components-keyboard-shortcut-background-color);
 		min-width: var(--_size);
 		height: var(--_size);
 		padding: 0 var(--_inline-padding);
-		background-color: var(--components-keyboard-shortcut-background-color);
+		align-items: center;
+		justify-content: center;
 		color: var(--components-keyboard-shortcut-content-color);
-		border: var(--components-keyboard-shortcut-border-thickness) solid var(--components-keyboard-shortcut-border-color);
-		border-radius: var(--components-keyboard-shortcut-corner-radius);
 		font: var(--_font);
 		white-space: nowrap;
 	}
 
-	.keyboard-shortcut__separator {
-		color: var(--components-keyboard-shortcut-separator-color);
-		font: var(--_font);
-	}
-
-
-	/* # Toegankelijkheid */
-
 	@media (forced-colors: active) {
 		.keyboard-shortcut__key {
 			border-color: CanvasText;
@@ -75,5 +64,10 @@ export const keyboardShortcutStyles = css `
 			color: CanvasText;
 		}
 	}
+
+	.keyboard-shortcut__separator {
+		color: var(--components-keyboard-shortcut-separator-color);
+		font: var(--_font);
+	}
 `;
 //# sourceMappingURL=keyboard-shortcut.styles.js.map

package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.styles.js","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4ExC,CAAC"}
+{"version":3,"file":"keyboard-shortcut.styles.js","sourceRoot":"","sources":["../../../../src/components/content/keyboard-shortcut/keyboard-shortcut.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsExC,CAAC"}

package/dist/components/content/rich-text/rich-text.d.ts

@@ -7,12 +7,14 @@
  *
  * @element nldd-rich-text
  *
- * @attr {string} spacing - Spacing between elements: 'flat' | 'tight' | 'snug' (default) | 'loose'
+ * @attr {string}  spacing  - Spacing between elements: 'flat' | 'tight' | 'snug' (default) | 'loose'
+ * @attr {boolean} centered - Centers the main column inside the container; without it, content is left-aligned
  */
 import { LitElement } from 'lit';
 type Spacing = 'flat' | 'tight' | 'snug' | 'loose';
 export declare class NLDDRichText extends LitElement {
     spacing: Spacing;
+    centered: boolean;
     createRenderRoot(): this;
 }
 declare global {

package/dist/components/content/rich-text/rich-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text.d.ts","sourceRoot":"","sources":["../../../../src/components/content/rich-text/rich-text.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGjC,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAEnD,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAO,EAAE,OAAO,CAAU;IAEjB,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,YAAY,CAAC;KAC/B;CACD"}
+{"version":3,"file":"rich-text.d.ts","sourceRoot":"","sources":["../../../../src/components/content/rich-text/rich-text.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGjC,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAEnD,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAO,EAAE,OAAO,CAAU;IAG1B,QAAQ,UAAS;IAER,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,YAAY,CAAC;KAC/B;CACD"}

package/dist/components/content/rich-text/rich-text.js

@@ -13,7 +13,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  *
  * @element nldd-rich-text
  *
- * @attr {string} spacing - Spacing between elements: 'flat' | 'tight' | 'snug' (default) | 'loose'
+ * @attr {string}  spacing  - Spacing between elements: 'flat' | 'tight' | 'snug' (default) | 'loose'
+ * @attr {boolean} centered - Centers the main column inside the container; without it, content is left-aligned
  */
 import { LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
@@ -21,6 +22,7 @@ let NLDDRichText = class NLDDRichText extends LitElement {
     constructor() {
         super(...arguments);
         this.spacing = 'snug';
+        this.centered = false;
     }
     createRenderRoot() {
         return this;
@@ -29,6 +31,9 @@ let NLDDRichText = class NLDDRichText extends LitElement {
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDRichText.prototype, "spacing", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NLDDRichText.prototype, "centered", void 0);
 NLDDRichText = __decorate([
     customElement('nldd-rich-text')
 ], NLDDRichText);

package/dist/components/content/rich-text/rich-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text.js","sourceRoot":"","sources":["../../../../src/components/content/rich-text/rich-text.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAKrD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAEN,YAAO,GAAY,MAAM,CAAC;IAK3B,CAAC;IAHS,gBAAgB;QACxB,OAAO,IAAI,CAAC;IACb,CAAC;CACD,CAAA;AALA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAChB;AAFd,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAOxB"}
+{"version":3,"file":"rich-text.js","sourceRoot":"","sources":["../../../../src/components/content/rich-text/rich-text.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAKrD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAEN,YAAO,GAAY,MAAM,CAAC;QAG1B,aAAQ,GAAG,KAAK,CAAC;IAKlB,CAAC;IAHS,gBAAgB;QACxB,OAAO,IAAI,CAAC;IACb,CAAC;CACD,CAAA;AARA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAChB;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAC1B;AALL,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAUxB"}

package/dist/components/content/tag/tag.d.ts

@@ -9,6 +9,7 @@
  * @attr {string} size - Tag grootte: 'sm' | 'md' (default: 'md')
  * @attr {string} text - Tag tekst (alternatief voor default slot)
  * @attr {string} icon - Icoon voor de tekst
+ * @attr {string} variant - Wat zichtbaar is: 'text' | 'icon' | 'icon-and-text'. Onbepaald → auto-detect op basis van welke van text/icon aanwezig is.
  * @attr {string} accessible-label - Toegankelijk label voor screenreaders. Gebruik dit bij icon-only tags zonder zichtbare tekst.
  *
  * @slot - Tag tekst
@@ -18,21 +19,25 @@ import { LitElement } from 'lit';
 import './../icon/icon.js';
 type Color = 'neutral' | 'accent' | 'success' | 'warning' | 'critical' | 'coolgray' | 'lintblauw' | 'donkerblauw' | 'hemelblauw' | 'lichtblauw' | 'paars' | 'violet' | 'robijnrood' | 'roze' | 'rood' | 'oranje' | 'donkergeel' | 'geel' | 'donkerbruin' | 'bruin' | 'donkergroen' | 'groen' | 'mosgroen' | 'mintgroen';
 type Size = 'sm' | 'md';
+type Variant = 'text' | 'icon' | 'icon-and-text';
 export declare class NLDDTag extends LitElement {
     static styles: import("lit").CSSResult;
     color: Color;
     size: Size;
     text: string;
     icon: string;
+    variant: Variant | '';
     accessibleLabel: string;
     _hasSlotText: boolean;
     _hasSlotIcon: boolean;
     private _childObserver?;
     get _hasText(): boolean;
     get _hasIcon(): boolean;
+    get _effectiveVariant(): Variant;
     connectedCallback(): void;
     disconnectedCallback(): void;
     private _updateSlotState;
+    updated(): void;
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/dist/components/content/tag/tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,mBAAmB,CAAC;AAE3B,KAAK,KAAK,GAEP,SAAS,GACT,QAAQ,GACR,SAAS,GACT,SAAS,GACT,UAAU,GAEV,UAAU,GACV,WAAW,GACX,aAAa,GACb,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,MAAM,GACN,MAAM,GACN,QAAQ,GACR,YAAY,GACZ,MAAM,GACN,aAAa,GACb,OAAO,GACP,aAAa,GACb,OAAO,GACP,UAAU,GACV,WAAW,CAAC;AACf,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAExB,qBACa,OAAQ,SAAQ,UAAU;IACtC,OAAgB,MAAM,0BAAa;IAGnC,KAAK,EAAE,KAAK,CAAa;IAGzB,IAAI,EAAE,IAAI,CAAQ;IAGlB,IAAI,SAAM;IAGV,IAAI,SAAM;IAGV,eAAe,SAAM;IAGrB,YAAY,UAAS;IAGrB,YAAY,UAAS;IAErB,OAAO,CAAC,cAAc,CAAC,CAAmB;IAE1C,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAEQ,iBAAiB;IAajB,oBAAoB;IAM7B,OAAO,CAAC,gBAAgB;IAgBf,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,mBAAmB,CAAC;AAE3B,KAAK,KAAK,GAEP,SAAS,GACT,QAAQ,GACR,SAAS,GACT,SAAS,GACT,UAAU,GAEV,UAAU,GACV,WAAW,GACX,aAAa,GACb,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,MAAM,GACN,MAAM,GACN,QAAQ,GACR,YAAY,GACZ,MAAM,GACN,aAAa,GACb,OAAO,GACP,aAAa,GACb,OAAO,GACP,UAAU,GACV,WAAW,CAAC;AACf,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxB,KAAK,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,eAAe,CAAC;AAEjD,qBACa,OAAQ,SAAQ,UAAU;IACtC,OAAgB,MAAM,0BAAa;IAGnC,KAAK,EAAE,KAAK,CAAa;IAGzB,IAAI,EAAE,IAAI,CAAQ;IAGlB,IAAI,SAAM;IAGV,IAAI,SAAM;IAGV,OAAO,EAAE,OAAO,GAAG,EAAE,CAAM;IAG3B,eAAe,SAAM;IAGrB,YAAY,UAAS;IAGrB,YAAY,UAAS;IAErB,OAAO,CAAC,cAAc,CAAC,CAAmB;IAE1C,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,iBAAiB,IAAI,OAAO,CAK/B;IAEQ,iBAAiB;IAajB,oBAAoB;IAM7B,OAAO,CAAC,gBAAgB;IAgBf,OAAO;IASP,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}

package/dist/components/content/tag/tag.js

@@ -9,6 +9,7 @@
  * @attr {string} size - Tag grootte: 'sm' | 'md' (default: 'md')
  * @attr {string} text - Tag tekst (alternatief voor default slot)
  * @attr {string} icon - Icoon voor de tekst
+ * @attr {string} variant - Wat zichtbaar is: 'text' | 'icon' | 'icon-and-text'. Onbepaald → auto-detect op basis van welke van text/icon aanwezig is.
  * @attr {string} accessible-label - Toegankelijk label voor screenreaders. Gebruik dit bij icon-only tags zonder zichtbare tekst.
  *
  * @slot - Tag tekst
@@ -32,6 +33,7 @@ let NLDDTag = class NLDDTag extends LitElement {
         this.size = 'md';
         this.text = '';
         this.icon = '';
+        this.variant = '';
         this.accessibleLabel = '';
         this._hasSlotText = false;
         this._hasSlotIcon = false;
@@ -42,6 +44,15 @@ let NLDDTag = class NLDDTag extends LitElement {
     get _hasIcon() {
         return !!this.icon || this._hasSlotIcon;
     }
+    get _effectiveVariant() {
+        if (this.variant)
+            return this.variant;
+        if (this._hasIcon && this._hasText)
+            return 'icon-and-text';
+        if (this._hasIcon)
+            return 'icon';
+        return 'text';
+    }
     connectedCallback() {
         super.connectedCallback();
         this._updateSlotState();
@@ -78,6 +89,14 @@ let NLDDTag = class NLDDTag extends LitElement {
         this._hasSlotText = hasText;
         this._hasSlotIcon = hasIcon;
     }
+    updated() {
+        // An icon-only tag with no accessible-label has no accessible name —
+        // the placeholder/icon is decorative (aria-hidden), so screen readers
+        // announce nothing. Warn in dev so consumers add a label.
+        if (import.meta.env?.DEV && this._effectiveVariant === 'icon' && !this.accessibleLabel) {
+            console.warn('nldd-tag: icon-only tag without an accessible-label has no accessible name. Add accessible-label so screen readers can announce it.', this);
+        }
+    }
     render() {
         return template(this);
     }
@@ -95,6 +114,9 @@ __decorate([
 __decorate([
     property({ type: String })
 ], NLDDTag.prototype, "icon", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDTag.prototype, "variant", void 0);
 __decorate([
     property({ type: String, attribute: 'accessible-label' })
 ], NLDDTag.prototype, "accessibleLabel", void 0);

package/dist/components/content/tag/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tag.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,mBAAmB,CAAC;AAiCpB,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAIN,UAAK,GAAU,SAAS,CAAC;QAGzB,SAAI,GAAS,IAAI,CAAC;QAGlB,SAAI,GAAG,EAAE,CAAC;QAGV,SAAI,GAAG,EAAE,CAAC;QAGV,YAAO,GAAiB,EAAE,CAAC;QAG3B,oBAAe,GAAG,EAAE,CAAC;QAGrB,iBAAY,GAAG,KAAK,CAAC;QAGrB,iBAAY,GAAG,KAAK,CAAC;IAkEtB,CAAC;IA9DA,IAAI,QAAQ;QACX,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC;IACzC,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC;IACzC,CAAC;IAED,IAAI,iBAAiB;QACpB,IAAI,IAAI,CAAC,OAAO;YAAE,OAAO,IAAI,CAAC,OAAO,CAAC;QACtC,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,eAAe,CAAC;QAC3D,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,MAAM,CAAC;QACjC,OAAO,MAAM,CAAC;IACf,CAAC;IAEQ,iBAAiB;QACzB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,cAAc,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;QAC1E,iEAAiE;QACjE,iEAAiE;QACjE,iEAAiE;QACjE,8DAA8D;QAC9D,kEAAkE;QAClE,wCAAwC;QACxC,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;IACxD,CAAC;IAEQ,oBAAoB;QAC5B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE,CAAC;QAClC,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;IACjC,CAAC;IAEO,gBAAgB;QACvB,IAAI,OAAO,GAAG,KAAK,CAAC;QACpB,IAAI,OAAO,GAAG,KAAK,CAAC;QACpB,KAAK,MAAM,IAAI,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC;YAChD,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;gBACtC,IAAI,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE;oBAAE,OAAO,GAAG,IAAI,CAAC;YAC9C,CAAC;iBAAM,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE,CAAC;gBAChD,MAAM,QAAQ,GAAI,IAAgB,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;gBACxD,IAAI,QAAQ,KAAK,MAAM;oBAAE,OAAO,GAAG,IAAI,CAAC;qBACnC,IAAI,CAAC,QAAQ;oBAAE,OAAO,GAAG,IAAI,CAAC;YACpC,CAAC;QACF,CAAC;QACD,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC;IAC7B,CAAC;IAEQ,OAAO;QACf,qEAAqE;QACrE,sEAAsE;QACtE,0DAA0D;QAC1D,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,iBAAiB,KAAK,MAAM,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;YACxF,OAAO,CAAC,IAAI,CAAC,qIAAqI,EAAE,IAAI,CAAC,CAAC;QAC3J,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;;AAzFe,cAAM,GAAG,SAAS,AAAZ,CAAa;AAGnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACjB;AAGzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCACxB;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCACf;AAG3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;gDACrC;AAGrB;IADC,KAAK,EAAE;6CACa;AAGrB;IADC,KAAK,EAAE;6CACa;AAzBT,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CA2FnB"}

package/dist/components/content/tag/tag.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,yBAwMrB,CAAC"}
+{"version":3,"file":"tag.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,yBA6LrB,CAAC"}

package/dist/components/content/tag/tag.styles.js

@@ -5,42 +5,31 @@ export const tagStyles = css `
 	/* # Host */
 
 	:host {
+		--_corner-radius: var(--components-tag-md-corner-radius);
 		--_background-color: var(--components-tag-neutral-background-color);
-		--_content-color: var(--components-tag-neutral-content-color);
 		--_min-height: var(--primitives-space-24);
 		--_inline-padding: var(--primitives-space-6);
 		--_gap: var(--primitives-space-3);
+		--_content-color: var(--components-tag-neutral-content-color);
 		--_font: var(--primitives-font-body-sm-bold-flat);
 		--_icon-size: var(--primitives-space-16);
 		--_icon-offset-correction: var(--primitives-space-1);
-		--_corner-radius: var(--components-tag-md-corner-radius);
 
 		display: inline-flex;
 		vertical-align: middle;
 	}
 
 	:host([size="sm"]) {
+		--_corner-radius: var(--components-tag-sm-corner-radius);
 		--_min-height: var(--primitives-space-20);
 		--_inline-padding: var(--primitives-space-4);
 		--_gap: var(--primitives-space-2);
 		--_font: var(--primitives-font-body-xs-bold-flat);
 		--_icon-size: var(--primitives-space-14);
-		--_corner-radius: var(--components-tag-sm-corner-radius);
-	}
-
-	:host([hidden]) {
-		display: none;
 	}
 
-
 	/* ## Color */
 
-	:host([color="neutral"]),
-	:host(:not([color])) {
-		--_background-color: var(--components-tag-neutral-background-color);
-		--_content-color: var(--components-tag-neutral-content-color);
-	}
-
 	:host([color="accent"]) {
 		--_background-color: var(--components-tag-accent-background-color);
 		--_content-color: var(--components-tag-accent-content-color);
@@ -61,7 +50,6 @@ export const tagStyles = css `
 		--_content-color: var(--components-tag-critical-content-color);
 	}
 
-
 	/* ### Rijkskleuren */
 
 	:host([color="coolgray"]) {
@@ -159,33 +147,37 @@ export const tagStyles = css `
 		--_content-color: var(--components-tag-mintgroen-content-color);
 	}
 
+	:host([hidden]) {
+		display: none;
+	}
+
 
 	/* # Block */
 
 	.tag {
-		display: inline-flex;
-		align-items: center;
 		box-sizing: border-box;
+		display: inline-flex;
+		border-radius: var(--_corner-radius);
+		background-color: var(--_background-color);
 		min-height: var(--_min-height);
 		padding: 0 var(--_inline-padding);
 		gap: var(--_gap);
-		background-color: var(--_background-color);
+		align-items: center;
 		color: var(--_content-color);
-		border-radius: var(--_corner-radius);
-		white-space: nowrap;
 		font: var(--_font);
+		white-space: nowrap;
 	}
 
 
-	/* # Icon */
+	/* # Elements */
 
 	.tag__icon {
 		display: inline-flex;
-		align-items: center;
-		flex-shrink: 0;
+		margin-inline: calc((var(--_min-height) - var(--_icon-size)) / 2 - var(--_inline-padding));
 		width: var(--_icon-size);
 		height: var(--_icon-size);
-		margin-inline: calc((var(--_min-height) - var(--_icon-size)) / 2 - var(--_inline-padding));
+		flex-shrink: 0;
+		align-items: center;
 	}
 
 	.tag__icon:has(+ .tag__text) {
@@ -193,9 +185,6 @@ export const tagStyles = css `
 		margin-right: 0;
 	}
 
-
-	/* # Text */
-
 	.tag__text {
 		display: inline-block;
 	}

package/dist/components/content/tag/tag.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.styles.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwM3B,CAAC"}
+{"version":3,"file":"tag.styles.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6L3B,CAAC"}

package/dist/components/content/tag/tag.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.template.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAExC,wBAAgB,QAAQ,CAAC,SAAS,EAAE,OAAO,wCAyB1C"}
+{"version":3,"file":"tag.template.d.ts","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAExC,wBAAgB,QAAQ,CAAC,SAAS,EAAE,OAAO,wCA6B1C"}

package/dist/components/content/tag/tag.template.js

@@ -1,23 +1,27 @@
 import { html, nothing } from 'lit';
 export function template(component) {
-    // Use _hasIcon (covers icon prop én slot="icon") zodat slotted-icon-only
-    // tags ook role="img" + aria-label krijgen — zonder dit zou een tag met
-    // slot="icon" en accessible-label maar geen tekst geen accessible name
-    // hebben (SR kondigt niks aan).
-    const iconOnly = component._hasIcon && !component._hasText && !!component.accessibleLabel;
+    const variant = component._effectiveVariant;
+    // variant=icon always renders the icon area so the icon-placeholder
+    // fallback inside the slot can show when no icon is provided.
+    const showIcon = variant === 'icon' || (variant === 'icon-and-text' && component._hasIcon);
+    const showText = (variant === 'text' || variant === 'icon-and-text') && component._hasText;
+    // icon-only needs an explicit accessible name — the visible text is gone,
+    // so the screen reader has nothing to announce without role="img" +
+    // aria-label. Hidden slot/text isn't projected into the a11y tree.
+    const iconOnly = variant === 'icon' && component._hasIcon && !!component.accessibleLabel;
     return html `
 		<span class="tag"
 			role=${iconOnly ? 'img' : nothing}
 			aria-label=${iconOnly ? component.accessibleLabel : nothing}
 		>
-			${component._hasIcon ? html `
+			${showIcon ? html `
 				<span class="tag__icon">
 					${component.icon
         ? html `<nldd-icon name=${component.icon}></nldd-icon>`
-        : html `<slot name="icon"></slot>`}
+        : html `<slot name="icon">${variant === 'icon' ? html `<nldd-icon name="icon-placeholder"></nldd-icon>` : nothing}</slot>`}
 				</span>
 			` : nothing}
-			${component._hasText ? html `
+			${showText ? html `
 				<span class="tag__text">
 					${component.text ? component.text : html `<slot></slot>`}
 				</span>

package/dist/components/content/tag/tag.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.template.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpC,MAAM,UAAU,QAAQ,CAAC,SAAkB;IAC1C,yEAAyE;IACzE,wEAAwE;IACxE,uEAAuE;IACvE,gCAAgC;IAChC,MAAM,QAAQ,GAAG,SAAS,CAAC,QAAQ,IAAI,CAAC,SAAS,CAAC,QAAQ,IAAI,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC;IAC1F,OAAO,IAAI,CAAA;;UAEF,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;gBACpB,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,CAAC,OAAO;;KAEzD,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;;OAEvB,SAAS,CAAC,IAAI;QACf,CAAC,CAAC,IAAI,CAAA,mBAAmB,SAAS,CAAC,IAAI,eAAe;QACtD,CAAC,CAAC,IAAI,CAAA,2BAA2B;;IAEnC,CAAC,CAAC,CAAC,OAAO;KACT,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;;OAEvB,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,eAAe;;IAExD,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC"}
+{"version":3,"file":"tag.template.js","sourceRoot":"","sources":["../../../../src/components/content/tag/tag.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpC,MAAM,UAAU,QAAQ,CAAC,SAAkB;IAC1C,MAAM,OAAO,GAAG,SAAS,CAAC,iBAAiB,CAAC;IAC5C,oEAAoE;IACpE,8DAA8D;IAC9D,MAAM,QAAQ,GAAG,OAAO,KAAK,MAAM,IAAI,CAAC,OAAO,KAAK,eAAe,IAAI,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC3F,MAAM,QAAQ,GAAG,CAAC,OAAO,KAAK,MAAM,IAAI,OAAO,KAAK,eAAe,CAAC,IAAI,SAAS,CAAC,QAAQ,CAAC;IAC3F,0EAA0E;IAC1E,oEAAoE;IACpE,mEAAmE;IACnE,MAAM,QAAQ,GAAG,OAAO,KAAK,MAAM,IAAI,SAAS,CAAC,QAAQ,IAAI,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC;IACzF,OAAO,IAAI,CAAA;;UAEF,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;gBACpB,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,CAAC,OAAO;;KAEzD,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;;OAEb,SAAS,CAAC,IAAI;QACf,CAAC,CAAC,IAAI,CAAA,mBAAmB,SAAS,CAAC,IAAI,eAAe;QACtD,CAAC,CAAC,IAAI,CAAA,qBAAqB,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,iDAAiD,CAAC,CAAC,CAAC,OAAO,SAAS;;IAE1H,CAAC,CAAC,CAAC,OAAO;KACT,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;;OAEb,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,eAAe;;IAExD,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC"}

package/dist/components/content/title/title.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"title.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/title/title.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,WAAW,yBAuOvB,CAAC"}
+{"version":3,"file":"title.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/content/title/title.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,WAAW,yBA0NvB,CAAC"}