@dso-toolkit/core 62.0.0 → 62.2.0

package/dist/esm/loader.js

@@ -3,7 +3,7 @@ export { s as setNonce } from './index-f82ed648.js';
 
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;
-  return bootstrapLazy([["dsot-document-component-demo",[[2,"dsot-document-component-demo",{"showCanvas":[516,"show-canvas"],"jsonFile":[1,"json-file"],"openDefault":[4,"open-default"],"response":[32],"openOrClosed":[32],"openedAnnotation":[32],"filtered":[32],"notApplicable":[32],"activeAnnotationSelectables":[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-toggletip",[[1,"dso-toggletip",{"label":[1],"position":[1],"small":[4],"secondary":[4],"active":[32]}]]],["dso-accordion-section",[[1,"dso-accordion-section",{"handleTitle":[1,"handle-title"],"heading":[1],"handleUrl":[1,"handle-url"],"status":[1],"attachmentCount":[2,"attachment-count"],"icon":[1],"statusDescription":[1,"status-description"],"open":[516],"hasNestedAccordion":[32],"hover":[32]}]]],["dso-header",[[6,"dso-header",{"mainMenu":[16],"useDropDownMenu":[1,"use-drop-down-menu"],"authStatus":[1,"auth-status"],"loginUrl":[1,"login-url"],"logoutUrl":[1,"logout-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]}]]],["dso-map-controls",[[1,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32],"toggleVisibility":[64]}]]],["dso-modal",[[1,"dso-modal",{"fullscreen":[516],"modalTitle":[1,"modal-title"],"role":[1],"showCloseButton":[4,"show-close-button"],"ariaId":[32],"hasFooter":[32]}]]],["dso-pagination",[[1,"dso-pagination",{"totalPages":[2,"total-pages"],"currentPage":[2,"current-page"],"formatHref":[16],"availablePositions":[32]},[[0,"dsoSizeChange","sizeChangeHandler"]]]]],["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-attachments-counter",[[1,"dso-attachments-counter",{"count":[2]}]]],["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"],"showSuggestions":[32],"selectedSuggestion":[32],"notFound":[32],"showLoading":[32]},[[4,"click","onDocumentClick"]]]]],["dso-helpcenter-panel",[[1,"dso-helpcenter-panel",{"label":[1],"url":[1],"visibility":[32],"isOpen":[32],"slideState":[32],"loadIframe":[32]},[[8,"keydown","keyDownListener"]]]]],["dso-image-overlay",[[1,"dso-image-overlay",{"active":[32],"zoomable":[32]},[[2,"load","loadListener"]]]]],["dso-list-button",[[1,"dso-list-button",{"label":[1],"sublabel":[1],"count":[2],"min":[8],"max":[8],"checked":[516],"disabled":[516],"manual":[4],"manualInputWrapperElement":[32],"manualCount":[32]}]]],["dso-table",[[1,"dso-table",{"noModal":[516,"no-modal"],"isResponsive":[516,"is-responsive"],"modalActive":[32],"placeholderHeight":[32]}]]],["dso-accordion",[[1,"dso-accordion",{"variant":[513],"reverseAlign":[516,"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",[[1,"dso-card",{"isSelectable":[516,"is-selectable"],"hasImage":[516,"has-image"],"clickable":[4],"imageShape":[513,"image-shape"]}]]],["dso-card-container",[[1,"dso-card-container",{"mode":[513]}]]],["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":[4],"border":[4],"white":[4],"dropShadow":[4,"drop-shadow"],"step":[2]}]]],["dso-logo",[[1,"dso-logo",{"label":[1],"ribbon":[1]}]]],["dso-progress-bar",[[1,"dso-progress-bar",{"progress":[2],"min":[2],"max":[2]}]]],["dso-viewer-grid",[[1,"dso-viewer-grid",{"mode":[513],"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]}]]],["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]}]]],["dso-progress-indicator",[[1,"dso-progress-indicator",{"label":[1],"size":[513],"block":[4]}]]],["dso-scrollable",[[1,"dso-scrollable",{"scrollPosition":[32],"_setScrollState":[64]}]]],["dso-expandable",[[1,"dso-expandable",{"open":[516],"enableAnimation":[4,"enable-animation"],"minimumHeight":[2,"minimum-height"],"animationReady":[32]}]]],["dso-responsive-element",[[1,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32],"getSize":[64]}]]],["dso-info-button",[[1,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"hover":[32],"setFocus":[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]}]]],["dso-icon",[[1,"dso-icon",{"icon":[1]}]]],["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":[4],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"keyboardFocus":[32],"toggleInfo":[64]}],[1,"dso-info",{"fixed":[516],"active":[516]}]]],["dso-alert_5",[[1,"dso-label",{"compact":[4],"removable":[4],"status":[1],"truncate":[4],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"isTruncated":[32],"labelText":[32],"_truncateLabel":[64]},[[4,"keydown","keyDownListener"]]],[1,"dso-alert",{"status":[1],"roleAlert":[4,"role-alert"]}],[0,"dso-annotation-button",{"identifier":[1],"open":[4]}],[1,"dso-badge",{"status":[1]}],[1,"dso-ozon-content",{"content":[1],"inline":[516],"state":[32]}]]],["dso-annotation-output_3",[[1,"dso-document-component",{"heading":[1],"label":[1],"nummer":[1],"opschrift":[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":[4,"open-annotation"],"alternativeTitle":[1,"alternative-title"],"type":[513],"wijzigactie":[513]}],[4,"dso-annotation-output",{"identifier":[513],"annotationPrefix":[513,"annotation-prefix"],"open":[516]}],[4,"dso-slide-toggle",{"checked":[4],"disabled":[4],"accessibleLabel":[1,"accessible-label"],"labelledbyId":[1,"labelledby-id"],"identifier":[1],"hasVisibleLabel":[32]}]]]], options);
+  return bootstrapLazy([["dsot-document-component-demo",[[2,"dsot-document-component-demo",{"showCanvas":[516,"show-canvas"],"jsonFile":[1,"json-file"],"openDefault":[4,"open-default"],"response":[32],"openOrClosed":[32],"openedAnnotation":[32],"filtered":[32],"notApplicable":[32],"activeAnnotationSelectables":[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-accordion-section",[[1,"dso-accordion-section",{"handleTitle":[1,"handle-title"],"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"],"hover":[32],"focusHandle":[64]}]]],["dso-toggletip",[[1,"dso-toggletip",{"label":[1],"position":[1],"small":[4],"secondary":[4],"active":[32]}]]],["dso-header",[[6,"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]}]]],["dso-map-controls",[[1,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32],"toggleVisibility":[64]}]]],["dso-modal",[[1,"dso-modal",{"fullscreen":[516],"modalTitle":[1,"modal-title"],"role":[1],"showCloseButton":[4,"show-close-button"],"ariaId":[32],"hasFooter":[32]}]]],["dso-pagination",[[1,"dso-pagination",{"totalPages":[2,"total-pages"],"currentPage":[2,"current-page"],"formatHref":[16],"availablePositions":[32]},[[0,"dsoSizeChange","sizeChangeHandler"]]]]],["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-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"],"showSuggestions":[32],"selectedSuggestion":[32],"notFound":[32],"showLoading":[32]},[[4,"click","onDocumentClick"]]]]],["dso-helpcenter-panel",[[1,"dso-helpcenter-panel",{"label":[1],"url":[1],"visibility":[32],"isOpen":[32],"slideState":[32],"loadIframe":[32]},[[8,"keydown","keyDownListener"]]]]],["dso-image-overlay",[[1,"dso-image-overlay",{"active":[32],"zoomable":[32]},[[2,"load","loadListener"]]]]],["dso-list-button",[[1,"dso-list-button",{"label":[1],"sublabel":[1],"count":[2],"min":[8],"max":[8],"checked":[516],"disabled":[516],"manual":[4],"manualInputWrapperElement":[32],"manualCount":[32]}]]],["dso-table",[[1,"dso-table",{"noModal":[516,"no-modal"],"isResponsive":[516,"is-responsive"],"modalActive":[32],"placeholderHeight":[32]}]]],["dso-accordion",[[1,"dso-accordion",{"variant":[513],"reverseAlign":[516,"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",[[1,"dso-card",{"isSelectable":[516,"is-selectable"],"hasImage":[516,"has-image"],"clickable":[4],"imageShape":[513,"image-shape"]}]]],["dso-card-container",[[1,"dso-card-container",{"mode":[513]}]]],["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":[4],"border":[4],"white":[4],"dropShadow":[4,"drop-shadow"],"step":[2]}]]],["dso-logo",[[1,"dso-logo",{"label":[1],"ribbon":[1]}]]],["dso-progress-bar",[[1,"dso-progress-bar",{"progress":[2],"min":[2],"max":[2]}]]],["dso-viewer-grid",[[1,"dso-viewer-grid",{"mode":[513],"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]}]]],["dso-attachments-counter",[[1,"dso-attachments-counter",{"count":[2]}]]],["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]}]]],["dso-progress-indicator",[[1,"dso-progress-indicator",{"label":[1],"size":[513],"block":[4]}]]],["dso-scrollable",[[1,"dso-scrollable",{"scrollPosition":[32],"_setScrollState":[64]}]]],["dso-expandable",[[1,"dso-expandable",{"open":[516],"enableAnimation":[4,"enable-animation"],"minimumHeight":[2,"minimum-height"],"animationReady":[32]}]]],["dso-responsive-element",[[1,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32],"getSize":[64]}]]],["dso-info-button",[[1,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"hover":[32],"setFocus":[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]}]]],["dso-icon",[[1,"dso-icon",{"icon":[1]}]]],["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":[4],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"keyboardFocus":[32],"toggleInfo":[64]}],[1,"dso-info",{"fixed":[516],"active":[516]}]]],["dso-alert_5",[[1,"dso-label",{"compact":[4],"removable":[4],"status":[1],"truncate":[4],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"isTruncated":[32],"labelText":[32],"_truncateLabel":[64]},[[4,"keydown","keyDownListener"]]],[1,"dso-alert",{"status":[1],"roleAlert":[4,"role-alert"]}],[0,"dso-annotation-button",{"identifier":[1],"open":[4]}],[1,"dso-badge",{"status":[1]}],[1,"dso-ozon-content",{"content":[1],"inline":[516],"state":[32]}]]],["dso-annotation-output_3",[[1,"dso-document-component",{"heading":[1],"label":[1],"nummer":[1],"opschrift":[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":[4,"open-annotation"],"alternativeTitle":[1,"alternative-title"],"type":[513],"wijzigactie":[513]}],[4,"dso-annotation-output",{"identifier":[513],"annotationPrefix":[513,"annotation-prefix"],"open":[516]}],[4,"dso-slide-toggle",{"checked":[4],"disabled":[4],"accessibleLabel":[1,"accessible-label"],"labelledbyId":[1,"labelledby-id"],"identifier":[1],"hasVisibleLabel":[32]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/types/components/accordion/components/accordion-section.d.ts

@@ -1,5 +1,5 @@
 import { ComponentInterface, EventEmitter } from "../../../stencil-public-runtime";
-import { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionState, AccordionSectionToggleClickEvent } from "./accordion-section.interfaces";
+import { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionState, AccordionSectionToggleClickEvent, AccordionSectionAnimationStartEvent } from "./accordion-section.interfaces";
 export declare class AccordionSection implements ComponentInterface {
   private accordionState?;
   private sectionBody?;
@@ -37,21 +37,35 @@ export declare class AccordionSection implements ComponentInterface {
    * Set the Accordion Section open.
    */
   open: boolean;
+  /**
+   * Set when this Accordion Section contains or will contain an Accordion.
+   */
   hasNestedAccordion: boolean;
+  /**
+   * Calling this method will set focus to the handle.
+   */
+  focusHandle(): Promise<void>;
   hover: boolean;
+  get containsNestedAccordion(): boolean;
   componentWillLoad(): void;
   get isNeutral(): boolean;
   private scrollIntoView;
   private get accordion();
   private handleClick;
+  private handleExpandableAnimationStart;
   private handleExpandableAnimationEnd;
   /**
    * Emitted when the user activates the toggle button.
    */
   dsoToggleClick: EventEmitter<AccordionSectionToggleClickEvent>;
+  /**
+   * Event emitted when the Accordion Section starts its toggle animation.
+   */
+  dsoAnimationStart: EventEmitter<AccordionSectionAnimationStartEvent>;
   /**
    * Event emitted when the Accordion Section completes its toggle animation.
    */
   dsoAnimationEnd: EventEmitter<AccordionSectionAnimationEndEvent>;
+  private handleElementRef?;
   render(): any;
 }

package/dist/types/components/accordion/components/accordion-section.interfaces.d.ts

@@ -13,11 +13,21 @@ export interface AccordionSectionToggleClickEvent {
    */
   open: boolean;
 }
+export interface AccordionSectionAnimationStartEvent {
+  /**
+   * Helper function to scroll the Accordion Section into view.
+   */
+  scrollIntoView(behavior?: ScrollBehavior): void;
+  /**
+   * Whether or not the Accordion opening or closing.
+   */
+  animation: "opening" | "closing";
+}
 export interface AccordionSectionAnimationEndEvent {
   /**
    * Helper function to scroll the Accordion Section into view.
    */
-  scrollIntoView(): void;
+  scrollIntoView(behavior?: ScrollBehavior): void;
   /**
    * The state of the Accordion Section after animation.
    */

package/dist/types/components/document-component/document-component.d.ts

@@ -1,5 +1,5 @@
 import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
-import { DocumentComponentOpenToggleEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentWijzigactie } from "./document-component.models";
+import { DocumentComponentOpenToggleEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentWijzigactie, DocumentComponentInputType } from "./document-component.models";
 export declare class DocumentComponent implements ComponentInterface {
   /**
    * The heading element to use.
@@ -8,19 +8,19 @@ export declare class DocumentComponent implements ComponentInterface {
   /**
    * The Label XML.
    */
-  label?: string;
+  label?: DocumentComponentInputType;
   /**
    * The Nummer XML.
    */
-  nummer?: string;
+  nummer?: DocumentComponentInputType;
   /**
    * The Opschrift XML.
    */
-  opschrift?: string;
+  opschrift?: DocumentComponentInputType;
   /**
    * The Inhoud XML.
    */
-  inhoud?: string;
+  inhoud?: DocumentComponentInputType;
   /**
    * This boolean attribute indicates whether the children are visible.
    */

package/dist/types/components/document-component/document-component.models.d.ts

@@ -12,3 +12,4 @@ export interface DocumentComponentOzonContentAnchorClickEvent {
   originalEvent: DsoOzonContentCustomEvent<OzonContentAnchorClickEvent>;
   ozonContentAnchorClick: OzonContentAnchorClickEvent;
 }
+export type DocumentComponentInputType = XMLDocument | string;

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

@@ -1,4 +1,6 @@
 import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
+export interface ExpandableAnimationStartEvent {
+}
 export interface ExpandableAnimationEndEvent {
   bodyHeight: number | undefined;
 }
@@ -23,7 +25,11 @@ export declare class Expandable implements ComponentInterface {
   toggleOpen(): void;
   toggleEnableAnimation(enableAnimation: boolean): void;
   /**
-   * Fired when the animation ends. Only when `enableAnimation = true`.
+   * Fired before expanding.
+   */
+  dsoExpandableAnimationStart: EventEmitter<ExpandableAnimationStartEvent>;
+  /**
+   * Fired after expanding.
    */
   dsoExpandableAnimationEnd: EventEmitter<ExpandableAnimationEndEvent>;
   componentDidLoad(): void;

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

@@ -17,13 +17,24 @@ export declare class Header {
    */
   authStatus: "none" | "loggedIn" | "loggedOut";
   /**
-   * When the `authStatus` is `loggedOut` a loginUrl can be provided, the login button will render as an anchor.
+   * When the `authStatus` is `loggedOut` a loginUrl can be provided.
+   * The login button will then render as an anchor.
    */
   loginUrl?: string;
   /**
    * The URL to open when the user activates "logout".
+   * If no URL is specified, a button element is used instead.
    */
   logoutUrl?: string;
+  /**
+   * Show a help-button or link in the header
+   */
+  showHelp?: boolean | undefined;
+  /**
+   * The URL to open when the user activates "help".
+   * If no URL is specified, a button element is used instead.
+   */
+  helpUrl?: string;
   /**
    * The name to show when the user is logged in.
    */

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

@@ -3,7 +3,7 @@ export interface HeaderMenuItem {
   url: string;
   active?: boolean;
 }
-export type HeaderNavigationType = "menuItem" | "profile" | "logout" | "login" | "userHome";
+export type HeaderNavigationType = "menuItem" | "profile" | "logout" | "login" | "userHome" | "help";
 export interface HeaderClickEvent {
   originalEvent: MouseEvent;
   type: HeaderNavigationType;

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

@@ -7,7 +7,7 @@ export declare class Logo implements ComponentInterface {
   label?: string;
   /**
    * The ribbon contains the text for a possible 'sticker' on top of the logo.
-   * Used to clarify status of the page, like 'beta'.
+   * Used to clarify the (non-production) server environment ("int", "kta", "pfm", "pre", or "dmo")
    *
    */
   ribbon?: string;

package/dist/types/components/ozon-content/ozon-content-mapper.d.ts

@@ -1,11 +1,13 @@
 import { JSX } from "../../stencil-public-runtime";
 import { OzonContentContext } from "./ozon-content-context.interface";
+import { OzonContentInputType } from "./ozon-content.interfaces";
 export declare class Mapper {
   private mappers;
   private skip;
   private fallbackNode;
-  private domParser;
+  private domParser?;
   private findMapper;
   mapNodeToJsx(node: Node | Node[] | NodeList, context: OzonContentContext, path: Node[]): JSX.Element;
-  transform(xml: string, context: OzonContentContext): JSX.Element;
+  transform(input: OzonContentInputType | undefined, context: OzonContentContext): JSX.Element;
+  private inputToXmlDocument;
 }

package/dist/types/components/ozon-content/ozon-content.d.ts

@@ -1,11 +1,11 @@
 import { ComponentInterface, EventEmitter, JSX } from "../../stencil-public-runtime";
-import { OzonContentAnchorClickEvent } from "./ozon-content.interfaces";
+import { OzonContentAnchorClickEvent, OzonContentInputType } from "./ozon-content.interfaces";
 import { OzonContentNodeState } from "./ozon-content-node-state.interface";
 export declare class OzonContent implements ComponentInterface {
   /**
    * The XML to be rendered.
    */
-  content: string | undefined;
+  content?: OzonContentInputType;
   /**
    * Setting this property creates dso-ozon-content as inline element instead of a block element.
    */

package/dist/types/components/ozon-content/ozon-content.interfaces.d.ts

@@ -5,3 +5,4 @@ export interface OzonContentAnchorClickEvent {
   documentComponent: string;
   originalEvent: MouseEvent;
 }
+export type OzonContentInputType = XMLDocument | string;

package/dist/types/components/viewer-grid/components/main-panel.d.ts

@@ -9,7 +9,6 @@ export interface ViewerGridMainPanelProps {
   mainPanelHidden: boolean;
   shrinkMain: () => void;
   expandMain: () => void;
-  expandContent: () => void;
   toggleMainPanel: () => void;
   dsoMainSizeChangeAnimationEnd: EventEmitter<ViewerGridChangeSizeAnimationEndEvent>;
 }

package/dist/types/components/viewer-grid/components/sizing-buttons.d.ts

@@ -0,0 +1,10 @@
+import { FunctionalComponent } from "../../../stencil-public-runtime";
+import { ViewerGridPanelSize } from "../viewer-grid.interfaces";
+interface SizingButtonProps {
+  panelLabel: string;
+  size: ViewerGridPanelSize;
+  expand: () => void;
+  shrink: () => void;
+}
+export declare const SizingButtons: FunctionalComponent<SizingButtonProps>;
+export {};

package/dist/types/components/viewer-grid/viewer-grid.d.ts

@@ -6,7 +6,6 @@ import { ViewerGridPanelSize, ViewerGridVdkTab, ViewerGridVrkTab, ViewerGridChan
  * @slot filterpanel
  * @slot overlay
  * @slot document-panel - VDK only
- * @slot main-expanded - VDK only
  */
 export declare class ViewerGrid {
   private mediaCondition;
@@ -111,7 +110,6 @@ export declare class ViewerGrid {
   private emitExpandMain;
   private shrinkDocumentPanel;
   private expandDocumentPanel;
-  private expandContent;
   private toggleMainPanel;
   private changeListener;
   private handleFilterpanelApply;

package/dist/types/components.d.ts

@@ -6,16 +6,16 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { AccordionInternalState, AccordionVariant } from "./components/accordion/accordion.interfaces";
-import { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionState, AccordionSectionToggleClickEvent } from "./components/accordion/components/accordion-section.interfaces";
+import { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionAnimationStartEvent, AccordionSectionState, AccordionSectionToggleClickEvent } from "./components/accordion/components/accordion-section.interfaces";
 import { AnnotationButtonClickEvent } from "./components/annotation-button/annotation-button";
 import { AnnotationOutputCloseEvent } from "./components/annotation-output/annotation-output";
 import { Suggestion } from "./components/autosuggest/autosuggest.interfaces";
 import { DsoCardClickedEvent, ImageShape } from "./components/card/card.interfaces";
 import { CardContainerMode } from "./components/card-container/card-container.interfaces";
 import { DatePickerChangeEvent, DatePickerFocusEvent, DatePickerKeyboardEvent } from "./components/date-picker/date-picker.interfaces";
-import { DocumentComponentOpenToggleEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentWijzigactie } from "./components/document-component/document-component.models";
+import { DocumentComponentInputType, DocumentComponentOpenToggleEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentWijzigactie } from "./components/document-component/document-component.models";
 import { Placement } from "@popperjs/core";
-import { ExpandableAnimationEndEvent } from "./components/expandable/expandable";
+import { ExpandableAnimationEndEvent, ExpandableAnimationStartEvent } from "./components/expandable/expandable";
 import { HeaderEvent, HeaderMenuItem } from "./components/header/header.interfaces";
 import { InfoButtonToggleEvent } from "./components/info-button/info-button.interfaces";
 import { ListButtonChangeEvent, ListButtonSelectedEvent } from "./components/list-button/list-button.interfaces";
@@ -23,7 +23,7 @@ import { BaseLayer, BaseLayerChangeEvent } from "./components/map-base-layers/ma
 import { MapControlsToggleEvent } from "./components/map-controls/map-controls.interfaces";
 import { Overlay, OverlayChangeEvent } from "./components/map-overlays/map-overlays.interfaces";
 import { ModalCloseEvent } from "./components/modal/modal.interfaces";
-import { OzonContentAnchorClickEvent } from "./components/ozon-content/ozon-content.interfaces";
+import { OzonContentAnchorClickEvent, OzonContentInputType } from "./components/ozon-content/ozon-content.interfaces";
 import { PaginationSelectPageEvent } from "./components/pagination/pagination.interfaces";
 import { ResponsiveElementSize } from "./components/responsive-element/responsive-element.interfaces";
 import { DsoScrollEndEvent } from "./components/scrollable/scrollable.interfaces";
@@ -32,16 +32,16 @@ import { SlideToggleActiveEvent } from "./components/slide-toggle/slide-toggle.i
 import { TreeViewItem, TreeViewPointerEvent } from "./components/tree-view/tree-view.interfaces";
 import { ViewerGridActiveTabSwitchEvent, ViewerGridChangeSizeAnimationEndEvent, ViewerGridChangeSizeEvent, ViewerGridCloseOverlayEvent, ViewerGridFilterpanelApplyEvent, ViewerGridFilterpanelCancelEvent, ViewerGridMainExpandEvent, ViewerGridMainToggleEvent, ViewerGridMode, ViewerGridPanelSize, ViewerGridVdkTab, ViewerGridVrkTab } from "./components/viewer-grid/viewer-grid.interfaces";
 export { AccordionInternalState, AccordionVariant } from "./components/accordion/accordion.interfaces";
-export { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionState, AccordionSectionToggleClickEvent } from "./components/accordion/components/accordion-section.interfaces";
+export { AccordionHeading, AccordionSectionAnimationEndEvent, AccordionSectionAnimationStartEvent, AccordionSectionState, AccordionSectionToggleClickEvent } from "./components/accordion/components/accordion-section.interfaces";
 export { AnnotationButtonClickEvent } from "./components/annotation-button/annotation-button";
 export { AnnotationOutputCloseEvent } from "./components/annotation-output/annotation-output";
 export { Suggestion } from "./components/autosuggest/autosuggest.interfaces";
 export { DsoCardClickedEvent, ImageShape } from "./components/card/card.interfaces";
 export { CardContainerMode } from "./components/card-container/card-container.interfaces";
 export { DatePickerChangeEvent, DatePickerFocusEvent, DatePickerKeyboardEvent } from "./components/date-picker/date-picker.interfaces";
-export { DocumentComponentOpenToggleEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentWijzigactie } from "./components/document-component/document-component.models";
+export { DocumentComponentInputType, DocumentComponentOpenToggleEvent, DocumentComponentOzonContentAnchorClickEvent, DocumentComponentToggleAnnotationEvent, DocumentComponentWijzigactie } from "./components/document-component/document-component.models";
 export { Placement } from "@popperjs/core";
-export { ExpandableAnimationEndEvent } from "./components/expandable/expandable";
+export { ExpandableAnimationEndEvent, ExpandableAnimationStartEvent } from "./components/expandable/expandable";
 export { HeaderEvent, HeaderMenuItem } from "./components/header/header.interfaces";
 export { InfoButtonToggleEvent } from "./components/info-button/info-button.interfaces";
 export { ListButtonChangeEvent, ListButtonSelectedEvent } from "./components/list-button/list-button.interfaces";
@@ -49,7 +49,7 @@ export { BaseLayer, BaseLayerChangeEvent } from "./components/map-base-layers/ma
 export { MapControlsToggleEvent } from "./components/map-controls/map-controls.interfaces";
 export { Overlay, OverlayChangeEvent } from "./components/map-overlays/map-overlays.interfaces";
 export { ModalCloseEvent } from "./components/modal/modal.interfaces";
-export { OzonContentAnchorClickEvent } from "./components/ozon-content/ozon-content.interfaces";
+export { OzonContentAnchorClickEvent, OzonContentInputType } from "./components/ozon-content/ozon-content.interfaces";
 export { PaginationSelectPageEvent } from "./components/pagination/pagination.interfaces";
 export { ResponsiveElementSize } from "./components/responsive-element/responsive-element.interfaces";
 export { DsoScrollEndEvent } from "./components/scrollable/scrollable.interfaces";
@@ -74,6 +74,10 @@ export namespace Components {
           * `attachmentCount` takes precedence over `icon`
          */
         "attachmentCount"?: number;
+        /**
+          * Calling this method will set focus to the handle.
+         */
+        "focusHandle": () => Promise<void>;
         /**
           * The title of the handle
          */
@@ -82,6 +86,10 @@ export namespace Components {
           * When set the handle will render as a `<a>`. When undefined it renders as a `<button>`
          */
         "handleUrl"?: string;
+        /**
+          * Set when this Accordion Section contains or will contain an Accordion.
+         */
+        "hasNestedAccordion": boolean;
         /**
           * Which heading element to use.
          */
@@ -315,11 +323,11 @@ export namespace Components {
         /**
           * The Inhoud XML.
          */
-        "inhoud"?: string;
+        "inhoud"?: DocumentComponentInputType;
         /**
           * The Label XML.
          */
-        "label"?: string;
+        "label"?: DocumentComponentInputType;
         /**
           * Marks this Document Component as not-applicable.
          */
@@ -327,7 +335,7 @@ export namespace Components {
         /**
           * The Nummer XML.
          */
-        "nummer"?: string;
+        "nummer"?: DocumentComponentInputType;
         /**
           * This boolean attribute indicates whether the children are visible.
          */
@@ -339,7 +347,7 @@ export namespace Components {
         /**
           * The Opschrift XML.
          */
-        "opschrift"?: string;
+        "opschrift"?: DocumentComponentInputType;
         /**
           * Type of Document Component.
          */
@@ -403,17 +411,25 @@ export namespace Components {
          */
         "authStatus": "none" | "loggedIn" | "loggedOut";
         /**
-          * When the `authStatus` is `loggedOut` a loginUrl can be provided, the login button will render as an anchor.
+          * The URL to open when the user activates "help". If no URL is specified, a button element is used instead.
+         */
+        "helpUrl"?: string;
+        /**
+          * When the `authStatus` is `loggedOut` a loginUrl can be provided. The login button will then render as an anchor.
          */
         "loginUrl"?: string;
         /**
-          * The URL to open when the user activates "logout".
+          * The URL to open when the user activates "logout". If no URL is specified, a button element is used instead.
          */
         "logoutUrl"?: string;
         /**
           * The main menu items.
          */
         "mainMenu"?: HeaderMenuItem[];
+        /**
+          * Show a help-button or link in the header
+         */
+        "showHelp"?: boolean | undefined;
         /**
           * Either have the dropdown menu appear automatically or always.
          */
@@ -562,7 +578,7 @@ export namespace Components {
          */
         "label"?: string;
         /**
-          * The ribbon contains the text for a possible 'sticker' on top of the logo. Used to clarify status of the page, like 'beta'.
+          * The ribbon contains the text for a possible 'sticker' on top of the logo. Used to clarify the (non-production) server environment ("int", "kta", "pfm", "pre", or "dmo")
          */
         "ribbon"?: string;
     }
@@ -623,7 +639,7 @@ export namespace Components {
         /**
           * The XML to be rendered.
          */
-        "content": string | undefined;
+        "content"?: OzonContentInputType;
         /**
           * Setting this property creates dso-ozon-content as inline element instead of a block element.
          */
@@ -1336,6 +1352,10 @@ declare namespace LocalJSX {
           * When set the handle will render as a `<a>`. When undefined it renders as a `<button>`
          */
         "handleUrl"?: string;
+        /**
+          * Set when this Accordion Section contains or will contain an Accordion.
+         */
+        "hasNestedAccordion"?: boolean;
         /**
           * Which heading element to use.
          */
@@ -1348,6 +1368,10 @@ declare namespace LocalJSX {
           * Event emitted when the Accordion Section completes its toggle animation.
          */
         "onDsoAnimationEnd"?: (event: DsoAccordionSectionCustomEvent<AccordionSectionAnimationEndEvent>) => void;
+        /**
+          * Event emitted when the Accordion Section starts its toggle animation.
+         */
+        "onDsoAnimationStart"?: (event: DsoAccordionSectionCustomEvent<AccordionSectionAnimationStartEvent>) => void;
         /**
           * Emitted when the user activates the toggle button.
          */
@@ -1621,11 +1645,11 @@ declare namespace LocalJSX {
         /**
           * The Inhoud XML.
          */
-        "inhoud"?: string;
+        "inhoud"?: DocumentComponentInputType;
         /**
           * The Label XML.
          */
-        "label"?: string;
+        "label"?: DocumentComponentInputType;
         /**
           * Marks this Document Component as not-applicable.
          */
@@ -1633,7 +1657,7 @@ declare namespace LocalJSX {
         /**
           * The Nummer XML.
          */
-        "nummer"?: string;
+        "nummer"?: DocumentComponentInputType;
         /**
           * Emitted when the user activates the annotation button.
          */
@@ -1657,7 +1681,7 @@ declare namespace LocalJSX {
         /**
           * The Opschrift XML.
          */
-        "opschrift"?: string;
+        "opschrift"?: DocumentComponentInputType;
         /**
           * Type of Document Component.
          */
@@ -1711,9 +1735,13 @@ declare namespace LocalJSX {
          */
         "minimumHeight"?: number;
         /**
-          * Fired when the animation ends. Only when `enableAnimation = true`.
+          * Fired after expanding.
          */
         "onDsoExpandableAnimationEnd"?: (event: DsoExpandableCustomEvent<ExpandableAnimationEndEvent>) => void;
+        /**
+          * Fired before expanding.
+         */
+        "onDsoExpandableAnimationStart"?: (event: DsoExpandableCustomEvent<ExpandableAnimationStartEvent>) => void;
         /**
           * Set to `true` to expand the content.
          */
@@ -1725,11 +1753,15 @@ declare namespace LocalJSX {
          */
         "authStatus"?: "none" | "loggedIn" | "loggedOut";
         /**
-          * When the `authStatus` is `loggedOut` a loginUrl can be provided, the login button will render as an anchor.
+          * The URL to open when the user activates "help". If no URL is specified, a button element is used instead.
+         */
+        "helpUrl"?: string;
+        /**
+          * When the `authStatus` is `loggedOut` a loginUrl can be provided. The login button will then render as an anchor.
          */
         "loginUrl"?: string;
         /**
-          * The URL to open when the user activates "logout".
+          * The URL to open when the user activates "logout". If no URL is specified, a button element is used instead.
          */
         "logoutUrl"?: string;
         /**
@@ -1740,6 +1772,10 @@ declare namespace LocalJSX {
           * Emitted when something in the header is selected.  `event.detail.type` indicates the functionality the user pressed. eg. `'login'` or `'menuItem'`
          */
         "onDsoHeaderClick"?: (event: DsoHeaderCustomEvent<HeaderEvent>) => void;
+        /**
+          * Show a help-button or link in the header
+         */
+        "showHelp"?: boolean | undefined;
         /**
           * Either have the dropdown menu appear automatically or always.
          */
@@ -1903,7 +1939,7 @@ declare namespace LocalJSX {
          */
         "label"?: string;
         /**
-          * The ribbon contains the text for a possible 'sticker' on top of the logo. Used to clarify status of the page, like 'beta'.
+          * The ribbon contains the text for a possible 'sticker' on top of the logo. Used to clarify the (non-production) server environment ("int", "kta", "pfm", "pre", or "dmo")
          */
         "ribbon"?: string;
     }
@@ -1983,7 +2019,7 @@ declare namespace LocalJSX {
         /**
           * The XML to be rendered.
          */
-        "content"?: string | undefined;
+        "content"?: OzonContentInputType;
         /**
           * Setting this property creates dso-ozon-content as inline element instead of a block element.
          */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dso-toolkit/core",
-  "version": "62.0.0",
+  "version": "62.2.0",
   "description": "DSO Toolkit Web Components",
   "main": "dist/index.cjs.js",
   "module": "dist/components/index.js",
@@ -25,7 +25,7 @@
     "@types/animejs": "^3.1.7",
     "animejs": "3.2.1",
     "clsx": "^2.0.0",
-    "dso-toolkit": "^62.0.0",
+    "dso-toolkit": "^62.2.0",
     "escape-string-regexp": "^5.0.0",
     "focus-trap": "^7.5.2",
     "popper-max-size-modifier": "^0.2.0",

package/dist/collection/components/accordion/components/handles/element.handle.js

@@ -1,8 +0,0 @@
-import { h } from "@stencil/core";
-export const HandleElement = ({ handleUrl, onClick, open }, children) => {
-  if (handleUrl) {
-    return (h("a", { href: handleUrl, onClick: onClick, "aria-expanded": open ? "true" : "false" }, children));
-  }
-  return (h("button", { type: "button", onClick: onClick, "aria-expanded": open ? "true" : "false" }, children));
-};
-//# sourceMappingURL=element.handle.js.map

package/dist/collection/components/accordion/components/handles/element.handle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"element.handle.js","sourceRoot":"","sources":["../../../../../src/components/accordion/components/handles/element.handle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,CAAC,MAAM,aAAa,GAIrB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,EAAE;EAC9C,IAAI,SAAS,EAAE;IACb,OAAO,CACL,SAAG,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,mBAAiB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,IACzE,QAAQ,CACP,CACL,CAAC;GACH;EAED,OAAO,CACL,cAAQ,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,OAAO,mBAAiB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,IAC3E,QAAQ,CACF,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nexport const HandleElement: FunctionalComponent<{\r\n  handleUrl: string | undefined;\r\n  open: boolean;\r\n  onClick: (e: MouseEvent) => void;\r\n}> = ({ handleUrl, onClick, open }, children) => {\r\n  if (handleUrl) {\r\n    return (\r\n      <a href={handleUrl} onClick={onClick} aria-expanded={open ? \"true\" : \"false\"}>\r\n        {children}\r\n      </a>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <button type=\"button\" onClick={onClick} aria-expanded={open ? \"true\" : \"false\"}>\r\n      {children}\r\n    </button>\r\n  );\r\n};\r\n"]}

package/dist/collection/components/accordion/components/handles/heading.handle.js

@@ -1,15 +0,0 @@
-import { h } from "@stencil/core";
-export const Handle = ({ heading, ref }, children) => {
-  switch (heading) {
-    default:
-    case "h2":
-      return (h("h2", { ref: ref, class: "dso-section-handle" }, children));
-    case "h3":
-      return (h("h3", { ref: ref, class: "dso-section-handle" }, children));
-    case "h4":
-      return (h("h4", { ref: ref, class: "dso-section-handle" }, children));
-    case "h5":
-      return (h("h5", { ref: ref, class: "dso-section-handle" }, children));
-  }
-};
-//# sourceMappingURL=heading.handle.js.map

package/dist/collection/components/accordion/components/handles/heading.handle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"heading.handle.js","sourceRoot":"","sources":["../../../../../src/components/accordion/components/handles/heading.handle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAIvD,MAAM,CAAC,MAAM,MAAM,GAGd,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,EAAE;EAClC,QAAQ,OAAO,EAAE;IACf,QAAQ;IACR,KAAK,IAAI;MACP,OAAO,CACL,UAAI,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,oBAAoB,IACrC,QAAQ,CACN,CACN,CAAC;IACJ,KAAK,IAAI;MACP,OAAO,CACL,UAAI,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,oBAAoB,IACrC,QAAQ,CACN,CACN,CAAC;IACJ,KAAK,IAAI;MACP,OAAO,CACL,UAAI,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,oBAAoB,IACrC,QAAQ,CACN,CACN,CAAC;IACJ,KAAK,IAAI;MACP,OAAO,CACL,UAAI,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,oBAAoB,IACrC,QAAQ,CACN,CACN,CAAC;GACL;AACH,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { AccordionHeading } from \"../accordion-section.interfaces\";\r\n\r\nexport const Handle: FunctionalComponent<{\r\n  heading: AccordionHeading;\r\n  ref: (element: HTMLHeadingElement | undefined) => void;\r\n}> = ({ heading, ref }, children) => {\r\n  switch (heading) {\r\n    default:\r\n    case \"h2\":\r\n      return (\r\n        <h2 ref={ref} class=\"dso-section-handle\">\r\n          {children}\r\n        </h2>\r\n      );\r\n    case \"h3\":\r\n      return (\r\n        <h3 ref={ref} class=\"dso-section-handle\">\r\n          {children}\r\n        </h3>\r\n      );\r\n    case \"h4\":\r\n      return (\r\n        <h4 ref={ref} class=\"dso-section-handle\">\r\n          {children}\r\n        </h4>\r\n      );\r\n    case \"h5\":\r\n      return (\r\n        <h5 ref={ref} class=\"dso-section-handle\">\r\n          {children}\r\n        </h5>\r\n      );\r\n  }\r\n};\r\n"]}