@nldd/design-system 0.8.37

package/dist/components/actions/link/link.d.ts

@@ -0,0 +1,48 @@
+/**
+ * Nederlandse Digitale Dienst Link Component (Lit + TypeScript)
+ *
+ * Standalone hyperlink component voor gebruik buiten lopende tekst (menu's,
+ * actiegebieden, overzichten). Voor inline links in paragrafen gebruik je
+ * <nldd-rich-text> met een standaard <a>.
+ *
+ * @element nldd-link
+ * @attr {string} href - Link doel
+ * @attr {string} target - Link target (bijv. '_blank'); stelt rel automatisch bij
+ * @attr {string} rel - Link rel attribuut; standaard 'noopener noreferrer' bij target='_blank'
+ * @attr {string} size - Tekstgrootte: 'xs' | 'sm' | 'md' | 'lg' (default: 'md')
+ * @attr {string} text - Link tekst (alternatief voor default slot)
+ * @attr {string} start-icon - Icoon voor de tekst
+ * @attr {string} end-icon - Icoon na de tekst
+ * @attr {string} accessible-label - Toegankelijk label voor screen readers
+ * @attr {boolean} disabled - Uitgeschakelde staat
+ *
+ * @slot - Link tekst (alternatief voor text attribuut)
+ * @slot start-icon - Custom icoon voor de tekst
+ * @slot end-icon - Custom icoon na de tekst
+ */
+import { LitElement } from 'lit';
+import './../../content/icon/icon.js';
+type Size = 'xs' | 'sm' | 'md' | 'lg';
+export declare class NLDDLink extends LitElement {
+    static styles: import("lit").CSSResult;
+    href: string | undefined;
+    target: string | undefined;
+    rel: string | undefined;
+    size: Size;
+    text: string;
+    startIcon: string;
+    endIcon: string;
+    accessibleLabel: string;
+    disabled: boolean;
+    private _handleClick;
+    /** @internal */
+    _resolvedRel(): string;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'nldd-link': NLDDLink;
+    }
+}
+export {};
+//# sourceMappingURL=link.d.ts.map

package/dist/components/actions/link/link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/link/link.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,8BAA8B,CAAC;AAEtC,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,qBACa,QAAS,SAAQ,UAAU;IACvC,OAAgB,MAAM,0BAAc;IAGpC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAGrC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAGvC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAa;IAGpC,IAAI,EAAE,IAAI,CAAQ;IAGlB,IAAI,SAAM;IAGV,SAAS,SAAM;IAGf,OAAO,SAAM;IAGb,eAAe,SAAM;IAGrB,QAAQ,UAAS;IAEjB,OAAO,CAAC,YAAY;IAOpB,gBAAgB;IAChB,YAAY,IAAI,MAAM;IASb,MAAM;CAKf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,WAAW,EAAE,QAAQ,CAAC;KACtB;CACD"}

package/dist/components/actions/link/link.js

@@ -0,0 +1,101 @@
+/**
+ * Nederlandse Digitale Dienst Link Component (Lit + TypeScript)
+ *
+ * Standalone hyperlink component voor gebruik buiten lopende tekst (menu's,
+ * actiegebieden, overzichten). Voor inline links in paragrafen gebruik je
+ * <nldd-rich-text> met een standaard <a>.
+ *
+ * @element nldd-link
+ * @attr {string} href - Link doel
+ * @attr {string} target - Link target (bijv. '_blank'); stelt rel automatisch bij
+ * @attr {string} rel - Link rel attribuut; standaard 'noopener noreferrer' bij target='_blank'
+ * @attr {string} size - Tekstgrootte: 'xs' | 'sm' | 'md' | 'lg' (default: 'md')
+ * @attr {string} text - Link tekst (alternatief voor default slot)
+ * @attr {string} start-icon - Icoon voor de tekst
+ * @attr {string} end-icon - Icoon na de tekst
+ * @attr {string} accessible-label - Toegankelijk label voor screen readers
+ * @attr {boolean} disabled - Uitgeschakelde staat
+ *
+ * @slot - Link tekst (alternatief voor text attribuut)
+ * @slot start-icon - Custom icoon voor de tekst
+ * @slot end-icon - Custom icoon na de tekst
+ */
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { linkStyles } from './link.styles.js';
+import { template } from './link.template.js';
+import './../../content/icon/icon.js';
+let NLDDLink = class NLDDLink extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.href = undefined;
+        this.target = undefined;
+        this.rel = undefined;
+        this.size = 'md';
+        this.text = '';
+        this.startIcon = '';
+        this.endIcon = '';
+        this.accessibleLabel = '';
+        this.disabled = false;
+    }
+    _handleClick(e) {
+        if (this.disabled) {
+            e.preventDefault();
+            e.stopPropagation();
+        }
+    }
+    /** @internal */
+    _resolvedRel() {
+        const base = this.rel ?? '';
+        if (this.target !== '_blank')
+            return base;
+        const parts = new Set(base.split(/\s+/).filter(Boolean));
+        parts.add('noopener');
+        parts.add('noreferrer');
+        return [...parts].join(' ');
+    }
+    render() {
+        return template.call(this, {
+            handleClick: this._handleClick.bind(this),
+        });
+    }
+};
+NLDDLink.styles = linkStyles;
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDLink.prototype, "href", void 0);
+__decorate([
+    property({ type: String })
+], NLDDLink.prototype, "target", void 0);
+__decorate([
+    property({ type: String })
+], NLDDLink.prototype, "rel", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDLink.prototype, "size", void 0);
+__decorate([
+    property({ type: String })
+], NLDDLink.prototype, "text", void 0);
+__decorate([
+    property({ type: String, attribute: 'start-icon' })
+], NLDDLink.prototype, "startIcon", void 0);
+__decorate([
+    property({ type: String, attribute: 'end-icon' })
+], NLDDLink.prototype, "endIcon", void 0);
+__decorate([
+    property({ type: String, attribute: 'accessible-label' })
+], NLDDLink.prototype, "accessibleLabel", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NLDDLink.prototype, "disabled", void 0);
+NLDDLink = __decorate([
+    customElement('nldd-link')
+], NLDDLink);
+export { NLDDLink };
+//# sourceMappingURL=link.js.map

package/dist/components/actions/link/link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.js","sourceRoot":"","sources":["../../../../src/components/actions/link/link.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,8BAA8B,CAAC;AAK/B,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QAIN,SAAI,GAAuB,SAAS,CAAC;QAGrC,WAAM,GAAuB,SAAS,CAAC;QAGvC,QAAG,GAAuB,SAAS,CAAC;QAGpC,SAAI,GAAS,IAAI,CAAC;QAGlB,SAAI,GAAG,EAAE,CAAC;QAGV,cAAS,GAAG,EAAE,CAAC;QAGf,YAAO,GAAG,EAAE,CAAC;QAGb,oBAAe,GAAG,EAAE,CAAC;QAGrB,aAAQ,GAAG,KAAK,CAAC;IAwBlB,CAAC;IAtBQ,YAAY,CAAC,CAAa;QACjC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACrB,CAAC;IACF,CAAC;IAED,gBAAgB;IAChB,YAAY;QACX,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,IAAI,EAAE,CAAC;QAC5B,IAAI,IAAI,CAAC,MAAM,KAAK,QAAQ;YAAE,OAAO,IAAI,CAAC;QAC1C,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;QACzD,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QACtB,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QACxB,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC7B,CAAC;IAEQ,MAAM;QACd,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE;YAC1B,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;SACzC,CAAC,CAAC;IACJ,CAAC;;AAlDe,eAAM,GAAG,UAAU,AAAb,CAAc;AAGpC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACL;AAGrC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACY;AAGvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACS;AAGpC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCACxB;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sCACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;2CACrC;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;yCACrC;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;iDACrC;AAGrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAC1B;AA5BL,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAoDpB"}

package/dist/components/actions/link/link.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const linkStyles: import("lit").CSSResult;
+//# sourceMappingURL=link.styles.d.ts.map

package/dist/components/actions/link/link.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/link/link.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,yBA4GtB,CAAC"}

package/dist/components/actions/link/link.styles.js

@@ -0,0 +1,111 @@
+import { css } from 'lit';
+export const linkStyles = css `
+
+
+	/* # Host */
+
+	:host {
+		display: inline-flex;
+		-webkit-tap-highlight-color: transparent;
+	}
+
+	:host([hidden]) {
+		display: none;
+	}
+
+	:host([disabled]) {
+		opacity: var(--primitives-opacity-disabled);
+		pointer-events: none;
+	}
+
+
+	/* # Block */
+
+	.link {
+		appearance: none;
+		background: none;
+		color: var(--semantics-links-color);
+		display: inline-flex;
+		align-items: center;
+		text-decoration: none;
+		border-radius: var(--primitives-corner-radius-xs);
+		transition: color var(--primitives-transition-duration-fast) var(--primitives-transition-easing-default);
+	}
+
+	:host([size="xs"]) .link {
+		gap: var(--primitives-space-4);
+		font: var(--primitives-font-body-xs-regular-flat);
+	}
+
+	:host([size="sm"]) .link {
+		gap: var(--primitives-space-4);
+		font: var(--primitives-font-body-sm-regular-flat);
+	}
+
+	:host([size="md"]) .link,
+	:host(:not([size])) .link {
+		gap: var(--primitives-space-6);
+		font: var(--primitives-font-body-md-regular-flat);
+	}
+
+	:host([size="lg"]) .link {
+		gap: var(--primitives-space-6);
+		font: var(--primitives-font-body-lg-regular-flat);
+	}
+
+	.link:hover {
+		color: var(--semantics-links-is-hovered-color);
+	}
+
+	.link:active {
+		color: var(--semantics-links-is-active-color);
+	}
+
+	.link:focus-visible {
+		outline: var(--semantics-focus-ring-outline);
+		outline-offset: var(--semantics-focus-ring-outline-offset);
+		box-shadow: var(--semantics-focus-ring-box-shadow);
+	}
+
+	.link:focus:not(:focus-visible) {
+		outline: none;
+	}
+
+	@media (prefers-reduced-motion: reduce) {
+		.link {
+			transition: none;
+		}
+	}
+
+
+	/* # Elements */
+
+	.link__label {
+		text-decoration: underline;
+		text-underline-offset: 0.15em;
+	}
+
+	.link:focus-visible .link__label {
+		text-decoration: none;
+	}
+
+	.link__start-icon,
+	.link__end-icon {
+		position: relative;
+		display: inline-flex;
+		align-items: center;
+		flex-shrink: 0;
+		width: 1em;
+		height: 1em;
+	}
+
+
+	/* # Toegankelijkheid */
+
+	@media (forced-colors: active) {
+		.link:focus-visible {
+			outline: 2px solid CanvasText;
+		}
+	}
+`;
+//# sourceMappingURL=link.styles.js.map

package/dist/components/actions/link/link.styles.js.map

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

package/dist/components/actions/link/link.template.d.ts

@@ -0,0 +1,7 @@
+import type { NLDDLink } from './link.js';
+interface TemplateHelpers {
+    handleClick: (e: MouseEvent) => void;
+}
+export declare function template(this: NLDDLink, helpers: TemplateHelpers): import("lit-html").TemplateResult<1>;
+export {};
+//# sourceMappingURL=link.template.d.ts.map

package/dist/components/actions/link/link.template.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.template.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/link/link.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,UAAU,eAAe;IACxB,WAAW,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,QAAQ,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,eAAe,wCA4BhE"}

package/dist/components/actions/link/link.template.js

@@ -0,0 +1,31 @@
+import { html, nothing } from 'lit';
+export function template(helpers) {
+    const resolvedRel = this._resolvedRel();
+    return html `
+		<a class="link"
+			href=${this.disabled ? nothing : (this.href || nothing)}
+			role=${this.disabled ? 'link' : nothing}
+			tabindex=${this.disabled ? '0' : nothing}
+			target=${this.disabled ? nothing : (this.target || nothing)}
+			rel=${this.disabled ? nothing : (resolvedRel || nothing)}
+			aria-disabled=${this.disabled ? 'true' : nothing}
+			aria-label=${this.accessibleLabel || nothing}
+			@click=${helpers.handleClick}
+		>
+			${this.startIcon ? html `
+				<span class="link__start-icon">
+					<nldd-icon name=${this.startIcon}></nldd-icon>
+				</span>
+			` : html `<slot name="start-icon"></slot>`}
+			<span class="link__label">
+				${this.text ? this.text : html `<slot></slot>`}
+			</span>
+			${this.endIcon ? html `
+				<span class="link__end-icon">
+					<nldd-icon name=${this.endIcon}></nldd-icon>
+				</span>
+			` : html `<slot name="end-icon"></slot>`}
+		</a>
+	`;
+}
+//# sourceMappingURL=link.template.js.map

package/dist/components/actions/link/link.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.template.js","sourceRoot":"","sources":["../../../../src/components/actions/link/link.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAOpC,MAAM,UAAU,QAAQ,CAAiB,OAAwB;IAChE,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;IACxC,OAAO,IAAI,CAAA;;UAEF,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,OAAO,CAAC;UAChD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;cAC5B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO;YAC/B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;SACrD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,IAAI,OAAO,CAAC;mBACxC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;gBACnC,IAAI,CAAC,eAAe,IAAI,OAAO;YACnC,OAAO,CAAC,WAAW;;KAE1B,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA;;uBAEH,IAAI,CAAC,SAAS;;IAEjC,CAAC,CAAC,CAAC,IAAI,CAAA,iCAAiC;;MAEtC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,eAAe;;KAE5C,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA;;uBAED,IAAI,CAAC,OAAO;;IAE/B,CAAC,CAAC,CAAC,IAAI,CAAA,+BAA+B;;EAExC,CAAC;AACH,CAAC"}

package/dist/components/actions/split-button/split-button.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Nederlandse Digitale Dienst Split Button Component (Lit + TypeScript)
+ *
+ * A split button combines a primary action button with a dropdown trigger.
+ * The main button performs the default action, while the icon button opens a menu.
+ *
+ * Any `nldd-menu-item` and `nldd-menu-divider` children in the light DOM are
+ * **moved** into an internal `nldd-menu` inside the component's shadow DOM on
+ * mount (and on subsequent add/remove via MutationObserver). Consumers can no
+ * longer `querySelector` those items from the split-button afterwards — query
+ * through the menu via custom events or keep their own references.
+ *
+ * When no items are slotted, the chevron dispatches `menu-click` and the
+ * consumer is expected to manage their own popover.
+ *
+ * @element nldd-split-button
+ * @attr {string} size - Button size: 'xs' | 'sm' | 'md' (default: 'md')
+ * @attr {string} variant - Button variant (default: 'neutral-tinted')
+ * @attr {boolean} disabled - Disabled state
+ * @attr {string} text - Button text for the primary action
+ * @attr {string} start-icon - Icon name for the start icon (before text)
+ * @attr {object} translations - Translations; unset keys fall back to Dutch
+ *
+ * @fires action-click - Fired when the main button is clicked
+ * @fires menu-click - Fired when the dropdown trigger is clicked and no items
+ *                     are slotted
+ */
+import { LitElement } from 'lit';
+import type { NLDDSplitButtonTranslations } from './split-button.i18n.js';
+import './../button/button.js';
+import './../icon-button/icon-button.js';
+import '../../lists-and-menus/menu/menu.js';
+export type Size = 'xs' | 'sm' | 'md';
+export declare class NLDDSplitButton extends LitElement {
+    static styles: import("lit").CSSResult;
+    size: Size;
+    variant: string;
+    disabled: boolean;
+    /** Button text for the primary action. */
+    text: string;
+    /** Icon name for the start icon (before text) on the primary action button. */
+    startIcon: string;
+    translations: Partial<NLDDSplitButtonTranslations>;
+    private _trigger?;
+    private _menu?;
+    _menuIsOpen: boolean;
+    _hasMenuItems: boolean;
+    private _menuWasOpenOnMousedown;
+    private _childObserver?;
+    _t(key: keyof NLDDSplitButtonTranslations): string;
+    firstUpdated(): void;
+    disconnectedCallback(): void;
+    /**
+     * Moves any `nldd-menu-item` / `nldd-menu-divider` children from the light
+     * DOM into the internal `nldd-menu` (so nldd-menu's `querySelectorAll`
+     * sees them) and syncs `_hasMenuItems` against the menu's current content.
+     * Safe to call repeatedly — already-moved items are no longer in
+     * `this.children`.
+     */
+    private _syncMenuItems;
+    private _handleMenuToggle;
+    _handleActionClick(e: MouseEvent): void;
+    _handleMenuClick(e: MouseEvent): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'nldd-split-button': NLDDSplitButton;
+    }
+}
+//# sourceMappingURL=split-button.d.ts.map

package/dist/components/actions/split-button/split-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-button.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/split-button/split-button.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAC1E,OAAO,uBAAuB,CAAC;AAC/B,OAAO,iCAAiC,CAAC;AACzC,OAAO,oCAAoC,CAAC;AAG5C,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,qBACa,eAAgB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAAqB;IAG3C,IAAI,EAAE,IAAI,CAAQ;IAGlB,OAAO,EAAE,MAAM,CAAoB;IAGnC,QAAQ,UAAS;IAEjB,0CAA0C;IAE1C,IAAI,SAAM;IAEV,+EAA+E;IAE/E,SAAS,SAAM;IAGf,YAAY,EAAE,OAAO,CAAC,2BAA2B,CAAC,CAAM;IAGxD,OAAO,CAAC,QAAQ,CAAC,CAAc;IAG/B,OAAO,CAAC,KAAK,CAAC,CAAW;IAGzB,WAAW,UAAS;IAGpB,aAAa,UAAS;IACtB,OAAO,CAAC,uBAAuB,CAAS;IACxC,OAAO,CAAC,cAAc,CAAC,CAAmB;IAInC,EAAE,CAAC,GAAG,EAAE,MAAM,2BAA2B,GAAG,MAAM;IAMhD,YAAY,IAAI,IAAI;IAiBpB,oBAAoB,IAAI,IAAI;IAOrC;;;;;;OAMG;IACH,OAAO,CAAC,cAAc;IAetB,OAAO,CAAC,iBAAiB,CAEvB;IAEF,kBAAkB,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAMvC,gBAAgB,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAa5B,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mBAAmB,EAAE,eAAe,CAAC;KACrC;CACD"}

package/dist/components/actions/split-button/split-button.i18n.d.ts

@@ -0,0 +1,5 @@
+export declare const nlddSplitButtonTranslations: {
+    'components.split-button.menu-action': string;
+};
+export type NLDDSplitButtonTranslations = typeof nlddSplitButtonTranslations;
+//# sourceMappingURL=split-button.i18n.d.ts.map

package/dist/components/actions/split-button/split-button.i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-button.i18n.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/split-button/split-button.i18n.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,2BAA2B;;CAEvC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,OAAO,2BAA2B,CAAC"}

package/dist/components/actions/split-button/split-button.i18n.js

@@ -0,0 +1,4 @@
+export const nlddSplitButtonTranslations = {
+    'components.split-button.menu-action': 'Meer opties',
+};
+//# sourceMappingURL=split-button.i18n.js.map

package/dist/components/actions/split-button/split-button.i18n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-button.i18n.js","sourceRoot":"","sources":["../../../../src/components/actions/split-button/split-button.i18n.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,2BAA2B,GAAG;IAC1C,qCAAqC,EAAE,aAAa;CACpD,CAAC"}

package/dist/components/actions/split-button/split-button.js

@@ -0,0 +1,166 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Nederlandse Digitale Dienst Split Button Component (Lit + TypeScript)
+ *
+ * A split button combines a primary action button with a dropdown trigger.
+ * The main button performs the default action, while the icon button opens a menu.
+ *
+ * Any `nldd-menu-item` and `nldd-menu-divider` children in the light DOM are
+ * **moved** into an internal `nldd-menu` inside the component's shadow DOM on
+ * mount (and on subsequent add/remove via MutationObserver). Consumers can no
+ * longer `querySelector` those items from the split-button afterwards — query
+ * through the menu via custom events or keep their own references.
+ *
+ * When no items are slotted, the chevron dispatches `menu-click` and the
+ * consumer is expected to manage their own popover.
+ *
+ * @element nldd-split-button
+ * @attr {string} size - Button size: 'xs' | 'sm' | 'md' (default: 'md')
+ * @attr {string} variant - Button variant (default: 'neutral-tinted')
+ * @attr {boolean} disabled - Disabled state
+ * @attr {string} text - Button text for the primary action
+ * @attr {string} start-icon - Icon name for the start icon (before text)
+ * @attr {object} translations - Translations; unset keys fall back to Dutch
+ *
+ * @fires action-click - Fired when the main button is clicked
+ * @fires menu-click - Fired when the dropdown trigger is clicked and no items
+ *                     are slotted
+ */
+import { LitElement } from 'lit';
+import { customElement, property, query, state } from 'lit/decorators.js';
+import { splitButtonStyles } from './split-button.styles.js';
+import { template } from './split-button.template.js';
+import { nlddSplitButtonTranslations } from './split-button.i18n.js';
+import './../button/button.js';
+import './../icon-button/icon-button.js';
+import '../../lists-and-menus/menu/menu.js';
+let NLDDSplitButton = class NLDDSplitButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.size = 'md';
+        this.variant = 'neutral-tinted';
+        this.disabled = false;
+        /** Button text for the primary action. */
+        this.text = '';
+        /** Icon name for the start icon (before text) on the primary action button. */
+        this.startIcon = '';
+        this.translations = {};
+        this._menuIsOpen = false;
+        this._hasMenuItems = false;
+        this._menuWasOpenOnMousedown = false;
+        this._handleMenuToggle = (event) => {
+            this._menuIsOpen = event.newState === 'open';
+        };
+    }
+    // — i18n —————————————————————————————————————————————————————————————————
+    _t(key) {
+        return this.translations[key] ?? nlddSplitButtonTranslations[key];
+    }
+    // — Lifecycle ————————————————————————————————————————————————————————————
+    firstUpdated() {
+        this._syncMenuItems();
+        // Watch for children added or removed after first render. Moving items
+        // into the menu (in _syncMenuItems) itself triggers a childList mutation
+        // — the re-entry is harmless because subsequent syncs find no items to
+        // move and just update the flag.
+        this._childObserver = new MutationObserver(() => this._syncMenuItems());
+        this._childObserver.observe(this, { childList: true });
+        // Capture open-state BEFORE the browser's light-dismiss fires on
+        // mousedown. The subsequent click handler uses this snapshot to
+        // decide: was the popover open? → user clicked to close (no-op,
+        // light-dismiss already closed it). Was it closed? → open it.
+        this._trigger?.addEventListener('mousedown', () => {
+            this._menuWasOpenOnMousedown = this._menu?.matches(':popover-open') ?? false;
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this._childObserver?.disconnect();
+        this._childObserver = undefined;
+        this._menu?.removeEventListener('toggle', this._handleMenuToggle);
+    }
+    /**
+     * Moves any `nldd-menu-item` / `nldd-menu-divider` children from the light
+     * DOM into the internal `nldd-menu` (so nldd-menu's `querySelectorAll`
+     * sees them) and syncs `_hasMenuItems` against the menu's current content.
+     * Safe to call repeatedly — already-moved items are no longer in
+     * `this.children`.
+     */
+    _syncMenuItems() {
+        if (!this._menu || !this._trigger)
+            return;
+        const toMove = Array.from(this.children).filter((el) => el.matches('nldd-menu-item, nldd-menu-divider'));
+        toMove.forEach((item) => this._menu.appendChild(item));
+        const hadItems = this._hasMenuItems;
+        this._hasMenuItems =
+            this._menu.querySelectorAll('nldd-menu-item, nldd-menu-divider').length > 0;
+        if (this._hasMenuItems && !hadItems) {
+            this._menu.anchorElement = this._trigger;
+            this._menu.addEventListener('toggle', this._handleMenuToggle);
+        }
+    }
+    _handleActionClick(e) {
+        if (this.disabled)
+            return;
+        e.stopPropagation();
+        this.dispatchEvent(new CustomEvent('action-click', { bubbles: true, composed: true }));
+    }
+    _handleMenuClick(e) {
+        if (this.disabled)
+            return;
+        e.stopPropagation();
+        if (this._hasMenuItems && this._menu) {
+            const wasOpen = this._menuWasOpenOnMousedown;
+            this._menuWasOpenOnMousedown = false;
+            if (wasOpen)
+                return; // light-dismiss already closed it
+            this._menu.showPopover();
+            return;
+        }
+        this.dispatchEvent(new CustomEvent('menu-click', { bubbles: true, composed: true }));
+    }
+    render() {
+        return template.call(this);
+    }
+};
+NLDDSplitButton.styles = splitButtonStyles;
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDSplitButton.prototype, "size", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], NLDDSplitButton.prototype, "variant", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NLDDSplitButton.prototype, "disabled", void 0);
+__decorate([
+    property({ type: String })
+], NLDDSplitButton.prototype, "text", void 0);
+__decorate([
+    property({ type: String, attribute: 'start-icon' })
+], NLDDSplitButton.prototype, "startIcon", void 0);
+__decorate([
+    property({ type: Object })
+], NLDDSplitButton.prototype, "translations", void 0);
+__decorate([
+    query('.split-button__trigger')
+], NLDDSplitButton.prototype, "_trigger", void 0);
+__decorate([
+    query('.split-button__menu')
+], NLDDSplitButton.prototype, "_menu", void 0);
+__decorate([
+    state()
+], NLDDSplitButton.prototype, "_menuIsOpen", void 0);
+__decorate([
+    state()
+], NLDDSplitButton.prototype, "_hasMenuItems", void 0);
+NLDDSplitButton = __decorate([
+    customElement('nldd-split-button')
+], NLDDSplitButton);
+export { NLDDSplitButton };
+//# sourceMappingURL=split-button.js.map

package/dist/components/actions/split-button/split-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-button.js","sourceRoot":"","sources":["../../../../src/components/actions/split-button/split-button.ts"],"names":[],"mappings":"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"}

package/dist/components/actions/split-button/split-button.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const splitButtonStyles: import("lit").CSSResult;
+//# sourceMappingURL=split-button.styles.d.ts.map

package/dist/components/actions/split-button/split-button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-button.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/split-button/split-button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,yBAgG7B,CAAC"}