@universal-material/web 3.0.28 → 3.0.29
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/app-bar/top-app-bar.styles.js +1 -1
- package/app-bar/top-app-bar.styles.js.map +1 -1
- package/button/button.js +1 -1
- package/button/button.js.map +1 -1
- package/button/button.styles.d.ts.map +1 -1
- package/button/button.styles.js +10 -5
- package/button/button.styles.js.map +1 -1
- package/button/icon-button.styles.d.ts.map +1 -1
- package/button/icon-button.styles.js +10 -3
- package/button/icon-button.styles.js.map +1 -1
- package/card/card.styles.d.ts.map +1 -1
- package/card/card.styles.js +0 -4
- package/card/card.styles.js.map +1 -1
- package/checkbox/checkbox-list-item.d.ts +11 -0
- package/checkbox/checkbox-list-item.d.ts.map +1 -0
- package/checkbox/checkbox-list-item.js +16 -0
- package/checkbox/checkbox-list-item.js.map +1 -0
- package/checkbox/checkbox.d.ts +13 -8
- package/checkbox/checkbox.d.ts.map +1 -1
- package/checkbox/checkbox.js +51 -52
- package/checkbox/checkbox.js.map +1 -1
- package/{container/container.styles.d.ts → checkbox/checkbox.styles.d.ts} +1 -1
- package/checkbox/checkbox.styles.d.ts.map +1 -0
- package/checkbox/checkbox.styles.js +126 -0
- package/checkbox/checkbox.styles.js.map +1 -0
- package/config.d.ts +3 -0
- package/config.d.ts.map +1 -1
- package/config.js +3 -0
- package/config.js.map +1 -1
- package/css/universal-material.css +3343 -327
- package/css/universal-material.min.css +2 -2
- package/custom-elements.json +3988 -2145
- package/field/field.d.ts +57 -0
- package/field/field.d.ts.map +1 -0
- package/field/field.js +167 -0
- package/field/field.js.map +1 -0
- package/{divider/divider.styles.d.ts → field/field.styles.d.ts} +1 -1
- package/field/field.styles.d.ts.map +1 -0
- package/field/field.styles.js +289 -0
- package/field/field.styles.js.map +1 -0
- package/index.d.ts +35 -26
- package/index.d.ts.map +1 -1
- package/index.js +35 -26
- package/index.js.map +1 -1
- package/list/list-item.d.ts +13 -0
- package/list/list-item.d.ts.map +1 -0
- package/list/list-item.js +33 -0
- package/list/list-item.js.map +1 -0
- package/{container/grid-base.styles.d.ts → list/list-item.styles.d.ts} +1 -1
- package/list/list-item.styles.d.ts.map +1 -0
- package/list/list-item.styles.js +22 -0
- package/list/list-item.styles.js.map +1 -0
- package/list/list.d.ts +11 -0
- package/list/list.d.ts.map +1 -0
- package/{container/container.js → list/list.js} +9 -16
- package/list/list.js.map +1 -0
- package/{container/grid.styles.d.ts → list/list.styles.d.ts} +1 -1
- package/list/list.styles.d.ts.map +1 -0
- package/list/list.styles.js +7 -0
- package/list/list.styles.js.map +1 -0
- package/menu/menu-item.d.ts +2 -0
- package/menu/menu-item.d.ts.map +1 -1
- package/menu/menu-item.js +6 -1
- package/menu/menu-item.js.map +1 -1
- package/menu/menu.d.ts.map +1 -1
- package/menu/menu.js +8 -4
- package/menu/menu.js.map +1 -1
- package/navigation/drawer-item.d.ts +1 -0
- package/navigation/drawer-item.d.ts.map +1 -1
- package/navigation/drawer-item.js +5 -1
- package/navigation/drawer-item.js.map +1 -1
- package/navigation/drawer-item.styles.d.ts.map +1 -1
- package/navigation/drawer-item.styles.js +3 -0
- package/navigation/drawer-item.styles.js.map +1 -1
- package/navigation/drawer.styles.js +1 -1
- package/navigation/drawer.styles.js.map +1 -1
- package/package.json +3 -3
- package/radio/radio-list-item.d.ts +11 -0
- package/radio/radio-list-item.d.ts.map +1 -0
- package/radio/radio-list-item.js +16 -0
- package/radio/radio-list-item.js.map +1 -0
- package/radio/radio.d.ts +24 -0
- package/radio/radio.d.ts.map +1 -0
- package/radio/radio.js +136 -0
- package/radio/radio.js.map +1 -0
- package/radio/radio.styles.d.ts +2 -0
- package/radio/radio.styles.d.ts.map +1 -0
- package/radio/radio.styles.js +97 -0
- package/radio/radio.styles.js.map +1 -0
- package/ripple/ripple.styles.js +1 -1
- package/ripple/ripple.styles.js.map +1 -1
- package/scss/_colors.scss +2 -0
- package/scss/_css-vars.scss +26 -12
- package/scss/_functions.scss +4 -0
- package/scss/_global.scss +23 -0
- package/scss/_layout.scss +5 -0
- package/scss/_reboot.scss +495 -0
- package/scss/_utilities.scss +3 -0
- package/scss/_variables.scss +32 -4
- package/scss/{text-bg → colors}/_text.scss +1 -22
- package/scss/layout/_container.scss +13 -0
- package/scss/layout/_grid.scss +6 -0
- package/scss/layout/_margin-and-gutters.scss +37 -0
- package/scss/mixins/_breakpoints.scss +51 -1
- package/scss/mixins/_text-bg.scss +4 -6
- package/scss/mixins/_typo.scss +18 -0
- package/scss/table/_table.scss +47 -0
- package/scss/universal-material.scss +11 -4
- package/scss/utilities/_divider.scss +13 -0
- package/scss/utilities/_spacing.scss +23 -0
- package/scss/utilities/_text.scss +21 -0
- package/shared/base.styles.js +5 -5
- package/shared/base.styles.js.map +1 -1
- package/shared/button-wrapper.d.ts +2 -1
- package/shared/button-wrapper.d.ts.map +1 -1
- package/shared/button-wrapper.js +8 -2
- package/shared/button-wrapper.js.map +1 -1
- package/shared/button-wrapper.styles.js +2 -2
- package/shared/button-wrapper.styles.js.map +1 -1
- package/shared/selection-control/selection-control-list-item.d.ts +5 -0
- package/shared/selection-control/selection-control-list-item.d.ts.map +1 -0
- package/shared/selection-control/selection-control-list-item.js +25 -0
- package/shared/selection-control/selection-control-list-item.js.map +1 -0
- package/shared/selection-control/selection-control.d.ts +25 -0
- package/shared/selection-control/selection-control.d.ts.map +1 -0
- package/shared/selection-control/selection-control.js +93 -0
- package/shared/selection-control/selection-control.js.map +1 -0
- package/shared/selection-control/selection-control.styles.d.ts +2 -0
- package/shared/selection-control/selection-control.styles.d.ts.map +1 -0
- package/shared/selection-control/selection-control.styles.js +67 -0
- package/shared/selection-control/selection-control.styles.js.map +1 -0
- package/snackbar/snackbar.d.ts +1 -1
- package/snackbar/snackbar.d.ts.map +1 -1
- package/snackbar/snackbar.js +1 -1
- package/snackbar/snackbar.js.map +1 -1
- package/switch/switch-list-item.d.ts +11 -0
- package/switch/switch-list-item.d.ts.map +1 -0
- package/switch/switch-list-item.js +16 -0
- package/switch/switch-list-item.js.map +1 -0
- package/switch/switch.d.ts +14 -0
- package/switch/switch.d.ts.map +1 -0
- package/switch/switch.js +33 -0
- package/switch/switch.js.map +1 -0
- package/switch/switch.styles.d.ts +2 -0
- package/switch/switch.styles.d.ts.map +1 -0
- package/switch/switch.styles.js +142 -0
- package/switch/switch.styles.js.map +1 -0
- package/text-field/text-field.d.ts +23 -0
- package/text-field/text-field.d.ts.map +1 -0
- package/text-field/text-field.js +91 -0
- package/text-field/text-field.js.map +1 -0
- package/text-field/text-field.styles.d.ts +2 -0
- package/text-field/text-field.styles.d.ts.map +1 -0
- package/text-field/text-field.styles.js +5 -0
- package/text-field/text-field.styles.js.map +1 -0
- package/theme/index.d.ts +1 -1
- package/theme/index.d.ts.map +1 -1
- package/theme/index.js +1 -1
- package/theme/index.js.map +1 -1
- package/theme/theme-builder.d.ts.map +1 -1
- package/theme/theme-builder.js +3 -1
- package/theme/theme-builder.js.map +1 -1
- package/container/container.d.ts +0 -12
- package/container/container.d.ts.map +0 -1
- package/container/container.js.map +0 -1
- package/container/container.styles.d.ts.map +0 -1
- package/container/container.styles.js +0 -12
- package/container/container.styles.js.map +0 -1
- package/container/grid-base.d.ts +0 -11
- package/container/grid-base.d.ts.map +0 -1
- package/container/grid-base.js +0 -33
- package/container/grid-base.js.map +0 -1
- package/container/grid-base.styles.d.ts.map +0 -1
- package/container/grid-base.styles.js +0 -114
- package/container/grid-base.styles.js.map +0 -1
- package/container/grid.d.ts +0 -32
- package/container/grid.d.ts.map +0 -1
- package/container/grid.js +0 -106
- package/container/grid.js.map +0 -1
- package/container/grid.styles.d.ts.map +0 -1
- package/container/grid.styles.js +0 -134
- package/container/grid.styles.js.map +0 -1
- package/divider/divider.d.ts +0 -14
- package/divider/divider.d.ts.map +0 -1
- package/divider/divider.js +0 -27
- package/divider/divider.js.map +0 -1
- package/divider/divider.styles.d.ts.map +0 -1
- package/divider/divider.styles.js +0 -15
- package/divider/divider.styles.js.map +0 -1
- package/scss/_common.scss +0 -12
- package/scss/data-table/_data-table.scss +0 -33
- package/scss/data-table/_variables.scss +0 -24
- /package/scss/{text-bg → colors}/_text-bg.scss +0 -0
package/index.js
CHANGED
|
@@ -5,10 +5,16 @@ import './button/fab.js';
|
|
|
5
5
|
import './button/icon-button.js';
|
|
6
6
|
import './card/card.js';
|
|
7
7
|
import './checkbox/checkbox.js';
|
|
8
|
-
import './
|
|
9
|
-
import './
|
|
10
|
-
import './
|
|
8
|
+
import './checkbox/checkbox-list-item.js';
|
|
9
|
+
import './radio/radio.js';
|
|
10
|
+
import './radio/radio-list-item.js';
|
|
11
|
+
import './switch/switch.js';
|
|
12
|
+
import './switch/switch-list-item.js';
|
|
11
13
|
import './elevation/elevation.js';
|
|
14
|
+
import './field/field.js';
|
|
15
|
+
import './text-field/text-field.js';
|
|
16
|
+
import './list/list.js';
|
|
17
|
+
import './list/list-item.js';
|
|
12
18
|
import './menu/menu.js';
|
|
13
19
|
import './menu/menu-item.js';
|
|
14
20
|
import './navigation/drawer.js';
|
|
@@ -16,27 +22,30 @@ import './navigation/drawer-item.js';
|
|
|
16
22
|
import './navigation/side-navigation.js';
|
|
17
23
|
import './ripple/ripple.js';
|
|
18
24
|
import './snackbar/snackbar.js';
|
|
19
|
-
export * from './app-bar/top-app-bar';
|
|
20
|
-
export * from './button/button';
|
|
21
|
-
export * from './button/button-base';
|
|
22
|
-
export * from './button/button-set';
|
|
23
|
-
export * from './button/fab';
|
|
24
|
-
export * from './button/icon-button';
|
|
25
|
-
export * from './card/card';
|
|
26
|
-
export * from './card/card-content';
|
|
27
|
-
export * from './card/card-media';
|
|
28
|
-
export * from './checkbox/checkbox';
|
|
29
|
-
export * from './
|
|
30
|
-
export * from './
|
|
31
|
-
export * from './
|
|
32
|
-
export * from './
|
|
33
|
-
export * from './
|
|
34
|
-
export * from './
|
|
35
|
-
export * from './
|
|
36
|
-
export * from './
|
|
37
|
-
export * from './
|
|
38
|
-
export * from './
|
|
39
|
-
export * from './
|
|
40
|
-
export * from './
|
|
41
|
-
export * from './
|
|
25
|
+
export * from './app-bar/top-app-bar.js';
|
|
26
|
+
export * from './button/button.js';
|
|
27
|
+
export * from './button/button-base.js';
|
|
28
|
+
export * from './button/button-set.js';
|
|
29
|
+
export * from './button/fab.js';
|
|
30
|
+
export * from './button/icon-button.js';
|
|
31
|
+
export * from './card/card.js';
|
|
32
|
+
export * from './card/card-content.js';
|
|
33
|
+
export * from './card/card-media.js';
|
|
34
|
+
export * from './checkbox/checkbox.js';
|
|
35
|
+
export * from './radio/radio.js';
|
|
36
|
+
export * from './switch/switch.js';
|
|
37
|
+
export * from './switch/switch-list-item.js';
|
|
38
|
+
export * from './elevation/elevation.js';
|
|
39
|
+
export * from './field/field.js';
|
|
40
|
+
export * from './text-field/text-field.js';
|
|
41
|
+
export * from './list/list.js';
|
|
42
|
+
export * from './list/list-item.js';
|
|
43
|
+
export * from './menu/menu.js';
|
|
44
|
+
export * from './menu/menu-item.js';
|
|
45
|
+
export * from './navigation/drawer.js';
|
|
46
|
+
export * from './navigation/drawer-item.js';
|
|
47
|
+
export * from './navigation/side-navigation.js';
|
|
48
|
+
export * from './ripple/ripple.js';
|
|
49
|
+
export * from './snackbar/snackbar.js';
|
|
50
|
+
export * from './theme/theme-builder.js';
|
|
42
51
|
//# sourceMappingURL=index.js.map
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,0BAA0B,CAAC;AAClC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,iBAAiB,CAAC;AACzB,OAAO,yBAAyB,CAAC;AACjC,OAAO,gBAAgB,CAAC;AACxB,OAAO,wBAAwB,CAAC;AAChC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,0BAA0B,CAAC;AAClC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,iBAAiB,CAAC;AACzB,OAAO,yBAAyB,CAAC;AACjC,OAAO,gBAAgB,CAAC;AACxB,OAAO,wBAAwB,CAAC;AAChC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,8BAA8B,CAAC;AACtC,OAAO,0BAA0B,CAAC;AAClC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,4BAA4B,CAAC;AACpC,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,iCAAiC,CAAC;AACzC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAEhC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,0BAA0B,CAAC;AACzC,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC","sourcesContent":["import './app-bar/top-app-bar.js';\nimport './button/button.js';\nimport './button/button-set.js';\nimport './button/fab.js';\nimport './button/icon-button.js';\nimport './card/card.js';\nimport './checkbox/checkbox.js';\nimport './checkbox/checkbox-list-item.js';\nimport './radio/radio.js';\nimport './radio/radio-list-item.js';\nimport './switch/switch.js';\nimport './switch/switch-list-item.js';\nimport './elevation/elevation.js';\nimport './field/field.js';\nimport './text-field/text-field.js';\nimport './list/list.js';\nimport './list/list-item.js';\nimport './menu/menu.js';\nimport './menu/menu-item.js';\nimport './navigation/drawer.js';\nimport './navigation/drawer-item.js';\nimport './navigation/side-navigation.js';\nimport './ripple/ripple.js';\nimport './snackbar/snackbar.js';\n\nexport * from './app-bar/top-app-bar.js';\nexport * from './button/button.js';\nexport * from './button/button-base.js';\nexport * from './button/button-set.js';\nexport * from './button/fab.js';\nexport * from './button/icon-button.js';\nexport * from './card/card.js';\nexport * from './card/card-content.js';\nexport * from './card/card-media.js';\nexport * from './checkbox/checkbox.js';\nexport * from './radio/radio.js';\nexport * from './switch/switch.js';\nexport * from './switch/switch-list-item.js';\nexport * from './elevation/elevation.js';\nexport * from './field/field.js';\nexport * from './text-field/text-field.js';\nexport * from './list/list.js';\nexport * from './list/list-item.js';\nexport * from './menu/menu.js';\nexport * from './menu/menu-item.js';\nexport * from './navigation/drawer.js';\nexport * from './navigation/drawer-item.js';\nexport * from './navigation/side-navigation.js';\nexport * from './ripple/ripple.js';\nexport * from './snackbar/snackbar.js';\nexport * from './theme/theme-builder.js';\n"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
2
|
+
import '../ripple/ripple.js';
|
|
3
|
+
export declare class UmListItem extends LitElement {
|
|
4
|
+
static styles: import("lit").CSSResult;
|
|
5
|
+
selectable: boolean;
|
|
6
|
+
render(): HTMLTemplateResult;
|
|
7
|
+
}
|
|
8
|
+
declare global {
|
|
9
|
+
interface HTMLElementTagNameMap {
|
|
10
|
+
'u-list-item': UmListItem;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
//# sourceMappingURL=list-item.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list-item.d.ts","sourceRoot":"","sources":["../../src/list/list-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAKpE,OAAO,qBAAqB,CAAC;AAE7B,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,0BAAU;IAEU,UAAU,UAAS;IAEpD,MAAM,IAAI,kBAAkB;CAQtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { html, LitElement, nothing } from 'lit';
|
|
8
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
9
|
+
import { styles } from './list-item.styles.js';
|
|
10
|
+
import '../ripple/ripple.js';
|
|
11
|
+
let UmListItem = class UmListItem extends LitElement {
|
|
12
|
+
constructor() {
|
|
13
|
+
super(...arguments);
|
|
14
|
+
this.selectable = false;
|
|
15
|
+
}
|
|
16
|
+
render() {
|
|
17
|
+
const ripple = html `<u-ripple></u-ripple>`;
|
|
18
|
+
return html `
|
|
19
|
+
${this.selectable ? ripple : nothing}
|
|
20
|
+
<slot name="leading"></slot>
|
|
21
|
+
<slot></slot>
|
|
22
|
+
<slot name="trailing"></slot>`;
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
UmListItem.styles = styles;
|
|
26
|
+
__decorate([
|
|
27
|
+
property({ type: Boolean, reflect: true })
|
|
28
|
+
], UmListItem.prototype, "selectable", void 0);
|
|
29
|
+
UmListItem = __decorate([
|
|
30
|
+
customElement('u-list-item')
|
|
31
|
+
], UmListItem);
|
|
32
|
+
export { UmListItem };
|
|
33
|
+
//# sourceMappingURL=list-item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list-item.js","sourceRoot":"","sources":["../../src/list/list-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAE/C,OAAO,qBAAqB,CAAC;AAGtB,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAGqC,eAAU,GAAG,KAAK,CAAC;IAU/D,CAAC;IARU,MAAM;QACb,MAAM,MAAM,GAAG,IAAI,CAAA,uBAAuB,CAAC;QAC3C,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;;oCAGN,CAAC;IACnC,CAAC;;AAXe,iBAAM,GAAG,MAAM,AAAT,CAAU;AAEU;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAoB;AAHlD,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAatB","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './list-item.styles.js';\n\nimport '../ripple/ripple.js';\n\n@customElement('u-list-item')\nexport class UmListItem extends LitElement {\n static override styles = styles;\n\n @property({type: Boolean, reflect: true}) selectable = false;\n\n override render(): HTMLTemplateResult {\n const ripple = html`<u-ripple></u-ripple>`;\n return html`\n ${this.selectable ? ripple : nothing}\n <slot name=\"leading\"></slot>\n <slot></slot>\n <slot name=\"trailing\"></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-list-item': UmListItem;\n }\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export declare const styles: import("lit").CSSResult;
|
|
2
|
-
//# sourceMappingURL=
|
|
2
|
+
//# sourceMappingURL=list-item.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list-item.styles.d.ts","sourceRoot":"","sources":["../../src/list/list-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAmBlB,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `
|
|
3
|
+
:host {
|
|
4
|
+
position: relative;
|
|
5
|
+
display: flex;
|
|
6
|
+
align-items: center;
|
|
7
|
+
min-height: var(--u-list-item-min-height, 56px);
|
|
8
|
+
padding-block: var(--u-list-item-block-padding, 8px);
|
|
9
|
+
padding-inline: var(--u-list-item-inline-padding, 16px);
|
|
10
|
+
gap: var(--u-list-item-gap, 16px);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
slot:not([name]) {
|
|
14
|
+
display: block;
|
|
15
|
+
margin-inline-end: auto;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
slot {
|
|
19
|
+
flex-shrink: 0;
|
|
20
|
+
}
|
|
21
|
+
`;
|
|
22
|
+
//# sourceMappingURL=list-item.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list-item.styles.js","sourceRoot":"","sources":["../../src/list/list-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;CAmBzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n position: relative;\n display: flex;\n align-items: center;\n min-height: var(--u-list-item-min-height, 56px);\n padding-block: var(--u-list-item-block-padding, 8px);\n padding-inline: var(--u-list-item-inline-padding, 16px);\n gap: var(--u-list-item-gap, 16px);\n }\n\n slot:not([name]) {\n display: block;\n margin-inline-end: auto;\n }\n\n slot {\n flex-shrink: 0;\n }\n`;\n"]}
|
package/list/list.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
2
|
+
export declare class UmList extends LitElement {
|
|
3
|
+
static styles: import("lit").CSSResult;
|
|
4
|
+
render(): HTMLTemplateResult;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
interface HTMLElementTagNameMap {
|
|
8
|
+
'u-list': UmList;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=list.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/list/list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,qBACa,MAAO,SAAQ,UAAU;IACpC,OAAgB,MAAM,0BAAU;IAEvB,MAAM,IAAI,kBAAkB;CAGtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF"}
|
|
@@ -4,24 +4,17 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
4
4
|
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
|
-
import { html } from 'lit';
|
|
7
|
+
import { html, LitElement } from 'lit';
|
|
8
8
|
import { customElement } from 'lit/decorators.js';
|
|
9
|
-
import { styles
|
|
10
|
-
|
|
11
|
-
import { GridBase } from './grid-base.js';
|
|
12
|
-
import { styles as gridBaseStyles } from './grid-base.styles.js';
|
|
13
|
-
let UmContainer = class UmContainer extends GridBase {
|
|
9
|
+
import { styles } from './list.styles.js';
|
|
10
|
+
let UmList = class UmList extends LitElement {
|
|
14
11
|
render() {
|
|
15
12
|
return html `<slot></slot>`;
|
|
16
13
|
}
|
|
17
14
|
};
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
customElement('u-container')
|
|
25
|
-
], UmContainer);
|
|
26
|
-
export { UmContainer };
|
|
27
|
-
//# sourceMappingURL=container.js.map
|
|
15
|
+
UmList.styles = styles;
|
|
16
|
+
UmList = __decorate([
|
|
17
|
+
customElement('u-list')
|
|
18
|
+
], UmList);
|
|
19
|
+
export { UmList };
|
|
20
|
+
//# sourceMappingURL=list.js.map
|
package/list/list.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.js","sourceRoot":"","sources":["../../src/list/list.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAGnC,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,UAAU;IAG3B,MAAM;QACb,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AAJe,aAAM,GAAG,MAAM,AAAT,CAAU;AADrB,MAAM;IADlB,aAAa,CAAC,QAAQ,CAAC;GACX,MAAM,CAMlB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { styles } from './list.styles.js';\n\n@customElement('u-list')\nexport class UmList extends LitElement {\n static override styles = styles;\n\n override render(): HTMLTemplateResult {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-list': UmList;\n }\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export declare const styles: import("lit").CSSResult;
|
|
2
|
-
//# sourceMappingURL=
|
|
2
|
+
//# sourceMappingURL=list.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.styles.d.ts","sourceRoot":"","sources":["../../src/list/list.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAIlB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.styles.js","sourceRoot":"","sources":["../../src/list/list.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;CAIzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n padding-block: var(--u-list-padding, 8px);\n }\n`;\n"]}
|
package/menu/menu-item.d.ts
CHANGED
|
@@ -15,6 +15,8 @@ export declare class UmMenuItem extends UmButtonWrapper {
|
|
|
15
15
|
*/
|
|
16
16
|
hasBadge: boolean;
|
|
17
17
|
private readonly assignedIcons;
|
|
18
|
+
innerRole: string;
|
|
19
|
+
connectedCallback(): void;
|
|
18
20
|
protected renderContent(): HTMLTemplateResult;
|
|
19
21
|
private handleIconSlotChange;
|
|
20
22
|
}
|
package/menu/menu-item.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAI/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAI9D,qBACa,UAAW,SAAQ,eAAe;IAE7C,OAAgB,MAAM,4BAIpB;IAEF;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAGnF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAEtC,SAAS,SAAc;IAEvB,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IAYtD,OAAO,CAAC,oBAAoB;CAG7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
|
package/menu/menu-item.js
CHANGED
|
@@ -25,6 +25,11 @@ let UmMenuItem = class UmMenuItem extends UmButtonWrapper {
|
|
|
25
25
|
* _Note:_ Readonly
|
|
26
26
|
*/
|
|
27
27
|
this.hasBadge = false;
|
|
28
|
+
this.innerRole = 'menuitem';
|
|
29
|
+
}
|
|
30
|
+
connectedCallback() {
|
|
31
|
+
super.connectedCallback();
|
|
32
|
+
this.role = 'presentation';
|
|
28
33
|
}
|
|
29
34
|
renderContent() {
|
|
30
35
|
return html `
|
|
@@ -34,7 +39,7 @@ let UmMenuItem = class UmMenuItem extends UmButtonWrapper {
|
|
|
34
39
|
aria-hidden="true"
|
|
35
40
|
@slotchange="${this.handleIconSlotChange}"></slot>
|
|
36
41
|
</div>
|
|
37
|
-
<span class="label"><slot></slot></span>
|
|
42
|
+
<span class="label" id="text"><slot></slot></span>
|
|
38
43
|
`;
|
|
39
44
|
}
|
|
40
45
|
handleIconSlotChange() {
|
package/menu/menu-item.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGxC,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,eAAe;IAAxC;;QAQL;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAK1E,cAAS,GAAG,UAAU,CAAC;IAsBlC,CAAC;IApBU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,cAAc,CAAC;IAC7B,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;KAG7C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;;AA5Ce,iBAAM,GAAG;IACvB,UAAU;IACV,mBAAmB;IACnB,MAAM;CACP,AAJqB,CAIpB;AAO+D;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAkB;AAGlE;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;iDACN;AAvBpC,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CA+CtB","sourcesContent":["\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\nimport { styles as buttonWrapperStyles } from '../shared/button-wrapper.styles.js';\nimport { styles } from './menu-item.styles.js';\n\n@customElement('u-menu-item')\nexport class UmMenuItem extends UmButtonWrapper {\n\n static override styles = [\n baseStyles,\n buttonWrapperStyles,\n styles\n ];\n\n /**\n * Whether the drawer item has icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-icon', reflect: true}) hasIcon = false;\n\n /**\n * Whether the drawer item has badge or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-badge', reflect: true}) hasBadge = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n override innerRole = 'menuitem';\n\n override connectedCallback() {\n super.connectedCallback();\n this.role = 'presentation';\n }\n\n protected override renderContent(): HTMLTemplateResult {\n return html`\n <div class=\"icon\">\n <slot\n name=\"icon\"\n aria-hidden=\"true\"\n @slotchange=\"${this.handleIconSlotChange}\"></slot>\n </div>\n <span class=\"label\" id=\"text\"><slot></slot></span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu-item': UmMenuItem;\n }\n}\n"]}
|
package/menu/menu.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAM3D,OAAO,2BAA2B,CAAC;AASnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAK9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAAsB;IACzC,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,
|
|
1
|
+
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAM3D,OAAO,2BAA2B,CAAC;AASnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAK9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAAsB;IACzC,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAUrB;IAED;;;OAGG;IACoD,YAAY,EAAE,aAAa,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAe;IAEzI;;;;;OAKG;IACwB,SAAS,EAAE,OAAO,GAAG,KAAK,CAAS;IAE9D;;OAEG;IACuE,eAAe,UAAQ;IAEjG;;OAEG;IACH,IACI,cAAc,IAAI,MAAM,GAAG,SAAS,CAEvC;IACD,IAAI,cAAc,CAAC,QAAQ,EAAE,MAAM,EASlC;IAEe,IAAI,EAAG,WAAW,CAAC;IAEnC,IAAI,aAAa,IAAI,WAAW,CAE/B;IAED,OAAO,CAAC,aAAa,CAA4B;cAE9B,MAAM,IAAI,kBAAkB;IAWtC,iBAAiB;IAMjB,oBAAoB;IAK7B,MAAM,aAOJ;IAEF,IAAI,IAAI,IAAI;IASZ,KAAK,aAOJ;IAED,OAAO,CAAC,uBAAuB;IAS/B,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,qBAAqB;IAS7B,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,sBAAsB;IAU9B,OAAO,CAAC,aAAa;IAsBrB,OAAO,CAAC,WAAW;CAWpB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF"}
|
package/menu/menu.js
CHANGED
|
@@ -63,10 +63,13 @@ let UmMenu = class UmMenu extends LitElement {
|
|
|
63
63
|
*/
|
|
64
64
|
get open() { return __classPrivateFieldGet(this, _UmMenu_open, "f"); }
|
|
65
65
|
set open(open) {
|
|
66
|
-
if (open) {
|
|
67
|
-
this
|
|
66
|
+
if (!open) {
|
|
67
|
+
__classPrivateFieldSet(this, _UmMenu_open, open, "f");
|
|
68
|
+
return;
|
|
68
69
|
}
|
|
70
|
+
this.calcDropdownPositioning();
|
|
69
71
|
__classPrivateFieldSet(this, _UmMenu_open, open, "f");
|
|
72
|
+
setTimeout(() => this.querySelector('u-menu-item:not([disabled])')?.focus());
|
|
70
73
|
}
|
|
71
74
|
/**
|
|
72
75
|
* Set a selector to auto attach to a toggle element
|
|
@@ -87,9 +90,9 @@ let UmMenu = class UmMenu extends LitElement {
|
|
|
87
90
|
}
|
|
88
91
|
render() {
|
|
89
92
|
return html `
|
|
90
|
-
<div class="menu" part="menu">
|
|
93
|
+
<div class="menu" part="menu" ?inert=${!this.open}>
|
|
91
94
|
<u-elevation></u-elevation>
|
|
92
|
-
<div class="content" part="content">
|
|
95
|
+
<div role="menu" class="content" part="content">
|
|
93
96
|
<slot></slot>
|
|
94
97
|
</div>
|
|
95
98
|
</div>
|
|
@@ -98,6 +101,7 @@ let UmMenu = class UmMenu extends LitElement {
|
|
|
98
101
|
connectedCallback() {
|
|
99
102
|
super.connectedCallback();
|
|
100
103
|
window.addEventListener('click', this.close);
|
|
104
|
+
this.role = "listbox";
|
|
101
105
|
}
|
|
102
106
|
disconnectedCallback() {
|
|
103
107
|
super.disconnectedCallback();
|
package/menu/menu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.js","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './menu.styles.js';\n\nimport '../elevation/elevation.js';\n\ninterface MenuRect {\n x?: number;\n y?: number;\n width: number;\n height: number;\n}\n\n@customElement('u-menu')\nexport class UmMenu extends LitElement {\n\n static override styles = [baseStyles, styles];\n\n #open = false;\n #justShow = false;\n\n /**\n * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods\n */\n @property({type: Boolean, reflect: true})\n get open(): boolean { return this.#open }\n set open(open: boolean) {\n if (open) {\n this.calcDropdownPositioning();\n }\n\n this.#open = open;\n }\n\n /**\n * The corner of the anchor which to align the menu in the standard logical\n * property style of <block>-<inline> e.g. `'end-start'`.\n */\n @property({attribute: 'anchor-corner', reflect: true}) anchorCorner: 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'end'`.\n *\n * NOTE: This value may not be respected by the menu positioning algorithm\n * if the menu would render outside the viewport.\n */\n @property({reflect: true}) direction: 'start' | 'end' = 'end';\n\n /**\n * Limit the height of the menu to not overflow the viewport\n */\n @property({type: Boolean, attribute: 'auto-scroll-block', reflect: true}) autoScrollBlock = true;\n\n /**\n * Set a selector to auto attach to a toggle element\n */\n @property({attribute: 'toggle-selector', reflect: true})\n get toggleSelector(): string | undefined {\n return this.attributes.getNamedItem('toggle-selector')?.value;\n }\n set toggleSelector(selector: string) {\n this.toggleElement?.removeEventListener('click', this.toggle);\n\n if (!selector) {\n return;\n }\n\n this.toggleElement = document.querySelector(selector);\n this.toggleElement?.addEventListener('click', this.toggle);\n }\n\n @query('.menu') menu!: HTMLElement;\n\n get anchorElement(): HTMLElement {\n return this.parentElement!;\n }\n\n private toggleElement: HTMLElement | null = null;\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"menu\" part=\"menu\">\n <u-elevation></u-elevation>\n <div class=\"content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n window.addEventListener('click', this.close);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n window.removeEventListener('click', this.close);\n }\n\n toggle = () => {\n if (this.open) {\n this.close();\n return;\n }\n\n this.show();\n };\n\n show(): void {\n if (this.open) {\n return;\n }\n\n this.#justShow = true;\n this.open = true;\n }\n\n close = () => {\n if (this.open && !this.#justShow) {\n this.open = false;\n return;\n }\n\n this.#justShow = false;\n }\n\n private calcDropdownPositioning() {\n const anchorRect = this.getAnchorRect();\n const menuRect = this.getMenuRect()\n\n this.resetMenu();\n this.setToOpenUpOrDown(anchorRect, menuRect);\n this.setToOpenToStartOrEnd(anchorRect, menuRect);\n }\n\n private resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.maxHeight = '';\n }\n\n private setToOpenUpOrDown(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortHeight = window.innerHeight;\n\n if (viewPortHeight - (anchorRect.y! + menuRect.height) >= 0) {\n return;\n }\n\n if (anchorRect.y! <= viewPortHeight / 2) {\n this.menu.style.maxHeight = this.autoScrollBlock\n ? `${viewPortHeight - anchorRect.y!}px`\n : '';\n return;\n }\n\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.autoScrollBlock\n ? `${anchorRect.y!}px`\n : '';\n }\n\n private setToOpenToStartOrEnd(anchorRect: MenuRect, menuRect: MenuRect): void {\n if (this.direction === 'start') {\n this.ensureMenuCanOpenToStart(anchorRect, menuRect);\n return;\n }\n\n this.ensureMenuCanOpenToEnd(anchorRect, menuRect);\n }\n\n private ensureMenuCanOpenToStart(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortWidth = window.innerWidth;\n\n if (viewPortWidth - (anchorRect.x! - menuRect.width) >= 0) {\n this.menu.classList.add('start');\n }\n }\n\n private ensureMenuCanOpenToEnd(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortWidth = window.innerWidth;\n\n if (viewPortWidth - (anchorRect.x! + menuRect.width) >= 0) {\n return;\n }\n\n this.menu.classList.add('start');\n }\n\n private getAnchorRect(): MenuRect {\n const anchorElement = this.anchorElement;\n const rect = anchorElement.getBoundingClientRect() as DOMRect\n const styles = getComputedStyle(anchorElement);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n const xOffset = this.anchorCorner.endsWith('-end')\n ? width\n : 0;\n\n const yOffset = this.anchorCorner.startsWith('end-')\n ? height\n : 0;\n\n return {\n y: rect.y + yOffset,\n x: rect.x + xOffset,\n width: width,\n height: height\n };\n }\n\n private getMenuRect(): MenuRect {\n const menu = this.menu;\n const styles = getComputedStyle(menu);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n\n return {\n width: width,\n height: height\n };\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu': UmMenu;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"menu.js","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './menu.styles.js';\n\nimport '../elevation/elevation.js';\n\ninterface MenuRect {\n x?: number;\n y?: number;\n width: number;\n height: number;\n}\n\n@customElement('u-menu')\nexport class UmMenu extends LitElement {\n\n static override styles = [baseStyles, styles];\n\n #open = false;\n #justShow = false;\n\n /**\n * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods\n */\n @property({type: Boolean, reflect: true})\n get open(): boolean { return this.#open }\n set open(open: boolean) {\n if (!open) {\n this.#open = open;\n return;\n }\n \n this.calcDropdownPositioning();\n this.#open = open;\n\n setTimeout(() => this.querySelector<HTMLElement>('u-menu-item:not([disabled])')?.focus());\n }\n\n /**\n * The corner of the anchor which to align the menu in the standard logical\n * property style of <block>-<inline> e.g. `'end-start'`.\n */\n @property({attribute: 'anchor-corner', reflect: true}) anchorCorner: 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'end'`.\n *\n * NOTE: This value may not be respected by the menu positioning algorithm\n * if the menu would render outside the viewport.\n */\n @property({reflect: true}) direction: 'start' | 'end' = 'end';\n\n /**\n * Limit the height of the menu to not overflow the viewport\n */\n @property({type: Boolean, attribute: 'auto-scroll-block', reflect: true}) autoScrollBlock = true;\n\n /**\n * Set a selector to auto attach to a toggle element\n */\n @property({attribute: 'toggle-selector', reflect: true})\n get toggleSelector(): string | undefined {\n return this.attributes.getNamedItem('toggle-selector')?.value;\n }\n set toggleSelector(selector: string) {\n this.toggleElement?.removeEventListener('click', this.toggle);\n\n if (!selector) {\n return;\n }\n\n this.toggleElement = document.querySelector(selector);\n this.toggleElement?.addEventListener('click', this.toggle);\n }\n\n @query('.menu') menu!: HTMLElement;\n\n get anchorElement(): HTMLElement {\n return this.parentElement!;\n }\n\n private toggleElement: HTMLElement | null = null;\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"menu\" part=\"menu\" ?inert=${!this.open}>\n <u-elevation></u-elevation>\n <div role=\"menu\" class=\"content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n window.addEventListener('click', this.close);\n this.role = \"listbox\";\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n window.removeEventListener('click', this.close);\n }\n\n toggle = () => {\n if (this.open) {\n this.close();\n return;\n }\n\n this.show();\n };\n\n show(): void {\n if (this.open) {\n return;\n }\n\n this.#justShow = true;\n this.open = true;\n }\n\n close = () => {\n if (this.open && !this.#justShow) {\n this.open = false;\n return;\n }\n\n this.#justShow = false;\n }\n\n private calcDropdownPositioning() {\n const anchorRect = this.getAnchorRect();\n const menuRect = this.getMenuRect()\n\n this.resetMenu();\n this.setToOpenUpOrDown(anchorRect, menuRect);\n this.setToOpenToStartOrEnd(anchorRect, menuRect);\n }\n\n private resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.maxHeight = '';\n }\n\n private setToOpenUpOrDown(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortHeight = window.innerHeight;\n\n if (viewPortHeight - (anchorRect.y! + menuRect.height) >= 0) {\n return;\n }\n\n if (anchorRect.y! <= viewPortHeight / 2) {\n this.menu.style.maxHeight = this.autoScrollBlock\n ? `${viewPortHeight - anchorRect.y!}px`\n : '';\n return;\n }\n\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.autoScrollBlock\n ? `${anchorRect.y!}px`\n : '';\n }\n\n private setToOpenToStartOrEnd(anchorRect: MenuRect, menuRect: MenuRect): void {\n if (this.direction === 'start') {\n this.ensureMenuCanOpenToStart(anchorRect, menuRect);\n return;\n }\n\n this.ensureMenuCanOpenToEnd(anchorRect, menuRect);\n }\n\n private ensureMenuCanOpenToStart(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortWidth = window.innerWidth;\n\n if (viewPortWidth - (anchorRect.x! - menuRect.width) >= 0) {\n this.menu.classList.add('start');\n }\n }\n\n private ensureMenuCanOpenToEnd(anchorRect: MenuRect, menuRect: MenuRect): void {\n const viewPortWidth = window.innerWidth;\n\n if (viewPortWidth - (anchorRect.x! + menuRect.width) >= 0) {\n return;\n }\n\n this.menu.classList.add('start');\n }\n\n private getAnchorRect(): MenuRect {\n const anchorElement = this.anchorElement;\n const rect = anchorElement.getBoundingClientRect() as DOMRect\n const styles = getComputedStyle(anchorElement);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n const xOffset = this.anchorCorner.endsWith('-end')\n ? width\n : 0;\n\n const yOffset = this.anchorCorner.startsWith('end-')\n ? height\n : 0;\n\n return {\n y: rect.y + yOffset,\n x: rect.x + xOffset,\n width: width,\n height: height\n };\n }\n\n private getMenuRect(): MenuRect {\n const menu = this.menu;\n const styles = getComputedStyle(menu);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n\n return {\n width: width,\n height: height\n };\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu': UmMenu;\n }\n}\n"]}
|
|
@@ -26,6 +26,7 @@ export declare class UmDrawerItem extends UmButtonWrapper {
|
|
|
26
26
|
keepDrawerOpen: boolean;
|
|
27
27
|
private readonly assignedIcons;
|
|
28
28
|
private readonly assignedBadges;
|
|
29
|
+
connectedCallback(): void;
|
|
29
30
|
protected renderContent(): HTMLTemplateResult;
|
|
30
31
|
private handleIconSlotChange;
|
|
31
32
|
private handleBadgeSlotChange;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-item.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAI/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAI9D,qBACa,YAAa,SAAQ,eAAe;IAE/C,OAAgB,MAAM,4BAIpB;IAEF;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAEnF;;;;OAIG;IACuC,MAAM,UAAS;IAEzD;;OAEG;IACsE,cAAc,UAAS;IAGhG,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAG/C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;
|
|
1
|
+
{"version":3,"file":"drawer-item.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAI/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAI9D,qBACa,YAAa,SAAQ,eAAe;IAE/C,OAAgB,MAAM,4BAIpB;IAEF;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAEnF;;;;OAIG;IACuC,MAAM,UAAS;IAEzD;;OAEG;IACsE,cAAc,UAAS;IAGhG,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAG/C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEvC,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IAiBtD,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,qBAAqB;IAIpB,WAAW,IAAI,IAAI;CAW7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
|
|
@@ -36,6 +36,10 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
|
|
|
36
36
|
*/
|
|
37
37
|
this.keepDrawerOpen = false;
|
|
38
38
|
}
|
|
39
|
+
connectedCallback() {
|
|
40
|
+
super.connectedCallback();
|
|
41
|
+
this.setAttribute('aria-labelledby', 'label');
|
|
42
|
+
}
|
|
39
43
|
renderContent() {
|
|
40
44
|
return html `
|
|
41
45
|
<div class="icon">
|
|
@@ -44,7 +48,7 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
|
|
|
44
48
|
aria-hidden="true"
|
|
45
49
|
@slotchange="${this.handleIconSlotChange}"></slot>
|
|
46
50
|
</div>
|
|
47
|
-
<span class="label"><slot></slot></span>
|
|
51
|
+
<span class="label" id="text"><slot></slot></span>
|
|
48
52
|
<span class="badge">
|
|
49
53
|
<slot
|
|
50
54
|
name="badge"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-item.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAG1C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,eAAe;IAA1C;;QAQL;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAEnF;;;;WAIG;QACuC,WAAM,GAAG,KAAK,CAAC;QAEzD;;WAEG;QACsE,mBAAc,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"drawer-item.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAG1C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,eAAe;IAA1C;;QAQL;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAEnF;;;;WAIG;QACuC,WAAM,GAAG,KAAK,CAAC;QAEzD;;WAEG;QACsE,mBAAc,GAAG,KAAK,CAAC;IAiDlG,CAAC;IAzCU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC;IAChD,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;;;;yBAMzB,IAAI,CAAC,qBAAqB;;KAE9C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;IAEO,qBAAqB;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC;IACjD,CAAC;IAEQ,WAAW;QAClB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAEzD,IAAI,cAAc,EAAE,CAAC;YACnB,cAAc,CAAC,YAAY,GAAG,KAAK,CAAC;QACtC,CAAC;IACH,CAAC;;AA9Ee,mBAAM,GAAG;IACvB,UAAU;IACV,mBAAmB;IACnB,MAAM;CACP,AAJqB,CAIpB;AAO+D;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAkB;AAOzC;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAgB;AAKgB;IAAxE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDAAwB;AAG/E;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;mDACN;AAG9B;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDACN;AAtCrC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAiFxB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\nimport { styles as buttonWrapperStyles } from '../shared/button-wrapper.styles.js';\nimport { styles } from './drawer-item.styles.js';\n\n@customElement('u-drawer-item')\nexport class UmDrawerItem extends UmButtonWrapper {\n\n static override styles = [\n baseStyles,\n buttonWrapperStyles,\n styles\n ];\n\n /**\n * Whether the drawer item has icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-icon', reflect: true}) hasIcon = false;\n\n /**\n * Whether the drawer item has badge or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-badge', reflect: true}) hasBadge = false;\n\n /**\n * Whether the drawer item is active or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, reflect: true}) active = false;\n\n /**\n * If true, it will not attempt to close de navigation drawer on click\n */\n @property({type: Boolean, attribute: 'keep-drawer-open', reflect: true}) keepDrawerOpen = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n @queryAssignedElements({slot: 'badge', flatten: true})\n private readonly assignedBadges!: HTMLElement[];\n\n override connectedCallback() {\n super.connectedCallback();\n this.setAttribute('aria-labelledby', 'label');\n }\n\n protected override renderContent(): HTMLTemplateResult {\n return html`\n <div class=\"icon\">\n <slot\n name=\"icon\"\n aria-hidden=\"true\"\n @slotchange=\"${this.handleIconSlotChange}\"></slot>\n </div>\n <span class=\"label\" id=\"text\"><slot></slot></span>\n <span class=\"badge\">\n <slot\n name=\"badge\"\n @slotchange=\"${this.handleBadgeSlotChange}\"></slot>\n </span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n\n private handleBadgeSlotChange() {\n this.hasBadge = this.assignedBadges.length > 0;\n }\n\n override handleClick(): void {\n if (this.keepDrawerOpen) {\n return;\n }\n\n const sideNavigation = this.closest('u-side-navigation');\n\n if (sideNavigation) {\n sideNavigation.toggleDrawer = false;\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-drawer-item': UmDrawerItem;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA2ClB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-item.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC
|
|
1
|
+
{"version":3,"file":"drawer-item.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n display: block;\n --_drawer-item-icon-size: var(--u-drawer-item-icon-size, 1.125rem);\n --_drawer-item-padding: var(--u-drawer-item-padding, 16px);\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-drawer-item-line-height, var(--u-label-l-line-height, 1.25rem));\n font-size: var(--u-drawer-item-font-size, var(--u-label-l-font-size, 0.875rem));\n letter-spacing: var(--u-drawer-item-letter-spacing, var(--u-label-l-letter-spacing, 0.0071428571rem));\n font-weight: var(--u-drawer-item-font-weight, var(--u-label-l-font-weight, var(--u-font-weight-medium, 500)));\n height: var(--u-drawer-item-height, 56px);\n padding-inline: var(--_drawer-item-padding);\n margin-inline: calc(var(--_drawer-item-padding) * -1);\n border-radius: var(--u-drawer-item-shape-corner, var(--u-shape-corner-full, 9999px));\n color: var(--u-drawer-item-label-inactive-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([active]) {\n color: var(--u-drawer-item-label-active-color, var(--_color-primary));\n }\n\n :host(:not([has-icon])) .icon,\n :host(:not([has-badge])) .badge {\n display: none;\n }\n\n .icon {\n font-size: var(--_drawer-item-icon-size);\n line-height: var(--_drawer-item-icon-size);\n margin-inline-end: var(--u-drawer-item-icon-margin, 16px);\n }\n\n .badge {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-inline-start: auto;\n padding-inline: var(--u-drawer-item-badge-padding, 12px 8px);\n }\n\n .content {\n justify-content: flex-start;\n }\n`;\n"]}
|
|
@@ -10,7 +10,7 @@ export const styles = css `
|
|
|
10
10
|
|
|
11
11
|
@media (min-width: 1200px) {
|
|
12
12
|
:host {
|
|
13
|
-
background-color: var(--u-standard-drawer-background-color, var(--u-color-
|
|
13
|
+
background-color: var(--u-standard-drawer-background-color, var(--u-color-body, var(--u-color-surface, rgb(254, 247, 255))));
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;CAczB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n display: block;\n background-color: var(--u-modal-drawer-background-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n color: var(--u-drawer-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n height: 100%;\n padding-inline: var(--u-drawer-padding, 28px);\n }\n\n @media (min-width: 1200px) {\n :host {\n background-color: var(--u-standard-drawer-background-color, var(--u-color-
|
|
1
|
+
{"version":3,"file":"drawer.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;CAczB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n display: block;\n background-color: var(--u-modal-drawer-background-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n color: var(--u-drawer-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n height: 100%;\n padding-inline: var(--u-drawer-padding, 28px);\n }\n\n @media (min-width: 1200px) {\n :host {\n background-color: var(--u-standard-drawer-background-color, var(--u-color-body, var(--u-color-surface, rgb(254, 247, 255))));\n }\n }\n`;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@universal-material/web",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.29",
|
|
4
4
|
"description": "Material web components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"module": "./index.js",
|
|
17
17
|
"typings": "./index.d.ts",
|
|
18
18
|
"scripts": {
|
|
19
|
-
"build": "run-s clean script:sass-to-ts script:build sass analyze copy",
|
|
19
|
+
"build": "run-s clean script:sass-to-ts script:build sass analyze copy && node remove-scripts-from-package.js",
|
|
20
20
|
"build:watch": "gulp -f gulpfile.js scripts:watch",
|
|
21
21
|
"script:build": "tsc",
|
|
22
22
|
"script:sass-to-ts": "gulp -f gulpfile.js scripts:sass-to-ts",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"clean": "rimraf ./dist/ rimraf ./src/**/*.d.ts rimraf ./src/**/*.styles.ts",
|
|
27
27
|
"copy": "copyfiles package.json README.md custom-elements.json dist/ && copyfiles -u 1 src/scss/**/*.scss dist/",
|
|
28
28
|
"lint": "npm run lint:lit-analyzer && npm run lint:eslint",
|
|
29
|
-
"lint:eslint": "eslint
|
|
29
|
+
"lint:eslint": "eslint src/**/*.ts",
|
|
30
30
|
"lint:lit-analyzer": "lit-analyzer",
|
|
31
31
|
"format": "prettier \"**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.eslintignore --write",
|
|
32
32
|
"predocs": "run-p analyze docs:apis script:sass-to-ts",
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { UmRadio } from './radio.js';
|
|
2
|
+
declare const UmRadioListItem_base: import("../shared/selection-control/selection-control-list-item.js").MixinReturn<typeof UmRadio, object>;
|
|
3
|
+
export declare class UmRadioListItem extends UmRadioListItem_base {
|
|
4
|
+
}
|
|
5
|
+
declare global {
|
|
6
|
+
interface HTMLElementTagNameMap {
|
|
7
|
+
'u-radio-list-item': UmRadioListItem;
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=radio-list-item.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"radio-list-item.d.ts","sourceRoot":"","sources":["../../src/radio/radio-list-item.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;;AAErC,qBACa,eAAgB,SAAQ,oBAAsC;CAE1E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { customElement } from 'lit/decorators.js';
|
|
8
|
+
import { mixinSelectionControlListItem } from '../shared/selection-control/selection-control-list-item.js';
|
|
9
|
+
import { UmRadio } from './radio.js';
|
|
10
|
+
let UmRadioListItem = class UmRadioListItem extends mixinSelectionControlListItem(UmRadio) {
|
|
11
|
+
};
|
|
12
|
+
UmRadioListItem = __decorate([
|
|
13
|
+
customElement('u-radio-list-item')
|
|
14
|
+
], UmRadioListItem);
|
|
15
|
+
export { UmRadioListItem };
|
|
16
|
+
//# sourceMappingURL=radio-list-item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"radio-list-item.js","sourceRoot":"","sources":["../../src/radio/radio-list-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,6BAA6B,EAAE,MAAM,4DAA4D,CAAC;AAC3G,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAG9B,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,6BAA6B,CAAC,OAAO,CAAC;CAE1E,CAAA;AAFY,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAE3B","sourcesContent":["import { customElement } from 'lit/decorators.js';\n\nimport { mixinSelectionControlListItem } from '../shared/selection-control/selection-control-list-item.js';\nimport { UmRadio } from './radio.js';\n\n@customElement('u-radio-list-item')\nexport class UmRadioListItem extends mixinSelectionControlListItem(UmRadio) {\n\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-radio-list-item': UmRadioListItem;\n }\n}\n"]}
|