@dso-toolkit/core 43.1.0 → 45.0.0

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

@@ -1,2 +1,2 @@
 import { Header } from "@dso-toolkit/sources";
-export declare function headerTemplate({ logo, subLogo, mainMenu, useDropDownMenu, authStatus, loginUrl, logoutUrl, userProfileUrl, userProfileName, userHomeUrl, onHeaderClick, }: Header): import("lit-html").TemplateResult<1>;
+export declare function headerTemplate({ logo, subLogo, mainMenu, useDropDownMenu, authStatus, loginUrl, logoutUrl, userProfileUrl, userProfileName, userHomeUrl, dsoHeaderClick, }: Header): import("lit-html").TemplateResult<1>;

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

@@ -2,6 +2,6 @@ import { EventEmitter } from '../../stencil-public-runtime';
 export declare class Info {
   fixed?: boolean;
   active?: boolean;
-  close: EventEmitter<MouseEvent>;
+  dsoClose: EventEmitter<MouseEvent>;
   render(): any;
 }

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

@@ -1,3 +1,3 @@
 import { Info } from '@dso-toolkit/sources';
 import { TemplateResult } from 'lit-html';
-export declare function infoTemplate({ fixed, active, richContent, onClose }: Info<TemplateResult>): TemplateResult<1>;
+export declare function infoTemplate({ fixed, active, richContent, dsoClose }: Info<TemplateResult>): TemplateResult<1>;

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

@@ -8,7 +8,7 @@ export declare class InfoButton {
   active?: boolean;
   secondary?: boolean;
   label: string;
-  toggle: EventEmitter<InfoButtonToggleEvent>;
+  dsoToggle: EventEmitter<InfoButtonToggleEvent>;
   setFocus(): Promise<void>;
   private handleToggle;
   render(): any;

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

@@ -1,2 +1,2 @@
 import { InfoButton } from '@dso-toolkit/sources';
-export declare function infoButtonTemplate({ label, active, secondary, onClick }: InfoButton): import("lit-html").TemplateResult<1>;
+export declare function infoButtonTemplate({ label, active, secondary, dsoToggle }: InfoButton): import("lit-html").TemplateResult<1>;

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

@@ -1,6 +1,6 @@
 import { EventEmitter, ComponentInterface } from '../../stencil-public-runtime';
 export declare class Label implements ComponentInterface {
-  private mutationObserver?;
+  private mutationObserver;
   private resizeObserver;
   private labelContent;
   private keydownListenerActive;
@@ -14,7 +14,8 @@ export declare class Label implements ComponentInterface {
   textHover?: boolean;
   textFocus?: boolean;
   truncatedContent?: string | null;
-  removeClick: EventEmitter<MouseEvent>;
+  labelText?: string;
+  dsoRemoveClick: EventEmitter<MouseEvent>;
   watchTruncate(truncate: boolean): void;
   watchTooltipActive(): void;
   private static statusMap;

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

@@ -1,2 +1,2 @@
 import { Label } from '@dso-toolkit/sources';
-export declare function labelTemplate({ status, label, button, compact, truncate, symbol }: Label): import("lit-html").TemplateResult<1>;
+export declare function labelTemplate({ status, label, removable, dsoRemoveClick, compact, truncate, symbol }: Label): import("lit-html").TemplateResult<1>;

package/dist/types/components/map-base-layers/map-base-layers.d.ts

@@ -5,7 +5,7 @@ export declare class MapBaseLayers implements ComponentInterface {
   selectableRefs: {
     [id: number]: HTMLDsoSelectableElement;
   };
-  baseLayerChange: EventEmitter<BaseLayerChangeEvent>;
+  dsoBaseLayerChange: EventEmitter<BaseLayerChangeEvent>;
   group: string;
   baseLayers: BaseLayer[];
   baseLayerChangeHandler(baseLayer: BaseLayer): void;

package/dist/types/components/map-controls/map-controls.d.ts

@@ -1,10 +1,11 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class MapControls {
   #private;
+  private panelTitle;
   open: boolean;
   disableZoom?: 'in' | 'out' | 'both';
-  zoomIn: EventEmitter<MouseEvent>;
-  zoomOut: EventEmitter<MouseEvent>;
+  dsoZoomIn: EventEmitter<MouseEvent>;
+  dsoZoomOut: EventEmitter<MouseEvent>;
   hideContent: boolean;
   watchOpen(open: boolean): void;
   render(): any;

package/dist/types/components/map-controls/map-controls.template.d.ts

@@ -1,2 +1,2 @@
 import { MapControls } from '@dso-toolkit/sources';
-export declare function mapControlsTemplate({ zoomIn, zoomOut, open, baseLayers, baseLayerChange, overlays, toggleOverlay, disableZoom }: MapControls): import("lit-html").TemplateResult<1>;
+export declare function mapControlsTemplate({ dsoZoomIn, dsoZoomOut, open, baseLayers, dsoBaseLayerChange, overlays, dsoToggleOverlay, disableZoom }: MapControls): import("lit-html").TemplateResult<1>;

package/dist/types/components/map-overlays/map-overlays.d.ts

@@ -8,7 +8,7 @@ export declare class MapOverlays implements ComponentInterface {
   };
   group: string;
   overlays: Overlay[];
-  toggleOverlay: EventEmitter<OverlayChangeEvent>;
+  dsoToggleOverlay: EventEmitter<OverlayChangeEvent>;
   overlayChangeHandler(overlay: Overlay, e: CustomEvent<SelectableChangeEvent>): void;
   componentDidRender(): void;
   render(): any;

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

@@ -19,10 +19,14 @@ export declare class OzonContent implements ComponentInterface {
    *
    * **Do not** use this without an accessible companion element! `interactive` is only
    * meant to ease the use of the companion element for mouse/touch users.
+   *
+   * * `true`: Interactive anchor-look-alike
+   * * `"sub"`: Interactive anchor-look-alike for sub navigation
+   * * `false | undefined`: Disabled
    */
-  interactive: boolean;
+  interactive: 'sub' | '' | boolean;
   state: OzonContentNodeState;
-  anchorClick: EventEmitter<OzonContentAnchorClick>;
+  dsoAnchorClick: EventEmitter<OzonContentAnchorClick>;
   /**
    * These events are only emitted when the component is `interactive`.
    */

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

@@ -1,2 +1,2 @@
 import { OzonContent } from '@dso-toolkit/sources';
-export declare function ozonContentTemplate({ content, inline, interactive, deleted, prefix, suffix, onAnchorClick, onClick }: OzonContent): import("lit-html").TemplateResult<1>;
+export declare function ozonContentTemplate({ content, inline, interactive, deleted, prefix, suffix, dsoAnchorClick, dsoClick }: OzonContent): import("lit-html").TemplateResult<1>;

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

@@ -16,7 +16,7 @@ export declare class Pagination implements ComponentInterface {
   /**
    * Emitted on page select
    */
-  selectPage: EventEmitter<PaginationSelectPageEvent>;
+  dsoSelectPage: EventEmitter<PaginationSelectPageEvent>;
   clickHandler(e: MouseEvent, page: number): void;
   render(): any;
 }

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

@@ -1,2 +1,2 @@
 import { Pagination } from '@dso-toolkit/sources';
-export declare function paginationTemplate({ totalPages, currentPage, onSelectPage, formatHref, }: Pagination): import("lit-html").TemplateResult<1>;
+export declare function paginationTemplate({ totalPages, currentPage, dsoSelectPage, formatHref, }: Pagination): import("lit-html").TemplateResult<1>;

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

@@ -13,7 +13,7 @@ export declare class Selectable {
   checked?: boolean;
   indeterminate?: boolean;
   infoFixed?: boolean;
-  change: EventEmitter<SelectableChangeEvent>;
+  dsoChange: EventEmitter<SelectableChangeEvent>;
   host: HTMLElement;
   infoActive: boolean;
   toggleInfo(active?: boolean): Promise<void>;

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

@@ -1,3 +1,3 @@
 import { Selectable } from '@dso-toolkit/sources';
 import { TemplateResult } from 'lit-html';
-export declare function selectableTemplate({ type, id, name, label, value, required, invalid, describedById, checked, indeterminate, disabled, onChange, info }: Selectable<TemplateResult>): TemplateResult<1>;
+export declare function selectableTemplate({ type, id, name, label, value, required, invalid, describedById, checked, indeterminate, disabled, dsoChange, info }: Selectable<TemplateResult>): TemplateResult<1>;

package/dist/types/components/tree-view/tree-view.d.ts

@@ -12,14 +12,14 @@ export declare class TreeView implements ComponentInterface {
    * root to the item that is emitting the open event. The consumer of the event is responsible for updating
    * the TreeView's collection (usually set the open state on the last TreeViewItem in path).
    */
-  openItem: EventEmitter<TreeViewItem[]>;
+  dsoOpenItem: EventEmitter<TreeViewItem[]>;
   /**
    * Emitted when a tree view item is closed.
    * The `detail` property of the `CustomEvent` will contain the complete path of TreeViewItems from the
    * root to the item that is emitting the close event. The consumer of the event is responsible for updating
    * the TreeView's collection (usually set the closed state on the last TreeViewItem in path).
    */
-  closeItem: EventEmitter<TreeViewItem[]>;
+  dsoCloseItem: EventEmitter<TreeViewItem[]>;
   /**
    * Emitted when a tree view item is clicked.
    * The `detail` property of the `CustomEvent` will contain an object with:
@@ -28,7 +28,7 @@ export declare class TreeView implements ComponentInterface {
    * The consumer of the event is responsible for updating the TreeView's collection (usually set the active
    * state on the last TreeViewItem in path and clear all other active item states).
    */
-  clickItem: EventEmitter<TreeViewPointerEvent>;
+  dsoClickItem: EventEmitter<TreeViewPointerEvent>;
   /**
    * Set focus on the last item in the specified path.
    * The consumer is responsible for providing a TreeView collection where the last item is visible.

package/dist/types/components/tree-view/tree-view.template.d.ts

@@ -1,2 +1,2 @@
 import { TreeView } from '@dso-toolkit/sources';
-export declare function treeViewTemplate({ collection, onOpenItem, onCloseItem, onClickItem }: TreeView): import("lit-html").TemplateResult<1>;
+export declare function treeViewTemplate({ collection, dsoOpenItem, dsoCloseItem, dsoClickItem }: TreeView): import("lit-html").TemplateResult<1>;

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

@@ -1,6 +1,9 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { FocusTrap } from "focus-trap";
 export declare type MainSize = "small" | "medium" | "large";
+export declare type LabelSizeMap = {
+  [key in MainSize]: string;
+};
 export interface ViewerGridChangeSizeEvent {
   /**
    * Indicates whether it's before or after the animation
@@ -13,6 +16,7 @@ export interface FilterpanelEvent {
   originalEvent: MouseEvent;
 }
 export declare class ViewerGrid {
+  private sizeLabelMap;
   filterpanelOpen: boolean;
   overlayOpen: boolean;
   /**
@@ -20,10 +24,10 @@ export declare class ViewerGrid {
    */
   initialMainSize: MainSize;
   mainSize: MainSize;
-  closeOverlay: EventEmitter<MouseEvent | KeyboardEvent>;
-  filterpanelCancel: EventEmitter<FilterpanelEvent>;
-  filterpanelApply: EventEmitter<FilterpanelEvent>;
-  mainSizeChange: EventEmitter<ViewerGridChangeSizeEvent>;
+  dsoCloseOverlay: EventEmitter<MouseEvent | KeyboardEvent>;
+  dsoFilterpanelCancel: EventEmitter<FilterpanelEvent>;
+  dsoFilterpanelApply: EventEmitter<FilterpanelEvent>;
+  dsoMainSizeChange: EventEmitter<ViewerGridChangeSizeEvent>;
   host: HTMLElement;
   filterpanel: HTMLElement | undefined;
   filterpanelSlot: HTMLElement | null;

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

@@ -0,0 +1,3 @@
+import { ViewerGrid } from "@dso-toolkit/sources";
+import { TemplateResult } from "lit-html";
+export declare function viewerGridTemplate({ filterpanel, main, map, overlay, filterpanelOpen, overlayOpen, initialMainSize, dsoMainSizeChange, dsoFilterpanelApply, dsoFilterpanelCancel, dsoCloseOverlay, }: ViewerGrid<TemplateResult>): TemplateResult<1>;

package/dist/types/components.d.ts

@@ -52,9 +52,9 @@ export namespace Components {
          */
         "suggestOnFocus": boolean;
         /**
-          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.
+          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.  The value should be null when no suggestions have been fetched.
          */
-        "suggestions": Suggestion[];
+        "suggestions": Suggestion[] | null;
     }
     interface DsoBadge {
         "status"?: 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'outline';
@@ -204,9 +204,9 @@ export namespace Components {
          */
         "inline": boolean;
         /**
-          * Visualize the component as interactive. This means that the component will emit `dsoClick` events when the user clicks non-interactive elements.  **Do not** use this without an accessible companion element! `interactive` is only meant to ease the use of the companion element for mouse/touch users.
+          * Visualize the component as interactive. This means that the component will emit `dsoClick` events when the user clicks non-interactive elements.  **Do not** use this without an accessible companion element! `interactive` is only meant to ease the use of the companion element for mouse/touch users.  * `true`: Interactive anchor-look-alike * `"sub"`: Interactive anchor-look-alike for sub navigation * `false | undefined`: Disabled
          */
-        "interactive": boolean;
+        "interactive": 'sub' | '' | boolean;
     }
     interface DsoPagination {
         /**
@@ -565,9 +565,9 @@ declare namespace LocalJSX {
          */
         "suggestOnFocus"?: boolean;
         /**
-          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.
+          * The suggestions for the value of the slotted input element. Optionally a Suggestion can have a `type` and `item`.  The `type` is used to style the suggestion. `item` can be use to reference the original object that was used to create the suggestion.  The value should be null when no suggestions have been fetched.
          */
-        "suggestions"?: Suggestion[];
+        "suggestions"?: Suggestion[] | null;
     }
     interface DsoBadge {
         "status"?: 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'outline';
@@ -604,14 +604,14 @@ declare namespace LocalJSX {
           * Name of the date picker input.
          */
         "name"?: string;
-        /**
-          * Event emitted when a date is selected.
-         */
-        "onDateChange"?: (event: CustomEvent<DsoDatePickerChangeEvent>) => void;
         /**
           * Event emitted the date picker input is blurred.
          */
         "onDsoBlur"?: (event: CustomEvent<DsoDatePickerFocusEvent>) => void;
+        /**
+          * Event emitted when a date is selected.
+         */
+        "onDsoDateChange"?: (event: CustomEvent<DsoDatePickerChangeEvent>) => void;
         /**
           * Event emitted the date picker input is focused.
          */
@@ -665,7 +665,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when something in the header is selected.  `event.detail.type` indicates the functionality the user pressed. eg. `'login'` or `'menuItem'`
          */
-        "onHeaderClick"?: (event: CustomEvent<HeaderClickEvent | HeaderClickMenuItemEvent>) => void;
+        "onDsoHeaderClick"?: (event: CustomEvent<HeaderClickEvent | HeaderClickMenuItemEvent>) => void;
         "useDropDownMenu"?: "always" | "never" | "auto";
         "userHomeUrl"?: string;
         "userProfileName"?: string;
@@ -690,17 +690,17 @@ declare namespace LocalJSX {
     interface DsoInfo {
         "active"?: boolean;
         "fixed"?: boolean;
-        "onClose"?: (event: CustomEvent<MouseEvent>) => void;
+        "onDsoClose"?: (event: CustomEvent<MouseEvent>) => void;
     }
     interface DsoInfoButton {
         "active"?: boolean;
         "label"?: string;
-        "onToggle"?: (event: CustomEvent<InfoButtonToggleEvent>) => void;
+        "onDsoToggle"?: (event: CustomEvent<InfoButtonToggleEvent>) => void;
         "secondary"?: boolean;
     }
     interface DsoLabel {
         "compact"?: boolean;
-        "onRemoveClick"?: (event: CustomEvent<MouseEvent>) => void;
+        "onDsoRemoveClick"?: (event: CustomEvent<MouseEvent>) => void;
         "removable"?: boolean;
         "status"?: 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'bright';
         "truncate"?: boolean;
@@ -708,17 +708,17 @@ declare namespace LocalJSX {
     interface DsoMapBaseLayers {
         "baseLayers": BaseLayer[];
         "group"?: string;
-        "onBaseLayerChange"?: (event: CustomEvent<BaseLayerChangeEvent>) => void;
+        "onDsoBaseLayerChange"?: (event: CustomEvent<BaseLayerChangeEvent>) => void;
     }
     interface DsoMapControls {
         "disableZoom"?: 'in' | 'out' | 'both';
-        "onZoomIn"?: (event: CustomEvent<MouseEvent>) => void;
-        "onZoomOut"?: (event: CustomEvent<MouseEvent>) => void;
+        "onDsoZoomIn"?: (event: CustomEvent<MouseEvent>) => void;
+        "onDsoZoomOut"?: (event: CustomEvent<MouseEvent>) => void;
         "open"?: boolean;
     }
     interface DsoMapOverlays {
         "group"?: string;
-        "onToggleOverlay"?: (event: CustomEvent<OverlayChangeEvent>) => void;
+        "onDsoToggleOverlay"?: (event: CustomEvent<OverlayChangeEvent>) => void;
         "overlays": Overlay[];
     }
     interface DsoOzonContent {
@@ -735,10 +735,10 @@ declare namespace LocalJSX {
          */
         "inline"?: boolean;
         /**
-          * Visualize the component as interactive. This means that the component will emit `dsoClick` events when the user clicks non-interactive elements.  **Do not** use this without an accessible companion element! `interactive` is only meant to ease the use of the companion element for mouse/touch users.
+          * Visualize the component as interactive. This means that the component will emit `dsoClick` events when the user clicks non-interactive elements.  **Do not** use this without an accessible companion element! `interactive` is only meant to ease the use of the companion element for mouse/touch users.  * `true`: Interactive anchor-look-alike * `"sub"`: Interactive anchor-look-alike for sub navigation * `false | undefined`: Disabled
          */
-        "interactive"?: boolean;
-        "onAnchorClick"?: (event: CustomEvent<OzonContentAnchorClick>) => void;
+        "interactive"?: 'sub' | '' | boolean;
+        "onDsoAnchorClick"?: (event: CustomEvent<OzonContentAnchorClick>) => void;
         /**
           * These events are only emitted when the component is `interactive`.
          */
@@ -756,7 +756,7 @@ declare namespace LocalJSX {
         /**
           * Emitted on page select
          */
-        "onSelectPage"?: (event: CustomEvent<PaginationSelectPageEvent>) => void;
+        "onDsoSelectPage"?: (event: CustomEvent<PaginationSelectPageEvent>) => void;
         /**
           * Total pages
          */
@@ -836,15 +836,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when a tree view item is clicked. The `detail` property of the `CustomEvent` will contain an object with: `path` = the complete path of TreeViewItems from the root to the item that is emitting the clicked event. `originalEvent` = the original click event. The consumer of the event is responsible for updating the TreeView's collection (usually set the active state on the last TreeViewItem in path and clear all other active item states).
          */
-        "onClickItem"?: (event: CustomEvent<TreeViewPointerEvent>) => void;
+        "onDsoClickItem"?: (event: CustomEvent<TreeViewPointerEvent>) => void;
         /**
           * Emitted when a tree view item is closed. The `detail` property of the `CustomEvent` will contain the complete path of TreeViewItems from the root to the item that is emitting the close event. The consumer of the event is responsible for updating the TreeView's collection (usually set the closed state on the last TreeViewItem in path).
          */
-        "onCloseItem"?: (event: CustomEvent<TreeViewItem[]>) => void;
+        "onDsoCloseItem"?: (event: CustomEvent<TreeViewItem[]>) => void;
         /**
           * Emitted when a tree view item is opened. The `detail` property of the `CustomEvent` will contain the complete path of TreeViewItems from the root to the item that is emitting the open event. The consumer of the event is responsible for updating the TreeView's collection (usually set the open state on the last TreeViewItem in path).
          */
-        "onOpenItem"?: (event: CustomEvent<TreeViewItem[]>) => void;
+        "onDsoOpenItem"?: (event: CustomEvent<TreeViewItem[]>) => void;
     }
     interface DsoViewerGrid {
         "filterpanelOpen"?: boolean;
@@ -852,10 +852,10 @@ declare namespace LocalJSX {
           * Size of the main content panel when component loads. Changing this attribute afterwards has no effect.
          */
         "initialMainSize"?: MainSize;
-        "onCloseOverlay"?: (event: CustomEvent<MouseEvent | KeyboardEvent>) => void;
-        "onFilterpanelApply"?: (event: CustomEvent<FilterpanelEvent>) => void;
-        "onFilterpanelCancel"?: (event: CustomEvent<FilterpanelEvent>) => void;
-        "onMainSizeChange"?: (event: CustomEvent<ViewerGridChangeSizeEvent>) => void;
+        "onDsoCloseOverlay"?: (event: CustomEvent<MouseEvent | KeyboardEvent>) => void;
+        "onDsoFilterpanelApply"?: (event: CustomEvent<FilterpanelEvent>) => void;
+        "onDsoFilterpanelCancel"?: (event: CustomEvent<FilterpanelEvent>) => void;
+        "onDsoMainSizeChange"?: (event: CustomEvent<ViewerGridChangeSizeEvent>) => void;
         "overlayOpen"?: boolean;
     }
     interface IntrinsicElements {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dso-toolkit/core",
-  "version": "43.1.0",
+  "version": "45.0.0",
   "description": "DSO Toolkit Web Components",
   "main": "dist/index.cjs.js",
   "module": "dist/custom-elements/index.js",
@@ -17,13 +17,7 @@
   "scripts": {
     "clear": "rimraf dist && rimraf loader",
     "build": "stencil build",
-    "start": "yarn clear && cross-env DSO_ENV=development yarn node scripts/start.js",
-    "watch": "yarn clear && cross-env DSO_ENV=development yarn node scripts/watch.js",
-    "build-www": "cross-env DSO_ENV=production yarn bin_build-storybook --static-dir ./dist,../sources/storybook-assets --output-dir ./www",
-    "bin_stencil": "stencil",
-    "bin_start-storybook": "start-storybook",
-    "bin_cypress": "cypress",
-    "bin_build-storybook": "build-storybook"
+    "watch": "yarn clear && cross-env DSO_ENV=development yarn node scripts/watch.js"
   },
   "dependencies": {
     "@popperjs/core": "^2.11.5",
@@ -37,22 +31,15 @@
   },
   "devDependencies": {
     "@babel/core": "^7.17.9",
+    "@dso-toolkit/css": "0.0.0",
     "@dso-toolkit/sources": "0.0.0",
     "@stencil/react-output-target": "^0.3.1",
     "@stencil/sass": "1.5.2",
-    "@storybook/addon-a11y": "6.5.9",
-    "@storybook/addon-actions": "6.5.9",
-    "@storybook/addon-essentials": "6.5.9",
-    "@storybook/addons": "6.5.9",
-    "@storybook/builder-webpack5": "6.5.9",
-    "@storybook/manager-webpack5": "6.5.9",
-    "@storybook/web-components": "6.5.9",
     "@types/concurrently": "^7.0.0",
     "@types/debounce": "^1.2.1",
     "@types/sass": "^1.43.1",
     "@types/uuid": "^8.3.4",
     "@types/validator": "^13.7.2",
-    "@whitespace/storybook-addon-html": "5.0.0",
     "babel-loader": "^8.2.5",
     "cheerio": "1.0.0-rc.10",
     "concurrently": "^7.1.0",

package/dist/collection/components/anchor/anchor.template.js

@@ -1,17 +0,0 @@
-import { html, nothing } from 'lit-html';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { iconTemplate } from '../icon/icon.template';
-export function anchorTemplate({ icon, iconMode, label, modifier, url }) {
-  return html `<a
-    href=${url}
-    class=${ifDefined(modifier)}
-    target=${ifDefined((modifier === null || modifier === void 0 ? void 0 : modifier.includes('extern')) ? '_blank' : undefined)}
-    rel=${ifDefined((modifier === null || modifier === void 0 ? void 0 : modifier.includes('extern')) ? 'noopener noreferrer' : undefined)}
-  >${icon && iconMode !== 'after'
-    ? iconTemplate(icon)
-    : nothing}${label}${(modifier === null || modifier === void 0 ? void 0 : modifier.includes('extern'))
-    ? html `<span class="sr-only">(Opent andere website in nieuw tabblad)</span>`
-    : nothing}${icon && iconMode === 'after'
-    ? iconTemplate(icon)
-    : nothing}</a>`;
-}

package/dist/collection/components/button/button.template.js

@@ -1,48 +0,0 @@
-import { html, nothing } from 'lit-html';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { iconTemplate } from '../icon/icon.template';
-export function buttonTemplate(button) {
-  return 'url' in button
-    ? anchorElement(button)
-    : buttonElement(button);
-}
-function anchorElement({ url, label, modifier, id, icon, iconMode }) {
-  return html `
-    <a
-      href=${url}
-      class=${ifDefined(modifier)}
-      ?id=${id}
-    >
-      ${icon && !iconMode
-    ? iconTemplate(icon)
-    : nothing}<span class=${ifDefined(iconMode === 'only' ? 'sr-only' : undefined)}>${label}</span>${(modifier === null || modifier === void 0 ? void 0 : modifier.includes('extern'))
-    ? html `<span class="sr-only">(Opent andere website in nieuw tabblad)</span>`
-    : nothing}${icon && iconMode
-    ? iconTemplate(icon)
-    : nothing}
-    </a>
-  `;
-}
-function buttonElement({ variant, label, type, modifier, id, disabled, icon, iconMode, ariaDescribedby, ariaExpanded, ariaHaspopup, ariaRoledescription, onClick }) {
-  type !== null && type !== void 0 ? type : (type = 'button');
-  const className = variant ? `dso-${variant}` : modifier;
-  return html `
-    <button
-      type=${type}
-      id=${ifDefined(id)}
-      class=${ifDefined(className)}
-      ?disabled=${disabled}
-      aria-describedby=${ifDefined(ariaDescribedby)}
-      aria-expanded=${ifDefined(ariaExpanded)}
-      aria-haspopup=${ifDefined(ariaHaspopup)}
-      aria-roledescription=${ifDefined(ariaRoledescription)}
-      @click=${ifDefined(onClick)}
-    >
-      ${icon && !iconMode
-    ? iconTemplate(icon)
-    : nothing}<span class=${ifDefined(iconMode === 'only' ? 'sr-only' : undefined)}>${label}</span>${icon && iconMode
-    ? iconTemplate(icon)
-    : nothing}
-    </button>
-  `;
-}

package/dist/collection/components/context/context.template.js

@@ -1,42 +0,0 @@
-import { html } from 'lit-html';
-function contextLabelTemplate(label, content, children) {
-  return html `
-    <div class="dso-context-wrapper">
-      <span class="dso-context-label">
-        ${label}
-      </span>
-      <div class="dso-context-container">
-        ${content}
-      </div>
-    </div>
-    ${children}
-  `;
-}
-function contextFieldsetTemplate(label, content, children) {
-  return html `
-    <fieldset>
-      <legend class="sr-only">
-        ${label}
-      </legend>
-      <div class="dso-context-wrapper">
-        <span class="dso-context-label" aria-hidden="true">
-          ${label}
-        </span>
-        <div class="dso-context-container">
-          ${content}
-        </div>
-      </div>
-      ${children}
-    </fieldset>
-  `;
-}
-export function contextTemplate({ label, type, content, children }) {
-  switch (type) {
-    case 'label':
-      return contextLabelTemplate(label, content, children);
-    case 'legend':
-      return contextFieldsetTemplate(label, content, children);
-    default:
-      throw new TypeError('type can only be label or legend');
-  }
-}

package/dist/collection/components/definition-list/definition-list.template.js

@@ -1,36 +0,0 @@
-import { html } from 'lit-html';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
-import { listTemplate } from '../list/list.template';
-function definitionTemplate({ term, descriptions }, useSrOnlyColon) {
-  return html `
-    <dt>
-      ${term}${useSrOnlyColon
-    ? html `<span class="sr-only">:</span>`
-    : ':'}
-    </dt>
-    ${descriptions.map(description => html `
-      <dd>${definitionContentTemplate(description)}</dd>
-    `)}
-  `;
-}
-function definitionContentTemplate(description) {
-  if ('content' in description) {
-    if (typeof description.content === 'string') {
-      return unsafeHTML(description.content);
-    }
-    return description.content;
-  }
-  return listTemplate(description.list);
-}
-export function definitionListTemplate({ modifier, definitions, useSrOnlyColon }) {
-  return html `
-    <dl class=${ifDefined(modifier)}>
-      ${definitions.map(definition => (modifier === null || modifier === void 0 ? void 0 : modifier.split(' ').includes('dso-columns'))
-    ? html `
-            <div>${definitionTemplate(definition, useSrOnlyColon)}</div>
-          `
-    : definitionTemplate(definition, useSrOnlyColon))}
-    </dl>
-  `;
-}

package/dist/collection/components/label/label.decorator.js

@@ -1,6 +0,0 @@
-import { html } from 'lit-html';
-export const decorator = (story, css) => html `
-  ${story()}
-
-  <style>${css}</style>
-`;

package/dist/collection/components/label-group/label-group.template.js

@@ -1,7 +0,0 @@
-import { html } from 'lit-html';
-import { labelTemplate } from '../label/label.template';
-export function labelGroupTemplate({ labels }) {
-  return html `<div class="dso-label-group">
-    ${labels.map(labels => labelTemplate(labels))}
-  </div>`;
-}