@dso-toolkit/core 68.5.0 → 69.1.0

package/dist/esm/dso-tree-view.entry.js

@@ -194,7 +194,7 @@ const TreeView = class {
     }
     render() {
         var _a;
-        return (h("div", { key: 'f6f6832d0613dcb1eb30f1170cc848e5dd5a47f3', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: 'aaea2cfc733ff714e907758e41ea31fa2f460b68', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
+        return (h("div", { key: 'fda90d8a03ae58672b99f314ec5f97c1ac9dab19', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '02c4d4665e8d3fdb2618e6e730ad899776149501', role: "tree", "aria-label": "Objectenboom" }, (_a = this.collection) === null || _a === void 0 ? void 0 : _a.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
     }
 };
 TreeView.style = DsoTreeViewStyle0;

package/dist/esm/dso-viewer-grid.entry.js

@@ -299,8 +299,8 @@ const ViewerGrid = class {
     }
     render() {
         const tabLabels = this.mode === "vdk" ? viewerGridVdkTabs : viewerGridVrkTabs;
-        return (h(Fragment, null, this.tabView && (h("nav", { key: 'd8a89e6fd85a9ec4adea0b52670c1cba714350ef', class: "dso-navbar" }, h("ul", { key: '34b3436df21fd14c6403b33b0b728415c7ee2c3f', class: "dso-nav dso-nav-sub" }, tabLabels.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && (this.activeTab === "main" || this.activeTab === "search"))) && (h(MainPanel, { key: 'a5166e11ec537da288535ef1f78027b6942288bc', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView ||
-            (this.tabView && ((this.activeTab === "main" && this.mode === "vrk") || this.activeTab === "search"))) && (h(Filterpanel, { key: '994efb6648cd215a4ff8e0fe7fffe16b65a40775', title: this.filterpanelTitle, mode: this.mode, ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel, dsoCloseFilterpanel: (e) => this.dsoCloseFilterpanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: 'b021cfb6be8c3a16453eb9927f6dac93736b0d2b', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '85a6dbcd00d82a8c6eb78e55755bae26aed76076', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: '163277775c959cf0f83ed6bf8bd79ff2a81d3806', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: '2577736644258d037e41fef06ec19be4d9db92fa', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) })));
+        return (h(Fragment, null, this.tabView && (h("nav", { key: '67c2e60734775ecdbf3139555fb6915013b1961e', class: "dso-navbar" }, h("ul", { key: '4e50ab7896a2ffdeb8fa9a279e1a2d0182a81499', class: "dso-nav dso-nav-sub" }, tabLabels.map((tab) => (h("li", { key: tab, class: clsx({ "dso-active": this.activeTab === tab }) }, h("button", { type: "button", class: "dso-tertiary", onClick: () => this.switchActiveTab(tab) }, viewerGridTabLabelMap[tab]))))))), (!this.tabView || (this.tabView && (this.activeTab === "main" || this.activeTab === "search"))) && (h(MainPanel, { key: '2ed0b4973958f49af4878f8b47837204645b6648', mode: this.mode, tabView: this.tabView, mainSize: this.mainSize, documentPanelOpen: this.documentPanelOpen, mainPanelExpanded: this.mainPanelExpanded, mainPanelHidden: this.mainPanelHidden, shrinkMain: this.emitShrinkMain, expandMain: this.emitExpandMain, toggleMainPanel: this.toggleMainPanel, dsoMainSizeChangeAnimationEnd: this.dsoMainSizeChangeAnimationEnd })), (!this.tabView ||
+            (this.tabView && ((this.activeTab === "main" && this.mode === "vrk") || this.activeTab === "search"))) && (h(Filterpanel, { key: '24f3be6f1165b6d88b0978c05091636e2fbcedaf', title: this.filterpanelTitle, mode: this.mode, ref: (element) => (this.filterpanel = element), onApply: this.handleFilterpanelApply, onCancel: this.handleFilterpanelCancel, dsoCloseFilterpanel: (e) => this.dsoCloseFilterpanel.emit({ originalEvent: e }) })), (!this.tabView || (this.tabView && this.activeTab === "map")) && (h("div", { key: 'b846fb472829718e3e092817f485a9186e4f0c30', class: "map", ref: (element) => (this.mapElement = element) }, h("slot", { key: '158e2d376aeb183114e90965ebff21ed71b95184', name: "map" }))), ((!this.tabView && this.documentPanelOpen) || (this.tabView && this.activeTab === "document")) && (h(DocumentPanel, { key: '58f4e9ab3208a6d1144877505965ea40ebfe8a75', tabView: this.tabView, panelSize: this.documentPanelSize, shrinkDocumentPanel: this.shrinkDocumentPanel, expandDocumentPanel: this.expandDocumentPanel, dsoDocumentPanelSizeChangeAnimationEnd: this.dsoDocumentPanelSizeChangeAnimationEnd })), h(Overlay, { key: '1d22628a694b5dfc081ccf865eb93f4bab3325b7', ref: (element) => (this.overlay = element), dsoCloseOverlay: (e) => this.dsoCloseOverlay.emit({ originalEvent: e }) })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/loader.js

@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy(JSON.parse("[[\"dso-icon\",[[1,\"dso-icon\",{\"icon\":[1]}]]],[\"dsot-document-component-demo\",[[2,\"dsot-document-component-demo\",{\"showCanvas\":[516,\"show-canvas\"],\"jsonFile\":[1,\"json-file\"],\"openDefault\":[4,\"open-default\"],\"mode\":[513],\"response\":[32],\"document\":[32],\"openOrClosed\":[32],\"openedAnnotation\":[32],\"filtered\":[32],\"notApplicable\":[32],\"activeAnnotationSelectables\":[32]},null,{\"jsonFile\":[\"jsonFileWatcher\"],\"openDefault\":[\"openDefaultWatcher\"]}]]],[\"dso-accordion-section\",[[1,\"dso-accordion-section\",{\"handleTitle\":[1,\"handle-title\"],\"wijzigactie\":[1],\"heading\":[1],\"handleUrl\":[1,\"handle-url\"],\"status\":[1],\"attachmentCount\":[2,\"attachment-count\"],\"icon\":[1],\"statusDescription\":[1,\"status-description\"],\"open\":[516],\"hasNestedAccordion\":[516,\"has-nested-accordion\"],\"label\":[1],\"labelStatus\":[1,\"label-status\"],\"activatable\":[516],\"active\":[516],\"hover\":[32],\"focusHandle\":[64]}]]],[\"dso-annotation-activiteit\",[[1,\"dso-annotation-activiteit\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"regelKwalificatie\":[1,\"regel-kwalificatie\"],\"locatieNoemers\":[16],\"regelKwalificatieVoorzetsel\":[1,\"regel-kwalificatie-voorzetsel\"]}]]],[\"dso-annotation-gebiedsaanwijzing\",[[1,\"dso-annotation-gebiedsaanwijzing\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1]}]]],[\"dso-annotation-omgevingsnormwaarde\",[[1,\"dso-annotation-omgevingsnormwaarde\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"toelichting\":[1],\"waardes\":[16],\"eenheid\":[1]}]]],[\"dso-advanced-select\",[[1,\"dso-advanced-select\",{\"options\":[16],\"active\":[16],\"activeHint\":[1,\"active-hint\"],\"open\":[32]},[[8,\"keydown\",\"keyDownListener\"]]]]],[\"dso-legend-item\",[[1,\"dso-legend-item\",{\"disabled\":[516],\"disabledMessage\":[1,\"disabled-message\"],\"removable\":[4],\"showBody\":[32]}]]],[\"dso-map-base-layers\",[[1,\"dso-map-base-layers\",{\"group\":[1],\"baseLayers\":[16]}]]],[\"dso-map-overlays\",[[1,\"dso-map-overlays\",{\"group\":[1],\"overlays\":[16]}]]],[\"dso-annotation-kaart\",[[1,\"dso-annotation-kaart\",{\"wijzigactie\":[513],\"naam\":[1],\"href\":[513]}]]],[\"dso-autosuggest\",[[6,\"dso-autosuggest\",{\"suggestions\":[16],\"loading\":[4],\"loadingLabel\":[1,\"loading-label\"],\"loadingDelayed\":[2,\"loading-delayed\"],\"notFoundLabel\":[1,\"not-found-label\"],\"suggestOnFocus\":[4,\"suggest-on-focus\"],\"mark\":[16],\"showSuggestions\":[32],\"selectedSuggestion\":[32],\"notFound\":[32],\"showLoading\":[32],\"listItemBlockSize\":[32],\"listboxContainerMaxBlockSize\":[32]},[[4,\"click\",\"onDocumentClick\"]],{\"suggestions\":[\"suggestionsWatcher\"]}]]],[\"dso-project-item\",[[1,\"dso-project-item\",{\"label\":[1]}]]],[\"dso-header\",[[1,\"dso-header\",{\"mainMenu\":[16],\"useDropDownMenu\":[1,\"use-drop-down-menu\"],\"authStatus\":[1,\"auth-status\"],\"loginUrl\":[1,\"login-url\"],\"logoutUrl\":[1,\"logout-url\"],\"showHelp\":[4,\"show-help\"],\"helpUrl\":[1,\"help-url\"],\"userProfileName\":[1,\"user-profile-name\"],\"userProfileUrl\":[1,\"user-profile-url\"],\"userHomeUrl\":[1,\"user-home-url\"],\"userHomeActive\":[4,\"user-home-active\"],\"showDropDown\":[32],\"overflowMenuItems\":[32],\"dropdownOptionsOffset\":[32]},null,{\"useDropDownMenu\":[\"setShowDropDown\"]}]]],[\"dso-map-controls\",[[1,\"dso-map-controls\",{\"open\":[1540],\"disableZoom\":[1,\"disable-zoom\"],\"hideContent\":[32],\"toggleVisibility\":[64]},null,{\"open\":[\"watchOpen\"]}]]],[\"dso-modal\",[[1,\"dso-modal\",{\"fullscreen\":[516],\"modalTitle\":[1,\"modal-title\"],\"dialogRole\":[1,\"dialog-role\"],\"returnFocus\":[4,\"return-focus\"],\"showCloseButton\":[4,\"show-close-button\"],\"ariaId\":[32]}]]],[\"dso-pagination\",[[1,\"dso-pagination\",{\"totalPages\":[2,\"total-pages\"],\"currentPage\":[2,\"current-page\"],\"formatHref\":[16],\"availablePositions\":[32]},[[0,\"dsoSizeChange\",\"sizeChangeHandler\"]]]]],[\"dso-survey-rating\",[[1,\"dso-survey-rating\"]]],[\"dso-tree-view\",[[1,\"dso-tree-view\",{\"collection\":[16],\"focusItem\":[64]}]]],[\"dso-action-list-item\",[[1,\"dso-action-list-item\",{\"step\":[2],\"itemTitle\":[1,\"item-title\"],\"flowLine\":[4,\"flow-line\"],\"warning\":[4],\"divider\":[4]}]]],[\"dso-card\",[[1,\"dso-card\",{\"href\":[513],\"mode\":[513],\"active\":[516]}]]],[\"dso-date-picker-legacy\",[[2,\"dso-date-picker-legacy\",{\"name\":[1],\"identifier\":[1],\"disabled\":[516],\"role\":[1],\"direction\":[1],\"required\":[4],\"invalid\":[516],\"describedBy\":[1,\"described-by\"],\"dsoAutofocus\":[4,\"dso-autofocus\"],\"value\":[1537],\"min\":[1],\"max\":[1],\"activeFocus\":[32],\"focusedDay\":[32],\"open\":[32],\"visible\":[32],\"setFocus\":[64],\"show\":[64],\"hide\":[64]},[[6,\"click\",\"handleDocumentClick\"]]]]],[\"dso-document-card\",[[1,\"dso-document-card\",{\"href\":[513],\"active\":[516]}]]],[\"dso-helpcenter-panel\",[[1,\"dso-helpcenter-panel\",{\"label\":[1],\"url\":[1],\"visibility\":[32],\"isOpen\":[32],\"slideState\":[32],\"loadIframe\":[32]},[[8,\"keydown\",\"keyDownListener\"]],{\"url\":[\"watchUrl\"],\"isOpen\":[\"watchIsOpen\"]}]]],[\"dso-list-button\",[[1,\"dso-list-button\",{\"label\":[1],\"sublabel\":[1],\"count\":[2],\"min\":[8],\"max\":[8],\"checked\":[516],\"disabled\":[516],\"subcontentPrefix\":[1,\"subcontent-prefix\"]}]]],[\"dso-mark-bar\",[[1,\"dso-mark-bar\",{\"value\":[1],\"label\":[1],\"current\":[2],\"totalCount\":[2,\"total-count\"],\"dsoFocus\":[64]}]]],[\"dso-plekinfo-card\",[[1,\"dso-plekinfo-card\",{\"wijzigactie\":[513],\"href\":[513],\"targetBlank\":[4,\"target-blank\"],\"active\":[516]}]]],[\"dso-skiplink\",[[1,\"dso-skiplink\",{\"to\":[513],\"label\":[513]}]]],[\"dso-accordion\",[[1,\"dso-accordion\",{\"variant\":[6145],\"reverseAlign\":[6148,\"reverse-align\"],\"_getState\":[64]}]]],[\"dso-action-list\",[[1,\"dso-action-list\",{\"listTitle\":[1,\"list-title\"]}]]],[\"dso-banner\",[[1,\"dso-banner\",{\"status\":[513],\"compact\":[4],\"noIcon\":[4,\"no-icon\"]}]]],[\"dso-card-container\",[[1,\"dso-card-container\",{\"mode\":[513]}]]],[\"dso-contact-information\",[[1,\"dso-contact-information\"]]],[\"dso-date-picker\",[[2,\"dso-date-picker\",{\"name\":[1],\"identifier\":[1],\"disabled\":[516],\"required\":[516],\"invalid\":[516],\"describedBy\":[1,\"described-by\"],\"dsoAutofocus\":[4,\"dso-autofocus\"],\"value\":[513],\"min\":[1],\"max\":[1]}]]],[\"dso-highlight-box\",[[1,\"dso-highlight-box\",{\"yellow\":[516],\"border\":[516],\"white\":[516],\"dropShadow\":[516,\"drop-shadow\"],\"step\":[514]}]]],[\"dso-input-range\",[[1,\"dso-input-range\",{\"min\":[2],\"max\":[2],\"value\":[2],\"step\":[2],\"label\":[1],\"unit\":[1],\"description\":[1]}]]],[\"dso-logo\",[[1,\"dso-logo\",{\"name\":[513],\"logoUrl\":[513,\"logo-url\"],\"label\":[513],\"labelUrl\":[513,\"label-url\"],\"ribbon\":[513]}]]],[\"dso-progress-bar\",[[1,\"dso-progress-bar\",{\"progress\":[2],\"min\":[2],\"max\":[2]}]]],[\"dso-tab\",[[1,\"dso-tab\",{\"active\":[516],\"disabled\":[516],\"href\":[1],\"_dsoFocus\":[64]}]]],[\"dso-tabs\",[[1,\"dso-tabs\"]]],[\"dso-viewer-grid\",[[1,\"dso-viewer-grid\",{\"mode\":[513],\"filterpanelTitle\":[513,\"filterpanel-title\"],\"filterpanelOpen\":[516,\"filterpanel-open\"],\"overlayOpen\":[516,\"overlay-open\"],\"documentPanelOpen\":[516,\"document-panel-open\"],\"mainSize\":[513,\"main-size\"],\"activeTab\":[1,\"active-tab\"],\"documentPanelSize\":[513,\"document-panel-size\"],\"mainPanelExpanded\":[4,\"main-panel-expanded\"],\"mainPanelHidden\":[4,\"main-panel-hidden\"],\"tabView\":[32],\"_checkMainPanelVisibility\":[64]},null,{\"documentPanelOpen\":[\"documentPanelOpenWatcher\"],\"filterpanelOpen\":[\"filterpanelOpenWatcher\"],\"overlayOpen\":[\"overlayOpenWatcher\"]}]]],[\"dso-info-button\",[[1,\"dso-info-button\",{\"active\":[1540],\"secondary\":[4],\"label\":[1],\"hover\":[32],\"setFocus\":[64]}]]],[\"dso-toggletip\",[[1,\"dso-toggletip\",{\"label\":[1],\"position\":[1],\"small\":[4],\"secondary\":[4],\"active\":[32]}]]],[\"dso-dropdown-menu\",[[1,\"dso-dropdown-menu\",{\"open\":[1540],\"dropdownAlign\":[1,\"dropdown-align\"],\"dropdownOptionsOffset\":[2,\"dropdown-options-offset\"],\"checkable\":[4],\"boundary\":[1],\"placement\":[1],\"strategy\":[1]},[[8,\"click\",\"onClick\"],[8,\"keydown\",\"keyDownListener\"]],{\"placement\":[\"watchPosition\"],\"dropdownAlign\":[\"watchPosition\"],\"dropdownOptionsOffset\":[\"watchOptionsOffset\"],\"strategy\":[\"watchStrategy\"]}]]],[\"dso-scrollable\",[[1,\"dso-scrollable\",{\"scrollPosition\":[32],\"_setScrollState\":[64]}]]],[\"dso-tooltip\",[[1,\"dso-tooltip\",{\"descriptive\":[516],\"position\":[1],\"strategy\":[1],\"noArrow\":[4,\"no-arrow\"],\"stateless\":[4],\"small\":[4],\"active\":[1540],\"hidden\":[32],\"activate\":[64],\"deactivate\":[64]},null,{\"position\":[\"watchPosition\"],\"strategy\":[\"watchStrategy\"],\"active\":[\"watchActive\"]}]]],[\"dso-alert_6\",[[1,\"dso-ozon-content\",{\"content\":[1],\"inline\":[516],\"addSpaceBeforeNode\":[516,\"add-space-before-node\"],\"mark\":[16],\"state\":[32]},null,{\"content\":[\"contentWatcher\"]}],[1,\"dso-alert\",{\"status\":[513],\"roleAlert\":[4,\"role-alert\"],\"compact\":[516],\"closable\":[4]}],[1,\"dso-image-overlay\",{\"wijzigactie\":[1],\"active\":[32],\"zoomable\":[32]},[[2,\"load\",\"loadListener\"]]],[1,\"dso-panel\",{\"closeButtonLabel\":[1,\"close-button-label\"],\"emphasized\":[4]}],[1,\"dso-table\",{\"noModal\":[516,\"no-modal\"],\"isResponsive\":[516,\"is-responsive\"],\"modalActive\":[32],\"placeholderHeight\":[32]}],[1,\"dso-badge\",{\"status\":[1]}]]],[\"dso-annotation-locatie_2\",[[1,\"dso-document-component\",{\"heading\":[1],\"label\":[1],\"nummer\":[1],\"opschrift\":[1],\"kop\":[1],\"inhoud\":[1],\"open\":[516],\"filtered\":[516],\"notApplicable\":[516,\"not-applicable\"],\"genesteOntwerpInformatie\":[516,\"geneste-ontwerp-informatie\"],\"bevatOntwerpInformatie\":[516,\"bevat-ontwerp-informatie\"],\"annotated\":[516],\"gereserveerd\":[4],\"vervallen\":[4],\"openAnnotation\":[516,\"open-annotation\"],\"alternativeTitle\":[1,\"alternative-title\"],\"type\":[513],\"wijzigactie\":[513],\"annotationsWijzigactie\":[513,\"annotations-wijzigactie\"],\"mark\":[16],\"recursiveToggle\":[8,\"recursive-toggle\"],\"mode\":[513],\"href\":[513]}],[1,\"dso-annotation-locatie\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"locatieNoemer\":[1,\"locatie-noemer\"]}]]],[\"dso-attachments-counter_2\",[[1,\"dso-attachments-counter\",{\"count\":[2]}],[1,\"dso-expandable\",{\"open\":[516],\"enableAnimation\":[516,\"enable-animation\"],\"minimumHeight\":[2,\"minimum-height\"],\"isClosed\":[32]},[[0,\"transitionstart\",\"transitionstartHandler\"],[0,\"transitionend\",\"transitionendHandler\"]],{\"open\":[\"toggleOpen\"]}]]],[\"dso-progress-indicator\",[[1,\"dso-progress-indicator\",{\"label\":[1],\"size\":[513],\"block\":[516]}]]],[\"dso-responsive-element\",[[1,\"dso-responsive-element\",{\"sizeAlias\":[32],\"sizeWidth\":[32],\"getSize\":[64]}]]],[\"dso-info_2\",[[6,\"dso-selectable\",{\"type\":[1],\"identifier\":[1],\"name\":[1],\"value\":[1],\"invalid\":[4],\"describedById\":[1,\"described-by-id\"],\"labelledById\":[1,\"labelled-by-id\"],\"disabled\":[4],\"required\":[4],\"checked\":[516],\"indeterminate\":[4],\"infoFixed\":[4,\"info-fixed\"],\"infoActive\":[32],\"keyboardFocus\":[32],\"toggleInfo\":[64]},null,{\"indeterminate\":[\"setIndeterminate\"]}],[1,\"dso-info\",{\"fixed\":[516],\"active\":[516]}]]],[\"dso-label_3\",[[1,\"dso-renvooi\",{\"value\":[1]}],[6,\"dso-slide-toggle\",{\"checked\":[4],\"disabled\":[4],\"accessibleLabel\":[1,\"accessible-label\"],\"labelledbyId\":[1,\"labelledby-id\"],\"identifier\":[1],\"hasVisibleLabel\":[32]}],[1,\"dso-label\",{\"compact\":[4],\"removable\":[516],\"status\":[1],\"truncate\":[4],\"removeHover\":[32],\"removeFocus\":[32],\"textHover\":[32],\"textFocus\":[32],\"isTruncated\":[32],\"labelText\":[32],\"_truncateLabel\":[64]},[[4,\"keydown\",\"keyDownListener\"]],{\"removable\":[\"watchRemovable\"],\"truncate\":[\"watchTruncate\"]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"dso-icon\",[[1,\"dso-icon\",{\"icon\":[1]}]]],[\"dsot-document-component-demo\",[[2,\"dsot-document-component-demo\",{\"showCanvas\":[516,\"show-canvas\"],\"jsonFile\":[1,\"json-file\"],\"openDefault\":[4,\"open-default\"],\"mode\":[513],\"response\":[32],\"document\":[32],\"openOrClosed\":[32],\"openedAnnotation\":[32],\"filtered\":[32],\"notApplicable\":[32],\"activeAnnotationSelectables\":[32]},null,{\"jsonFile\":[\"jsonFileWatcher\"],\"openDefault\":[\"openDefaultWatcher\"]}]]],[\"dso-accordion-section\",[[1,\"dso-accordion-section\",{\"handleTitle\":[1,\"handle-title\"],\"wijzigactie\":[1],\"heading\":[1],\"handleUrl\":[1,\"handle-url\"],\"status\":[1],\"attachmentCount\":[2,\"attachment-count\"],\"icon\":[1],\"statusDescription\":[1,\"status-description\"],\"open\":[516],\"hasNestedAccordion\":[516,\"has-nested-accordion\"],\"label\":[1],\"labelStatus\":[1,\"label-status\"],\"activatable\":[516],\"active\":[516],\"hover\":[32],\"focusHandle\":[64]}]]],[\"dso-annotation-activiteit\",[[1,\"dso-annotation-activiteit\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"regelKwalificatie\":[1,\"regel-kwalificatie\"],\"locatieNoemers\":[16],\"regelKwalificatieVoorzetsel\":[1,\"regel-kwalificatie-voorzetsel\"]}]]],[\"dso-annotation-gebiedsaanwijzing\",[[1,\"dso-annotation-gebiedsaanwijzing\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1]}]]],[\"dso-annotation-omgevingsnormwaarde\",[[1,\"dso-annotation-omgevingsnormwaarde\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"toelichting\":[1],\"waardes\":[16],\"eenheid\":[1]}]]],[\"dso-advanced-select\",[[1,\"dso-advanced-select\",{\"options\":[16],\"active\":[16],\"activeHint\":[1,\"active-hint\"],\"open\":[32]},[[8,\"keydown\",\"keyDownListener\"]]]]],[\"dso-legend-item\",[[1,\"dso-legend-item\",{\"disabled\":[516],\"disabledMessage\":[1,\"disabled-message\"],\"removable\":[4],\"showBody\":[32]}]]],[\"dso-map-base-layers\",[[1,\"dso-map-base-layers\",{\"group\":[1],\"baseLayers\":[16]}]]],[\"dso-map-overlays\",[[1,\"dso-map-overlays\",{\"group\":[1],\"overlays\":[16]}]]],[\"dso-annotation-kaart\",[[1,\"dso-annotation-kaart\",{\"wijzigactie\":[513],\"naam\":[1],\"href\":[513]}]]],[\"dso-autosuggest\",[[6,\"dso-autosuggest\",{\"suggestions\":[16],\"loading\":[4],\"loadingLabel\":[1,\"loading-label\"],\"loadingDelayed\":[2,\"loading-delayed\"],\"notFoundLabel\":[1,\"not-found-label\"],\"suggestOnFocus\":[4,\"suggest-on-focus\"],\"mark\":[16],\"showSuggestions\":[32],\"selectedSuggestion\":[32],\"selectedSuggestionGroup\":[32],\"notFound\":[32],\"showLoading\":[32],\"listItemBlockSize\":[32],\"listboxContainerMaxBlockSize\":[32]},[[4,\"click\",\"onDocumentClick\"]],{\"suggestions\":[\"suggestionsWatcher\"]}]]],[\"dso-project-item\",[[1,\"dso-project-item\",{\"label\":[1]}]]],[\"dso-header\",[[1,\"dso-header\",{\"mainMenu\":[16],\"useDropDownMenu\":[1,\"use-drop-down-menu\"],\"authStatus\":[1,\"auth-status\"],\"loginUrl\":[1,\"login-url\"],\"logoutUrl\":[1,\"logout-url\"],\"showHelp\":[4,\"show-help\"],\"helpUrl\":[1,\"help-url\"],\"userProfileName\":[1,\"user-profile-name\"],\"userProfileUrl\":[1,\"user-profile-url\"],\"userHomeUrl\":[1,\"user-home-url\"],\"userHomeActive\":[4,\"user-home-active\"],\"showDropDown\":[32],\"overflowMenuItems\":[32],\"dropdownOptionsOffset\":[32]},null,{\"useDropDownMenu\":[\"setShowDropDown\"]}]]],[\"dso-map-controls\",[[1,\"dso-map-controls\",{\"open\":[1540],\"disableZoom\":[1,\"disable-zoom\"],\"hideContent\":[32],\"toggleVisibility\":[64]},null,{\"open\":[\"watchOpen\"]}]]],[\"dso-modal\",[[1,\"dso-modal\",{\"fullscreen\":[516],\"modalTitle\":[1,\"modal-title\"],\"dialogRole\":[1,\"dialog-role\"],\"returnFocus\":[4,\"return-focus\"],\"showCloseButton\":[4,\"show-close-button\"],\"ariaId\":[32]}]]],[\"dso-pagination\",[[1,\"dso-pagination\",{\"totalPages\":[2,\"total-pages\"],\"currentPage\":[2,\"current-page\"],\"formatHref\":[16],\"availablePositions\":[32]},[[0,\"dsoSizeChange\",\"sizeChangeHandler\"]]]]],[\"dso-survey-rating\",[[1,\"dso-survey-rating\"]]],[\"dso-tree-view\",[[1,\"dso-tree-view\",{\"collection\":[16],\"focusItem\":[64]}]]],[\"dso-action-list-item\",[[1,\"dso-action-list-item\",{\"step\":[2],\"itemTitle\":[1,\"item-title\"],\"flowLine\":[4,\"flow-line\"],\"warning\":[4],\"divider\":[4]}]]],[\"dso-card\",[[1,\"dso-card\",{\"href\":[513],\"mode\":[513],\"active\":[516]}]]],[\"dso-date-picker-legacy\",[[2,\"dso-date-picker-legacy\",{\"name\":[1],\"identifier\":[1],\"disabled\":[516],\"role\":[1],\"direction\":[1],\"required\":[4],\"invalid\":[516],\"describedBy\":[1,\"described-by\"],\"dsoAutofocus\":[4,\"dso-autofocus\"],\"value\":[1537],\"min\":[1],\"max\":[1],\"activeFocus\":[32],\"focusedDay\":[32],\"open\":[32],\"visible\":[32],\"setFocus\":[64],\"show\":[64],\"hide\":[64]},[[6,\"click\",\"handleDocumentClick\"]]]]],[\"dso-document-card\",[[1,\"dso-document-card\",{\"href\":[513],\"active\":[516]}]]],[\"dso-helpcenter-panel\",[[1,\"dso-helpcenter-panel\",{\"label\":[1],\"url\":[1],\"visibility\":[32],\"isOpen\":[32],\"slideState\":[32],\"loadIframe\":[32]},[[8,\"keydown\",\"keyDownListener\"]],{\"url\":[\"watchUrl\"],\"isOpen\":[\"watchIsOpen\"]}]]],[\"dso-list-button\",[[1,\"dso-list-button\",{\"label\":[1],\"sublabel\":[1],\"count\":[2],\"min\":[8],\"max\":[8],\"checked\":[516],\"disabled\":[516],\"subcontentPrefix\":[1,\"subcontent-prefix\"]}]]],[\"dso-mark-bar\",[[1,\"dso-mark-bar\",{\"value\":[1],\"label\":[1],\"current\":[2],\"totalCount\":[2,\"total-count\"],\"dsoFocus\":[64]}]]],[\"dso-plekinfo-card\",[[1,\"dso-plekinfo-card\",{\"wijzigactie\":[513],\"href\":[513],\"targetBlank\":[4,\"target-blank\"],\"active\":[516]}]]],[\"dso-skiplink\",[[1,\"dso-skiplink\",{\"to\":[513],\"label\":[513]}]]],[\"dso-accordion\",[[1,\"dso-accordion\",{\"variant\":[6145],\"reverseAlign\":[6148,\"reverse-align\"],\"_getState\":[64]}]]],[\"dso-action-list\",[[1,\"dso-action-list\",{\"listTitle\":[1,\"list-title\"]}]]],[\"dso-banner\",[[1,\"dso-banner\",{\"status\":[513],\"compact\":[4],\"noIcon\":[4,\"no-icon\"]}]]],[\"dso-card-container\",[[1,\"dso-card-container\",{\"mode\":[513]}]]],[\"dso-contact-information\",[[1,\"dso-contact-information\"]]],[\"dso-date-picker\",[[2,\"dso-date-picker\",{\"name\":[1],\"identifier\":[1],\"disabled\":[516],\"required\":[516],\"invalid\":[516],\"describedBy\":[1,\"described-by\"],\"dsoAutofocus\":[4,\"dso-autofocus\"],\"value\":[513],\"min\":[1],\"max\":[1]}]]],[\"dso-highlight-box\",[[1,\"dso-highlight-box\",{\"yellow\":[516],\"border\":[516],\"white\":[516],\"dropShadow\":[516,\"drop-shadow\"],\"step\":[514]}]]],[\"dso-input-range\",[[1,\"dso-input-range\",{\"min\":[2],\"max\":[2],\"value\":[2],\"step\":[2],\"label\":[1],\"unit\":[1],\"description\":[1]}]]],[\"dso-logo\",[[1,\"dso-logo\",{\"name\":[513],\"logoUrl\":[513,\"logo-url\"],\"label\":[513],\"labelUrl\":[513,\"label-url\"],\"ribbon\":[513]}]]],[\"dso-progress-bar\",[[1,\"dso-progress-bar\",{\"progress\":[2],\"min\":[2],\"max\":[2]}]]],[\"dso-tab\",[[1,\"dso-tab\",{\"active\":[516],\"disabled\":[516],\"href\":[1],\"_dsoFocus\":[64]}]]],[\"dso-tabs\",[[1,\"dso-tabs\"]]],[\"dso-viewer-grid\",[[1,\"dso-viewer-grid\",{\"mode\":[513],\"filterpanelTitle\":[513,\"filterpanel-title\"],\"filterpanelOpen\":[516,\"filterpanel-open\"],\"overlayOpen\":[516,\"overlay-open\"],\"documentPanelOpen\":[516,\"document-panel-open\"],\"mainSize\":[513,\"main-size\"],\"activeTab\":[1,\"active-tab\"],\"documentPanelSize\":[513,\"document-panel-size\"],\"mainPanelExpanded\":[4,\"main-panel-expanded\"],\"mainPanelHidden\":[4,\"main-panel-hidden\"],\"tabView\":[32],\"_checkMainPanelVisibility\":[64]},null,{\"documentPanelOpen\":[\"documentPanelOpenWatcher\"],\"filterpanelOpen\":[\"filterpanelOpenWatcher\"],\"overlayOpen\":[\"overlayOpenWatcher\"]}]]],[\"dso-info-button\",[[1,\"dso-info-button\",{\"active\":[1540],\"secondary\":[4],\"label\":[1],\"hover\":[32],\"setFocus\":[64]}]]],[\"dso-toggletip\",[[1,\"dso-toggletip\",{\"label\":[1],\"position\":[1],\"small\":[4],\"secondary\":[4],\"active\":[32]}]]],[\"dso-dropdown-menu\",[[1,\"dso-dropdown-menu\",{\"open\":[1540],\"dropdownAlign\":[1,\"dropdown-align\"],\"dropdownOptionsOffset\":[2,\"dropdown-options-offset\"],\"checkable\":[4],\"boundary\":[1],\"placement\":[1],\"strategy\":[1]},[[8,\"click\",\"onClick\"],[8,\"keydown\",\"keyDownListener\"]],{\"placement\":[\"watchPosition\"],\"dropdownAlign\":[\"watchPosition\"],\"dropdownOptionsOffset\":[\"watchOptionsOffset\"],\"strategy\":[\"watchStrategy\"]}]]],[\"dso-scrollable\",[[1,\"dso-scrollable\",{\"scrollPosition\":[32],\"_setScrollState\":[64]}]]],[\"dso-tooltip\",[[1,\"dso-tooltip\",{\"descriptive\":[516],\"position\":[1],\"strategy\":[1],\"noArrow\":[4,\"no-arrow\"],\"stateless\":[4],\"small\":[4],\"active\":[1540],\"hidden\":[32],\"activate\":[64],\"deactivate\":[64]},null,{\"position\":[\"watchPosition\"],\"strategy\":[\"watchStrategy\"],\"active\":[\"watchActive\"]}]]],[\"dso-alert_6\",[[1,\"dso-ozon-content\",{\"content\":[1],\"inline\":[516],\"addSpaceBeforeNode\":[516,\"add-space-before-node\"],\"mark\":[16],\"state\":[32]},null,{\"content\":[\"contentWatcher\"]}],[1,\"dso-alert\",{\"status\":[513],\"roleAlert\":[4,\"role-alert\"],\"compact\":[516],\"closable\":[4]}],[1,\"dso-image-overlay\",{\"wijzigactie\":[1],\"active\":[32],\"zoomable\":[32]},[[2,\"load\",\"loadListener\"]]],[1,\"dso-panel\",{\"closeButtonLabel\":[1,\"close-button-label\"],\"emphasized\":[4]}],[1,\"dso-table\",{\"noModal\":[516,\"no-modal\"],\"isResponsive\":[516,\"is-responsive\"],\"modalActive\":[32],\"placeholderHeight\":[32]}],[1,\"dso-badge\",{\"status\":[1]}]]],[\"dso-annotation-locatie_2\",[[1,\"dso-document-component\",{\"heading\":[1],\"label\":[1],\"nummer\":[1],\"opschrift\":[1],\"kop\":[1],\"inhoud\":[1],\"open\":[516],\"filtered\":[516],\"notApplicable\":[516,\"not-applicable\"],\"genesteOntwerpInformatie\":[516,\"geneste-ontwerp-informatie\"],\"bevatOntwerpInformatie\":[516,\"bevat-ontwerp-informatie\"],\"annotated\":[516],\"gereserveerd\":[4],\"vervallen\":[4],\"openAnnotation\":[516,\"open-annotation\"],\"alternativeTitle\":[1,\"alternative-title\"],\"type\":[513],\"wijzigactie\":[513],\"annotationsWijzigactie\":[513,\"annotations-wijzigactie\"],\"mark\":[16],\"recursiveToggle\":[8,\"recursive-toggle\"],\"mode\":[513],\"href\":[513]}],[1,\"dso-annotation-locatie\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"locatieNoemer\":[1,\"locatie-noemer\"]}]]],[\"dso-attachments-counter_2\",[[1,\"dso-attachments-counter\",{\"count\":[2]}],[1,\"dso-expandable\",{\"open\":[516],\"enableAnimation\":[516,\"enable-animation\"],\"minimumHeight\":[2,\"minimum-height\"],\"isClosed\":[32]},[[0,\"transitionstart\",\"transitionstartHandler\"],[0,\"transitionend\",\"transitionendHandler\"]],{\"open\":[\"toggleOpen\"]}]]],[\"dso-progress-indicator\",[[1,\"dso-progress-indicator\",{\"label\":[1],\"size\":[513],\"block\":[516]}]]],[\"dso-responsive-element\",[[1,\"dso-responsive-element\",{\"sizeAlias\":[32],\"sizeWidth\":[32],\"getSize\":[64]}]]],[\"dso-info_2\",[[6,\"dso-selectable\",{\"type\":[1],\"identifier\":[1],\"name\":[1],\"value\":[1],\"invalid\":[4],\"describedById\":[1,\"described-by-id\"],\"labelledById\":[1,\"labelled-by-id\"],\"disabled\":[4],\"required\":[4],\"checked\":[516],\"indeterminate\":[4],\"infoFixed\":[4,\"info-fixed\"],\"infoActive\":[32],\"keyboardFocus\":[32],\"toggleInfo\":[64]},null,{\"indeterminate\":[\"setIndeterminate\"]}],[1,\"dso-info\",{\"fixed\":[516],\"active\":[516]}]]],[\"dso-label_3\",[[1,\"dso-renvooi\",{\"value\":[1]}],[6,\"dso-slide-toggle\",{\"checked\":[4],\"disabled\":[4],\"accessibleLabel\":[1,\"accessible-label\"],\"labelledbyId\":[1,\"labelledby-id\"],\"identifier\":[1],\"hasVisibleLabel\":[32]}],[1,\"dso-label\",{\"compact\":[4],\"removable\":[516],\"status\":[1],\"truncate\":[4],\"removeHover\":[32],\"removeFocus\":[32],\"textHover\":[32],\"textFocus\":[32],\"isTruncated\":[32],\"labelText\":[32],\"_truncateLabel\":[64]},[[4,\"keydown\",\"keyDownListener\"]],{\"removable\":[\"watchRemovable\"],\"truncate\":[\"watchTruncate\"]}]]]]"), options);
 };
 
 export { defineCustomElements };

package/dist/types/components/annotation/annotation-list-renvooi-values.d.ts

@@ -0,0 +1,7 @@
+import { FunctionalComponent } from "../../stencil-public-runtime";
+import { RenvooiValue } from "../renvooi/renvooi.interfaces";
+interface AnnotationListRenvooiValues {
+    values: RenvooiValue[] | undefined;
+}
+export declare const AnnotationListRenvooiValues: FunctionalComponent<AnnotationListRenvooiValues>;
+export {};

package/dist/types/components/autosuggest/autosuggest.d.ts

@@ -1,16 +1,21 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { AutosuggestMarkFunction, Suggestion } from "./autosuggest.interfaces";
+import { AutosuggestMarkFunction, Suggestion, SuggestionGroup } from "./autosuggest.interfaces";
 export declare class Autosuggest {
     /**
-     * The suggestions for the value of the slotted input element. Optionally a
-     * Suggestion can have a `type` and `item`.
+     * The suggestions for the value of the slotted input element.
      *
-     * The `type` is used to style the suggestion. `item` can be use to reference
-     * the original object that was used to create the suggestion.
+     * This can be an array of type Suggestion or an Array of type SuggestionGroup.
+     *
+     * A suggestionGroup must have a `groupLabel` and `suggestions`.
+     *
+     * A suggestion must have a `value` and can have a `type`, an `item` or `extras`.
+     *
+     * The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to
+     * create the suggestion. `extras` is an array of additional strings to further specify the suggestion.
      *
      * The value should be null when no suggestions have been fetched.
      */
-    readonly suggestions: Suggestion[] | null;
+    readonly suggestions: Suggestion[] | SuggestionGroup[] | null;
     /**
      * Shows progress indicator when fetching results.
      */
@@ -52,6 +57,7 @@ export declare class Autosuggest {
     host: HTMLDsoAutosuggestElement;
     showSuggestions: boolean;
     selectedSuggestion: Suggestion | undefined;
+    selectedSuggestionGroup: SuggestionGroup | undefined;
     notFound: boolean;
     showLoading: boolean;
     listItemBlockSize: number;
@@ -86,7 +92,10 @@ export declare class Autosuggest {
     private selectFirstSuggestion;
     private selectLastSuggestion;
     private selectNextSuggestion;
+    private selectNextGroupedSuggestion;
     private selectPreviousSuggestion;
+    private selectPreviousGroupedSuggestion;
+    private get suggestionGroups();
     private setAriaActiveDescendant;
     private resetSelectedSuggestion;
     private openSuggestions;
@@ -94,6 +103,8 @@ export declare class Autosuggest {
     private pickSelectedValue;
     private onKeyDown;
     private listboxItemId;
-    private getChunkedExtras;
+    private listboxGroupedItemId;
+    private getMarkedChunkedExtras;
+    private getMarkedSuggestions;
     render(): any;
 }

package/dist/types/components/autosuggest/autosuggest.interfaces.d.ts

@@ -16,6 +16,16 @@ export interface Suggestion {
      */
     extras?: string[];
 }
+export interface SuggestionGroup {
+    /**
+     * The label of the group of suggestions
+     */
+    groupLabel: string;
+    /**
+     * The suggestions of this group for the value of the slotted input element.
+     */
+    suggestions: Suggestion[];
+}
 export type AutosuggestMarkItem = {
     mark: string;
 } | string;

package/dist/types/components/ozon-content/nodes/abbr.node.d.ts

@@ -0,0 +1,6 @@
+import { OzonContentNode } from "../ozon-content-node.interface";
+import { OzonContentNodeContext } from "../ozon-content-node-context.interface";
+export declare class OzonContentAbbrNode implements OzonContentNode {
+    name: string;
+    render(node: Element, { mapNodeToJsx }: OzonContentNodeContext): any;
+}

package/dist/types/components/pagination/pagination.d.ts

@@ -34,4 +34,6 @@ export declare class Pagination implements ComponentInterface {
     private getPageRange;
     private showEllipsisAfterFirst;
     private showEllipsisBeforeLast;
+    private showEllipsisLastWithoutTotal;
+    private getPageRangeWithoutTotalPages;
 }

package/dist/types/components/renvooi/renvooi.d.ts

@@ -8,5 +8,6 @@ export declare class Renvooi implements ComponentInterface {
      * The renvooi value to render.
      */
     value?: RenvooiValue | RenvooiValue[];
+    get values(): RenvooiValue[];
     render(): any;
 }

package/dist/types/components.d.ts

@@ -13,7 +13,7 @@ import { AdvancedSelectChangeEvent, AdvancedSelectOption, AdvancedSelectOptionOr
 import { AlertCloseEvent } from "./components/alert/alert.interfaces";
 import { AnnotationActiveChangeEvent, AnnotationWijzigactie } from "./components/annotation/annotation.interfaces";
 import { AnnotationKaartClickEvent } from "./components/annotation/annotation-kaart/annotation-kaart.interfaces";
-import { AutosuggestMarkFunction, Suggestion } from "./components/autosuggest/autosuggest.interfaces";
+import { AutosuggestMarkFunction, Suggestion, SuggestionGroup } from "./components/autosuggest/autosuggest.interfaces";
 import { BadgeStatus } from "./components/badge/badge.interfaces";
 import { CardClickEvent } from "./components/card/card.interfaces";
 import { CardContainerMode } from "./components/card-container/card-container.interfaces";
@@ -55,7 +55,7 @@ export { AdvancedSelectChangeEvent, AdvancedSelectOption, AdvancedSelectOptionOr
 export { AlertCloseEvent } from "./components/alert/alert.interfaces";
 export { AnnotationActiveChangeEvent, AnnotationWijzigactie } from "./components/annotation/annotation.interfaces";
 export { AnnotationKaartClickEvent } from "./components/annotation/annotation-kaart/annotation-kaart.interfaces";
-export { AutosuggestMarkFunction, Suggestion } from "./components/autosuggest/autosuggest.interfaces";
+export { AutosuggestMarkFunction, Suggestion, SuggestionGroup } from "./components/autosuggest/autosuggest.interfaces";
 export { BadgeStatus } from "./components/badge/badge.interfaces";
 export { CardClickEvent } from "./components/card/card.interfaces";
 export { CardContainerMode } from "./components/card-container/card-container.interfaces";
@@ -368,9 +368,9 @@ export namespace Components {
          */
         "suggestOnFocus": boolean;
         /**
-          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.  The value should be null when no suggestions have been fetched.
+          * The suggestions for the value of the slotted input element.  This can be an array of type Suggestion or an Array of type SuggestionGroup.  A suggestionGroup must have a `groupLabel` and `suggestions`.  A suggestion must have a `value` and can have a `type`, an `item` or `extras`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion. `extras` is an array of additional strings to further specify the suggestion.  The value should be null when no suggestions have been fetched.
          */
-        "suggestions": Suggestion[] | null;
+        "suggestions": Suggestion[] | SuggestionGroup[] | null;
     }
     interface DsoBadge {
         /**
@@ -2802,9 +2802,9 @@ declare namespace LocalJSX {
          */
         "suggestOnFocus"?: boolean;
         /**
-          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.  The value should be null when no suggestions have been fetched.
+          * The suggestions for the value of the slotted input element.  This can be an array of type Suggestion or an Array of type SuggestionGroup.  A suggestionGroup must have a `groupLabel` and `suggestions`.  A suggestion must have a `value` and can have a `type`, an `item` or `extras`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion. `extras` is an array of additional strings to further specify the suggestion.  The value should be null when no suggestions have been fetched.
          */
-        "suggestions"?: Suggestion[] | null;
+        "suggestions"?: Suggestion[] | SuggestionGroup[] | null;
     }
     interface DsoBadge {
         /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dso-toolkit/core",
-  "version": "68.5.0",
+  "version": "69.1.0",
   "description": "DSO Toolkit Web Components",
   "main": "dist/index.cjs.js",
   "module": "dist/components/index.js",
@@ -23,7 +23,7 @@
     "@stencil/core": "4.25.1",
     "@stencil/store": "^2.0.16",
     "clsx": "^2.1.1",
-    "dso-toolkit": "^68.5.0",
+    "dso-toolkit": "^69.1.0",
     "escape-string-regexp": "^5.0.0",
     "focus-trap": "^7.6.4",
     "i18next": "^24.2.2",
@@ -54,7 +54,7 @@
     "typescript": "~5.6.3"
   },
   "peerDependencies": {
-    "dso-toolkit": "68.5.0"
+    "dso-toolkit": "69.1.0"
   },
   "nx": {
     "includedScripts": []

package/dist/dso-toolkit/p-135bf595.entry.js

@@ -1,2 +0,0 @@
-import{r as s,c as t,h as i,F as e,a as o}from"./p-abc59cdf.js";import{d as h}from"./p-16e112f1.js";import{i as n}from"./p-078b7eca.js";import{v as a}from"./p-82796232.js";function r(s){if(typeof s!=="string"){throw new TypeError("Expected a string")}return s.replace(/[|\\{}()[\]^$+*?.]/g,"\\$&").replace(/-/g,"\\x2d")}const l={en:{"dso-autosuggest":{notFound:"{{inputValue}} was not found."}},nl:{"dso-autosuggest":{notFound:"{{inputValue}} is niet gevonden."}}};const u=".sc-dso-autosuggest-h{display:block;position:relative}.listbox-container.sc-dso-autosuggest{inset-inline:0;inset-block-start:100%;block-size:auto;max-block-size:var(--max-block-size);min-block-size:50px;overflow-y:auto;position:absolute;z-index:200}ul.sc-dso-autosuggest,.autosuggest-progress-box.sc-dso-autosuggest{background-clip:padding-box;background-color:#fff;border:1px solid rgba(0, 0, 0, 0.15);border-radius:4px;box-shadow:0 6px 12px rgba(0, 0, 0, 0.175);list-style-type:none;margin-block:0}.autosuggest-progress-box.sc-dso-autosuggest{padding-block:12px;padding-inline:8px}ul.sc-dso-autosuggest{padding-block:8px;padding-inline:0}ul.sc-dso-autosuggest li.sc-dso-autosuggest{padding-block:4px;padding-inline:16px}ul.sc-dso-autosuggest li.sc-dso-autosuggest .suggestion-row.sc-dso-autosuggest{display:flex;justify-content:space-between}li[aria-selected=true].sc-dso-autosuggest{cursor:pointer;background-color:#39870c}li[aria-selected=true].sc-dso-autosuggest,li[aria-selected=true].sc-dso-autosuggest .type.sc-dso-autosuggest,li[aria-selected=true].sc-dso-autosuggest .extra.sc-dso-autosuggest{color:#fff}mark.sc-dso-autosuggest{font-weight:700;background-color:inherit;color:inherit;padding:0}.type.sc-dso-autosuggest,.extra.sc-dso-autosuggest{color:#666}.type.sc-dso-autosuggest{text-align:end}.extra.sc-dso-autosuggest{font-size:14px;line-height:21px}.extra.sc-dso-autosuggest:not(:first-child){text-align:end}";const d=u;const c=10;const g=8;const f=1;const p=class{constructor(i){s(this,i);this.dsoSelect=t(this,"dsoSelect",7);this.dsoChange=t(this,"dsoChange",7);this.dsoSearch=t(this,"dsoSearch",7);this.suggestions=null;this.loading=false;this.loadingLabel="Een moment geduld.";this.suggestOnFocus=false;this.showSuggestions=false;this.notFound=false;this.showLoading=false;this.listItemBlockSize=0;this.listboxContainerMaxBlockSize=0;this.listboxItems=[];this.listboxId=a();this.inputId=a();this.labelId=a();this.resizeObserver=new ResizeObserver(h((()=>this.setListboxContainerMaxBlockSize()),150));this.debouncedEmitValue=h((s=>{this.dsoChange.emit(s);this.debouncedShowLoading()}),200);this.debouncedShowLoading=h((()=>{if(this.inputValue){this.showLoading=true}}),this.loadingDelayed);this.inputValue="";this.onInput=s=>{if(!(s.target instanceof HTMLInputElement)){return}this.showLoading=!this.loadingDelayed;this.inputValue=s.target.value;this.debouncedEmitValue(s.target.value.match(/(\S+)/g)?s.target.value:"")};this.onFocusIn=()=>{if(this.suggestOnFocus){this.openSuggestions()}};this.text=n((()=>this.host),l);this.onWindowResize=h((()=>this.setListboxContainerMaxBlockSize()),150);this.onScrollend=()=>this.setListboxContainerMaxBlockSize();this.onKeyDown=s=>{if(s.defaultPrevented||this.loading){return}switch(s.key){case"ArrowDown":if(!this.showSuggestions){this.openSuggestions("first")}else{this.selectNextSuggestion()}break;case"ArrowUp":if(!this.showSuggestions){this.openSuggestions("last")}else{this.selectPreviousSuggestion()}break;case"Tab":this.closeSuggestions();return;case"Escape":this.closeSuggestions();break;case"Enter":this.pickSelectedValue();break;default:return}s.preventDefault()}}suggestionsWatcher(){this.resetSelectedSuggestion();if((!this.showSuggestions||!this.notFound)&&this.inputValue){this.openSuggestions()}else if((this.showSuggestions||this.notFound)&&!this.inputValue){this.closeSuggestions()}}onDocumentClick(s){if((this.showSuggestions||this.notFound)&&this.listbox&&s.target instanceof Node&&!this.listbox.contains(s.target)&&this.input!==s.target){this.closeSuggestions()}}componentDidRender(){this.setListboxContainerMaxBlockSize()}connectedCallback(){setTimeout((()=>{const s=this.host.querySelector('input[type="text"]');if(!(s instanceof HTMLInputElement)){return}this.input=s;if(s.id){this.inputId=s.id}else{s.id=this.inputId}if(!this.input.labels||this.input.labels.length<1){return}const t=this.input.labels[0];if(t===null||t===void 0?void 0:t.id){this.labelId=t.id}else if(t){t.id=this.labelId}this.input.setAttribute("role","combobox");this.input.setAttribute("aria-haspopup","listbox");this.input.setAttribute("aria-expanded","false");this.input.setAttribute("autocomplete","off");this.input.setAttribute("aria-autocomplete","list");this.input.setAttribute("aria-activedescendant","");this.input.addEventListener("input",this.onInput);this.input.addEventListener("keydown",this.onKeyDown);this.input.addEventListener("focusin",this.onFocusIn);window.addEventListener("resize",this.onWindowResize);document.addEventListener("scrollend",this.onScrollend);this.resizeObserver.observe(this.host);this.setListboxContainerMaxBlockSize()}))}disconnectedCallback(){var s,t,i;(s=this.input)===null||s===void 0?void 0:s.removeEventListener("input",this.onInput);(t=this.input)===null||t===void 0?void 0:t.removeEventListener("keydown",this.onKeyDown);(i=this.input)===null||i===void 0?void 0:i.removeEventListener("focusin",this.onFocusIn);window.removeEventListener("resize",this.onWindowResize);document.removeEventListener("scrollend",this.onScrollend);this.resizeObserver.disconnect()}setListboxContainerMaxBlockSize(){if(!this.listboxContainer||!this.showSuggestions){return}if(this.listboxItems[0]&&this.showSuggestions){this.listItemBlockSize=this.listboxItems[0].getBoundingClientRect().height}const s=window.innerHeight-this.host.getBoundingClientRect().bottom;const t=this.listItemBlockSize*c+2*g+2*f;if(s>this.listItemBlockSize){if(s<t){this.listboxContainerMaxBlockSize=s-2*g}else{this.listboxContainerMaxBlockSize=t}}}showInputValueNotFound(s){var t,i;return this.processAutosuggestMarkItems(this.markTerms((i=(t=this.input)===null||t===void 0?void 0:t.value.split(" ").filter((s=>s)))!==null&&i!==void 0?i:[],s))}handleMark(s,t,i,e){var o,h;if(this.mark&&i){return this.processAutosuggestMarkItems(this.mark(s,t,i,e))}return this.processAutosuggestMarkItems(this.markTerms((h=(o=this.input)===null||o===void 0?void 0:o.value.split(" ").filter((s=>s)))!==null&&h!==void 0?h:[],t))}markTerms(s,t){if(!t||!s||s.length===0||s[0]===undefined){return[""]}const i=new RegExp(`(${r(s[0])})`,"gi");return t.split(i).reduce(((t,e)=>{if(!e){t.push(e)}else if(i.test(e)){t.push({mark:e})}else if(s.length===1){t.push(e)}else{t.push(...this.markTerms(s.slice(1),e))}return t}),[])}processAutosuggestMarkItems(s){if(s.length===0){return[""]}return s.map((s=>{if(typeof s==="object"){return i("mark",null,s.mark)}return s}))}selectSuggestion(s){this.selectedSuggestion=s;this.setAriaActiveDescendant()}selectFirstSuggestion(){if(!this.suggestions){return}this.selectedSuggestion=this.suggestions[0];this.setAriaActiveDescendant(true)}selectLastSuggestion(){if(!this.suggestions){return}this.selectedSuggestion=this.suggestions[this.suggestions.length-1];this.setAriaActiveDescendant(true)}selectNextSuggestion(){var s;if(!this.suggestions){return}const t=this.selectedSuggestion?this.suggestions.indexOf(this.selectedSuggestion):-1;this.selectedSuggestion=(s=this.suggestions[t+1])!==null&&s!==void 0?s:this.suggestions[0];this.setAriaActiveDescendant(true)}selectPreviousSuggestion(){var s;if(!this.suggestions){return}const t=this.selectedSuggestion?this.suggestions.indexOf(this.selectedSuggestion):0;this.selectedSuggestion=(s=this.suggestions[t-1])!==null&&s!==void 0?s:this.suggestions[this.suggestions.length-1];this.setAriaActiveDescendant(true)}setAriaActiveDescendant(s=false){var t,i;if(this.selectedSuggestion){const e=this.listboxItemId(this.selectedSuggestion);(t=this.input)===null||t===void 0?void 0:t.setAttribute("aria-activedescendant",e);if(s){(i=document.getElementById(e))===null||i===void 0?void 0:i.scrollIntoView({block:"nearest"})}}}resetSelectedSuggestion(){var s;this.showLoading=!this.loadingDelayed;this.notFound=false;this.selectedSuggestion=undefined;(s=this.input)===null||s===void 0?void 0:s.setAttribute("aria-activedescendant","")}openSuggestions(s){var t,i,e,o;this.showSuggestions=(t=this.suggestions&&this.suggestions.length>0)!==null&&t!==void 0?t:false;this.notFound=(e=this.suggestions&&((i=this.suggestions)===null||i===void 0?void 0:i.length)===0)!==null&&e!==void 0?e:false;(o=this.input)===null||o===void 0?void 0:o.setAttribute("aria-expanded",(this.showSuggestions||this.notFound).toString());if(this.showSuggestions&&s==="first"){this.selectFirstSuggestion()}else if(this.showSuggestions&&s==="last"){this.selectLastSuggestion()}}closeSuggestions(){var s;this.showSuggestions=false;this.notFound=false;(s=this.input)===null||s===void 0?void 0:s.setAttribute("aria-expanded","false");this.selectFirstSuggestion()}pickSelectedValue(){var s;if(this.selectedSuggestion&&this.showSuggestions){this.dsoSelect.emit(this.selectedSuggestion)}else{this.dsoSearch.emit((s=this.input)===null||s===void 0?void 0:s.value)}this.closeSuggestions()}listboxItemId(s){if(!this.suggestions){return""}return`${this.inputId}-${this.suggestions.indexOf(s)+1}`}getChunkedExtras(s){return s.reduce(((s,t,i)=>{var e;const o=Math.floor(i/2);if(!s[o]){s[o]=[]}(e=s[o])===null||e===void 0?void 0:e.push(t);return s}),[])}render(){this.listboxItems=[];const s=this.showSuggestions||this.notFound;if(s&&this.input){this.input.setAttribute("aria-controls",this.listboxId)}else if(this.input){this.input.removeAttribute("aria-controls")}return i(e,null,i("slot",{key:"2ed8694b6cfa86863f0e22b6a7cfa1a1144e673f"}),this.loading&&this.showLoading?i("div",{class:"autosuggest-progress-box"},i("dso-progress-indicator",{label:this.loadingLabel})):s&&i("dso-scrollable",{class:"listbox-container",ref:s=>this.listboxContainer=s,style:{"--max-block-size":`${this.listboxContainerMaxBlockSize}px`}},i("ul",{role:"listbox","aria-live":"polite",id:this.listboxId,"aria-labelledby":this.labelId,ref:s=>this.listbox=s,tabindex:"0"},this.showSuggestions&&this.suggestions&&this.suggestions.map((s=>i("li",{role:"option",id:this.listboxItemId(s),key:s.value,onMouseEnter:()=>this.selectSuggestion(s),onMouseLeave:()=>this.resetSelectedSuggestion(),onClick:()=>this.pickSelectedValue(),"aria-selected":(s===this.selectedSuggestion).toString(),"aria-label":s.value,ref:s=>s&&this.listboxItems.push(s)},i("div",{class:"suggestion-row"},i("span",{class:"value"},this.handleMark(s,s.value,"value")),s.type?i("span",{class:"type"},this.handleMark(s,s.type,"type")):undefined),s.extras&&this.getChunkedExtras(s.extras).map(((t,e)=>i("div",{class:"suggestion-row"},t.map(((t,o)=>i("span",{class:"extra"},this.handleMark(s,t,"extra",e*2+o))))))))))||this.notFound&&i("li",null,i("span",{class:"value"},this.notFoundLabel||this.showInputValueNotFound(this.text("notFound",{inputValue:this.inputValue})))))))}get host(){return o(this)}static get watchers(){return{suggestions:["suggestionsWatcher"]}}};p.style=d;export{p as dso_autosuggest};
-//# sourceMappingURL=p-135bf595.entry.js.map

package/dist/dso-toolkit/p-135bf595.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["escapeStringRegexp","string","TypeError","replace","translations","en","notFound","nl","autosuggestCss","DsoAutosuggestStyle0","maxSuggestionsViewable","listboxPaddingBlock","listboxBorderWidth","Autosuggest","constructor","hostRef","this","suggestions","loading","loadingLabel","suggestOnFocus","showSuggestions","showLoading","listItemBlockSize","listboxContainerMaxBlockSize","listboxItems","listboxId","v4","inputId","labelId","resizeObserver","ResizeObserver","debounce","setListboxContainerMaxBlockSize","debouncedEmitValue","value","dsoChange","emit","debouncedShowLoading","inputValue","loadingDelayed","onInput","event","target","HTMLInputElement","match","onFocusIn","openSuggestions","text","i18n","host","onWindowResize","onScrollend","onKeyDown","defaultPrevented","key","selectNextSuggestion","selectPreviousSuggestion","closeSuggestions","pickSelectedValue","preventDefault","suggestionsWatcher","resetSelectedSuggestion","onDocumentClick","listbox","Node","contains","input","componentDidRender","connectedCallback","setTimeout","querySelector","id","labels","length","label","setAttribute","addEventListener","window","document","observe","disconnectedCallback","_a","removeEventListener","_b","_c","disconnect","listboxContainer","getBoundingClientRect","height","availableBlockSize","innerHeight","bottom","listboxMaxBlockSize","showInputValueNotFound","processAutosuggestMarkItems","markTerms","split","filter","t","handleMark","suggestion","type","extraIndex","mark","terms","suggestionValue","undefined","termRegex","RegExp","reduce","total","valuePart","push","test","slice","items","map","item","h","selectSuggestion","selectedSuggestion","setAriaActiveDescendant","selectFirstSuggestion","selectLastSuggestion","index","indexOf","scroll","listboxItemId","getElementById","scrollIntoView","block","_d","toString","dsoSelect","dsoSearch","getChunkedExtras","extras","resultArray","extra","chunkIndex","Math","floor","render","showListbox","removeAttribute","Fragment","class","ref","element","style","role","tabindex","onMouseEnter","onMouseLeave","onClick","li","chunk","c","i","notFoundLabel"],"sources":["../../node_modules/escape-string-regexp/index.js","src/components/autosuggest/autosuggest.i18n.ts","src/components/autosuggest/autosuggest.scss?tag=dso-autosuggest&encapsulation=scoped","src/components/autosuggest/autosuggest.tsx"],"sourcesContent":["export default function escapeStringRegexp(string) {\n\tif (typeof string !== 'string') {\n\t\tthrow new TypeError('Expected a string');\n\t}\n\n\t// Escape characters with special meaning either inside or outside character sets.\n\t// Use a simple backslash escape when it’s always valid, and a `\\xnn` escape when the simpler form would be disallowed by Unicode patterns’ stricter grammar.\n\treturn string\n\t\t.replace(/[|\\\\{}()[\\]^$+*?.]/g, '\\\\$&')\n\t\t.replace(/-/g, '\\\\x2d');\n}\n","import { Resource } from \"../../utils/i18n\";\r\n\r\nexport const translations: Resource = {\r\n  en: {\r\n    \"dso-autosuggest\": {\r\n      notFound: \"{{inputValue}} was not found.\",\r\n    },\r\n  },\r\n  nl: {\r\n    \"dso-autosuggest\": {\r\n      notFound: \"{{inputValue}} is niet gevonden.\",\r\n    },\r\n  },\r\n};\r\n","@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@use \"autosuggest.variables\" as core-autosuggest-variables;\r\n\r\n:host {\r\n  display: block;\r\n  position: relative;\r\n}\r\n\r\n.listbox-container {\r\n  inset-inline: 0;\r\n  inset-block-start: 100%;\r\n  block-size: auto;\r\n  max-block-size: var(--max-block-size);\r\n  min-block-size: core-autosuggest-variables.$listbox-min-block-size;\r\n  overflow-y: auto;\r\n  position: absolute;\r\n  z-index: zindex.$autosuggest;\r\n}\r\n\r\nul,\r\n.autosuggest-progress-box {\r\n  background-clip: padding-box;\r\n  background-color: core-autosuggest-variables.$background-color;\r\n  border: core-autosuggest-variables.$listbox-border-width solid core-autosuggest-variables.$border-color;\r\n  border-radius: scaffolding.$border-radius-base;\r\n  box-shadow: core-autosuggest-variables.$box-shadow;\r\n  list-style-type: none;\r\n  margin-block: 0;\r\n}\r\n\r\n.autosuggest-progress-box {\r\n  padding-block: units.$u1 * 1.5;\r\n  padding-inline: units.$u1;\r\n}\r\n\r\nul {\r\n  padding-block: core-autosuggest-variables.$listbox-padding-block;\r\n  padding-inline: 0;\r\n\r\n  li {\r\n    padding-block: core-autosuggest-variables.$list-item-padding-block;\r\n    padding-inline: units.$u2;\r\n\r\n    .suggestion-row {\r\n      display: flex;\r\n      justify-content: space-between;\r\n    }\r\n  }\r\n}\r\n\r\nli[aria-selected=\"true\"] {\r\n  cursor: pointer;\r\n  background-color: colors.$grasgroen;\r\n\r\n  &,\r\n  .type,\r\n  .extra {\r\n    color: colors.$wit;\r\n  }\r\n}\r\n\r\nmark {\r\n  font-weight: 700;\r\n  background-color: inherit;\r\n  color: inherit;\r\n  padding: 0;\r\n}\r\n\r\n.type,\r\n.extra {\r\n  color: colors.$grijs-60;\r\n}\r\n\r\n.type {\r\n  text-align: end;\r\n}\r\n\r\n.extra {\r\n  font-size: typography.$root-font-size-small;\r\n  line-height: typography.$root-font-size-small * typography.$line-height-base;\r\n\r\n  &:not(:first-child) {\r\n    text-align: end;\r\n  }\r\n}\r\n","import { Component, Element, Event, EventEmitter, Fragment, h, Listen, Prop, State, VNode, Watch } from \"@stencil/core\";\r\n\r\nimport debounce from \"debounce\";\r\nimport escapeStringRegexp from \"escape-string-regexp\";\r\n\r\nimport { v4 } from \"uuid\";\r\n\r\nimport { i18n } from \"../../utils/i18n\";\r\n\r\nimport { AutosuggestMarkFunction, AutosuggestMarkItem, Suggestion } from \"./autosuggest.interfaces\";\r\nimport { translations } from \"./autosuggest.i18n\";\r\n\r\nconst maxSuggestionsViewable = 10;\r\nconst listboxPaddingBlock = 8;\r\nconst listboxBorderWidth = 1;\r\n\r\n@Component({\r\n  tag: \"dso-autosuggest\",\r\n  styleUrl: \"autosuggest.scss\",\r\n  scoped: true,\r\n})\r\nexport class Autosuggest {\r\n  /**\r\n   * The suggestions for the value of the slotted input element. Optionally a\r\n   * Suggestion can have a `type` and `item`.\r\n   *\r\n   * The `type` is used to style the suggestion. `item` can be use to reference\r\n   * the original object that was used to create the suggestion.\r\n   *\r\n   * The value should be null when no suggestions have been fetched.\r\n   */\r\n  @Prop()\r\n  readonly suggestions: Suggestion[] | null = null;\r\n\r\n  /**\r\n   * Shows progress indicator when fetching results.\r\n   */\r\n  @Prop()\r\n  loading = false;\r\n\r\n  /**\r\n   * To override progress indicator's default loading label.\r\n   */\r\n  @Prop()\r\n  loadingLabel?: string = \"Een moment geduld.\";\r\n\r\n  /**\r\n   * To delay progress indicator showing (in ms).\r\n   */\r\n  @Prop()\r\n  loadingDelayed?: number;\r\n\r\n  /**\r\n   * To show text when no results are found.\r\n   */\r\n  @Prop()\r\n  notFoundLabel?: string;\r\n\r\n  /**\r\n   * Whether the previous suggestions will be presented when the input gets focus again.\r\n   */\r\n  @Prop()\r\n  suggestOnFocus = false;\r\n\r\n  /**\r\n   * A function provided by the consumer of the autosuggest component, that returns an array of `AutosuggestMarkItem`s\r\n   */\r\n  @Prop()\r\n  mark?: AutosuggestMarkFunction;\r\n\r\n  /**\r\n   * Emitted when a suggestion is selected.\r\n   * The `detail` property of the `CustomEvent` will contain the selected suggestion.\r\n   */\r\n  @Event()\r\n  dsoSelect!: EventEmitter<Suggestion>;\r\n\r\n  /**\r\n   * This is emitted debounced for every change for the slotted input type=text element.\r\n   */\r\n  @Event()\r\n  dsoChange!: EventEmitter<string>;\r\n\r\n  /**\r\n   * Emitted when enter is pressed.\r\n   * The `detail` property of the `CustomEvent` will contain the input text.\r\n   */\r\n  @Event()\r\n  dsoSearch!: EventEmitter<string>;\r\n\r\n  @Element()\r\n  host!: HTMLDsoAutosuggestElement;\r\n\r\n  @State()\r\n  showSuggestions = false;\r\n\r\n  @State()\r\n  selectedSuggestion: Suggestion | undefined;\r\n\r\n  @State()\r\n  notFound = false;\r\n\r\n  @State()\r\n  showLoading = false;\r\n\r\n  @State()\r\n  listItemBlockSize = 0;\r\n\r\n  @State()\r\n  listboxContainerMaxBlockSize = 0;\r\n\r\n  @Watch(\"suggestions\")\r\n  suggestionsWatcher() {\r\n    this.resetSelectedSuggestion();\r\n\r\n    if ((!this.showSuggestions || !this.notFound) && this.inputValue) {\r\n      this.openSuggestions();\r\n    } else if ((this.showSuggestions || this.notFound) && !this.inputValue) {\r\n      this.closeSuggestions();\r\n    }\r\n  }\r\n\r\n  private input?: HTMLInputElement;\r\n\r\n  private listboxContainer: HTMLDsoScrollableElement | undefined;\r\n\r\n  private listbox: HTMLUListElement | undefined;\r\n\r\n  private listboxItems: HTMLLIElement[] = [];\r\n\r\n  private listboxId: string = v4();\r\n\r\n  private inputId: string = v4();\r\n\r\n  private labelId: string = v4();\r\n\r\n  private resizeObserver = new ResizeObserver(debounce(() => this.setListboxContainerMaxBlockSize(), 150));\r\n\r\n  private debouncedEmitValue = debounce((value: string) => {\r\n    this.dsoChange.emit(value);\r\n    this.debouncedShowLoading();\r\n  }, 200);\r\n\r\n  private debouncedShowLoading = debounce(() => {\r\n    if (this.inputValue) {\r\n      this.showLoading = true;\r\n    }\r\n  }, this.loadingDelayed);\r\n\r\n  private inputValue = \"\";\r\n\r\n  private onInput = (event: Event) => {\r\n    if (!(event.target instanceof HTMLInputElement)) {\r\n      return;\r\n      // throw new Error(\"event.target is not instanceof HTMLInputElement\"); #2293\r\n    }\r\n\r\n    this.showLoading = !this.loadingDelayed;\r\n    this.inputValue = event.target.value;\r\n    this.debouncedEmitValue(event.target.value.match(/(\\S+)/g) ? event.target.value : \"\");\r\n  };\r\n\r\n  private onFocusIn = () => {\r\n    if (this.suggestOnFocus) {\r\n      this.openSuggestions();\r\n    }\r\n  };\r\n\r\n  @Listen(\"click\", { target: \"document\" })\r\n  onDocumentClick(event: MouseEvent) {\r\n    if (\r\n      (this.showSuggestions || this.notFound) &&\r\n      this.listbox &&\r\n      event.target instanceof Node &&\r\n      !this.listbox.contains(event.target) &&\r\n      this.input !== event.target\r\n    ) {\r\n      this.closeSuggestions();\r\n    }\r\n  }\r\n\r\n  private text = i18n(() => this.host, translations);\r\n\r\n  componentDidRender() {\r\n    this.setListboxContainerMaxBlockSize();\r\n  }\r\n\r\n  connectedCallback() {\r\n    setTimeout(() => {\r\n      const input = this.host.querySelector('input[type=\"text\"]');\r\n      if (!(input instanceof HTMLInputElement)) {\r\n        return;\r\n        // throw new ReferenceError(\"Mandatory text input not found\"); #2293\r\n      }\r\n\r\n      this.input = input;\r\n      if (input.id) {\r\n        this.inputId = input.id;\r\n      } else {\r\n        input.id = this.inputId;\r\n      }\r\n\r\n      if (!this.input.labels || this.input.labels.length < 1) {\r\n        return;\r\n        // throw new ReferenceError(\"Mandatory label for text input not found\"); #2293\r\n      }\r\n\r\n      const label = this.input.labels[0];\r\n      if (label?.id) {\r\n        this.labelId = label.id;\r\n      } else if (label) {\r\n        label.id = this.labelId;\r\n      }\r\n\r\n      this.input.setAttribute(\"role\", \"combobox\");\r\n      this.input.setAttribute(\"aria-haspopup\", \"listbox\");\r\n      this.input.setAttribute(\"aria-expanded\", \"false\");\r\n      this.input.setAttribute(\"autocomplete\", \"off\");\r\n      this.input.setAttribute(\"aria-autocomplete\", \"list\");\r\n      this.input.setAttribute(\"aria-activedescendant\", \"\");\r\n      this.input.addEventListener(\"input\", this.onInput);\r\n      this.input.addEventListener(\"keydown\", this.onKeyDown);\r\n      this.input.addEventListener(\"focusin\", this.onFocusIn);\r\n\r\n      window.addEventListener(\"resize\", this.onWindowResize);\r\n\r\n      document.addEventListener(\"scrollend\", this.onScrollend);\r\n\r\n      this.resizeObserver.observe(this.host);\r\n\r\n      this.setListboxContainerMaxBlockSize();\r\n    });\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    this.input?.removeEventListener(\"input\", this.onInput);\r\n    this.input?.removeEventListener(\"keydown\", this.onKeyDown);\r\n    this.input?.removeEventListener(\"focusin\", this.onFocusIn);\r\n\r\n    window.removeEventListener(\"resize\", this.onWindowResize);\r\n\r\n    document.removeEventListener(\"scrollend\", this.onScrollend);\r\n\r\n    this.resizeObserver.disconnect();\r\n  }\r\n\r\n  private onWindowResize = debounce(() => this.setListboxContainerMaxBlockSize(), 150);\r\n\r\n  private onScrollend = () => this.setListboxContainerMaxBlockSize();\r\n\r\n  private setListboxContainerMaxBlockSize(): void {\r\n    if (!this.listboxContainer || !this.showSuggestions) {\r\n      return;\r\n    }\r\n\r\n    if (this.listboxItems[0] && this.showSuggestions) {\r\n      this.listItemBlockSize = this.listboxItems[0].getBoundingClientRect().height;\r\n    }\r\n\r\n    const availableBlockSize = window.innerHeight - this.host.getBoundingClientRect().bottom;\r\n    const listboxMaxBlockSize =\r\n      this.listItemBlockSize * maxSuggestionsViewable + 2 * listboxPaddingBlock + 2 * listboxBorderWidth;\r\n\r\n    if (availableBlockSize > this.listItemBlockSize) {\r\n      if (availableBlockSize < listboxMaxBlockSize) {\r\n        this.listboxContainerMaxBlockSize = availableBlockSize - 2 * listboxPaddingBlock;\r\n      } else {\r\n        this.listboxContainerMaxBlockSize = listboxMaxBlockSize;\r\n      }\r\n    }\r\n  }\r\n\r\n  private showInputValueNotFound(text?: string) {\r\n    return this.processAutosuggestMarkItems(this.markTerms(this.input?.value.split(\" \").filter((t) => t) ?? [], text));\r\n  }\r\n\r\n  private handleMark(\r\n    suggestion: Suggestion,\r\n    text: string,\r\n    type?: \"value\" | \"type\" | \"extra\",\r\n    extraIndex?: number,\r\n  ): (VNode | string)[] {\r\n    if (this.mark && type) {\r\n      return this.processAutosuggestMarkItems(this.mark(suggestion, text, type, extraIndex));\r\n    }\r\n    return this.processAutosuggestMarkItems(this.markTerms(this.input?.value.split(\" \").filter((t) => t) ?? [], text));\r\n  }\r\n\r\n  private markTerms(terms: string[], suggestionValue?: string): AutosuggestMarkItem[] {\r\n    if (!suggestionValue || !terms || terms.length === 0 || terms[0] === undefined) {\r\n      return [\"\"];\r\n    }\r\n\r\n    const termRegex = new RegExp(`(${escapeStringRegexp(terms[0])})`, \"gi\");\r\n\r\n    return suggestionValue.split(termRegex).reduce((total: AutosuggestMarkItem[], valuePart: string) => {\r\n      if (!valuePart) {\r\n        total.push(valuePart);\r\n      } else if (termRegex.test(valuePart)) {\r\n        total.push({ mark: valuePart });\r\n      } else if (terms.length === 1) {\r\n        total.push(valuePart);\r\n      } else {\r\n        total.push(...this.markTerms(terms.slice(1), valuePart));\r\n      }\r\n\r\n      return total;\r\n    }, []);\r\n  }\r\n\r\n  private processAutosuggestMarkItems(items: AutosuggestMarkItem[]): (VNode | string)[] {\r\n    if (items.length === 0) {\r\n      return [\"\"];\r\n    }\r\n\r\n    return items.map((item) => {\r\n      if (typeof item === \"object\") {\r\n        return <mark>{item.mark}</mark>;\r\n      }\r\n      return item;\r\n    });\r\n  }\r\n\r\n  private selectSuggestion(suggestion: Suggestion) {\r\n    this.selectedSuggestion = suggestion;\r\n\r\n    this.setAriaActiveDescendant();\r\n  }\r\n\r\n  private selectFirstSuggestion() {\r\n    if (!this.suggestions) {\r\n      return;\r\n    }\r\n\r\n    this.selectedSuggestion = this.suggestions[0];\r\n\r\n    this.setAriaActiveDescendant(true);\r\n  }\r\n\r\n  private selectLastSuggestion() {\r\n    if (!this.suggestions) {\r\n      return;\r\n    }\r\n\r\n    this.selectedSuggestion = this.suggestions[this.suggestions.length - 1];\r\n\r\n    this.setAriaActiveDescendant(true);\r\n  }\r\n\r\n  private selectNextSuggestion() {\r\n    if (!this.suggestions) {\r\n      return;\r\n    }\r\n\r\n    const index = this.selectedSuggestion ? this.suggestions.indexOf(this.selectedSuggestion) : -1;\r\n\r\n    this.selectedSuggestion = this.suggestions[index + 1] ?? this.suggestions[0];\r\n\r\n    this.setAriaActiveDescendant(true);\r\n  }\r\n\r\n  private selectPreviousSuggestion() {\r\n    if (!this.suggestions) {\r\n      return;\r\n    }\r\n\r\n    const index = this.selectedSuggestion ? this.suggestions.indexOf(this.selectedSuggestion) : 0;\r\n\r\n    this.selectedSuggestion = this.suggestions[index - 1] ?? this.suggestions[this.suggestions.length - 1];\r\n\r\n    this.setAriaActiveDescendant(true);\r\n  }\r\n\r\n  private setAriaActiveDescendant(scroll = false): void {\r\n    if (this.selectedSuggestion) {\r\n      const id = this.listboxItemId(this.selectedSuggestion);\r\n      this.input?.setAttribute(\"aria-activedescendant\", id);\r\n      if (scroll) {\r\n        document.getElementById(id)?.scrollIntoView({ block: \"nearest\" });\r\n      }\r\n    }\r\n  }\r\n\r\n  private resetSelectedSuggestion() {\r\n    this.showLoading = !this.loadingDelayed;\r\n    this.notFound = false;\r\n    this.selectedSuggestion = undefined;\r\n    this.input?.setAttribute(\"aria-activedescendant\", \"\");\r\n  }\r\n\r\n  private openSuggestions(selectSuggestion?: \"first\" | \"last\") {\r\n    this.showSuggestions = (this.suggestions && this.suggestions.length > 0) ?? false;\r\n    this.notFound = (this.suggestions && this.suggestions?.length === 0) ?? false;\r\n    this.input?.setAttribute(\"aria-expanded\", (this.showSuggestions || this.notFound).toString());\r\n\r\n    if (this.showSuggestions && selectSuggestion === \"first\") {\r\n      this.selectFirstSuggestion();\r\n    } else if (this.showSuggestions && selectSuggestion === \"last\") {\r\n      this.selectLastSuggestion();\r\n    }\r\n  }\r\n\r\n  private closeSuggestions() {\r\n    this.showSuggestions = false;\r\n    this.notFound = false;\r\n    this.input?.setAttribute(\"aria-expanded\", \"false\");\r\n    this.selectFirstSuggestion();\r\n  }\r\n\r\n  private pickSelectedValue() {\r\n    if (this.selectedSuggestion && this.showSuggestions) {\r\n      this.dsoSelect.emit(this.selectedSuggestion);\r\n    } else {\r\n      this.dsoSearch.emit(this.input?.value);\r\n    }\r\n\r\n    this.closeSuggestions();\r\n  }\r\n\r\n  private onKeyDown = (event: KeyboardEvent) => {\r\n    if (event.defaultPrevented || this.loading) {\r\n      return;\r\n    }\r\n\r\n    switch (event.key) {\r\n      case \"ArrowDown\":\r\n        if (!this.showSuggestions) {\r\n          this.openSuggestions(\"first\");\r\n        } else {\r\n          this.selectNextSuggestion();\r\n        }\r\n\r\n        break;\r\n\r\n      case \"ArrowUp\":\r\n        if (!this.showSuggestions) {\r\n          this.openSuggestions(\"last\");\r\n        } else {\r\n          this.selectPreviousSuggestion();\r\n        }\r\n\r\n        break;\r\n\r\n      case \"Tab\":\r\n        this.closeSuggestions();\r\n        return;\r\n\r\n      case \"Escape\":\r\n        this.closeSuggestions();\r\n        break;\r\n\r\n      case \"Enter\":\r\n        this.pickSelectedValue();\r\n        break;\r\n\r\n      default:\r\n        return;\r\n    }\r\n\r\n    event.preventDefault();\r\n  };\r\n\r\n  private listboxItemId(suggestion: Suggestion): string {\r\n    if (!this.suggestions) {\r\n      return \"\";\r\n    }\r\n    return `${this.inputId}-${this.suggestions.indexOf(suggestion) + 1}`;\r\n  }\r\n\r\n  private getChunkedExtras(extras: string[]): string[][] {\r\n    return extras.reduce((resultArray: string[][], extra, index) => {\r\n      const chunkIndex = Math.floor(index / 2);\r\n\r\n      if (!resultArray[chunkIndex]) {\r\n        resultArray[chunkIndex] = [];\r\n      }\r\n      resultArray[chunkIndex]?.push(extra);\r\n      return resultArray;\r\n    }, []);\r\n  }\r\n\r\n  render() {\r\n    this.listboxItems = [];\r\n\r\n    const showListbox = this.showSuggestions || this.notFound;\r\n\r\n    if (showListbox && this.input) {\r\n      this.input.setAttribute(\"aria-controls\", this.listboxId);\r\n    } else if (this.input) {\r\n      this.input.removeAttribute(\"aria-controls\");\r\n    }\r\n\r\n    return (\r\n      <>\r\n        <slot />\r\n        {this.loading && this.showLoading ? (\r\n          <div class=\"autosuggest-progress-box\">\r\n            <dso-progress-indicator label={this.loadingLabel}></dso-progress-indicator>\r\n          </div>\r\n        ) : (\r\n          showListbox && (\r\n            <dso-scrollable\r\n              class=\"listbox-container\"\r\n              ref={(element) => (this.listboxContainer = element)}\r\n              style={{ \"--max-block-size\": `${this.listboxContainerMaxBlockSize}px` }}\r\n            >\r\n              <ul\r\n                role=\"listbox\"\r\n                aria-live=\"polite\"\r\n                id={this.listboxId}\r\n                aria-labelledby={this.labelId}\r\n                ref={(element) => (this.listbox = element)}\r\n                tabindex=\"0\"\r\n              >\r\n                {(this.showSuggestions &&\r\n                  this.suggestions &&\r\n                  this.suggestions.map((suggestion) => (\r\n                    <li\r\n                      role=\"option\"\r\n                      id={this.listboxItemId(suggestion)}\r\n                      key={suggestion.value}\r\n                      onMouseEnter={() => this.selectSuggestion(suggestion)}\r\n                      onMouseLeave={() => this.resetSelectedSuggestion()}\r\n                      onClick={() => this.pickSelectedValue()}\r\n                      aria-selected={(suggestion === this.selectedSuggestion).toString()}\r\n                      aria-label={suggestion.value}\r\n                      ref={(li) => li && this.listboxItems.push(li)}\r\n                    >\r\n                      <div class=\"suggestion-row\">\r\n                        <span class=\"value\">{this.handleMark(suggestion, suggestion.value, \"value\")}</span>\r\n                        {suggestion.type ? (\r\n                          <span class=\"type\">{this.handleMark(suggestion, suggestion.type, \"type\")}</span>\r\n                        ) : undefined}\r\n                      </div>\r\n                      {suggestion.extras &&\r\n                        this.getChunkedExtras(suggestion.extras).map((chunk, index) => (\r\n                          <div class=\"suggestion-row\">\r\n                            {chunk.map((c, i) => (\r\n                              <span class=\"extra\">{this.handleMark(suggestion, c, \"extra\", index * 2 + i)}</span>\r\n                            ))}\r\n                          </div>\r\n                        ))}\r\n                    </li>\r\n                  ))) ||\r\n                  (this.notFound && (\r\n                    <li>\r\n                      <span class=\"value\">\r\n                        {this.notFoundLabel ||\r\n                          this.showInputValueNotFound(this.text(\"notFound\", { inputValue: this.inputValue }))}\r\n                      </span>\r\n                    </li>\r\n                  ))}\r\n              </ul>\r\n            </dso-scrollable>\r\n          )\r\n        )}\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}

package/dist/dso-toolkit/p-2aaad2dd.entry.js

@@ -1,2 +0,0 @@
-import{r as s,c as t,h as i,H as e,a}from"./p-abc59cdf.js";const d=":host{display:block}";const o=d;const r=[{width:624,alias:"large"},{width:375,alias:"medium"},{width:0,alias:"small"}];const l=class{constructor(i){s(this,i);this.dsoSizeChange=t(this,"dsoSizeChange",7);this.sizeAlias=r[0].alias;this.sizeWidth=0;this.observer=new ResizeObserver((([s])=>{var t,i;if(!s){throw new Error("No entry found")}const e=(i=(t=r.find((t=>s.contentRect.width>=t.width)))===null||t===void 0?void 0:t.alias)!==null&&i!==void 0?i:r[0].alias;this.sizeAlias=e;this.dsoSizeChange.emit(e)}))}async getSize(){return this.sizeAlias}componentWillLoad(){this.observer.observe(this.host)}disconnectedCallback(){this.observer.unobserve(this.host)}render(){return i(e,{key:"d32256cbdc6e91c45a8954bd96ccad52fa8ba60f",small:this.sizeAlias==="small",medium:this.sizeAlias==="medium",large:this.sizeAlias==="large"},i("slot",{key:"ffd1712484de38388bdcc3574d9d622f2da1551f"}))}get host(){return a(this)}};l.style=o;export{l as dso_responsive_element};
-//# sourceMappingURL=p-2aaad2dd.entry.js.map

package/dist/dso-toolkit/p-323455dc.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["labelCss","DsoLabelStyle0","resizeObserver","ResizeObserver","debounce","entries","forEach","target","isDsoLabelComponent","_truncateLabel","element","tagName","hasEllipses","el","scrollWidth","clientWidth","Label","constructor","hostRef","this","isTruncated","labelText","watchRemovable","removable","startMutationObserver","stopMutationObserver","watchTruncate","truncate","startTruncate","stopTruncate","keyDownListener","event","key","textHover","textFocus","setTimeout","labelContent","syncLabelText","_b","_a","host","textContent","trim","componentDidLoad","disconnectedCallback","mutationObserver","MutationObserver","observe","characterData","childList","subtree","attributes","force","disconnect","unobserve","render","h","Fragment","class","clsx","status","compact","removeHover","removeFocus","name","ref","tabindex","undefined","onMouseEnter","onMouseLeave","onFocus","onBlur","type","onClick","e","dsoRemoveClick","emit","icon","stateless","id","active","position","strategy","renvooiCss","DsoRenvooiStyle0","RenvooiRender","value","Array","isArray","map","v","i","length","toegevoegd","verwijderd","was","wordt","Renvooi","slideToggleCss","DsoSlideToggleStyle0","SlideToggle","checked","disabled","identifier","v4","handleSwitch","dsoActiveChange","originalEvent","componentWillLoad","hasVisibleLabel","querySelector","Object","assign","role","accessibleLabel","labelledbyId","xmlns","width","height","viewBox","fill","rx","cy","r","htmlFor"],"sources":["src/components/label/label.scss?tag=dso-label&encapsulation=shadow","src/components/label/label.tsx","src/components/renvooi/renvooi.scss?tag=dso-renvooi&encapsulation=shadow","src/components/renvooi/renvooi.tsx","src/components/slide-toggle/slide-toggle.scss?tag=dso-slide-toggle&encapsulation=scoped","src/components/slide-toggle/slide-toggle.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/label\";\r\n\r\n:host {\r\n  display: inline-block;\r\n  max-inline-size: 100%;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n// Todo: Replace .sr-only selector with web component specific selector, no need for .sr-only if we can generate the SCSS\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-label {\r\n  @include label.root();\r\n\r\n  &.dso-hover {\r\n    .dso-label-content {\r\n      text-decoration: line-through;\r\n    }\r\n  }\r\n}\r\n\r\n.dso-truncate.dso-label-content {\r\n  display: inline-block;\r\n  max-inline-size: 100%;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n  vertical-align: bottom;\r\n  white-space: nowrap; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n}\r\n\r\n:host([removable]) {\r\n  .dso-truncate.dso-label-content {\r\n    max-inline-size: calc(100% - (units.$u3 + 4px));\r\n  }\r\n}\r\n","import {\r\n  h,\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  Method,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n  Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport debounce from \"debounce\";\r\nimport { LabelStatus } from \"./label.interfaces\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n  debounce((entries: ResizeObserverEntry[]) => {\r\n    entries.forEach(({ target }) => {\r\n      if (isDsoLabelComponent(target)) {\r\n        target._truncateLabel();\r\n      }\r\n    });\r\n  }, 150),\r\n);\r\n\r\nfunction isDsoLabelComponent(element: Element): element is HTMLDsoLabelElement {\r\n  return element.tagName === \"DSO-LABEL\";\r\n}\r\n\r\nfunction hasEllipses(el: HTMLElement): boolean {\r\n  return el.scrollWidth > el.clientWidth;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-label\",\r\n  styleUrl: \"label.scss\",\r\n  shadow: true,\r\n})\r\nexport class Label implements ComponentInterface {\r\n  private labelContent: HTMLSpanElement | undefined;\r\n\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoLabelElement;\r\n\r\n  /**\r\n   * For compact Label\r\n   */\r\n  @Prop()\r\n  compact?: boolean;\r\n\r\n  /**\r\n   * Shows a button that can be used to remove the Label.\r\n   */\r\n  @Prop({ reflect: true })\r\n  removable?: boolean;\r\n\r\n  /**\r\n   * The status of this Label.\r\n   */\r\n  @Prop()\r\n  status?: LabelStatus;\r\n\r\n  /**\r\n   * Emitted when the user activates the remove button.\r\n   */\r\n  @Event()\r\n  dsoRemoveClick!: EventEmitter<MouseEvent>;\r\n\r\n  @State()\r\n  removeHover?: boolean;\r\n\r\n  @State()\r\n  removeFocus?: boolean;\r\n\r\n  /**\r\n   * Whether the Label is allowed to truncate the contents if it does not fit the container element.\r\n   */\r\n  @Prop()\r\n  truncate?: boolean;\r\n\r\n  @State()\r\n  textHover?: boolean;\r\n\r\n  @State()\r\n  textFocus?: boolean;\r\n\r\n  @State()\r\n  isTruncated = false;\r\n\r\n  @State()\r\n  labelText = \"\";\r\n\r\n  @Watch(\"removable\")\r\n  watchRemovable(removable: boolean) {\r\n    if (removable) {\r\n      this.startMutationObserver();\r\n    } else {\r\n      this.stopMutationObserver();\r\n    }\r\n  }\r\n\r\n  @Watch(\"truncate\")\r\n  watchTruncate(truncate: boolean) {\r\n    if (truncate) {\r\n      this.startTruncate();\r\n    } else {\r\n      this.stopTruncate();\r\n    }\r\n  }\r\n\r\n  @Listen(\"keydown\", { target: \"document\" })\r\n  keyDownListener(event: KeyboardEvent) {\r\n    if (event.key === \"Escape\") {\r\n      this.textHover = false;\r\n      this.textFocus = false;\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _truncateLabel() {\r\n    setTimeout(() => {\r\n      this.isTruncated = !!this.labelContent && hasEllipses(this.labelContent);\r\n    });\r\n  }\r\n\r\n  private syncLabelText() {\r\n    this.labelText = this.host.textContent?.trim() ?? \"\";\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (this.truncate) {\r\n      this.startTruncate();\r\n    }\r\n\r\n    if (this.removable) {\r\n      this.startMutationObserver();\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    this.stopTruncate();\r\n\r\n    this.stopMutationObserver(true);\r\n  }\r\n\r\n  /** The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. */\r\n  private startMutationObserver(): void {\r\n    this.mutationObserver = new MutationObserver(() => this.syncLabelText());\r\n\r\n    this.mutationObserver.observe(this.host, {\r\n      characterData: true,\r\n      childList: true,\r\n      subtree: true,\r\n      attributes: true,\r\n    });\r\n\r\n    this.syncLabelText();\r\n  }\r\n\r\n  private stopMutationObserver(force = false): void {\r\n    if (force || !(this.truncate && this.removable)) {\r\n      this.mutationObserver?.disconnect();\r\n\r\n      delete this.mutationObserver;\r\n    }\r\n  }\r\n\r\n  private startTruncate(): void {\r\n    resizeObserver.observe(this.host);\r\n    this.startMutationObserver();\r\n    this._truncateLabel();\r\n  }\r\n\r\n  private stopTruncate(): void {\r\n    resizeObserver.unobserve(this.host);\r\n    this.stopMutationObserver();\r\n    this.isTruncated = false;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Fragment>\r\n        <span\r\n          aria-describedby=\"toggle-anchor\"\r\n          class={clsx(\"dso-label\", {\r\n            [`dso-label-${this.status}`]: this.status,\r\n            \"dso-compact\": this.compact && !this.removable,\r\n            \"dso-hover\": this.removeHover || this.removeFocus,\r\n          })}\r\n        >\r\n          <slot name=\"symbol\"></slot>\r\n          <span\r\n            class={clsx(\"dso-label-content\", {\r\n              \"dso-truncate\": !!this.truncate,\r\n            })}\r\n            ref={(element) => (this.labelContent = element)}\r\n            tabindex={this.truncate && this.isTruncated ? 0 : undefined}\r\n            onMouseEnter={() => (this.textHover = true)}\r\n            onMouseLeave={() => (this.textHover = false)}\r\n            onFocus={() => (this.textFocus = true)}\r\n            onBlur={() => (this.textFocus = false)}\r\n          >\r\n            <slot></slot>\r\n          </span>\r\n          {this.removable && (\r\n            <button\r\n              type=\"button\"\r\n              onClick={(e) => this.dsoRemoveClick.emit(e)}\r\n              onMouseEnter={() => (this.removeHover = true)}\r\n              onMouseLeave={() => (this.removeHover = false)}\r\n              onFocus={() => (this.removeFocus = true)}\r\n              onBlur={() => (this.removeFocus = false)}\r\n            >\r\n              <span class=\"sr-only\">Verwijder: {this.labelText}</span>\r\n              <dso-icon icon=\"times\"></dso-icon>\r\n            </button>\r\n          )}\r\n        </span>\r\n        {this.isTruncated && (\r\n          <dso-tooltip\r\n            stateless\r\n            id=\"toggle-anchor\"\r\n            active={this.textHover || this.textFocus}\r\n            position=\"top\"\r\n            strategy=\"absolute\"\r\n          >\r\n            {this.labelText}\r\n          </dso-tooltip>\r\n        )}\r\n      </Fragment>\r\n    );\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n@use \"~dso-toolkit/src/components/delete/delete\";\r\n\r\n:host {\r\n  display: inline;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.text {\r\n  text-decoration: var(--_dso-renvooi-text-decoration);\r\n}\r\n","import { Component, ComponentInterface, Fragment, FunctionalComponent, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"./renvooi.interfaces\";\r\n\r\ninterface RenvooiRenderProps {\r\n  value: RenvooiValue | RenvooiValue[] | undefined;\r\n}\r\n\r\nconst RenvooiRender: FunctionalComponent<RenvooiRenderProps> = ({ value }) => {\r\n  if (typeof value === \"string\" || !value) {\r\n    // This element is used for --_dso-renvooi-text-decoration\r\n    return <span class=\"text\">{value}</span>;\r\n  }\r\n\r\n  if (Array.isArray(value)) {\r\n    return (\r\n      <>\r\n        {value.map((v, i, { length }) => (\r\n          <>\r\n            <RenvooiRender value={v} />\r\n            {i < length - 1 ? \", \" : \"\"}\r\n          </>\r\n        ))}\r\n      </>\r\n    );\r\n  }\r\n\r\n  if (\"toegevoegd\" in value) {\r\n    return <ins>{value.toegevoegd}</ins>;\r\n  }\r\n\r\n  if (\"verwijderd\" in value) {\r\n    return <del>{value.verwijderd}</del>;\r\n  }\r\n\r\n  return (\r\n    <>\r\n      <del>{value.was}</del> <ins>{value.wordt}</ins>\r\n    </>\r\n  );\r\n};\r\n\r\n/**\r\n * Met dit component kan een `RenvooiValue` worden gepresenteerd.\r\n */\r\n@Component({\r\n  tag: \"dso-renvooi\",\r\n  styleUrl: \"renvooi.scss\",\r\n  shadow: true,\r\n})\r\nexport class Renvooi implements ComponentInterface {\r\n  /**\r\n   * The renvooi value to render.\r\n   */\r\n  @Prop()\r\n  value?: RenvooiValue | RenvooiValue[];\r\n\r\n  render() {\r\n    return <RenvooiRender value={this.value} />;\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n\r\n$slide-toggle-height: 20px;\r\n\r\n:host {\r\n  display: inline-block;\r\n  padding-block-start: (typography.$line-height-base * typography.$font-size-base - $slide-toggle-height) * 0.5;\r\n}\r\n\r\nbutton.dso-slider {\r\n  border: 0;\r\n  padding: 0;\r\n\r\n  &:focus-visible {\r\n    outline: 2px solid colors.$grijs-80;\r\n    outline-offset: 1px;\r\n  }\r\n\r\n  svg {\r\n    rect {\r\n      fill: colors.$grijs-40;\r\n      transition: fill 0.25s;\r\n    }\r\n\r\n    circle {\r\n      @include utilities.transition(transform);\r\n\r\n      transform: translateX(10px);\r\n      fill: colors.$wit;\r\n    }\r\n  }\r\n\r\n  &[aria-checked=\"true\"] svg {\r\n    rect {\r\n      fill: colors.$bosgroen;\r\n    }\r\n\r\n    circle {\r\n      transform: translateX(30px);\r\n      fill: colors.$wit;\r\n    }\r\n  }\r\n\r\n  &[disabled] svg {\r\n    rect {\r\n      fill: colors.$grijs-20;\r\n    }\r\n\r\n    circle {\r\n      fill: colors.$grijs-10;\r\n    }\r\n  }\r\n\r\n  &[disabled][aria-checked=\"true\"] svg {\r\n    rect {\r\n      fill: colors.$bosgroen-40;\r\n    }\r\n\r\n    circle {\r\n      fill: colors.$grijs-10;\r\n    }\r\n  }\r\n}\r\n\r\n.dso-slider {\r\n  border-radius: units.$u3;\r\n  display: inline-flex;\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n}\r\n","import { h, Component, ComponentInterface, Event, Prop, EventEmitter, Element, State, Fragment } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\nimport { SlideToggleActiveEvent } from \"./slide-toggle.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-slide-toggle\",\r\n  styleUrl: \"slide-toggle.scss\",\r\n  scoped: true,\r\n  shadow: false,\r\n})\r\nexport class SlideToggle implements ComponentInterface {\r\n  @Element()\r\n  private host!: HTMLDsoSlideToggleElement;\r\n\r\n  /**\r\n   * Set to true if Slide Toggle is checked.\r\n   */\r\n  @Prop()\r\n  checked = false;\r\n\r\n  /**\r\n   * Disables the Slide Toggle, preventing it from checking/unchecking and therefor not emitting any events.\r\n   */\r\n  @Prop()\r\n  disabled = false;\r\n\r\n  /**\r\n   * When provided the `<button>` will be labelled with `aria-label`. For a visible label provide a `<span>` inside the component.\r\n   */\r\n  @Prop()\r\n  accessibleLabel?: string;\r\n\r\n  /**\r\n   * Provide the `id` of the element that labels this element. this property sets the `aria-labelledby` on the switch button.\r\n   */\r\n  @Prop()\r\n  labelledbyId?: string;\r\n\r\n  @State()\r\n  hasVisibleLabel?: boolean;\r\n\r\n  /**\r\n   * Provide an `id` for the `<button>`. Useful for placing your to place your own `<label for=\"id\">`.\r\n   */\r\n  @Prop()\r\n  identifier = v4();\r\n\r\n  /**\r\n   * Emitted when user checks or unchecks the Slide Toggle.\r\n   */\r\n  @Event({ composed: false })\r\n  dsoActiveChange!: EventEmitter<SlideToggleActiveEvent>;\r\n\r\n  private handleSwitch(e: Event): void {\r\n    this.dsoActiveChange.emit({\r\n      originalEvent: e,\r\n      checked: !this.checked,\r\n    });\r\n  }\r\n\r\n  componentWillLoad(): void {\r\n    this.hasVisibleLabel = this.host.querySelector(\"*\") !== null;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <button\r\n          id={this.identifier}\r\n          role=\"switch\"\r\n          class=\"dso-slider\"\r\n          aria-checked={\"\" + this.checked}\r\n          disabled={this.disabled}\r\n          onClick={(e) => this.handleSwitch(e)}\r\n          {...(this.accessibleLabel ? { \"aria-label\": this.accessibleLabel } : {})}\r\n          {...(this.labelledbyId ? { \"aria-labelledby\": this.labelledbyId } : {})}\r\n        >\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"20\" viewBox=\"0 0 40 20\">\r\n            <g fill=\"none\" fill-rule=\"evenodd\">\r\n              <rect width=\"40\" height=\"20\" fill=\"currentColor\" rx=\"10\" />\r\n              <circle cy=\"10\" r=\"8\" fill=\"currentColor\" />\r\n            </g>\r\n          </svg>\r\n        </button>\r\n        {this.hasVisibleLabel && (\r\n          <label htmlFor={this.identifier}>\r\n            <slot />\r\n          </label>\r\n        )}\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}

package/dist/dso-toolkit/p-4b70b133.entry.js

@@ -1,2 +0,0 @@
-import{r as o,c as e,h as r,F as a,a as i}from"./p-abc59cdf.js";import{A as d}from"./p-13b91ce2.js";import{w as n,A as t,a as s}from"./p-d1ed09c3.js";const c='a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a :is(dso-icon,svg.di)+span,a span+:is(dso-icon,svg.di){margin-inline-start:8px}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url("./di.svg#download"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#download-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url("./di.svg#external-link"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#external-link-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]{background-image:var(--_dso-di-background-image, url("./di.svg#call-grasgroen"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#call-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]{background-image:var(--_dso-di-background-image, url("./di.svg#email-grasgroen"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#email-scampi"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}:host([wijzigactie=voegtoe]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}:host([wijzigactie=voegtoe]) a:is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}:host([wijzigactie=voegtoe]) a:is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}:host([wijzigactie=verwijder]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}:host([wijzigactie=verwijder]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}:host([wijzigactie=verwijder]) a:is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}:host([wijzigactie=verwijder]) a:is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}:host([wijzigactie=verwijder]){text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;word-break:break-word}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}';const l=c;const g=class{constructor(r){o(this,r);this.dsoActiveChange=e(this,"dsoActiveChange",7);this.watcher=n(this.host)}connectedCallback(){this.watcher.watch()}disconnectedCallback(){this.watcher.unwatch()}render(){const o=this.watcher.hasSymbool();return r(d,{key:"afe2613ad46948be1043902330c9b18530aeecfc",symbol:o?r(t,null):undefined,active:this.active,dsoActiveChange:this.dsoActiveChange,title:r("dso-renvooi",{value:this.naam}),data:r(a,null,r("span",{class:"content"},this.regelKwalificatie&&r(a,null,r("dso-renvooi",{value:this.regelKwalificatie})," "),this.regelKwalificatieVoorzetsel&&`${this.regelKwalificatieVoorzetsel}: `,r("dso-renvooi",{value:this.locatieNoemers})),this.gewijzigdeLocatie&&r(s,null))})}get host(){return i(this)}};g.style=l;export{g as dso_annotation_activiteit};
-//# sourceMappingURL=p-4b70b133.entry.js.map

package/dist/dso-toolkit/p-4b70b133.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["annotationCss","DsoAnnotationActiviteitStyle0","AnnotationActiviteit","constructor","hostRef","this","watcher","host","connectedCallback","watch","disconnectedCallback","unwatch","render","hasSymbool","h","AnnotationBody","key","symbol","AnnotationSymbolSlot","undefined","active","dsoActiveChange","title","value","naam","data","Fragment","class","regelKwalificatie","regelKwalificatieVoorzetsel","locatieNoemers","gewijzigdeLocatie","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-activiteit&encapsulation=shadow","src/components/annotation/annotation-activiteit/annotation-activiteit.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, Fragment, EventEmitter, Element } from \"@stencil/core\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-activiteit\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationActiviteit implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De naam van de activiteit.\r\n   */\r\n  @Prop()\r\n  naam?: RenvooiValue | string;\r\n\r\n  /**\r\n   * De activiteit regel kwalificatie.\r\n   */\r\n  @Prop()\r\n  regelKwalificatie?: RenvooiValue | string;\r\n\r\n  /**\r\n   * De noemer van de locatie.\r\n   */\r\n  @Prop()\r\n  locatieNoemers?: Array<RenvooiValue | string>;\r\n\r\n  /**\r\n   * Voorzetsel van de regelKwalificatie. Exclusief dubbele punt.\r\n   */\r\n  @Prop()\r\n  regelKwalificatieVoorzetsel?: string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationActiviteitElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={<dso-renvooi value={this.naam} />}\r\n        data={\r\n          <>\r\n            <span class=\"content\">\r\n              {this.regelKwalificatie && (\r\n                <>\r\n                  <dso-renvooi value={this.regelKwalificatie} />{\" \"}\r\n                </>\r\n              )}\r\n              {this.regelKwalificatieVoorzetsel && `${this.regelKwalificatieVoorzetsel}: `}\r\n              <dso-renvooi value={this.locatieNoemers} />\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"mappings":"sJAAA,MAAMA,EAAgB,goKACtB,MAAAC,EAAeD,E,MCeFE,EAAoB,MALjC,WAAAC,CAAAC,G,2DAyDUC,KAAAC,QAAUA,EAAQD,KAAKE,K,CAE/B,iBAAAC,GACEH,KAAKC,QAAQG,O,CAGf,oBAAAC,GACEL,KAAKC,QAAQK,S,CAGf,MAAAC,GACE,MAAMC,EAAaR,KAAKC,QAAQO,aAEhC,OACEC,EAACC,EAAc,CAAAC,IAAA,2CACbC,OAAQJ,EAAaC,EAACI,EAAoB,MAAMC,UAChDC,OAAQf,KAAKe,OACbC,gBAAiBhB,KAAKgB,gBACtBC,MAAOR,EAAA,eAAaS,MAAOlB,KAAKmB,OAChCC,KACEX,EAAAY,EAAA,KACEZ,EAAA,QAAMa,MAAM,WACTtB,KAAKuB,mBACJd,EAAAY,EAAA,KACEZ,EAAA,eAAaS,MAAOlB,KAAKuB,oBAAsB,KAGlDvB,KAAKwB,6BAA+B,GAAGxB,KAAKwB,gCAC7Cf,EAAA,eAAaS,MAAOlB,KAAKyB,kBAE1BzB,KAAK0B,mBAAqBjB,EAACkB,EAA2B,Q","ignoreList":[]}

package/dist/dso-toolkit/p-9331c2fc.entry.js

@@ -1,2 +0,0 @@
-import{r as e,f as t,h as s,H as a,a as r}from"./p-abc59cdf.js";const i="*,*::after,*::before{box-sizing:border-box}:host{display:block}.tabs{border-block-end:1px solid #39870c;display:flex;gap:2px;flex-wrap:wrap;margin-block-end:24px;padding-inline-start:0}@media screen and (max-width: 767px){.tabs{border:0;display:block}}";const o=i;const c=class{constructor(t){e(this,t);this.keyUpHandler=e=>{if(!(e.target instanceof HTMLElement)){return}switch(e.key){case"ArrowRight":case"ArrowDown":this.moveFocusToNextTab(e.target);break;case"ArrowLeft":case"ArrowUp":this.moveFocusToPreviousTab(e.target);break;default:return}}}get enabledTabs(){return Array.from(this.host.querySelectorAll(":scope > dso-tab")).reduce(((e,t)=>{if(!t.disabled){e.push(t)}return e}),[])}get firstTab(){return this.enabledTabs[0]}get lastTab(){return this.enabledTabs[this.enabledTabs.length-1]}moveFocusToTab(e){e===null||e===void 0?void 0:e._dsoFocus()}moveFocusToPreviousTab(e){var t;const s=this.enabledTabs.findIndex((t=>t===e));const a=(t=this.enabledTabs[s-1])!==null&&t!==void 0?t:this.lastTab;this.moveFocusToTab(a)}moveFocusToNextTab(e){var t;const s=this.enabledTabs.findIndex((t=>t===e));const a=(t=this.enabledTabs[s+1])!==null&&t!==void 0?t:this.firstTab;this.moveFocusToTab(a)}connectedCallback(){var e;(e=this.mutationObserver)!==null&&e!==void 0?e:this.mutationObserver=new MutationObserver((()=>t(this.host)));this.mutationObserver.observe(this.host,{childList:true})}disconnectedCallback(){var e;(e=this.mutationObserver)===null||e===void 0?void 0:e.disconnect()}render(){return s(a,{key:"eda4f3cabd4f4a373ebf5e5b2fce9c5a336f4680"},s("div",{key:"445a0b6a745a1f45eca44ca59def6f4557904748",class:"tabs",role:"tablist",onKeyUp:this.keyUpHandler},s("slot",{key:"d344d2c68cc0bd6d0abbea591a7ffa22b17dbdf7"})),s("div",{key:"c17a1774b3cf81c30e07c0c8446f05d8a6e86b95",role:"tabpanel",tabindex:"0"},s("slot",{key:"c32d940c2e5fe01b67919d7253bb5d2666146f6f",name:"panel"})))}get host(){return r(this)}};c.style=o;export{c as dso_tabs};
-//# sourceMappingURL=p-9331c2fc.entry.js.map

package/dist/dso-toolkit/p-d8c11809.entry.js

@@ -1,2 +0,0 @@
-import{r as o,c as e,h as r,F as a,a as i}from"./p-abc59cdf.js";import{A as n}from"./p-13b91ce2.js";import{w as d,A as t,a as s}from"./p-d1ed09c3.js";const l='a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a :is(dso-icon,svg.di)+span,a span+:is(dso-icon,svg.di){margin-inline-start:8px}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:var(--_dso-di-background-image, url("./di.svg#download"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#download-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:var(--_dso-anchor-icon-padding-inline-end, 1.5em);background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:var(--_dso-di-background-image, url("./di.svg#external-link"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#external-link-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]{background-image:var(--_dso-di-background-image, url("./di.svg#call-grasgroen"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="tel:"]:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#call-scampi"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:var(--_dso-anchor-icon-padding-inline-start, 1.5em);background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]{background-image:var(--_dso-di-background-image, url("./di.svg#email-grasgroen"))}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^="mailto:"]:focus-visible{background-image:var(--_dso-di-background-image, url("./di.svg#email-scampi"))}:host{display:block;padding:2px}:host([wijzigactie=voegtoe]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}:host([wijzigactie=voegtoe]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}:host([wijzigactie=voegtoe]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}:host([wijzigactie=voegtoe]) a:is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}:host([wijzigactie=voegtoe]) a:is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}:host([wijzigactie=voegtoe]){box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}:host([wijzigactie=verwijder]){--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}:host([wijzigactie=verwijder]) a:is(.download,.download:hover,.download:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#download-zwart"))}:host([wijzigactie=verwijder]) a:is(.extern,.extern:hover,.extern:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#external-link-zwart"))}:host([wijzigactie=verwijder]) a:is([href^="tel:"],[href^="tel:"]:hover,[href^="tel:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#call-zwart"))}:host([wijzigactie=verwijder]) a:is([href^="mailto:"],[href^="mailto:"]:hover,[href^="mailto:"]:focus-visible){background-image:var(--_dso-di-background-image, url("./di.svg#email-zwart"))}:host([wijzigactie=verwijder]){text-decoration:line-through}@media screen and (min--moz-device-pixel-ratio: 0){:host([wijzigactie=verwijder]){font-family:sans-serif}}*,*::after,*::before{box-sizing:border-box}.annotation-body{display:flex;gap:8px}.annotation-info{flex-grow:1}.annotation-symbol,.annotation-control{flex-shrink:0}.annotation-title{font-weight:500;word-break:break-word}.annotation-title,.annotation-data{margin-block:0}.annotation-title .content:has(+dso-label),.annotation-data .content:has(+dso-label){margin-inline-end:4px}.annotation-data{font-size:0.875rem}';const c=l;const g=class{constructor(r){o(this,r);this.dsoActiveChange=e(this,"dsoActiveChange",7);this.watcher=d(this.host)}connectedCallback(){this.watcher.watch()}disconnectedCallback(){this.watcher.unwatch()}render(){const o=this.watcher.hasSymbool();return r(n,{key:"5e2947e6f85b9c02cdf87099f59a304224e96b81",symbol:o?r(t,null):undefined,active:this.active||false,dsoActiveChange:this.dsoActiveChange,title:r(a,null,r("dso-renvooi",{value:this.naam}),this.eenheid&&r(a,null," ","(in ",r("dso-renvooi",{value:this.eenheid}),")")),data:r(a,null,r("span",{class:"content"},this.toelichting&&r(a,null,this.toelichting),this.waardes&&this.waardes.length>0&&r(a,null,": ",r("dso-renvooi",{value:this.waardes}))),this.gewijzigdeLocatie&&r(s,null))})}get host(){return i(this)}};g.style=c;export{g as dso_annotation_omgevingsnormwaarde};
-//# sourceMappingURL=p-d8c11809.entry.js.map

package/dist/dso-toolkit/p-d8c11809.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["annotationCss","DsoAnnotationOmgevingsnormwaardeStyle0","AnnotationOmgevingsnormwaarde","constructor","hostRef","this","watcher","host","connectedCallback","watch","disconnectedCallback","unwatch","render","hasSymbool","h","AnnotationBody","key","symbol","AnnotationSymbolSlot","undefined","active","dsoActiveChange","title","Fragment","value","naam","eenheid","data","class","toelichting","waardes","length","gewijzigdeLocatie","AnnotationGewijzigdeLocatie"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-omgevingsnormwaarde&encapsulation=shadow","src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  word-break: break-word;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Prop, Event, h, EventEmitter, Fragment, Element } from \"@stencil/core\";\r\n\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\n\r\n/**\r\n * Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n *\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-omgevingsnormwaarde\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De naam van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  naam?: RenvooiValue | string;\r\n\r\n  /**\r\n   * De toelichting van de waardes.\r\n   */\r\n  @Prop()\r\n  toelichting?: string;\r\n\r\n  /**\r\n   * De waardes van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  waardes?: Array<RenvooiValue | string>;\r\n\r\n  /**\r\n   * De eenheid van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  eenheid?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active || false}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <dso-renvooi value={this.naam} />\r\n            {this.eenheid && (\r\n              <>\r\n                {\" \"}\r\n                (in <dso-renvooi value={this.eenheid} />)\r\n              </>\r\n            )}\r\n          </>\r\n        }\r\n        data={\r\n          <>\r\n            <span class=\"content\">\r\n              {this.toelichting && <>{this.toelichting}</>}\r\n              {this.waardes && this.waardes.length > 0 && (\r\n                <>\r\n                  : <dso-renvooi value={this.waardes} />\r\n                </>\r\n              )}\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"mappings":"sJAAA,MAAMA,EAAgB,goKACtB,MAAAC,EAAeD,E,MCkBFE,EAA6B,MAL1C,WAAAC,CAAAC,G,2DAyDUC,KAAAC,QAAUA,EAAQD,KAAKE,K,CAE/B,iBAAAC,GACEH,KAAKC,QAAQG,O,CAGf,oBAAAC,GACEL,KAAKC,QAAQK,S,CAGf,MAAAC,GACE,MAAMC,EAAaR,KAAKC,QAAQO,aAEhC,OACEC,EAACC,EAAc,CAAAC,IAAA,2CACbC,OAAQJ,EAAaC,EAACI,EAAoB,MAAMC,UAChDC,OAAQf,KAAKe,QAAU,MACvBC,gBAAiBhB,KAAKgB,gBACtBC,MACER,EAAAS,EAAA,KACET,EAAA,eAAaU,MAAOnB,KAAKoB,OACxBpB,KAAKqB,SACJZ,EAAAS,EAAA,KACG,IAAG,OACAT,EAAA,eAAaU,MAAOnB,KAAKqB,UAAW,MAKhDC,KACEb,EAAAS,EAAA,KACET,EAAA,QAAMc,MAAM,WACTvB,KAAKwB,aAAef,EAAAS,EAAA,KAAGlB,KAAKwB,aAC5BxB,KAAKyB,SAAWzB,KAAKyB,QAAQC,OAAS,GACrCjB,EAAAS,EAAA,UACIT,EAAA,eAAaU,MAAOnB,KAAKyB,YAIhCzB,KAAK2B,mBAAqBlB,EAACmB,EAA2B,Q","ignoreList":[]}

package/dist/dso-toolkit/p-da7f089a.entry.js

@@ -1,2 +0,0 @@
-import{r as i,c as n,h as e,F as t,a}from"./p-abc59cdf.js";import{i as l}from"./p-2d694112.js";const o=':host{display:block}*,*::after,*::before{box-sizing:border-box}.pagination ul{padding-inline-start:initial;text-align:center}.pagination ul>li{display:inline-block;font-weight:bold;line-height:calc(2rem - 4px);text-align:center;vertical-align:middle}.pagination ul>li>a,.pagination ul>li>span{align-items:center;color:#39870c;display:flex;block-size:2rem;justify-content:center;position:relative;min-inline-size:2rem;padding:2px;padding-block:2px;padding-inline:2px}.pagination ul>li>a:active,.pagination ul>li>span:active{background-color:#ebf3e6}.pagination ul>li>span{border:2px solid transparent;border-radius:1rem}.pagination ul>li a{line-height:2rem;text-decoration:none}.pagination ul>li a:hover,.pagination ul>li a:focus{text-decoration:none}.pagination ul>li a:hover::after,.pagination ul>li a:focus::after{border-block-end-color:#39870c}.pagination ul>li a::after{border-block-end:3px solid transparent;inset-block-end:0;content:"";display:inline-block;inset-inline-start:0;position:absolute;inline-size:100%}.pagination ul>li.active span{background-color:#39870c;color:#fff}.pagination ul>li+li{margin-inline-start:8px}.dso-page-hidden{visibility:hidden}.sr-only.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}';const s=o;const r=class{constructor(e){i(this,e);this.dsoSelectPage=n(this,"dsoSelectPage",7);this.sizePositionsMap={small:7,medium:9,large:11};this.formatHref=i=>"#"+i}sizeChangeHandler(i){this.availablePositions=this.getAvailablePositions(this.sizePositionsMap[i.detail])}clickHandler(i,n){this.dsoSelectPage.emit({originalEvent:i,page:n,isModifiedEvent:l(i)})}componentDidLoad(){var i;(i=this.responsiveElement)===null||i===void 0?void 0:i.getSize().then((i=>this.availablePositions=this.getAvailablePositions(this.sizePositionsMap[i])))}render(){var i,n,a;if(!this.totalPages){return null}if(this.availablePositions===undefined){return e("dso-responsive-element",{ref:i=>this.responsiveElement=i})}const l=this.availablePositions;const o=(i=this.currentPage)!==null&&i!==void 0?i:0;const s=this.getPages(o,this.availablePositions,this.totalPages);return e("dso-responsive-element",{ref:i=>this.responsiveElement=i},e("nav",{class:"pagination","aria-label":"Paginering"},e("ul",null,e("li",{class:o<=1||o>this.totalPages?"dso-page-hidden":undefined},e("a",{href:this.formatHref((n=s[s.indexOf(o)-1])!==null&&n!==void 0?n:1),"aria-label":"Vorige",onClick:i=>{var n;return o&&this.clickHandler(i,(n=s[s.indexOf(o)-1])!==null&&n!==void 0?n:1)}},e("dso-icon",{icon:"chevron-left"}))),s.map((i=>e(t,null,this.showEllipsisBeforeLast(s,i,l)&&e("li",null,e("span",null,"...")),e("li",{key:i,class:o===i?"active":undefined},o===i?e("span",{"aria-current":"page"},i):e("a",{href:this.formatHref(i),onClick:n=>this.clickHandler(n,i)},i),i===this.totalPages?e("span",{class:"sr-only"}," (laatste pagina)"):null),this.showEllipsisAfterFirst(s,i,l)&&e("li",null,e("span",null,"..."))))),e("li",{class:o<1||o>=this.totalPages?"dso-page-hidden":undefined},e("a",{href:this.formatHref((a=s[s.indexOf(o)+1])!==null&&a!==void 0?a:this.totalPages),"aria-label":"Volgende",onClick:i=>{var n;return o&&this.totalPages&&this.clickHandler(i,(n=s[s.indexOf(o)+1])!==null&&n!==void 0?n:this.totalPages)}},e("dso-icon",{icon:"chevron-right"}))))))}getAvailablePositions(i){if(i%2===0){return i-1}if(i<=3){return 3}return i}getPages(i,n,e){if(e+2<=n){return Array.from({length:e},((i,n)=>n+1))}if(n===3){return[i]}if(n===5){return[1,i,e]}return[1,...this.getPageRange(i,n,e),e]}getPageRange(i,n,e){const t=[];const a=Math.floor(n/2);if(i<=a){for(let i=2;i<=n-4;i++){t.push(i)}}if(i>=a&&i<=e-a){if(a===1){if(i>e-2){t.push(e-2)}t.push(i);if(i<3){t.push(3)}}if(a>1){const n=a-3;for(let l=Math.min(i-n,e-a);l<=Math.max(i+n,a);l++){if(l>2&&l<e-1){t.push(l)}}}}if(i>e-a){for(let i=e-(n-5);i<=e-1;i++){t.push(i)}}return t.filter(((i,n,e)=>e.indexOf(i)===n))}showEllipsisAfterFirst(i,n,e){const t=i[i.length-1];if(!t){throw new Error("No totalPages")}return i.indexOf(n)===0&&t>e-2&&!i.some((i=>i===2))&&e>=7}showEllipsisBeforeLast(i,n,e){const t=i[i.length-1];if(!t){throw new Error("No totalPages")}return i.indexOf(n)===i.length-1&&t>e-2&&!i.some((i=>i===t-1))&&e>=7}get host(){return a(this)}};r.style=s;export{r as dso_pagination};
-//# sourceMappingURL=p-da7f089a.entry.js.map