@dnncommunity/dnn-elements 0.15.0-beta.7 → 0.15.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/dnn-button_17.cjs.entry.js +1 -1
- package/dist/cjs/dnn-button_17.cjs.entry.js.map +1 -1
- package/dist/cjs/dnn.cjs.js +4 -116
- package/dist/cjs/dnn.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -18
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/collection/components/dnn-tabs/dnn-tabs.css +0 -1
- package/dist/collection/components/dnn-tabs/dnn-tabs.stories.js +5 -0
- package/dist/collection/components/dnn-tabs/dnn-tabs.stories.js.map +1 -1
- package/dist/dnn/dnn.esm.js +1 -130
- package/dist/dnn/dnn.esm.js.map +1 -1
- package/dist/dnn/dnn.js +1 -1
- package/dist/dnn/index.esm.js +1 -46
- package/dist/dnn/index.esm.js.map +1 -1
- package/dist/dnn/{p-c222c8b7.entry.js → p-058a3145.entry.js} +2 -2
- package/dist/dnn/{p-c222c8b7.entry.js.map → p-058a3145.entry.js.map} +1 -1
- package/dist/dnn/{p-31dc68a7.system.entry.js → p-1893c229.system.entry.js} +2 -2
- package/dist/dnn/{p-31dc68a7.system.entry.js.map → p-1893c229.system.entry.js.map} +1 -1
- package/dist/dnn/p-5bcf3629.system.js +1 -1
- package/dist/esm/dnn-button_17.entry.js +1 -1
- package/dist/esm/dnn-button_17.entry.js.map +1 -1
- package/dist/esm/dnn.js +4 -116
- package/dist/esm/dnn.js.map +1 -1
- package/dist/esm/loader.js +2 -18
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm-es5/dnn-button_17.entry.js +1 -1
- package/dist/esm-es5/dnn-button_17.entry.js.map +1 -1
- package/dist/index.js +1 -1
- package/package.json +6 -3
- package/dist/cjs/app-globals-3a1e7e63.js +0 -7
- package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
- package/dist/cjs/css-shim-aaf4fec9.js +0 -8
- package/dist/cjs/css-shim-aaf4fec9.js.map +0 -1
- package/dist/cjs/dnn-button.cjs.entry.js +0 -92
- package/dist/cjs/dnn-button.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-checkbox.cjs.entry.js +0 -58
- package/dist/cjs/dnn-checkbox.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-chevron.cjs.entry.js +0 -34
- package/dist/cjs/dnn-chevron.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-collapsible.cjs.entry.js +0 -69
- package/dist/cjs/dnn-collapsible.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-color-picker.cjs.entry.js +0 -508
- package/dist/cjs/dnn-color-picker.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-dropzone.cjs.entry.js +0 -153
- package/dist/cjs/dnn-dropzone.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-image-cropper.cjs.entry.js +0 -408
- package/dist/cjs/dnn-image-cropper.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-modal.cjs.entry.js +0 -65
- package/dist/cjs/dnn-modal.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-permissions-grid.cjs.entry.js +0 -320
- package/dist/cjs/dnn-permissions-grid.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-searchbox.cjs.entry.js +0 -66
- package/dist/cjs/dnn-searchbox.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-sort-icon.cjs.entry.js +0 -43
- package/dist/cjs/dnn-sort-icon.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-tab.cjs.entry.js +0 -31
- package/dist/cjs/dnn-tab.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-tabs.cjs.entry.js +0 -52
- package/dist/cjs/dnn-tabs.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-toggle.cjs.entry.js +0 -37
- package/dist/cjs/dnn-toggle.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-treeview-item.cjs.entry.js +0 -68
- package/dist/cjs/dnn-treeview-item.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-vertical-overflow-menu.cjs.entry.js +0 -124
- package/dist/cjs/dnn-vertical-overflow-menu.cjs.entry.js.map +0 -1
- package/dist/cjs/dnn-vertical-splitview.cjs.entry.js +0 -133
- package/dist/cjs/dnn-vertical-splitview.cjs.entry.js.map +0 -1
- package/dist/cjs/dom-14886762.js +0 -77
- package/dist/cjs/dom-14886762.js.map +0 -1
- package/dist/cjs/index-d53702a3.js +0 -3095
- package/dist/cjs/index-d53702a3.js.map +0 -1
- package/dist/cjs/mouseUtilities-ecd5ecf7.js +0 -25
- package/dist/cjs/mouseUtilities-ecd5ecf7.js.map +0 -1
- package/dist/cjs/shadow-css-c44ea13a.js +0 -392
- package/dist/cjs/shadow-css-c44ea13a.js.map +0 -1
- package/dist/dnn/app-globals-0f993ce5.js +0 -5
- package/dist/dnn/app-globals-0f993ce5.js.map +0 -1
- package/dist/dnn/app-globals-497eb362.system.js +0 -2
- package/dist/dnn/app-globals-497eb362.system.js.map +0 -1
- package/dist/dnn/css-shim-091f949f.js +0 -6
- package/dist/dnn/css-shim-091f949f.js.map +0 -1
- package/dist/dnn/css-shim-c5bffe6b.system.js +0 -2
- package/dist/dnn/css-shim-c5bffe6b.system.js.map +0 -1
- package/dist/dnn/debounce-6be67abd.js +0 -22
- package/dist/dnn/debounce-6be67abd.js.map +0 -1
- package/dist/dnn/debounce-db438a09.system.js +0 -2
- package/dist/dnn/debounce-db438a09.system.js.map +0 -1
- package/dist/dnn/dnn-button.entry.js +0 -88
- package/dist/dnn/dnn-button.entry.js.map +0 -1
- package/dist/dnn/dnn-button.system.entry.js +0 -2
- package/dist/dnn/dnn-button.system.entry.js.map +0 -1
- package/dist/dnn/dnn-checkbox.entry.js +0 -54
- package/dist/dnn/dnn-checkbox.entry.js.map +0 -1
- package/dist/dnn/dnn-checkbox.system.entry.js +0 -2
- package/dist/dnn/dnn-checkbox.system.entry.js.map +0 -1
- package/dist/dnn/dnn-chevron.entry.js +0 -30
- package/dist/dnn/dnn-chevron.entry.js.map +0 -1
- package/dist/dnn/dnn-chevron.system.entry.js +0 -2
- package/dist/dnn/dnn-chevron.system.entry.js.map +0 -1
- package/dist/dnn/dnn-collapsible.entry.js +0 -65
- package/dist/dnn/dnn-collapsible.entry.js.map +0 -1
- package/dist/dnn/dnn-collapsible.system.entry.js +0 -2
- package/dist/dnn/dnn-collapsible.system.entry.js.map +0 -1
- package/dist/dnn/dnn-color-picker.entry.js +0 -504
- package/dist/dnn/dnn-color-picker.entry.js.map +0 -1
- package/dist/dnn/dnn-color-picker.system.entry.js +0 -12
- package/dist/dnn/dnn-color-picker.system.entry.js.map +0 -1
- package/dist/dnn/dnn-dropzone.entry.js +0 -149
- package/dist/dnn/dnn-dropzone.entry.js.map +0 -1
- package/dist/dnn/dnn-dropzone.system.entry.js +0 -2
- package/dist/dnn/dnn-dropzone.system.entry.js.map +0 -1
- package/dist/dnn/dnn-image-cropper.entry.js +0 -404
- package/dist/dnn/dnn-image-cropper.entry.js.map +0 -1
- package/dist/dnn/dnn-image-cropper.system.entry.js +0 -2
- package/dist/dnn/dnn-image-cropper.system.entry.js.map +0 -1
- package/dist/dnn/dnn-modal.entry.js +0 -61
- package/dist/dnn/dnn-modal.entry.js.map +0 -1
- package/dist/dnn/dnn-modal.system.entry.js +0 -2
- package/dist/dnn/dnn-modal.system.entry.js.map +0 -1
- package/dist/dnn/dnn-permissions-grid.entry.js +0 -316
- package/dist/dnn/dnn-permissions-grid.entry.js.map +0 -1
- package/dist/dnn/dnn-permissions-grid.system.entry.js +0 -2
- package/dist/dnn/dnn-permissions-grid.system.entry.js.map +0 -1
- package/dist/dnn/dnn-searchbox.entry.js +0 -62
- package/dist/dnn/dnn-searchbox.entry.js.map +0 -1
- package/dist/dnn/dnn-searchbox.system.entry.js +0 -2
- package/dist/dnn/dnn-searchbox.system.entry.js.map +0 -1
- package/dist/dnn/dnn-sort-icon.entry.js +0 -39
- package/dist/dnn/dnn-sort-icon.entry.js.map +0 -1
- package/dist/dnn/dnn-sort-icon.system.entry.js +0 -2
- package/dist/dnn/dnn-sort-icon.system.entry.js.map +0 -1
- package/dist/dnn/dnn-tab.entry.js +0 -27
- package/dist/dnn/dnn-tab.entry.js.map +0 -1
- package/dist/dnn/dnn-tab.system.entry.js +0 -2
- package/dist/dnn/dnn-tab.system.entry.js.map +0 -1
- package/dist/dnn/dnn-tabs.entry.js +0 -48
- package/dist/dnn/dnn-tabs.entry.js.map +0 -1
- package/dist/dnn/dnn-tabs.system.entry.js +0 -2
- package/dist/dnn/dnn-tabs.system.entry.js.map +0 -1
- package/dist/dnn/dnn-toggle.entry.js +0 -33
- package/dist/dnn/dnn-toggle.entry.js.map +0 -1
- package/dist/dnn/dnn-toggle.system.entry.js +0 -2
- package/dist/dnn/dnn-toggle.system.entry.js.map +0 -1
- package/dist/dnn/dnn-treeview-item.entry.js +0 -64
- package/dist/dnn/dnn-treeview-item.entry.js.map +0 -1
- package/dist/dnn/dnn-treeview-item.system.entry.js +0 -2
- package/dist/dnn/dnn-treeview-item.system.entry.js.map +0 -1
- package/dist/dnn/dnn-vertical-overflow-menu.entry.js +0 -120
- package/dist/dnn/dnn-vertical-overflow-menu.entry.js.map +0 -1
- package/dist/dnn/dnn-vertical-overflow-menu.system.entry.js +0 -2
- package/dist/dnn/dnn-vertical-overflow-menu.system.entry.js.map +0 -1
- package/dist/dnn/dnn-vertical-splitview.entry.js +0 -129
- package/dist/dnn/dnn-vertical-splitview.entry.js.map +0 -1
- package/dist/dnn/dnn-vertical-splitview.system.entry.js +0 -2
- package/dist/dnn/dnn-vertical-splitview.system.entry.js.map +0 -1
- package/dist/dnn/dnn.system.js +0 -2
- package/dist/dnn/dnn.system.js.map +0 -1
- package/dist/dnn/dom-99eb7b76.system.js +0 -22
- package/dist/dnn/dom-99eb7b76.system.js.map +0 -1
- package/dist/dnn/dom-a385e381.js +0 -75
- package/dist/dnn/dom-a385e381.js.map +0 -1
- package/dist/dnn/index-20e42ad7.js +0 -3059
- package/dist/dnn/index-20e42ad7.js.map +0 -1
- package/dist/dnn/index-c3cc3b5b.system.js +0 -2
- package/dist/dnn/index-c3cc3b5b.system.js.map +0 -1
- package/dist/dnn/index.system.js +0 -2
- package/dist/dnn/index.system.js.map +0 -1
- package/dist/dnn/mouseUtilities-233ad7e3.system.js +0 -2
- package/dist/dnn/mouseUtilities-233ad7e3.system.js.map +0 -1
- package/dist/dnn/mouseUtilities-b261ca4f.js +0 -23
- package/dist/dnn/mouseUtilities-b261ca4f.js.map +0 -1
- package/dist/dnn/shadow-css-27708fdd.system.js +0 -14
- package/dist/dnn/shadow-css-27708fdd.system.js.map +0 -1
- package/dist/dnn/shadow-css-ef431969.js +0 -390
- package/dist/dnn/shadow-css-ef431969.js.map +0 -1
- package/dist/esm/app-globals-0f993ce5.js +0 -5
- package/dist/esm/app-globals-0f993ce5.js.map +0 -1
- package/dist/esm/css-shim-091f949f.js +0 -6
- package/dist/esm/css-shim-091f949f.js.map +0 -1
- package/dist/esm/dnn-button.entry.js +0 -88
- package/dist/esm/dnn-button.entry.js.map +0 -1
- package/dist/esm/dnn-checkbox.entry.js +0 -54
- package/dist/esm/dnn-checkbox.entry.js.map +0 -1
- package/dist/esm/dnn-chevron.entry.js +0 -30
- package/dist/esm/dnn-chevron.entry.js.map +0 -1
- package/dist/esm/dnn-collapsible.entry.js +0 -65
- package/dist/esm/dnn-collapsible.entry.js.map +0 -1
- package/dist/esm/dnn-color-picker.entry.js +0 -504
- package/dist/esm/dnn-color-picker.entry.js.map +0 -1
- package/dist/esm/dnn-dropzone.entry.js +0 -149
- package/dist/esm/dnn-dropzone.entry.js.map +0 -1
- package/dist/esm/dnn-image-cropper.entry.js +0 -404
- package/dist/esm/dnn-image-cropper.entry.js.map +0 -1
- package/dist/esm/dnn-modal.entry.js +0 -61
- package/dist/esm/dnn-modal.entry.js.map +0 -1
- package/dist/esm/dnn-permissions-grid.entry.js +0 -316
- package/dist/esm/dnn-permissions-grid.entry.js.map +0 -1
- package/dist/esm/dnn-searchbox.entry.js +0 -62
- package/dist/esm/dnn-searchbox.entry.js.map +0 -1
- package/dist/esm/dnn-sort-icon.entry.js +0 -39
- package/dist/esm/dnn-sort-icon.entry.js.map +0 -1
- package/dist/esm/dnn-tab.entry.js +0 -27
- package/dist/esm/dnn-tab.entry.js.map +0 -1
- package/dist/esm/dnn-tabs.entry.js +0 -48
- package/dist/esm/dnn-tabs.entry.js.map +0 -1
- package/dist/esm/dnn-toggle.entry.js +0 -33
- package/dist/esm/dnn-toggle.entry.js.map +0 -1
- package/dist/esm/dnn-treeview-item.entry.js +0 -64
- package/dist/esm/dnn-treeview-item.entry.js.map +0 -1
- package/dist/esm/dnn-vertical-overflow-menu.entry.js +0 -120
- package/dist/esm/dnn-vertical-overflow-menu.entry.js.map +0 -1
- package/dist/esm/dnn-vertical-splitview.entry.js +0 -129
- package/dist/esm/dnn-vertical-splitview.entry.js.map +0 -1
- package/dist/esm/dom-a385e381.js +0 -75
- package/dist/esm/dom-a385e381.js.map +0 -1
- package/dist/esm/index-20e42ad7.js +0 -3059
- package/dist/esm/index-20e42ad7.js.map +0 -1
- package/dist/esm/mouseUtilities-b261ca4f.js +0 -23
- package/dist/esm/mouseUtilities-b261ca4f.js.map +0 -1
- package/dist/esm/shadow-css-ef431969.js +0 -390
- package/dist/esm/shadow-css-ef431969.js.map +0 -1
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, f as Host, g as getElement } from './index-20e42ad7.js';
|
|
2
|
-
|
|
3
|
-
const dnnVerticalOverflowMenuCss = ":host{--background-color:var(--dnn-color-primary-contrast, white);--foreground-color:var(--dnn-color-primary, #3792ED);display:block}.menu-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;background-color:var(--background-color)}.menu-container .menu{margin:0.5em;display:-ms-flexbox;display:flex;gap:1em;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;white-space:nowrap;width:100%}.menu-container .overflow{margin-left:auto;position:relative}.menu-container .overflow button{cursor:pointer;padding:0;margin:0;background-color:transparent;border:none}.menu-container .overflow button svg{fill:var(--foreground-color)}.menu-container .overflow .dropdown{position:absolute;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;white-space:nowrap;right:0;-webkit-transition:100ms ease-in-out;transition:100ms ease-in-out;height:0;overflow:hidden}.menu-container .overflow .dropdown.visible{padding:1em;gap:0.5em;background-color:var(--background-color);-webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.7);box-shadow:2px 2px 4px rgba(0, 0, 0, 0.7)}";
|
|
4
|
-
|
|
5
|
-
const DnnVerticalOverflowMenu = class {
|
|
6
|
-
constructor(hostRef) {
|
|
7
|
-
registerInstance(this, hostRef);
|
|
8
|
-
this.showDropdownButton = false;
|
|
9
|
-
this.showDropdownMenu = false;
|
|
10
|
-
this.previousMenuWidth = 0;
|
|
11
|
-
}
|
|
12
|
-
componentDidRender() {
|
|
13
|
-
requestAnimationFrame(() => {
|
|
14
|
-
this.moveItemsToDropDownIfNecessery();
|
|
15
|
-
this.resizeObserver = new ResizeObserver(entries => {
|
|
16
|
-
for (let entry of entries) {
|
|
17
|
-
if (entry.contentRect.width < this.previousMenuWidth) {
|
|
18
|
-
this.moveItemsToDropDownIfNecessery();
|
|
19
|
-
}
|
|
20
|
-
if (this.previousMenuWidth > 0 && entry.contentRect.width > this.previousMenuWidth) {
|
|
21
|
-
this.moveItemsToMenuIfPossible();
|
|
22
|
-
}
|
|
23
|
-
this.previousMenuWidth = entry.contentRect.width;
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
this.resizeObserver.observe(this.element);
|
|
27
|
-
});
|
|
28
|
-
}
|
|
29
|
-
moveItemsToDropDownIfNecessery() {
|
|
30
|
-
const menuItems = Array.from(this.menu.querySelector("slot").assignedElements());
|
|
31
|
-
const availableWidth = this.menu.getBoundingClientRect().width;
|
|
32
|
-
let neededWidth = parseFloat(getComputedStyle(this.element).fontSize) * 2;
|
|
33
|
-
menuItems.forEach(item => neededWidth += this.getFullWidth(item));
|
|
34
|
-
neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);
|
|
35
|
-
if (neededWidth > availableWidth) {
|
|
36
|
-
this.showDropdownButton = true;
|
|
37
|
-
var lastItem = menuItems[menuItems.length - 1];
|
|
38
|
-
if (this.dropdown == undefined) {
|
|
39
|
-
return;
|
|
40
|
-
}
|
|
41
|
-
lastItem.slot = "dropdown";
|
|
42
|
-
this.moveItemsToDropDownIfNecessery();
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
moveItemsToMenuIfPossible() {
|
|
46
|
-
if (this.dropdown == undefined || !this.dropdown.hasChildNodes()) {
|
|
47
|
-
return;
|
|
48
|
-
}
|
|
49
|
-
const menuItems = Array.from(this.menu.querySelector("slot").assignedElements());
|
|
50
|
-
const availableWidth = this.menu.getBoundingClientRect().width;
|
|
51
|
-
let neededWidth = parseFloat(getComputedStyle(this.element).fontSize) * 2;
|
|
52
|
-
neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);
|
|
53
|
-
menuItems.forEach(item => neededWidth += this.getFullWidth(item));
|
|
54
|
-
const firstItem = this.dropdown.querySelector("slot").assignedElements()[0];
|
|
55
|
-
if (firstItem != undefined) {
|
|
56
|
-
neededWidth += this.getFullWidth(firstItem);
|
|
57
|
-
}
|
|
58
|
-
if (neededWidth < availableWidth) {
|
|
59
|
-
if (firstItem != undefined) {
|
|
60
|
-
firstItem.slot = "";
|
|
61
|
-
}
|
|
62
|
-
if (firstItem == undefined) {
|
|
63
|
-
this.dropdown.classList.remove("visible");
|
|
64
|
-
this.showDropdownMenu = false;
|
|
65
|
-
this.showDropdownButton = false;
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
getFullWidth(item) {
|
|
70
|
-
var width = item.getBoundingClientRect().width;
|
|
71
|
-
var styles = getComputedStyle(item);
|
|
72
|
-
width += parseFloat(styles.marginLeft);
|
|
73
|
-
width += parseFloat(styles.marginRight);
|
|
74
|
-
width += parseFloat(styles.paddingLeft);
|
|
75
|
-
width += parseFloat(styles.paddingRight);
|
|
76
|
-
return width;
|
|
77
|
-
}
|
|
78
|
-
toggleOverflowMenu() {
|
|
79
|
-
this.showDropdownMenu = !this.showDropdownMenu;
|
|
80
|
-
if (this.showDropdownMenu) {
|
|
81
|
-
this.dropdown.classList.add("visible");
|
|
82
|
-
let contentHeight = 0;
|
|
83
|
-
const items = Array.from(this.dropdown.querySelector("slot").assignedElements());
|
|
84
|
-
items.forEach(item => contentHeight += item.getBoundingClientRect().height);
|
|
85
|
-
const emHeight = parseFloat(getComputedStyle(this.dropdown).fontSize);
|
|
86
|
-
const gapsHeight = emHeight * (this.dropdown.children.length - 1) / 2;
|
|
87
|
-
contentHeight += gapsHeight;
|
|
88
|
-
const marginHeight = emHeight * 2;
|
|
89
|
-
contentHeight += marginHeight;
|
|
90
|
-
this.dropdown.style.height = `${contentHeight}px`;
|
|
91
|
-
const dismissMenu = (e) => {
|
|
92
|
-
const buttonRect = this.button.getBoundingClientRect();
|
|
93
|
-
if (e.clientX < buttonRect.left ||
|
|
94
|
-
e.clientX > buttonRect.right ||
|
|
95
|
-
e.clientY < buttonRect.top ||
|
|
96
|
-
e.clientY > buttonRect.bottom) {
|
|
97
|
-
this.toggleOverflowMenu();
|
|
98
|
-
}
|
|
99
|
-
document.removeEventListener("click", dismissMenu);
|
|
100
|
-
};
|
|
101
|
-
setTimeout(() => {
|
|
102
|
-
document.addEventListener("click", dismissMenu, false);
|
|
103
|
-
}, 100);
|
|
104
|
-
}
|
|
105
|
-
else {
|
|
106
|
-
this.dropdown.classList.remove("visible");
|
|
107
|
-
this.dropdown.style.height = "0px";
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
render() {
|
|
111
|
-
return (h(Host, null, h("div", { class: "menu-container" }, h("div", { class: "menu", ref: el => this.menu = el }, h("slot", null)), this.showDropdownButton &&
|
|
112
|
-
h("div", { class: "overflow" }, h("button", { ref: el => this.button = el, class: "icon", onClick: () => this.toggleOverflowMenu() }, h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" }, h("path", { d: "M0 0h24v24H0z", fill: "none" }), h("path", { d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }))), h("div", { class: "dropdown", ref: el => this.dropdown = el }, h("slot", { name: "dropdown" }))))));
|
|
113
|
-
}
|
|
114
|
-
get element() { return getElement(this); }
|
|
115
|
-
};
|
|
116
|
-
DnnVerticalOverflowMenu.style = dnnVerticalOverflowMenuCss;
|
|
117
|
-
|
|
118
|
-
export { DnnVerticalOverflowMenu as dnn_vertical_overflow_menu };
|
|
119
|
-
|
|
120
|
-
//# sourceMappingURL=dnn-vertical-overflow-menu.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"dnn-vertical-overflow-menu.entry.esm.js","mappings":";;AAAA,MAAM,0BAA0B,GAAG,0qCAA0qC;;MCOhsC,uBAAuB;EALpC;;IASW,uBAAkB,GAAG,KAAK,CAAC;IAC3B,qBAAgB,GAAG,KAAK,CAAC;IAM1B,sBAAiB,GAAG,CAAC,CAAC;GAmI/B;EAjIC,kBAAkB;IAChB,qBAAqB,CAAC;MACpB,IAAI,CAAC,8BAA8B,EAAE,CAAC;MACtC,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,OAAO;QAC9C,KAAK,IAAI,KAAK,IAAI,OAAO,EAAC;UACxB,IAAI,KAAK,CAAC,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,EAAC;YACnD,IAAI,CAAC,8BAA8B,EAAE,CAAA;WACtC;UACD,IAAI,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,KAAK,CAAC,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,EAAC;YACjF,IAAI,CAAC,yBAAyB,EAAE,CAAC;WAClC;UACD,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;SAClD;OACF,CAAC,CAAC;MACH,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAC3C,CAAC,CAAC;GACJ;EAEO,8BAA8B;IACpC,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC;IACjF,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;IAC/D,IAAI,WAAW,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,GAAC,CAAC,CAAC;IACxE,SAAS,CAAC,OAAO,CAAC,IAAI,IAAI,WAAW,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAClE,WAAW,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC5F,IAAI,WAAW,GAAG,cAAc,EAAC;MAC/B,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;MAC/B,IAAI,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAE,CAAC,CAAC,CAAC;MAC9C,IAAI,IAAI,CAAC,QAAQ,IAAI,SAAS,EAAC;QAC7B,OAAO;OACR;MACD,QAAQ,CAAC,IAAI,GAAG,UAAU,CAAC;MAC3B,IAAI,CAAC,8BAA8B,EAAE,CAAC;KACvC;GACF;EAEO,yBAAyB;IAC/B,IAAI,IAAI,CAAC,QAAQ,IAAI,SAAS,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,EAAC;MAC/D,OAAO;KACR;IACD,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC;IACjF,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;IAC/D,IAAI,WAAW,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,GAAC,CAAC,CAAC;IACxE,WAAW,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC5F,SAAS,CAAC,OAAO,CAAC,IAAI,IAAI,WAAW,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAClE,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC;IAC5E,IAAI,SAAS,IAAI,SAAS,EAAC;MACzB,WAAW,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;KAC7C;IAED,IAAI,WAAW,GAAG,cAAc,EAAC;MAC/B,IAAI,SAAS,IAAI,SAAS,EAAC;QACzB,SAAS,CAAC,IAAI,GAAG,EAAE,CAAC;OACrB;MACD,IAAG,SAAS,IAAI,SAAS,EAAC;QACxB,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAC1C,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;OACjC;KACF;GACF;EAEO,YAAY,CAAC,IAAa;IAChC,IAAI,KAAK,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;IAC/C,IAAI,MAAM,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACpC,KAAK,IAAI,UAAU,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IACvC,KAAK,IAAI,UAAU,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,IAAI,UAAU,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,IAAI,UAAU,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACzC,OAAO,KAAK,CAAC;GACd;EAEO,kBAAkB;IACxB,IAAI,CAAC,gBAAgB,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC;IAC/C,IAAI,IAAI,CAAC,gBAAgB,EAAC;MACxB,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;MACvC,IAAI,aAAa,GAAG,CAAC,CAAC;MACtB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC;MACjF,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,aAAa,IAAI,IAAI,CAAC,qBAAqB,EAAE,CAAC,MAAM,CAAC,CAAC;MAC5E,MAAM,QAAQ,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC;MACtE,MAAM,UAAU,GAAG,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;MACtE,aAAa,IAAI,UAAU,CAAC;MAC5B,MAAM,YAAY,GAAG,QAAQ,GAAG,CAAC,CAAC;MAClC,aAAa,IAAI,YAAY,CAAC;MAC9B,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,aAAa,IAAI,CAAC;MAClD,MAAM,WAAW,GAAG,CAAC,CAAa;QAChC,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;QACvD,IACE,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,IAAI;UAC3B,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,KAAK;UAC5B,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG;UAC1B,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,MAAM,EAAC;UAC5B,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAC3B;QACD,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;OACtD,CAAC;MACF,UAAU,CAAC;QACT,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC;OACxD,EAAE,GAAG,CAAC,CAAC;KACT;SACG;MACF,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;MAC1C,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;KACpC;GACF;EAED,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAC,gBAAgB,IACzB,WAAK,KAAK,EAAC,MAAM,EAAC,GAAG,EAAE,EAAE,IAAI,IAAI,CAAC,IAAI,GAAG,EAAE,IACzC,eAAa,CACT,EACH,IAAI,CAAC,kBAAkB;MACtB,WAAK,KAAK,EAAC,UAAU,IACnB,cACE,GAAG,EAAE,EAAE,IAAI,IAAI,CAAC,MAAM,GAAG,EAAE,EAC3B,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,MAAM,IAAI,CAAC,kBAAkB,EAAE,IACxC,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS,IAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE,EAAA,YAAM,CAAC,EAAC,mJAAmJ,GAAE,CAAM,CACvS,EACT,WAAK,KAAK,EAAC,UAAU,EAAC,GAAG,EAAE,EAAE,IAAI,IAAI,CAAC,QAAQ,GAAG,EAAE,IACjD,YAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,CACF,CAEJ,CACH,EACP;GACH;;;;;;;","names":[],"sources":["./src/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.scss?tag=dnn-vertical-overflow-menu&encapsulation=shadow","./src/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.tsx"],"sourcesContent":[":host {\n /**\n * @prop --background-color: Defines the menu background color.\n * @prop --foreground-color: A color that contrasts with the background color.\n */\n --background-color: var(--dnn-color-primary-contrast, white);\n --foreground-color: var(--dnn-color-primary, #3792ED);\n\n display: block;\n}\n\n.menu-container{\n display: flex;\n justify-content: flex-start;\n align-items: center;\n background-color: var(--background-color);\n .menu{\n margin: 0.5em;\n display: flex;\n gap: 1em;\n justify-content: flex-start;\n align-items: center;\n white-space: nowrap;\n width: 100%;\n }\n .overflow {\n margin-left: auto;\n position: relative;\n button{\n cursor: pointer;\n svg{\n fill: var(--foreground-color);\n }\n padding: 0;\n margin: 0;\n background-color: transparent;\n border: none;\n }\n .dropdown{\n position:absolute;\n display: flex;\n flex-direction: column;\n white-space: nowrap;\n right: 0;\n transition: 100ms ease-in-out;\n height: 0;\n overflow: hidden;\n &.visible{\n padding: 1em;\n gap: 0.5em;\n background-color: var(--background-color);\n box-shadow: 2px 2px 4px rgba(0,0,0,0.7);\n }\n }\n }\n}\n","import { Component, Element, Host, h, State } from '@stencil/core';\n\n@Component({\n tag: 'dnn-vertical-overflow-menu',\n styleUrl: 'dnn-vertical-overflow-menu.scss',\n shadow: true,\n})\nexport class DnnVerticalOverflowMenu {\n\n @Element() element!: HTMLDnnVerticalOverflowMenuElement;\n \n @State() showDropdownButton = false;\n @State() showDropdownMenu = false;\n\n private menu!: HTMLDivElement;\n private dropdown: HTMLDivElement;\n private resizeObserver: ResizeObserver;\n private button!: HTMLButtonElement;\n private previousMenuWidth = 0;\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.moveItemsToDropDownIfNecessery();\n this.resizeObserver = new ResizeObserver(entries => {\n for (let entry of entries){\n if (entry.contentRect.width < this.previousMenuWidth){\n this.moveItemsToDropDownIfNecessery()\n }\n if (this.previousMenuWidth > 0 && entry.contentRect.width > this.previousMenuWidth){\n this.moveItemsToMenuIfPossible();\n }\n this.previousMenuWidth = entry.contentRect.width;\n }\n });\n this.resizeObserver.observe(this.element);\n });\n }\n\n private moveItemsToDropDownIfNecessery(){\n const menuItems = Array.from(this.menu.querySelector(\"slot\").assignedElements());\n const availableWidth = this.menu.getBoundingClientRect().width;\n let neededWidth = parseFloat(getComputedStyle(this.element).fontSize)*2;\n menuItems.forEach(item => neededWidth += this.getFullWidth(item));\n neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);\n if (neededWidth > availableWidth){\n this.showDropdownButton = true;\n var lastItem = menuItems[menuItems.length -1];\n if (this.dropdown == undefined){\n return;\n }\n lastItem.slot = \"dropdown\";\n this.moveItemsToDropDownIfNecessery();\n }\n }\n \n private moveItemsToMenuIfPossible(){\n if (this.dropdown == undefined || !this.dropdown.hasChildNodes()){\n return;\n }\n const menuItems = Array.from(this.menu.querySelector(\"slot\").assignedElements());\n const availableWidth = this.menu.getBoundingClientRect().width;\n let neededWidth = parseFloat(getComputedStyle(this.element).fontSize)*2;\n neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);\n menuItems.forEach(item => neededWidth += this.getFullWidth(item));\n const firstItem = this.dropdown.querySelector(\"slot\").assignedElements()[0];\n if (firstItem != undefined){\n neededWidth += this.getFullWidth(firstItem);\n }\n\n if (neededWidth < availableWidth){\n if (firstItem != undefined){\n firstItem.slot = \"\";\n }\n if(firstItem == undefined){\n this.dropdown.classList.remove(\"visible\");\n this.showDropdownMenu = false;\n this.showDropdownButton = false;\n }\n } \n }\n\n private getFullWidth(item: Element) {\n var width = item.getBoundingClientRect().width;\n var styles = getComputedStyle(item);\n width += parseFloat(styles.marginLeft);\n width += parseFloat(styles.marginRight);\n width += parseFloat(styles.paddingLeft);\n width += parseFloat(styles.paddingRight);\n return width;\n }\n\n private toggleOverflowMenu(): void {\n this.showDropdownMenu = !this.showDropdownMenu;\n if (this.showDropdownMenu){\n this.dropdown.classList.add(\"visible\");\n let contentHeight = 0;\n const items = Array.from(this.dropdown.querySelector(\"slot\").assignedElements());\n items.forEach(item => contentHeight += item.getBoundingClientRect().height);\n const emHeight = parseFloat(getComputedStyle(this.dropdown).fontSize);\n const gapsHeight = emHeight * (this.dropdown.children.length - 1) / 2;\n contentHeight += gapsHeight;\n const marginHeight = emHeight * 2;\n contentHeight += marginHeight;\n this.dropdown.style.height = `${contentHeight}px`;\n const dismissMenu = (e: MouseEvent) => {\n const buttonRect = this.button.getBoundingClientRect();\n if (\n e.clientX < buttonRect.left ||\n e.clientX > buttonRect.right ||\n e.clientY < buttonRect.top ||\n e.clientY > buttonRect.bottom){\n this.toggleOverflowMenu();\n }\n document.removeEventListener(\"click\", dismissMenu);\n };\n setTimeout(() => {\n document.addEventListener(\"click\", dismissMenu, false);\n }, 100);\n }\n else{\n this.dropdown.classList.remove(\"visible\");\n this.dropdown.style.height = \"0px\";\n }\n }\n\n render() {\n return (\n <Host>\n <div class=\"menu-container\">\n <div class=\"menu\" ref={el => this.menu = el}>\n <slot></slot>\n </div>\n {this.showDropdownButton &&\n <div class=\"overflow\">\n <button\n ref={el => this.button = el}\n class=\"icon\"\n onClick={() => this.toggleOverflowMenu()}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"/></svg>\n </button>\n <div class=\"dropdown\" ref={el => this.dropdown = el}>\n <slot name=\"dropdown\"></slot>\n </div>\n </div>\n }\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./index-c3cc3b5b.system.js"],(function(e){"use strict";var t,o,n,r;return{setters:[function(e){t=e.r;o=e.h;n=e.f;r=e.g}],execute:function(){var i=":host{--background-color:var(--dnn-color-primary-contrast, white);--foreground-color:var(--dnn-color-primary, #3792ED);display:block}.menu-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;background-color:var(--background-color)}.menu-container .menu{margin:0.5em;display:-ms-flexbox;display:flex;gap:1em;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;white-space:nowrap;width:100%}.menu-container .overflow{margin-left:auto;position:relative}.menu-container .overflow button{cursor:pointer;padding:0;margin:0;background-color:transparent;border:none}.menu-container .overflow button svg{fill:var(--foreground-color)}.menu-container .overflow .dropdown{position:absolute;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;white-space:nowrap;right:0;-webkit-transition:100ms ease-in-out;transition:100ms ease-in-out;height:0;overflow:hidden}.menu-container .overflow .dropdown.visible{padding:1em;gap:0.5em;background-color:var(--background-color);-webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.7);box-shadow:2px 2px 4px rgba(0, 0, 0, 0.7)}";var s=e("dnn_vertical_overflow_menu",function(){function e(e){t(this,e);this.showDropdownButton=false;this.showDropdownMenu=false;this.previousMenuWidth=0}e.prototype.componentDidRender=function(){var e=this;requestAnimationFrame((function(){e.moveItemsToDropDownIfNecessery();e.resizeObserver=new ResizeObserver((function(t){for(var o=0,n=t;o<n.length;o++){var r=n[o];if(r.contentRect.width<e.previousMenuWidth){e.moveItemsToDropDownIfNecessery()}if(e.previousMenuWidth>0&&r.contentRect.width>e.previousMenuWidth){e.moveItemsToMenuIfPossible()}e.previousMenuWidth=r.contentRect.width}}));e.resizeObserver.observe(e.element)}))};e.prototype.moveItemsToDropDownIfNecessery=function(){var e=this;var t=Array.from(this.menu.querySelector("slot").assignedElements());var o=this.menu.getBoundingClientRect().width;var n=parseFloat(getComputedStyle(this.element).fontSize)*2;t.forEach((function(t){return n+=e.getFullWidth(t)}));n+=(t.length-1)*parseFloat(getComputedStyle(this.element).fontSize);if(n>o){this.showDropdownButton=true;var r=t[t.length-1];if(this.dropdown==undefined){return}r.slot="dropdown";this.moveItemsToDropDownIfNecessery()}};e.prototype.moveItemsToMenuIfPossible=function(){var e=this;if(this.dropdown==undefined||!this.dropdown.hasChildNodes()){return}var t=Array.from(this.menu.querySelector("slot").assignedElements());var o=this.menu.getBoundingClientRect().width;var n=parseFloat(getComputedStyle(this.element).fontSize)*2;n+=(t.length-1)*parseFloat(getComputedStyle(this.element).fontSize);t.forEach((function(t){return n+=e.getFullWidth(t)}));var r=this.dropdown.querySelector("slot").assignedElements()[0];if(r!=undefined){n+=this.getFullWidth(r)}if(n<o){if(r!=undefined){r.slot=""}if(r==undefined){this.dropdown.classList.remove("visible");this.showDropdownMenu=false;this.showDropdownButton=false}}};e.prototype.getFullWidth=function(e){var t=e.getBoundingClientRect().width;var o=getComputedStyle(e);t+=parseFloat(o.marginLeft);t+=parseFloat(o.marginRight);t+=parseFloat(o.paddingLeft);t+=parseFloat(o.paddingRight);return t};e.prototype.toggleOverflowMenu=function(){var e=this;this.showDropdownMenu=!this.showDropdownMenu;if(this.showDropdownMenu){this.dropdown.classList.add("visible");var t=0;var o=Array.from(this.dropdown.querySelector("slot").assignedElements());o.forEach((function(e){return t+=e.getBoundingClientRect().height}));var n=parseFloat(getComputedStyle(this.dropdown).fontSize);var r=n*(this.dropdown.children.length-1)/2;t+=r;var i=n*2;t+=i;this.dropdown.style.height="".concat(t,"px");var s=function(t){var o=e.button.getBoundingClientRect();if(t.clientX<o.left||t.clientX>o.right||t.clientY<o.top||t.clientY>o.bottom){e.toggleOverflowMenu()}document.removeEventListener("click",s)};setTimeout((function(){document.addEventListener("click",s,false)}),100)}else{this.dropdown.classList.remove("visible");this.dropdown.style.height="0px"}};e.prototype.render=function(){var e=this;return o(n,null,o("div",{class:"menu-container"},o("div",{class:"menu",ref:function(t){return e.menu=t}},o("slot",null)),this.showDropdownButton&&o("div",{class:"overflow"},o("button",{ref:function(t){return e.button=t},class:"icon",onClick:function(){return e.toggleOverflowMenu()}},o("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#000000"},o("path",{d:"M0 0h24v24H0z",fill:"none"}),o("path",{d:"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"}))),o("div",{class:"dropdown",ref:function(t){return e.dropdown=t}},o("slot",{name:"dropdown"})))))};Object.defineProperty(e.prototype,"element",{get:function(){return r(this)},enumerable:false,configurable:true});return e}());s.style=i}}}));
|
|
2
|
-
//# sourceMappingURL=dnn-vertical-overflow-menu.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["src/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.scss?tag=dnn-vertical-overflow-menu&encapsulation=shadow","src/components/dnn-vertical-overflow-menu/dnn-vertical-overflow-menu.tsx"],"names":["dnnVerticalOverflowMenuCss","DnnVerticalOverflowMenu","exports","class_1","hostRef","this","showDropdownButton","showDropdownMenu","previousMenuWidth","prototype","componentDidRender","_this","requestAnimationFrame","moveItemsToDropDownIfNecessery","resizeObserver","ResizeObserver","entries","_i","entries_1","length","entry","contentRect","width","moveItemsToMenuIfPossible","observe","element","menuItems","Array","from","menu","querySelector","assignedElements","availableWidth","getBoundingClientRect","neededWidth","parseFloat","getComputedStyle","fontSize","forEach","item","getFullWidth","lastItem","dropdown","undefined","slot","hasChildNodes","firstItem","classList","remove","styles","marginLeft","marginRight","paddingLeft","paddingRight","toggleOverflowMenu","add","contentHeight_1","items","height","emHeight","gapsHeight","children","marginHeight","style","concat","dismissMenu_1","e","buttonRect","button","clientX","left","right","clientY","top","bottom","document","removeEventListener","setTimeout","addEventListener","render","h","Host","class","ref","el","onClick","xmlns","viewBox","fill","d","name"],"mappings":"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","sourcesContent":[":host {\n /**\n * @prop --background-color: Defines the menu background color.\n * @prop --foreground-color: A color that contrasts with the background color.\n */\n --background-color: var(--dnn-color-primary-contrast, white);\n --foreground-color: var(--dnn-color-primary, #3792ED);\n\n display: block;\n}\n\n.menu-container{\n display: flex;\n justify-content: flex-start;\n align-items: center;\n background-color: var(--background-color);\n .menu{\n margin: 0.5em;\n display: flex;\n gap: 1em;\n justify-content: flex-start;\n align-items: center;\n white-space: nowrap;\n width: 100%;\n }\n .overflow {\n margin-left: auto;\n position: relative;\n button{\n cursor: pointer;\n svg{\n fill: var(--foreground-color);\n }\n padding: 0;\n margin: 0;\n background-color: transparent;\n border: none;\n }\n .dropdown{\n position:absolute;\n display: flex;\n flex-direction: column;\n white-space: nowrap;\n right: 0;\n transition: 100ms ease-in-out;\n height: 0;\n overflow: hidden;\n &.visible{\n padding: 1em;\n gap: 0.5em;\n background-color: var(--background-color);\n box-shadow: 2px 2px 4px rgba(0,0,0,0.7);\n }\n }\n }\n}\n","import { Component, Element, Host, h, State } from '@stencil/core';\n\n@Component({\n tag: 'dnn-vertical-overflow-menu',\n styleUrl: 'dnn-vertical-overflow-menu.scss',\n shadow: true,\n})\nexport class DnnVerticalOverflowMenu {\n\n @Element() element!: HTMLDnnVerticalOverflowMenuElement;\n \n @State() showDropdownButton = false;\n @State() showDropdownMenu = false;\n\n private menu!: HTMLDivElement;\n private dropdown: HTMLDivElement;\n private resizeObserver: ResizeObserver;\n private button!: HTMLButtonElement;\n private previousMenuWidth = 0;\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.moveItemsToDropDownIfNecessery();\n this.resizeObserver = new ResizeObserver(entries => {\n for (let entry of entries){\n if (entry.contentRect.width < this.previousMenuWidth){\n this.moveItemsToDropDownIfNecessery()\n }\n if (this.previousMenuWidth > 0 && entry.contentRect.width > this.previousMenuWidth){\n this.moveItemsToMenuIfPossible();\n }\n this.previousMenuWidth = entry.contentRect.width;\n }\n });\n this.resizeObserver.observe(this.element);\n });\n }\n\n private moveItemsToDropDownIfNecessery(){\n const menuItems = Array.from(this.menu.querySelector(\"slot\").assignedElements());\n const availableWidth = this.menu.getBoundingClientRect().width;\n let neededWidth = parseFloat(getComputedStyle(this.element).fontSize)*2;\n menuItems.forEach(item => neededWidth += this.getFullWidth(item));\n neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);\n if (neededWidth > availableWidth){\n this.showDropdownButton = true;\n var lastItem = menuItems[menuItems.length -1];\n if (this.dropdown == undefined){\n return;\n }\n lastItem.slot = \"dropdown\";\n this.moveItemsToDropDownIfNecessery();\n }\n }\n \n private moveItemsToMenuIfPossible(){\n if (this.dropdown == undefined || !this.dropdown.hasChildNodes()){\n return;\n }\n const menuItems = Array.from(this.menu.querySelector(\"slot\").assignedElements());\n const availableWidth = this.menu.getBoundingClientRect().width;\n let neededWidth = parseFloat(getComputedStyle(this.element).fontSize)*2;\n neededWidth += (menuItems.length - 1) * parseFloat(getComputedStyle(this.element).fontSize);\n menuItems.forEach(item => neededWidth += this.getFullWidth(item));\n const firstItem = this.dropdown.querySelector(\"slot\").assignedElements()[0];\n if (firstItem != undefined){\n neededWidth += this.getFullWidth(firstItem);\n }\n\n if (neededWidth < availableWidth){\n if (firstItem != undefined){\n firstItem.slot = \"\";\n }\n if(firstItem == undefined){\n this.dropdown.classList.remove(\"visible\");\n this.showDropdownMenu = false;\n this.showDropdownButton = false;\n }\n } \n }\n\n private getFullWidth(item: Element) {\n var width = item.getBoundingClientRect().width;\n var styles = getComputedStyle(item);\n width += parseFloat(styles.marginLeft);\n width += parseFloat(styles.marginRight);\n width += parseFloat(styles.paddingLeft);\n width += parseFloat(styles.paddingRight);\n return width;\n }\n\n private toggleOverflowMenu(): void {\n this.showDropdownMenu = !this.showDropdownMenu;\n if (this.showDropdownMenu){\n this.dropdown.classList.add(\"visible\");\n let contentHeight = 0;\n const items = Array.from(this.dropdown.querySelector(\"slot\").assignedElements());\n items.forEach(item => contentHeight += item.getBoundingClientRect().height);\n const emHeight = parseFloat(getComputedStyle(this.dropdown).fontSize);\n const gapsHeight = emHeight * (this.dropdown.children.length - 1) / 2;\n contentHeight += gapsHeight;\n const marginHeight = emHeight * 2;\n contentHeight += marginHeight;\n this.dropdown.style.height = `${contentHeight}px`;\n const dismissMenu = (e: MouseEvent) => {\n const buttonRect = this.button.getBoundingClientRect();\n if (\n e.clientX < buttonRect.left ||\n e.clientX > buttonRect.right ||\n e.clientY < buttonRect.top ||\n e.clientY > buttonRect.bottom){\n this.toggleOverflowMenu();\n }\n document.removeEventListener(\"click\", dismissMenu);\n };\n setTimeout(() => {\n document.addEventListener(\"click\", dismissMenu, false);\n }, 100);\n }\n else{\n this.dropdown.classList.remove(\"visible\");\n this.dropdown.style.height = \"0px\";\n }\n }\n\n render() {\n return (\n <Host>\n <div class=\"menu-container\">\n <div class=\"menu\" ref={el => this.menu = el}>\n <slot></slot>\n </div>\n {this.showDropdownButton &&\n <div class=\"overflow\">\n <button\n ref={el => this.button = el}\n class=\"icon\"\n onClick={() => this.toggleOverflowMenu()}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"/></svg>\n </button>\n <div class=\"dropdown\" ref={el => this.dropdown = el}>\n <slot name=\"dropdown\"></slot>\n </div>\n </div>\n }\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -1,129 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-20e42ad7.js';
|
|
2
|
-
import { g as getMovementFromEvent } from './mouseUtilities-b261ca4f.js';
|
|
3
|
-
|
|
4
|
-
const dnnVerticalSplitviewCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;margin:0 auto;position:relative;--left-pane-background-color:transparent;--right-pane-background-color:transparent}button{border:none;margin:0;padding:0;cursor:ew-resize;position:absolute;height:100%;background-color:transparent}button.transition{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.pane{overflow-y:auto}.pane.transition{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.pane.left{background-color:var(--left-pane-background-color)}.pane.right{background-color:var(--right-pane-background-color);-ms-flex-positive:1;flex-grow:1}";
|
|
5
|
-
|
|
6
|
-
const DnnVerticalSplitview = class {
|
|
7
|
-
constructor(hostRef) {
|
|
8
|
-
registerInstance(this, hostRef);
|
|
9
|
-
this.widthChanged = createEvent(this, "widthChanged", 7);
|
|
10
|
-
/** The width of the splitter area. */
|
|
11
|
-
this.splitterWidth = 16;
|
|
12
|
-
/** The percentage position of the splitter in the container. */
|
|
13
|
-
this.splitWidthPercentage = 30;
|
|
14
|
-
this.leftWidth = 0;
|
|
15
|
-
this.rightWidth = 0;
|
|
16
|
-
}
|
|
17
|
-
/** Sets the width percentage of the divider */
|
|
18
|
-
async setSplitWidthPercentage(newWidth) {
|
|
19
|
-
const panes = this.element.shadowRoot.querySelectorAll(".pane");
|
|
20
|
-
requestAnimationFrame(() => {
|
|
21
|
-
panes.forEach(pane => pane.classList.add("transition"));
|
|
22
|
-
this.splitter.classList.add("transition");
|
|
23
|
-
requestAnimationFrame(() => {
|
|
24
|
-
const fullWidth = this.element.getBoundingClientRect().width;
|
|
25
|
-
let newLeft = fullWidth * newWidth / 100;
|
|
26
|
-
if (newLeft < 0) {
|
|
27
|
-
newLeft = 0;
|
|
28
|
-
}
|
|
29
|
-
if (newLeft > fullWidth) {
|
|
30
|
-
newLeft = fullWidth;
|
|
31
|
-
}
|
|
32
|
-
this.leftWidth = newLeft;
|
|
33
|
-
this.rightWidth = fullWidth - newLeft;
|
|
34
|
-
setTimeout(() => {
|
|
35
|
-
panes.forEach(pane => pane.classList.remove("transition"));
|
|
36
|
-
this.splitter.classList.remove("transition");
|
|
37
|
-
}, 300);
|
|
38
|
-
});
|
|
39
|
-
});
|
|
40
|
-
}
|
|
41
|
-
/** Gets the current divider position percentage. */
|
|
42
|
-
async getSplitWidthPercentage() {
|
|
43
|
-
const fullWidth = this.element.getBoundingClientRect().width;
|
|
44
|
-
return this.leftWidth / fullWidth;
|
|
45
|
-
}
|
|
46
|
-
componentDidLoad() {
|
|
47
|
-
requestAnimationFrame(() => {
|
|
48
|
-
this.resizeObserver = new ResizeObserver(() => {
|
|
49
|
-
const fullWidth = this.element.getBoundingClientRect().width;
|
|
50
|
-
this.leftWidth = fullWidth * this.splitWidthPercentage / 100;
|
|
51
|
-
this.rightWidth = fullWidth - this.leftWidth;
|
|
52
|
-
this.widthChanged.emit(this.splitWidthPercentage);
|
|
53
|
-
});
|
|
54
|
-
this.resizeObserver.observe(this.element);
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
handleMouseDown(event) {
|
|
58
|
-
event.preventDefault();
|
|
59
|
-
const handleDrag = (ev) => {
|
|
60
|
-
requestAnimationFrame(() => {
|
|
61
|
-
let fullWidth = this.element.getBoundingClientRect().width;
|
|
62
|
-
let { movementX } = getMovementFromEvent(ev, this.previousTouch);
|
|
63
|
-
let newLeft = this.leftWidth + movementX;
|
|
64
|
-
if (newLeft < 0) {
|
|
65
|
-
newLeft = 0;
|
|
66
|
-
}
|
|
67
|
-
if (newLeft > fullWidth) {
|
|
68
|
-
newLeft = fullWidth;
|
|
69
|
-
}
|
|
70
|
-
this.leftWidth = newLeft;
|
|
71
|
-
this.rightWidth = fullWidth - newLeft;
|
|
72
|
-
this.splitWidthPercentage = this.leftWidth / fullWidth * 100;
|
|
73
|
-
});
|
|
74
|
-
};
|
|
75
|
-
const handleDragFinished = () => {
|
|
76
|
-
document.removeEventListener("mousemove", handleDrag);
|
|
77
|
-
document.removeEventListener("touchmove", handleDrag);
|
|
78
|
-
const fullWidth = this.element.getBoundingClientRect().width;
|
|
79
|
-
const newPercentage = this.leftWidth / fullWidth * 100;
|
|
80
|
-
this.widthChanged.emit(newPercentage);
|
|
81
|
-
};
|
|
82
|
-
document.addEventListener("mouseup", handleDragFinished);
|
|
83
|
-
document.addEventListener("touchend", handleDragFinished);
|
|
84
|
-
document.addEventListener("mousemove", handleDrag);
|
|
85
|
-
document.addEventListener("touchmove", handleDrag);
|
|
86
|
-
}
|
|
87
|
-
handleKeyDown(e) {
|
|
88
|
-
let movementX = 0;
|
|
89
|
-
switch (e.key) {
|
|
90
|
-
case "ArrowLeft":
|
|
91
|
-
movementX = -10;
|
|
92
|
-
break;
|
|
93
|
-
case "ArrowRight":
|
|
94
|
-
movementX = 10;
|
|
95
|
-
break;
|
|
96
|
-
default:
|
|
97
|
-
return;
|
|
98
|
-
}
|
|
99
|
-
if (e.shiftKey) {
|
|
100
|
-
movementX = movementX * 10;
|
|
101
|
-
}
|
|
102
|
-
const fullWidth = this.element.getBoundingClientRect().width;
|
|
103
|
-
let newLeft = this.leftWidth + movementX;
|
|
104
|
-
if (newLeft < 0) {
|
|
105
|
-
newLeft = 0;
|
|
106
|
-
}
|
|
107
|
-
if (newLeft > fullWidth) {
|
|
108
|
-
newLeft = fullWidth;
|
|
109
|
-
}
|
|
110
|
-
this.leftWidth = newLeft;
|
|
111
|
-
this.rightWidth = fullWidth - this.leftWidth;
|
|
112
|
-
}
|
|
113
|
-
render() {
|
|
114
|
-
return (h(Host, null, h("div", { class: "left pane", style: {
|
|
115
|
-
width: `${this.leftWidth}px`,
|
|
116
|
-
} }, h("slot", { name: "left" })), h("button", { onMouseDown: e => this.handleMouseDown(e), onTouchStart: e => this.handleMouseDown(e), onKeyDown: e => this.handleKeyDown(e), ref: el => this.splitter = el, style: {
|
|
117
|
-
minWidth: `${this.splitterWidth.toString()}px`,
|
|
118
|
-
left: `${this.leftWidth - 2}px`,
|
|
119
|
-
} }, h("slot", null)), h("div", { class: "right pane", style: {
|
|
120
|
-
width: `${this.rightWidth}px`,
|
|
121
|
-
} }, h("slot", { name: "right" }))));
|
|
122
|
-
}
|
|
123
|
-
get element() { return getElement(this); }
|
|
124
|
-
};
|
|
125
|
-
DnnVerticalSplitview.style = dnnVerticalSplitviewCss;
|
|
126
|
-
|
|
127
|
-
export { DnnVerticalSplitview as dnn_vertical_splitview };
|
|
128
|
-
|
|
129
|
-
//# sourceMappingURL=dnn-vertical-splitview.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"dnn-vertical-splitview.entry.esm.js","mappings":"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","names":[],"sources":["./src/components/dnn-vertical-splitview/dnn-vertical-splitview.scss?tag=dnn-vertical-splitview&encapsulation=shadow","./src/components/dnn-vertical-splitview/dnn-vertical-splitview.tsx"],"sourcesContent":[":host {\n /**\n * @prop --left-pane-background-color: Allows customizing the left pane background-color\n * @prop --right-pane-background-color: Allows customizing the right pane background-color\n */\n\n display: flex;\n align-items: stretch;\n margin: 0 auto;\n position: relative;\n\n --left-pane-background-color: transparent;\n --right-pane-background-color: transparent;\n}\n\nbutton{\n border: none;\n margin:0;\n padding:0;\n cursor: ew-resize;\n position: absolute;\n height: 100%;\n background-color: transparent;\n &.transition{\n transition: all 300ms ease-in-out;\n }\n}\n\n\n.pane{\n overflow-y: auto;\n &.transition{\n transition: all 300ms ease-in-out;\n }\n &.left{\n background-color: var(--left-pane-background-color);\n }\n &.right{\n background-color: var(--right-pane-background-color);\n flex-grow: 1;\n }\n}","import { Component, Host, h, Prop, Element, State, Method, Event, EventEmitter } from '@stencil/core';\nimport { getMovementFromEvent } from \"../../utilities/mouseUtilities\";\n\n/**\n * @slot default - The split divider control you want to use.\n * @slot left - The content of the left pane.\n * @slot right - The content of the right pane.\n */\n@Component({\n tag: 'dnn-vertical-splitview',\n styleUrl: 'dnn-vertical-splitview.scss',\n shadow: true,\n})\nexport class DnnVerticalSplitview {\n\n /** The width of the splitter area. */\n @Prop() splitterWidth = 16;\n\n /** The percentage position of the splitter in the container. */\n @Prop({mutable: true}) splitWidthPercentage = 30;\n \n private splitter!: HTMLButtonElement;\n\n private resizeObserver: ResizeObserver;\n\n /** Sets the width percentage of the divider */\n @Method()\n async setSplitWidthPercentage(newWidth: number) {\n const panes = this.element.shadowRoot.querySelectorAll(\".pane\");\n requestAnimationFrame(() => {\n panes.forEach(pane => pane.classList.add(\"transition\"));\n this.splitter.classList.add(\"transition\");\n requestAnimationFrame(() => {\n const fullWidth = this.element.getBoundingClientRect().width;\n let newLeft = fullWidth * newWidth / 100;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - newLeft;\n setTimeout(() => {\n panes.forEach(pane => pane.classList.remove(\"transition\"));\n this.splitter.classList.remove(\"transition\");\n }, 300);\n });\n });\n }\n\n /** Gets the current divider position percentage. */\n @Method()\n async getSplitWidthPercentage(){\n const fullWidth = this.element.getBoundingClientRect().width;\n return this.leftWidth / fullWidth;\n }\n\n /** Fires when the width of the divider changes. */\n @Event() widthChanged: EventEmitter<number>;\n\n @State() leftWidth = 0;\n @State() rightWidth = 0;\n\n @Element() element : HTMLDnnVerticalSplitviewElement;\n \n componentDidLoad() {\n requestAnimationFrame(() => {\n this.resizeObserver = new ResizeObserver(() => {\n const fullWidth = this.element.getBoundingClientRect().width;\n this.leftWidth = fullWidth * this.splitWidthPercentage / 100;\n this.rightWidth = fullWidth - this.leftWidth;\n this.widthChanged.emit(this.splitWidthPercentage);\n });\n this.resizeObserver.observe(this.element);\n });\n }\n \n private previousTouch: Touch;\n\n private handleMouseDown(event: MouseEvent | TouchEvent) {\n event.preventDefault();\n const handleDrag = (ev: MouseEvent | TouchEvent) => {\n requestAnimationFrame(() => {\n let fullWidth = this.element.getBoundingClientRect().width;\n let {movementX} = getMovementFromEvent(ev, this.previousTouch);\n let newLeft = this.leftWidth + movementX;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - newLeft;\n this.splitWidthPercentage = this.leftWidth / fullWidth * 100;\n });\n }\n const handleDragFinished = () => {\n document.removeEventListener(\"mousemove\", handleDrag);\n document.removeEventListener(\"touchmove\", handleDrag);\n const fullWidth = this.element.getBoundingClientRect().width;\n const newPercentage = this.leftWidth / fullWidth * 100;\n this.widthChanged.emit(newPercentage);\n };\n document.addEventListener(\"mouseup\", handleDragFinished);\n document.addEventListener(\"touchend\", handleDragFinished);\n document.addEventListener(\"mousemove\", handleDrag);\n document.addEventListener(\"touchmove\", handleDrag);\n }\n\n private handleKeyDown(e: KeyboardEvent): void {\n let movementX = 0;\n switch (e.key) {\n case \"ArrowLeft\":\n movementX = -10;\n break;\n case \"ArrowRight\":\n movementX = 10;\n break;\n default:\n return;\n }\n if (e.shiftKey){\n movementX = movementX * 10;\n }\n const fullWidth = this.element.getBoundingClientRect().width;\n let newLeft = this.leftWidth + movementX;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - this.leftWidth;\n }\n\n render() {\n return (\n <Host>\n <div class=\"left pane\" style={{\n width: `${this.leftWidth}px`,\n }}>\n <slot name=\"left\"></slot>\n </div>\n <button\n onMouseDown={e => this.handleMouseDown(e)}\n onTouchStart={e => this.handleMouseDown(e)}\n onKeyDown={e => this.handleKeyDown(e)}\n ref={el => this.splitter = el}\n style={{\n minWidth: `${this.splitterWidth.toString()}px`,\n left: `${this.leftWidth - 2}px`,\n }}\n >\n <slot></slot>\n </button>\n <div\n class=\"right pane\"\n style={{\n width: `${this.rightWidth}px`,\n }}>\n <slot name=\"right\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(t,e,n,i){function r(t){return t instanceof n?t:new n((function(e){e(t)}))}return new(n||(n=Promise))((function(n,o){function a(t){try{u(i.next(t))}catch(t){o(t)}}function s(t){try{u(i["throw"](t))}catch(t){o(t)}}function u(t){t.done?n(t.value):r(t.value).then(a,s)}u((i=i.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},i,r,o,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(t){return function(e){return u([t,e])}}function u(a){if(i)throw new TypeError("Generator is already executing.");while(n)try{if(i=1,r&&(o=a[0]&2?r["return"]:a[0]?r["throw"]||((o=r["return"])&&o.call(r),0):r.next)&&!(o=o.call(r,a[1])).done)return o;if(r=0,o)a=[a[0]&2,o.value];switch(a[0]){case 0:case 1:o=a;break;case 4:n.label++;return{value:a[1],done:false};case 5:n.label++;r=a[1];a=[0];continue;case 7:a=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(a[0]===6||a[0]===2)){n=0;continue}if(a[0]===3&&(!o||a[1]>o[0]&&a[1]<o[3])){n.label=a[1];break}if(a[0]===6&&n.label<o[1]){n.label=o[1];o=a;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(a);break}if(o[2])n.ops.pop();n.trys.pop();continue}a=e.call(t,n)}catch(t){a=[6,t];r=0}finally{i=o=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};System.register(["./index-c3cc3b5b.system.js","./mouseUtilities-233ad7e3.system.js"],(function(t){"use strict";var e,n,i,r,o,a;return{setters:[function(t){e=t.r;n=t.e;i=t.h;r=t.f;o=t.g},function(t){a=t.g}],execute:function(){var s=":host{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;margin:0 auto;position:relative;--left-pane-background-color:transparent;--right-pane-background-color:transparent}button{border:none;margin:0;padding:0;cursor:ew-resize;position:absolute;height:100%;background-color:transparent}button.transition{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.pane{overflow-y:auto}.pane.transition{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.pane.left{background-color:var(--left-pane-background-color)}.pane.right{background-color:var(--right-pane-background-color);-ms-flex-positive:1;flex-grow:1}";var u=t("dnn_vertical_splitview",function(){function t(t){e(this,t);this.widthChanged=n(this,"widthChanged",7);this.splitterWidth=16;this.splitWidthPercentage=30;this.leftWidth=0;this.rightWidth=0}t.prototype.setSplitWidthPercentage=function(t){return __awaiter(this,void 0,void 0,(function(){var e;var n=this;return __generator(this,(function(i){e=this.element.shadowRoot.querySelectorAll(".pane");requestAnimationFrame((function(){e.forEach((function(t){return t.classList.add("transition")}));n.splitter.classList.add("transition");requestAnimationFrame((function(){var i=n.element.getBoundingClientRect().width;var r=i*t/100;if(r<0){r=0}if(r>i){r=i}n.leftWidth=r;n.rightWidth=i-r;setTimeout((function(){e.forEach((function(t){return t.classList.remove("transition")}));n.splitter.classList.remove("transition")}),300)}))}));return[2]}))}))};t.prototype.getSplitWidthPercentage=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){t=this.element.getBoundingClientRect().width;return[2,this.leftWidth/t]}))}))};t.prototype.componentDidLoad=function(){var t=this;requestAnimationFrame((function(){t.resizeObserver=new ResizeObserver((function(){var e=t.element.getBoundingClientRect().width;t.leftWidth=e*t.splitWidthPercentage/100;t.rightWidth=e-t.leftWidth;t.widthChanged.emit(t.splitWidthPercentage)}));t.resizeObserver.observe(t.element)}))};t.prototype.handleMouseDown=function(t){var e=this;t.preventDefault();var n=function(t){requestAnimationFrame((function(){var n=e.element.getBoundingClientRect().width;var i=a(t,e.previousTouch).movementX;var r=e.leftWidth+i;if(r<0){r=0}if(r>n){r=n}e.leftWidth=r;e.rightWidth=n-r;e.splitWidthPercentage=e.leftWidth/n*100}))};var i=function(){document.removeEventListener("mousemove",n);document.removeEventListener("touchmove",n);var t=e.element.getBoundingClientRect().width;var i=e.leftWidth/t*100;e.widthChanged.emit(i)};document.addEventListener("mouseup",i);document.addEventListener("touchend",i);document.addEventListener("mousemove",n);document.addEventListener("touchmove",n)};t.prototype.handleKeyDown=function(t){var e=0;switch(t.key){case"ArrowLeft":e=-10;break;case"ArrowRight":e=10;break;default:return}if(t.shiftKey){e=e*10}var n=this.element.getBoundingClientRect().width;var i=this.leftWidth+e;if(i<0){i=0}if(i>n){i=n}this.leftWidth=i;this.rightWidth=n-this.leftWidth};t.prototype.render=function(){var t=this;return i(r,null,i("div",{class:"left pane",style:{width:"".concat(this.leftWidth,"px")}},i("slot",{name:"left"})),i("button",{onMouseDown:function(e){return t.handleMouseDown(e)},onTouchStart:function(e){return t.handleMouseDown(e)},onKeyDown:function(e){return t.handleKeyDown(e)},ref:function(e){return t.splitter=e},style:{minWidth:"".concat(this.splitterWidth.toString(),"px"),left:"".concat(this.leftWidth-2,"px")}},i("slot",null)),i("div",{class:"right pane",style:{width:"".concat(this.rightWidth,"px")}},i("slot",{name:"right"})))};Object.defineProperty(t.prototype,"element",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());u.style=s}}}));
|
|
2
|
-
//# sourceMappingURL=dnn-vertical-splitview.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["src/components/dnn-vertical-splitview/dnn-vertical-splitview.scss?tag=dnn-vertical-splitview&encapsulation=shadow","src/components/dnn-vertical-splitview/dnn-vertical-splitview.tsx"],"names":["dnnVerticalSplitviewCss","DnnVerticalSplitview","exports","class_1","hostRef","this","splitterWidth","splitWidthPercentage","leftWidth","rightWidth","prototype","setSplitWidthPercentage","newWidth","panes","element","shadowRoot","querySelectorAll","requestAnimationFrame","forEach","pane","classList","add","_this","splitter","fullWidth","getBoundingClientRect","width","newLeft","setTimeout","remove","getSplitWidthPercentage","componentDidLoad","resizeObserver","ResizeObserver","widthChanged","emit","observe","handleMouseDown","event","preventDefault","handleDrag","ev","movementX","getMovementFromEvent","previousTouch","handleDragFinished","document","removeEventListener","newPercentage","addEventListener","handleKeyDown","e","key","shiftKey","render","h","Host","class","style","concat","name","onMouseDown","onTouchStart","onKeyDown","ref","el","minWidth","toString","left"],"mappings":"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","sourcesContent":[":host {\n /**\n * @prop --left-pane-background-color: Allows customizing the left pane background-color\n * @prop --right-pane-background-color: Allows customizing the right pane background-color\n */\n\n display: flex;\n align-items: stretch;\n margin: 0 auto;\n position: relative;\n\n --left-pane-background-color: transparent;\n --right-pane-background-color: transparent;\n}\n\nbutton{\n border: none;\n margin:0;\n padding:0;\n cursor: ew-resize;\n position: absolute;\n height: 100%;\n background-color: transparent;\n &.transition{\n transition: all 300ms ease-in-out;\n }\n}\n\n\n.pane{\n overflow-y: auto;\n &.transition{\n transition: all 300ms ease-in-out;\n }\n &.left{\n background-color: var(--left-pane-background-color);\n }\n &.right{\n background-color: var(--right-pane-background-color);\n flex-grow: 1;\n }\n}","import { Component, Host, h, Prop, Element, State, Method, Event, EventEmitter } from '@stencil/core';\nimport { getMovementFromEvent } from \"../../utilities/mouseUtilities\";\n\n/**\n * @slot default - The split divider control you want to use.\n * @slot left - The content of the left pane.\n * @slot right - The content of the right pane.\n */\n@Component({\n tag: 'dnn-vertical-splitview',\n styleUrl: 'dnn-vertical-splitview.scss',\n shadow: true,\n})\nexport class DnnVerticalSplitview {\n\n /** The width of the splitter area. */\n @Prop() splitterWidth = 16;\n\n /** The percentage position of the splitter in the container. */\n @Prop({mutable: true}) splitWidthPercentage = 30;\n \n private splitter!: HTMLButtonElement;\n\n private resizeObserver: ResizeObserver;\n\n /** Sets the width percentage of the divider */\n @Method()\n async setSplitWidthPercentage(newWidth: number) {\n const panes = this.element.shadowRoot.querySelectorAll(\".pane\");\n requestAnimationFrame(() => {\n panes.forEach(pane => pane.classList.add(\"transition\"));\n this.splitter.classList.add(\"transition\");\n requestAnimationFrame(() => {\n const fullWidth = this.element.getBoundingClientRect().width;\n let newLeft = fullWidth * newWidth / 100;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - newLeft;\n setTimeout(() => {\n panes.forEach(pane => pane.classList.remove(\"transition\"));\n this.splitter.classList.remove(\"transition\");\n }, 300);\n });\n });\n }\n\n /** Gets the current divider position percentage. */\n @Method()\n async getSplitWidthPercentage(){\n const fullWidth = this.element.getBoundingClientRect().width;\n return this.leftWidth / fullWidth;\n }\n\n /** Fires when the width of the divider changes. */\n @Event() widthChanged: EventEmitter<number>;\n\n @State() leftWidth = 0;\n @State() rightWidth = 0;\n\n @Element() element : HTMLDnnVerticalSplitviewElement;\n \n componentDidLoad() {\n requestAnimationFrame(() => {\n this.resizeObserver = new ResizeObserver(() => {\n const fullWidth = this.element.getBoundingClientRect().width;\n this.leftWidth = fullWidth * this.splitWidthPercentage / 100;\n this.rightWidth = fullWidth - this.leftWidth;\n this.widthChanged.emit(this.splitWidthPercentage);\n });\n this.resizeObserver.observe(this.element);\n });\n }\n \n private previousTouch: Touch;\n\n private handleMouseDown(event: MouseEvent | TouchEvent) {\n event.preventDefault();\n const handleDrag = (ev: MouseEvent | TouchEvent) => {\n requestAnimationFrame(() => {\n let fullWidth = this.element.getBoundingClientRect().width;\n let {movementX} = getMovementFromEvent(ev, this.previousTouch);\n let newLeft = this.leftWidth + movementX;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - newLeft;\n this.splitWidthPercentage = this.leftWidth / fullWidth * 100;\n });\n }\n const handleDragFinished = () => {\n document.removeEventListener(\"mousemove\", handleDrag);\n document.removeEventListener(\"touchmove\", handleDrag);\n const fullWidth = this.element.getBoundingClientRect().width;\n const newPercentage = this.leftWidth / fullWidth * 100;\n this.widthChanged.emit(newPercentage);\n };\n document.addEventListener(\"mouseup\", handleDragFinished);\n document.addEventListener(\"touchend\", handleDragFinished);\n document.addEventListener(\"mousemove\", handleDrag);\n document.addEventListener(\"touchmove\", handleDrag);\n }\n\n private handleKeyDown(e: KeyboardEvent): void {\n let movementX = 0;\n switch (e.key) {\n case \"ArrowLeft\":\n movementX = -10;\n break;\n case \"ArrowRight\":\n movementX = 10;\n break;\n default:\n return;\n }\n if (e.shiftKey){\n movementX = movementX * 10;\n }\n const fullWidth = this.element.getBoundingClientRect().width;\n let newLeft = this.leftWidth + movementX;\n if (newLeft < 0){\n newLeft = 0;\n }\n if (newLeft > fullWidth){\n newLeft = fullWidth;\n }\n this.leftWidth = newLeft;\n this.rightWidth = fullWidth - this.leftWidth;\n }\n\n render() {\n return (\n <Host>\n <div class=\"left pane\" style={{\n width: `${this.leftWidth}px`,\n }}>\n <slot name=\"left\"></slot>\n </div>\n <button\n onMouseDown={e => this.handleMouseDown(e)}\n onTouchStart={e => this.handleMouseDown(e)}\n onKeyDown={e => this.handleKeyDown(e)}\n ref={el => this.splitter = el}\n style={{\n minWidth: `${this.splitterWidth.toString()}px`,\n left: `${this.leftWidth - 2}px`,\n }}\n >\n <slot></slot>\n </button>\n <div\n class=\"right pane\"\n style={{\n width: `${this.rightWidth}px`,\n }}>\n <slot name=\"right\"></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
|
package/dist/dnn/dnn.system.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./index-c3cc3b5b.system.js","./app-globals-497eb362.system.js"],(function(e,t){"use strict";var n,r,s,i,o,a,c,d,l,m;return{setters:[function(e){n=e.B;r=e.c;s=e.p;i=e.w;o=e.H;a=e.d;c=e.N;d=e.a;l=e.b},function(e){m=e.g}],execute:function(){var e=function(e){return"__sc_import_".concat(e.replace(/\s|-/g,"_"))};var p=function(){if(n.isDev&&!n.isTesting){r("Running in development mode.")}if(n.cssVarShim){s.$cssShim$=i.__cssshim}if(n.cloneNodeFix){h(o.prototype)}if(n.profile&&!performance.mark){performance.mark=performance.measure=function(){};performance.getEntriesByName=function(){return[]}}var e=n.scriptDataOpts||n.safari10||n.dynamicImportShim?Array.from(a.querySelectorAll("script")).find((function(e){return new RegExp("/".concat(c,"(\\.esm)?\\.js($|\\?|#)")).test(e.src)||e.getAttribute("data-stencil-namespace")===c})):null;var l=t.meta.url;var m=n.scriptDataOpts?e["data-opts"]||{}:{};if(n.safari10&&"onbeforeload"in e&&!history.scrollRestoration){return{then:function(){}}}if(!n.safari10&&l!==""){m.resourcesUrl=new URL(".",l).href}else if(n.dynamicImportShim||n.safari10){m.resourcesUrl=new URL(".",new URL(e.getAttribute("data-resources-url")||e.src,i.location.href)).href;if(n.dynamicImportShim){u(m.resourcesUrl,e)}if(n.dynamicImportShim&&!i.customElements){return t.import("./dom-99eb7b76.system.js").then((function(){return m}))}}return d(m)};var u=function(t,n){var r=e(c);try{i[r]=new Function("w","return import(w);//".concat(Math.random()))}catch(e){var s=new Map;i[r]=function(e){var o=new URL(e,t).href;var c=s.get(o);if(!c){var d=a.createElement("script");d.type="module";d.crossOrigin=n.crossOrigin;d.src=URL.createObjectURL(new Blob(["import * as m from '".concat(o,"'; window.").concat(r,".m = m;")],{type:"application/javascript"}));c=new Promise((function(e){d.onload=function(){e(i[r].m);d.remove()}}));s.set(o,c);a.head.appendChild(d)}return c}}};var h=function(e){var t=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return t.call(this,e)}var n=t.call(this,false);var r=this.childNodes;if(e){for(var s=0;s<r.length;s++){if(r[s].nodeType!==2){n.appendChild(r[s].cloneNode(true))}}}return n}};p().then((function(e){m();return l([["dnn-permissions-grid.system",[[1,"dnn-permissions-grid",{permissions:[1040],roleGroups:[16],roles:[16],resx:[16],foundUsers:[16],selectedRoleGroupId:[32],userQuery:[32],pickedUser:[32]}]]],["dnn-image-cropper.system",[[1,"dnn-image-cropper",{width:[2],height:[2],resx:[16],quality:[2],preventUndersized:[4,"prevent-undersized"],view:[32]}]]],["dnn-treeview-item.system",[[1,"dnn-treeview-item",{expanded:[1540],hasChildren:[32]}]]],["dnn-chevron.system",[[1,"dnn-chevron",{expandText:[1,"expand-text"],collapseText:[1,"collapse-text"],expanded:[1540]}]]],["dnn-color-picker.system",[[1,"dnn-color-picker",{color:[1],colorBoxHeight:[1,"color-box-height"],currentColor:[32],rgbDisplay:[32],hslDisplay:[32],hexDisplay:[32]}]]],["dnn-sort-icon.system",[[1,"dnn-sort-icon",{sortDirection:[1,"sort-direction"]}]]],["dnn-tab.system",[[1,"dnn-tab",{tabTitle:[1,"tab-title"],visible:[32],show:[64],hide:[64]}]]],["dnn-tabs.system",[[1,"dnn-tabs",{tabTitles:[32],selectedTabTitle:[32]}]]],["dnn-toggle.system",[[1,"dnn-toggle",{checked:[1028],disabled:[4]}]]],["dnn-vertical-overflow-menu.system",[[1,"dnn-vertical-overflow-menu",{showDropdownButton:[32],showDropdownMenu:[32]}]]],["dnn-vertical-splitview.system",[[1,"dnn-vertical-splitview",{splitterWidth:[2,"splitter-width"],splitWidthPercentage:[1026,"split-width-percentage"],leftWidth:[32],rightWidth:[32],setSplitWidthPercentage:[64],getSplitWidthPercentage:[64]}]]],["dnn-checkbox.system",[[1,"dnn-checkbox",{checked:[1025],useIntermediate:[4,"use-intermediate"],value:[1]}]]],["dnn-dropzone.system",[[1,"dnn-dropzone",{resx:[16],allowedExtensions:[16],allowCameraMode:[4,"allow-camera-mode"],captureQuality:[2,"capture-quality"],canTakeSnapshots:[32],takingPicture:[32]}]]],["dnn-searchbox.system",[[1,"dnn-searchbox",{placeholder:[1],debounced:[4],query:[1025]}]]],["dnn-modal.system",[[1,"dnn-modal",{backdropDismiss:[4,"backdrop-dismiss"],closeText:[1,"close-text"],showCloseButton:[4,"show-close-button"],visible:[1540],show:[64],hide:[64]}]]],["dnn-button.system",[[1,"dnn-button",{type:[1],reversed:[4],size:[1],confirm:[4],confirmYesText:[1,"confirm-yes-text"],confirmNoText:[1,"confirm-no-text"],confirmMessage:[1,"confirm-message"],disabled:[4],modalVisible:[32]}]]],["dnn-collapsible.system",[[1,"dnn-collapsible",{expanded:[516],transitionDuration:[2,"transition-duration"],updateSize:[64]},[[0,"dnnCollapsibleHeightChanged","handleHeightChanged"]]]]]],e)}))}}}));
|
|
2
|
-
//# sourceMappingURL=dnn.system.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"names":["getDynamicImportFunction","namespace","concat","replace","patchBrowser","BUILD","isDev","isTesting","consoleDevInfo","cssVarShim","plt","$cssShim$","win","__cssshim","cloneNodeFix","patchCloneNodeFix","H","prototype","profile","performance","mark","measure","getEntriesByName","scriptElm","scriptDataOpts","safari10","dynamicImportShim","Array","from","doc","querySelectorAll","find","s","RegExp","NAMESPACE","test","src","getAttribute","importMeta","module","meta","url","opts","history","scrollRestoration","then","resourcesUrl","URL","href","location","patchDynamicImport","customElements","import","promiseResolve","base","orgScriptElm","importFunctionName","Function","Math","random","e","moduleMap_1","Map","mod","get","script_1","createElement","type","crossOrigin","createObjectURL","Blob","Promise","resolve","onload","m","remove","set","head","appendChild","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","options","globalScripts","bootstrapLazy","permissions","roleGroups","roles","resx","foundUsers","selectedRoleGroupId","userQuery","pickedUser","width","height","quality","preventUndersized","view","expanded","hasChildren","expandText","collapseText","color","colorBoxHeight","currentColor","rgbDisplay","hslDisplay","hexDisplay","sortDirection","tabTitle","visible","show","hide","tabTitles","selectedTabTitle","checked","disabled","showDropdownButton","showDropdownMenu","splitterWidth","splitWidthPercentage","leftWidth","rightWidth","setSplitWidthPercentage","getSplitWidthPercentage","useIntermediate","value","allowedExtensions","allowCameraMode","captureQuality","canTakeSnapshots","takingPicture","placeholder","debounced","query","backdropDismiss","closeText","showCloseButton","reversed","size","confirm","confirmYesText","confirmNoText","confirmMessage","modalVisible","transitionDuration","updateSize"],"mappings":"gQAKA,IAAMA,EAA2B,SAACC,GAAc,MAAA,eAAAC,OAAeD,EAAUE,QAAQ,QAAS,OAC1F,IAAMC,EAAe,WAEjB,GAAIC,EAAMC,QAAUD,EAAME,UAAW,CACjCC,EAAe,gCAEnB,GAAIH,EAAMI,WAAY,CAElBC,EAAIC,UAAYC,EAAIC,UAExB,GAAIR,EAAMS,aAAc,CAEpBC,EAAkBC,EAAEC,WAExB,GAAIZ,EAAMa,UAAYC,YAAYC,KAAM,CAMpCD,YAAYC,KAAOD,YAAYE,QAAU,aAGzCF,YAAYG,iBAAmB,WAAM,MAAA,IAGzC,IAAMC,EAAYlB,EAAMmB,gBAAkBnB,EAAMoB,UAAYpB,EAAMqB,kBAC5DC,MAAMC,KAAKC,EAAIC,iBAAiB,WAAWC,MAAK,SAACC,GAAM,OAAA,IAAIC,OAAO,IAAA/B,OAAKgC,EAAS,4BAA2BC,KAAKH,EAAEI,MAChHJ,EAAEK,aAAa,4BAA8BH,KAC/C,KACN,IAAMI,EAAaC,EAAAC,KAAAC,IACnB,IAAMC,EAAOrC,EAAMmB,eAAiBD,EAAU,cAAgB,GAAK,GACnE,GAAIlB,EAAMoB,UAAY,iBAAkBF,IAAcoB,QAAQC,kBAAsC,CAQhG,MAAO,CACHC,KAAI,cAKZ,IAAKxC,EAAMoB,UAAYa,IAAe,GAAI,CACtCI,EAAKI,aAAe,IAAIC,IAAI,IAAKT,GAAYU,UAE5C,GAAI3C,EAAMqB,mBAAqBrB,EAAMoB,SAAU,CAChDiB,EAAKI,aAAe,IAAIC,IAAI,IAAK,IAAIA,IAAIxB,EAAUc,aAAa,uBAAyBd,EAAUa,IAAKxB,EAAIqC,SAASD,OAAOA,KAC5H,GAAI3C,EAAMqB,kBAAmB,CACzBwB,EAAmBR,EAAKI,aAAcvB,GAE1C,GAAIlB,EAAMqB,oBAAsBd,EAAIuC,eAAgB,CAGhD,OAAOZ,EAAAa,OAA+C,4BAAYP,MAAK,WAAM,OAAAH,MAGrF,OAAOW,EAAeX,IAE1B,IAAMQ,EAAqB,SAACI,EAAMC,GAC9B,IAAMC,EAAqBxD,EAAyBkC,GACpD,IAKItB,EAAI4C,GAAsB,IAAIC,SAAS,IAAK,sBAAAvD,OAAsBwD,KAAKC,WAE3E,MAAOC,GAIH,IAAMC,EAAY,IAAIC,IACtBlD,EAAI4C,GAAsB,SAACpB,GACvB,IAAMK,EAAM,IAAIM,IAAIX,EAAKkB,GAAMN,KAC/B,IAAIe,EAAMF,EAAUG,IAAIvB,GACxB,IAAKsB,EAAK,CACN,IAAME,EAASpC,EAAIqC,cAAc,UACjCD,EAAOE,KAAO,SACdF,EAAOG,YAAcb,EAAaa,YAClCH,EAAO7B,IAAMW,IAAIsB,gBAAgB,IAAIC,KAAK,CAAC,uBAAApE,OAAuBuC,EAAG,cAAAvC,OAAasD,EAAkB,YAAY,CAC5GW,KAAM,4BAEVJ,EAAM,IAAIQ,SAAQ,SAACC,GACfP,EAAOQ,OAAS,WACZD,EAAQ5D,EAAI4C,GAAoBkB,GAChCT,EAAOU,aAGfd,EAAUe,IAAInC,EAAKsB,GACnBlC,EAAIgD,KAAKC,YAAYb,GAEzB,OAAOF,KAInB,IAAMhD,EAAoB,SAACgE,GACvB,IAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,GAExC,IAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,IAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWR,YAAYS,EAAcE,GAAGR,UAAU,SAI9D,OAAOK,ICrHflF,IAAeyC,MAAK,SAAA+C,GAClBC,IACA,OAAOC,EAAc,CAAA,CAAA,8BAA8B,CAAA,CAAA,EAAA,uBAAS,CAAAC,YAAA,CAAA,MAAAC,WAAA,CAAA,IAAAC,MAAA,CAAA,IAAAC,KAAA,CAAA,IAAAC,WAAA,CAAA,IAAAC,oBAAA,CAAA,IAAAC,UAAA,CAAA,IAAAC,WAAA,CAAA,QAAA,CAAA,2BAAA,CAAA,CAAA,EAAA,oBAAA,CAAAC,MAAA,CAAA,GAAAC,OAAA,CAAA,GAAAN,KAAA,CAAA,IAAAO,QAAA,CAAA,GAAAC,kBAAA,CAAA,EAAA,sBAAAC,KAAA,CAAA,QAAA,CAAA,2BAAA,CAAA,CAAA,EAAA,oBAAA,CAAAC,SAAA,CAAA,MAAAC,YAAA,CAAA,QAAA,CAAA,qBAAA,CAAA,CAAA,EAAA,cAAA,CAAAC,WAAA,CAAA,EAAA,eAAAC,aAAA,CAAA,EAAA,iBAAAH,SAAA,CAAA,UAAA,CAAA,0BAAA,CAAA,CAAA,EAAA,mBAAA,CAAAI,MAAA,CAAA,GAAAC,eAAA,CAAA,EAAA,oBAAAC,aAAA,CAAA,IAAAC,WAAA,CAAA,IAAAC,WAAA,CAAA,IAAAC,WAAA,CAAA,QAAA,CAAA,uBAAA,CAAA,CAAA,EAAA,gBAAA,CAAAC,cAAA,CAAA,EAAA,sBAAA,CAAA,iBAAA,CAAA,CAAA,EAAA,UAAA,CAAAC,SAAA,CAAA,EAAA,aAAAC,QAAA,CAAA,IAAAC,KAAA,CAAA,IAAAC,KAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,CAAA,EAAA,WAAA,CAAAC,UAAA,CAAA,IAAAC,iBAAA,CAAA,QAAA,CAAA,oBAAA,CAAA,CAAA,EAAA,aAAA,CAAAC,QAAA,CAAA,MAAAC,SAAA,CAAA,OAAA,CAAA,oCAAA,CAAA,CAAA,EAAA,6BAAA,CAAAC,mBAAA,CAAA,IAAAC,iBAAA,CAAA,QAAA,CAAA,gCAAA,CAAA,CAAA,EAAA,yBAAA,CAAAC,cAAA,CAAA,EAAA,kBAAAC,qBAAA,CAAA,KAAA,0BAAAC,UAAA,CAAA,IAAAC,WAAA,CAAA,IAAAC,wBAAA,CAAA,IAAAC,wBAAA,CAAA,QAAA,CAAA,sBAAA,CAAA,CAAA,EAAA,eAAA,CAAAT,QAAA,CAAA,MAAAU,gBAAA,CAAA,EAAA,oBAAAC,MAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,CAAA,EAAA,eAAA,CAAAtC,KAAA,CAAA,IAAAuC,kBAAA,CAAA,IAAAC,gBAAA,CAAA,EAAA,qBAAAC,eAAA,CAAA,EAAA,mBAAAC,iBAAA,CAAA,IAAAC,cAAA,CAAA,QAAA,CAAA,uBAAA,CAAA,CAAA,EAAA,gBAAA,CAAAC,YAAA,CAAA,GAAAC,UAAA,CAAA,GAAAC,MAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,CAAA,EAAA,YAAA,CAAAC,gBAAA,CAAA,EAAA,oBAAAC,UAAA,CAAA,EAAA,cAAAC,gBAAA,CAAA,EAAA,qBAAA3B,QAAA,CAAA,MAAAC,KAAA,CAAA,IAAAC,KAAA,CAAA,QAAA,CAAA,oBAAA,CAAA,CAAA,EAAA,aAAA,CAAAvD,KAAA,CAAA,GAAAiF,SAAA,CAAA,GAAAC,KAAA,CAAA,GAAAC,QAAA,CAAA,GAAAC,eAAA,CAAA,EAAA,oBAAAC,cAAA,CAAA,EAAA,mBAAAC,eAAA,CAAA,EAAA,mBAAA3B,SAAA,CAAA,GAAA4B,aAAA,CAAA,QAAA,CAAA,yBAAA,CAAA,CAAA,EAAA,kBAAA,CAAA9C,SAAA,CAAA,KAAA+C,mBAAA,CAAA,EAAA,uBAAAC,WAAA,CAAA,KAAA,CAAA,CAAA,EAAA,8BAAA,4BAAAhE","sourcesContent":["/*\n Stencil Client Patch Browser v2.14.2 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';\nconst getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\\s|-/g, '_')}`;\nconst patchBrowser = () => {\n // NOTE!! This fn cannot use async/await!\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cssVarShim) {\n // shim css vars\n plt.$cssShim$ = win.__cssshim;\n }\n if (BUILD.cloneNodeFix) {\n // opted-in to polyfill cloneNode() for slot polyfilled components\n patchCloneNodeFix(H.prototype);\n }\n if (BUILD.profile && !performance.mark) {\n // not all browsers support performance.mark/measure (Safari 10)\n // because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,\n // simply stub the implementations out.\n // TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)\n // @ts-ignore\n performance.mark = performance.measure = () => {\n /*noop*/\n };\n performance.getEntriesByName = () => [];\n }\n // @ts-ignore\n const scriptElm = BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n s.getAttribute('data-stencil-namespace') === NAMESPACE)\n : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};\n if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {\n // Safari < v11 support: This IF is true if it's Safari below v11.\n // This fn cannot use async/await since Safari didn't support it until v11,\n // however, Safari 10 did support modules. Safari 10 also didn't support \"nomodule\",\n // so both the ESM file and nomodule file would get downloaded. Only Safari\n // has 'onbeforeload' in the script, and \"history.scrollRestoration\" was added\n // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.\n // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.\n return {\n then() {\n /* promise noop */\n },\n };\n }\n if (!BUILD.safari10 && importMeta !== '') {\n opts.resourcesUrl = new URL('.', importMeta).href;\n }\n else if (BUILD.dynamicImportShim || BUILD.safari10) {\n opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;\n if (BUILD.dynamicImportShim) {\n patchDynamicImport(opts.resourcesUrl, scriptElm);\n }\n if (BUILD.dynamicImportShim && !win.customElements) {\n // module support, but no custom elements support (Old Edge)\n // @ts-ignore\n return import(/* webpackChunkName: \"polyfills-dom\" */ './dom.js').then(() => opts);\n }\n }\n return promiseResolve(opts);\n};\nconst patchDynamicImport = (base, orgScriptElm) => {\n const importFunctionName = getDynamicImportFunction(NAMESPACE);\n try {\n // test if this browser supports dynamic imports\n // There is a caching issue in V8, that breaks using import() in Function\n // By generating a random string, we can workaround it\n // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info\n win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);\n }\n catch (e) {\n // this shim is specifically for browsers that do support \"esm\" imports\n // however, they do NOT support \"dynamic\" imports\n // basically this code is for old Edge, v18 and below\n const moduleMap = new Map();\n win[importFunctionName] = (src) => {\n const url = new URL(src, base).href;\n let mod = moduleMap.get(url);\n if (!mod) {\n const script = doc.createElement('script');\n script.type = 'module';\n script.crossOrigin = orgScriptElm.crossOrigin;\n script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {\n type: 'application/javascript',\n }));\n mod = new Promise((resolve) => {\n script.onload = () => {\n resolve(win[importFunctionName].m);\n script.remove();\n };\n });\n moduleMap.set(url, mod);\n doc.head.appendChild(script);\n }\n return mod;\n };\n }\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function (deep) {\n if (this.nodeName === 'TEMPLATE') {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\n","import { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"]}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
System.register([],(function(){"use strict";return{execute:function(){(function(){var t=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function e(e){var n=t.has(e);e=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(e);return!n&&e}function n(t){var e=t.isConnected;if(void 0!==e)return e;for(;t&&!(t.__CE_isImportDocument||t instanceof Document);)t=t.parentNode||(window.ShadowRoot&&t instanceof ShadowRoot?t.host:void 0);return!(!t||!(t.__CE_isImportDocument||t instanceof Document))}function o(t,e){for(;e&&e!==t&&!e.nextSibling;)e=e.parentNode;return e&&e!==t?e.nextSibling:null}function i(t,e,n){n=void 0===n?new Set:n;for(var r=t;r;){if(r.nodeType===Node.ELEMENT_NODE){var a=r;e(a);var c=a.localName;if("link"===c&&"import"===a.getAttribute("rel")){r=a.import;if(r instanceof Node&&!n.has(r))for(n.add(r),r=r.firstChild;r;r=r.nextSibling)i(r,e,n);r=o(t,a);continue}else if("template"===c){r=o(t,a);continue}if(a=a.__CE_shadowRoot)for(a=a.firstChild;a;a=a.nextSibling)i(a,e,n)}r=r.firstChild?r.firstChild:o(t,r)}}function r(t,e,n){t[e]=n}function a(){this.a=new Map;this.g=new Map;this.c=[];this.f=[];this.b=!1}function c(t,e,n){t.a.set(e,n);t.g.set(n.constructorFunction,n)}function l(t,e){t.b=!0;t.c.push(e)}function s(t,e){t.b=!0;t.f.push(e)}function u(t,e){t.b&&i(e,(function(e){return f(t,e)}))}function f(t,e){if(t.b&&!e.__CE_patched){e.__CE_patched=!0;for(var n=0;n<t.c.length;n++)t.c[n](e);for(n=0;n<t.f.length;n++)t.f[n](e)}}function p(t,e){var n=[];i(e,(function(t){return n.push(t)}));for(e=0;e<n.length;e++){var o=n[e];1===o.__CE_state?t.connectedCallback(o):m(t,o)}}function h(t,e){var n=[];i(e,(function(t){return n.push(t)}));for(e=0;e<n.length;e++){var o=n[e];1===o.__CE_state&&t.disconnectedCallback(o)}}function d(t,e,n){n=void 0===n?{}:n;var o=n.u||new Set,r=n.i||function(e){return m(t,e)},a=[];i(e,(function(e){if("link"===e.localName&&"import"===e.getAttribute("rel")){var n=e.import;n instanceof Node&&(n.__CE_isImportDocument=!0,n.__CE_hasRegistry=!0);n&&"complete"===n.readyState?n.__CE_documentLoadHandled=!0:e.addEventListener("load",(function(){var n=e.import;if(!n.__CE_documentLoadHandled){n.__CE_documentLoadHandled=!0;var i=new Set(o);i.delete(n);d(t,n,{u:i,i:r})}}))}else a.push(e)}),o);if(t.b)for(e=0;e<a.length;e++)f(t,a[e]);for(e=0;e<a.length;e++)r(a[e])}function m(t,e){if(void 0===e.__CE_state){var o=e.ownerDocument;if(o.defaultView||o.__CE_isImportDocument&&o.__CE_hasRegistry)if(o=t.a.get(e.localName)){o.constructionStack.push(e);var i=o.constructorFunction;try{try{if(new i!==e)throw Error("The custom element constructor did not produce the element being upgraded.")}finally{o.constructionStack.pop()}}catch(t){throw e.__CE_state=2,t}e.__CE_state=1;e.__CE_definition=o;if(o.attributeChangedCallback)for(o=o.observedAttributes,i=0;i<o.length;i++){var r=o[i],a=e.getAttribute(r);null!==a&&t.attributeChangedCallback(e,r,null,a,null)}n(e)&&t.connectedCallback(e)}}}a.prototype.connectedCallback=function(t){var e=t.__CE_definition;e.connectedCallback&&e.connectedCallback.call(t)};a.prototype.disconnectedCallback=function(t){var e=t.__CE_definition;e.disconnectedCallback&&e.disconnectedCallback.call(t)};a.prototype.attributeChangedCallback=function(t,e,n,o,i){var r=t.__CE_definition;r.attributeChangedCallback&&-1<r.observedAttributes.indexOf(e)&&r.attributeChangedCallback.call(t,e,n,o,i)};function y(t){var e=document;this.c=t;this.a=e;this.b=void 0;d(this.c,this.a);"loading"===this.a.readyState&&(this.b=new MutationObserver(this.f.bind(this)),this.b.observe(this.a,{childList:!0,subtree:!0}))}function b(t){t.b&&t.b.disconnect()}y.prototype.f=function(t){var e=this.a.readyState;"interactive"!==e&&"complete"!==e||b(this);for(e=0;e<t.length;e++)for(var n=t[e].addedNodes,o=0;o<n.length;o++)d(this.c,n[o])};function v(){var t=this;this.b=this.a=void 0;this.c=new Promise((function(e){t.b=e;t.a&&e(t.a)}))}function g(t){if(t.a)throw Error("Already resolved.");t.a=void 0;t.b&&t.b(void 0)}function w(t){this.c=!1;this.a=t;this.j=new Map;this.f=function(t){return t()};this.b=!1;this.g=[];this.o=new y(t)}w.prototype.l=function(t,n){var o=this;if(!(n instanceof Function))throw new TypeError("Custom element constructors must be functions.");if(!e(t))throw new SyntaxError("The element name '"+t+"' is not valid.");if(this.a.a.get(t))throw Error("A custom element with name '"+t+"' has already been defined.");if(this.c)throw Error("A custom element is already being defined.");this.c=!0;try{var i=function(t){var e=r[t];if(void 0!==e&&!(e instanceof Function))throw Error("The '"+t+"' callback must be a function.");return e},r=n.prototype;if(!(r instanceof Object))throw new TypeError("The custom element constructor's prototype is not an object.");var a=i("connectedCallback");var l=i("disconnectedCallback");var s=i("adoptedCallback");var u=i("attributeChangedCallback");var f=n.observedAttributes||[]}catch(t){return}finally{this.c=!1}n={localName:t,constructorFunction:n,connectedCallback:a,disconnectedCallback:l,adoptedCallback:s,attributeChangedCallback:u,observedAttributes:f,constructionStack:[]};c(this.a,t,n);this.g.push(n);this.b||(this.b=!0,this.f((function(){return E(o)})))};w.prototype.i=function(t){d(this.a,t)};function E(t){if(!1!==t.b){t.b=!1;for(var e=t.g,n=[],o=new Map,i=0;i<e.length;i++)o.set(e[i].localName,[]);d(t.a,document,{i:function(e){if(void 0===e.__CE_state){var i=e.localName,r=o.get(i);r?r.push(e):t.a.a.get(i)&&n.push(e)}}});for(i=0;i<n.length;i++)m(t.a,n[i]);for(;0<e.length;){var r=e.shift();i=r.localName;r=o.get(r.localName);for(var a=0;a<r.length;a++)m(t.a,r[a]);(i=t.j.get(i))&&g(i)}}}w.prototype.get=function(t){if(t=this.a.a.get(t))return t.constructorFunction};w.prototype.m=function(t){if(!e(t))return Promise.reject(new SyntaxError("'"+t+"' is not a valid custom element name."));var n=this.j.get(t);if(n)return n.c;n=new v;this.j.set(t,n);this.a.a.get(t)&&!this.g.some((function(e){return e.localName===t}))&&g(n);return n.c};w.prototype.s=function(t){b(this.o);var e=this.f;this.f=function(n){return t((function(){return e(n)}))}};window.CustomElementRegistry=w;w.prototype.define=w.prototype.l;w.prototype.upgrade=w.prototype.i;w.prototype.get=w.prototype.get;w.prototype.whenDefined=w.prototype.m;w.prototype.polyfillWrapFlushCallback=w.prototype.s;var _=window.Document.prototype.createElement,C=window.Document.prototype.createElementNS,N=window.Document.prototype.importNode,S=window.Document.prototype.prepend,T=window.Document.prototype.append,D=window.DocumentFragment.prototype.prepend,k=window.DocumentFragment.prototype.append,A=window.Node.prototype.cloneNode,O=window.Node.prototype.appendChild,j=window.Node.prototype.insertBefore,L=window.Node.prototype.removeChild,M=window.Node.prototype.replaceChild,x=Object.getOwnPropertyDescriptor(window.Node.prototype,"textContent"),H=window.Element.prototype.attachShadow,R=Object.getOwnPropertyDescriptor(window.Element.prototype,"innerHTML"),P=window.Element.prototype.getAttribute,F=window.Element.prototype.setAttribute,I=window.Element.prototype.removeAttribute,z=window.Element.prototype.getAttributeNS,U=window.Element.prototype.setAttributeNS,W=window.Element.prototype.removeAttributeNS,q=window.Element.prototype.insertAdjacentElement,B=window.Element.prototype.insertAdjacentHTML,$=window.Element.prototype.prepend,V=window.Element.prototype.append,X=window.Element.prototype.before,G=window.Element.prototype.after,J=window.Element.prototype.replaceWith,K=window.Element.prototype.remove,Q=window.HTMLElement,Y=Object.getOwnPropertyDescriptor(window.HTMLElement.prototype,"innerHTML"),Z=window.HTMLElement.prototype.insertAdjacentElement,tt=window.HTMLElement.prototype.insertAdjacentHTML;var et=new function(){};function nt(){var t=st;window.HTMLElement=function(){function e(){var e=this.constructor,n=t.g.get(e);if(!n)throw Error("The custom element being constructed was not registered with `customElements`.");var o=n.constructionStack;if(0===o.length)return o=_.call(document,n.localName),Object.setPrototypeOf(o,e.prototype),o.__CE_state=1,o.__CE_definition=n,f(t,o),o;n=o.length-1;var i=o[n];if(i===et)throw Error("The HTMLElement constructor was either called reentrantly for this constructor or called multiple times.");o[n]=et;Object.setPrototypeOf(i,e.prototype);f(t,i);return i}e.prototype=Q.prototype;Object.defineProperty(e.prototype,"constructor",{writable:!0,configurable:!0,enumerable:!1,value:e});return e}()}function ot(t,e,o){function i(e){return function(o){for(var i=[],r=0;r<arguments.length;++r)i[r]=arguments[r];r=[];for(var a=[],c=0;c<i.length;c++){var l=i[c];l instanceof Element&&n(l)&&a.push(l);if(l instanceof DocumentFragment)for(l=l.firstChild;l;l=l.nextSibling)r.push(l);else r.push(l)}e.apply(this,i);for(i=0;i<a.length;i++)h(t,a[i]);if(n(this))for(i=0;i<r.length;i++)a=r[i],a instanceof Element&&p(t,a)}}void 0!==o.h&&(e.prepend=i(o.h));void 0!==o.append&&(e.append=i(o.append))}function it(){var t=st;r(Document.prototype,"createElement",(function(e){if(this.__CE_hasRegistry){var n=t.a.get(e);if(n)return new n.constructorFunction}e=_.call(this,e);f(t,e);return e}));r(Document.prototype,"importNode",(function(e,n){e=N.call(this,e,!!n);this.__CE_hasRegistry?d(t,e):u(t,e);return e}));r(Document.prototype,"createElementNS",(function(e,n){if(this.__CE_hasRegistry&&(null===e||"http://www.w3.org/1999/xhtml"===e)){var o=t.a.get(n);if(o)return new o.constructorFunction}e=C.call(this,e,n);f(t,e);return e}));ot(t,Document.prototype,{h:S,append:T})}function rt(){function t(t,o){Object.defineProperty(t,"textContent",{enumerable:o.enumerable,configurable:!0,get:o.get,set:function(t){if(this.nodeType===Node.TEXT_NODE)o.set.call(this,t);else{var i=void 0;if(this.firstChild){var r=this.childNodes,a=r.length;if(0<a&&n(this)){i=Array(a);for(var c=0;c<a;c++)i[c]=r[c]}}o.set.call(this,t);if(i)for(t=0;t<i.length;t++)h(e,i[t])}}})}var e=st;r(Node.prototype,"insertBefore",(function(t,o){if(t instanceof DocumentFragment){var i=Array.prototype.slice.apply(t.childNodes);t=j.call(this,t,o);if(n(this))for(o=0;o<i.length;o++)p(e,i[o]);return t}i=n(t);o=j.call(this,t,o);i&&h(e,t);n(this)&&p(e,t);return o}));r(Node.prototype,"appendChild",(function(t){if(t instanceof DocumentFragment){var o=Array.prototype.slice.apply(t.childNodes);t=O.call(this,t);if(n(this))for(var i=0;i<o.length;i++)p(e,o[i]);return t}o=n(t);i=O.call(this,t);o&&h(e,t);n(this)&&p(e,t);return i}));r(Node.prototype,"cloneNode",(function(t){t=A.call(this,!!t);this.ownerDocument.__CE_hasRegistry?d(e,t):u(e,t);return t}));r(Node.prototype,"removeChild",(function(t){var o=n(t),i=L.call(this,t);o&&h(e,t);return i}));r(Node.prototype,"replaceChild",(function(t,o){if(t instanceof DocumentFragment){var i=Array.prototype.slice.apply(t.childNodes);t=M.call(this,t,o);if(n(this))for(h(e,o),o=0;o<i.length;o++)p(e,i[o]);return t}i=n(t);var r=M.call(this,t,o),a=n(this);a&&h(e,o);i&&h(e,t);a&&p(e,t);return r}));x&&x.get?t(Node.prototype,x):l(e,(function(e){t(e,{enumerable:!0,configurable:!0,get:function(){for(var t=[],e=0;e<this.childNodes.length;e++){var n=this.childNodes[e];n.nodeType!==Node.COMMENT_NODE&&t.push(n.textContent)}return t.join("")},set:function(t){for(;this.firstChild;)L.call(this,this.firstChild);null!=t&&""!==t&&O.call(this,document.createTextNode(t))}})}))}function at(t){function e(e){return function(o){for(var i=[],r=0;r<arguments.length;++r)i[r]=arguments[r];r=[];for(var a=[],c=0;c<i.length;c++){var l=i[c];l instanceof Element&&n(l)&&a.push(l);if(l instanceof DocumentFragment)for(l=l.firstChild;l;l=l.nextSibling)r.push(l);else r.push(l)}e.apply(this,i);for(i=0;i<a.length;i++)h(t,a[i]);if(n(this))for(i=0;i<r.length;i++)a=r[i],a instanceof Element&&p(t,a)}}var o=Element.prototype;void 0!==X&&(o.before=e(X));void 0!==X&&(o.after=e(G));void 0!==J&&r(o,"replaceWith",(function(e){for(var o=[],i=0;i<arguments.length;++i)o[i]=arguments[i];i=[];for(var r=[],a=0;a<o.length;a++){var c=o[a];c instanceof Element&&n(c)&&r.push(c);if(c instanceof DocumentFragment)for(c=c.firstChild;c;c=c.nextSibling)i.push(c);else i.push(c)}a=n(this);J.apply(this,o);for(o=0;o<r.length;o++)h(t,r[o]);if(a)for(h(t,this),o=0;o<i.length;o++)r=i[o],r instanceof Element&&p(t,r)}));void 0!==K&&r(o,"remove",(function(){var e=n(this);K.call(this);e&&h(t,this)}))}function ct(){function t(t,e){Object.defineProperty(t,"innerHTML",{enumerable:e.enumerable,configurable:!0,get:e.get,set:function(t){var o=this,r=void 0;n(this)&&(r=[],i(this,(function(t){t!==o&&r.push(t)})));e.set.call(this,t);if(r)for(var c=0;c<r.length;c++){var l=r[c];1===l.__CE_state&&a.disconnectedCallback(l)}this.ownerDocument.__CE_hasRegistry?d(a,this):u(a,this);return t}})}function e(t,e){r(t,"insertAdjacentElement",(function(t,o){var i=n(o);t=e.call(this,t,o);i&&h(a,o);n(t)&&p(a,o);return t}))}function o(t,e){function n(t,e){for(var n=[];t!==e;t=t.nextSibling)n.push(t);for(e=0;e<n.length;e++)d(a,n[e])}r(t,"insertAdjacentHTML",(function(t,o){t=t.toLowerCase();if("beforebegin"===t){var i=this.previousSibling;e.call(this,t,o);n(i||this.parentNode.firstChild,this)}else if("afterbegin"===t)i=this.firstChild,e.call(this,t,o),n(this.firstChild,i);else if("beforeend"===t)i=this.lastChild,e.call(this,t,o),n(i||this.firstChild,null);else if("afterend"===t)i=this.nextSibling,e.call(this,t,o),n(this.nextSibling,i);else throw new SyntaxError("The value provided ("+String(t)+") is not one of 'beforebegin', 'afterbegin', 'beforeend', or 'afterend'.")}))}var a=st;H&&r(Element.prototype,"attachShadow",(function(t){t=H.call(this,t);var e=a;if(e.b&&!t.__CE_patched){t.__CE_patched=!0;for(var n=0;n<e.c.length;n++)e.c[n](t)}return this.__CE_shadowRoot=t}));R&&R.get?t(Element.prototype,R):Y&&Y.get?t(HTMLElement.prototype,Y):s(a,(function(e){t(e,{enumerable:!0,configurable:!0,get:function(){return A.call(this,!0).innerHTML},set:function(t){var e="template"===this.localName,n=e?this.content:this,o=C.call(document,this.namespaceURI,this.localName);for(o.innerHTML=t;0<n.childNodes.length;)L.call(n,n.childNodes[0]);for(t=e?o.content:o;0<t.childNodes.length;)O.call(n,t.childNodes[0])}})}));r(Element.prototype,"setAttribute",(function(t,e){if(1!==this.__CE_state)return F.call(this,t,e);var n=P.call(this,t);F.call(this,t,e);e=P.call(this,t);a.attributeChangedCallback(this,t,n,e,null)}));r(Element.prototype,"setAttributeNS",(function(t,e,n){if(1!==this.__CE_state)return U.call(this,t,e,n);var o=z.call(this,t,e);U.call(this,t,e,n);n=z.call(this,t,e);a.attributeChangedCallback(this,e,o,n,t)}));r(Element.prototype,"removeAttribute",(function(t){if(1!==this.__CE_state)return I.call(this,t);var e=P.call(this,t);I.call(this,t);null!==e&&a.attributeChangedCallback(this,t,e,null,null)}));r(Element.prototype,"removeAttributeNS",(function(t,e){if(1!==this.__CE_state)return W.call(this,t,e);var n=z.call(this,t,e);W.call(this,t,e);var o=z.call(this,t,e);n!==o&&a.attributeChangedCallback(this,e,n,o,t)}));Z?e(HTMLElement.prototype,Z):q?e(Element.prototype,q):console.warn("Custom Elements: `Element#insertAdjacentElement` was not patched.");tt?o(HTMLElement.prototype,tt):B?o(Element.prototype,B):console.warn("Custom Elements: `Element#insertAdjacentHTML` was not patched.");ot(a,Element.prototype,{h:$,append:V});at(a)}var lt=window.customElements;if(!lt||lt.forcePolyfill||"function"!=typeof lt.define||"function"!=typeof lt.get){var st=new a;nt();it();ot(st,DocumentFragment.prototype,{h:D,append:k});rt();ct();document.__CE_hasRegistry=!0;var ut=new w(st);Object.defineProperty(window,"customElements",{configurable:!0,enumerable:!0,value:ut})}}).call(self);"string"!==typeof document.baseURI&&Object.defineProperty(Document.prototype,"baseURI",{enumerable:!0,configurable:!0,get:function(){var t=document.querySelector("base");return t&&t.href?t.href:document.URL}});"function"!==typeof window.CustomEvent&&(window.CustomEvent=function(t,e){e=e||{bubbles:!1,cancelable:!1,detail:void 0};var n=document.createEvent("CustomEvent");n.initCustomEvent(t,e.bubbles,e.cancelable,e.detail);return n},window.CustomEvent.prototype=window.Event.prototype);(function(t,e,n){t.composedPath||(t.composedPath=function(){if(this.path)return this.path;var t=this.target;for(this.path=[];null!==t.parentNode;)this.path.push(t),t=t.parentNode;this.path.push(e,n);return this.path})})(Event.prototype,document,window);
|
|
2
|
-
/*!
|
|
3
|
-
Element.closest and Element.matches
|
|
4
|
-
https://github.com/jonathantneal/closest
|
|
5
|
-
Creative Commons Zero v1.0 Universal
|
|
6
|
-
*/(function(t){"function"!==typeof t.matches&&(t.matches=t.msMatchesSelector||t.mozMatchesSelector||t.webkitMatchesSelector||function(t){t=(this.document||this.ownerDocument).querySelectorAll(t);for(var e=0;t[e]&&t[e]!==this;)++e;return!!t[e]});"function"!==typeof t.closest&&(t.closest=function(t){for(var e=this;e&&1===e.nodeType;){if(e.matches(t))return e;e=e.parentNode}return null})})(window.Element.prototype);
|
|
7
|
-
/*!
|
|
8
|
-
Element.getRootNode()
|
|
9
|
-
*/(function(t){function e(t){t=n(t);return t&&11===t.nodeType?e(t.host):t}function n(t){return t&&t.parentNode?n(t.parentNode):t}"function"!==typeof t.getRootNode&&(t.getRootNode=function(t){return t&&t.composed?e(this):n(this)})})(Element.prototype);
|
|
10
|
-
/*!
|
|
11
|
-
Element.isConnected()
|
|
12
|
-
*/(function(t){"isConnected"in t||Object.defineProperty(t,"isConnected",{configurable:!0,enumerable:!0,get:function(){var t=this.getRootNode({composed:!0});return t&&9===t.nodeType}})})(Element.prototype);
|
|
13
|
-
/*!
|
|
14
|
-
Element.remove()
|
|
15
|
-
*/(function(t){t.forEach((function(t){t.hasOwnProperty("remove")||Object.defineProperty(t,"remove",{configurable:!0,enumerable:!0,writable:!0,value:function(){null!==this.parentNode&&this.parentNode.removeChild(this)}})}))})([Element.prototype,CharacterData.prototype,DocumentType.prototype]);
|
|
16
|
-
/*!
|
|
17
|
-
Element.classList
|
|
18
|
-
*/!function(t){"classList"in t||Object.defineProperty(t,"classList",{get:function(){var t=this,e=(t.getAttribute("class")||"").replace(/^\s+|\s$/g,"").split(/\s+/g);function n(){e.length>0?t.setAttribute("class",e.join(" ")):t.removeAttribute("class")}return""===e[0]&&e.splice(0,1),e.toggle=function(t,o){void 0!==o?o?e.add(t):e.remove(t):-1!==e.indexOf(t)?e.splice(e.indexOf(t),1):e.push(t),n()},e.add=function(){for(var t=[].slice.call(arguments),o=0,i=t.length;o<i;o++)-1===e.indexOf(t[o])&&e.push(t[o]);n()},e.remove=function(){for(var t=[].slice.call(arguments),o=0,i=t.length;o<i;o++)-1!==e.indexOf(t[o])&&e.splice(e.indexOf(t[o]),1);n()},e.item=function(t){return e[t]},e.contains=function(t){return-1!==e.indexOf(t)},e.replace=function(t,o){-1!==e.indexOf(t)&&e.splice(e.indexOf(t),1,o),n()},e.value=t.getAttribute("class")||"",e}})}(Element.prototype);
|
|
19
|
-
/*!
|
|
20
|
-
DOMTokenList
|
|
21
|
-
*/(function(t){try{document.body.classList.add()}catch(o){var e=t.add,n=t.remove;t.add=function(){for(var t=0;t<arguments.length;t++)e.call(this,arguments[t])};t.remove=function(){for(var t=0;t<arguments.length;t++)n.call(this,arguments[t])}}})(DOMTokenList.prototype)}}}));
|
|
22
|
-
//# sourceMappingURL=dom-99eb7b76.system.js.map
|