@nldd/design-system 0.8.41 → 0.8.42

package/dist/components/inputs/text-field/text-field.d.ts

@@ -61,8 +61,12 @@ export declare class NLDDTextField extends LitElement {
     formStateRestoreCallback(state: File | string | FormData | null): void;
     _handleInput(e: Event): void;
     _handleChange(e: Event): void;
-    focus(): void;
     blur(): void;
+    /**
+     * Delegates focus to the inner native `<input>`, so consumers can call
+     * `textFieldEl.focus()` without reaching into shadow DOM.
+     */
+    focus(options?: FocusOptions): void;
     render(): import("lit-html").TemplateResult;
 }
 declare global {

package/dist/components/inputs/text-field/text-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/inputs/text-field/text-field.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKtD,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,CAAC;AAEzD,qBACa,aAAc,SAAQ,UAAU;IAC5C,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAgB,iBAAiB;;;;;;;MAG/B;IAEF,OAAgB,MAAM,0BAAmB;IAEzC,OAAO,CAAC,UAAU,CAA0B;IAE5C,OAAO,CAAC,aAAa,CAAM;IAG3B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAQ;IAGzB,KAAK,SAAM;IAGX,OAAO,SAAM;IAGb,WAAW,SAAM;IAGjB,OAAO,UAAS;IAGhB,KAAK,UAAS;IAGd,QAAQ,UAAS;IAGjB,IAAI,EAAE,SAAS,CAAU;IAGzB,IAAI,SAAM;IAGV,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,YAAY,SAAM;IAElB,6FAA6F;IAE7F,eAAe,SAAM;IAGrB,eAAe,SAAM;IAErB,oGAAoG;IAEpG,KAAK,SAAM;IAIX,OAAO,CAAC,MAAM,CAAoB;IAEzB,YAAY,IAAI,IAAI;IAIpB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAS/C,iBAAiB,IAAI,IAAI;IAIzB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAI7C,wBAAwB,CAAC,KAAK,EAAE,IAAI,GAAG,MAAM,GAAG,QAAQ,GAAG,IAAI,GAAG,IAAI;IAI/D,YAAY,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAW5B,aAAa,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAW7B,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIV,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,aAAa,CAAC;KACjC;CACD"}
+{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/inputs/text-field/text-field.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKtD,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,CAAC;AAEzD,qBACa,aAAc,SAAQ,UAAU;IAC5C,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAgB,iBAAiB;;;;;;;MAG/B;IAEF,OAAgB,MAAM,0BAAmB;IAEzC,OAAO,CAAC,UAAU,CAA0B;IAE5C,OAAO,CAAC,aAAa,CAAM;IAG3B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAQ;IAGzB,KAAK,SAAM;IAGX,OAAO,SAAM;IAGb,WAAW,SAAM;IAGjB,OAAO,UAAS;IAGhB,KAAK,UAAS;IAGd,QAAQ,UAAS;IAGjB,IAAI,EAAE,SAAS,CAAU;IAGzB,IAAI,SAAM;IAGV,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,YAAY,SAAM;IAElB,6FAA6F;IAE7F,eAAe,SAAM;IAGrB,eAAe,SAAM;IAErB,oGAAoG;IAEpG,KAAK,SAAM;IAIX,OAAO,CAAC,MAAM,CAAoB;IAEzB,YAAY,IAAI,IAAI;IAIpB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAS/C,iBAAiB,IAAI,IAAI;IAIzB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAI7C,wBAAwB,CAAC,KAAK,EAAE,IAAI,GAAG,MAAM,GAAG,QAAQ,GAAG,IAAI,GAAG,IAAI;IAI/D,YAAY,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAW5B,aAAa,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAW7B,IAAI,IAAI,IAAI;IAInB;;;OAGG;IACM,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAInC,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,aAAa,CAAC;KACjC;CACD"}

package/dist/components/inputs/text-field/text-field.js

@@ -95,12 +95,16 @@ let NLDDTextField = class NLDDTextField extends LitElement {
             composed: true,
         }));
     }
-    focus() {
-        this._input?.focus();
-    }
     blur() {
         this._input?.blur();
     }
+    /**
+     * Delegates focus to the inner native `<input>`, so consumers can call
+     * `textFieldEl.focus()` without reaching into shadow DOM.
+     */
+    focus(options) {
+        this._input?.focus(options);
+    }
     render() {
         return textFieldTemplate(this);
     }

package/dist/components/inputs/text-field/text-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/inputs/text-field/text-field.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAuB,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAKtD,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAUE,eAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEpC,kBAAa,GAAG,EAAE,CAAC;QAG3B,SAAI,GAAgB,IAAI,CAAC;QAGzB,UAAK,GAAG,EAAE,CAAC;QAGX,YAAO,GAAG,EAAE,CAAC;QAGb,gBAAW,GAAG,EAAE,CAAC;QAGjB,YAAO,GAAG,KAAK,CAAC;QAGhB,UAAK,GAAG,KAAK,CAAC;QAGd,aAAQ,GAAG,KAAK,CAAC;QAGjB,SAAI,GAAc,MAAM,CAAC;QAGzB,SAAI,GAAG,EAAE,CAAC;QAGV,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;QAGjB,iBAAY,GAAG,EAAE,CAAC;QAElB,6FAA6F;QAE7F,oBAAe,GAAG,EAAE,CAAC;QAGrB,oBAAe,GAAG,EAAE,CAAC;QAErB,oGAAoG;QAEpG,UAAK,GAAG,EAAE,CAAC;IAgEZ,CAAC;IA1DS,YAAY;QACpB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;IACjC,CAAC;IAEQ,OAAO,CAAC,OAAuB;QACvC,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YAC1B,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC;QACrC,CAAC;QACD,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YAC1B,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;IACF,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;IACjC,CAAC;IAED,oBAAoB,CAAC,QAAiB;QACrC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC1B,CAAC;IAED,wBAAwB,CAAC,KAAsC;QAC9D,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACnD,CAAC;IAEM,YAAY,CAAC,CAAQ;QAC3B,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAC;QAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;QACzB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,OAAO,EAAE;YAC3C,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;YAC7B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACd,CAAC,CAAC,CAAC;IACL,CAAC;IAEM,aAAa,CAAC,CAAQ;QAC5B,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAC;QAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;QACzB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE;YAC5C,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;YAC7B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACd,CAAC,CAAC,CAAC;IACL,CAAC;IAEM,KAAK;QACX,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC;IACtB,CAAC;IAEM,IAAI;QACV,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC;IACrB,CAAC;IAEQ,MAAM;QACd,OAAO,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;;AAzHM,4BAAc,GAAG,IAAI,AAAP,CAAQ;AAEb,+BAAiB,GAAG;IACnC,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACpB,AAHgC,CAG/B;AAEc,oBAAM,GAAG,eAAe,AAAlB,CAAmB;AAOzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CACjB;AAGzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAChB;AAGX;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;8CACrC;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDACV;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAC3B;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CAC7B;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACF;AAGzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CAChC;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDACT;AAIlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;sDACrC;AAGrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;sDACtC;AAIrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CAC/B;AAIH;IADP,KAAK,CAAC,oBAAoB,CAAC;6CACM;AA/DtB,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CA2HzB"}
+{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/inputs/text-field/text-field.ts"],"names":[],"mappings":"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"}

package/dist/components/layout/spacer/spacer.d.ts

@@ -1,17 +1,42 @@
 /**
  * Nederlandse Digitale Dienst Spacer Component (Lit + TypeScript)
  *
+ * Add explicit space between elements. Components in this design system
+ * have no margins of their own — all whitespace is set by a spacer.
+ *
+ * ### Sizing
+ * Use a single `size` attribute for whitespace that's the same at every
+ * viewport. Combine with `sm-size`, `md-size` and/or `lg-size` to override
+ * the size at specific breakpoints (mobile-first cascade is intentionally
+ * avoided — each breakpoint that needs a different value declares it
+ * explicitly):
+ *
+ * - `size` applies at every breakpoint that has no per-viewport override.
+ * - `sm-size` overrides at sm (max-width: 640px).
+ * - `md-size` overrides at md (641px–1007px).
+ * - `lg-size` overrides at lg (min-width: 1008px).
+ *
+ * Use `flexible` (in any of the four attributes) to fill the remaining
+ * space in a flex container.
+ *
  * @element nldd-spacer
  *
- * @attr {string} size - Spacer size: 'flexible' | 'md' | fixed values (2–96)
- * @attr {string} direction - Direction: 'horizontal' | 'vertical' | 'both'
+ * @attr {string} size - Base spacer size. 'flexible' or one of the fixed
+ *   tokens (2–96). Default: '16'.
+ * @attr {string} sm-size - Spacer size at sm breakpoint (max-width: 640px).
+ * @attr {string} md-size - Spacer size at md breakpoint (641px–1007px).
+ * @attr {string} lg-size - Spacer size at lg breakpoint (min-width: 1008px).
+ * @attr {string} direction - Direction: 'horizontal' | 'vertical' | 'both' (default: 'both')
  */
 import { LitElement } from 'lit';
-type SpacerSize = 'flexible' | 'md' | '2' | '4' | '6' | '8' | '10' | '12' | '16' | '20' | '24' | '28' | '32' | '40' | '44' | '48' | '56' | '64' | '80' | '96';
+type SpacerSize = 'flexible' | '2' | '4' | '6' | '8' | '10' | '12' | '16' | '20' | '24' | '28' | '32' | '40' | '44' | '48' | '56' | '64' | '80' | '96';
 type Direction = 'horizontal' | 'vertical' | 'both';
 export declare class NLDDSpacer extends LitElement {
     static styles: import("lit").CSSResult;
     size: SpacerSize;
+    smSize?: SpacerSize;
+    mdSize?: SpacerSize;
+    lgSize?: SpacerSize;
     direction: Direction;
 }
 declare global {

package/dist/components/layout/spacer/spacer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spacer.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,KAAK,UAAU,GACZ,UAAU,GACV,IAAI,GACJ,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,CAAC;AACR,KAAK,SAAS,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CAAC;AAEpD,qBACa,UAAW,SAAQ,UAAU;IACzC,OAAgB,MAAM,0BAAgB;IAGtC,IAAI,EAAE,UAAU,CAAQ;IAGxB,SAAS,EAAE,SAAS,CAAU;CAC9B;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,UAAU,CAAC;KAC1B;CACD"}
+{"version":3,"file":"spacer.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,KAAK,UAAU,GACZ,UAAU,GACV,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,CAAC;AACR,KAAK,SAAS,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CAAC;AAEpD,qBACa,UAAW,SAAQ,UAAU;IACzC,OAAgB,MAAM,0BAAgB;IAGtC,IAAI,EAAE,UAAU,CAAQ;IAGxB,MAAM,CAAC,EAAE,UAAU,CAAC;IAGpB,MAAM,CAAC,EAAE,UAAU,CAAC;IAGpB,MAAM,CAAC,EAAE,UAAU,CAAC;IAGpB,SAAS,EAAE,SAAS,CAAU;CAC9B;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,UAAU,CAAC;KAC1B;CACD"}

package/dist/components/layout/spacer/spacer.js

@@ -7,10 +7,32 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 /**
  * Nederlandse Digitale Dienst Spacer Component (Lit + TypeScript)
  *
+ * Add explicit space between elements. Components in this design system
+ * have no margins of their own — all whitespace is set by a spacer.
+ *
+ * ### Sizing
+ * Use a single `size` attribute for whitespace that's the same at every
+ * viewport. Combine with `sm-size`, `md-size` and/or `lg-size` to override
+ * the size at specific breakpoints (mobile-first cascade is intentionally
+ * avoided — each breakpoint that needs a different value declares it
+ * explicitly):
+ *
+ * - `size` applies at every breakpoint that has no per-viewport override.
+ * - `sm-size` overrides at sm (max-width: 640px).
+ * - `md-size` overrides at md (641px–1007px).
+ * - `lg-size` overrides at lg (min-width: 1008px).
+ *
+ * Use `flexible` (in any of the four attributes) to fill the remaining
+ * space in a flex container.
+ *
  * @element nldd-spacer
  *
- * @attr {string} size - Spacer size: 'flexible' | 'md' | fixed values (2–96)
- * @attr {string} direction - Direction: 'horizontal' | 'vertical' | 'both'
+ * @attr {string} size - Base spacer size. 'flexible' or one of the fixed
+ *   tokens (2–96). Default: '16'.
+ * @attr {string} sm-size - Spacer size at sm breakpoint (max-width: 640px).
+ * @attr {string} md-size - Spacer size at md breakpoint (641px–1007px).
+ * @attr {string} lg-size - Spacer size at lg breakpoint (min-width: 1008px).
+ * @attr {string} direction - Direction: 'horizontal' | 'vertical' | 'both' (default: 'both')
  */
 import { LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
@@ -26,6 +48,15 @@ NLDDSpacer.styles = spacerStyles;
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDSpacer.prototype, "size", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'sm-size' })
+], NLDDSpacer.prototype, "smSize", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'md-size' })
+], NLDDSpacer.prototype, "mdSize", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'lg-size' })
+], NLDDSpacer.prototype, "lgSize", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDSpacer.prototype, "direction", void 0);

package/dist/components/layout/spacer/spacer.js.map

@@ -1 +1 @@
-{"version":3,"file":"spacer.js","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AA0B3C,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAIN,SAAI,GAAe,IAAI,CAAC;QAGxB,cAAS,GAAc,MAAM,CAAC;IAC/B,CAAC;;AAPgB,iBAAM,GAAG,YAAY,AAAf,CAAgB;AAGtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAClB;AAGxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CACZ;AAPlB,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAQtB"}
+{"version":3,"file":"spacer.js","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAyB3C,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAIN,SAAI,GAAe,IAAI,CAAC;QAYxB,cAAS,GAAc,MAAM,CAAC;IAC/B,CAAC;;AAhBgB,iBAAM,GAAG,YAAY,AAAf,CAAgB;AAGtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAClB;AAGxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;0CAC5C;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;0CAC5C;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;0CAC5C;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CACZ;AAhBlB,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAiBtB"}

package/dist/components/layout/spacer/spacer.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spacer.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,yBAwJxB,CAAC"}
+{"version":3,"file":"spacer.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,YAAY,yBAmMxB,CAAC"}

package/dist/components/layout/spacer/spacer.styles.js

@@ -1,13 +1,21 @@
 import { css, unsafeCSS } from 'lit';
 import { breakpoints } from '../../../assets/styles/breakpoints.js';
+const smMax = unsafeCSS(breakpoints.smMax);
+const mdMin = unsafeCSS(breakpoints.mdMin);
+const mdMax = unsafeCSS(breakpoints.mdMax);
+const lgMin = unsafeCSS(breakpoints.lgMin);
 export const spacerStyles = css `
 
 
 	/* # Host */
 
 	:host {
+		--_size: var(--primitives-space-16);
+
 		display: block;
 		flex-shrink: 0;
+		width: var(--_size);
+		height: var(--_size);
 	}
 
 	:host([hidden]) {
@@ -15,142 +23,181 @@ export const spacerStyles = css `
 	}
 
 
-	/* # Flexible and responsive */
-
-	:host([size='flexible']) {
-		flex: 1;
-		min-width: 0;
-		min-height: 0;
-	}
-
-	:host([size='md']) {
-		width: var(--primitives-space-16);
-		height: var(--primitives-space-16);
+	/* # Direction */
 
-		@media (min-width: ${unsafeCSS(breakpoints.smMax)}) {
-			width: var(--primitives-space-24);
-			height: var(--primitives-space-24);
-		}
-	}
-
-
-	/* # Fixed sizes */
-
-	:host([size='2']) {
-		width: var(--primitives-space-2);
-		height: var(--primitives-space-2);
-	}
-
-	:host([size='4']) {
-		width: var(--primitives-space-4);
-		height: var(--primitives-space-4);
-	}
-
-	:host([size='6']) {
-		width: var(--primitives-space-6);
-		height: var(--primitives-space-6);
-	}
-
-	:host([size='16']),
-	:host(:not([size])) {
-		width: var(--primitives-space-16);
-		height: var(--primitives-space-16);
-	}
-
-	:host([size='8']) {
-		width: var(--primitives-space-8);
-		height: var(--primitives-space-8);
-	}
-
-	:host([size='10']) {
-		width: var(--primitives-space-10);
-		height: var(--primitives-space-10);
+	:host([direction="horizontal"]) {
+		height: auto;
 	}
 
-	:host([size='12']) {
-		width: var(--primitives-space-12);
-		height: var(--primitives-space-12);
+	:host([direction="vertical"]) {
+		width: auto;
 	}
 
-	:host([size='16']) {
-		width: var(--primitives-space-16);
-		height: var(--primitives-space-16);
-	}
 
-	:host([size='20']) {
-		width: var(--primitives-space-20);
-		height: var(--primitives-space-20);
-	}
+	/* # Size — applies at every breakpoint */
 
-	:host([size='24']) {
-		width: var(--primitives-space-24);
-		height: var(--primitives-space-24);
-	}
+	:host([size="2"]) { --_size: var(--primitives-space-2); }
+	:host([size="4"]) { --_size: var(--primitives-space-4); }
+	:host([size="6"]) { --_size: var(--primitives-space-6); }
+	:host([size="8"]) { --_size: var(--primitives-space-8); }
+	:host([size="10"]) { --_size: var(--primitives-space-10); }
+	:host([size="12"]) { --_size: var(--primitives-space-12); }
+	:host([size="16"]) { --_size: var(--primitives-space-16); }
+	:host([size="20"]) { --_size: var(--primitives-space-20); }
+	:host([size="24"]) { --_size: var(--primitives-space-24); }
+	:host([size="28"]) { --_size: var(--primitives-space-28); }
+	:host([size="32"]) { --_size: var(--primitives-space-32); }
+	:host([size="40"]) { --_size: var(--primitives-space-40); }
+	:host([size="44"]) { --_size: var(--primitives-space-44); }
+	:host([size="48"]) { --_size: var(--primitives-space-48); }
+	:host([size="56"]) { --_size: var(--primitives-space-56); }
+	:host([size="64"]) { --_size: var(--primitives-space-64); }
+	:host([size="80"]) { --_size: var(--primitives-space-80); }
+	:host([size="96"]) { --_size: var(--primitives-space-96); }
 
-	:host([size='28']) {
-		width: var(--primitives-space-28);
-		height: var(--primitives-space-28);
-	}
+	/* ## Size: flexible — takes all remaining space in the flex parent */
 
-	:host([size='32']) {
-		width: var(--primitives-space-32);
-		height: var(--primitives-space-32);
-	}
-
-	:host([size='40']) {
-		width: var(--primitives-space-40);
-		height: var(--primitives-space-40);
+	:host([size="flexible"]) {
+		flex: 1;
+		min-width: 0;
+		min-height: 0;
+		width: auto;
+		height: auto;
 	}
 
-	:host([size='44']) {
-		width: var(--primitives-space-44);
-		height: var(--primitives-space-44);
+	:host([size="flexible"][direction="horizontal"]) {
+		min-height: auto;
 	}
 
-	:host([size='48']) {
-		width: var(--primitives-space-48);
-		height: var(--primitives-space-48);
+	:host([size="flexible"][direction="vertical"]) {
+		min-width: auto;
 	}
 
-	:host([size='56']) {
-		width: var(--primitives-space-56);
-		height: var(--primitives-space-56);
-	}
 
-	:host([size='64']) {
-		width: var(--primitives-space-64);
-		height: var(--primitives-space-64);
-	}
+	/* # Per-viewport size overrides
+	 *
+	 * Each per-breakpoint attribute (sm-size / md-size / lg-size) sets the
+	 * same --_size local var inside its respective @media query, so it wins
+	 * over the base [size] selector at that breakpoint via cascade source
+	 * order. If only [size] is set, --_size keeps the base value across all
+	 * breakpoints.
+	 */
+
+	/* ## sm: max-width 640px */
+
+	@media (max-width: ${smMax}) {
+		:host([sm-size="2"]) { --_size: var(--primitives-space-2); }
+		:host([sm-size="4"]) { --_size: var(--primitives-space-4); }
+		:host([sm-size="6"]) { --_size: var(--primitives-space-6); }
+		:host([sm-size="8"]) { --_size: var(--primitives-space-8); }
+		:host([sm-size="10"]) { --_size: var(--primitives-space-10); }
+		:host([sm-size="12"]) { --_size: var(--primitives-space-12); }
+		:host([sm-size="16"]) { --_size: var(--primitives-space-16); }
+		:host([sm-size="20"]) { --_size: var(--primitives-space-20); }
+		:host([sm-size="24"]) { --_size: var(--primitives-space-24); }
+		:host([sm-size="28"]) { --_size: var(--primitives-space-28); }
+		:host([sm-size="32"]) { --_size: var(--primitives-space-32); }
+		:host([sm-size="40"]) { --_size: var(--primitives-space-40); }
+		:host([sm-size="44"]) { --_size: var(--primitives-space-44); }
+		:host([sm-size="48"]) { --_size: var(--primitives-space-48); }
+		:host([sm-size="56"]) { --_size: var(--primitives-space-56); }
+		:host([sm-size="64"]) { --_size: var(--primitives-space-64); }
+		:host([sm-size="80"]) { --_size: var(--primitives-space-80); }
+		:host([sm-size="96"]) { --_size: var(--primitives-space-96); }
+
+		:host([sm-size="flexible"]) {
+			flex: 1;
+			min-width: 0;
+			min-height: 0;
+			width: auto;
+			height: auto;
+		}
 
-	:host([size='80']) {
-		width: var(--primitives-space-80);
-		height: var(--primitives-space-80);
-	}
+		:host([sm-size="flexible"][direction="horizontal"]) {
+			min-height: auto;
+		}
 
-	:host([size='96']) {
-		width: var(--primitives-space-96);
-		height: var(--primitives-space-96);
+		:host([sm-size="flexible"][direction="vertical"]) {
+			min-width: auto;
+		}
 	}
 
+	/* ## md: 641px–1007px */
+
+	@media (min-width: ${mdMin}) and (max-width: ${mdMax}) {
+		:host([md-size="2"]) { --_size: var(--primitives-space-2); }
+		:host([md-size="4"]) { --_size: var(--primitives-space-4); }
+		:host([md-size="6"]) { --_size: var(--primitives-space-6); }
+		:host([md-size="8"]) { --_size: var(--primitives-space-8); }
+		:host([md-size="10"]) { --_size: var(--primitives-space-10); }
+		:host([md-size="12"]) { --_size: var(--primitives-space-12); }
+		:host([md-size="16"]) { --_size: var(--primitives-space-16); }
+		:host([md-size="20"]) { --_size: var(--primitives-space-20); }
+		:host([md-size="24"]) { --_size: var(--primitives-space-24); }
+		:host([md-size="28"]) { --_size: var(--primitives-space-28); }
+		:host([md-size="32"]) { --_size: var(--primitives-space-32); }
+		:host([md-size="40"]) { --_size: var(--primitives-space-40); }
+		:host([md-size="44"]) { --_size: var(--primitives-space-44); }
+		:host([md-size="48"]) { --_size: var(--primitives-space-48); }
+		:host([md-size="56"]) { --_size: var(--primitives-space-56); }
+		:host([md-size="64"]) { --_size: var(--primitives-space-64); }
+		:host([md-size="80"]) { --_size: var(--primitives-space-80); }
+		:host([md-size="96"]) { --_size: var(--primitives-space-96); }
+
+		:host([md-size="flexible"]) {
+			flex: 1;
+			min-width: 0;
+			min-height: 0;
+			width: auto;
+			height: auto;
+		}
 
-	/* # Direction modifiers */
+		:host([md-size="flexible"][direction="horizontal"]) {
+			min-height: auto;
+		}
 
-	:host([direction='horizontal']) {
-		height: auto;
+		:host([md-size="flexible"][direction="vertical"]) {
+			min-width: auto;
+		}
 	}
 
-	:host([direction='vertical']) {
-		width: auto;
-	}
+	/* ## lg: min-width 1008px */
+
+	@media (min-width: ${lgMin}) {
+		:host([lg-size="2"]) { --_size: var(--primitives-space-2); }
+		:host([lg-size="4"]) { --_size: var(--primitives-space-4); }
+		:host([lg-size="6"]) { --_size: var(--primitives-space-6); }
+		:host([lg-size="8"]) { --_size: var(--primitives-space-8); }
+		:host([lg-size="10"]) { --_size: var(--primitives-space-10); }
+		:host([lg-size="12"]) { --_size: var(--primitives-space-12); }
+		:host([lg-size="16"]) { --_size: var(--primitives-space-16); }
+		:host([lg-size="20"]) { --_size: var(--primitives-space-20); }
+		:host([lg-size="24"]) { --_size: var(--primitives-space-24); }
+		:host([lg-size="28"]) { --_size: var(--primitives-space-28); }
+		:host([lg-size="32"]) { --_size: var(--primitives-space-32); }
+		:host([lg-size="40"]) { --_size: var(--primitives-space-40); }
+		:host([lg-size="44"]) { --_size: var(--primitives-space-44); }
+		:host([lg-size="48"]) { --_size: var(--primitives-space-48); }
+		:host([lg-size="56"]) { --_size: var(--primitives-space-56); }
+		:host([lg-size="64"]) { --_size: var(--primitives-space-64); }
+		:host([lg-size="80"]) { --_size: var(--primitives-space-80); }
+		:host([lg-size="96"]) { --_size: var(--primitives-space-96); }
+
+		:host([lg-size="flexible"]) {
+			flex: 1;
+			min-width: 0;
+			min-height: 0;
+			width: auto;
+			height: auto;
+		}
 
-	:host([size='flexible'][direction='horizontal']) {
-		height: auto;
-		min-height: auto;
-	}
+		:host([lg-size="flexible"][direction="horizontal"]) {
+			min-height: auto;
+		}
 
-	:host([size='flexible'][direction='vertical']) {
-		width: auto;
-		min-width: auto;
+		:host([lg-size="flexible"][direction="vertical"]) {
+			min-width: auto;
+		}
 	}
 `;
 //# sourceMappingURL=spacer.styles.js.map

package/dist/components/layout/spacer/spacer.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"spacer.styles.js","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEpE,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;uBA2BR,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6HlD,CAAC"}
+{"version":3,"file":"spacer.styles.js","sourceRoot":"","sources":["../../../../src/components/layout/spacer/spacer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEpE,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAE3C,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAiFT,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAuCL,KAAK,qBAAqB,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAuC/B,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoC1B,CAAC"}

package/dist/components/lists-and-menus/cells/icon-cell/icon-cell.d.ts

@@ -8,7 +8,7 @@
  * @element nldd-icon-cell
  * @attr {string} vertical-alignment - Vertical alignment: 'top' | 'center' | 'bottom' (default: 'center')
  * @attr {string} size - Size: '16' | '20' | '24' | '32' (default: '24')
- * @attr {string} color - Color: 'default' | 'inherit' (default: 'default')
+ * @attr {'default' | 'secondary' | 'accent' | 'success' | 'warning' | 'critical'} color - Color variant of the icon (default: 'default')
  * @attr {string} icon - Icon name (renders `<nldd-icon>`). Takes precedence over the default slot.
  *
  * @slot - Fallback for custom icon content when `icon` is not set.
@@ -17,7 +17,7 @@ import { LitElement } from 'lit';
 import '../../../content/icon/icon.js';
 type VerticalAlignment = 'top' | 'center' | 'bottom';
 type Size = '16' | '20' | '24' | '32';
-type Color = 'default' | 'inherit';
+type Color = 'default' | 'secondary' | 'accent' | 'success' | 'warning' | 'critical';
 declare const NLDDIconCell_base: typeof LitElement & (new (...args: any[]) => LitElement & {
     hideBelow?: string;
     hideAbove?: string;

package/dist/components/lists-and-menus/cells/icon-cell/icon-cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-cell.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/icon-cell/icon-cell.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,OAAO,+BAA+B,CAAC;AAEvC,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;AACrD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,KAAK,KAAK,GAAG,SAAS,GAAG,SAAS,CAAC;;;;;AAEnC,qBACa,YAAa,SAAQ,iBAA2B;IAC5D,OAAgB,MAAM,0BAAkB;IAGxC,iBAAiB,EAAE,iBAAiB,CAAY;IAGhD,IAAI,EAAE,IAAI,CAAQ;IAGlB,KAAK,EAAE,KAAK,CAAa;IAGzB,IAAI,SAAM;IAED,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,YAAY,CAAC;KAC/B;CACD"}
+{"version":3,"file":"icon-cell.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/icon-cell/icon-cell.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,OAAO,+BAA+B,CAAC;AAEvC,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;AACrD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,KAAK,KAAK,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;;;;;AAErF,qBACa,YAAa,SAAQ,iBAA2B;IAC5D,OAAgB,MAAM,0BAAkB;IAGxC,iBAAiB,EAAE,iBAAiB,CAAY;IAGhD,IAAI,EAAE,IAAI,CAAQ;IAGlB,KAAK,EAAE,KAAK,CAAa;IAGzB,IAAI,SAAM;IAED,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,YAAY,CAAC;KAC/B;CACD"}

package/dist/components/lists-and-menus/cells/icon-cell/icon-cell.js

@@ -14,7 +14,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  * @element nldd-icon-cell
  * @attr {string} vertical-alignment - Vertical alignment: 'top' | 'center' | 'bottom' (default: 'center')
  * @attr {string} size - Size: '16' | '20' | '24' | '32' (default: '24')
- * @attr {string} color - Color: 'default' | 'inherit' (default: 'default')
+ * @attr {'default' | 'secondary' | 'accent' | 'success' | 'warning' | 'critical'} color - Color variant of the icon (default: 'default')
  * @attr {string} icon - Icon name (renders `<nldd-icon>`). Takes precedence over the default slot.
  *
  * @slot - Fallback for custom icon content when `icon` is not set.

package/dist/components/lists-and-menus/cells/icon-cell/icon-cell.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-cell.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/icon-cell/icon-cell.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAoG1B,CAAC"}
+{"version":3,"file":"icon-cell.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/icon-cell/icon-cell.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAwI1B,CAAC"}