@dso-toolkit/core 88.1.1 → 90.0.0

package/dist/components/panel.js

@@ -1,72 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, transformTag } from '@stencil/core/internal/client';
-import { c as clsx } from './clsx.js';
-import { i as i18n } from './i18n.js';
-import { d as defineCustomElement$2 } from './icon.js';
-import { d as defineCustomElement$1 } from './icon-button.js';
-
-const translations = {
-    en: {
-        "dso-panel": {
-            close: "Close",
-        },
-    },
-    nl: {
-        "dso-panel": {
-            close: "Sluiten",
-        },
-    },
-};
-
-const panelCss = () => `:host{display:block;border:1px solid #b2b2b2;border-radius:4px;overflow:hidden}*,*::after,*::before{box-sizing:border-box}.panel-heading{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;padding-block:8px;padding-inline-start:var(--panel-heading-padding-inline-start, 16px);padding-inline-end:8px;border-block-end:1px solid #b2b2b2;border-start-start-radius:4px;border-start-end-radius:4px;border-color:#b2b2b2;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}.panel-heading{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e5e5e5;color:#191919}.panel-heading .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.emphasized .panel-heading{background-color:#dcd400}::slotted([slot=heading]){margin:0 !important;font-size:1rem !important;font-weight:600 !important;line-height:1.5 !important;color:#000 !important}.panel-body{padding-block:16px;padding-inline:var(--panel-body-padding-inline, 16px);background-color:var(--_dso-panel-body-background-color, transparent)}`;
-
-const Panel = /*@__PURE__*/ proxyCustomElement(class Panel extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dsoCloseClick = createEvent(this, "dsoCloseClick", 7);
-        /**
-         * To display the panel as an emphasized panel.
-         */
-        this.emphasized = false;
-        this.text = i18n(() => this.host, translations);
-    }
-    render() {
-        return (h("div", { key: '6b392bfec6de02761378d5bcbc575aec75b8fa65', class: clsx(["dso-panel", { emphasized: this.emphasized }]) }, h("div", { key: '2ac787c40afad1e0a7858fdd2c208988d7a293a3', class: "panel-heading" }, h("slot", { key: 'a2af9ee51d2e9252682afb05c9df27bb041c3865', name: "heading" }), h("dso-icon-button", { key: 'b9abe88085c20c68322d7d9bf0a3bab29493b0c6', icon: "times", variant: "tertiary", onDsoClick: (e) => this.dsoCloseClick.emit({ originalEvent: e.detail.originalEvent }), label: this.closeButtonLabel || this.text("close") })), h("div", { key: 'd8f5ba452135a44e804fa7f59bd842e73ac28004', class: "panel-body" }, h("slot", { key: '9d7ada9f96162690a1cd8b0e12493cad7d2f40dc' }))));
-    }
-    get host() { return this; }
-    static get style() { return panelCss(); }
-}, [257, "dso-panel", {
-        "closeButtonLabel": [1, "close-button-label"],
-        "emphasized": [4]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["dso-panel", "dso-icon", "dso-icon-button"];
-    components.forEach(tagName => { switch (tagName) {
-        case "dso-panel":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), Panel);
-            }
-            break;
-        case "dso-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "dso-icon-button":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { Panel as P, defineCustomElement as d };
-//# sourceMappingURL=panel.js.map
-
-//# sourceMappingURL=panel.js.map
+import{proxyCustomElement as o,HTMLElement as e,createEvent as r,h as t,transformTag as a}from"@stencil/core/internal/client";import{c as i}from"./clsx.js";import{i as n}from"./i18n.js";import{d}from"./icon.js";import{d as s}from"./icon-button.js";const l={en:{"dso-panel":{close:"Close"}},nl:{"dso-panel":{close:"Sluiten"}}},c=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoCloseClick=r(this,"dsoCloseClick",7),this.emphasized=!1,this.text=n((()=>this.host),l)}render(){return t("div",{key:"99d102b8bb08fc7f673eea6b7c7cc6c7b0c4d88e",class:i(["dso-panel",{emphasized:this.emphasized}])},t("div",{key:"b0cfb4b2f60f5af467e2b74b58c59919dced4d46",class:"panel-heading"},t("slot",{key:"e5a0b9d077b9c254996d8cf6f289704370b07f6a",name:"heading"}),t("dso-icon-button",{key:"5939e4d1120f30ec2310357f7bbb3af17e108ddc",icon:"cross",variant:"tertiary",onDsoClick:o=>this.dsoCloseClick.emit({originalEvent:o.detail.originalEvent}),label:this.closeButtonLabel||this.text("close")})),t("div",{key:"e845349815336c7e84c3445dfe82512c156bbcf6",class:"panel-body"},t("slot",{key:"e7575c10f26f6e65fcc0b94b47e3864fcd6e9525"})))}get host(){return this}static get style(){return':host{display:block;border:1px solid #b2b2b2;border-radius:4px;overflow:hidden}*,*::after,*::before{box-sizing:border-box}.panel-heading{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;padding-block:8px;padding-inline-start:var(--panel-heading-padding-inline-start, 16px);padding-inline-end:8px;border-block-end:1px solid #b2b2b2;border-start-start-radius:4px;border-start-end-radius:4px;border-color:#b2b2b2;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}.panel-heading a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"))}.panel-heading{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e5e5e5;color:#191919}.panel-heading .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:rect(0 0 0 0)}.emphasized .panel-heading{background-color:#dcd400}::slotted([slot=heading]){margin:0 !important;font-size:1rem !important;font-weight:600 !important;line-height:1.5 !important;color:#000 !important}.panel-body{padding-block:16px;padding-inline:var(--panel-body-padding-inline, 16px);background-color:var(--_dso-panel-body-background-color, transparent)}'}},[257,"dso-panel",{closeButtonLabel:[1,"close-button-label"],emphasized:[4]}]);function b(){"undefined"!=typeof customElements&&["dso-panel","dso-icon","dso-icon-button"].forEach((o=>{switch(o){case"dso-panel":customElements.get(a(o))||customElements.define(a(o),c);break;case"dso-icon":customElements.get(a(o))||d();break;case"dso-icon-button":customElements.get(a(o))||s()}}))}export{c as P,b as d}

package/dist/components/progress-indicator.js

@@ -1,61 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host, transformTag } from '@stencil/core/internal/client';
-import { i as i18n } from './i18n.js';
-import { d as defineCustomElement$1 } from './icon.js';
-
-const translations = {
-    en: {
-        "dso-progress-indicator": {
-            label: "Loading results. Please wait...",
-        },
-    },
-    nl: {
-        "dso-progress-indicator": {
-            label: "Resultaten laden: een moment geduld alstublieft.",
-        },
-    },
-};
-
-const progressIndicatorCss = () => `*,*::after,*::before{box-sizing:border-box}.dso-progress-indicator-spinner{display:inline-block;margin:0;position:relative;vertical-align:middle}span.dso-progress-indicator-label{margin-inline-start:16px;vertical-align:middle}:host([block]){align-items:center;display:flex;justify-content:center}:host([size=small]) .dso-progress-indicator-spinner,:host([size=small]) dso-icon,:host(:not([size=medium]):not([size=large])) .dso-progress-indicator-spinner,:host(:not([size=medium]):not([size=large])) dso-icon{block-size:24px;inline-size:24px}:host([size=small]):host([block]),:host(:not([size=medium]):not([size=large])):host([block]){padding-block:12px;padding-inline:16px}:host([size=medium]) .dso-progress-indicator-spinner,:host([size=medium]) dso-icon{block-size:32px;inline-size:32px}:host([size=medium]):host([block]){padding:16px}:host([size=large]) .dso-progress-indicator-spinner,:host([size=large]) dso-icon{block-size:48px;inline-size:48px}:host([size=large]):host([block]){padding-block:24px;padding-inline:16px}`;
-
-const Progressindicator = /*@__PURE__*/ proxyCustomElement(class Progressindicator extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.text = i18n(() => this.host, translations);
-    }
-    render() {
-        return (h(Host, { key: '8ab3db9242f44f583258a9f313a8e3fbb9b72d0d' }, h("span", { key: '193a169135e1617727e86cc1c11cf87250220493', class: "dso-progress-indicator-spinner", role: "progressbar", "aria-labelledby": "progress-indicator-label" }, h("dso-icon", { key: '1d5e137b36f95fb9600545f58687a401276a27b7', icon: "spinner" })), h("span", { key: 'e5d674bd60e0037ad0e78ed7129ac74002ce38f2', id: "progress-indicator-label", class: "dso-progress-indicator-label" }, this.label || this.text("label"))));
-    }
-    get host() { return this; }
-    static get style() { return progressIndicatorCss(); }
-}, [257, "dso-progress-indicator", {
-        "label": [1],
-        "size": [513],
-        "block": [516]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["dso-progress-indicator", "dso-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "dso-progress-indicator":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), Progressindicator);
-            }
-            break;
-        case "dso-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { Progressindicator as P, defineCustomElement as d };
-//# sourceMappingURL=progress-indicator.js.map
-
-//# sourceMappingURL=progress-indicator.js.map
+import{proxyCustomElement as s,HTMLElement as e,h as i,Host as o,transformTag as n}from"@stencil/core/internal/client";import{i as r}from"./i18n.js";import{d as t}from"./icon.js";const a={en:{"dso-progress-indicator":{label:"Loading results. Please wait..."}},nl:{"dso-progress-indicator":{label:"Resultaten laden: een moment geduld alstublieft."}}},l=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.text=r((()=>this.host),a)}render(){return i(o,{key:"5fa9e0caf06bc75410aa225a4e99e50b381bb396"},i("span",{key:"b89e86db1ffe6138b2ed33f08ea462e2501cf3c5",class:"dso-progress-indicator-spinner",role:"progressbar","aria-labelledby":"progress-indicator-label"},i("dso-icon",{key:"af7338d1bd50ca89206450c006f60f8b912eb9a7",icon:"spinner"})),i("span",{key:"6deb8a1b9a92d089d7260caee85f72c4ab7d46e8",id:"progress-indicator-label",class:"dso-progress-indicator-label"},this.label||this.text("label")))}get host(){return this}static get style(){return"*,*::after,*::before{box-sizing:border-box}.dso-progress-indicator-spinner{display:inline-block;margin:0;position:relative;vertical-align:middle}span.dso-progress-indicator-label{margin-inline-start:16px;vertical-align:middle}:host([block]){align-items:center;display:flex;justify-content:center}:host([size=small]) .dso-progress-indicator-spinner,:host([size=small]) dso-icon,:host(:not([size=medium]):not([size=large])) .dso-progress-indicator-spinner,:host(:not([size=medium]):not([size=large])) dso-icon{block-size:24px;inline-size:24px}:host([size=small]):host([block]),:host(:not([size=medium]):not([size=large])):host([block]){padding-block:12px;padding-inline:16px}:host([size=medium]) .dso-progress-indicator-spinner,:host([size=medium]) dso-icon{block-size:32px;inline-size:32px}:host([size=medium]):host([block]){padding:16px}:host([size=large]) .dso-progress-indicator-spinner,:host([size=large]) dso-icon{block-size:48px;inline-size:48px}:host([size=large]):host([block]){padding-block:24px;padding-inline:16px}"}},[1,"dso-progress-indicator",{label:[1],size:[513],block:[516]}]);function d(){"undefined"!=typeof customElements&&["dso-progress-indicator","dso-icon"].forEach((s=>{switch(s){case"dso-progress-indicator":customElements.get(n(s))||customElements.define(n(s),l);break;case"dso-icon":customElements.get(n(s))||t()}}))}export{l as P,d}

package/dist/components/renvooi.js

@@ -1,78 +1 @@
-import { h, Fragment, proxyCustomElement, HTMLElement, createEvent, transformTag } from '@stencil/core/internal/client';
-
-const RenvooiRenderText = ({ text, mark, onMarkItemHighlight }) => {
-    if (!mark) {
-        return h(Fragment, null, text);
-    }
-    const result = mark(text);
-    if (!result) {
-        return h(Fragment, null, text);
-    }
-    return (h(Fragment, null, result.map((renvooiText) => {
-        if (typeof renvooiText === "string") {
-            return h(Fragment, null, renvooiText);
-        }
-        return (h("mark", { class: renvooiText.highlight ? "dso-highlight" : undefined, ref: (ref) => renvooiText.highlight && ref && onMarkItemHighlight(renvooiText.text, ref) }, renvooiText.text));
-    })));
-};
-
-const RenvooiRender = ({ value, mark, onMarkItemHighlight }) => {
-    if (typeof value === "string" || !value) {
-        // This element is used for --_dso-renvooi-text-decoration
-        return (h("span", { class: "text" }, h(RenvooiRenderText, { text: value, mark: mark, onMarkItemHighlight: onMarkItemHighlight })));
-    }
-    if ("toegevoegd" in value) {
-        return (h("ins", null, h(RenvooiRenderText, { text: value.toegevoegd, mark: mark, onMarkItemHighlight: onMarkItemHighlight })));
-    }
-    if ("verwijderd" in value) {
-        return (h("del", null, h(RenvooiRenderText, { text: value.verwijderd, mark: mark, onMarkItemHighlight: onMarkItemHighlight })));
-    }
-    return (h(Fragment, null, h("del", null, h(RenvooiRenderText, { text: value.was, mark: mark, onMarkItemHighlight: onMarkItemHighlight })), h("ins", null, h(RenvooiRenderText, { text: value.wordt, mark: mark, onMarkItemHighlight: onMarkItemHighlight }))));
-};
-
-const renvooiCss = () => `ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}ins{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:colors.$zwart}del{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}del{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:colors.$zwart;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){del{font-family:sans-serif}}mark{background-color:var(--_dt-mark-bg-color, #f8f5ce);color:var(--_dt-mark-color, #000);padding-block:var(--_dt-mark-padding-block, 0.2rem);font-weight:var(--_dt-mark-font-weight, normal)}mark.dso-highlight{background-color:#dbd136}:host{display:inline}*,*::after,*::before{box-sizing:border-box}.text{text-decoration:var(--_dso-renvooi-text-decoration)}`;
-
-const Renvooi = /*@__PURE__*/ proxyCustomElement(class Renvooi extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dsoRenvooiMarkItemHighlight = createEvent(this, "dsoRenvooiMarkItemHighlight", 3);
-        this.handleMarkItemHighlight = (text, elementRef) => {
-            this.dsoRenvooiMarkItemHighlight.emit({ text, elementRef });
-        };
-    }
-    get values() {
-        if (!this.value) {
-            return [];
-        }
-        return Array.isArray(this.value) ? this.value : [this.value];
-    }
-    render() {
-        return (h(Fragment, null, this.values.map((v) => (h(RenvooiRender, { value: v, mark: this.mark && ((text) => { var _a; return (_a = this.mark) === null || _a === void 0 ? void 0 : _a.call(this, text, v, this.values); }), onMarkItemHighlight: this.handleMarkItemHighlight })))));
-    }
-    static get style() { return renvooiCss(); }
-}, [257, "dso-renvooi", {
-        "value": [1],
-        "mark": [16]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["dso-renvooi"];
-    components.forEach(tagName => { switch (tagName) {
-        case "dso-renvooi":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), Renvooi);
-            }
-            break;
-    } });
-}
-
-export { Renvooi as R, defineCustomElement as d };
-//# sourceMappingURL=renvooi.js.map
-
-//# sourceMappingURL=renvooi.js.map
+import{h as o,Fragment as r,proxyCustomElement as t,HTMLElement as e,createEvent as i,transformTag as a}from"@stencil/core/internal/client";const d=({text:t,mark:e,onMarkItemHighlight:i})=>{if(!e)return o(r,null,t);const a=e(t);return o(r,null,a?a.map((t=>"string"==typeof t?o(r,null,t):o("mark",{class:t.highlight?"dso-highlight":void 0,ref:o=>t.highlight&&o&&i(t.text,o)},t.text))):t)},n=({value:t,mark:e,onMarkItemHighlight:i})=>"string"!=typeof t&&t?"toegevoegd"in t?o("ins",null,o(d,{text:t.toegevoegd,mark:e,onMarkItemHighlight:i})):"verwijderd"in t?o("del",null,o(d,{text:t.verwijderd,mark:e,onMarkItemHighlight:i})):o(r,null,o("del",null,o(d,{text:t.was,mark:e,onMarkItemHighlight:i})),o("ins",null,o(d,{text:t.wordt,mark:e,onMarkItemHighlight:i}))):o("span",{class:"text"},o(d,{text:t,mark:e,onMarkItemHighlight:i})),l=t(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoRenvooiMarkItemHighlight=i(this,"dsoRenvooiMarkItemHighlight",3),this.handleMarkItemHighlight=(o,r)=>{this.dsoRenvooiMarkItemHighlight.emit({text:o,elementRef:r})}}get values(){return this.value?Array.isArray(this.value)?this.value:[this.value]:[]}render(){return o(r,null,this.values.map((r=>o(n,{value:r,mark:this.mark&&(o=>this.mark?.(o,r,this.values)),onMarkItemHighlight:this.handleMarkItemHighlight}))))}static get style(){return'ins{text-decoration:none;--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}ins a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"))}ins{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#e4f1d4;color:#191919;box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.5);--_dso-ozon-content-toggletip-color:#000}del{--_dso-alert-success-border-color:#39870c;--_dso-alert-error-border-color:#ce3f51;--_dso-alert-info-border-color:#6ca4d9;--_dso-alert-warning-border-color:#dcd400;--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}del a:not(.dso-primary,.dso-secondary,.dso-tertiary):is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"))}del{--_dso-icon-button-tertiary-color:#191919;--_dso-icon-button-tertiary-hover-color:#4c4c4c;--_dso-icon-button-tertiary-active-color:#173521;--_dso-icon-button-tertiary-disabled-color:#999;--_dso-button-tertiary-color:#191919;--_dso-button-tertiary-hover-color:#4c4c4c;--_dso-button-tertiary-active-color:#173521;--_dso-button-tertiary-disabled-color:#999;background-color:#f5d8dc;color:#191919;--_dso-ozon-content-toggletip-color:#000;text-decoration:line-through;--_dso-ozon-content-toggletip-text-decoration:underline line-through}@media screen and (min--moz-device-pixel-ratio: 0){del{font-family:sans-serif}}mark{background-color:var(--_dt-mark-bg-color, #f8f5ce);color:var(--_dt-mark-color, #000);padding-block:var(--_dt-mark-padding-block, 0.2rem);font-weight:var(--_dt-mark-font-weight, normal)}mark.dso-highlight{background-color:#dbd136}:host{display:inline}*,*::after,*::before{box-sizing:border-box}.text{text-decoration:var(--_dso-renvooi-text-decoration)}'}},[1,"dso-renvooi",{value:[1],mark:[16]}]);function s(){"undefined"!=typeof customElements&&["dso-renvooi"].forEach((o=>{"dso-renvooi"===o&&(customElements.get(a(o))||customElements.define(a(o),l))}))}export{l as R,s as d}

package/dist/components/responsive-element.js

@@ -1,78 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host, transformTag } from '@stencil/core/internal/client';
-
-const responsiveElementCss = () => `:host{display:block}`;
-
-const elementSizes = [
-    {
-        width: 624,
-        alias: "large",
-    },
-    {
-        width: 375,
-        alias: "medium",
-    },
-    {
-        width: 0,
-        alias: "small",
-    },
-];
-const ResponsiveElement = /*@__PURE__*/ proxyCustomElement(class ResponsiveElement extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dsoSizeChange = createEvent(this, "dsoSizeChange", 7);
-        this.sizeAlias = elementSizes[0].alias;
-        this.sizeWidth = 0;
-        this.observer = new ResizeObserver(([entry]) => {
-            var _a, _b;
-            if (!entry) {
-                throw new Error("No entry found");
-            }
-            const size = (_b = (_a = elementSizes.find((s) => entry.contentRect.width >= s.width)) === null || _a === void 0 ? void 0 : _a.alias) !== null && _b !== void 0 ? _b : elementSizes[0].alias;
-            this.sizeAlias = size;
-            this.dsoSizeChange.emit(size);
-        });
-    }
-    /**
-     * The current size
-     */
-    async getSize() {
-        return this.sizeAlias;
-    }
-    componentWillLoad() {
-        this.observer.observe(this.host);
-    }
-    disconnectedCallback() {
-        this.observer.unobserve(this.host);
-    }
-    render() {
-        return (h(Host, { key: '8949125bfa2cbeee5544b5ea5fe7d3b5fc95495f', small: this.sizeAlias === "small", medium: this.sizeAlias === "medium", large: this.sizeAlias === "large" }, h("slot", { key: '2fafcef7f364684ad31c6e1d95ec431ad2f06334' })));
-    }
-    get host() { return this; }
-    static get style() { return responsiveElementCss(); }
-}, [257, "dso-responsive-element", {
-        "sizeAlias": [32],
-        "sizeWidth": [32],
-        "getSize": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["dso-responsive-element"];
-    components.forEach(tagName => { switch (tagName) {
-        case "dso-responsive-element":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), ResponsiveElement);
-            }
-            break;
-    } });
-}
-
-export { ResponsiveElement as R, defineCustomElement as d };
-//# sourceMappingURL=responsive-element.js.map
-
-//# sourceMappingURL=responsive-element.js.map
+import{proxyCustomElement as e,HTMLElement as s,createEvent as t,h as i,Host as n,transformTag as o}from"@stencil/core/internal/client";const l=[{width:624,alias:"large"},{width:375,alias:"medium"},{width:0,alias:"small"}],r=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dsoSizeChange=t(this,"dsoSizeChange",7),this.sizeAlias=l[0].alias,this.sizeWidth=0,this.observer=new ResizeObserver((([e])=>{if(!e)throw new Error("No entry found");const s=l.find((s=>e.contentRect.width>=s.width))?.alias??l[0].alias;this.sizeAlias=s,this.dsoSizeChange.emit(s)}))}async getSize(){return this.sizeAlias}componentWillLoad(){this.observer.observe(this.host)}disconnectedCallback(){this.observer.unobserve(this.host)}render(){return i(n,{key:"ca9c1b61a8604e516e05bdce5117192964831c90",small:"small"===this.sizeAlias,medium:"medium"===this.sizeAlias,large:"large"===this.sizeAlias},i("slot",{key:"d8465b9289ba9657d50c36cd0d43926e5ac47d3f"}))}get host(){return this}static get style(){return":host{display:block}"}},[257,"dso-responsive-element",{sizeAlias:[32],sizeWidth:[32],getSize:[64]}]);function a(){"undefined"!=typeof customElements&&["dso-responsive-element"].forEach((e=>{"dso-responsive-element"===e&&(customElements.get(o(e))||customElements.define(o(e),r))}))}export{r as R,a as d}

package/dist/components/scrollable.js

@@ -1,123 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, transformTag } from '@stencil/core/internal/client';
-import { c as clsx } from './clsx.js';
-import { d as debounce } from './index2.js';
-
-const scrollableCss = () => `:host{display:block;block-size:100%;overflow-y:hidden;border-radius:var(--_dt-scrollable-border-radius, 0)}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto;padding-inline:var(--_dt-scrollable-container-padding-inline, 0);padding-block:var(--_dt-scrollable-container-padding-block, 0);border-end-start-radius:var(--_dt-scrollable-container-border-end-start-radius, 0);border-end-end-radius:var(--_dt-scrollable-container-border-end-end-radius, 0)}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1;border-end-start-radius:var(--_dt-scrollable-container-border-end-start-radius, 0);border-end-end-radius:var(--_dt-scrollable-container-border-end-end-radius, 0)}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}`;
-
-const resizeObserver = new ResizeObserver(debounce((entries) => entries.forEach((entry) => { var _a; return (_a = getScrollableComponentFromResizeObserverEntry(entry)) === null || _a === void 0 ? void 0 : _a._setScrollState(); }), 50));
-function getScrollableComponentFromResizeObserverEntry({ target, }) {
-    if (target.parentNode instanceof ShadowRoot && isDsoScrollableComponent(target.parentNode.host)) {
-        return target.parentNode.host;
-    }
-    if (target.parentElement && isDsoScrollableComponent(target.parentElement)) {
-        return target.parentElement;
-    }
-    return undefined;
-}
-function isDsoScrollableComponent(element) {
-    return element.tagName === "DSO-SCROLLABLE";
-}
-const Scrollable = /*@__PURE__*/ proxyCustomElement(class Scrollable extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dsoScrollEnd = createEvent(this, "dsoScrollEnd", 7);
-        // One MutationObserver per instance because of https://github.com/whatwg/dom/issues/126
-        this.mutationObserver = new MutationObserver((entries) => entries.forEach(({ target }) => {
-            var _a;
-            const element = (_a = target.parentElement) === null || _a === void 0 ? void 0 : _a.closest("dso-scrollable");
-            if (element !== this.host) {
-                return;
-            }
-            this._setScrollState();
-        }));
-        this.scrollPosition = "noScroll";
-    }
-    /**
-     * @internal
-     */
-    async _setScrollState() {
-        if (!this.host.isConnected) {
-            return;
-        }
-        const scrollPosition = this.getScrollPosition();
-        if (this.scrollPosition !== scrollPosition) {
-            this.scrollPosition = scrollPosition;
-            if (this.scrollPosition === "top" || this.scrollPosition === "bottom") {
-                this.dsoScrollEnd.emit({ scrollEnd: this.scrollPosition });
-            }
-        }
-    }
-    get slottedElements() {
-        return Array.from(this.host.children);
-    }
-    getScrollPosition() {
-        if (!this.scrollContainerDiv) {
-            return "noScroll";
-        }
-        const { scrollHeight, clientHeight, scrollTop } = this.scrollContainerDiv;
-        if (scrollHeight <= clientHeight) {
-            return "noScroll";
-        }
-        if (scrollTop === 0) {
-            return "top";
-        }
-        if (scrollHeight - scrollTop - clientHeight < 1) {
-            return "bottom";
-        }
-        if (scrollTop > 0) {
-            return "middle";
-        }
-        return "noScroll";
-    }
-    componentDidLoad() {
-        this.mutationObserver.observe(this.host, {
-            characterData: true,
-            attributes: false,
-            childList: false,
-            subtree: true,
-        });
-        if (this.shadowContainerDiv instanceof HTMLDivElement) {
-            resizeObserver.observe(this.shadowContainerDiv);
-        }
-        this.slottedElements.forEach((element) => resizeObserver.observe(element));
-    }
-    disconnectedCallback() {
-        if (this.shadowContainerDiv instanceof HTMLDivElement) {
-            resizeObserver.unobserve(this.shadowContainerDiv);
-        }
-        this.mutationObserver.disconnect();
-        this.slottedElements.forEach((element) => resizeObserver.unobserve(element));
-    }
-    render() {
-        return (h("div", { key: 'dee37c2609831086f1b3955405cb3e77fad6e00b', ref: (el) => (this.shadowContainerDiv = el), class: "dso-shadow-container" }, h("div", { key: 'e2a462c19b66745489b8d6e2105b560aa872528c', ref: (el) => (this.scrollContainerDiv = el), class: clsx("dso-scroll-container", {
-                [`dso-scroll-${this.scrollPosition}`]: this.scrollPosition !== "noScroll",
-            }), onScroll: () => this._setScrollState() }, h("slot", { key: '8cd3cf93c18bb02a2aef1eaf311381cdcbd632b2' }))));
-    }
-    get host() { return this; }
-    static get style() { return scrollableCss(); }
-}, [257, "dso-scrollable", {
-        "scrollPosition": [32],
-        "_setScrollState": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["dso-scrollable"];
-    components.forEach(tagName => { switch (tagName) {
-        case "dso-scrollable":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), Scrollable);
-            }
-            break;
-    } });
-}
-
-export { Scrollable as S, defineCustomElement as d };
-//# sourceMappingURL=scrollable.js.map
-
-//# sourceMappingURL=scrollable.js.map
+import{proxyCustomElement as o,HTMLElement as t,createEvent as e,h as s,transformTag as r}from"@stencil/core/internal/client";import{c as n}from"./clsx.js";import{d as i}from"./index2.js";const l=new ResizeObserver(i((o=>o.forEach((o=>function({target:o}){return o.parentNode instanceof ShadowRoot&&a(o.parentNode.host)?o.parentNode.host:o.parentElement&&a(o.parentElement)?o.parentElement:void 0}(o)?._setScrollState()))),50));function a(o){return"DSO-SCROLLABLE"===o.tagName}const d=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.dsoScrollEnd=e(this,"dsoScrollEnd",7),this.mutationObserver=new MutationObserver((o=>o.forEach((({target:o})=>{const t=o.parentElement?.closest("dso-scrollable");t===this.host&&this._setScrollState()})))),this.scrollPosition="noScroll"}async _setScrollState(){if(!this.host.isConnected)return;const o=this.getScrollPosition();this.scrollPosition!==o&&(this.scrollPosition=o,"top"!==this.scrollPosition&&"bottom"!==this.scrollPosition||this.dsoScrollEnd.emit({scrollEnd:this.scrollPosition}))}get slottedElements(){return Array.from(this.host.children)}getScrollPosition(){if(!this.scrollContainerDiv)return"noScroll";const{scrollHeight:o,clientHeight:t,scrollTop:e}=this.scrollContainerDiv;return o-t<8?"noScroll":0===e?"top":o-e-t<1?"bottom":e>0?"middle":"noScroll"}componentDidLoad(){this.mutationObserver.observe(this.host,{characterData:!0,attributes:!1,childList:!1,subtree:!0}),this.shadowContainerDiv instanceof HTMLDivElement&&l.observe(this.shadowContainerDiv),this.slottedElements.forEach((o=>l.observe(o)))}disconnectedCallback(){this.shadowContainerDiv instanceof HTMLDivElement&&l.unobserve(this.shadowContainerDiv),this.mutationObserver.disconnect(),this.slottedElements.forEach((o=>l.unobserve(o)))}render(){return s("div",{key:"e94af45c3732f7691a092af7bf842391af3c437c",ref:o=>this.shadowContainerDiv=o,class:"dso-shadow-container"},s("div",{key:"154edbc32a0902fb5f006c647bbdeb9c564cf981",ref:o=>this.scrollContainerDiv=o,class:n("dso-scroll-container",{[`dso-scroll-${this.scrollPosition}`]:"noScroll"!==this.scrollPosition}),onScroll:()=>this._setScrollState()},s("slot",{key:"b0a8bd4bb35413614c41ebb077bd7613e303682a"})))}get host(){return this}static get style(){return':host{display:block;block-size:100%;overflow-y:hidden;border-radius:var(--_dt-scrollable-border-radius, 0)}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:hidden;padding-inline:var(--_dt-scrollable-container-padding-inline, 0);padding-block:var(--_dt-scrollable-container-padding-block, 0);border-end-start-radius:var(--_dt-scrollable-container-border-end-start-radius, 0);border-end-end-radius:var(--_dt-scrollable-container-border-end-end-radius, 0)}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:"";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1;border-end-start-radius:var(--_dt-scrollable-container-border-end-start-radius, 0);border-end-end-radius:var(--_dt-scrollable-container-border-end-end-radius, 0)}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom,.dso-shadow-container .dso-scroll-container.dso-scroll-top,.dso-shadow-container .dso-scroll-container.dso-scroll-middle{overflow-y:auto}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}'}},[257,"dso-scrollable",{scrollPosition:[32],_setScrollState:[64]}]);function c(){"undefined"!=typeof customElements&&["dso-scrollable"].forEach((o=>{"dso-scrollable"===o&&(customElements.get(r(o))||customElements.define(r(o),d))}))}export{d as S,c as d}