@universal-material/web 3.0.28 → 3.0.30

package/index.js

@@ -5,10 +5,16 @@ import './button/fab.js';
 import './button/icon-button.js';
 import './card/card.js';
 import './checkbox/checkbox.js';
-import './container/container.js';
-import './container/grid.js';
-import './divider/divider.js';
+import './checkbox/checkbox-list-item.js';
+import './radio/radio.js';
+import './radio/radio-list-item.js';
+import './switch/switch.js';
+import './switch/switch-list-item.js';
 import './elevation/elevation.js';
+import './field/field.js';
+import './text-field/text-field.js';
+import './list/list.js';
+import './list/list-item.js';
 import './menu/menu.js';
 import './menu/menu-item.js';
 import './navigation/drawer.js';
@@ -16,27 +22,30 @@ import './navigation/drawer-item.js';
 import './navigation/side-navigation.js';
 import './ripple/ripple.js';
 import './snackbar/snackbar.js';
-export * from './app-bar/top-app-bar';
-export * from './button/button';
-export * from './button/button-base';
-export * from './button/button-set';
-export * from './button/fab';
-export * from './button/icon-button';
-export * from './card/card';
-export * from './card/card-content';
-export * from './card/card-media';
-export * from './checkbox/checkbox';
-export * from './container/grid-base';
-export * from './container/grid';
-export * from './container/container';
-export * from './divider/divider';
-export * from './elevation/elevation';
-export * from './menu/menu';
-export * from './menu/menu-item';
-export * from './navigation/drawer';
-export * from './navigation/drawer-item';
-export * from './navigation/side-navigation';
-export * from './ripple/ripple';
-export * from './snackbar/snackbar';
-export * from './theme/theme-builder';
+export * from './app-bar/top-app-bar.js';
+export * from './button/button.js';
+export * from './button/button-base.js';
+export * from './button/button-set.js';
+export * from './button/fab.js';
+export * from './button/icon-button.js';
+export * from './card/card.js';
+export * from './card/card-content.js';
+export * from './card/card-media.js';
+export * from './checkbox/checkbox.js';
+export * from './radio/radio.js';
+export * from './switch/switch.js';
+export * from './switch/switch-list-item.js';
+export * from './elevation/elevation.js';
+export * from './field/field.js';
+export * from './text-field/text-field.js';
+export * from './list/list.js';
+export * from './list/list-item.js';
+export * from './menu/menu.js';
+export * from './menu/menu-item.js';
+export * from './navigation/drawer.js';
+export * from './navigation/drawer-item.js';
+export * from './navigation/side-navigation.js';
+export * from './ripple/ripple.js';
+export * from './snackbar/snackbar.js';
+export * from './theme/theme-builder.js';
 //# sourceMappingURL=index.js.map

package/index.js.map

@@ -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,0BAA0B,CAAC;AAClC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,0BAA0B,CAAC;AAClC,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,uBAAuB,CAAC;AACtC,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,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 './container/container.js';\nimport './container/grid.js';\nimport './divider/divider.js';\nimport './elevation/elevation.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';\nexport * from './button/button';\nexport * from './button/button-base';\nexport * from './button/button-set';\nexport * from './button/fab';\nexport * from './button/icon-button';\nexport * from './card/card';\nexport * from './card/card-content';\nexport * from './card/card-media';\nexport * from './checkbox/checkbox';\nexport * from './container/grid-base';\nexport * from './container/grid';\nexport * from './container/container';\nexport * from './divider/divider';\nexport * from './elevation/elevation';\nexport * from './menu/menu';\nexport * from './menu/menu-item';\nexport * from './navigation/drawer';\nexport * from './navigation/drawer-item';\nexport * from './navigation/side-navigation';\nexport * from './ripple/ripple';\nexport * from './snackbar/snackbar';\nexport * from './theme/theme-builder';\n"]}
+{"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"]}

package/list/list-item.d.ts

@@ -0,0 +1,13 @@
+import { HTMLTemplateResult, LitElement } from 'lit';
+import '../ripple/ripple.js';
+export declare class UmListItem extends LitElement {
+    static styles: import("lit").CSSResult;
+    selectable: boolean;
+    render(): HTMLTemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-list-item': UmListItem;
+    }
+}
+//# sourceMappingURL=list-item.d.ts.map

package/list/list-item.d.ts.map

@@ -0,0 +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"}

package/list/list-item.js

@@ -0,0 +1,33 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { styles } from './list-item.styles.js';
+import '../ripple/ripple.js';
+let UmListItem = class UmListItem extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.selectable = false;
+    }
+    render() {
+        const ripple = html `<u-ripple></u-ripple>`;
+        return html `
+      ${this.selectable ? ripple : nothing}
+      <slot name="leading"></slot>
+      <slot></slot>
+      <slot name="trailing"></slot>`;
+    }
+};
+UmListItem.styles = styles;
+__decorate([
+    property({ type: Boolean, reflect: true })
+], UmListItem.prototype, "selectable", void 0);
+UmListItem = __decorate([
+    customElement('u-list-item')
+], UmListItem);
+export { UmListItem };
+//# sourceMappingURL=list-item.js.map

package/list/list-item.js.map

@@ -0,0 +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"]}

package/{container/grid-base.styles.d.ts → list/list-item.styles.d.ts}

@@ -1,2 +1,2 @@
 export declare const styles: import("lit").CSSResult;
-//# sourceMappingURL=grid-base.styles.d.ts.map
+//# sourceMappingURL=list-item.styles.d.ts.map

package/list/list-item.styles.d.ts.map

@@ -0,0 +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"}

package/list/list-item.styles.js

@@ -0,0 +1,22 @@
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    position: relative;
+    display: flex;
+    align-items: center;
+    min-height: var(--u-list-item-min-height, 56px);
+    padding-block: var(--u-list-item-block-padding, 8px);
+    padding-inline: var(--u-list-item-inline-padding, 16px);
+    gap: var(--u-list-item-gap, 16px);
+  }
+
+  slot:not([name]) {
+    display: block;
+    margin-inline-end: auto;
+  }
+
+  slot {
+    flex-shrink: 0;
+  }
+`;
+//# sourceMappingURL=list-item.styles.js.map

package/list/list-item.styles.js.map

@@ -0,0 +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

@@ -0,0 +1,11 @@
+import { HTMLTemplateResult, LitElement } from 'lit';
+export declare class UmList extends LitElement {
+    static styles: import("lit").CSSResult;
+    render(): HTMLTemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-list': UmList;
+    }
+}
+//# sourceMappingURL=list.d.ts.map

package/list/list.d.ts.map

@@ -0,0 +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"}

package/{container/container.js → list/list.js}

@@ -4,24 +4,17 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html } from 'lit';
+import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
-import { styles as baseStyles } from '../shared/base.styles.js';
-import { styles } from './container.styles.js';
-import { GridBase } from './grid-base.js';
-import { styles as gridBaseStyles } from './grid-base.styles.js';
-let UmContainer = class UmContainer extends GridBase {
+import { styles } from './list.styles.js';
+let UmList = class UmList extends LitElement {
     render() {
         return html `<slot></slot>`;
     }
 };
-UmContainer.styles = [
-    baseStyles,
-    gridBaseStyles,
-    styles
-];
-UmContainer = __decorate([
-    customElement('u-container')
-], UmContainer);
-export { UmContainer };
-//# sourceMappingURL=container.js.map
+UmList.styles = styles;
+UmList = __decorate([
+    customElement('u-list')
+], UmList);
+export { UmList };
+//# sourceMappingURL=list.js.map

package/list/list.js.map

@@ -0,0 +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"]}

package/{container/grid.styles.d.ts → list/list.styles.d.ts}

@@ -1,2 +1,2 @@
 export declare const styles: import("lit").CSSResult;
-//# sourceMappingURL=grid.styles.d.ts.map
+//# sourceMappingURL=list.styles.d.ts.map

package/list/list.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.styles.d.ts","sourceRoot":"","sources":["../../src/list/list.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAIlB,CAAC"}

package/list/list.styles.js

@@ -0,0 +1,7 @@
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    padding-block: var(--u-list-padding, 8px);
+  }
+`;
+//# sourceMappingURL=list.styles.js.map

package/list/list.styles.js.map

@@ -0,0 +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

@@ -15,6 +15,8 @@ export declare class UmMenuItem extends UmButtonWrapper {
      */
     hasBadge: boolean;
     private readonly assignedIcons;
+    innerRole: string;
+    connectedCallback(): void;
     protected renderContent(): HTMLTemplateResult;
     private handleIconSlotChange;
 }

package/menu/menu-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":"AAAA,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;cAE5B,aAAa,IAAI,kBAAkB;IAYtD,OAAO,CAAC,oBAAoB;CAG7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
+{"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

@@ -25,6 +25,11 @@ let UmMenuItem = class UmMenuItem extends UmButtonWrapper {
          * _Note:_ Readonly
          */
         this.hasBadge = false;
+        this.innerRole = 'menuitem';
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.role = 'presentation';
     }
     renderContent() {
         return html `
@@ -34,7 +39,7 @@ let UmMenuItem = class UmMenuItem extends UmButtonWrapper {
           aria-hidden="true"
           @slotchange="${this.handleIconSlotChange}"></slot>
       </div>
-      <span class="label"><slot></slot></span>
+      <span class="label" id="text"><slot></slot></span>
     `;
     }
     handleIconSlotChange() {

package/menu/menu-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../src/menu/menu-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,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;IAoBrF,CAAC;IAfoB,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;;AArCe,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,CAwCtB","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 './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  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\"><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"]}
+{"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

@@ -28,7 +28,7 @@ export declare class UmMenu extends LitElement {
      * Set a selector to auto attach to a toggle element
      */
     get toggleSelector(): string | undefined;
-    set toggleSelector(selector: string);
+    set toggleSelector(selector: string | undefined);
     menu: HTMLElement;
     get anchorElement(): HTMLElement;
     private toggleElement;

package/menu/menu.d.ts.map

@@ -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,EAMrB;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;IAKjB,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"}
+{"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,GAAG,SAAS,EAS9C;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

@@ -63,10 +63,13 @@ let UmMenu = class UmMenu extends LitElement {
      */
     get open() { return __classPrivateFieldGet(this, _UmMenu_open, "f"); }
     set open(open) {
-        if (open) {
-            this.calcDropdownPositioning();
+        if (!open) {
+            __classPrivateFieldSet(this, _UmMenu_open, open, "f");
+            return;
         }
+        this.calcDropdownPositioning();
         __classPrivateFieldSet(this, _UmMenu_open, open, "f");
+        setTimeout(() => this.querySelector('u-menu-item:not([disabled])')?.focus());
     }
     /**
      * Set a selector to auto attach to a toggle element
@@ -87,9 +90,9 @@ let UmMenu = class UmMenu extends LitElement {
     }
     render() {
         return html `
-      <div class="menu" part="menu">
+      <div class="menu" part="menu" ?inert=${!this.open}>
         <u-elevation></u-elevation>
-        <div class="content" part="content">
+        <div role="menu" class="content" part="content">
           <slot></slot>
         </div>
       </div>
@@ -98,6 +101,7 @@ let UmMenu = class UmMenu extends LitElement {
     connectedCallback() {
         super.connectedCallback();
         window.addEventListener('click', this.close);
+        this.role = "listbox";
     }
     disconnectedCallback() {
         super.disconnectedCallback();

package/menu/menu.js.map

@@ -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"]}
+{"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 | undefined) {\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"]}

package/navigation/drawer-item.d.ts

@@ -26,6 +26,7 @@ export declare class UmDrawerItem extends UmButtonWrapper {
     keepDrawerOpen: boolean;
     private readonly assignedIcons;
     private readonly assignedBadges;
+    connectedCallback(): void;
     protected renderContent(): HTMLTemplateResult;
     private handleIconSlotChange;
     private handleBadgeSlotChange;

package/navigation/drawer-item.d.ts.map

@@ -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;cAE7B,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"}
+{"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"}

package/navigation/drawer-item.js

@@ -36,6 +36,10 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
          */
         this.keepDrawerOpen = false;
     }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('aria-labelledby', 'label');
+    }
     renderContent() {
         return html `
       <div class="icon">
@@ -44,7 +48,7 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
           aria-hidden="true"
           @slotchange="${this.handleIconSlotChange}"></slot>
       </div>
-      <span class="label"><slot></slot></span>
+      <span class="label" id="text"><slot></slot></span>
       <span class="badge">
         <slot
           name="badge"

package/navigation/drawer-item.js.map

@@ -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;IA4ClG,CAAC;IApCoB,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;;AAzEe,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,CA4ExB","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  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\"><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"]}
+{"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"]}

package/navigation/drawer-item.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAwClB,CAAC"}
+{"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA2ClB,CAAC"}

package/navigation/drawer-item.styles.js

@@ -32,6 +32,9 @@ export const styles = css `
   }
 
   .badge {
+    display: flex;
+    justify-content: center;
+    align-items: center;
     margin-inline-start: auto;
     padding-inline: var(--u-drawer-item-badge-padding, 12px 8px);
   }

package/navigation/drawer-item.styles.js.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwCzB,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    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"]}
+{"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"]}

package/navigation/drawer.styles.js

@@ -10,7 +10,7 @@ export const styles = css `
 
   @media (min-width: 1200px) {
     :host {
-      background-color: var(--u-standard-drawer-background-color, var(--u-color-background, var(--u-color-surface, rgb(254, 247, 255))));
+      background-color: var(--u-standard-drawer-background-color, var(--u-color-body, var(--u-color-surface, rgb(254, 247, 255))));
     }
   }
 `;

package/navigation/drawer.styles.js.map

@@ -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-background, var(--u-color-surface, rgb(254, 247, 255))));\n    }\n  }\n`;\n"]}
+{"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

@@ -1,6 +1,6 @@
 {
   "name": "@universal-material/web",
-  "version": "3.0.28",
+  "version": "3.0.30",
   "description": "Material web components",
   "type": "module",
   "keywords": [
@@ -16,7 +16,7 @@
   "module": "./index.js",
   "typings": "./index.d.ts",
   "scripts": {
-    "build": "run-s clean script:sass-to-ts script:build sass analyze copy",
+    "build": "run-s clean script:sass-to-ts script:build sass analyze copy && node remove-scripts-from-package.js",
     "build:watch": "gulp -f gulpfile.js scripts:watch",
     "script:build": "tsc",
     "script:sass-to-ts": "gulp -f gulpfile.js scripts:sass-to-ts",
@@ -26,7 +26,7 @@
     "clean": "rimraf ./dist/ rimraf ./src/**/*.d.ts rimraf ./src/**/*.styles.ts",
     "copy": "copyfiles package.json README.md custom-elements.json dist/ && copyfiles -u 1 src/scss/**/*.scss dist/",
     "lint": "npm run lint:lit-analyzer && npm run lint:eslint",
-    "lint:eslint": "eslint 'src/**/*.ts'",
+    "lint:eslint": "eslint src/**/*.ts",
     "lint:lit-analyzer": "lit-analyzer",
     "format": "prettier \"**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.eslintignore --write",
     "predocs": "run-p analyze docs:apis script:sass-to-ts",

package/radio/radio-list-item.d.ts

@@ -0,0 +1,11 @@
+import { UmRadio } from './radio.js';
+declare const UmRadioListItem_base: import("../shared/selection-control/selection-control-list-item.js").MixinReturn<typeof UmRadio, object>;
+export declare class UmRadioListItem extends UmRadioListItem_base {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-radio-list-item': UmRadioListItem;
+    }
+}
+export {};
+//# sourceMappingURL=radio-list-item.d.ts.map

package/radio/radio-list-item.d.ts.map

@@ -0,0 +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"}