@dso-toolkit/core 32.2.0 → 33.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/dso-autosuggest.cjs.entry.js +7 -71
- package/dist/cjs/dso-date-picker.cjs.entry.js +10 -10
- package/dist/cjs/dso-dropdown-menu.cjs.entry.js +16 -2
- package/dist/cjs/dso-header.cjs.entry.js +101 -0
- package/dist/cjs/dso-info-button.cjs.entry.js +1 -1
- package/dist/cjs/dso-label.cjs.entry.js +1 -1
- package/dist/cjs/dso-map-base-layers.cjs.entry.js +3 -4
- package/dist/cjs/dso-map-controls.cjs.entry.js +2 -2
- package/dist/cjs/dso-map-overlays.cjs.entry.js +5 -8
- package/dist/cjs/dso-toggletip.cjs.entry.js +2 -1
- package/dist/cjs/dso-toolkit.cjs.js +1 -1
- package/dist/cjs/dso-tooltip.cjs.entry.js +168 -75
- package/dist/cjs/dso-tree-view.cjs.entry.js +5 -4
- package/dist/cjs/index-794ad37a.js +72 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/autosuggest/autosuggest.js +19 -1
- package/dist/collection/components/autosuggest/autosuggest.template.js +2 -1
- package/dist/collection/components/date-picker/date-picker.js +10 -10
- package/dist/collection/components/dropdown-menu/dropdown-menu.css +4 -0
- package/dist/collection/components/dropdown-menu/dropdown-menu.js +15 -1
- package/dist/collection/components/header/header.css +439 -0
- package/dist/collection/components/header/header.js +294 -0
- package/dist/collection/components/header/header.template.js +32 -0
- package/dist/collection/components/info-button/info-button.css +1 -0
- package/dist/collection/components/label/label.js +2 -1
- package/dist/collection/components/map-base-layers/map-base-layers.js +6 -27
- package/dist/collection/components/map-controls/map-controls.css +18 -8
- package/dist/collection/components/map-controls/map-controls.js +10 -11
- package/dist/collection/components/map-controls/map-controls.template.js +5 -8
- package/dist/collection/components/map-overlays/map-overlays.js +9 -35
- package/dist/collection/components/toggletip/toggletip.css +4 -0
- package/dist/collection/components/toggletip/toggletip.js +1 -0
- package/dist/collection/components/tooltip/tooltip.css +34 -12
- package/dist/collection/components/tooltip/tooltip.js +19 -4
- package/dist/collection/components/tooltip/tooltip.template.js +3 -5
- package/dist/collection/components/tree-view/tree-item.js +3 -2
- package/dist/collection/components/tree-view/tree-view.css +33 -5
- package/dist/collection/components/tree-view/tree-view.js +11 -11
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +318 -114
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/p-0a08ac9f.entry.js +1 -0
- package/dist/dso-toolkit/p-1805f5b0.js +1 -0
- package/dist/dso-toolkit/p-22bc904d.entry.js +1 -0
- package/dist/dso-toolkit/{p-5665f1ee.entry.js → p-4a78a31b.entry.js} +1 -1
- package/dist/dso-toolkit/p-72e4484a.entry.js +1 -0
- package/dist/dso-toolkit/p-7a043467.entry.js +1 -0
- package/dist/dso-toolkit/{p-e2dc97c4.entry.js → p-984551a8.entry.js} +1 -1
- package/dist/dso-toolkit/{p-12f7e7d7.entry.js → p-99b93d2e.entry.js} +1 -1
- package/dist/dso-toolkit/p-b3e6d377.entry.js +1 -0
- package/dist/dso-toolkit/p-da3be034.entry.js +1 -0
- package/dist/dso-toolkit/p-e814d644.entry.js +1 -0
- package/dist/dso-toolkit/p-ec8b74f7.entry.js +1 -0
- package/dist/dso-toolkit/p-ff767c21.entry.js +1 -0
- package/dist/esm/dso-autosuggest.entry.js +6 -70
- package/dist/esm/dso-date-picker.entry.js +10 -10
- package/dist/esm/dso-dropdown-menu.entry.js +16 -2
- package/dist/esm/dso-header.entry.js +97 -0
- package/dist/esm/dso-info-button.entry.js +1 -1
- package/dist/esm/dso-label.entry.js +1 -1
- package/dist/esm/dso-map-base-layers.entry.js +3 -4
- package/dist/esm/dso-map-controls.entry.js +2 -2
- package/dist/esm/dso-map-overlays.entry.js +5 -8
- package/dist/esm/dso-toggletip.entry.js +2 -1
- package/dist/esm/dso-toolkit.js +1 -1
- package/dist/esm/dso-tooltip.entry.js +168 -75
- package/dist/esm/dso-tree-view.entry.js +5 -4
- package/dist/esm/index-f2bf58ce.js +70 -0
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/autosuggest/autosuggest.d.ts +5 -0
- package/dist/types/components/autosuggest/autosuggest.template.d.ts +1 -1
- package/dist/types/components/dropdown-menu/dropdown-menu.d.ts +1 -0
- package/dist/types/components/header/header.d.ts +36 -0
- package/dist/types/components/header/header.template.d.ts +2 -0
- package/dist/types/components/map-base-layers/map-base-layers.d.ts +3 -4
- package/dist/types/components/map-base-layers/map-base-layers.interfaces.d.ts +5 -1
- package/dist/types/components/map-controls/map-controls.template.d.ts +1 -1
- package/dist/types/components/map-overlays/map-overlays.d.ts +4 -4
- package/dist/types/components/map-overlays/map-overlays.interfaces.d.ts +6 -1
- package/dist/types/components/tooltip/tooltip.d.ts +1 -0
- package/dist/types/components/tree-view/tree-item.d.ts +4 -4
- package/dist/types/components/tree-view/tree-view.d.ts +12 -9
- package/dist/types/components/tree-view/tree-view.interfaces.d.ts +14 -4
- package/dist/types/components/tree-view/tree-view.template.d.ts +1 -1
- package/dist/types/components.d.ts +45 -15
- package/package.json +3 -9
- package/dist/dso-toolkit/p-08427682.entry.js +0 -1
- package/dist/dso-toolkit/p-39dae284.entry.js +0 -1
- package/dist/dso-toolkit/p-759920d0.entry.js +0 -1
- package/dist/dso-toolkit/p-9e9f8bcf.entry.js +0 -1
- package/dist/dso-toolkit/p-ad8f467f.entry.js +0 -1
- package/dist/dso-toolkit/p-e03d7741.entry.js +0 -1
- package/dist/dso-toolkit/p-e4269e02.entry.js +0 -1
- package/dist/dso-toolkit/p-e7700d9e.entry.js +0 -1
|
@@ -243,6 +243,7 @@ let Autosuggest = class extends HTMLElement {
|
|
|
243
243
|
this.__registerHost();
|
|
244
244
|
this.selectEmitter = createEvent(this, "dsoSelect", 7);
|
|
245
245
|
this.changeEmitter = createEvent(this, "dsoChange", 7);
|
|
246
|
+
this.searchEmitter = createEvent(this, "dsoSearch", 7);
|
|
246
247
|
/**
|
|
247
248
|
* The suggestions for the value of the slotted input element
|
|
248
249
|
*/
|
|
@@ -429,9 +430,12 @@ let Autosuggest = class extends HTMLElement {
|
|
|
429
430
|
this.selectFirstSuggestion();
|
|
430
431
|
}
|
|
431
432
|
pickSelectedValue() {
|
|
432
|
-
if (this.selectedSuggestion) {
|
|
433
|
+
if (this.selectedSuggestion && this.showSuggestions) {
|
|
433
434
|
this.selectEmitter.emit(this.selectedSuggestion);
|
|
434
435
|
}
|
|
436
|
+
else {
|
|
437
|
+
this.searchEmitter.emit(this.input.value);
|
|
438
|
+
}
|
|
435
439
|
this.closeSuggestions();
|
|
436
440
|
}
|
|
437
441
|
listboxItemId(suggestion) {
|
|
@@ -741,7 +745,7 @@ const localization = {
|
|
|
741
745
|
]
|
|
742
746
|
};
|
|
743
747
|
|
|
744
|
-
const datePickerCss = "
|
|
748
|
+
const datePickerCss = ".sc-dso-date-picker-h{display:block}.dso-date.sc-dso-date-picker *.sc-dso-date-picker,.dso-date.sc-dso-date-picker *.sc-dso-date-picker::before,.dso-date.sc-dso-date-picker *.sc-dso-date-picker::after{box-sizing:border-box}.dso-date.sc-dso-date-picker{box-sizing:border-box;color:#191919;display:block;font-family:\"Asap\", sans-serif;margin:0;position:relative;text-align:left;width:100%}.dso-date__input.sc-dso-date-picker{display:block;width:100%;height:40px;padding:6px 14px;font-size:16px;line-height:1.5;color:#191919;background-color:#fff;background-image:none;border:1px solid #275937;border-radius:4px;transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s}.dso-date__input.sc-dso-date-picker::-moz-placeholder{color:#666;opacity:1}.dso-date__input.sc-dso-date-picker:-ms-input-placeholder{color:#666}.dso-date__input.sc-dso-date-picker::-webkit-input-placeholder{color:#666}.dso-date__input.sc-dso-date-picker::-ms-expand{background-color:transparent;border:0}.dso-date__input.sc-dso-date-picker:focus{border-color:#275937;outline:0;box-shadow:inset 0 0 0 1px #275937}.dso-date__input[disabled].sc-dso-date-picker,.dso-date__input[readonly].sc-dso-date-picker,fieldset[disabled].sc-dso-date-picker .dso-date__input.sc-dso-date-picker{background-color:#fff;opacity:1}.dso-date__input[disabled].sc-dso-date-picker,fieldset[disabled].sc-dso-date-picker .dso-date__input.sc-dso-date-picker{cursor:default}.dso-date__input[disabled].sc-dso-date-picker{border-color:#e5e5e5;color:#999}.dso-date__input[readonly].sc-dso-date-picker{border-width:1px}.dso-date__input[type=text].sc-dso-date-picker{line-height:40px}.dso-date__input[size].sc-dso-date-picker{width:auto}.dso-date__toggle.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;-webkit-user-select:none;align-items:center;appearance:none;background:transparent;border:0;border-radius:0;border-bottom-right-radius:4px;border-top-right-radius:4px;color:#39870c;cursor:pointer;display:flex;height:38px;justify-content:center;padding:0;position:absolute;right:0;transform:translateY(-50%);top:50%;user-select:none;width:38px;z-index:2}.dso-date__toggle.sc-dso-date-picker:disabled{color:#afcf9d;cursor:pointer}.dso-date__dialog.sc-dso-date-picker{display:flex;right:0;min-width:320px;opacity:0;position:absolute;top:100%;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;visibility:hidden;will-change:transform, opacity, visibility;z-index:600}@media (max-width: 35.9375em){.dso-date__dialog.sc-dso-date-picker{background:rgba(25, 25, 25, 0.5);bottom:0;position:fixed;left:0;right:0;top:0;transform:translateZ(0);transform-origin:bottom center}}.dso-date__dialog.is-left.sc-dso-date-picker{left:auto;right:0;width:auto}.dso-date__dialog.is-active.sc-dso-date-picker{opacity:1;transform:scale(1.0001) translateZ(0) translateY(0);visibility:visible}.dso-date__dialog-content.sc-dso-date-picker{background:#fff;border:1px solid rgba(0, 0, 0, 0.1);border-radius:4px;box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);margin-left:auto;margin-right:-1px;margin-top:8px;max-width:310px;min-width:290px;padding:16px;position:relative;transform:none;width:100%;z-index:600}@media (max-width: 35.9375em){.dso-date__dialog-content.sc-dso-date-picker{border:0;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px;bottom:0;left:0;margin:0;max-width:none;min-height:26em;opacity:0;padding:0 8% 20px;position:absolute;transform:translateZ(0) translateY(100%);transition:transform 400ms ease, opacity 400ms ease, visibility 400ms ease;visibility:hidden;will-change:transform, opacity, visibility}.is-active.sc-dso-date-picker .dso-date__dialog-content.sc-dso-date-picker{opacity:1;transform:translateZ(0) translateY(0);visibility:visible}}.dso-date__table.sc-dso-date-picker{border-collapse:collapse;border-spacing:0;color:#191919;font-size:1rem;font-weight:400;line-height:1.25;min-width:280px;table-layout:fixed;text-align:center;width:100%}.dso-date__table-header.sc-dso-date-picker{font-size:0.875em;font-weight:600;height:36px;line-height:36px;text-decoration:none;text-transform:uppercase}.dso-date__cell.sc-dso-date-picker{height:40px;padding:1px;text-align:center;width:40px}.dso-date__day.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;box-shadow:0 0 0 1px transparent;color:#191919;cursor:pointer;display:inline-block;font-family:\"Asap\", sans-serif;font-variant-numeric:tabular-nums;font-weight:400;height:38px;line-height:0;padding:0;position:relative;text-align:center;vertical-align:middle;width:38px;z-index:1}.dso-date__day.is-today.sc-dso-date-picker{background:transparent;height:36px;box-shadow:0 0 0 1px #39870c;width:36px}.dso-date__day.sc-dso-date-picker:hover,.dso-date__day.sc-dso-date-picker:active{background:#39870c;color:#fff}.dso-date__day.sc-dso-date-picker:focus{background:transparent;box-shadow:0 0 0 2px #275937;color:#191919;height:34px;outline:0;width:34px}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker{background:#39870c;color:#fff}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker:focus{background:transparent}[aria-selected=true].sc-dso-date-picker .dso-date__day.sc-dso-date-picker:focus span[aria-hidden=true].sc-dso-date-picker{background:#39870c;border:1px solid #fff;line-height:32px}.dso-date__day.is-outside.sc-dso-date-picker{background:#f2f2f2;box-shadow:none;color:#666;cursor:default;pointer-events:none}.dso-date__day.is-disabled.sc-dso-date-picker{background:#fff;cursor:default}.dso-date__day.is-disabled.sc-dso-date-picker:hover{color:#666}.dso-date__day.sc-dso-date-picker span[aria-hidden=true].sc-dso-date-picker{border-radius:50%;display:inline-block;height:34px;line-height:34px;width:34px}.dso-date__header.sc-dso-date-picker{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px;width:100%}.dso-date__header.sc-dso-date-picker span.sc-dso-date-picker{font-size:0.875rem}.dso-date__nav.sc-dso-date-picker{white-space:nowrap}.dso-date__prev.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker{-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:transparent;border:1px solid #39870c;border-radius:4px;box-sizing:border-box;color:#39870c;cursor:pointer;display:inline-flex;font-size:1em;height:32px;justify-content:center;margin-left:8px;padding:0;width:32px}@media (max-width: 35.9375em){.dso-date__prev.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker{height:40px;width:40px}}.dso-date__prev.sc-dso-date-picker:hover,.dso-date__prev.sc-dso-date-picker:active,.dso-date__next.sc-dso-date-picker:hover,.dso-date__next.sc-dso-date-picker:active{background-color:#39870c;color:#fff}.dso-date__prev.sc-dso-date-picker:focus,.dso-date__next.sc-dso-date-picker:focus{background:transparent;color:#39870c}.dso-date__prev.sc-dso-date-picker:disabled,.dso-date__prev.sc-dso-date-picker:disabled:hover,.dso-date__next.sc-dso-date-picker:disabled,.dso-date__next.sc-dso-date-picker:disabled:hover{background-color:#fff;border-color:#afcf9d;color:#afcf9d;opacity:1}.dso-date__prev.sc-dso-date-picker svg.sc-dso-date-picker,.dso-date__next.sc-dso-date-picker svg.sc-dso-date-picker{margin:0 auto}.dso-date__select.sc-dso-date-picker{display:inline-flex;height:28px;line-height:28px;position:relative}.dso-date__select.sc-dso-date-picker span.sc-dso-date-picker{margin-right:4px}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker{color:#275937;cursor:pointer;font-size:1rem;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker:focus+.dso-date__select-label.sc-dso-date-picker{box-shadow:0 0 0 2px #275937}.dso-date__select.sc-dso-date-picker select.sc-dso-date-picker:disabled{color:#afcf9d}.dso-date__select-label.sc-dso-date-picker{align-items:center;border-radius:4px;color:#39870c;display:flex;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:1}.dso-date__select-label.sc-dso-date-picker span.sc-dso-date-picker{font-size:1.25rem;font-weight:600;line-height:1.25}.dso-date__select-label.sc-dso-date-picker svg.sc-dso-date-picker{width:16px;height:16px}.dso-date__mobile.sc-dso-date-picker{align-items:center;border-bottom:1px solid rgba(0, 0, 0, 0.12);display:flex;font-size:1em;justify-content:space-between;margin-bottom:20px;margin-left:-10%;overflow:hidden;padding:12px 20px;position:relative;text-overflow:ellipsis;white-space:nowrap;width:120%}@media (min-width: 36em){.dso-date__mobile.sc-dso-date-picker{border:0;margin:0;overflow:visible;padding:0;position:absolute;right:-16px;top:-16px;width:auto}}.dso-date__mobile-heading.sc-dso-date-picker{display:inline-block;font-weight:600;max-width:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 36em){.dso-date__mobile-heading.sc-dso-date-picker{display:none}}.dso-date__close.sc-dso-date-picker{-webkit-appearance:none;align-items:center;appearance:none;background-color:#fff;border:0;border-radius:50%;color:#39870c;cursor:pointer;display:flex;font-size:1em;height:32px;justify-content:center;margin-right:-4px;padding:0;width:32px}@media (min-width: 36em){.dso-date__close.sc-dso-date-picker{margin-right:0;opacity:0}}.dso-date__close.sc-dso-date-picker:focus{box-shadow:0 0 0 2px #275937;outline:none}@media (min-width: 36em){.dso-date__close.sc-dso-date-picker:focus{opacity:1}}.dso-date__vhidden.sc-dso-date-picker{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}";
|
|
745
749
|
|
|
746
750
|
function range(from, to) {
|
|
747
751
|
var result = [];
|
|
@@ -769,7 +773,6 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
769
773
|
constructor() {
|
|
770
774
|
super();
|
|
771
775
|
this.__registerHost();
|
|
772
|
-
attachShadow(this);
|
|
773
776
|
this.dateChange = createEvent(this, "dateChange", 7);
|
|
774
777
|
this.dsoBlur = createEvent(this, "dsoBlur", 7);
|
|
775
778
|
this.dsoKeyUp = createEvent(this, "dsoKeyUp", 7);
|
|
@@ -977,8 +980,7 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
977
980
|
};
|
|
978
981
|
this.handleInputChange = (e) => {
|
|
979
982
|
const target = e.target;
|
|
980
|
-
|
|
981
|
-
this.setValue(target.value);
|
|
983
|
+
this.setValue(target.value.replace(DISALLOWED_CHARACTERS, ""));
|
|
982
984
|
};
|
|
983
985
|
this.processFocusedDayNode = (element) => {
|
|
984
986
|
this.focusedDayNode = element;
|
|
@@ -991,13 +993,12 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
991
993
|
* Component event handling.
|
|
992
994
|
*/
|
|
993
995
|
handleDocumentClick(e) {
|
|
994
|
-
var _a;
|
|
995
996
|
if (!this.open) {
|
|
996
997
|
return;
|
|
997
998
|
}
|
|
998
999
|
const path = e.composedPath();
|
|
999
1000
|
for (const target of path) {
|
|
1000
|
-
if (target instanceof Node &&
|
|
1001
|
+
if (target instanceof Node && this.element.contains(target)) {
|
|
1001
1002
|
return;
|
|
1002
1003
|
}
|
|
1003
1004
|
}
|
|
@@ -1084,10 +1085,7 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
1084
1085
|
event.valueAsDate = parseDutchDate(value);
|
|
1085
1086
|
}
|
|
1086
1087
|
if (event.valueAsDate) {
|
|
1087
|
-
event.value =
|
|
1088
|
-
}
|
|
1089
|
-
else {
|
|
1090
|
-
this.value = "";
|
|
1088
|
+
event.value = printDutchDate(event.valueAsDate);
|
|
1091
1089
|
}
|
|
1092
1090
|
if (!event.valueAsDate && this.required) {
|
|
1093
1091
|
event.error = "required";
|
|
@@ -1095,9 +1093,14 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
1095
1093
|
if (event.value && !event.valueAsDate) {
|
|
1096
1094
|
event.error = "invalid";
|
|
1097
1095
|
}
|
|
1096
|
+
this.value = event.value;
|
|
1098
1097
|
this.dateChange.emit(event);
|
|
1099
1098
|
}
|
|
1100
1099
|
componentDidLoad() {
|
|
1100
|
+
const valueAsDate = parseDutchDate(this.value);
|
|
1101
|
+
if (valueAsDate) {
|
|
1102
|
+
this.value = printDutchDate(valueAsDate);
|
|
1103
|
+
}
|
|
1101
1104
|
if (this.dsoAutofocus) {
|
|
1102
1105
|
this.setFocus();
|
|
1103
1106
|
}
|
|
@@ -1124,7 +1127,7 @@ let DsoDatePicker$1 = class extends HTMLElement {
|
|
|
1124
1127
|
if (maxDate) {
|
|
1125
1128
|
maxYear = Math.min(maxYear, maxDate.getFullYear());
|
|
1126
1129
|
}
|
|
1127
|
-
return (h(Host, null, h("div", { class: "dso-date" }, h("div", { class: "dso-date__input-wrapper" }, h("input", { class: "dso-date__input", value:
|
|
1130
|
+
return (h(Host, null, h("div", { class: "dso-date" }, h("div", { class: "dso-date__input-wrapper" }, h("input", { class: "dso-date__input", value: this.value, placeholder: this.localization.placeholder, id: this.identifier, disabled: this.disabled, role: this.role, required: this.required ? true : undefined, "aria-autocomplete": "none", onInput: this.handleInputChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, autoComplete: "off", ref: element => (this.datePickerInput = element) }), h("button", { type: "button", class: "dso-date__toggle", onClick: this.toggleOpen, disabled: this.disabled, ref: element => (this.datePickerButton = element) }, h("span", { class: "dso-date__toggle-icon" }, h("dso-icon", { icon: "calendar" })), h("span", { class: "dso-date__vhidden" }, this.localization.buttonLabel, formattedDate && (h("span", null, ", ", this.localization.selectedDateMessage, " ", formattedDate))))), h("div", { class: {
|
|
1128
1131
|
"dso-date__dialog": true,
|
|
1129
1132
|
"is-left": this.direction === "left",
|
|
1130
1133
|
"is-active": this.open,
|
|
@@ -1359,7 +1362,7 @@ var tabbable = function tabbable(el, options) {
|
|
|
1359
1362
|
return tabbableNodes;
|
|
1360
1363
|
};
|
|
1361
1364
|
|
|
1362
|
-
const dropdownMenuCss = ":host{--di-check-wit:url(\"data:image/svg+xml,%3csvg id='check' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M10.11%2c18%2c5.29%2c13.31A.92.92%2c0%2c0%2c1%2c5.3%2c12a1%2c1%2c0%2c0%2c1%2c1.41%2c0l3.4%2c3.3%2c7.18-7a1%2c1%2c0%2c0%2c1%2c1.41%2c0%2c.92.92%2c0%2c0%2c1%2c0%2c1.35Z'/%3e %3c/svg%3e\");--di-chevron-down:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-down-scampi:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23676cb0%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-down-wit:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-up:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");--di-chevron-up-scampi:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23676cb0%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");--di-chevron-up-wit:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");display:inline-block;position:relative}";
|
|
1365
|
+
const dropdownMenuCss = ":host(:focus){outline:none}:host{--di-check-wit:url(\"data:image/svg+xml,%3csvg id='check' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M10.11%2c18%2c5.29%2c13.31A.92.92%2c0%2c0%2c1%2c5.3%2c12a1%2c1%2c0%2c0%2c1%2c1.41%2c0l3.4%2c3.3%2c7.18-7a1%2c1%2c0%2c0%2c1%2c1.41%2c0%2c.92.92%2c0%2c0%2c1%2c0%2c1.35Z'/%3e %3c/svg%3e\");--di-chevron-down:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-down-scampi:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23676cb0%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-down-wit:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-up:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");--di-chevron-up-scampi:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23676cb0%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");--di-chevron-up-wit:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");display:inline-block;position:relative}";
|
|
1363
1366
|
|
|
1364
1367
|
let DropdownMenu = class extends HTMLElement {
|
|
1365
1368
|
constructor() {
|
|
@@ -1470,6 +1473,7 @@ let DropdownMenu = class extends HTMLElement {
|
|
|
1470
1473
|
}
|
|
1471
1474
|
}
|
|
1472
1475
|
openPopup() {
|
|
1476
|
+
this.host.setAttribute("tabindex", "-1");
|
|
1473
1477
|
this.host.addEventListener("keydown", this.keyDownListener);
|
|
1474
1478
|
this.host.addEventListener("focusout", this.focusOutListener);
|
|
1475
1479
|
this.button.setAttribute("aria-expanded", "true");
|
|
@@ -1479,11 +1483,24 @@ let DropdownMenu = class extends HTMLElement {
|
|
|
1479
1483
|
this.host.removeEventListener("keydown", this.keyDownListener);
|
|
1480
1484
|
this.host.removeEventListener("focusout", this.focusOutListener);
|
|
1481
1485
|
this.button.setAttribute("aria-expanded", "false");
|
|
1486
|
+
this.host.removeAttribute("tabindex");
|
|
1482
1487
|
this.tabbables.forEach((tabbable) => tabbable.removeEventListener("click", this.escape));
|
|
1483
1488
|
}
|
|
1489
|
+
getActiveElement(root = document) {
|
|
1490
|
+
const activeEl = root.activeElement;
|
|
1491
|
+
if (!activeEl) {
|
|
1492
|
+
return null;
|
|
1493
|
+
}
|
|
1494
|
+
if (activeEl.shadowRoot) {
|
|
1495
|
+
return this.getActiveElement(activeEl.shadowRoot);
|
|
1496
|
+
}
|
|
1497
|
+
else {
|
|
1498
|
+
return activeEl;
|
|
1499
|
+
}
|
|
1500
|
+
}
|
|
1484
1501
|
tabInPopup(direction) {
|
|
1485
1502
|
const tabs = this.tabbables;
|
|
1486
|
-
const currentIndex = tabs.findIndex((e) => e ===
|
|
1503
|
+
const currentIndex = tabs.findIndex((e) => e === this.getActiveElement());
|
|
1487
1504
|
let nextIndex = currentIndex + direction;
|
|
1488
1505
|
if (nextIndex >= tabs.length) {
|
|
1489
1506
|
nextIndex = 0;
|
|
@@ -1503,6 +1520,100 @@ let DropdownMenu = class extends HTMLElement {
|
|
|
1503
1520
|
static get style() { return dropdownMenuCss; }
|
|
1504
1521
|
};
|
|
1505
1522
|
|
|
1523
|
+
const headerCss = ":host{--di-chevron-down-bosgroen:url(\"data:image/svg+xml,%3csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23275937%3b'%3e %3cpath fill='currentColor' d='M12%2c16%2c5.29%2c9.63a.93.93%2c0%2c0%2c1%2c0-1.35%2c1%2c1%2c0%2c0%2c1%2c1.42%2c0l5.29%2c5%2c5.29-5a1%2c1%2c0%2c0%2c1%2c1.42%2c0%2c.91.91%2c0%2c0%2c1%2c0%2c1.34Z'/%3e %3c/svg%3e\");--di-chevron-up-bosgroen:url(\"data:image/svg+xml,%3csvg id='chevron-up' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23275937%3b'%3e %3cpath fill='currentColor' d='M18%2c16a1%2c1%2c0%2c0%2c1-.71-.28l-5.29-5-5.29%2c5a1%2c1%2c0%2c0%2c1-1.42%2c0%2c.93.93%2c0%2c0%2c1%2c0-1.35L12%2c8l6.71%2c6.38a.91.91%2c0%2c0%2c1%2c0%2c1.34A1%2c1%2c0%2c0%2c1%2c18%2c16Z'/%3e %3c/svg%3e\");display:block}.dso-header{border-bottom:1px solid #ccc;display:flex;flex-wrap:wrap}@media screen and (min-width: 768px){.dso-header{align-items:center}}@media screen and (max-width: 991px){.dso-header.use-drop-down{flex-wrap:nowrap}}.logo-container{display:flex;flex-wrap:wrap;padding-bottom:16px;padding-top:16px}@media screen and (min-width: 768px){.sub-logo{margin-left:24px}}@media screen and (max-width: 767px){.sub-logo{flex-basis:100%}}.login,.logout{margin-right:16px}.profile a,.logout a,.login a{text-decoration:none;color:#39870c;font-weight:600}.profile a:hover,.profile a:focus,.logout a:hover,.logout a:focus,.login a:hover,.login a:focus{text-decoration:none}.profile a:active,.logout a:active,.login a:active{text-decoration:underline}.dso-header-session{display:flex;margin-left:auto}.dso-header-session .profile a{margin-left:8px}.dso-header-session .profile+.logout{border-left:3px solid #ccc;margin-left:16px;padding-left:16px}.dso-navbar{flex-basis:100%}dso-dropdown-menu>.dso-primary::after,dso-dropdown-menu>.dso-secondary::after,dso-dropdown-menu>.dso-tertiary::after,dso-dropdown-menu>.btn::after{content:\"\";display:inline-block;margin-left:8px}dso-dropdown-menu>.dso-primary::after,dso-dropdown-menu>.btn-primary::after{background:var(--dso-icon, var(--di-chevron-down-wit)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}dso-dropdown-menu>.dso-secondary::after,dso-dropdown-menu>.btn-default::after{background:var(--dso-icon, var(--di-chevron-down)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}dso-dropdown-menu>.dso-secondary:hover::after,dso-dropdown-menu>.btn-default:hover::after{--dso-icon:var(--di-chevron-down-wit)}dso-dropdown-menu>.dso-tertiary::after,dso-dropdown-menu>.btn-link::after{background:var(--dso-icon, var(--di-chevron-down)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em;position:relative;top:-2px}dso-dropdown-menu>.dso-tertiary:hover::after,dso-dropdown-menu>.btn-link:hover::after{--dso-icon:var(--di-chevron-down-scampi)}dso-dropdown-menu .dso-group-label{color:#999;font-size:0.875em;font-weight:400;margin:0;padding:4px 20px 2px;text-transform:uppercase}dso-dropdown-menu ul{margin:0;padding:0}dso-dropdown-menu ul:not(:last-child){border-bottom:1px solid #e5e5e5;margin-bottom:11px;padding-bottom:11px}dso-dropdown-menu .dso-dropdown-options{background-clip:padding-box;background-color:#fff;border-radius:4px;border:1px solid rgba(0, 0, 0, 0.15);box-shadow:0 8px 10px 1px rgba(0, 0, 0, 0.4);font-size:16px;margin:2px 0 0;min-width:160px;padding:5px 0;position:absolute;text-align:left;top:100%;z-index:1000}dso-dropdown-menu .dso-dropdown-options li{list-style:none}dso-dropdown-menu .dso-dropdown-options li a:visited{color:#191919}dso-dropdown-menu .dso-dropdown-options li a,dso-dropdown-menu .dso-dropdown-options li button{text-decoration:none;clear:both;color:#191919;display:block;font-weight:400;line-height:1.5;padding:3px 20px;text-decoration:none;white-space:nowrap;}dso-dropdown-menu .dso-dropdown-options li a:hover,dso-dropdown-menu .dso-dropdown-options li a:focus,dso-dropdown-menu .dso-dropdown-options li a:active,dso-dropdown-menu .dso-dropdown-options li button:hover,dso-dropdown-menu .dso-dropdown-options li button:focus,dso-dropdown-menu .dso-dropdown-options li button:active{text-decoration:underline}dso-dropdown-menu .dso-dropdown-options li a:hover,dso-dropdown-menu .dso-dropdown-options li a:focus,dso-dropdown-menu .dso-dropdown-options li button:hover,dso-dropdown-menu .dso-dropdown-options li button:focus{background-color:#39870c;border-color:#39870c;color:#fff;text-decoration:none}dso-dropdown-menu .dso-dropdown-options li button{background-color:transparent;border:0;border-radius:0;text-align:inherit;width:100%}dso-dropdown-menu[dropdown-align=right] .dso-dropdown-options{right:0}dso-dropdown-menu[open]>.dso-primary::after,dso-dropdown-menu[open]>.btn-primary::after{--dso-icon:var(--di-chevron-up-wit)}dso-dropdown-menu[open]>.dso-secondary::after,dso-dropdown-menu[open]>.btn-default::after{--dso-icon:var(--di-chevron-up)}dso-dropdown-menu[open]>.dso-secondary:hover::after,dso-dropdown-menu[open]>.btn-default:hover::after{--dso-icon:var(--di-chevron-up-wit)}dso-dropdown-menu[open]>.dso-tertiary::after,dso-dropdown-menu[open]>.btn-link::after{--dso-icon:var(--di-chevron-up)}dso-dropdown-menu[open]>.dso-tertiary:hover::after,dso-dropdown-menu[open]>.btn-link:hover::after{--dso-icon:var(--di-chevron-up-scampi)}dso-dropdown-menu[open] button::after{background:var(--dso-icon, var(--di-chevron-up-bosgroen)) no-repeat;background-position:center;background-size:cover;height:1.2em;vertical-align:top;width:1.2em}dso-dropdown-menu[checkable] .dso-group-label{padding-left:40px}dso-dropdown-menu[checkable] li a,dso-dropdown-menu[checkable] li button{padding-left:40px}dso-dropdown-menu[checkable] li.dso-checked a:not(:focus),dso-dropdown-menu[checkable] li.dso-checked button:not(:focus){background-color:#39870c;border-color:#39870c;color:#fff}dso-dropdown-menu[checkable] li.dso-checked a::before,dso-dropdown-menu[checkable] li.dso-checked button::before{background:var(--dso-icon, var(--di-check-wit)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px;content:\"\";display:block;float:left;margin-left:-32px;margin-right:8px}dso-dropdown-menu button{align-items:flex-end;background-color:transparent;border:0;display:flex;font-family:Asap, sans-serif;padding-right:32px}dso-dropdown-menu button::after{background:var(--dso-icon, var(--di-chevron-down-bosgroen)) no-repeat;background-position:center;background-size:cover;height:1.2em;vertical-align:top;width:1.2em;content:\"\";display:inline-block;margin-left:8px;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media screen and (max-width: 991px){dso-dropdown-menu[dropdown-align=right] .dso-dropdown-options{right:-16px}}@media screen and (max-width: 767px){dso-dropdown-menu{top:12px}}dso-dropdown-menu .dso-dropdown-options{border:0;border-radius:0}dso-dropdown-menu .dso-dropdown-options dso-dropdown-options ul{width:320px}@media screen and (max-width: 991px){dso-dropdown-menu .dso-dropdown-options dso-dropdown-options ul{width:100vw}}dso-dropdown-menu .dso-dropdown-options dso-dropdown-options li a{color:#275937;font-size:1.25rem;padding:16px}dso-dropdown-menu .dso-dropdown-options dso-dropdown-options li.dso-active a{font-weight:600}dso-dropdown-menu .dso-dropdown-options dso-dropdown-options li+li{border-top:1px solid #ccc}.dropdown{margin-left:auto}@media screen and (max-width: 767px){.dropdown dso-dropdown-menu{top:28px}}.dropdown dso-dropdown-menu .dso-dropdown-options{top:calc(100% + 29px)}@media screen and (max-width: 767px){.dropdown dso-dropdown-menu .dso-dropdown-options{top:72px}}.dropdown dso-dropdown-menu[open] button::after{background:var(--dso-icon, var(--di-chevron-up)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.dropdown dso-dropdown-menu button{color:#39870c;font-size:16px;font-weight:600}.dropdown dso-dropdown-menu button:hover,.dropdown dso-dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dropdown dso-dropdown-menu button::after{background:var(--dso-icon, var(--di-chevron-down)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.dso-nav{align-items:end;column-gap:32px;display:flex;list-style:none;margin-bottom:0;margin-top:0;padding-left:0}.dso-nav>li{margin-bottom:4px}.dso-nav>li>a{display:block}.dso-nav>li>a,.dso-nav>li>a:hover,.dso-nav>li>a:focus,.dso-nav>li>a:visited{color:#275937}.dso-nav>li.dso-active,.dso-nav>li.is-active{margin-bottom:0}.dso-nav>li.dso-active>a,.dso-nav>li.is-active>a{border-bottom:4px solid #8b4a6a;font-weight:bold}.dso-nav.dso-nav-main>li>a{text-decoration:none;font-size:1.25em;line-height:1;margin-top:8px;padding:16px 0;white-space:nowrap}.dso-nav.dso-nav-main>li>a:hover,.dso-nav.dso-nav-main>li>a:focus,.dso-nav.dso-nav-main>li>a:active{text-decoration:underline}.dso-nav.dso-nav-main dso-dropdown-menu .dso-dropdown-options{top:calc(100% + 3px)}.dso-nav.dso-nav-main dso-dropdown-menu button{font-size:1.25em;line-height:1;margin-top:8px;padding:16px 0;align-items:center;color:#275937;padding-right:32px}.dso-nav.dso-nav-main dso-dropdown-menu button:hover,.dso-nav.dso-nav-main dso-dropdown-menu button:active{cursor:pointer;text-decoration:underline}.dso-nav.dso-nav-main dso-dropdown-menu button::after{top:auto;transform:none}.dso-nav.dso-nav-sub>li{display:inline-block}.dso-nav.dso-nav-sub>li>a{text-decoration:none;font-size:16px;margin-top:4px;padding:4px 8px 3px}.dso-nav.dso-nav-sub>li>a:hover,.dso-nav.dso-nav-sub>li>a:focus,.dso-nav.dso-nav-sub>li>a:active{text-decoration:underline}.dso-nav .menu-user-home{margin-left:auto}.dso-nav .menu-user-home dso-icon{height:1em;margin-right:8px;position:relative;top:-2px;width:1.2em}";
|
|
1524
|
+
|
|
1525
|
+
const minDesktopViewportWidth = 992;
|
|
1526
|
+
let Header = class extends HTMLElement {
|
|
1527
|
+
constructor() {
|
|
1528
|
+
super();
|
|
1529
|
+
this.__registerHost();
|
|
1530
|
+
attachShadow(this);
|
|
1531
|
+
this.useDropDownMenu = "auto";
|
|
1532
|
+
this.showDropDown = false;
|
|
1533
|
+
this.isLoggedIn = false;
|
|
1534
|
+
this.hasSubLogo = false;
|
|
1535
|
+
this.overflowMenuItems = 0;
|
|
1536
|
+
this.onWindowResize = debounce_1(() => {
|
|
1537
|
+
this.setDropDownMenu();
|
|
1538
|
+
this.setOverflowMenu();
|
|
1539
|
+
}, 100);
|
|
1540
|
+
}
|
|
1541
|
+
watchUseDropDownMenu(value) {
|
|
1542
|
+
if (value === "auto") {
|
|
1543
|
+
this.setDropDownMenu();
|
|
1544
|
+
return;
|
|
1545
|
+
}
|
|
1546
|
+
this.showDropDown = value === "always";
|
|
1547
|
+
}
|
|
1548
|
+
componentWillLoad() {
|
|
1549
|
+
this.hasSubLogo = this.host.querySelector("*[slot = 'sub-logo']") !== null;
|
|
1550
|
+
}
|
|
1551
|
+
shrinkMenuToFit() {
|
|
1552
|
+
if (!this.wrapper || !this.nav) {
|
|
1553
|
+
return;
|
|
1554
|
+
}
|
|
1555
|
+
if (this.wrapper.clientWidth >= this.nav.clientWidth) {
|
|
1556
|
+
return;
|
|
1557
|
+
}
|
|
1558
|
+
if (this.overflowMenuItems >= this.mainMenu.length) {
|
|
1559
|
+
return;
|
|
1560
|
+
}
|
|
1561
|
+
this.overflowMenuItems++;
|
|
1562
|
+
}
|
|
1563
|
+
componentDidRender() {
|
|
1564
|
+
if (this.showDropDown) {
|
|
1565
|
+
return;
|
|
1566
|
+
}
|
|
1567
|
+
window.setTimeout(() => this.shrinkMenuToFit(), 0);
|
|
1568
|
+
}
|
|
1569
|
+
setOverflowMenu() {
|
|
1570
|
+
if (this.showDropDown) {
|
|
1571
|
+
return;
|
|
1572
|
+
}
|
|
1573
|
+
if (this.overflowMenuItems != 0) {
|
|
1574
|
+
this.overflowMenuItems = 0;
|
|
1575
|
+
return;
|
|
1576
|
+
}
|
|
1577
|
+
this.shrinkMenuToFit();
|
|
1578
|
+
}
|
|
1579
|
+
setDropDownMenu() {
|
|
1580
|
+
if (this.useDropDownMenu !== "auto") {
|
|
1581
|
+
return;
|
|
1582
|
+
}
|
|
1583
|
+
this.showDropDown = window.innerWidth < minDesktopViewportWidth;
|
|
1584
|
+
}
|
|
1585
|
+
connectedCallback() {
|
|
1586
|
+
window.addEventListener("resize", this.onWindowResize);
|
|
1587
|
+
}
|
|
1588
|
+
disconnectedCallback() {
|
|
1589
|
+
window.removeEventListener("resize", this.onWindowResize);
|
|
1590
|
+
}
|
|
1591
|
+
MenuItem(item) {
|
|
1592
|
+
return (h("li", { class: item.active ? "dso-active" : undefined }, h("a", { href: item.url, "aria-current": item.active ? "page" : undefined }, item.label)));
|
|
1593
|
+
}
|
|
1594
|
+
render() {
|
|
1595
|
+
return (h(Fragment, null, h("div", { class: clsx("dso-header", {
|
|
1596
|
+
["use-drop-down"]: this.showDropDown,
|
|
1597
|
+
["has-sub-logo"]: this.hasSubLogo,
|
|
1598
|
+
}), ref: (element) => (this.wrapper = element) }, h("div", { class: "logo-container" }, h("div", { class: "logo" }, h("slot", { name: "logo" })), h("div", { class: "sub-logo" }, h("slot", { name: "sub-logo" }))), this.showDropDown && (h("div", { class: "dropdown" }, h("dso-dropdown-menu", { "dropdown-align": "right" }, h("button", { type: "button", class: "tertiary", slot: "toggle" }, h("span", null, "Menu")), h("div", { class: "dso-dropdown-options" }, h("dso-dropdown-options", null, h("ul", null, this.mainMenu.map(this.MenuItem), this.userHomeUrl && (h("li", null, h("a", { href: this.userHomeUrl }, "Mijn Omgevingsloket"))), this.loginUrl && !this.isLoggedIn && (h("li", null, h("a", { href: this.loginUrl }, "Inloggen"))), this.userProfileUrl &&
|
|
1599
|
+
this.userProfileName &&
|
|
1600
|
+
this.isLoggedIn && (h("li", null, h("a", { href: this.userProfileUrl }, this.userProfileName, h("span", { class: "profile-label" }, "- Mijn profiel")))), this.logoutUrl && this.isLoggedIn && (h("li", null, h("a", { href: this.logoutUrl }, "Uitloggen"))))))))), !this.showDropDown && (h(Fragment, null, h("div", { class: "dso-header-session" }, this.userProfileUrl &&
|
|
1601
|
+
this.userProfileName &&
|
|
1602
|
+
this.isLoggedIn && (h("div", { class: "profile" }, h("span", { class: "profile-label" }, "Welkom:"), h("a", { href: this.userProfileUrl }, this.userProfileName))), this.loginUrl && !this.isLoggedIn && (h("div", { class: "login" }, h("a", { href: this.loginUrl }, "Inloggen"))), this.logoutUrl && this.isLoggedIn && (h("div", { class: "logout" }, h("a", { href: this.logoutUrl }, "Uitloggen")))), h("nav", { class: "dso-navbar" }, h("ul", { class: "dso-nav dso-nav-main", ref: (element) => (this.nav = element) }, this.mainMenu
|
|
1603
|
+
.filter((_, index) => index < this.mainMenu.length - this.overflowMenuItems)
|
|
1604
|
+
.map(this.MenuItem), this.overflowMenuItems > 0 && (h("li", null, h("dso-dropdown-menu", { "dropdown-align": "left" }, h("button", { type: "button", class: "tertiary", slot: "toggle" }, h("span", null, "Meer")), h("div", { class: "dso-dropdown-options" }, h("dso-dropdown-options", null, h("ul", null, this.mainMenu
|
|
1605
|
+
.filter((_, index) => index >=
|
|
1606
|
+
this.mainMenu.length -
|
|
1607
|
+
this.overflowMenuItems)
|
|
1608
|
+
.map(this.MenuItem))))))), this.userHomeUrl && (h("li", { class: "menu-user-home" }, h("a", { href: this.userHomeUrl }, h("dso-icon", { icon: "user-line" }), "Mijn Omgevingsloket"))))))))));
|
|
1609
|
+
}
|
|
1610
|
+
get host() { return this; }
|
|
1611
|
+
static get watchers() { return {
|
|
1612
|
+
"useDropDownMenu": ["watchUseDropDownMenu"]
|
|
1613
|
+
}; }
|
|
1614
|
+
static get style() { return headerCss; }
|
|
1615
|
+
};
|
|
1616
|
+
|
|
1506
1617
|
const helpcenterPanelCss = ":host{display:block;--di-times:url(\"data:image/svg+xml,%3csvg id='times' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M13.36%2c12l3.3-3.3A1%2c1%2c0%2c1%2c0%2c15.3%2c7.34L12%2c10.64%2c8.7%2c7.34A1%2c1%2c0%2c1%2c0%2c7.34%2c8.7l3.3%2c3.3-3.3%2c3.3A1%2c1%2c0%2c1%2c0%2c8.7%2c16.66l3.3-3.3%2c3.3%2c3.3a1%2c1%2c0%2c1%2c0%2c1.36-1.36Z'/%3e %3c/svg%3e\");--di-times-wit:url(\"data:image/svg+xml,%3csvg id='times' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: white%3b'%3e %3cpath fill='currentColor' d='M13.36%2c12l3.3-3.3A1%2c1%2c0%2c1%2c0%2c15.3%2c7.34L12%2c10.64%2c8.7%2c7.34A1%2c1%2c0%2c1%2c0%2c7.34%2c8.7l3.3%2c3.3-3.3%2c3.3A1%2c1%2c0%2c1%2c0%2c8.7%2c16.66l3.3-3.3%2c3.3%2c3.3a1%2c1%2c0%2c1%2c0%2c1.36-1.36Z'/%3e %3c/svg%3e\")}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.wrapper{height:100%;left:0;position:fixed;top:0;visibility:hidden;width:100%}.wrapper.visible{visibility:visible}.dimscreen{background-color:#000;height:100%;opacity:0.4;width:100%}.open-button{display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;background-color:#39870c;border-color:#39870c;color:#fff;border-width:1px;border-style:solid;border-radius:4px;line-height:1.5;min-width:56px;padding:11px 15px;border:0;bottom:16px;font-family:Asap, sans-serif;position:fixed;right:16px}.open-button:focus,.open-button:focus-visible{outline-offset:2px}.open-button:active{outline:0}.open-button.extern::after,.open-button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}.open-button:focus,.open-button:focus-visible{outline-offset:2px}.open-button:active{outline:0}.open-button.extern::after,.open-button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}.open-button:hover{background-color:#275937;border-color:#275937;color:#fff}.open-button:active{background-color:#15301e;border-color:#15301e;color:#fff}.open-button[disabled],.open-button[disabled]:hover{background-color:#afcf9d;border-color:#afcf9d;color:#fff}.open-button.btn-sm{line-height:16px}.open-button.btn-sm dso-icon,.open-button.btn-sm svg.di,.open-button.btn-sm.extern::after,.open-button.btn-sm.download::after{margin-bottom:-4px;margin-top:-4px}.open-button.download::after{background:var(--dso-icon, var(--di-download-wit)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.open-button.extern::after{background:var(--dso-icon, var(--di-external-link-wit)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.open-button dso-icon,.open-button svg.di{margin-left:-8px;margin-right:8px}.open-button span+dso-icon,.open-button span+svg.di{margin-left:8px;margin-right:-8px}.open-button:hover{cursor:pointer}.open-button.open{display:none}.close-button{display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;background-color:#fff;border-color:#39870c;color:#39870c;border-width:1px;border-style:solid;border-radius:4px;line-height:1.5;min-width:56px;padding:11px 15px;border-right:0;border-top:0;border-radius:0 0 0 8px;height:40px;min-width:40px;padding:0;position:fixed;right:0;width:40px;top:0}.close-button:focus,.close-button:focus-visible{outline-offset:2px}.close-button:active{outline:0}.close-button.extern::after,.close-button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}.close-button:hover{background-color:#39870c;border-color:#39870c;color:#fff}.close-button:active{background-color:#275937;border-color:#275937;color:#fff}.close-button[disabled],.close-button[disabled]:hover{background-color:#fff;border-color:#afcf9d;color:#afcf9d}.close-button.btn-sm{line-height:16px}.close-button.btn-sm dso-icon,.close-button.btn-sm svg.di,.close-button.btn-sm.extern::after,.close-button.btn-sm.download::after{margin-bottom:-4px;margin-top:-4px}.close-button.download::after{background:var(--dso-icon, var(--di-download)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.close-button.download:hover::after{--dso-icon:var(--di-download-wit)}.close-button.download[disabled]::after{--dso-icon:var(--di-download-grasgroen-40)}.close-button.extern::after{background:var(--dso-icon, var(--di-external-link)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.close-button.extern:hover::after{--dso-icon:var(--di-external-link-wit)}.close-button.extern[disabled]::after{--dso-icon:var(--di-external-link-grasgroen-40)}.close-button dso-icon,.close-button svg.di{margin-left:-8px;margin-right:8px}.close-button span+dso-icon,.close-button span+svg.di{margin-left:8px;margin-right:-8px}.close-button::before{background:var(--dso-icon, var(--di-times)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em;content:\"\";display:inline-block;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.close-button:hover,.close-button:active,.close-button:focus{cursor:pointer}.close-button:hover::before,.close-button:active::before,.close-button:focus::before{background:var(--dso-icon, var(--di-times-wit)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}.close-button.close{display:none}.iframe-container{background-color:#fff;border:0;border-left:1px solid #ccc;box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.4);height:100%;position:absolute;right:-640px;top:0;transition:right 0.5s;width:640px}.iframe-container.open{right:0}iframe{border:0;height:100%;width:100%}";
|
|
1507
1618
|
|
|
1508
1619
|
const maxCssTransitionMilliseconds = 500;
|
|
@@ -2176,7 +2287,7 @@ let Info = class extends HTMLElement {
|
|
|
2176
2287
|
static get style() { return infoCss; }
|
|
2177
2288
|
};
|
|
2178
2289
|
|
|
2179
|
-
const infoButtonCss = ":host{display:inline-block;--di-info:url(\"data:image/svg+xml,%3csvg id='info' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M12%2c3a9%2c9%2c0%2c1%2c1-9%2c9%2c9%2c9%2c0%2c0%2c1%2c9-9m0-2A11%2c11%2c0%2c1%2c0%2c23%2c12%2c11%2c11%2c0%2c0%2c0%2c12%2c1Zm0%2c8a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-active:url(\"data:image/svg+xml,%3csvg id='info-active' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M23%2c12A11%2c11%2c0%2c1%2c1%2c12%2c1%2c11%2c11%2c0%2c0%2c1%2c23%2c12ZM12%2c9a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-secondary:url(\"data:image/svg+xml,%3csvg id='info' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23666%3b'%3e %3cpath fill='currentColor' d='M12%2c3a9%2c9%2c0%2c1%2c1-9%2c9%2c9%2c9%2c0%2c0%2c1%2c9-9m0-2A11%2c11%2c0%2c1%2c0%2c23%2c12%2c11%2c11%2c0%2c0%2c0%2c12%2c1Zm0%2c8a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-active-secondary:url(\"data:image/svg+xml,%3csvg id='info-active' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23666%3b'%3e %3cpath fill='currentColor' d='M23%2c12A11%2c11%2c0%2c1%2c1%2c12%2c1%2c11%2c11%2c0%2c0%2c1%2c23%2c12ZM12%2c9a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\")}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{background:var(--dso-icon, var(--di-info)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px;border:1px solid transparent;margin-left:8px;padding:0}button.dso-open,button:hover,button:active{--dso-icon:var(--di-info-active)}button.dso-info-secondary{--dso-icon:var(--di-info-secondary)}button.dso-info-secondary.dso-open,button.dso-info-secondary:hover,button.dso-info-secondary:active{--dso-icon:var(--di-info-active-secondary)}";
|
|
2290
|
+
const infoButtonCss = ":host{display:inline-block;--di-info:url(\"data:image/svg+xml,%3csvg id='info' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M12%2c3a9%2c9%2c0%2c1%2c1-9%2c9%2c9%2c9%2c0%2c0%2c1%2c9-9m0-2A11%2c11%2c0%2c1%2c0%2c23%2c12%2c11%2c11%2c0%2c0%2c0%2c12%2c1Zm0%2c8a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-active:url(\"data:image/svg+xml,%3csvg id='info-active' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %2339870c%3b'%3e %3cpath fill='currentColor' d='M23%2c12A11%2c11%2c0%2c1%2c1%2c12%2c1%2c11%2c11%2c0%2c0%2c1%2c23%2c12ZM12%2c9a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-secondary:url(\"data:image/svg+xml,%3csvg id='info' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23666%3b'%3e %3cpath fill='currentColor' d='M12%2c3a9%2c9%2c0%2c1%2c1-9%2c9%2c9%2c9%2c0%2c0%2c1%2c9-9m0-2A11%2c11%2c0%2c1%2c0%2c23%2c12%2c11%2c11%2c0%2c0%2c0%2c12%2c1Zm0%2c8a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\");--di-info-active-secondary:url(\"data:image/svg+xml,%3csvg id='info-active' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='color: %23666%3b'%3e %3cpath fill='currentColor' d='M23%2c12A11%2c11%2c0%2c1%2c1%2c12%2c1%2c11%2c11%2c0%2c0%2c1%2c23%2c12ZM12%2c9a1%2c1%2c0%2c1%2c0-1-1A1%2c1%2c0%2c0%2c0%2c12%2c9Zm1%2c7.79V11.21A1.12%2c1.12%2c0%2c0%2c0%2c12%2c10a1.12%2c1.12%2c0%2c0%2c0-1%2c1.21v5.58A1.12%2c1.12%2c0%2c0%2c0%2c12%2c18%2c1.12%2c1.12%2c0%2c0%2c0%2c13%2c16.79Z'/%3e %3c/svg%3e\")}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{background:var(--dso-icon, var(--di-info)) no-repeat;background-position:center;background-size:cover;height:24px;vertical-align:top;width:24px;border:1px solid transparent;margin-left:8px;padding:0;cursor:pointer}button.dso-open,button:hover,button:active{--dso-icon:var(--di-info-active)}button.dso-info-secondary{--dso-icon:var(--di-info-secondary)}button.dso-info-secondary.dso-open,button.dso-info-secondary:hover,button.dso-info-secondary:active{--dso-icon:var(--di-info-active-secondary)}";
|
|
2180
2291
|
|
|
2181
2292
|
let InfoButton = class extends HTMLElement {
|
|
2182
2293
|
constructor() {
|
|
@@ -2207,7 +2318,7 @@ let Label = class extends HTMLElement {
|
|
|
2207
2318
|
}
|
|
2208
2319
|
render() {
|
|
2209
2320
|
const status = this.status && Label.statusMap.get(this.status);
|
|
2210
|
-
return (h("span", { class: clsx('dso-label', { [`dso-label-${this.status}`]: this.status, 'dso-compact': this.compact && !this.removable, 'dso-hover': this.hover }) }, h("slot", { name: "symbol" }), status && (h("span", { class: "sr-only" }, status, ": ")), h("slot", null), this.removable && (h("button", { type: "button", onClick: e => this.removeClick.emit(e),
|
|
2321
|
+
return (h("span", { class: clsx('dso-label', { [`dso-label-${this.status}`]: this.status, 'dso-compact': this.compact && !this.removable, 'dso-hover': this.hover }) }, h("slot", { name: "symbol" }), status && (h("span", { class: "sr-only" }, status, ": ")), h("slot", null), this.removable && (h("button", { type: "button", onClick: e => this.removeClick.emit(e), onMouseEnter: () => this.hover = true, onMouseLeave: () => this.hover = false }, h("span", { class: "sr-only" }, "Verwijder"), h("dso-icon", { icon: "times" })))));
|
|
2211
2322
|
}
|
|
2212
2323
|
static get style() { return labelCss; }
|
|
2213
2324
|
};
|
|
@@ -2227,17 +2338,16 @@ let MapBaseLayers = class extends HTMLElement {
|
|
|
2227
2338
|
attachShadow(this);
|
|
2228
2339
|
this.baseLayerChange = createEvent(this, "baseLayerChange", 7);
|
|
2229
2340
|
}
|
|
2230
|
-
|
|
2231
|
-
this.
|
|
2232
|
-
this.baseLayerChange.emit(baseLayer);
|
|
2341
|
+
baseLayerChangeHandler(baseLayer) {
|
|
2342
|
+
this.baseLayerChange.emit({ activeBaseLayer: baseLayer });
|
|
2233
2343
|
}
|
|
2234
2344
|
render() {
|
|
2235
|
-
return (h("fieldset", { class: "form-group dso-radios" }, h("legend", { class: "sr-only" }, "Achtergrond"), h("div", { class: "dso-label-container" }, h("span", { class: "control-label", "aria-hidden": "true" }, "Achtergrond")), h("div", { class: "dso-field-container" }, this.baseLayers.map(
|
|
2345
|
+
return (h("fieldset", { class: "form-group dso-radios" }, h("legend", { class: "sr-only" }, "Achtergrond"), h("div", { class: "dso-label-container" }, h("span", { class: "control-label", "aria-hidden": "true" }, "Achtergrond")), h("div", { class: "dso-field-container" }, this.baseLayers.map(baseLayer => (h("dso-selectable", { key: baseLayer.id, type: "radio", value: baseLayer.name, checked: baseLayer.checked, onDsoChange: () => this.baseLayerChangeHandler(baseLayer) }, baseLayer.name))))));
|
|
2236
2346
|
}
|
|
2237
2347
|
static get style() { return mapBaseLayersCss; }
|
|
2238
2348
|
};
|
|
2239
2349
|
|
|
2240
|
-
const mapControlsCss = "button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}:host{background-color:#fff;border:1px solid #ccc;bottom:0;display:block;font-family:Asap, sans-serif;position:absolute;top:0;left:100%;transition:transform 300ms ease;width:300px}*,*::after,*::before{box-sizing:border-box}:host([open]){box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.3);transform:translateX(-100%)}:host([open]) #toggle-visibility-button{display:none}#
|
|
2350
|
+
const mapControlsCss = "button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}:host{background-color:#fff;border:1px solid #ccc;bottom:0;display:block;font-family:Asap, sans-serif;position:absolute;top:0;left:100%;transition:transform 300ms ease;width:300px}*,*::after,*::before{box-sizing:border-box}:host([open]){box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.3);transform:translateX(-100%)}:host([open]) #toggle-visibility-button{display:none}#toggle-visibility-button{display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;background-color:#fff;border-color:#39870c;color:#39870c;border-width:1px;border-style:solid;border-radius:4px;line-height:1.5;min-width:56px;padding:11px 15px;border:0;box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.5);font-weight:600;margin-right:16px;padding:8px 16px;white-space:nowrap;position:absolute;right:calc(100% + 56px);top:16px}#toggle-visibility-button:focus,#toggle-visibility-button:focus-visible{outline-offset:2px}#toggle-visibility-button:active{outline:0}#toggle-visibility-button.extern::after,#toggle-visibility-button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}#toggle-visibility-button:hover{background-color:#39870c;border-color:#39870c;color:#fff}#toggle-visibility-button:active{background-color:#275937;border-color:#275937;color:#fff}#toggle-visibility-button[disabled],#toggle-visibility-button[disabled]:hover{background-color:#fff;border-color:#afcf9d;color:#afcf9d}#toggle-visibility-button.btn-sm{line-height:16px}#toggle-visibility-button.btn-sm dso-icon,#toggle-visibility-button.btn-sm svg.di,#toggle-visibility-button.btn-sm.extern::after,#toggle-visibility-button.btn-sm.download::after{margin-bottom:-4px;margin-top:-4px}#toggle-visibility-button.download::after{background:var(--dso-icon, var(--di-download)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#toggle-visibility-button.download:hover::after{--dso-icon:var(--di-download-wit)}#toggle-visibility-button.download[disabled]::after{--dso-icon:var(--di-download-grasgroen-40)}#toggle-visibility-button.extern::after{background:var(--dso-icon, var(--di-external-link)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#toggle-visibility-button.extern:hover::after{--dso-icon:var(--di-external-link-wit)}#toggle-visibility-button.extern[disabled]::after{--dso-icon:var(--di-external-link-grasgroen-40)}#toggle-visibility-button dso-icon,#toggle-visibility-button svg.di{margin-left:-8px;margin-right:8px}#toggle-visibility-button span+dso-icon,#toggle-visibility-button span+svg.di{margin-left:8px;margin-right:-8px}#toggle-visibility-button:focus-visible{background-color:#39870c;border-color:#39870c;color:#fff;outline:none}#zoom-buttons{border-radius:4px;box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.5);display:flex;flex-wrap:wrap;flex:0 0;position:absolute;right:calc(100% + 16px);top:16px}#zoom-buttons button{display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;background-color:#fff;border-color:#39870c;color:#39870c;border-width:1px;border-style:solid;border-radius:4px;line-height:1.5;min-width:56px;padding:11px 15px;border:0;padding:8px;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px;flex:0 0 100%;height:40px;min-width:auto;width:40px}#zoom-buttons button:focus,#zoom-buttons button:focus-visible{outline-offset:2px}#zoom-buttons button:active{outline:0}#zoom-buttons button.extern::after,#zoom-buttons button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}#zoom-buttons button:hover{background-color:#39870c;border-color:#39870c;color:#fff}#zoom-buttons button:active{background-color:#275937;border-color:#275937;color:#fff}#zoom-buttons button[disabled],#zoom-buttons button[disabled]:hover{background-color:#fff;border-color:#afcf9d;color:#afcf9d}#zoom-buttons button.btn-sm{line-height:16px}#zoom-buttons button.btn-sm dso-icon,#zoom-buttons button.btn-sm svg.di,#zoom-buttons button.btn-sm.extern::after,#zoom-buttons button.btn-sm.download::after{margin-bottom:-4px;margin-top:-4px}#zoom-buttons button.download::after{background:var(--dso-icon, var(--di-download)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#zoom-buttons button.download:hover::after{--dso-icon:var(--di-download-wit)}#zoom-buttons button.download[disabled]::after{--dso-icon:var(--di-download-grasgroen-40)}#zoom-buttons button.extern::after{background:var(--dso-icon, var(--di-external-link)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#zoom-buttons button.extern:hover::after{--dso-icon:var(--di-external-link-wit)}#zoom-buttons button.extern[disabled]::after{--dso-icon:var(--di-external-link-grasgroen-40)}#zoom-buttons button>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}#zoom-buttons button:focus-visible{background-color:#39870c;border-color:#39870c;color:#fff;outline:none}#zoom-buttons button+button{border-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-top:1px solid #ccc}#close-button{display:inline-block;font-size:1em;font-weight:500;margin-bottom:0;text-decoration:none;touch-action:manipulation;text-align:left;user-select:none;vertical-align:middle;border:0;color:#39870c;line-height:1;padding:0;background-color:transparent;padding:0;position:absolute;right:16px;top:16px}#close-button:focus,#close-button:focus-visible{outline-offset:2px}#close-button:active{outline:0}#close-button.extern::after,#close-button.download::after{content:\"\";display:inline-block;height:1.5em;margin-left:8px;vertical-align:top;width:1.5em}#close-button[disabled]{color:#afcf9d}#close-button:not([disabled]):hover{color:#676cb0;text-decoration:underline}#close-button:not([disabled]):active{color:#676cb0}#close-button.btn-align{line-height:calc(1.5em - 1px);padding:11px 0;position:relative}#close-button.extern::after,#close-button.download::after{position:relative;top:-2px}#close-button.download::after{background:var(--dso-icon, var(--di-download)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#close-button.download[disabled]::after{--dso-icon:var(--di-download-grasgroen-40)}#close-button.download:not([disabled]):hover::after,#close-button.download:not([disabled]):active::after{--dso-icon:var(--di-download-scampi)}#close-button.extern::after{background:var(--dso-icon, var(--di-external-link)) no-repeat;background-position:center;background-size:cover;height:1.5em;vertical-align:top;width:1.5em}#close-button.extern[disabled]::after{--dso-icon:var(--di-external-link-grasgroen-40)}#close-button.extern:not([disabled]):hover::after,#close-button.extern:not([disabled]):active::after{--dso-icon:var(--di-external-link-scampi)}#close-button>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}header,.content{padding:16px}header{border-bottom:1px solid #ccc;position:relative}header h2{color:#275937;font-family:\"Asap\", sans-serif;line-height:1;margin:0}";
|
|
2241
2351
|
|
|
2242
2352
|
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, privateMap) {
|
|
2243
2353
|
if (!privateMap.has(receiver)) {
|
|
@@ -2279,7 +2389,7 @@ let MapControls = class extends HTMLElement {
|
|
|
2279
2389
|
}
|
|
2280
2390
|
}
|
|
2281
2391
|
render() {
|
|
2282
|
-
return (h(Host, null, h("
|
|
2392
|
+
return (h(Host, null, h("button", { type: "button", id: "toggle-visibility-button", onClick: () => this.open = !this.open, ref: element => __classPrivateFieldSet(this, _toggleButtonElement, element) }, h("dso-icon", { icon: "layers" }), h("span", null, "Kaartlagen")), h("div", { id: "zoom-buttons" }, h("button", { type: "button", onClick: e => this.zoomIn.emit(e), disabled: this.disableZoom === 'in' || this.disableZoom === 'both' }, h("span", null, "Zoom in"), h("dso-icon", { icon: "plus" })), h("button", { type: "button", onClick: e => this.zoomOut.emit(e), disabled: this.disableZoom === 'out' || this.disableZoom === 'both' }, h("span", null, "Zoom uit"), h("dso-icon", { icon: "minus" }))), h("section", { hidden: this.hideContent }, h("header", null, h("h2", null, "Kaartlagen"), h("button", { type: "button", id: "close-button", onClick: () => this.open = false, ref: element => __classPrivateFieldSet(this, _closeButtonElement, element) }, h("span", null, "Sluit dialoog"), h("dso-icon", { icon: "times" }))), h("div", { class: "content" }, h("slot", null)))));
|
|
2283
2393
|
}
|
|
2284
2394
|
static get watchers() { return {
|
|
2285
2395
|
"open": ["watchOpen"]
|
|
@@ -2295,17 +2405,14 @@ let MapOverlays = class extends HTMLElement {
|
|
|
2295
2405
|
super();
|
|
2296
2406
|
this.__registerHost();
|
|
2297
2407
|
attachShadow(this);
|
|
2298
|
-
this.
|
|
2299
|
-
this.checkedOverlays = [];
|
|
2408
|
+
this.toggleOverlay = createEvent(this, "toggleOverlay", 7);
|
|
2300
2409
|
}
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
|
|
2304
|
-
: this.checkedOverlays.filter(o => o !== overlay);
|
|
2305
|
-
this.checkedOverlaysChange.emit(this.checkedOverlays);
|
|
2410
|
+
overlayChangeHandler(overlay, e) {
|
|
2411
|
+
const checked = e.detail.target instanceof HTMLInputElement ? !!e.detail.target.checked : false;
|
|
2412
|
+
this.toggleOverlay.emit({ overlay, checked });
|
|
2306
2413
|
}
|
|
2307
2414
|
render() {
|
|
2308
|
-
return (h("fieldset", { class: "form-group dso-checkboxes" }, h("legend", { class: "sr-only" }, "Kaartlagen"), h("div", { class: "dso-label-container" }, h("span", { class: "control-label", "aria-hidden": "true" }, "Kaartlagen")), h("div", { class: "dso-field-container" }, this.overlays.map(overlay => (h("dso-selectable", { type: "checkbox", value: overlay.name, checked:
|
|
2415
|
+
return (h("fieldset", { class: "form-group dso-checkboxes" }, h("legend", { class: "sr-only" }, "Kaartlagen"), h("div", { class: "dso-label-container" }, h("span", { class: "control-label", "aria-hidden": "true" }, "Kaartlagen")), h("div", { class: "dso-field-container" }, this.overlays.map(overlay => (h("dso-selectable", { type: "checkbox", value: overlay.name, checked: overlay.checked, disabled: overlay.disabled, onDsoChange: e => this.overlayChangeHandler(overlay, e) }, overlay.name))))));
|
|
2309
2416
|
}
|
|
2310
2417
|
static get style() { return mapOverlaysCss; }
|
|
2311
2418
|
};
|
|
@@ -2883,7 +2990,7 @@ let Selectable = class extends HTMLElement {
|
|
|
2883
2990
|
static get style() { return selectableCss; }
|
|
2884
2991
|
};
|
|
2885
2992
|
|
|
2886
|
-
const toggletipCss = "*,*::after,*::before{box-sizing:border-box}";
|
|
2993
|
+
const toggletipCss = "*,*::after,*::before{box-sizing:border-box}:host(:focus){outline:none}";
|
|
2887
2994
|
|
|
2888
2995
|
let Toggletip = class extends HTMLElement {
|
|
2889
2996
|
constructor() {
|
|
@@ -2932,6 +3039,7 @@ let Toggletip = class extends HTMLElement {
|
|
|
2932
3039
|
throw Error("button not found");
|
|
2933
3040
|
}
|
|
2934
3041
|
this.button = button;
|
|
3042
|
+
this.host.setAttribute("tabindex", "-1");
|
|
2935
3043
|
}
|
|
2936
3044
|
render() {
|
|
2937
3045
|
return (h(Fragment, null, h("dso-info-button", { id: "toggle", onClick: this.click, label: this.label, active: this.active, secondary: this.secondary }), h("dso-tooltip", { stateless: true, for: "toggle", active: this.active, position: this.position, small: this.small }, h("slot", null))));
|
|
@@ -3096,29 +3204,32 @@ function getBasePlacement(placement) {
|
|
|
3096
3204
|
return placement.split('-')[0];
|
|
3097
3205
|
}
|
|
3098
3206
|
|
|
3099
|
-
|
|
3100
|
-
|
|
3101
|
-
|
|
3207
|
+
var max = Math.max;
|
|
3208
|
+
var min = Math.min;
|
|
3209
|
+
var round = Math.round;
|
|
3210
|
+
|
|
3211
|
+
function getBoundingClientRect(element, includeScale) {
|
|
3212
|
+
if (includeScale === void 0) {
|
|
3213
|
+
includeScale = false;
|
|
3214
|
+
}
|
|
3102
3215
|
|
|
3103
3216
|
var rect = element.getBoundingClientRect();
|
|
3104
3217
|
var scaleX = 1;
|
|
3105
|
-
var scaleY = 1;
|
|
3106
|
-
|
|
3107
|
-
|
|
3108
|
-
|
|
3109
|
-
|
|
3110
|
-
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
|
|
3120
|
-
// }
|
|
3121
|
-
// }
|
|
3218
|
+
var scaleY = 1;
|
|
3219
|
+
|
|
3220
|
+
if (isHTMLElement(element) && includeScale) {
|
|
3221
|
+
var offsetHeight = element.offsetHeight;
|
|
3222
|
+
var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
|
|
3223
|
+
// Fallback to 1 in case both values are `0`
|
|
3224
|
+
|
|
3225
|
+
if (offsetWidth > 0) {
|
|
3226
|
+
scaleX = round(rect.width) / offsetWidth || 1;
|
|
3227
|
+
}
|
|
3228
|
+
|
|
3229
|
+
if (offsetHeight > 0) {
|
|
3230
|
+
scaleY = round(rect.height) / offsetHeight || 1;
|
|
3231
|
+
}
|
|
3232
|
+
}
|
|
3122
3233
|
|
|
3123
3234
|
return {
|
|
3124
3235
|
width: rect.width / scaleX,
|
|
@@ -3273,13 +3384,13 @@ function getMainAxisFromPlacement(placement) {
|
|
|
3273
3384
|
return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
|
|
3274
3385
|
}
|
|
3275
3386
|
|
|
3276
|
-
var max = Math.max;
|
|
3277
|
-
var min = Math.min;
|
|
3278
|
-
var round = Math.round;
|
|
3279
|
-
|
|
3280
3387
|
function within(min$1, value, max$1) {
|
|
3281
3388
|
return max(min$1, min(value, max$1));
|
|
3282
3389
|
}
|
|
3390
|
+
function withinMaxClamp(min, value, max) {
|
|
3391
|
+
var v = within(min, value, max);
|
|
3392
|
+
return v > max ? max : v;
|
|
3393
|
+
}
|
|
3283
3394
|
|
|
3284
3395
|
function getFreshSideObject() {
|
|
3285
3396
|
return {
|
|
@@ -3402,8 +3513,8 @@ function roundOffsetsByDPR(_ref) {
|
|
|
3402
3513
|
var win = window;
|
|
3403
3514
|
var dpr = win.devicePixelRatio || 1;
|
|
3404
3515
|
return {
|
|
3405
|
-
x: round(
|
|
3406
|
-
y: round(
|
|
3516
|
+
x: round(x * dpr) / dpr || 0,
|
|
3517
|
+
y: round(y * dpr) / dpr || 0
|
|
3407
3518
|
};
|
|
3408
3519
|
}
|
|
3409
3520
|
|
|
@@ -3418,14 +3529,23 @@ function mapToStyles(_ref2) {
|
|
|
3418
3529
|
position = _ref2.position,
|
|
3419
3530
|
gpuAcceleration = _ref2.gpuAcceleration,
|
|
3420
3531
|
adaptive = _ref2.adaptive,
|
|
3421
|
-
roundOffsets = _ref2.roundOffsets
|
|
3422
|
-
|
|
3423
|
-
var
|
|
3424
|
-
|
|
3425
|
-
|
|
3426
|
-
|
|
3427
|
-
|
|
3532
|
+
roundOffsets = _ref2.roundOffsets,
|
|
3533
|
+
isFixed = _ref2.isFixed;
|
|
3534
|
+
var _offsets$x = offsets.x,
|
|
3535
|
+
x = _offsets$x === void 0 ? 0 : _offsets$x,
|
|
3536
|
+
_offsets$y = offsets.y,
|
|
3537
|
+
y = _offsets$y === void 0 ? 0 : _offsets$y;
|
|
3538
|
+
|
|
3539
|
+
var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
|
|
3540
|
+
x: x,
|
|
3541
|
+
y: y
|
|
3542
|
+
}) : {
|
|
3543
|
+
x: x,
|
|
3544
|
+
y: y
|
|
3545
|
+
};
|
|
3428
3546
|
|
|
3547
|
+
x = _ref3.x;
|
|
3548
|
+
y = _ref3.y;
|
|
3429
3549
|
var hasX = offsets.hasOwnProperty('x');
|
|
3430
3550
|
var hasY = offsets.hasOwnProperty('y');
|
|
3431
3551
|
var sideX = left;
|
|
@@ -3450,16 +3570,18 @@ function mapToStyles(_ref2) {
|
|
|
3450
3570
|
offsetParent = offsetParent;
|
|
3451
3571
|
|
|
3452
3572
|
if (placement === top || (placement === left || placement === right) && variation === end) {
|
|
3453
|
-
sideY = bottom;
|
|
3454
|
-
|
|
3455
|
-
|
|
3573
|
+
sideY = bottom;
|
|
3574
|
+
var offsetY = isFixed && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
|
|
3575
|
+
offsetParent[heightProp];
|
|
3576
|
+
y -= offsetY - popperRect.height;
|
|
3456
3577
|
y *= gpuAcceleration ? 1 : -1;
|
|
3457
3578
|
}
|
|
3458
3579
|
|
|
3459
3580
|
if (placement === left || (placement === top || placement === bottom) && variation === end) {
|
|
3460
|
-
sideX = right;
|
|
3461
|
-
|
|
3462
|
-
|
|
3581
|
+
sideX = right;
|
|
3582
|
+
var offsetX = isFixed && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
|
|
3583
|
+
offsetParent[widthProp];
|
|
3584
|
+
x -= offsetX - popperRect.width;
|
|
3463
3585
|
x *= gpuAcceleration ? 1 : -1;
|
|
3464
3586
|
}
|
|
3465
3587
|
}
|
|
@@ -3468,6 +3590,17 @@ function mapToStyles(_ref2) {
|
|
|
3468
3590
|
position: position
|
|
3469
3591
|
}, adaptive && unsetSides);
|
|
3470
3592
|
|
|
3593
|
+
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
|
|
3594
|
+
x: x,
|
|
3595
|
+
y: y
|
|
3596
|
+
}) : {
|
|
3597
|
+
x: x,
|
|
3598
|
+
y: y
|
|
3599
|
+
};
|
|
3600
|
+
|
|
3601
|
+
x = _ref4.x;
|
|
3602
|
+
y = _ref4.y;
|
|
3603
|
+
|
|
3471
3604
|
if (gpuAcceleration) {
|
|
3472
3605
|
var _Object$assign;
|
|
3473
3606
|
|
|
@@ -3477,9 +3610,9 @@ function mapToStyles(_ref2) {
|
|
|
3477
3610
|
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
|
|
3478
3611
|
}
|
|
3479
3612
|
|
|
3480
|
-
function computeStyles(
|
|
3481
|
-
var state =
|
|
3482
|
-
options =
|
|
3613
|
+
function computeStyles(_ref5) {
|
|
3614
|
+
var state = _ref5.state,
|
|
3615
|
+
options = _ref5.options;
|
|
3483
3616
|
var _options$gpuAccelerat = options.gpuAcceleration,
|
|
3484
3617
|
gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
|
|
3485
3618
|
_options$adaptive = options.adaptive,
|
|
@@ -3492,7 +3625,8 @@ function computeStyles(_ref4) {
|
|
|
3492
3625
|
variation: getVariation(state.placement),
|
|
3493
3626
|
popper: state.elements.popper,
|
|
3494
3627
|
popperRect: state.rects.popper,
|
|
3495
|
-
gpuAcceleration: gpuAcceleration
|
|
3628
|
+
gpuAcceleration: gpuAcceleration,
|
|
3629
|
+
isFixed: state.options.strategy === 'fixed'
|
|
3496
3630
|
};
|
|
3497
3631
|
|
|
3498
3632
|
if (state.modifiersData.popperOffsets != null) {
|
|
@@ -3750,7 +3884,7 @@ function getInnerBoundingClientRect(element) {
|
|
|
3750
3884
|
}
|
|
3751
3885
|
|
|
3752
3886
|
function getClientRectFromMixedType(element, clippingParent) {
|
|
3753
|
-
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) :
|
|
3887
|
+
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
3754
3888
|
} // A "clipping parent" is an overflowable container with the characteristic of
|
|
3755
3889
|
// clipping (or hiding) overflowing elements with a position different from
|
|
3756
3890
|
// `initial`
|
|
@@ -4263,6 +4397,14 @@ function preventOverflow(_ref) {
|
|
|
4263
4397
|
var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
|
|
4264
4398
|
placement: state.placement
|
|
4265
4399
|
})) : tetherOffset;
|
|
4400
|
+
var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
|
|
4401
|
+
mainAxis: tetherOffsetValue,
|
|
4402
|
+
altAxis: tetherOffsetValue
|
|
4403
|
+
} : Object.assign({
|
|
4404
|
+
mainAxis: 0,
|
|
4405
|
+
altAxis: 0
|
|
4406
|
+
}, tetherOffsetValue);
|
|
4407
|
+
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
|
|
4266
4408
|
var data = {
|
|
4267
4409
|
x: 0,
|
|
4268
4410
|
y: 0
|
|
@@ -4272,13 +4414,15 @@ function preventOverflow(_ref) {
|
|
|
4272
4414
|
return;
|
|
4273
4415
|
}
|
|
4274
4416
|
|
|
4275
|
-
if (checkMainAxis
|
|
4417
|
+
if (checkMainAxis) {
|
|
4418
|
+
var _offsetModifierState$;
|
|
4419
|
+
|
|
4276
4420
|
var mainSide = mainAxis === 'y' ? top : left;
|
|
4277
4421
|
var altSide = mainAxis === 'y' ? bottom : right;
|
|
4278
4422
|
var len = mainAxis === 'y' ? 'height' : 'width';
|
|
4279
4423
|
var offset = popperOffsets[mainAxis];
|
|
4280
|
-
var min$1 =
|
|
4281
|
-
var max$1 =
|
|
4424
|
+
var min$1 = offset + overflow[mainSide];
|
|
4425
|
+
var max$1 = offset - overflow[altSide];
|
|
4282
4426
|
var additive = tether ? -popperRect[len] / 2 : 0;
|
|
4283
4427
|
var minLen = variation === start ? referenceRect[len] : popperRect[len];
|
|
4284
4428
|
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
|
|
@@ -4298,36 +4442,45 @@ function preventOverflow(_ref) {
|
|
|
4298
4442
|
// width or height)
|
|
4299
4443
|
|
|
4300
4444
|
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
|
|
4301
|
-
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin -
|
|
4302
|
-
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax +
|
|
4445
|
+
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
|
|
4446
|
+
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
|
|
4303
4447
|
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
|
|
4304
4448
|
var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
|
|
4305
|
-
var offsetModifierValue =
|
|
4306
|
-
var tetherMin =
|
|
4307
|
-
var tetherMax =
|
|
4449
|
+
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
|
|
4450
|
+
var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
|
|
4451
|
+
var tetherMax = offset + maxOffset - offsetModifierValue;
|
|
4452
|
+
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
|
|
4453
|
+
popperOffsets[mainAxis] = preventedOffset;
|
|
4454
|
+
data[mainAxis] = preventedOffset - offset;
|
|
4455
|
+
}
|
|
4308
4456
|
|
|
4309
|
-
|
|
4310
|
-
|
|
4311
|
-
popperOffsets[mainAxis] = preventedOffset;
|
|
4312
|
-
data[mainAxis] = preventedOffset - offset;
|
|
4313
|
-
}
|
|
4457
|
+
if (checkAltAxis) {
|
|
4458
|
+
var _offsetModifierState$2;
|
|
4314
4459
|
|
|
4315
|
-
|
|
4316
|
-
var _mainSide = mainAxis === 'x' ? top : left;
|
|
4460
|
+
var _mainSide = mainAxis === 'x' ? top : left;
|
|
4317
4461
|
|
|
4318
|
-
|
|
4462
|
+
var _altSide = mainAxis === 'x' ? bottom : right;
|
|
4319
4463
|
|
|
4320
|
-
|
|
4464
|
+
var _offset = popperOffsets[altAxis];
|
|
4321
4465
|
|
|
4322
|
-
|
|
4466
|
+
var _len = altAxis === 'y' ? 'height' : 'width';
|
|
4323
4467
|
|
|
4324
|
-
|
|
4468
|
+
var _min = _offset + overflow[_mainSide];
|
|
4325
4469
|
|
|
4326
|
-
|
|
4470
|
+
var _max = _offset - overflow[_altSide];
|
|
4327
4471
|
|
|
4328
|
-
|
|
4329
|
-
|
|
4330
|
-
|
|
4472
|
+
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
|
|
4473
|
+
|
|
4474
|
+
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
|
|
4475
|
+
|
|
4476
|
+
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
|
|
4477
|
+
|
|
4478
|
+
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
|
|
4479
|
+
|
|
4480
|
+
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
|
|
4481
|
+
|
|
4482
|
+
popperOffsets[altAxis] = _preventedOffset;
|
|
4483
|
+
data[altAxis] = _preventedOffset - _offset;
|
|
4331
4484
|
}
|
|
4332
4485
|
|
|
4333
4486
|
state.modifiersData[name] = data;
|
|
@@ -4359,8 +4512,8 @@ function getNodeScroll(node) {
|
|
|
4359
4512
|
|
|
4360
4513
|
function isElementScaled(element) {
|
|
4361
4514
|
var rect = element.getBoundingClientRect();
|
|
4362
|
-
var scaleX = rect.width / element.offsetWidth || 1;
|
|
4363
|
-
var scaleY = rect.height / element.offsetHeight || 1;
|
|
4515
|
+
var scaleX = round(rect.width) / element.offsetWidth || 1;
|
|
4516
|
+
var scaleY = round(rect.height) / element.offsetHeight || 1;
|
|
4364
4517
|
return scaleX !== 1 || scaleY !== 1;
|
|
4365
4518
|
} // Returns the composite rect of an element relative to its offsetParent.
|
|
4366
4519
|
// Composite means it takes into account transforms as well as layout.
|
|
@@ -4372,9 +4525,9 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
4372
4525
|
}
|
|
4373
4526
|
|
|
4374
4527
|
var isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
4375
|
-
isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
4528
|
+
var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
4376
4529
|
var documentElement = getDocumentElement(offsetParent);
|
|
4377
|
-
var rect = getBoundingClientRect(elementOrVirtualElement);
|
|
4530
|
+
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
|
|
4378
4531
|
var scroll = {
|
|
4379
4532
|
scrollLeft: 0,
|
|
4380
4533
|
scrollTop: 0
|
|
@@ -4391,7 +4544,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
4391
4544
|
}
|
|
4392
4545
|
|
|
4393
4546
|
if (isHTMLElement(offsetParent)) {
|
|
4394
|
-
offsets = getBoundingClientRect(offsetParent);
|
|
4547
|
+
offsets = getBoundingClientRect(offsetParent, true);
|
|
4395
4548
|
offsets.x += offsetParent.clientLeft;
|
|
4396
4549
|
offsets.y += offsetParent.clientTop;
|
|
4397
4550
|
} else if (documentElement) {
|
|
@@ -4678,7 +4831,41 @@ var createPopper = /*#__PURE__*/popperGenerator({
|
|
|
4678
4831
|
defaultModifiers: defaultModifiers
|
|
4679
4832
|
}); // eslint-disable-next-line import/no-unused-modules
|
|
4680
4833
|
|
|
4681
|
-
|
|
4834
|
+
var maxSize = {
|
|
4835
|
+
name: 'maxSize',
|
|
4836
|
+
enabled: true,
|
|
4837
|
+
phase: 'main',
|
|
4838
|
+
requiresIfExists: ['offset', 'preventOverflow', 'flip'],
|
|
4839
|
+
fn: function fn(_ref) {
|
|
4840
|
+
var state = _ref.state,
|
|
4841
|
+
name = _ref.name,
|
|
4842
|
+
options = _ref.options;
|
|
4843
|
+
var overflow = detectOverflow(state, options);
|
|
4844
|
+
|
|
4845
|
+
var _ref2 = state.modifiersData.preventOverflow || {
|
|
4846
|
+
x: 0,
|
|
4847
|
+
y: 0
|
|
4848
|
+
},
|
|
4849
|
+
x = _ref2.x,
|
|
4850
|
+
y = _ref2.y;
|
|
4851
|
+
|
|
4852
|
+
var _state$rects$popper = state.rects.popper,
|
|
4853
|
+
width = _state$rects$popper.width,
|
|
4854
|
+
height = _state$rects$popper.height;
|
|
4855
|
+
|
|
4856
|
+
var _state$placement$spli = state.placement.split('-'),
|
|
4857
|
+
basePlacement = _state$placement$spli[0];
|
|
4858
|
+
|
|
4859
|
+
var widthProp = basePlacement === 'left' ? 'left' : 'right';
|
|
4860
|
+
var heightProp = basePlacement === 'top' ? 'top' : 'bottom';
|
|
4861
|
+
state.modifiersData[name] = {
|
|
4862
|
+
width: width - overflow[widthProp] - x,
|
|
4863
|
+
height: height - overflow[heightProp] - y
|
|
4864
|
+
};
|
|
4865
|
+
}
|
|
4866
|
+
};
|
|
4867
|
+
|
|
4868
|
+
const tooltipCss = ":host(.hidden){visibility:hidden}:host-context(dso-toggletip){color:red !important}:host-context(dso-toggletip) *[data-popper-placement=top] .tooltip-arrow{margin-left:3px}:host-context(dso-toggletip) *[data-popper-placement=right] .tooltip-arrow{margin-top:0}:host-context(dso-toggletip) *[data-popper-placement=bottom] .tooltip-arrow{margin-left:3px}:host-context(dso-toggletip) *[data-popper-placement=left]{margin-right:-8px !important}:host-context(dso-toggletip) *[data-popper-placement=left] .tooltip-arrow{margin-top:0}*,*::after,*::before{box-sizing:border-box}.tooltip{font-family:Asap, sans-serif;font-style:normal;font-weight:400;line-height:1.5;line-break:auto;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;word-spacing:normal;word-wrap:normal;white-space:normal;display:block;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));font-size:14px;opacity:0;position:absolute;transition:opacity 0.15s linear;z-index:1070}.tooltip.in{opacity:1}.tooltip .tooltip-inner{background-color:#fff;border-radius:4px;color:#191919;display:inline-block;font-size:16px;max-width:640px;padding:8px 16px;position:relative}.tooltip .tooltip-inner.dso-small{max-width:320px}.tooltip .tooltip-arrow{border-color:transparent;border-style:solid;height:0;width:0}.tooltip[data-popper-placement=top]{margin-top:-3px;padding:6px 0}.tooltip[data-popper-placement=top] .tooltip-arrow{border-top-color:#fff;border-width:6px 6px 0;bottom:0}.tooltip[data-popper-placement=top] .tooltip-arrow{margin-left:-3px}.tooltip[data-popper-placement=right]{margin-left:3px;padding:0 6px}.tooltip[data-popper-placement=right] .tooltip-arrow{border-right-color:#fff;border-width:6px 6px 6px 0;left:0}.tooltip[data-popper-placement=right] .tooltip-arrow{margin-top:-3px}.tooltip[data-popper-placement=bottom]{margin-top:3px;padding:6px 0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{border-bottom-color:#fff;border-width:0 6px 6px;top:0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{margin-left:-3px}.tooltip[data-popper-placement=left]{margin-left:-3px;padding:0 6px}.tooltip[data-popper-placement=left] .tooltip-arrow{border-left-color:#fff;border-width:6px 0 6px 6px;right:0}.tooltip[data-popper-placement=left] .tooltip-arrow{margin-top:-3px}";
|
|
4682
4869
|
|
|
4683
4870
|
// Keep const in sync with $tooltip-transition-duration in @dso-toolkit/sources/tooltip.scss tooltip_root() mixin
|
|
4684
4871
|
const transitionDuration = 150;
|
|
@@ -4700,6 +4887,19 @@ let Tooltip = class extends HTMLElement {
|
|
|
4700
4887
|
*/
|
|
4701
4888
|
this.active = false;
|
|
4702
4889
|
this.hidden = true;
|
|
4890
|
+
this.applyMaxSize = {
|
|
4891
|
+
name: 'applyMaxSize',
|
|
4892
|
+
enabled: true,
|
|
4893
|
+
phase: beforeWrite,
|
|
4894
|
+
requires: ['maxSize'],
|
|
4895
|
+
fn({ state }) {
|
|
4896
|
+
let { width } = state.modifiersData.maxSize;
|
|
4897
|
+
if (width < 160) {
|
|
4898
|
+
width = 160;
|
|
4899
|
+
}
|
|
4900
|
+
state.styles.popper = Object.assign(Object.assign({}, state.styles.popper), { maxWidth: `${width}px` });
|
|
4901
|
+
},
|
|
4902
|
+
};
|
|
4703
4903
|
}
|
|
4704
4904
|
/**
|
|
4705
4905
|
* Activate the tooltip (Sets the `active` attribute)
|
|
@@ -4757,7 +4957,8 @@ let Tooltip = class extends HTMLElement {
|
|
|
4757
4957
|
}
|
|
4758
4958
|
this.target = this.getTarget();
|
|
4759
4959
|
this.popper = createPopper(this.target, tooltip, {
|
|
4760
|
-
placement: this.position
|
|
4960
|
+
placement: this.position,
|
|
4961
|
+
modifiers: [maxSize, this.applyMaxSize],
|
|
4761
4962
|
});
|
|
4762
4963
|
this.callbacks = {
|
|
4763
4964
|
activate: () => (this.active = true),
|
|
@@ -4789,7 +4990,7 @@ let Tooltip = class extends HTMLElement {
|
|
|
4789
4990
|
}
|
|
4790
4991
|
}
|
|
4791
4992
|
render() {
|
|
4792
|
-
return (h(Host, { hidden: this.hidden }, h("div", { class: clsx('tooltip', { in: this.active }), role: "tooltip" }, !this.noArrow && h("div", { class: "tooltip-arrow" }), h("div", { class: clsx('tooltip-inner', { 'dso-small': this.small }) }, h("slot", null)))));
|
|
4993
|
+
return (h(Host, { class: { 'hidden': this.hidden } }, h("div", { class: clsx('tooltip', { in: this.active }), role: "tooltip" }, !this.noArrow && h("div", { "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { class: clsx('tooltip-inner', { 'dso-small': this.small }) }, h("slot", null)))));
|
|
4793
4994
|
}
|
|
4794
4995
|
getTarget() {
|
|
4795
4996
|
if (this.for instanceof HTMLElement) {
|
|
@@ -4822,13 +5023,14 @@ let Tooltip = class extends HTMLElement {
|
|
|
4822
5023
|
|
|
4823
5024
|
const DsoTreeItem = ({ owner, ancestors, item, index, level, setSize }) => {
|
|
4824
5025
|
var _a, _b, _c;
|
|
4825
|
-
return (h("li", { key: item.
|
|
5026
|
+
return (h("li", { key: item.id, class: clsx('tree-item', { 'has-child': item.hasItems }), role: 'none' },
|
|
4826
5027
|
h("div", { class: "tree-branch-control" }, item.hasItems
|
|
4827
5028
|
?
|
|
4828
5029
|
h("div", { onClick: (e) => owner.itemClick(e, ancestors, item) },
|
|
4829
5030
|
h("dso-icon", { icon: item.open ? 'chevron-down' : 'chevron-right' }))
|
|
4830
5031
|
: h("dso-icon", null)),
|
|
4831
|
-
h("p", { class:
|
|
5032
|
+
h("p", { class: clsx('tree-content', { 'active': item.active }, { 'selected': item.selected }), tabindex: level === 1 && index === 0 ? 0 : -1, role: "treeitem", "aria-expanded": item.hasItems ? '' + (!!item.open && !!((_a = item.items) === null || _a === void 0 ? void 0 : _a.length)) : undefined, "aria-current": item.active ? 'true' : undefined, "aria-level": level, "aria-setsize": setSize, "aria-posinset": index + 1, "aria-busy": item.loading ? 'true' : undefined, onClick: (e) => owner.itemClick(e, ancestors, item) },
|
|
5033
|
+
item.selected && h("span", { class: "sr-only" }, "Resultaat: "),
|
|
4832
5034
|
item.href
|
|
4833
5035
|
? h("a", { href: item.href, tabindex: "-1" }, item.label)
|
|
4834
5036
|
: h("span", null, item.label), (_b = item.icons) === null || _b === void 0 ? void 0 :
|
|
@@ -4839,7 +5041,7 @@ const DsoTreeItem = ({ owner, ancestors, item, index, level, setSize }) => {
|
|
|
4839
5041
|
: h("ul", { role: "group" }, (_c = item.items) === null || _c === void 0 ? void 0 : _c.map((childItem, index, org) => h(DsoTreeItem, { owner: owner, ancestors: [...ancestors, item], item: childItem, index: index, level: level + 1, setSize: org.length }))))));
|
|
4840
5042
|
};
|
|
4841
5043
|
|
|
4842
|
-
const treeViewCss = ":host ul{list-style-type:none}:host ul[role=tree]{padding-left:0}:host li[role=treeitem]>ul{padding-left:1.5em}:host .tree-branch-control{cursor:pointer;display:inline-block}:host .tree-content{cursor:pointer;display:inline-block;margin:8px 0}:host .tree-content a,:host .tree-content a:visited{color:#
|
|
5044
|
+
const treeViewCss = ":host ul{list-style-type:none}:host ul[role=tree]{padding-left:0}:host li[role=treeitem]>ul{padding-left:1.5em}:host .tree-branch-control{cursor:pointer;display:inline-block}:host .tree-content{cursor:pointer;display:inline-block;margin:8px 0}:host .tree-content.active{font-weight:700}:host .tree-content.active:hover{text-decoration:underline}:host .tree-content.active a{text-decoration:none}:host .tree-content.selected{color:#191919;font-weight:700;text-decoration:underline}:host .tree-content.selected:hover,:host .tree-content.selected:focus{text-decoration:none}:host .tree-content a,:host .tree-content a:visited{color:#191919;text-decoration:underline}:host .tree-content a:hover,:host .tree-content a:focus{color:#191919;text-decoration:none}:host .tree-content a:active{text-decoration:none}:host .tree-content dso-icon{font-size:0.75em;margin-left:0.5em;vertical-align:text-bottom}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
|
|
4843
5045
|
|
|
4844
5046
|
let TreeView = class extends HTMLElement {
|
|
4845
5047
|
constructor() {
|
|
@@ -4902,7 +5104,7 @@ let TreeView = class extends HTMLElement {
|
|
|
4902
5104
|
return;
|
|
4903
5105
|
}
|
|
4904
5106
|
TreeView.setFocus(tree, contentElement);
|
|
4905
|
-
this.clickItem.emit([...ancestors, item]);
|
|
5107
|
+
this.clickItem.emit({ path: [...ancestors, item], originalEvent: event });
|
|
4906
5108
|
return;
|
|
4907
5109
|
}
|
|
4908
5110
|
if (item.open) {
|
|
@@ -4999,17 +5201,18 @@ const DsoAttachmentsCounter = /*@__PURE__*/proxyCustomElement(AttachmentsCounter
|
|
|
4999
5201
|
const DsoAutosuggest = /*@__PURE__*/proxyCustomElement(Autosuggest, [6,"dso-autosuggest",{"suggestions":[16],"suggestOnFocus":[4,"suggest-on-focus"],"showSuggestions":[32],"selectedSuggestion":[32]},[[4,"click","onDocumentClick"]]]);
|
|
5000
5202
|
const DsoBadge = /*@__PURE__*/proxyCustomElement(Badge, [1,"dso-badge",{"status":[1]}]);
|
|
5001
5203
|
const DsoBanner = /*@__PURE__*/proxyCustomElement(Banner, [1,"dso-banner",{"status":[1]}]);
|
|
5002
|
-
const DsoDatePicker = /*@__PURE__*/proxyCustomElement(DsoDatePicker$1, [
|
|
5204
|
+
const DsoDatePicker = /*@__PURE__*/proxyCustomElement(DsoDatePicker$1, [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]},[[6,"click","handleDocumentClick"]]]);
|
|
5003
5205
|
const DsoDropdownMenu = /*@__PURE__*/proxyCustomElement(DropdownMenu, [1,"dso-dropdown-menu",{"open":[1540],"dropdownAlign":[1,"dropdown-align"],"checkable":[4]}]);
|
|
5206
|
+
const DsoHeader = /*@__PURE__*/proxyCustomElement(Header, [1,"dso-header",{"loginUrl":[1,"login-url"],"logoutUrl":[1,"logout-url"],"mainMenu":[16],"useDropDownMenu":[1,"use-drop-down-menu"],"isLoggedIn":[4,"is-logged-in"],"userProfileName":[1,"user-profile-name"],"userProfileUrl":[1,"user-profile-url"],"userHomeUrl":[1,"user-home-url"],"showDropDown":[32],"hasSubLogo":[32],"overflowMenuItems":[32]}]);
|
|
5004
5207
|
const DsoHelpcenterPanel = /*@__PURE__*/proxyCustomElement(HelpcenterPanel, [1,"dso-helpcenter-panel",{"label":[1],"url":[1],"visibility":[32],"isOpen":[32],"slideState":[32],"loadIframe":[32]}]);
|
|
5005
5208
|
const DsoHighlightBox = /*@__PURE__*/proxyCustomElement(HighlightBox, [1,"dso-highlight-box",{"yellow":[4],"border":[4],"white":[4],"dropShadow":[4,"drop-shadow"],"step":[2]}]);
|
|
5006
5209
|
const DsoIcon = /*@__PURE__*/proxyCustomElement(Icon, [1,"dso-icon",{"icon":[1]}]);
|
|
5007
5210
|
const DsoInfo = /*@__PURE__*/proxyCustomElement(Info, [1,"dso-info",{"fixed":[516],"active":[516]}]);
|
|
5008
5211
|
const DsoInfoButton = /*@__PURE__*/proxyCustomElement(InfoButton, [1,"dso-info-button",{"active":[1540],"secondary":[4],"label":[1]}]);
|
|
5009
5212
|
const DsoLabel = /*@__PURE__*/proxyCustomElement(Label, [1,"dso-label",{"compact":[4],"removable":[4],"status":[1],"hover":[32]}]);
|
|
5010
|
-
const DsoMapBaseLayers = /*@__PURE__*/proxyCustomElement(MapBaseLayers, [1,"dso-map-base-layers",{"baseLayers":[16]
|
|
5213
|
+
const DsoMapBaseLayers = /*@__PURE__*/proxyCustomElement(MapBaseLayers, [1,"dso-map-base-layers",{"baseLayers":[16]}]);
|
|
5011
5214
|
const DsoMapControls = /*@__PURE__*/proxyCustomElement(MapControls, [1,"dso-map-controls",{"open":[1540],"disableZoom":[1,"disable-zoom"],"hideContent":[32]}]);
|
|
5012
|
-
const DsoMapOverlays = /*@__PURE__*/proxyCustomElement(MapOverlays, [1,"dso-map-overlays",{"overlays":[16]
|
|
5215
|
+
const DsoMapOverlays = /*@__PURE__*/proxyCustomElement(MapOverlays, [1,"dso-map-overlays",{"overlays":[16]}]);
|
|
5013
5216
|
const DsoOzonContent = /*@__PURE__*/proxyCustomElement(OzonContent, [0,"dso-ozon-content",{"content":[1]},[[0,"click","handleClick"]]]);
|
|
5014
5217
|
const DsoProgressBar = /*@__PURE__*/proxyCustomElement(ProgressBar, [1,"dso-progress-bar",{"progress":[2],"min":[2],"max":[2]}]);
|
|
5015
5218
|
const DsoProgressIndicator = /*@__PURE__*/proxyCustomElement(Progressindicator, [1,"dso-progress-indicator",{"label":[1],"size":[1],"block":[4]}]);
|
|
@@ -5027,6 +5230,7 @@ const defineCustomElements = (opts) => {
|
|
|
5027
5230
|
DsoBanner,
|
|
5028
5231
|
DsoDatePicker,
|
|
5029
5232
|
DsoDropdownMenu,
|
|
5233
|
+
DsoHeader,
|
|
5030
5234
|
DsoHelpcenterPanel,
|
|
5031
5235
|
DsoHighlightBox,
|
|
5032
5236
|
DsoIcon,
|
|
@@ -5051,4 +5255,4 @@ const defineCustomElements = (opts) => {
|
|
|
5051
5255
|
}
|
|
5052
5256
|
};
|
|
5053
5257
|
|
|
5054
|
-
export { DsoAlert, DsoAttachmentsCounter, DsoAutosuggest, DsoBadge, DsoBanner, DsoDatePicker, DsoDropdownMenu, DsoHelpcenterPanel, DsoHighlightBox, DsoIcon, DsoInfo, DsoInfoButton, DsoLabel, DsoMapBaseLayers, DsoMapControls, DsoMapOverlays, DsoOzonContent, DsoProgressBar, DsoProgressIndicator, DsoSelectable, DsoToggletip, DsoTooltip, DsoTreeView, defineCustomElements };
|
|
5258
|
+
export { DsoAlert, DsoAttachmentsCounter, DsoAutosuggest, DsoBadge, DsoBanner, DsoDatePicker, DsoDropdownMenu, DsoHeader, DsoHelpcenterPanel, DsoHighlightBox, DsoIcon, DsoInfo, DsoInfoButton, DsoLabel, DsoMapBaseLayers, DsoMapControls, DsoMapOverlays, DsoOzonContent, DsoProgressBar, DsoProgressIndicator, DsoSelectable, DsoToggletip, DsoTooltip, DsoTreeView, defineCustomElements };
|