@dso-toolkit/core 72.0.0 → 72.2.0

package/dist/cjs/loader.cjs.js

@@ -1,12 +1,12 @@
 'use strict';
 
-var index = require('./index-CkTcEJuV.js');
+var index = require('./index-DvrTSHdI.js');
 var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy(JSON.parse("[[\"dso-icon.cjs\",[[1,\"dso-icon\",{\"icon\":[1]}]]],[\"dsot-document-component-demo.cjs\",[[2,\"dsot-document-component-demo\",{\"showCanvas\":[516,\"show-canvas\"],\"jsonFile\":[1,\"json-file\"],\"openDefault\":[4,\"open-default\"],\"mode\":[513],\"ozonContentUrlResolver\":[16],\"response\":[32],\"document\":[32],\"openOrClosed\":[32],\"openedAnnotation\":[32],\"filtered\":[32],\"notApplicable\":[32],\"activeAnnotationSelectables\":[32]},null,{\"jsonFile\":[\"jsonFileWatcher\"],\"openDefault\":[\"openDefaultWatcher\"]}]]],[\"dso-accordion-section.cjs\",[[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.cjs\",[[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.cjs\",[[1,\"dso-annotation-gebiedsaanwijzing\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1]}]]],[\"dso-annotation-omgevingsnormwaarde.cjs\",[[1,\"dso-annotation-omgevingsnormwaarde\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"toelichting\":[1],\"waardes\":[16],\"eenheid\":[1]}]]],[\"dso-advanced-select.cjs\",[[1,\"dso-advanced-select\",{\"options\":[16],\"active\":[16],\"activeHint\":[1,\"active-hint\"],\"open\":[32]},[[8,\"keydown\",\"keyDownListener\"]]]]],[\"dso-legend-item.cjs\",[[1,\"dso-legend-item\",{\"disabled\":[516],\"disabledMessage\":[1,\"disabled-message\"],\"removable\":[4],\"showBody\":[32]}]]],[\"dso-map-base-layers.cjs\",[[1,\"dso-map-base-layers\",{\"group\":[1],\"baseLayers\":[16]}]]],[\"dso-map-overlays.cjs\",[[1,\"dso-map-overlays\",{\"group\":[1],\"overlays\":[16]}]]],[\"dso-annotation-kaart.cjs\",[[1,\"dso-annotation-kaart\",{\"wijzigactie\":[513],\"naam\":[1],\"href\":[513]}]]],[\"dso-autosuggest.cjs\",[[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],\"listboxContainerMaxBlockSize\":[32]},[[4,\"click\",\"onDocumentClick\"]],{\"suggestions\":[\"suggestionsWatcher\"]}]]],[\"dso-project-item.cjs\",[[1,\"dso-project-item\",{\"label\":[1]}]]],[\"dso-header.cjs\",[[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.cjs\",[[1,\"dso-map-controls\",{\"open\":[1540],\"disableZoom\":[1,\"disable-zoom\"],\"hideContent\":[32],\"toggleVisibility\":[64]},null,{\"open\":[\"watchOpen\"]}]]],[\"dso-modal.cjs\",[[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.cjs\",[[1,\"dso-pagination\",{\"totalPages\":[2,\"total-pages\"],\"currentPage\":[2,\"current-page\"],\"formatHref\":[16],\"availablePositions\":[32]},[[0,\"dsoSizeChange\",\"sizeChangeHandler\"]]]]],[\"dso-survey-rating.cjs\",[[1,\"dso-survey-rating\"]]],[\"dso-tree-view.cjs\",[[1,\"dso-tree-view\",{\"collection\":[16],\"focusItem\":[64]}]]],[\"dso-action-list-item.cjs\",[[1,\"dso-action-list-item\",{\"step\":[2],\"itemTitle\":[1,\"item-title\"],\"flowLine\":[4,\"flow-line\"],\"warning\":[4],\"divider\":[4]}]]],[\"dso-card.cjs\",[[1,\"dso-card\",{\"href\":[513],\"mode\":[513],\"active\":[516]}]]],[\"dso-date-picker-legacy.cjs\",[[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.cjs\",[[1,\"dso-document-card\",{\"href\":[513],\"active\":[516]}]]],[\"dso-list-button.cjs\",[[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.cjs\",[[1,\"dso-mark-bar\",{\"value\":[1],\"label\":[1],\"current\":[2],\"totalCount\":[2,\"total-count\"],\"dsoFocus\":[64]}]]],[\"dso-plekinfo-card.cjs\",[[1,\"dso-plekinfo-card\",{\"wijzigactie\":[513],\"href\":[513],\"targetBlank\":[4,\"target-blank\"],\"active\":[516]}]]],[\"dso-skiplink.cjs\",[[1,\"dso-skiplink\",{\"to\":[513],\"label\":[513]}]]],[\"dso-accordion.cjs\",[[1,\"dso-accordion\",{\"variant\":[6145],\"reverseAlign\":[6148,\"reverse-align\"],\"_getState\":[64]}]]],[\"dso-action-list.cjs\",[[1,\"dso-action-list\",{\"listTitle\":[1,\"list-title\"]}]]],[\"dso-banner.cjs\",[[1,\"dso-banner\",{\"status\":[513],\"compact\":[4],\"icon\":[516]}]]],[\"dso-card-container.cjs\",[[1,\"dso-card-container\",{\"mode\":[513]}]]],[\"dso-contact-information.cjs\",[[1,\"dso-contact-information\"]]],[\"dso-date-picker.cjs\",[[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.cjs\",[[1,\"dso-highlight-box\",{\"yellow\":[516],\"border\":[516],\"white\":[516],\"dropShadow\":[516,\"drop-shadow\"],\"step\":[514]}]]],[\"dso-input-range.cjs\",[[1,\"dso-input-range\",{\"min\":[2],\"max\":[2],\"value\":[2],\"step\":[2],\"label\":[1],\"unit\":[1],\"description\":[1]}]]],[\"dso-logo.cjs\",[[1,\"dso-logo\",{\"name\":[513],\"logoUrl\":[513,\"logo-url\"],\"label\":[513],\"labelUrl\":[513,\"label-url\"],\"ribbon\":[513]}]]],[\"dso-progress-bar.cjs\",[[1,\"dso-progress-bar\",{\"progress\":[2],\"min\":[2],\"max\":[2]}]]],[\"dso-tab.cjs\",[[1,\"dso-tab\",{\"active\":[516],\"disabled\":[516],\"href\":[1],\"_dsoFocus\":[64]}]]],[\"dso-tabs.cjs\",[[1,\"dso-tabs\"]]],[\"dso-viewer-grid.cjs\",[[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-toggletip.cjs\",[[1,\"dso-toggletip\",{\"label\":[1],\"position\":[1],\"small\":[4],\"secondary\":[4],\"active\":[32]}]]],[\"dso-dropdown-menu.cjs\",[[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-annotation-locatie_2.cjs\",[[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\"],\"ozonContentUrlResolver\":[16],\"mode\":[513],\"href\":[513]}],[1,\"dso-annotation-locatie\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"locatieNoemer\":[1,\"locatie-noemer\"]}]]],[\"dso-attachments-counter_2.cjs\",[[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.cjs\",[[1,\"dso-progress-indicator\",{\"label\":[1],\"size\":[513],\"block\":[516]}]]],[\"dso-responsive-element.cjs\",[[1,\"dso-responsive-element\",{\"sizeAlias\":[32],\"sizeWidth\":[32],\"getSize\":[64]}]]],[\"dso-scrollable.cjs\",[[1,\"dso-scrollable\",{\"scrollPosition\":[32],\"_setScrollState\":[64]}]]],[\"dso-info-button.cjs\",[[1,\"dso-info-button\",{\"active\":[1540],\"secondary\":[4],\"label\":[1],\"hover\":[32],\"setFocus\":[64]}]]],[\"dso-info_2.cjs\",[[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-tooltip.cjs\",[[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.cjs\",[[1,\"dso-ozon-content\",{\"content\":[1],\"inline\":[516],\"mark\":[16],\"urlResolver\":[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-label_3.cjs\",[[1,\"dso-renvooi\",{\"value\":[1],\"mark\":[16]}],[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 index.bootstrapLazy(JSON.parse("[[\"dso-icon.cjs\",[[1,\"dso-icon\",{\"icon\":[1]}]]],[\"dsot-document-component-demo.cjs\",[[2,\"dsot-document-component-demo\",{\"showCanvas\":[516,\"show-canvas\"],\"jsonFile\":[1,\"json-file\"],\"openDefault\":[4,\"open-default\"],\"mode\":[513],\"ozonContentUrlResolver\":[16,\"ozon-content-url-resolver\"],\"response\":[32],\"document\":[32],\"openOrClosed\":[32],\"openedAnnotation\":[32],\"filtered\":[32],\"notApplicable\":[32],\"activeAnnotationSelectables\":[32]},null,{\"jsonFile\":[\"jsonFileWatcher\"],\"openDefault\":[\"openDefaultWatcher\"]}]]],[\"dso-accordion-section.cjs\",[[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.cjs\",[[1,\"dso-annotation-activiteit\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"regelKwalificatie\":[1,\"regel-kwalificatie\"],\"locatieNoemers\":[16,\"locatie-noemers\"],\"regelKwalificatieVoorzetsel\":[1,\"regel-kwalificatie-voorzetsel\"]}]]],[\"dso-annotation-gebiedsaanwijzing.cjs\",[[1,\"dso-annotation-gebiedsaanwijzing\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1]}]]],[\"dso-annotation-omgevingsnormwaarde.cjs\",[[1,\"dso-annotation-omgevingsnormwaarde\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"naam\":[1],\"toelichting\":[1],\"waardes\":[16],\"eenheid\":[1]}]]],[\"dso-advanced-select.cjs\",[[1,\"dso-advanced-select\",{\"options\":[16],\"active\":[16],\"activeHint\":[1,\"active-hint\"],\"open\":[32]},[[8,\"keydown\",\"keyDownListener\"]]]]],[\"dso-legend-item.cjs\",[[1,\"dso-legend-item\",{\"disabled\":[516],\"disabledMessage\":[1,\"disabled-message\"],\"removable\":[4],\"showBody\":[32]}]]],[\"dso-map-base-layers.cjs\",[[1,\"dso-map-base-layers\",{\"group\":[1],\"baseLayers\":[16,\"base-layers\"]}]]],[\"dso-map-overlays.cjs\",[[1,\"dso-map-overlays\",{\"group\":[1],\"overlays\":[16]}]]],[\"dso-annotation-kaart.cjs\",[[1,\"dso-annotation-kaart\",{\"wijzigactie\":[513],\"naam\":[1],\"href\":[513]}]]],[\"dso-autosuggest.cjs\",[[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],\"listboxContainerMaxBlockSize\":[32]},[[4,\"click\",\"onDocumentClick\"]],{\"suggestions\":[\"suggestionsWatcher\"]}]]],[\"dso-project-item.cjs\",[[1,\"dso-project-item\",{\"label\":[1]}]]],[\"dso-header.cjs\",[[1,\"dso-header\",{\"mainMenu\":[16,\"main-menu\"],\"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.cjs\",[[1,\"dso-map-controls\",{\"open\":[1540],\"disableZoom\":[1,\"disable-zoom\"],\"hideContent\":[32],\"toggleVisibility\":[64]},null,{\"open\":[\"watchOpen\"]}]]],[\"dso-modal.cjs\",[[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.cjs\",[[1,\"dso-pagination\",{\"totalPages\":[2,\"total-pages\"],\"currentPage\":[2,\"current-page\"],\"formatHref\":[16,\"format-href\"],\"availablePositions\":[32]},[[0,\"dsoSizeChange\",\"sizeChangeHandler\"]]]]],[\"dso-survey-rating.cjs\",[[1,\"dso-survey-rating\"]]],[\"dso-tree-view.cjs\",[[1,\"dso-tree-view\",{\"collection\":[16],\"focusItem\":[64]}]]],[\"dso-action-list-item.cjs\",[[1,\"dso-action-list-item\",{\"step\":[2],\"itemTitle\":[1,\"item-title\"],\"flowLine\":[4,\"flow-line\"],\"warning\":[4],\"divider\":[4]}]]],[\"dso-card.cjs\",[[1,\"dso-card\",{\"href\":[513],\"mode\":[513],\"active\":[516]}]]],[\"dso-date-picker-legacy.cjs\",[[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.cjs\",[[1,\"dso-document-card\",{\"href\":[513],\"active\":[516]}]]],[\"dso-list-button.cjs\",[[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.cjs\",[[1,\"dso-mark-bar\",{\"value\":[1],\"label\":[1],\"current\":[2],\"totalCount\":[2,\"total-count\"],\"dsoFocus\":[64]}]]],[\"dso-onboarding-tip.cjs\",[[1,\"dso-onboarding-tip\",{\"placement\":[1]}]]],[\"dso-plekinfo-card.cjs\",[[1,\"dso-plekinfo-card\",{\"wijzigactie\":[513],\"href\":[513],\"targetBlank\":[4,\"target-blank\"],\"active\":[516]}]]],[\"dso-skiplink.cjs\",[[1,\"dso-skiplink\",{\"to\":[513],\"label\":[513]}]]],[\"dso-accordion.cjs\",[[1,\"dso-accordion\",{\"variant\":[6145],\"reverseAlign\":[6148,\"reverse-align\"],\"_getState\":[64]}]]],[\"dso-action-list.cjs\",[[1,\"dso-action-list\",{\"listTitle\":[1,\"list-title\"]}]]],[\"dso-banner.cjs\",[[1,\"dso-banner\",{\"status\":[513],\"compact\":[4],\"icon\":[516]}]]],[\"dso-card-container.cjs\",[[1,\"dso-card-container\",{\"mode\":[513]}]]],[\"dso-contact-information.cjs\",[[1,\"dso-contact-information\"]]],[\"dso-date-picker.cjs\",[[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.cjs\",[[1,\"dso-highlight-box\",{\"yellow\":[516],\"border\":[516],\"white\":[516],\"dropShadow\":[516,\"drop-shadow\"],\"step\":[514]}]]],[\"dso-input-range.cjs\",[[1,\"dso-input-range\",{\"min\":[2],\"max\":[2],\"value\":[2],\"step\":[2],\"label\":[1],\"unit\":[1],\"description\":[1]}]]],[\"dso-logo.cjs\",[[1,\"dso-logo\",{\"name\":[513],\"logoUrl\":[513,\"logo-url\"],\"label\":[513],\"labelUrl\":[513,\"label-url\"],\"ribbon\":[513]}]]],[\"dso-progress-bar.cjs\",[[1,\"dso-progress-bar\",{\"progress\":[2],\"min\":[2],\"max\":[2]}]]],[\"dso-tab.cjs\",[[1,\"dso-tab\",{\"active\":[516],\"disabled\":[516],\"href\":[1],\"_dsoFocus\":[64]}]]],[\"dso-tabs.cjs\",[[1,\"dso-tabs\"]]],[\"dso-viewer-grid.cjs\",[[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-toggletip.cjs\",[[1,\"dso-toggletip\",{\"label\":[1],\"position\":[1],\"small\":[4],\"secondary\":[4],\"active\":[32]}]]],[\"dso-dropdown-menu.cjs\",[[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-annotation-locatie_2.cjs\",[[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\"],\"ozonContentUrlResolver\":[16,\"ozon-content-url-resolver\"],\"mode\":[513],\"href\":[513]}],[1,\"dso-annotation-locatie\",{\"wijzigactie\":[513],\"active\":[516],\"gewijzigdeLocatie\":[516,\"gewijzigde-locatie\"],\"locatieNoemer\":[1,\"locatie-noemer\"]}]]],[\"dso-attachments-counter_2.cjs\",[[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.cjs\",[[1,\"dso-progress-indicator\",{\"label\":[1],\"size\":[513],\"block\":[516]}]]],[\"dso-responsive-element.cjs\",[[1,\"dso-responsive-element\",{\"sizeAlias\":[32],\"sizeWidth\":[32],\"getSize\":[64]}]]],[\"dso-scrollable.cjs\",[[1,\"dso-scrollable\",{\"scrollPosition\":[32],\"_setScrollState\":[64]}]]],[\"dso-info-button.cjs\",[[1,\"dso-info-button\",{\"active\":[1540],\"secondary\":[4],\"label\":[1],\"hover\":[32],\"setFocus\":[64]}]]],[\"dso-info_2.cjs\",[[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-tooltip.cjs\",[[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.cjs\",[[1,\"dso-ozon-content\",{\"content\":[1],\"inline\":[516],\"mark\":[16],\"urlResolver\":[16,\"url-resolver\"],\"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-label_3.cjs\",[[1,\"dso-renvooi\",{\"value\":[1],\"mark\":[16]}],[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);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -42,6 +42,7 @@
     "components/map-overlays/map-overlays.js",
     "components/mark-bar/mark-bar.js",
     "components/modal/modal.js",
+    "components/onboarding-tip/onboarding-tip.js",
     "components/ozon-content/ozon-content.js",
     "components/pagination/pagination.js",
     "components/plekinfo-card/plekinfo-card.js",
@@ -65,7 +66,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.28.2",
+    "version": "4.30.0",
     "typescriptVersion": "5.5.4"
   },
   "collections": [],

package/dist/collection/components/accordion/accordion.js

@@ -53,6 +53,7 @@ export class Accordion {
         return {
             "variant": {
                 "type": "string",
+                "attribute": "variant",
                 "mutable": false,
                 "complexType": {
                     "original": "AccordionVariant",
@@ -73,11 +74,11 @@ export class Accordion {
                 },
                 "getter": true,
                 "setter": true,
-                "attribute": "variant",
                 "reflect": false
             },
             "reverseAlign": {
                 "type": "boolean",
+                "attribute": "reverse-align",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -92,7 +93,6 @@ export class Accordion {
                 },
                 "getter": true,
                 "setter": true,
-                "attribute": "reverse-align",
                 "reflect": false
             }
         };

package/dist/collection/components/accordion/components/accordion-section.js

@@ -195,6 +195,7 @@ export class AccordionSection {
         return {
             "handleTitle": {
                 "type": "string",
+                "attribute": "handle-title",
                 "mutable": false,
                 "complexType": {
                     "original": "RenvooiValue | RenvooiValue[] | undefined",
@@ -215,11 +216,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "handle-title",
                 "reflect": false
             },
             "wijzigactie": {
                 "type": "string",
+                "attribute": "wijzigactie",
                 "mutable": false,
                 "complexType": {
                     "original": "AccordionSectionWijzigactie",
@@ -240,11 +241,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "wijzigactie",
                 "reflect": false
             },
             "heading": {
                 "type": "string",
+                "attribute": "heading",
                 "mutable": false,
                 "complexType": {
                     "original": "AccordionHeading",
@@ -265,12 +266,12 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "heading",
                 "reflect": false,
                 "defaultValue": "\"h2\""
             },
             "handleUrl": {
                 "type": "string",
+                "attribute": "handle-url",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -285,11 +286,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "handle-url",
                 "reflect": false
             },
             "status": {
                 "type": "string",
+                "attribute": "status",
                 "mutable": false,
                 "complexType": {
                     "original": "AccordionSectionState",
@@ -310,11 +311,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "status",
                 "reflect": false
             },
             "attachmentCount": {
                 "type": "number",
+                "attribute": "attachment-count",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -329,11 +330,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "attachment-count",
                 "reflect": false
             },
             "icon": {
                 "type": "string",
+                "attribute": "icon",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -348,11 +349,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "icon",
                 "reflect": false
             },
             "statusDescription": {
                 "type": "string",
+                "attribute": "status-description",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -367,11 +368,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "status-description",
                 "reflect": false
             },
             "open": {
                 "type": "boolean",
+                "attribute": "open",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -386,12 +387,12 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "hasNestedAccordion": {
                 "type": "boolean",
+                "attribute": "has-nested-accordion",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -406,12 +407,12 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "has-nested-accordion",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -426,11 +427,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
                 "reflect": false
             },
             "labelStatus": {
                 "type": "string",
+                "attribute": "label-status",
                 "mutable": false,
                 "complexType": {
                     "original": "LabelStatus",
@@ -451,11 +452,11 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label-status",
                 "reflect": false
             },
             "activatable": {
                 "type": "boolean",
+                "attribute": "activatable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -470,12 +471,12 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "activatable",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "active": {
                 "type": "boolean",
+                "attribute": "active",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -490,7 +491,6 @@ export class AccordionSection {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "active",
                 "reflect": true,
                 "defaultValue": "false"
             }

package/dist/collection/components/action-list/action-list.js

@@ -19,6 +19,7 @@ export class ActionList {
         return {
             "listTitle": {
                 "type": "string",
+                "attribute": "list-title",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -33,7 +34,6 @@ export class ActionList {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "list-title",
                 "reflect": false
             }
         };

package/dist/collection/components/action-list/components/action-list-item.js

@@ -36,6 +36,7 @@ export class ActionListItem {
         return {
             "step": {
                 "type": "number",
+                "attribute": "step",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -50,11 +51,11 @@ export class ActionListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "step",
                 "reflect": false
             },
             "itemTitle": {
                 "type": "string",
+                "attribute": "item-title",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -69,11 +70,11 @@ export class ActionListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "item-title",
                 "reflect": false
             },
             "flowLine": {
                 "type": "boolean",
+                "attribute": "flow-line",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -88,12 +89,12 @@ export class ActionListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "flow-line",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "warning": {
                 "type": "boolean",
+                "attribute": "warning",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -108,12 +109,12 @@ export class ActionListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "warning",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "divider": {
                 "type": "boolean",
+                "attribute": "divider",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -128,7 +129,6 @@ export class ActionListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "divider",
                 "reflect": false,
                 "defaultValue": "false"
             }

package/dist/collection/components/advanced-select/advanced-select.js

@@ -100,6 +100,7 @@ export class AdvancedSelect {
         return {
             "options": {
                 "type": "unknown",
+                "attribute": "options",
                 "mutable": false,
                 "complexType": {
                     "original": "AdvancedSelectOptionOrGroup<never>[]",
@@ -124,6 +125,7 @@ export class AdvancedSelect {
             },
             "active": {
                 "type": "unknown",
+                "attribute": "active",
                 "mutable": false,
                 "complexType": {
                     "original": "AdvancedSelectOption<never>",
@@ -147,6 +149,7 @@ export class AdvancedSelect {
             },
             "activeHint": {
                 "type": "string",
+                "attribute": "active-hint",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -161,7 +164,6 @@ export class AdvancedSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "active-hint",
                 "reflect": false
             }
         };

package/dist/collection/components/advanced-select/advanced-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"advanced-select.js","sourceRoot":"","sources":["../../../../src/components/advanced-select/advanced-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  Component,\r\n  ComponentInterface,\r\n  Prop,\r\n  h,\r\n  FunctionalComponent,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  State,\r\n  Fragment,\r\n  Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport {\r\n  AdvancedSelectGroup,\r\n  AdvancedSelectGroupRedirect,\r\n  AdvancedSelectOption,\r\n  AdvancedSelectChangeEvent,\r\n  AdvancedSelectOptionOrGroup,\r\n  AdvancedSelectRedirectEvent,\r\n} from \"./advanced-select.interfaces\";\r\nimport { createFocusTrap, FocusTrap } from \"focus-trap\";\r\nimport { tabbable } from \"tabbable\";\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\n@Component({\r\n  tag: \"dso-advanced-select\",\r\n  styleUrl: \"advanced-select.scss\",\r\n  shadow: true,\r\n})\r\nexport class AdvancedSelect implements ComponentInterface {\r\n  private trap?: FocusTrap;\r\n\r\n  @Element()\r\n  host!: HTMLDsoAdvancedSelectElement;\r\n\r\n  /**\r\n   * The options to display in the select.\r\n   */\r\n  @Prop()\r\n  options: AdvancedSelectOptionOrGroup<never>[] = [];\r\n\r\n  /**\r\n   * The active option. By object reference.\r\n   */\r\n  @Prop()\r\n  active?: AdvancedSelectOption<never>;\r\n\r\n  /**\r\n   * An extra text for the active option. Only visible in the list of options.\r\n   */\r\n  @Prop()\r\n  activeHint?: string;\r\n\r\n  /**\r\n   * The open state of the options list.\r\n   */\r\n  @State()\r\n  open: boolean = false;\r\n\r\n  /**\r\n   * Emitted when user selects an option\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoChange!: EventEmitter<AdvancedSelectChangeEvent<never>>;\r\n\r\n  /**\r\n   * Emitted when user activates a group redirect link.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoRedirect!: EventEmitter<AdvancedSelectRedirectEvent>;\r\n\r\n  private toggleButtonElementRef: HTMLButtonElement | undefined;\r\n\r\n  @Listen(\"keydown\", { target: \"window\" })\r\n  keyDownListener(event: KeyboardEvent) {\r\n    if (this.open && event.key === \"ArrowUp\") {\r\n      event.preventDefault();\r\n      this.handleTab(-1);\r\n    } else if (this.open && event.key === \"ArrowDown\") {\r\n      event.preventDefault();\r\n      this.handleTab(1);\r\n    }\r\n  }\r\n\r\n  componentDidRender() {\r\n    if (this.open && !this.trap) {\r\n      this.createTrap();\r\n    } else if (!this.open && this.trap) {\r\n      this.removeTrap();\r\n    }\r\n  }\r\n\r\n  private toggleOpen = () => {\r\n    this.open = !this.open;\r\n  };\r\n\r\n  private createTrap() {\r\n    this.trap = createFocusTrap(this.host, {\r\n      clickOutsideDeactivates: true,\r\n      escapeDeactivates: true,\r\n      setReturnFocus: this.toggleButtonElementRef,\r\n      tabbableOptions: {\r\n        getShadowRoot: true,\r\n      },\r\n      onDeactivate: () => {\r\n        this.open = false;\r\n      },\r\n    }).activate();\r\n  }\r\n\r\n  private removeTrap() {\r\n    this.trap?.deactivate();\r\n    delete this.trap;\r\n  }\r\n\r\n  private handleTab(direction: number) {\r\n    const elements = this.host.isConnected ? tabbable(this.host, { getShadowRoot: true }) : [];\r\n    const currentIndex = elements.findIndex((e) => e === this.host.shadowRoot?.activeElement);\r\n\r\n    let nextIndex = currentIndex + direction;\r\n    if (nextIndex >= elements.length) {\r\n      nextIndex = 0;\r\n    } else if (nextIndex < 0) {\r\n      nextIndex = elements.length - 1;\r\n    }\r\n\r\n    elements[nextIndex]?.focus();\r\n  }\r\n\r\n  private handleOptionClick = (event: MouseEvent, option: AdvancedSelectOption<never>) => {\r\n    this.dsoChange.emit({ originalEvent: event, option });\r\n    this.open = false;\r\n  };\r\n\r\n  private handleRedirectClick = (event: MouseEvent, redirect: AdvancedSelectGroupRedirect) => {\r\n    this.dsoRedirect.emit({ originalEvent: event, isModifiedEvent: isModifiedEvent(event), redirect });\r\n    this.open = false;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <button\r\n          aria-expanded={this.open.toString()}\r\n          class={clsx([\"active-option\", { open: this.open }])}\r\n          type=\"button\"\r\n          onClick={this.toggleOpen}\r\n          ref={(element) => (this.toggleButtonElementRef = element)}\r\n        >\r\n          <ActiveGroupLabel active={this.active} options={this.options} />\r\n          <span class=\"active-option-label\">{this.active?.label ?? \"Selecteer een optie\"}</span>\r\n          <span class=\"active-option-aside\">\r\n            {this.options.some(\r\n              (optionOrGroup) => \"summaryCounter\" in optionOrGroup && optionOrGroup?.summaryCounter,\r\n            ) && (\r\n              <span class=\"badges\">\r\n                {this.options\r\n                  .filter(\r\n                    (option): option is AdvancedSelectGroup<never> =>\r\n                      \"options\" in option && \"summaryCounter\" in option && !!option?.summaryCounter,\r\n                  )\r\n                  .map((group) => (\r\n                    <dso-badge status={group.variant ?? \"outline\"}>{group.options.length}</dso-badge>\r\n                  ))}\r\n              </span>\r\n            )}\r\n            <dso-icon icon=\"caret-down\"></dso-icon>\r\n          </span>\r\n        </button>\r\n        {this.open && (\r\n          <div class=\"groups-container\">\r\n            <ul class=\"groups\">\r\n              {this.options.map(\r\n                (optionOrGroup) =>\r\n                  (\"options\" in optionOrGroup && (\r\n                    <li class={clsx([\"group\", { [`group-${optionOrGroup.variant}`]: !!optionOrGroup.variant }])}>\r\n                      <p class=\"group-label\">{optionOrGroup.label}</p>\r\n                      <ul class=\"options\">\r\n                        {optionOrGroup.options.map((option) => (\r\n                          <li>\r\n                            <OptionButton\r\n                              option={option}\r\n                              active={this.active}\r\n                              activeHint={this.activeHint}\r\n                              callback={this.handleOptionClick}\r\n                            />\r\n                          </li>\r\n                        ))}\r\n                      </ul>\r\n                      {optionOrGroup.redirect && (\r\n                        <RedirectAnchor\r\n                          redirect={optionOrGroup.redirect}\r\n                          callback={this.handleRedirectClick}\r\n                        ></RedirectAnchor>\r\n                      )}\r\n                    </li>\r\n                  )) ||\r\n                  (\"placeholder\" in optionOrGroup && (\r\n                    <li class=\"group\">\r\n                      <p class=\"group-label\">{optionOrGroup.label}</p>\r\n                      <p class=\"placeholder\">{optionOrGroup.placeholder}</p>\r\n                      {optionOrGroup.redirect && (\r\n                        <RedirectAnchor\r\n                          redirect={optionOrGroup.redirect}\r\n                          callback={this.handleRedirectClick}\r\n                        ></RedirectAnchor>\r\n                      )}\r\n                    </li>\r\n                  )) || (\r\n                    <li>\r\n                      <OptionButton\r\n                        option={optionOrGroup}\r\n                        active={this.active}\r\n                        activeHint={this.activeHint}\r\n                        callback={this.handleOptionClick}\r\n                      />\r\n                    </li>\r\n                  ),\r\n              )}\r\n            </ul>\r\n          </div>\r\n        )}\r\n      </>\r\n    );\r\n  }\r\n}\r\n\r\ninterface OptionButtonProps {\r\n  option: AdvancedSelectOption<never>;\r\n  active: AdvancedSelectOption<never> | undefined;\r\n  activeHint: string | undefined;\r\n  callback: (event: MouseEvent, value: AdvancedSelectOption<never>) => void;\r\n}\r\n\r\nconst OptionButton: FunctionalComponent<OptionButtonProps> = ({ option, active, activeHint, callback }) => (\r\n  <button\r\n    class={clsx([\"option\", { \"option-active\": active === option }])}\r\n    type=\"button\"\r\n    onClick={(e) => callback(e, option)}\r\n  >\r\n    <span class=\"option-label\">{option.label}</span>\r\n    {!!activeHint && active === option && <span class=\"option-hint\">({activeHint})</span>}\r\n  </button>\r\n);\r\n\r\ninterface RedirectAnchorProps {\r\n  redirect: AdvancedSelectGroupRedirect;\r\n  callback: (event: MouseEvent, value: AdvancedSelectGroupRedirect) => void;\r\n}\r\n\r\nconst RedirectAnchor: FunctionalComponent<RedirectAnchorProps> = ({ redirect, callback }) => (\r\n  <a class=\"group-link\" href={redirect.href} onClick={(e) => callback(e, redirect)}>\r\n    {redirect.label}\r\n    <dso-icon icon=\"chevron-right\"></dso-icon>\r\n  </a>\r\n);\r\n\r\ninterface ActiveGroupLabelProps {\r\n  active: AdvancedSelectOption<never> | undefined;\r\n  options: AdvancedSelectOptionOrGroup<never>[];\r\n}\r\n\r\nconst ActiveGroupLabel: FunctionalComponent<ActiveGroupLabelProps> = ({ active, options }) => {\r\n  const group = options.find(\r\n    (optionOrGroup): optionOrGroup is AdvancedSelectGroup<never> =>\r\n      \"options\" in optionOrGroup &&\r\n      !!optionOrGroup.options.find((option) => option === active) &&\r\n      !!optionOrGroup.activeLabel,\r\n  );\r\n\r\n  return group ? (\r\n    <dso-label compact status={group.variant}>\r\n      {group.activeLabel}\r\n    </dso-label>\r\n  ) : undefined;\r\n};\r\n"]}
+{"version":3,"file":"advanced-select.js","sourceRoot":"","sources":["../../../../src/components/advanced-select/advanced-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  Component,\r\n  ComponentInterface,\r\n  Prop,\r\n  h,\r\n  FunctionalComponent,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  State,\r\n  Fragment,\r\n  Listen,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport {\r\n  AdvancedSelectGroup,\r\n  AdvancedSelectGroupRedirect,\r\n  AdvancedSelectOption,\r\n  AdvancedSelectChangeEvent,\r\n  AdvancedSelectOptionOrGroup,\r\n  AdvancedSelectRedirectEvent,\r\n} from \"./advanced-select.interfaces\";\r\nimport { createFocusTrap, FocusTrap } from \"focus-trap\";\r\nimport { tabbable } from \"tabbable\";\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\n@Component({\r\n  tag: \"dso-advanced-select\",\r\n  styleUrl: \"advanced-select.scss\",\r\n  shadow: true,\r\n})\r\nexport class AdvancedSelect implements ComponentInterface {\r\n  private trap?: FocusTrap;\r\n\r\n  @Element()\r\n  host!: HTMLDsoAdvancedSelectElement;\r\n\r\n  /**\r\n   * The options to display in the select.\r\n   */\r\n  @Prop()\r\n  options: AdvancedSelectOptionOrGroup<never>[] = [];\r\n\r\n  /**\r\n   * The active option. By object reference.\r\n   */\r\n  @Prop()\r\n  active?: AdvancedSelectOption<never>;\r\n\r\n  /**\r\n   * An extra text for the active option. Only visible in the list of options.\r\n   */\r\n  @Prop()\r\n  activeHint?: string;\r\n\r\n  /**\r\n   * The open state of the options list.\r\n   */\r\n  @State()\r\n  open: boolean = false;\r\n\r\n  /**\r\n   * Emitted when user selects an option\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoChange!: EventEmitter<AdvancedSelectChangeEvent<never>>;\r\n\r\n  /**\r\n   * Emitted when user activates a group redirect link.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoRedirect!: EventEmitter<AdvancedSelectRedirectEvent>;\r\n\r\n  private toggleButtonElementRef: HTMLButtonElement | undefined;\r\n\r\n  @Listen(\"keydown\", { target: \"window\" })\r\n  keyDownListener(event: KeyboardEvent) {\r\n    if (this.open && event.key === \"ArrowUp\") {\r\n      event.preventDefault();\r\n      this.handleTab(-1);\r\n    } else if (this.open && event.key === \"ArrowDown\") {\r\n      event.preventDefault();\r\n      this.handleTab(1);\r\n    }\r\n  }\r\n\r\n  componentDidRender() {\r\n    if (this.open && !this.trap) {\r\n      this.createTrap();\r\n    } else if (!this.open && this.trap) {\r\n      this.removeTrap();\r\n    }\r\n  }\r\n\r\n  private toggleOpen = () => {\r\n    this.open = !this.open;\r\n  };\r\n\r\n  private createTrap() {\r\n    this.trap = createFocusTrap(this.host, {\r\n      clickOutsideDeactivates: true,\r\n      escapeDeactivates: true,\r\n      setReturnFocus: this.toggleButtonElementRef,\r\n      tabbableOptions: {\r\n        getShadowRoot: true,\r\n      },\r\n      onDeactivate: () => {\r\n        this.open = false;\r\n      },\r\n    }).activate();\r\n  }\r\n\r\n  private removeTrap() {\r\n    this.trap?.deactivate();\r\n    delete this.trap;\r\n  }\r\n\r\n  private handleTab(direction: number) {\r\n    const elements = this.host.isConnected ? tabbable(this.host, { getShadowRoot: true }) : [];\r\n    const currentIndex = elements.findIndex((e) => e === this.host.shadowRoot?.activeElement);\r\n\r\n    let nextIndex = currentIndex + direction;\r\n    if (nextIndex >= elements.length) {\r\n      nextIndex = 0;\r\n    } else if (nextIndex < 0) {\r\n      nextIndex = elements.length - 1;\r\n    }\r\n\r\n    elements[nextIndex]?.focus();\r\n  }\r\n\r\n  private handleOptionClick = (event: MouseEvent, option: AdvancedSelectOption<never>) => {\r\n    this.dsoChange.emit({ originalEvent: event, option });\r\n    this.open = false;\r\n  };\r\n\r\n  private handleRedirectClick = (event: MouseEvent, redirect: AdvancedSelectGroupRedirect) => {\r\n    this.dsoRedirect.emit({ originalEvent: event, isModifiedEvent: isModifiedEvent(event), redirect });\r\n    this.open = false;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <button\r\n          aria-expanded={this.open.toString()}\r\n          class={clsx([\"active-option\", { open: this.open }])}\r\n          type=\"button\"\r\n          onClick={this.toggleOpen}\r\n          ref={(element) => (this.toggleButtonElementRef = element)}\r\n        >\r\n          <ActiveGroupLabel active={this.active} options={this.options} />\r\n          <span class=\"active-option-label\">{this.active?.label ?? \"Selecteer een optie\"}</span>\r\n          <span class=\"active-option-aside\">\r\n            {this.options.some(\r\n              (optionOrGroup) => \"summaryCounter\" in optionOrGroup && optionOrGroup?.summaryCounter,\r\n            ) && (\r\n              <span class=\"badges\">\r\n                {this.options\r\n                  .filter(\r\n                    (option): option is AdvancedSelectGroup<never> =>\r\n                      \"options\" in option && \"summaryCounter\" in option && !!option?.summaryCounter,\r\n                  )\r\n                  .map((group) => (\r\n                    <dso-badge status={group.variant ?? \"outline\"}>{group.options.length}</dso-badge>\r\n                  ))}\r\n              </span>\r\n            )}\r\n            <dso-icon icon=\"caret-down\"></dso-icon>\r\n          </span>\r\n        </button>\r\n        {this.open && (\r\n          <div class=\"groups-container\">\r\n            <ul class=\"groups\">\r\n              {this.options.map(\r\n                (optionOrGroup) =>\r\n                  (\"options\" in optionOrGroup && (\r\n                    <li class={clsx([\"group\", { [`group-${optionOrGroup.variant}`]: !!optionOrGroup.variant }])}>\r\n                      <p class=\"group-label\">{optionOrGroup.label}</p>\r\n                      <ul class=\"options\">\r\n                        {optionOrGroup.options.map((option) => (\r\n                          <li>\r\n                            <OptionButton\r\n                              option={option}\r\n                              active={this.active}\r\n                              activeHint={this.activeHint}\r\n                              callback={this.handleOptionClick}\r\n                            />\r\n                          </li>\r\n                        ))}\r\n                      </ul>\r\n                      {optionOrGroup.redirect && (\r\n                        <RedirectAnchor\r\n                          redirect={optionOrGroup.redirect}\r\n                          callback={this.handleRedirectClick}\r\n                        ></RedirectAnchor>\r\n                      )}\r\n                    </li>\r\n                  )) ||\r\n                  (\"placeholder\" in optionOrGroup && (\r\n                    <li class=\"group\">\r\n                      <p class=\"group-label\">{optionOrGroup.label}</p>\r\n                      <p class=\"placeholder\">{optionOrGroup.placeholder}</p>\r\n                      {optionOrGroup.redirect && (\r\n                        <RedirectAnchor\r\n                          redirect={optionOrGroup.redirect}\r\n                          callback={this.handleRedirectClick}\r\n                        ></RedirectAnchor>\r\n                      )}\r\n                    </li>\r\n                  )) || (\r\n                    <li>\r\n                      <OptionButton\r\n                        option={optionOrGroup}\r\n                        active={this.active}\r\n                        activeHint={this.activeHint}\r\n                        callback={this.handleOptionClick}\r\n                      />\r\n                    </li>\r\n                  ),\r\n              )}\r\n            </ul>\r\n          </div>\r\n        )}\r\n      </>\r\n    );\r\n  }\r\n}\r\n\r\ninterface OptionButtonProps {\r\n  option: AdvancedSelectOption<never>;\r\n  active: AdvancedSelectOption<never> | undefined;\r\n  activeHint: string | undefined;\r\n  callback: (event: MouseEvent, value: AdvancedSelectOption<never>) => void;\r\n}\r\n\r\nconst OptionButton: FunctionalComponent<OptionButtonProps> = ({ option, active, activeHint, callback }) => (\r\n  <button\r\n    class={clsx([\"option\", { \"option-active\": active === option }])}\r\n    type=\"button\"\r\n    onClick={(e) => callback(e, option)}\r\n  >\r\n    <span class=\"option-label\">{option.label}</span>\r\n    {!!activeHint && active === option && <span class=\"option-hint\">({activeHint})</span>}\r\n  </button>\r\n);\r\n\r\ninterface RedirectAnchorProps {\r\n  redirect: AdvancedSelectGroupRedirect;\r\n  callback: (event: MouseEvent, value: AdvancedSelectGroupRedirect) => void;\r\n}\r\n\r\nconst RedirectAnchor: FunctionalComponent<RedirectAnchorProps> = ({ redirect, callback }) => (\r\n  <a class=\"group-link\" href={redirect.href} onClick={(e) => callback(e, redirect)}>\r\n    {redirect.label}\r\n    <dso-icon icon=\"chevron-right\"></dso-icon>\r\n  </a>\r\n);\r\n\r\ninterface ActiveGroupLabelProps {\r\n  active: AdvancedSelectOption<never> | undefined;\r\n  options: AdvancedSelectOptionOrGroup<never>[];\r\n}\r\n\r\nconst ActiveGroupLabel: FunctionalComponent<ActiveGroupLabelProps> = ({ active, options }) => {\r\n  const group = options.find(\r\n    (optionOrGroup): optionOrGroup is AdvancedSelectGroup<never> =>\r\n      \"options\" in optionOrGroup &&\r\n      !!optionOrGroup.options.find((option) => option === active) &&\r\n      !!optionOrGroup.activeLabel,\r\n  );\r\n\r\n  return group ? (\r\n    <dso-label compact status={group.variant}>\r\n      {group.activeLabel}\r\n    </dso-label>\r\n  ) : undefined;\r\n};\r\n"]}

package/dist/collection/components/alert/alert.js

@@ -33,6 +33,7 @@ export class Alert {
         return {
             "status": {
                 "type": "string",
+                "attribute": "status",
                 "mutable": false,
                 "complexType": {
                     "original": "\"success\" | \"info\" | \"warning\" | \"error\"",
@@ -47,11 +48,11 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "status",
                 "reflect": true
             },
             "roleAlert": {
                 "type": "boolean",
+                "attribute": "role-alert",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -66,11 +67,11 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "role-alert",
                 "reflect": false
             },
             "compact": {
                 "type": "boolean",
+                "attribute": "compact",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -85,11 +86,11 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "compact",
                 "reflect": true
             },
             "closable": {
                 "type": "boolean",
+                "attribute": "closable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -104,7 +105,6 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "closable",
                 "reflect": false,
                 "defaultValue": "false"
             }