@universal-material/web 3.6.12 → 3.6.14
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/custom-elements.json +8901 -8901
- package/overflow-menu/overflow-menu-item.d.ts +1 -1
- package/overflow-menu/overflow-menu-item.d.ts.map +1 -1
- package/overflow-menu/overflow-menu-item.js +4 -4
- package/overflow-menu/overflow-menu-item.js.map +1 -1
- package/overflow-menu/overflow-menu.js +8 -8
- package/overflow-menu/overflow-menu.js.map +1 -1
- package/package.json +1 -1
- package/vscode.html-custom-data.json +398 -391
|
@@ -2,7 +2,7 @@ import { HTMLTemplateResult, LitElement } from 'lit';
|
|
|
2
2
|
export declare class OverflowMenuItem extends LitElement {
|
|
3
3
|
static styles: import("lit").CSSResult;
|
|
4
4
|
label: string;
|
|
5
|
-
|
|
5
|
+
collapse: 'auto' | 'always';
|
|
6
6
|
icons: HTMLElement[];
|
|
7
7
|
protected render(): HTMLTemplateResult;
|
|
8
8
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overflow-menu-item.d.ts","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGhE,qBACa,gBAAiB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAIpB;IAEU,KAAK,SAAM;
|
|
1
|
+
{"version":3,"file":"overflow-menu-item.d.ts","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGhE,qBACa,gBAAiB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAIpB;IAEU,KAAK,SAAM;IACM,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAU;IAEzC,KAAK,EAAG,WAAW,EAAE,CAAC;cAE5B,MAAM,IAAI,kBAAkB;CAOhD"}
|
|
@@ -5,10 +5,10 @@ let OverflowMenuItem = class OverflowMenuItem extends LitElement {
|
|
|
5
5
|
constructor() {
|
|
6
6
|
super(...arguments);
|
|
7
7
|
this.label = '';
|
|
8
|
-
this.
|
|
8
|
+
this.collapse = 'auto';
|
|
9
9
|
}
|
|
10
10
|
static { this.styles = css `
|
|
11
|
-
:host([
|
|
11
|
+
:host([collapse=always]) {
|
|
12
12
|
display: none;
|
|
13
13
|
}
|
|
14
14
|
`; }
|
|
@@ -24,8 +24,8 @@ __decorate([
|
|
|
24
24
|
property()
|
|
25
25
|
], OverflowMenuItem.prototype, "label", void 0);
|
|
26
26
|
__decorate([
|
|
27
|
-
property({
|
|
28
|
-
], OverflowMenuItem.prototype, "
|
|
27
|
+
property({ reflect: true })
|
|
28
|
+
], OverflowMenuItem.prototype, "collapse", void 0);
|
|
29
29
|
__decorate([
|
|
30
30
|
queryAssignedElements()
|
|
31
31
|
], OverflowMenuItem.prototype, "icons", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overflow-menu-item.js","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAG5E,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QAOO,UAAK,GAAG,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"overflow-menu-item.js","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAG5E,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QAOO,UAAK,GAAG,EAAE,CAAC;QACM,aAAQ,GAAsB,MAAM,CAAC;IAWpE,CAAC;aAlBiB,WAAM,GAAG,GAAG,CAAA;;;;GAI3B,AAJqB,CAIpB;IAOiB,MAAM;QACvB,OAAO,IAAI,CAAA;8BACe,IAAI,CAAC,KAAK;;;KAGnC,CAAC;IACJ,CAAC;;AAXW;IAAX,QAAQ,EAAE;+CAAY;AACM;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDAAsC;AAEzC;IAAxB,qBAAqB,EAAE;+CAAuB;AAVpC,gBAAgB;IAD5B,aAAa,CAAC,sBAAsB,CAAC;GACzB,gBAAgB,CAmB5B","sourcesContent":["import { css, html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\n@customElement('u-overflow-menu-item')\nexport class OverflowMenuItem extends LitElement {\n static override styles = css`\n :host([collapse=always]) {\n display: none;\n }\n `;\n\n @property() label = '';\n @property({ reflect: true }) collapse: 'auto' | 'always' = 'auto';\n\n @queryAssignedElements() icons!: HTMLElement[];\n\n protected override render(): HTMLTemplateResult {\n return html`\n <u-icon-button title=\"${this.label}\">\n <slot></slot>\n </u-icon-button>\n `;\n }\n}\n"]}
|
|
@@ -48,16 +48,16 @@ let OverflowMenu = class OverflowMenu extends LitElement {
|
|
|
48
48
|
}
|
|
49
49
|
#updateMenuToggleVisibility() {
|
|
50
50
|
let collapsedCount = 0;
|
|
51
|
-
let
|
|
51
|
+
let hasAlwaysCollapsedItems = false;
|
|
52
52
|
for (const item of this.#items) {
|
|
53
|
-
|
|
54
|
-
if (this.#
|
|
55
|
-
|
|
53
|
+
hasAlwaysCollapsedItems = hasAlwaysCollapsedItems || item.collapse === 'always';
|
|
54
|
+
if (this.#isNotCollapsedMenuItem(item)) {
|
|
55
|
+
continue;
|
|
56
56
|
}
|
|
57
57
|
collapsedCount++;
|
|
58
58
|
}
|
|
59
59
|
const firstItem = this.#items[0];
|
|
60
|
-
const renderMenu =
|
|
60
|
+
const renderMenu = hasAlwaysCollapsedItems || !!firstItem && (this._renderMenu
|
|
61
61
|
? collapsedCount > 1
|
|
62
62
|
: collapsedCount > 0);
|
|
63
63
|
if (this._renderMenu !== renderMenu) {
|
|
@@ -74,7 +74,7 @@ let OverflowMenu = class OverflowMenu extends LitElement {
|
|
|
74
74
|
const previousCollapsedLength = this.#collapsedItems.length;
|
|
75
75
|
this.#collapsedItems.length = 0;
|
|
76
76
|
for (const item of this.#items) {
|
|
77
|
-
if (this.#
|
|
77
|
+
if (this.#isNotCollapsedMenuItem(item)) {
|
|
78
78
|
continue;
|
|
79
79
|
}
|
|
80
80
|
this.#collapsedItems.push(item);
|
|
@@ -84,8 +84,8 @@ let OverflowMenu = class OverflowMenu extends LitElement {
|
|
|
84
84
|
}
|
|
85
85
|
}, 100);
|
|
86
86
|
}
|
|
87
|
-
#
|
|
88
|
-
return item.offsetTop === this.offsetTop &&
|
|
87
|
+
#isNotCollapsedMenuItem(item) {
|
|
88
|
+
return item.offsetTop === this.offsetTop && item.collapse !== 'always';
|
|
89
89
|
}
|
|
90
90
|
#handleSlotChange(e) {
|
|
91
91
|
const slot = e.target;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overflow-menu.js","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAI9C,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAG5C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;aAC1B,WAAM,GAAG,MAAM,AAAT,CAAU;IACvB,eAAe,CAAgE;IACxF,MAAM,CAA0B;IAEvB,eAAe,CAA0B;IAMlD,OAAO,CAA4B;IAEnC,IAAI,MAAM,CAAC,KAAK;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAErB,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC;QAClC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,MAAO,CAAC,CAAC;IAC7C,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC;IAC9B,CAAC;IAEQ,mBAAmB,CAAiC;IAE7D,mBAAmB,CAAK;IAExB;QACE,KAAK,EAAE,CAAC;QA5BD,oBAAe,GAAmB,IAAI,cAAc,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;QACxF,WAAM,GAAuB,EAAE,CAAC;QAEvB,oBAAe,GAAuB,EAAE,CAAC;QAEzC,gBAAW,GAAG,KAAK,CAAC;QAI7B,YAAO,GAAuB,IAAI,CAAC;QAc1B,wBAAmB,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAE7D,wBAAmB,GAAG,CAAC,CAAC;QAKtB,IAAI,CAAC,mBAAmB,CAAC,IAAI,GAAG,YAAY,CAAC;QAC7C,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC;IAC/D,CAAC;IAEQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;IAC5B,CAAC;IAEQ,oBAAoB;QAC3B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC;IACpC,CAAC;IAED,WAAW;QAET,IAAI,CAAC,2BAA2B,EAAE,CAAC;QACnC,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,2BAA2B;QAEzB,IAAI,cAAc,GAAG,CAAC,CAAC;QACvB,IAAI,
|
|
1
|
+
{"version":3,"file":"overflow-menu.js","sourceRoot":"","sources":["../../src/overflow-menu/overflow-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, render } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { map } from 'lit/directives/map.js';\nimport { when } from 'lit/directives/when.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { OverflowMenuItem } from './overflow-menu-item.js';\nimport { styles } from './overflow-menu.styles.js';\n\n@customElement('u-overflow-menu')\nexport class OverflowMenu extends LitElement {\n static override styles = styles;\n readonly #resizeObserver: ResizeObserver = new ResizeObserver(() => this.#invalidate());\n #items: OverflowMenuItem[] = [];\n\n readonly #collapsedItems: OverflowMenuItem[] = [];\n\n @state() _renderMenu = false;\n\n @query('u-menu') menu?: UmMenu;\n\n #anchor: HTMLElement | null = null;\n @property()\n set anchor(value) {\n this.#anchor = value;\n\n this.#invalidate();\n this.#resizeObserver.disconnect();\n this.#resizeObserver.observe(this.anchor!);\n }\n\n get anchor(): HTMLElement | null {\n return this.#anchor ?? this;\n }\n\n readonly #menuItemsContainer = document.createElement('div');\n\n #updateMenusTimeout = 0;\n\n constructor() {\n super();\n\n this.#menuItemsContainer.slot = 'menu-items';\n setTimeout(() => this.appendChild(this.#menuItemsContainer));\n }\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.anchor = this.anchor;\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.#resizeObserver.disconnect();\n }\n\n #invalidate(): void {\n\n this.#updateMenuToggleVisibility();\n this.#updateMenuItems();\n }\n\n #updateMenuToggleVisibility(): void {\n\n let collapsedCount = 0;\n let hasAlwaysCollapsedItems = false;\n\n for (const item of this.#items) {\n\n hasAlwaysCollapsedItems = hasAlwaysCollapsedItems || item.collapse === 'always';\n\n if (this.#isNotCollapsedMenuItem(item)) {\n continue;\n }\n\n collapsedCount++;\n }\n\n const firstItem = this.#items[0];\n const renderMenu = hasAlwaysCollapsedItems || !!firstItem && (this._renderMenu\n ? collapsedCount > 1\n : collapsedCount > 0);\n\n if (this._renderMenu !== renderMenu) {\n this._renderMenu = renderMenu;\n }\n }\n\n #updateMenuItems(): void {\n\n if (!this._renderMenu) {\n this.#collapsedItems.length = 0;\n return;\n }\n\n clearTimeout(this.#updateMenusTimeout);\n\n this.#updateMenusTimeout = setTimeout(() => {\n const previousCollapsedLength = this.#collapsedItems.length;\n this.#collapsedItems.length = 0;\n\n for (const item of this.#items) {\n\n if (this.#isNotCollapsedMenuItem(item)) {\n continue;\n }\n\n this.#collapsedItems.push(item);\n }\n\n if (previousCollapsedLength !== this.#collapsedItems.length) {\n this.requestUpdate();\n }\n }, 100);\n }\n\n #isNotCollapsedMenuItem(item: OverflowMenuItem) {\n return item.offsetTop === this.offsetTop && item.collapse !== 'always';\n }\n\n #handleSlotChange(e: Event) {\n const slot = e.target as HTMLSlotElement;\n this.#items = slot\n .assignedElements()\n .filter(el => el.tagName === 'U-OVERFLOW-MENU-ITEM')\n .reverse() as OverflowMenuItem[];\n\n this.#invalidate();\n }\n\n protected override render(): HTMLTemplateResult {\n this.#renderMenuItems();\n\n const classes = { 'show-menu': this._renderMenu };\n\n return html`\n <div class=\"container ${classMap(classes)}\">\n <div class=\"items-set\">\n <div class=\"empty-space\"></div>\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n ${when(this._renderMenu, () => html`\n <div class=\"inner-menu\">\n <u-icon-button @click=${{ handleEvent: () => this.menu?.toggle() }}>\n <slot name=\"icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\"\n fill=\"currentColor\">\n <path\n d=\"M480-160q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 \n 33-23.5 56.5T480-160Zm0-240q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 \n 33-23.5 56.5T480-400Zm0-240q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Z\"/>\n </svg>\n </slot>\n </u-icon-button>\n <u-menu anchor-corner=\"end-end\">\n <slot name=\"menu-items\"></slot>\n </u-menu>\n </div>\n `)}\n </div>\n `;\n }\n\n #renderMenuItems() {\n const menuItems = html`\n ${map(\n this.#collapsedItems,\n item => {\n const nodes = item.childNodes.values();\n\n return html`\n <u-menu-item @click=${{ handleEvent: () => item.click() }}>\n <div slot=\"leading-icon\">\n ${map(nodes, node => node.cloneNode(true))}\n </div>\n \n ${item.label}\n </u-menu-item>\n `;\n })}`;\n\n render(menuItems, this.#menuItemsContainer);\n }\n}\n"]}
|