@dso-toolkit/core 44.0.0 → 45.0.0

package/dist/collection/components/info/info.js

@@ -2,9 +2,9 @@ import { h, Component, Event, Prop, Fragment } from '@stencil/core';
 export class Info {
   render() {
     return (h(Fragment, null,
-      !this.fixed && (h("button", { type: "button", onClick: e => this.close.emit(e) },
-        h("span", { class: "sr-only" }, "Sluiten"))),
-      h("slot", null)));
+      h("slot", null),
+      !this.fixed && (h("button", { type: "button", onClick: e => this.dsoClose.emit(e) },
+        h("span", { class: "sr-only" }, "Sluiten")))));
   }
   static get is() { return "dso-info"; }
   static get encapsulation() { return "shadow"; }
@@ -51,8 +51,8 @@ export class Info {
     }
   }; }
   static get events() { return [{
-      "method": "close",
-      "name": "close",
+      "method": "dsoClose",
+      "name": "dsoClose",
       "bubbles": true,
       "cancelable": true,
       "composed": true,

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

@@ -1,10 +1,10 @@
 import { html } from 'lit-html';
-export function infoTemplate({ fixed, active, richContent, onClose }) {
+export function infoTemplate({ fixed, active, richContent, dsoClose }) {
   return html `
     <dso-info
       ?fixed=${fixed}
       ?active=${active}
-      @close=${onClose}
+      @dsoClose=${dsoClose}
     >
       ${richContent}
     </dso-info>

package/dist/collection/components/info-button/info-button.js

@@ -10,7 +10,7 @@ export class InfoButton {
   }
   handleToggle(e) {
     this.active = !this.active;
-    this.toggle.emit({ originalEvent: e, active: this.active });
+    this.dsoToggle.emit({ originalEvent: e, active: this.active });
   }
   render() {
     return (h("button", { type: "button", class: clsx('btn', { 'dso-open': !!this.active, 'dso-info-secondary': !!this.secondary }), "aria-expanded": typeof this.active === 'boolean' ? this.active.toString() : undefined, onClick: e => this.handleToggle(e), ref: element => (this.button = element) },
@@ -79,8 +79,8 @@ export class InfoButton {
     }
   }; }
   static get events() { return [{
-      "method": "toggle",
-      "name": "toggle",
+      "method": "dsoToggle",
+      "name": "dsoToggle",
       "bubbles": true,
       "cancelable": true,
       "composed": true,

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

@@ -1,11 +1,11 @@
 import { html } from 'lit-html';
-export function infoButtonTemplate({ label, active, secondary, onClick }) {
+export function infoButtonTemplate({ label, active, secondary, dsoToggle }) {
   return html `
     <dso-info-button
       label=${label}
       ?active=${active}
       ?secondary=${secondary}
-      @toggle=${(e) => onClick(e.detail)}
+      @dsoToggle=${(e) => dsoToggle(e.detail)}
     ></dso-info-button>
   `;
 }

package/dist/collection/components/label/label.css

@@ -26,6 +26,7 @@
   color: #191919;
   display: inline-block;
   line-height: 1.5;
+  max-width: 100%;
 }
 .dso-label:not(.dso-label-bright) {
   padding: 4px 8px;

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

@@ -86,7 +86,7 @@ export class Label {
             'dso-truncate': !!this.truncate,
           }), ref: element => this.labelContent = element, tabindex: (this.truncate && this.truncatedContent) ? 0 : -1, onMouseEnter: () => this.textHover = true, onMouseLeave: () => this.textHover = false, onFocus: () => this.textFocus = true, onBlur: () => this.textFocus = false },
           h("slot", null)),
-        this.removable && (h("button", { type: "button", onClick: e => this.removeClick.emit(e), onMouseEnter: () => this.removeHover = true, onMouseLeave: () => this.removeHover = false, onFocus: () => this.removeFocus = true, onBlur: () => this.removeFocus = false },
+        this.removable && (h("button", { type: "button", onClick: e => this.dsoRemoveClick.emit(e), onMouseEnter: () => this.removeHover = true, onMouseLeave: () => this.removeHover = false, onFocus: () => this.removeFocus = true, onBlur: () => this.removeFocus = false },
           h("span", { class: "sr-only" },
             "Verwijder: ",
             this.labelText),
@@ -180,8 +180,8 @@ export class Label {
     "labelText": {}
   }; }
   static get events() { return [{
-      "method": "removeClick",
-      "name": "removeClick",
+      "method": "dsoRemoveClick",
+      "name": "dsoRemoveClick",
       "bubbles": true,
       "cancelable": true,
       "composed": true,

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

@@ -1,11 +1,11 @@
 import { html, nothing } from 'lit-html';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
-export function labelTemplate({ status, label, removable, onRemoveClick, compact, truncate, symbol }) {
+export function labelTemplate({ status, label, removable, dsoRemoveClick, compact, truncate, symbol }) {
   return html `
     <dso-label
       status=${ifDefined(status)}
-      @removeClick=${ifDefined(onRemoveClick)}
+      @dsoRemoveClick=${ifDefined(dsoRemoveClick)}
       ?truncate=${truncate}
       ?compact=${compact}
       ?removable=${removable}

package/dist/collection/components/map-base-layers/map-base-layers.js

@@ -6,7 +6,7 @@ export class MapBaseLayers {
     this.group = uuidv4();
   }
   baseLayerChangeHandler(baseLayer) {
-    this.baseLayerChange.emit({ activeBaseLayer: baseLayer });
+    this.dsoBaseLayerChange.emit({ activeBaseLayer: baseLayer });
   }
   componentDidRender() {
     this.baseLayers
@@ -80,8 +80,8 @@ export class MapBaseLayers {
     }
   }; }
   static get events() { return [{
-      "method": "baseLayerChange",
-      "name": "baseLayerChange",
+      "method": "dsoBaseLayerChange",
+      "name": "dsoBaseLayerChange",
       "bubbles": true,
       "cancelable": true,
       "composed": true,