@dso-toolkit/core 45.0.1 → 45.2.0

package/dist/esm/{index.esm-45465af7.js → index.esm-4510c39e.js}

@@ -1,5 +1,5 @@
 /*!
-* tabbable 5.3.1
+* tabbable 6.0.0
 * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
 */
 var candidateSelectors = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]:not(slot)', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])', 'details>summary:first-of-type', 'details'];
@@ -34,6 +34,12 @@ var getCandidates = function getCandidates(el, includeContainer, filter) {
  * @returns {ShadowRoot|boolean} ShadowRoot if available or boolean indicating if a shadowRoot is attached but not available.
  */
 
+/**
+ * @callback ShadowRootFilter
+ * @param {Element} shadowHostNode the element which contains shadow content
+ * @returns {boolean} true if a shadow root could potentially contain valid candidates.
+ */
+
 /**
  * @typedef {Object} CandidatesScope
  * @property {Element} scope contains inner candidates
@@ -47,6 +53,7 @@ var getCandidates = function getCandidates(el, includeContainer, filter) {
  *  or a boolean stating if it has an undisclosed shadow root
  * @property {(node: Element) => boolean} filter filter candidates
  * @property {boolean} flatten if true then result will flatten any CandidatesScope into the returned list
+ * @property {ShadowRootFilter} shadowRootFilter filter shadow roots;
  */
 
 /**
@@ -89,8 +96,9 @@ var getCandidatesIteratively = function getCandidatesIteratively(elements, inclu
 
       var shadowRoot = element.shadowRoot || // check for an undisclosed shadow
       typeof options.getShadowRoot === 'function' && options.getShadowRoot(element);
+      var validShadowRoot = !options.shadowRootFilter || options.shadowRootFilter(element);
 
-      if (shadowRoot) {
+      if (shadowRoot && validShadowRoot) {
         // add shadow dom scope IIF a shadow root node was given; otherwise, an undisclosed
         //  shadow exists, so look at light dom children as fallback BUT create a scope for any
         //  child candidates found because they're likely slotted elements (elements that are
@@ -201,6 +209,45 @@ var isRadio = function isRadio(node) {
 
 var isNonTabbableRadio = function isNonTabbableRadio(node) {
   return isRadio(node) && !isTabbableRadio(node);
+}; // determines if a node is ultimately attached to the window's document
+
+
+var isNodeAttached = function isNodeAttached(node) {
+  var _nodeRootHost;
+
+  // The root node is the shadow root if the node is in a shadow DOM; some document otherwise
+  //  (but NOT _the_ document; see second 'If' comment below for more).
+  // If rootNode is shadow root, it'll have a host, which is the element to which the shadow
+  //  is attached, and the one we need to check if it's in the document or not (because the
+  //  shadow, and all nodes it contains, is never considered in the document since shadows
+  //  behave like self-contained DOMs; but if the shadow's HOST, which is part of the document,
+  //  is hidden, or is not in the document itself but is detached, it will affect the shadow's
+  //  visibility, including all the nodes it contains). The host could be any normal node,
+  //  or a custom element (i.e. web component). Either way, that's the one that is considered
+  //  part of the document, not the shadow root, nor any of its children (i.e. the node being
+  //  tested).
+  // To further complicate things, we have to look all the way up until we find a shadow HOST
+  //  that is attached (or find none) because the node might be in nested shadows...
+  // If rootNode is not a shadow root, it won't have a host, and so rootNode should be the
+  //  document (per the docs) and while it's a Document-type object, that document does not
+  //  appear to be the same as the node's `ownerDocument` for some reason, so it's safer
+  //  to ignore the rootNode at this point, and use `node.ownerDocument`. Otherwise,
+  //  using `rootNode.contains(node)` will _always_ be true we'll get false-positives when
+  //  node is actually detached.
+  var nodeRootHost = getRootNode(node).host;
+  var attached = !!((_nodeRootHost = nodeRootHost) !== null && _nodeRootHost !== void 0 && _nodeRootHost.ownerDocument.contains(nodeRootHost) || node.ownerDocument.contains(node));
+
+  while (!attached && nodeRootHost) {
+    var _nodeRootHost2;
+
+    // since it's not attached and we have a root host, the node MUST be in a nested shadow DOM,
+    //  which means we need to get the host's host and check if that parent host is contained
+    //  in (i.e. attached to) the document
+    nodeRootHost = getRootNode(nodeRootHost).host;
+    attached = !!((_nodeRootHost2 = nodeRootHost) !== null && _nodeRootHost2 !== void 0 && _nodeRootHost2.ownerDocument.contains(nodeRootHost));
+  }
+
+  return attached;
 };
 
 var isZeroArea = function isZeroArea(node) {
@@ -215,6 +262,11 @@ var isHidden = function isHidden(node, _ref) {
   var displayCheck = _ref.displayCheck,
       getShadowRoot = _ref.getShadowRoot;
 
+  // NOTE: visibility will be `undefined` if node is detached from the document
+  //  (see notes about this further down), which means we will consider it visible
+  //  (this is legacy behavior from a very long way back)
+  // NOTE: we check this regardless of `displayCheck="none"` because this is a
+  //  _visibility_ check, not a _display_ check
   if (getComputedStyle(node).visibility === 'hidden') {
     return true;
   }
@@ -226,7 +278,7 @@ var isHidden = function isHidden(node, _ref) {
     return true;
   }
 
-  if (!displayCheck || displayCheck === 'full') {
+  if (!displayCheck || displayCheck === 'full' || displayCheck === 'legacy-full') {
     if (typeof getShadowRoot === 'function') {
       // figure out if we should consider the node to be in an undisclosed shadow and use the
       //  'non-zero-area' fallback
@@ -257,18 +309,51 @@ var isHidden = function isHidden(node, _ref) {
     } // else, `getShadowRoot` might be true, but all that does is enable shadow DOM support
     //  (i.e. it does not also presume that all nodes might have undisclosed shadows); or
     //  it might be a falsy value, which means shadow DOM support is disabled
-    // didn't find it sitting in an undisclosed shadow (or shadows are disabled) so now we
-    //  can just test to see if it would normally be visible or not
-    // this works wherever the node is: if there's at least one client rect, it's
-    //  somehow displayed; it also covers the CSS 'display: contents' case where the
-    //  node itself is hidden in place of its contents; and there's no need to search
-    //  up the hierarchy either
+    // Since we didn't find it sitting in an undisclosed shadow (or shadows are disabled)
+    //  now we can just test to see if it would normally be visible or not, provided it's
+    //  attached to the main document.
+    // NOTE: We must consider case where node is inside a shadow DOM and given directly to
+    //  `isTabbable()` or `isFocusable()` -- regardless of `getShadowRoot` option setting.
+
+
+    if (isNodeAttached(node)) {
+      // this works wherever the node is: if there's at least one client rect, it's
+      //  somehow displayed; it also covers the CSS 'display: contents' case where the
+      //  node itself is hidden in place of its contents; and there's no need to search
+      //  up the hierarchy either
+      return !node.getClientRects().length;
+    } // Else, the node isn't attached to the document, which means the `getClientRects()`
+    //  API will __always__ return zero rects (this can happen, for example, if React
+    //  is used to render nodes onto a detached tree, as confirmed in this thread:
+    //  https://github.com/facebook/react/issues/9117#issuecomment-284228870)
+    //
+    // It also means that even window.getComputedStyle(node).display will return `undefined`
+    //  because styles are only computed for nodes that are in the document.
+    //
+    // NOTE: THIS HAS BEEN THE CASE FOR YEARS. It is not new, nor is it caused by tabbable
+    //  somehow. Though it was never stated officially, anyone who has ever used tabbable
+    //  APIs on nodes in detached containers has actually implicitly used tabbable in what
+    //  was later (as of v5.2.0 on Apr 9, 2021) called `displayCheck="none"` mode -- essentially
+    //  considering __everything__ to be visible because of the innability to determine styles.
+    //
+    // v6.0.0: As of this major release, the default 'full' option __no longer treats detached
+    //  nodes as visible with the 'none' fallback.__
 
 
-    return !node.getClientRects().length;
+    if (displayCheck !== 'legacy-full') {
+      return true; // hidden
+    } // else, fallback to 'none' mode and consider the node visible
+
   } else if (displayCheck === 'non-zero-area') {
+    // NOTE: Even though this tests that the node's client rect is non-zero to determine
+    //  whether it's displayed, and that a detached node will __always__ have a zero-area
+    //  client rect, we don't special-case for whether the node is attached or not. In
+    //  this mode, we do want to consider nodes that have a zero area to be hidden at all
+    //  times, and that includes attached or not.
     return isZeroArea(node);
-  }
+  } // visible, as far as we can tell, or per current `displayCheck=none` mode, we assume
+  //  it's visible
+
 
   return false;
 }; // form fields (nested) inside a disabled fieldset are not focusable/tabbable
@@ -322,6 +407,18 @@ var isNodeMatchingSelectorTabbable = function isNodeMatchingSelectorTabbable(opt
 
   return true;
 };
+
+var isValidShadowRootTabbable = function isValidShadowRootTabbable(shadowHostNode) {
+  var tabIndex = parseInt(shadowHostNode.getAttribute('tabindex'), 10);
+
+  if (isNaN(tabIndex) || tabIndex >= 0) {
+    return true;
+  } // If a custom element has an explicit negative tabindex,
+  // browsers will not allow tab targeting said element's children.
+
+
+  return false;
+};
 /**
  * @param {Array.<Element|CandidatesScope>} candidates
  * @returns Element[]
@@ -363,7 +460,8 @@ var tabbable = function tabbable(el, options) {
     candidates = getCandidatesIteratively([el], options.includeContainer, {
       filter: isNodeMatchingSelectorTabbable.bind(null, options),
       flatten: false,
-      getShadowRoot: options.getShadowRoot
+      getShadowRoot: options.getShadowRoot,
+      shadowRootFilter: isValidShadowRootTabbable
     });
   } else {
     candidates = getCandidates(el, options.includeContainer, isNodeMatchingSelectorTabbable.bind(null, options));

package/dist/esm/loader.js

@@ -1,4 +1,4 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-1602fde1.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-771c1291.js';
 
 /*
  Stencil Client Patch Esm v2.10.0 | MIT Licensed | https://stenciljs.com
@@ -10,7 +10,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["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-header",[[1,"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"],"showDropDown":[32],"hasSubLogo":[32],"overflowMenuItems":[32]}]]],["dso-label",[[1,"dso-label",{"compact":[4],"removable":[4],"status":[1],"truncate":[4],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"truncatedContent":[32],"labelText":[32]}]]],["dso-toggletip",[[1,"dso-toggletip",{"label":[1],"position":[1],"small":[4],"secondary":[4],"active":[32]}]]],["dso-tree-view",[[1,"dso-tree-view",{"collection":[16],"focusItem":[64]}]]],["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-date-picker",[[2,"dso-date-picker",{"name":[1],"identifier":[1],"disabled":[516],"role":[1],"direction":[1],"required":[4],"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-helpcenter-panel",[[1,"dso-helpcenter-panel",{"label":[1],"url":[1],"visibility":[32],"isOpen":[32],"slideState":[32],"loadIframe":[32]}]]],["dso-image-overlay",[[1,"dso-image-overlay",{"active":[32],"focused":[32],"zoomable":[32]},[[2,"load","loadListener"]]]]],["dso-map-controls",[[1,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32]}]]],["dso-pagination",[[1,"dso-pagination",{"totalPages":[2,"total-pages"],"currentPage":[2,"current-page"],"formatHref":[16]}]]],["dso-viewer-grid",[[1,"dso-viewer-grid",{"filterpanelOpen":[516,"filterpanel-open"],"overlayOpen":[516,"overlay-open"],"initialMainSize":[1,"initial-main-size"],"mainSize":[32]}]]],["dso-alert",[[1,"dso-alert",{"status":[1],"roleAlert":[4,"role-alert"]}]]],["dso-attachments-counter",[[1,"dso-attachments-counter",{"count":[2]}]]],["dso-badge",[[1,"dso-badge",{"status":[1]}]]],["dso-banner",[[1,"dso-banner",{"status":[1]}]]],["dso-highlight-box",[[1,"dso-highlight-box",{"yellow":[4],"border":[4],"white":[4],"dropShadow":[4,"drop-shadow"],"step":[2]}]]],["dso-ozon-content",[[6,"dso-ozon-content",{"content":[1],"inline":[516],"deleted":[516],"interactive":[520],"state":[32]}]]],["dso-progress-bar",[[1,"dso-progress-bar",{"progress":[2],"min":[2],"max":[2]}]]],["dso-responsive-element",[[1,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32]}]]],["dso-dropdown-menu",[[1,"dso-dropdown-menu",{"open":[1540],"dropdownAlign":[1,"dropdown-align"],"checkable":[4]}]]],["dso-progress-indicator",[[1,"dso-progress-indicator",{"label":[1],"size":[1],"block":[4]}]]],["dso-tooltip",[[1,"dso-tooltip",{"descriptive":[516],"position":[1],"strategy":[1],"for":[1],"noArrow":[4,"no-arrow"],"stateless":[4],"small":[4],"active":[1540],"hidden":[32],"activate":[64],"deactivate":[64]},[[0,"click","listenClick"]]]]],["dso-info-button",[[1,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"setFocus":[64]}]]],["dso-info_2",[[6,"dso-selectable",{"type":[1],"identifier":[1],"name":[1],"value":[1],"invalid":[4],"describedById":[1,"described-by-id"],"disabled":[4],"required":[4],"checked":[4],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"toggleInfo":[64]}],[1,"dso-info",{"fixed":[516],"active":[516]}]]],["dso-icon",[[1,"dso-icon",{"icon":[1]}]]]], options);
+  return bootstrapLazy([["dso-icon",[[1,"dso-icon",{"icon":[1]}]]],["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"],"state":[1],"attachmentCount":[2,"attachment-count"],"icon":[1],"status":[1],"open":[1540],"hasNestedSection":[32],"toggleSection":[64]}]]],["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"],"showDropDown":[32],"hasSubLogo":[32],"overflowMenuItems":[32]}]]],["dso-label",[[1,"dso-label",{"compact":[4],"removable":[4],"status":[1],"truncate":[4],"removeHover":[32],"removeFocus":[32],"textHover":[32],"textFocus":[32],"truncatedContent":[32],"labelText":[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-alert",[[1,"dso-alert",{"status":[1],"roleAlert":[4,"role-alert"]}]]],["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-date-picker",[[2,"dso-date-picker",{"name":[1],"identifier":[1],"disabled":[516],"role":[1],"direction":[1],"required":[4],"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-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],"focused":[32],"zoomable":[32]},[[2,"load","loadListener"]]]]],["dso-map-controls",[[1,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32]}]]],["dso-table",[[1,"dso-table",{"noModal":[516,"no-modal"],"isResponsive":[516,"is-responsive"],"modalActive":[32],"placeholderHeight":[32]}]]],["dso-viewer-grid",[[1,"dso-viewer-grid",{"filterpanelOpen":[516,"filterpanel-open"],"overlayOpen":[516,"overlay-open"],"initialMainSize":[1,"initial-main-size"],"mainSize":[32]}]]],["dso-accordion",[[1,"dso-accordion",{"variant":[513],"reverseAlign":[516,"reverse-align"],"allowMultipleOpen":[516,"allow-multiple-open"],"getState":[64],"toggleSection":[64],"closeOpenSections":[64]}]]],["dso-badge",[[1,"dso-badge",{"status":[1]}]]],["dso-banner",[[1,"dso-banner",{"status":[1]}]]],["dso-highlight-box",[[1,"dso-highlight-box",{"yellow":[4],"border":[4],"white":[4],"dropShadow":[4,"drop-shadow"],"step":[2]}]]],["dso-ozon-content",[[6,"dso-ozon-content",{"content":[1],"inline":[516],"deleted":[516],"interactive":[520],"state":[32]}]]],["dso-progress-bar",[[1,"dso-progress-bar",{"progress":[2],"min":[2],"max":[2]}]]],["dso-attachments-counter",[[1,"dso-attachments-counter",{"count":[2]}]]],["dso-dropdown-menu",[[1,"dso-dropdown-menu",{"open":[1540],"dropdownAlign":[1,"dropdown-align"],"checkable":[4]}]]],["dso-responsive-element",[[1,"dso-responsive-element",{"sizeAlias":[32],"sizeWidth":[32],"getSize":[64]}]]],["dso-progress-indicator",[[1,"dso-progress-indicator",{"label":[1],"size":[1],"block":[4]}]]],["dso-tooltip",[[1,"dso-tooltip",{"descriptive":[516],"position":[1],"strategy":[1],"for":[1],"noArrow":[4,"no-arrow"],"stateless":[4],"small":[4],"active":[1540],"hidden":[32],"activate":[64],"deactivate":[64]},[[0,"click","listenClick"]]]]],["dso-info-button",[[1,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1],"hover":[32],"setFocus":[64]}]]],["dso-info_2",[[6,"dso-selectable",{"type":[1],"identifier":[1],"name":[1],"value":[1],"invalid":[4],"describedById":[1,"described-by-id"],"disabled":[4],"required":[4],"checked":[4],"indeterminate":[4],"infoFixed":[4,"info-fixed"],"infoActive":[32],"toggleInfo":[64]}],[1,"dso-info",{"fixed":[516],"active":[516]}]]]], options);
   });
 };
 

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

@@ -0,0 +1,32 @@
+import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
+import { AccordionInterface, AccordionInternalState, AccordionSectionToggleEvent, AccordionVariant } from './accordion.interfaces';
+export declare class Accordion implements ComponentInterface, AccordionInterface {
+  private accordionState;
+  host: HTMLElement;
+  variant?: AccordionVariant;
+  /** Places the chevron at the opposite side. Note: this mode does not display `state`, `attachmentCount` or `status` props on child `<dso-accordion-section>` elements */
+  reverseAlign: boolean;
+  /** Allows multiple sections to be open at the same time. */
+  allowMultipleOpen: boolean;
+  /**
+   * Emitted when a section is toggled.
+   *
+   * `event.detail.originalEvent` contains the original `MouseEvent` when the section is toggled by clicking on the header
+   * `event.detail.section` contains the toggled section and its new opened value.\
+   * `event.detail.sections` contains all `<dso-accordion-section>` elements belonging to this accordion.
+   */
+  dsoToggleSection: EventEmitter<AccordionSectionToggleEvent>;
+  updateVariant(variant?: AccordionVariant): void;
+  updateReverseAlign(reverseAlign: boolean): void;
+  watchAllowMultiple(allowMultipleOpen: boolean): void;
+  getState(): Promise<AccordionInternalState>;
+  /** Toggle a section. Pass the `<dso-accordion-section>` element or the index of the section. */
+  toggleSection(sectionElement: HTMLElement | number, event?: MouseEvent): Promise<void>;
+  /** Closes all sections belonging to this accordion. */
+  closeOpenSections(): Promise<void>;
+  constructor();
+  render(): any;
+  private emitToggleEvent;
+  private isSectionOpen;
+  private controlOpenAttribute;
+}

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

@@ -0,0 +1,20 @@
+export declare type AccordionVariant = 'default' | 'compact' | 'conclusion';
+export declare type AccordionSectionState = 'success' | 'info' | 'warning' | 'danger';
+export declare type AccordionHeading = 'h2' | 'h3' | 'h4' | 'h5';
+export interface AccordionInternalState {
+  variant: AccordionVariant;
+  reverseAlign: boolean;
+}
+export interface AccordionInterface {
+  getState(): Promise<AccordionInternalState>;
+  toggleSection(sectionElement: HTMLElement | number, event?: MouseEvent): Promise<void>;
+}
+export interface AccordionSectionToggleEvent {
+  /** When the section is toggled by clicking in the header the `MouseEvent` is available. */
+  originalEvent?: MouseEvent;
+  section: {
+    element: HTMLElement;
+    open: boolean;
+  };
+  sections: HTMLElement[];
+}

package/dist/types/components/accordion/accordion.template.d.ts

@@ -0,0 +1,2 @@
+import { Accordion } from '@dso-toolkit/sources';
+export declare function accordionTemplate({ variant, reverseAlign, allowMultipleOpen, dsoToggleSection, sections }: Accordion): import("lit-html").TemplateResult<1>;

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

@@ -0,0 +1,25 @@
+import { ComponentInterface } from '../../../stencil-public-runtime';
+import { AccordionHeading, AccordionSectionState } from '../accordion.interfaces';
+export declare class AccordionSection implements ComponentInterface {
+  private accordion?;
+  private accordionState?;
+  host: HTMLElement;
+  handleTitle?: string;
+  heading: AccordionHeading;
+  /** When set the handle will render as a `<a>`. When undefined it renders as a `<button>` */
+  handleUrl?: string;
+  /** `state` takes precedence over `attachmentCount` and `icon` */
+  state?: AccordionSectionState;
+  /** `attachmentCount` takes precedence over `icon` */
+  attachmentCount?: number;
+  icon?: string;
+  status?: string;
+  open: boolean;
+  hasNestedSection: boolean;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  /** Toggle this section */
+  toggleSection(): Promise<void>;
+  private toggle;
+  render(): any;
+}

package/dist/types/components/helpcenter-panel/helpcenter-panel.d.ts

@@ -1,11 +1,22 @@
 export declare class HelpcenterPanel {
+  private iframeUrl?;
+  private trap?;
+  private panelWrapperElement?;
+  private openButtonElement?;
+  private closeButtonElement?;
+  private iframeLoaded;
   label?: string;
   url: string;
   visibility: "visible" | "hidden";
   isOpen: "open" | "close";
   slideState: "open" | "close";
   loadIframe: boolean;
+  watchUrl(url: string): void;
+  watchIsOpen(isOpen: 'open' | 'close'): void;
+  keyDownListener(event: KeyboardEvent): void;
+  createTrap(): void;
   openClick: () => void;
   closeClick: () => void;
+  componentDidRender(): void;
   render(): any;
 }

package/dist/types/components/image-overlay/image-overlay.d.ts

@@ -8,9 +8,12 @@ export declare class ImageOverlay implements ComponentInterface {
   buttonElement: HTMLButtonElement | undefined;
   wrapperElement: HTMLDivElement | undefined;
   trap: FocusTrap | undefined;
+  titelSlot: HTMLElement | null;
+  bijschriftSlot: HTMLElement | null;
   private mutationObserver?;
   private resizeObserver?;
   loadListener(event: Event): void;
+  connectedCallback(): void;
   componentDidLoad(): void;
   disconnectedCallback(): void;
   initZoomableImage(): void;

package/dist/types/components/info-button/info-button.d.ts

@@ -6,6 +6,7 @@ export interface InfoButtonToggleEvent {
 export declare class InfoButton {
   private button?;
   active?: boolean;
+  hover: boolean;
   secondary?: boolean;
   label: string;
   dsoToggle: EventEmitter<InfoButtonToggleEvent>;

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

@@ -1,5 +1,8 @@
+import { OzonContentNodeContext } from '../ozon-content-node-context.interface';
 import { OzonContentNode } from '../ozon-content-node.interface';
 export declare class OzonContentFiguurNode implements OzonContentNode {
   name: string[];
-  render(node: Element): any;
+  setImageDimensions(imageElement: HTMLImageElement, schaal: number): void;
+  onImageLoad(event: Event, schaal?: number): void;
+  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext): any;
 }

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

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

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

@@ -1,6 +1,11 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
+import { ResponsiveElementSize } from '../responsive-element/responsive-element.interfaces';
 import { PaginationSelectPageEvent } from './pagination.interfaces';
 export declare class Pagination implements ComponentInterface {
+  private sizePositionsMap;
+  private responsiveElement?;
+  host: HTMLElement;
+  availablePositions?: number;
   /**
    * Total pages
    */
@@ -17,6 +22,16 @@ export declare class Pagination implements ComponentInterface {
    * Emitted on page select
    */
   dsoSelectPage: EventEmitter<PaginationSelectPageEvent>;
+  /**
+   * Listens to the dsoSizeChange event on Responsive Element
+   */
+  sizeChangeHandler(event: CustomEvent<ResponsiveElementSize>): void;
   clickHandler(e: MouseEvent, page: number): void;
+  componentDidLoad(): void;
   render(): any;
+  private getAvailablePositions;
+  private getPages;
+  private getPageRange;
+  private showEllipsisAfterFirst;
+  private showEllipsisBeforeLast;
 }

package/dist/types/components/responsive-element/responsive-element.d.ts

@@ -1,7 +1,10 @@
-import { ComponentInterface } from '../../stencil-public-runtime';
+import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
+import { ResponsiveElementSize } from './responsive-element.interfaces';
 export declare class ResponsiveElement implements ComponentInterface {
-  sizeAlias: string;
+  sizeAlias: ResponsiveElementSize;
   sizeWidth: number;
+  dsoSizeChange: EventEmitter<ResponsiveElementSize>;
+  getSize(): Promise<ResponsiveElementSize>;
   observer: ResizeObserver;
   host: HTMLElement;
   componentWillLoad(): void;

package/dist/types/components/responsive-element/responsive-element.interfaces.d.ts

@@ -0,0 +1,5 @@
+export declare type ResponsiveElementSize = 'small' | 'medium' | 'large';
+export interface ElementSize {
+  width: number;
+  alias: ResponsiveElementSize;
+}

package/dist/types/components/responsive-element/responsive-element.template.d.ts

@@ -1,3 +1,3 @@
 import { ResponsiveElement } from '@dso-toolkit/sources';
 import { TemplateResult } from 'lit-html';
-export declare function responsiveElementTemplate({ children }: ResponsiveElement<TemplateResult>): TemplateResult<1>;
+export declare function responsiveElementTemplate({ dsoSizeChange }: ResponsiveElement, children: TemplateResult): TemplateResult<1>;

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

@@ -0,0 +1,26 @@
+import { ComponentInterface } from '../../stencil-public-runtime';
+import { TableInterface } from './table.interfaces';
+export declare class Table implements ComponentInterface, TableInterface {
+  private resizeObserver?;
+  private focusTrapElement?;
+  private buttonElement?;
+  private trap?;
+  private labelledbyId;
+  host: HTMLElement;
+  /** Prevents the table being   opened in a modal. */
+  noModal: boolean;
+  /** Indicates whether the table is currently horizontally scrollable */
+  isResponsive: boolean;
+  modalActive: boolean;
+  placeholderHeight?: number;
+  startResponsiveBehavior(): void;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  componentDidRender(): void;
+  disconnectedCallback(): void;
+  render(): any;
+  private openModal;
+  private closeModal;
+  private setFocusTrap;
+  private setResponsiveTable;
+}

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

@@ -0,0 +1,3 @@
+export interface TableInterface {
+  noModal: boolean;
+}

package/dist/types/components/table/table.template.d.ts

@@ -0,0 +1,2 @@
+import { Table } from '@dso-toolkit/sources';
+export declare function tableTemplate({ noModal, content, }: Table): import("lit-html").TemplateResult<1>;