@nldd/design-system 0.8.91 → 0.8.93

package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/sidebar-section/sidebar-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AACzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,kBAAkB,GAAG,cAAc,CAsDpF"}
+{"version":3,"file":"sidebar-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/sidebar-section/sidebar-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AACzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,kBAAkB,GAAG,cAAc,CA4DpF"}

package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.js

@@ -8,7 +8,10 @@ export function sidebarSectionTemplate(component) {
 				<header class="sidebar-section__header"
 					hidden
 				>
-					<slot name="header" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="header"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</header>
 				<div class="sidebar-section__columns">
 					${!collapsed ? html `
@@ -27,7 +30,10 @@ export function sidebarSectionTemplate(component) {
 				<footer class="sidebar-section__footer"
 					hidden
 				>
-					<slot name="footer" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="footer"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</footer>
 			</div>
 		</section>

package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/sidebar-section/sidebar-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAGzD,MAAM,UAAU,sBAAsB,CAAC,SAA6B;IACnE,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC;IACtC,MAAM,YAAY,GAAG,SAAS,CAAC,qBAAqB,CAAC;IACrD,OAAO,IAAI,CAAA;;;;;;uCAM2B,SAAS,CAAC,aAAa;;;OAGvD,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA;;oBAEJ,YAAY;;;;;;MAM1B,CAAC,CAAC,CAAC,OAAO;;;;;;;;uCAQuB,SAAS,CAAC,aAAa;;;;;;sBAMxC,YAAY;WACvB,SAAS,CAAC,YAAY;YACrB,SAAS,CAAC,aAAa;;KAE9B,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;;;cAOP,YAAY;sBACJ,SAAS,CAAC,iBAAiB;;;;;IAK7C,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC"}
+{"version":3,"file":"sidebar-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/sidebar-section/sidebar-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAGzD,MAAM,UAAU,sBAAsB,CAAC,SAA6B;IACnE,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC;IACtC,MAAM,YAAY,GAAG,SAAS,CAAC,qBAAqB,CAAC;IACrD,OAAO,IAAI,CAAA;;;;;;;;oBAQQ,SAAS,CAAC,aAAa;;;;OAIpC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA;;oBAEJ,YAAY;;;;;;MAM1B,CAAC,CAAC,CAAC,OAAO;;;;;;;;;;oBAUI,SAAS,CAAC,aAAa;;;;;;;sBAOrB,YAAY;WACvB,SAAS,CAAC,YAAY;YACrB,SAAS,CAAC,aAAa;;KAE9B,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;;;cAOP,YAAY;sBACJ,SAAS,CAAC,iBAAiB;;;;;IAK7C,CAAC,CAAC,CAAC,OAAO;;EAEZ,CAAC;AACH,CAAC"}

package/dist/components/layout/page-sections/simple-section/simple-section.d.ts

@@ -5,29 +5,35 @@
  * Contains optional header and footer slots. The padding and spacing between
  * slots adjust automatically via container queries.
  *
- * @element nldd-simple-section
+ * Use one section per content block and repeat the section rather than
+ * building columns inside one: the section sets the reading width and the
+ * padding itself. For two columns there are nldd-one-half-one-half-section,
+ * nldd-two-thirds-one-third-section, nldd-one-third-two-thirds-section and
+ * nldd-sidebar-section. Give a section its surface with `background` instead
+ * of a background color of your own; that is how the components inside know
+ * which surface they are on.
  *
- * @slot header - Content above the main content
- * @slot - Main content
- * @slot footer - Content below the main content
+ * @element nldd-simple-section
  *
  * @attr {'inherit'|'base'|'tinted'} [background] - Surface background ('inherit' default; 'base'/'tinted' paint and cascade a surface).
- * @attr {'inherit'|'light'|'dark'|'inverted'} [scheme] - Color scheme ('inherit' default; 'inverted' = opposite of the surrounding page scheme).
  * @attr {string} [width] - Body max-width: 'full' removes the constraint so the section spans the full available width. Any CSS length (e.g. '480px') overrides the default max-width.
- * @attr {'left'|'center'|'right'} [horizontal-alignment] - Where the body's children sit across the body ('left' default). Use it to place something narrower than the body, such as a container with a max-width.
- * @attr {'top'|'center'|'bottom'} [vertical-alignment] - Where the body's children sit down the section ('top' default). Only visible when the section is taller than its content.
  * @attr {string} [height] - Minimum section height (any CSS length, e.g. '400px', '100dvh') (mirrors width, which sets the body max-width).
  * @attr {string} [padding-block] - Block (top and bottom) padding override (token 0-96; '0' strips it).
  * @attr {string} [padding-top] - Top padding override.
  * @attr {string} [padding-bottom] - Bottom padding override.
  * @attr {string} [sm-padding-block] - Responsive block padding (sm/md/lg, also per edge: {sm,md,lg}-padding-{top,bottom}).
+ * @attr {'left'|'center'|'right'} [horizontal-alignment] - Where the body's children sit across the body ('left' default). Use it to place something narrower than the body, such as a container with a max-width.
+ * @attr {'top'|'center'|'bottom'} [vertical-alignment] - Where the body's children sit down the section ('top' default). Only visible when the section is taller than its content.
+ *
+ * @slot header - Content above the main content
+ * @slot - Main content
+ * @slot footer - Content below the main content
  */
 import { LitElement } from 'lit';
 type HorizontalAlignment = 'left' | 'center' | 'right';
 type VerticalAlignment = 'top' | 'center' | 'bottom';
 declare const NLDDSimpleSection_base: typeof LitElement & (new (...args: any[]) => LitElement & {
     background: import("../../../../utilities/page-section-mixin.js").PageSectionBackground;
-    scheme: import("../../../../utilities/page-section-mixin.js").PageSectionScheme;
     paddingBlock?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;
     paddingTop?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;
     paddingBottom?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;

package/dist/components/layout/page-sections/simple-section/simple-section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"simple-section.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,KAAK,mBAAmB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AACvD,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;;;;;;;;;;;;;;;;;;;AAErD,qBACa,iBAAkB,SAAQ,sBAA4B;IAClE,OAAgB,MAAM,0BAAuB;IAE7C,qEAAqE;IAErE,KAAK,SAAM;IAEX,8EAA8E;IAE9E,mBAAmB,EAAE,mBAAmB,CAAU;IAGlD,iBAAiB,EAAE,iBAAiB,CAAS;IAEpC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAetD,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}
+{"version":3,"file":"simple-section.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,KAAK,mBAAmB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AACvD,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;;;;;;;;;;;;;;;;;;AAErD,qBACa,iBAAkB,SAAQ,sBAA4B;IAClE,OAAgB,MAAM,0BAAuB;IAE7C,qEAAqE;IAErE,KAAK,SAAM;IAEX,8EAA8E;IAE9E,mBAAmB,EAAE,mBAAmB,CAAU;IAGlD,iBAAiB,EAAE,iBAAiB,CAAS;IAEpC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAetD,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}

package/dist/components/layout/page-sections/simple-section/simple-section.js

@@ -11,22 +11,29 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  * Contains optional header and footer slots. The padding and spacing between
  * slots adjust automatically via container queries.
  *
- * @element nldd-simple-section
+ * Use one section per content block and repeat the section rather than
+ * building columns inside one: the section sets the reading width and the
+ * padding itself. For two columns there are nldd-one-half-one-half-section,
+ * nldd-two-thirds-one-third-section, nldd-one-third-two-thirds-section and
+ * nldd-sidebar-section. Give a section its surface with `background` instead
+ * of a background color of your own; that is how the components inside know
+ * which surface they are on.
  *
- * @slot header - Content above the main content
- * @slot - Main content
- * @slot footer - Content below the main content
+ * @element nldd-simple-section
  *
  * @attr {'inherit'|'base'|'tinted'} [background] - Surface background ('inherit' default; 'base'/'tinted' paint and cascade a surface).
- * @attr {'inherit'|'light'|'dark'|'inverted'} [scheme] - Color scheme ('inherit' default; 'inverted' = opposite of the surrounding page scheme).
  * @attr {string} [width] - Body max-width: 'full' removes the constraint so the section spans the full available width. Any CSS length (e.g. '480px') overrides the default max-width.
- * @attr {'left'|'center'|'right'} [horizontal-alignment] - Where the body's children sit across the body ('left' default). Use it to place something narrower than the body, such as a container with a max-width.
- * @attr {'top'|'center'|'bottom'} [vertical-alignment] - Where the body's children sit down the section ('top' default). Only visible when the section is taller than its content.
  * @attr {string} [height] - Minimum section height (any CSS length, e.g. '400px', '100dvh') (mirrors width, which sets the body max-width).
  * @attr {string} [padding-block] - Block (top and bottom) padding override (token 0-96; '0' strips it).
  * @attr {string} [padding-top] - Top padding override.
  * @attr {string} [padding-bottom] - Bottom padding override.
  * @attr {string} [sm-padding-block] - Responsive block padding (sm/md/lg, also per edge: {sm,md,lg}-padding-{top,bottom}).
+ * @attr {'left'|'center'|'right'} [horizontal-alignment] - Where the body's children sit across the body ('left' default). Use it to place something narrower than the body, such as a container with a max-width.
+ * @attr {'top'|'center'|'bottom'} [vertical-alignment] - Where the body's children sit down the section ('top' default). Only visible when the section is taller than its content.
+ *
+ * @slot header - Content above the main content
+ * @slot - Main content
+ * @slot footer - Content below the main content
  */
 import { LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';

package/dist/components/layout/page-sections/simple-section/simple-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-section.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,iBAAiB,EAAE,MAAM,8CAA8C,CAAC;AACjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AAM9D,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,gBAAgB,CAAC,UAAU,CAAC;IAA5D;;QAGN,qEAAqE;QAErE,UAAK,GAAG,EAAE,CAAC;QAEX,8EAA8E;QAE9E,wBAAmB,GAAwB,MAAM,CAAC;QAGlD,sBAAiB,GAAsB,KAAK,CAAC;IAoB9C,CAAC;IAlBS,OAAO,CAAC,iBAAuC;QACvD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACpC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YACrB,iEAAiE;YACjE,0DAA0D;YAC1D,2DAA2D;YAC3D,IAAI,CAAC,IAAI,CAAC,KAAK,MAAM,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC;gBACvD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;YAC3C,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;YAC3C,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,qBAAqB,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;;AA9Be,wBAAM,GAAG,mBAAmB,AAAtB,CAAuB;AAI7C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAC/B;AAIX;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,sBAAsB,EAAE,SAAS,EAAE,iBAAiB,CAAsB,MAAM,CAAC,EAAE,CAAC;8DACxE;AAGlD;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,oBAAoB,EAAE,SAAS,EAAE,iBAAiB,CAAoB,KAAK,CAAC,EAAE,CAAC;4DACxE;AAZjC,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CAgC7B"}
+{"version":3,"file":"simple-section.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,iBAAiB,EAAE,MAAM,8CAA8C,CAAC;AACjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AAM9D,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,gBAAgB,CAAC,UAAU,CAAC;IAA5D;;QAGN,qEAAqE;QAErE,UAAK,GAAG,EAAE,CAAC;QAEX,8EAA8E;QAE9E,wBAAmB,GAAwB,MAAM,CAAC;QAGlD,sBAAiB,GAAsB,KAAK,CAAC;IAoB9C,CAAC;IAlBS,OAAO,CAAC,iBAAuC;QACvD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACpC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YACrB,iEAAiE;YACjE,0DAA0D;YAC1D,2DAA2D;YAC3D,IAAI,CAAC,IAAI,CAAC,KAAK,MAAM,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC;gBACvD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;YAC3C,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;YAC3C,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,qBAAqB,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;;AA9Be,wBAAM,GAAG,mBAAmB,AAAtB,CAAuB;AAI7C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAC/B;AAIX;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,sBAAsB,EAAE,SAAS,EAAE,iBAAiB,CAAsB,MAAM,CAAC,EAAE,CAAC;8DACxE;AAGlD;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,oBAAoB,EAAE,SAAS,EAAE,iBAAiB,CAAoB,KAAK,CAAC,EAAE,CAAC;4DACxE;AAZjC,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CAgC7B"}

package/dist/components/layout/page-sections/simple-section/simple-section.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"simple-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,iBAAiB,GAAG,cAAc,CAoBlF"}
+{"version":3,"file":"simple-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,iBAAiB,GAAG,cAAc,CA0BlF"}

package/dist/components/layout/page-sections/simple-section/simple-section.template.js

@@ -6,7 +6,10 @@ export function simpleSectionTemplate(component) {
 				<header class="simple-section__header"
 					hidden
 				>
-					<slot name="header" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="header"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</header>
 				<div class="simple-section__main">
 					<slot></slot>
@@ -14,7 +17,10 @@ export function simpleSectionTemplate(component) {
 				<footer class="simple-section__footer"
 					hidden
 				>
-					<slot name="footer" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="footer"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</footer>
 			</div>
 		</section>

package/dist/components/layout/page-sections/simple-section/simple-section.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAG3C,MAAM,UAAU,qBAAqB,CAAC,SAA4B;IACjE,OAAO,IAAI,CAAA;;;;;;uCAM2B,SAAS,CAAC,aAAa;;;;;;;;uCAQvB,SAAS,CAAC,aAAa;;;;EAI5D,CAAC;AACH,CAAC"}
+{"version":3,"file":"simple-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/simple-section/simple-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAG3C,MAAM,UAAU,qBAAqB,CAAC,SAA4B;IACjE,OAAO,IAAI,CAAA;;;;;;;;oBAQQ,SAAS,CAAC,aAAa;;;;;;;;;;;oBAWvB,SAAS,CAAC,aAAa;;;;;EAKzC,CAAC;AACH,CAAC"}

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.d.ts

@@ -7,25 +7,23 @@
  *
  * @element nldd-two-thirds-one-third-section
  *
- * @slot header - Content above the columns
- * @slot - Left column (2/3), alternative for slot="left"
- * @slot left - Left column (2/3)
- * @slot right - Right column (1/3)
- * @slot footer - Content below the columns
- *
  * @attr {'inherit'|'base'|'tinted'} [background] - Surface background ('inherit' default; 'base'/'tinted' paint and cascade a surface).
- * @attr {'inherit'|'light'|'dark'|'inverted'} [scheme] - Color scheme ('inherit' default; 'inverted' = opposite of the surrounding page scheme).
  * @attr {string} [width] - Body max-width: 'full' removes the constraint so the section spans the full available width. Any CSS length (e.g. '480px') overrides the default max-width.
  * @attr {string} [height] - Minimum section height (any CSS length, e.g. '400px', '100dvh') (mirrors width, which sets the body max-width).
  * @attr {string} [padding-block] - Block (top and bottom) padding override (token 0-96; '0' strips it).
  * @attr {string} [padding-top] - Top padding override.
  * @attr {string} [padding-bottom] - Bottom padding override.
  * @attr {string} [sm-padding-block] - Responsive block padding (sm/md/lg, also per edge: {sm,md,lg}-padding-{top,bottom}).
+ *
+ * @slot header - Content above the columns
+ * @slot - Left column (2/3), alternative for slot="left"
+ * @slot left - Left column (2/3)
+ * @slot right - Right column (1/3)
+ * @slot footer - Content below the columns
  */
 import { LitElement } from 'lit';
 declare const NLDDTwoThirdsOneThirdSection_base: typeof LitElement & (new (...args: any[]) => LitElement & {
     background: import("../../../../utilities/page-section-mixin.js").PageSectionBackground;
-    scheme: import("../../../../utilities/page-section-mixin.js").PageSectionScheme;
     paddingBlock?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;
     paddingTop?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;
     paddingBottom?: import("../../../../utilities/page-section-mixin.js").PageSectionPadding;

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"two-thirds-one-third-section.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;;;;;;;;;;;;;;;;;;;AAMjC,qBACa,4BAA6B,SAAQ,iCAA4B;IAC7E,OAAgB,MAAM,0BAAkC;IAExD,qEAAqE;IAErE,KAAK,SAAM;IAEF,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAetD,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mCAAmC,EAAE,4BAA4B,CAAC;KAClE;CACD"}
+{"version":3,"file":"two-thirds-one-third-section.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;;;;;;;;;;;;;;;;;;AAMjC,qBACa,4BAA6B,SAAQ,iCAA4B;IAC7E,OAAgB,MAAM,0BAAkC;IAExD,qEAAqE;IAErE,KAAK,SAAM;IAEF,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAetD,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mCAAmC,EAAE,4BAA4B,CAAC;KAClE;CACD"}

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.js

@@ -13,20 +13,19 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
  *
  * @element nldd-two-thirds-one-third-section
  *
- * @slot header - Content above the columns
- * @slot - Left column (2/3), alternative for slot="left"
- * @slot left - Left column (2/3)
- * @slot right - Right column (1/3)
- * @slot footer - Content below the columns
- *
  * @attr {'inherit'|'base'|'tinted'} [background] - Surface background ('inherit' default; 'base'/'tinted' paint and cascade a surface).
- * @attr {'inherit'|'light'|'dark'|'inverted'} [scheme] - Color scheme ('inherit' default; 'inverted' = opposite of the surrounding page scheme).
  * @attr {string} [width] - Body max-width: 'full' removes the constraint so the section spans the full available width. Any CSS length (e.g. '480px') overrides the default max-width.
  * @attr {string} [height] - Minimum section height (any CSS length, e.g. '400px', '100dvh') (mirrors width, which sets the body max-width).
  * @attr {string} [padding-block] - Block (top and bottom) padding override (token 0-96; '0' strips it).
  * @attr {string} [padding-top] - Top padding override.
  * @attr {string} [padding-bottom] - Bottom padding override.
  * @attr {string} [sm-padding-block] - Responsive block padding (sm/md/lg, also per edge: {sm,md,lg}-padding-{top,bottom}).
+ *
+ * @slot header - Content above the columns
+ * @slot - Left column (2/3), alternative for slot="left"
+ * @slot left - Left column (2/3)
+ * @slot right - Right column (1/3)
+ * @slot footer - Content below the columns
  */
 import { LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"two-thirds-one-third-section.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,8BAA8B,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,gCAAgC,EAAE,MAAM,4CAA4C,CAAC;AAGvF,IAAM,4BAA4B,GAAlC,MAAM,4BAA6B,SAAQ,gBAAgB,CAAC,UAAU,CAAC;IAAvE;;QAGN,qEAAqE;QAErE,UAAK,GAAG,EAAE,CAAC;IAoBZ,CAAC;IAlBS,OAAO,CAAC,iBAAuC;QACvD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACpC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YACrB,iEAAiE;YACjE,0DAA0D;YAC1D,2DAA2D;YAC3D,IAAI,CAAC,IAAI,CAAC,KAAK,MAAM,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC;gBACvD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;YAC3C,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;YAC3C,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,gCAAgC,CAAC,IAAI,CAAC,CAAC;IAC/C,CAAC;;AAvBe,mCAAM,GAAG,8BAA8B,AAAjC,CAAkC;AAIxD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DAC/B;AALC,4BAA4B;IADxC,aAAa,CAAC,mCAAmC,CAAC;GACtC,4BAA4B,CAyBxC"}
+{"version":3,"file":"two-thirds-one-third-section.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,8BAA8B,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,gCAAgC,EAAE,MAAM,4CAA4C,CAAC;AAGvF,IAAM,4BAA4B,GAAlC,MAAM,4BAA6B,SAAQ,gBAAgB,CAAC,UAAU,CAAC;IAAvE;;QAGN,qEAAqE;QAErE,UAAK,GAAG,EAAE,CAAC;IAoBZ,CAAC;IAlBS,OAAO,CAAC,iBAAuC;QACvD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACpC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YACrB,iEAAiE;YACjE,0DAA0D;YAC1D,2DAA2D;YAC3D,IAAI,CAAC,IAAI,CAAC,KAAK,MAAM,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC;gBACvD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;YAC3C,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;YAC3C,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,MAAM;QACd,OAAO,gCAAgC,CAAC,IAAI,CAAC,CAAC;IAC/C,CAAC;;AAvBe,mCAAM,GAAG,8BAA8B,AAAjC,CAAkC;AAIxD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DAC/B;AALC,4BAA4B;IADxC,aAAa,CAAC,mCAAmC,CAAC;GACtC,4BAA4B,CAyBxC"}

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"two-thirds-one-third-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AAEtF,wBAAgB,gCAAgC,CAAC,SAAS,EAAE,4BAA4B,GAAG,cAAc,CA0BxG"}
+{"version":3,"file":"two-thirds-one-third-section.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAC3C,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AAEtF,wBAAgB,gCAAgC,CAAC,SAAS,EAAE,4BAA4B,GAAG,cAAc,CAgCxG"}

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.js

@@ -6,7 +6,10 @@ export function twoThirdsOneThirdSectionTemplate(component) {
 				<header class="two-thirds-one-third-section__header"
 					hidden
 				>
-					<slot name="header" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="header"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</header>
 				<div class="two-thirds-one-third-section__columns">
 					<div class="two-thirds-one-third-section__left-column">
@@ -20,7 +23,10 @@ export function twoThirdsOneThirdSectionTemplate(component) {
 				<footer class="two-thirds-one-third-section__footer"
 					hidden
 				>
-					<slot name="footer" @slotchange=${component._onSlotChange}></slot>
+					<slot
+						name="footer"
+						@slotchange=${component._onSlotChange}
+					></slot>
 				</footer>
 			</div>
 		</section>

package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"two-thirds-one-third-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAG3C,MAAM,UAAU,gCAAgC,CAAC,SAAuC;IACvF,OAAO,IAAI,CAAA;;;;;;uCAM2B,SAAS,CAAC,aAAa;;;;;;;;;;;;;;uCAcvB,SAAS,CAAC,aAAa;;;;EAI5D,CAAC;AACH,CAAC"}
+{"version":3,"file":"two-thirds-one-third-section.template.js","sourceRoot":"","sources":["../../../../../src/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAG3C,MAAM,UAAU,gCAAgC,CAAC,SAAuC;IACvF,OAAO,IAAI,CAAA;;;;;;;;oBAQQ,SAAS,CAAC,aAAa;;;;;;;;;;;;;;;;;oBAiBvB,SAAS,CAAC,aAAa;;;;;EAKzC,CAAC;AACH,CAAC"}

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

@@ -15,26 +15,30 @@
  *         </nldd-container>
  *     </nldd-popover>
  *
+ * To open it from your own state instead, bind `open` together with the close
+ * event: the popover clears `open` itself on light dismiss, Escape or a click on
+ * its anchor. It needs that anchor to open against.
+ *
  * For a custom focus target inside the popover, put `autofocus` on the child you
  * want. Without it the popover host itself takes focus.
  *
  * @element nldd-popover
  *
+ * @attr {string} width - Width as a CSS length (default: 320px through --components-popover-default-width). A content-based size (`fit-content`, `min-content`, `max-content`, `auto`) is refused: the popover is an inline-size container so slotted components can adapt to it, and its width cannot then come from that same content. Such a value is ignored, with a warning in DEV.
+ * @attr {boolean} sm-full-height - On an sm viewport (where the popover renders as a bottom sheet) fills the whole available height instead of shrinking to its content. No effect on md and up (anchored mode). Opt-in for content-heavy cases such as search results or long detail views; content-sized is the default, following the Apple and Material convention.
  * @attr {string} anchor - ID of the trigger element, used for positioning
  * @attr {string} placement - Floating UI placement (default: 'bottom-start')
- * @attr {string} width - Width as a CSS length (default: 320px through --components-popover-default-width). A content-based size (`fit-content`, `min-content`, `max-content`, `auto`) is refused: the popover is an inline-size container so slotted components can adapt to it, and its width cannot then come from that same content. Such a value is ignored, with a warning in DEV.
  * @attr {string} top - CSS top position. When set (on its own, or together with other edge attributes or `centered`) Floating UI's anchor positioning is skipped and the popover stands free on the screen. The `anchor` is still needed for the ARIA link on the trigger. No effect on sm, where the bottom sheet wins.
- * @attr {string} left - CSS left position. See `top` for the semantics.
  * @attr {string} right - CSS right position. See `top` for the semantics.
  * @attr {string} bottom - CSS bottom position. See `top` for the semantics.
+ * @attr {string} left - CSS left position. See `top` for the semantics.
  * @attr {boolean} centered - Centers both axes on the viewport. Overridable per axis: `centered top="0"` is centered horizontally, aligned to the top. Mirrors CSS `place-items: center` with `align-items`/`justify-items` overrides.
- * @attr {boolean} sm-full-height - On an sm viewport (where the popover renders as a bottom sheet) fills the whole available height instead of shrinking to its content. No effect on md and up (anchored mode). Opt-in for content-heavy cases such as search results or long detail views; content-sized is the default, following the Apple and Material convention.
  * @attr {string} accessible-label - (required) Accessible name (aria-label). Falls back to the i18n default ('Popover') when unset — always give a unique, describing name.
  * @attr {string} role - ARIA role (default: 'dialog'). For informational content (a tooltip callout, a rich-text help panel) without a dialog interaction pattern, set `role="region"`. For menu-style triggers, `role="menu"` plus `aria-haspopup="menu"` on the anchor. The popover never overwrites a role that was set explicitly.
  * @attr {object} translations - Override translation keys; unset keys fall back to the Dutch default.
+ * @attr {boolean} open - Whether the popover is open. Set it to open or close the popover, as an alternative to show() and hide(); opening needs an anchor, and without one it stays unset. The popover clears it itself when it closes another way (Escape, a click outside), so bind it together with the close event.
  *
  * @prop {Element|null} anchorElement - Programmatic anchor (takes precedence over the anchor attribute)
- * @prop {boolean} open - (read-only) Whether the popover is open right now
  *
  * @slot - Free content (an nldd-container with a form or info, for instance)
  *
@@ -51,22 +55,23 @@ import { type Placement } from '@floating-ui/dom';
 import { type NLDDPopoverTranslations } from './popover.i18n.js';
 export declare class NLDDPopover extends LitElement {
     static styles: import("lit").CSSResult;
+    width: string | undefined;
+    smFullHeight: boolean;
     anchor: string;
     anchorElement: Element | null;
     placement: Placement;
-    width: string | undefined;
     top: string | undefined;
-    left: string | undefined;
     right: string | undefined;
     bottom: string | undefined;
+    left: string | undefined;
     centered: boolean;
-    smFullHeight: boolean;
     accessibleLabel: string;
     /**
      * Override one or more translation keys.
      * Unset keys fall back to the Dutch default.
      */
     translations: Partial<NLDDPopoverTranslations>;
+    open: boolean;
     private _isOpen;
     private _hasWarnedLabel;
     private _previousFocus;
@@ -76,7 +81,6 @@ export declare class NLDDPopover extends LitElement {
     private _smQuery;
     private _wasOnSm;
     private _previousAnchorEl;
-    get open(): boolean;
     /** Widths that come from the content instead of from a length. The popover is
      *  an inline-size query container so slotted components can adapt to it, and
      *  containment exists precisely to forbid a box from depending on its own

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

@@ -1 +1 @@
-{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/popover/popover.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAIlG,OAAO,EAA2B,KAAK,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAI1F,qBACa,WAAY,SAAQ,UAAU;IAC1C,OAAgB,MAAM,0BAAiB;IAGvC,MAAM,SAAM;IAGZ,aAAa,EAAE,OAAO,GAAG,IAAI,CAAQ;IAGrC,SAAS,EAAE,SAAS,CAAkB;IAGtC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAO1B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAa;IAGpC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAGrC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAGtC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAGvC,QAAQ,UAAS;IAGjB,YAAY,UAAS;IAGrB,eAAe,SAAM;IAErB;;;OAGG;IAEH,YAAY,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAM;IAEpD,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,eAAe,CAAS;IAChC,OAAO,CAAC,cAAc,CAA4B;IAClD,OAAO,CAAC,6BAA6B,CAAS;IAC9C,8EAA8E;IAC9E,OAAO,CAAC,kBAAkB,CAA6B;IACvD,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,iBAAiB,CAAwB;IAEjD,IAAI,IAAI,IAAI,OAAO,CAElB;IAED;;;;iFAI6E;IAC7E,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAmD;IAEhF,iBAAiB,IAAI,IAAI;IA6BzB,oBAAoB,IAAI,IAAI;IAkC5B,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IA4C/C,OAAO,CAAC,EAAE;IAIV,IAAI,wBAAwB,IAAI,MAAM,CAErC;IAID,IAAI,IAAI,IAAI;IAUZ,OAAO,CAAC,mBAAmB;IAQ3B,IAAI,IAAI,IAAI;IAKZ,MAAM,IAAI,IAAI;IAKd;;;;;;OAMG;IACH,OAAO,CAAC,kBAAkB;IAK1B,oFAAoF;IAC9E,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAuGjC,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,iBAAiB;IA+CzB,OAAO,CAAC,qBAAqB,CAa3B;IAEF;;;;;;;;OAQG;IACH,OAAO,CAAC,iBAAiB,CAAS;IAElC,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,0BAA0B,CAiBhC;IAEF;8EAC0E;IAC1E,OAAO,CAAC,oBAAoB,CAE1B;IAEF;uCACmC;IACnC,OAAO,CAAC,2BAA2B,CAKjC;IAEF,OAAO,CAAC,oBAAoB,CA+B1B;IAOF,OAAO,CAAC,mBAAmB,CAEzB;IAEF,OAAO,CAAC,aAAa,CA+BnB;IAEF,OAAO,CAAC,cAAc,CAqDpB;IAIF,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,cAAc;IAyDb,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,WAAW,CAAC;KAC5B;CACD"}
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/popover/popover.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAIlG,OAAO,EAA2B,KAAK,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAI1F,qBACa,WAAY,SAAQ,UAAU;IAC1C,OAAgB,MAAM,0BAAiB;IAGvC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAG1B,YAAY,UAAS;IAGrB,MAAM,SAAM;IAGZ,aAAa,EAAE,OAAO,GAAG,IAAI,CAAQ;IAGrC,SAAS,EAAE,SAAS,CAAkB;IAOtC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAa;IAGpC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAGtC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAGvC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAGrC,QAAQ,UAAS;IAGjB,eAAe,SAAM;IAErB;;;OAGG;IAEH,YAAY,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAM;IAGpD,IAAI,UAAS;IAEb,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,eAAe,CAAS;IAChC,OAAO,CAAC,cAAc,CAA4B;IAClD,OAAO,CAAC,6BAA6B,CAAS;IAC9C,8EAA8E;IAC9E,OAAO,CAAC,kBAAkB,CAA6B;IACvD,OAAO,CAAC,QAAQ,CAA+B;IAC/C,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,iBAAiB,CAAwB;IAEjD;;;;iFAI6E;IAC7E,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAmD;IAEhF,iBAAiB,IAAI,IAAI;IA6BzB,oBAAoB,IAAI,IAAI;IAkC5B,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAwD/C,OAAO,CAAC,EAAE;IAIV,IAAI,wBAAwB,IAAI,MAAM,CAErC;IAID,IAAI,IAAI,IAAI;IAUZ,OAAO,CAAC,mBAAmB;IAQ3B,IAAI,IAAI,IAAI;IAKZ,MAAM,IAAI,IAAI;IAKd;;;;;;OAMG;IACH,OAAO,CAAC,kBAAkB;IAK1B,oFAAoF;IAC9E,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAuGjC,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,iBAAiB;IA+CzB,OAAO,CAAC,qBAAqB,CAa3B;IAEF;;;;;;;;OAQG;IACH,OAAO,CAAC,iBAAiB,CAAS;IAElC,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,0BAA0B,CAiBhC;IAEF;8EAC0E;IAC1E,OAAO,CAAC,oBAAoB,CAE1B;IAEF;uCACmC;IACnC,OAAO,CAAC,2BAA2B,CAKjC;IAEF,OAAO,CAAC,oBAAoB,CA+B1B;IAOF,OAAO,CAAC,mBAAmB,CAEzB;IAEF,OAAO,CAAC,aAAa,CAgCnB;IAEF,OAAO,CAAC,cAAc,CAqDpB;IAIF,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,cAAc;IAyDb,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,WAAW,CAAC;KAC5B;CACD"}

package/dist/components/layout/popover/popover.js

@@ -15,26 +15,30 @@
  *         </nldd-container>
  *     </nldd-popover>
  *
+ * To open it from your own state instead, bind `open` together with the close
+ * event: the popover clears `open` itself on light dismiss, Escape or a click on
+ * its anchor. It needs that anchor to open against.
+ *
  * For a custom focus target inside the popover, put `autofocus` on the child you
  * want. Without it the popover host itself takes focus.
  *
  * @element nldd-popover
  *
+ * @attr {string} width - Width as a CSS length (default: 320px through --components-popover-default-width). A content-based size (`fit-content`, `min-content`, `max-content`, `auto`) is refused: the popover is an inline-size container so slotted components can adapt to it, and its width cannot then come from that same content. Such a value is ignored, with a warning in DEV.
+ * @attr {boolean} sm-full-height - On an sm viewport (where the popover renders as a bottom sheet) fills the whole available height instead of shrinking to its content. No effect on md and up (anchored mode). Opt-in for content-heavy cases such as search results or long detail views; content-sized is the default, following the Apple and Material convention.
  * @attr {string} anchor - ID of the trigger element, used for positioning
  * @attr {string} placement - Floating UI placement (default: 'bottom-start')
- * @attr {string} width - Width as a CSS length (default: 320px through --components-popover-default-width). A content-based size (`fit-content`, `min-content`, `max-content`, `auto`) is refused: the popover is an inline-size container so slotted components can adapt to it, and its width cannot then come from that same content. Such a value is ignored, with a warning in DEV.
  * @attr {string} top - CSS top position. When set (on its own, or together with other edge attributes or `centered`) Floating UI's anchor positioning is skipped and the popover stands free on the screen. The `anchor` is still needed for the ARIA link on the trigger. No effect on sm, where the bottom sheet wins.
- * @attr {string} left - CSS left position. See `top` for the semantics.
  * @attr {string} right - CSS right position. See `top` for the semantics.
  * @attr {string} bottom - CSS bottom position. See `top` for the semantics.
+ * @attr {string} left - CSS left position. See `top` for the semantics.
  * @attr {boolean} centered - Centers both axes on the viewport. Overridable per axis: `centered top="0"` is centered horizontally, aligned to the top. Mirrors CSS `place-items: center` with `align-items`/`justify-items` overrides.
- * @attr {boolean} sm-full-height - On an sm viewport (where the popover renders as a bottom sheet) fills the whole available height instead of shrinking to its content. No effect on md and up (anchored mode). Opt-in for content-heavy cases such as search results or long detail views; content-sized is the default, following the Apple and Material convention.
  * @attr {string} accessible-label - (required) Accessible name (aria-label). Falls back to the i18n default ('Popover') when unset — always give a unique, describing name.
  * @attr {string} role - ARIA role (default: 'dialog'). For informational content (a tooltip callout, a rich-text help panel) without a dialog interaction pattern, set `role="region"`. For menu-style triggers, `role="menu"` plus `aria-haspopup="menu"` on the anchor. The popover never overwrites a role that was set explicitly.
  * @attr {object} translations - Override translation keys; unset keys fall back to the Dutch default.
+ * @attr {boolean} open - Whether the popover is open. Set it to open or close the popover, as an alternative to show() and hide(); opening needs an anchor, and without one it stays unset. The popover clears it itself when it closes another way (Escape, a click outside), so bind it together with the close event.
  *
  * @prop {Element|null} anchorElement - Programmatic anchor (takes precedence over the anchor attribute)
- * @prop {boolean} open - (read-only) Whether the popover is open right now
  *
  * @slot - Free content (an nldd-container with a form or info, for instance)
  *
@@ -65,6 +69,7 @@ import { breakpoints } from '../../../assets/styles/breakpoints.js';
 let NLDDPopover = NLDDPopover_1 = class NLDDPopover extends LitElement {
     constructor() {
         super(...arguments);
+        this.smFullHeight = false;
         this.anchor = '';
         this.anchorElement = null;
         this.placement = 'bottom-start';
@@ -73,17 +78,17 @@ let NLDDPopover = NLDDPopover_1 = class NLDDPopover extends LitElement {
         // in the DOM, which is noisy and could trip `[top]` attribute selectors in
         // consumer stylesheets. The hasOverride checks treat both as falsy.
         this.top = undefined;
-        this.left = undefined;
         this.right = undefined;
         this.bottom = undefined;
+        this.left = undefined;
         this.centered = false;
-        this.smFullHeight = false;
         this.accessibleLabel = '';
         /**
          * Override one or more translation keys.
          * Unset keys fall back to the Dutch default.
          */
         this.translations = {};
+        this.open = false;
         this._isOpen = false;
         this._hasWarnedLabel = false;
         this._previousFocus = null;
@@ -203,6 +208,7 @@ let NLDDPopover = NLDDPopover_1 = class NLDDPopover extends LitElement {
         this._handleToggle = async (event) => {
             const toggleEvent = event;
             this._isOpen = toggleEvent.newState === 'open';
+            this.open = this._isOpen;
             this._updateAnchorAria(this._isOpen);
             if (toggleEvent.newState !== 'open') {
                 // Stop scroll/resize tracking, no longer needed once closed.
@@ -285,9 +291,6 @@ let NLDDPopover = NLDDPopover_1 = class NLDDPopover extends LitElement {
             // which no Tab stop ever showed a focus ring again.
         };
     }
-    get open() {
-        return this._isOpen;
-    }
     connectedCallback() {
         super.connectedCallback();
         this.style.containerType = 'inline-size';
@@ -354,6 +357,20 @@ let NLDDPopover = NLDDPopover_1 = class NLDDPopover extends LitElement {
         this._previousAnchorEl = null;
     }
     updated(changed) {
+        if (changed.has('open')) {
+            const showing = this.matches(':popover-open');
+            // _isOpen is what the last toggle reported: an `open` that only echoes
+            // that report is not a request to open.
+            if (this.open && !showing && !this._isOpen) {
+                this.show();
+                // No anchor to open against: say so in the attribute, too.
+                if (!this.matches(':popover-open'))
+                    this.open = false;
+            }
+            else if (!this.open && showing) {
+                this.hidePopover();
+            }
+        }
         // Set width via the CSS variable so media-query overrides (bottom
         // sheet on sm) keep working. Inline `style.width` would beat them.
         if (changed.has('width')) {
@@ -696,6 +713,12 @@ NLDDPopover.styles = popoverStyles;
  *  contents in that axis. CSS resolves the cycle by making the box zero wide,
  *  which is invisible on screen and hard to trace back; better to say no. */
 NLDDPopover.CONTENT_WIDTHS = /^(auto|fit-content|min-content|max-content)\b/;
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDPopover.prototype, "width", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'sm-full-height' })
+], NLDDPopover.prototype, "smFullHeight", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDPopover.prototype, "anchor", void 0);
@@ -705,33 +728,30 @@ __decorate([
 __decorate([
     property({ reflect: true, converter: reflectNonDefault('bottom-start') })
 ], NLDDPopover.prototype, "placement", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], NLDDPopover.prototype, "width", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDPopover.prototype, "top", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], NLDDPopover.prototype, "left", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDPopover.prototype, "right", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NLDDPopover.prototype, "bottom", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDPopover.prototype, "left", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NLDDPopover.prototype, "centered", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true, attribute: 'sm-full-height' })
-], NLDDPopover.prototype, "smFullHeight", void 0);
 __decorate([
     property({ type: String, attribute: 'accessible-label' })
 ], NLDDPopover.prototype, "accessibleLabel", void 0);
 __decorate([
     property({ type: Object })
 ], NLDDPopover.prototype, "translations", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NLDDPopover.prototype, "open", void 0);
 NLDDPopover = NLDDPopover_1 = __decorate([
     customElement('nldd-popover')
 ], NLDDPopover);