@vandeurenglenn/lite-elements 0.3.49 → 0.3.51

package/exports/fab.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, property, css, html, LiteElement } from '@vandeurenglenn/lite';
 import './elevation.js';
 
@@ -25,154 +25,154 @@ let CustomButton = (() => {
         get type() { return this.#type_accessor_storage; }
         set type(value) { this.#type_accessor_storage = value; }
         static styles = [
-            css `
-      :host {
-        color: var(--custom-fab-color, --md-sys-color-on-background);
-        display: flex;
-
-        height: 56px;
-        width: 56px;
-        border-radius: var(--md-sys-shape-corner-extra-large);
-        position: relative;
-        pointer-events: auto;
-        cursor: pointer;
-        box-sizing: border-box;
-        padding: 16px;
-
-        --elevation-level: 0;
-      }
-
-      button {
-        box-sizing: border-box;
-        border: none;
-        background: transparent;
-        color: inherit;
-        align-items: center;
-        justify-content: center;
-        user-select: none;
-        outline: none;
-        cursor: pointer;
-        border-radius: inherit;
-        padding: none;
-        width: inherit;
-        height: inherit;
-        display: flex;
-        pointer-events: none;
-      }
-
-      ::slotted(*) {
-        font-family: var(--md-sys-typescale-label-large-font-family-name);
-        font-style: var(--md-sys-typescale-label-large-font-family-style);
-        font-weight: var(--md-sys-typescale-label-large-font-weight);
-        font-size: var(--md-sys-typescale-label-large-font-size);
-        letter-spacing: var(--md-sys-typescale-label-large-tracking);
-        line-height: var(--md-sys-typescale-label-large-height);
-        text-transform: var(--md-sys-typescale-label-large-text-transform);
-        text-decoration: var(--md-sys-typescale-label-large-text-decoration);
-      }
-
-      :host([type='filled']),
-      :host([type='filled']) ::slotted(*) {
-        color: var(--md-sys-color-on-primary);
-        fill: var(--md-sys-color-on-primary);
-        background: var(--md-sys-color-primary);
-      }
-
-      :host([type='outlined']),
-      :host([type='outlined']) ::slotted(*) {
-        color: var(--md-sys-color-on-surface);
-        fill: var(--md-sys-color-on-surface);
-        background: var(--md-sys-color-surface);
-        border: solid 1px;
-        border-color: var(--md-sys-color-outline);
-      }
-
-      :host([type='elevated']),
-      :host([type='elevated']) ::slotted(*) {
-        color: var(--md-sys-color-primary);
-        fill: var(--md-sys-color-primary);
-        background: var(--md-sys-color-surface-container-low);
-      }
-
-      :host([type='tertiary']),
-      :host([type='tertiary']) ::slotted(*) {
-        background: var(--md-sys-color-tertiary);
-        color: var(--md-sys-color-on-tertiary);
-        fill: var(--md-sys-color-on-tertiary);
-      }
-
-      :host([type='tonal']),
-      :host([type='tonal']) ::slotted(*) {
-        background: var(--md-sys-color-secondary-container);
-        color: var(--md-sys-color-on-seconday-container);
-        fill: var(--md-sys-color-on-seconday-container);
-      }
-
-      custom-elevation {
-        --md-elevation-level: var(--elevation-level);
-      }
-
-      custom-elevation {
-        --elevation-level: 1;
-      }
-
-      :host([type='normal']) button {
-        align-items: center;
-        justify-content: center;
-      }
-
-      :host([type='extended']) button {
-        align-items: center;
-      }
-
-      :host([type='extended']) {
-        min-width: 80px;
-        width: fit-content;
-      }
-
-      :not([name='icon']) ::slotted(*) {
-        margin-left: 24px;
-        margin-right: 24px;
-      }
-
-      :host([has-icon][has-label]) .label {
-        padding-left: 8px;
-        padding-right: 24px;
-      }
-      :host([has-icon][has-label]) slot[name='icon']::slotted(*) {
-        padding-left: 16px;
-      }
-
-      :host([disabled]) .label,
-      :host([disabled]) slot[name='icon']::slotted(*) {
-        opacity: 0.38;
-      }
-
-      ::slotted(*) {
-        pointer-events: none;
-      }
-
-      :host(:focus),
-      :host(:hover) {
-        --elevation-level: 2;
-      }
-
-      :host(:active) {
-        --elevation-level: 0;
-      }
-
-      button * {
-        pointer-events: none;
-      }
+            css `
+      :host {
+        color: var(--custom-fab-color, --md-sys-color-on-background);
+        display: flex;
+
+        height: 56px;
+        width: 56px;
+        border-radius: var(--md-sys-shape-corner-extra-large);
+        position: relative;
+        pointer-events: auto;
+        cursor: pointer;
+        box-sizing: border-box;
+        padding: 16px;
+
+        --elevation-level: 0;
+      }
+
+      button {
+        box-sizing: border-box;
+        border: none;
+        background: transparent;
+        color: inherit;
+        align-items: center;
+        justify-content: center;
+        user-select: none;
+        outline: none;
+        cursor: pointer;
+        border-radius: inherit;
+        padding: none;
+        width: inherit;
+        height: inherit;
+        display: flex;
+        pointer-events: none;
+      }
+
+      ::slotted(*) {
+        font-family: var(--md-sys-typescale-label-large-font-family-name);
+        font-style: var(--md-sys-typescale-label-large-font-family-style);
+        font-weight: var(--md-sys-typescale-label-large-font-weight);
+        font-size: var(--md-sys-typescale-label-large-font-size);
+        letter-spacing: var(--md-sys-typescale-label-large-tracking);
+        line-height: var(--md-sys-typescale-label-large-height);
+        text-transform: var(--md-sys-typescale-label-large-text-transform);
+        text-decoration: var(--md-sys-typescale-label-large-text-decoration);
+      }
+
+      :host([type='filled']),
+      :host([type='filled']) ::slotted(*) {
+        color: var(--md-sys-color-on-primary);
+        fill: var(--md-sys-color-on-primary);
+        background: var(--md-sys-color-primary);
+      }
+
+      :host([type='outlined']),
+      :host([type='outlined']) ::slotted(*) {
+        color: var(--md-sys-color-on-surface);
+        fill: var(--md-sys-color-on-surface);
+        background: var(--md-sys-color-surface);
+        border: solid 1px;
+        border-color: var(--md-sys-color-outline);
+      }
+
+      :host([type='elevated']),
+      :host([type='elevated']) ::slotted(*) {
+        color: var(--md-sys-color-primary);
+        fill: var(--md-sys-color-primary);
+        background: var(--md-sys-color-surface-container-low);
+      }
+
+      :host([type='tertiary']),
+      :host([type='tertiary']) ::slotted(*) {
+        background: var(--md-sys-color-tertiary);
+        color: var(--md-sys-color-on-tertiary);
+        fill: var(--md-sys-color-on-tertiary);
+      }
+
+      :host([type='tonal']),
+      :host([type='tonal']) ::slotted(*) {
+        background: var(--md-sys-color-secondary-container);
+        color: var(--md-sys-color-on-seconday-container);
+        fill: var(--md-sys-color-on-seconday-container);
+      }
+
+      custom-elevation {
+        --md-elevation-level: var(--elevation-level);
+      }
+
+      custom-elevation {
+        --elevation-level: 1;
+      }
+
+      :host([type='normal']) button {
+        align-items: center;
+        justify-content: center;
+      }
+
+      :host([type='extended']) button {
+        align-items: center;
+      }
+
+      :host([type='extended']) {
+        min-width: 80px;
+        width: fit-content;
+      }
+
+      :not([name='icon']) ::slotted(*) {
+        margin-left: 24px;
+        margin-right: 24px;
+      }
+
+      :host([has-icon][has-label]) .label {
+        padding-left: 8px;
+        padding-right: 24px;
+      }
+      :host([has-icon][has-label]) slot[name='icon']::slotted(*) {
+        padding-left: 16px;
+      }
+
+      :host([disabled]) .label,
+      :host([disabled]) slot[name='icon']::slotted(*) {
+        opacity: 0.38;
+      }
+
+      ::slotted(*) {
+        pointer-events: none;
+      }
+
+      :host(:focus),
+      :host(:hover) {
+        --elevation-level: 2;
+      }
+
+      :host(:active) {
+        --elevation-level: 0;
+      }
+
+      button * {
+        pointer-events: none;
+      }
     `
         ];
         render() {
-            return html `
-      <button>
-        <custom-elevation></custom-elevation>
-        <slot name="icon"></slot>
-        <slot></slot>
-      </button>
+            return html `
+      <button>
+        <custom-elevation></custom-elevation>
+        <slot name="icon"></slot>
+        <slot></slot>
+      </button>
     `;
         }
         constructor() {

package/exports/icon-button.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, property, css, html, LiteElement } from '@vandeurenglenn/lite';
 import './button.js';
 import './icon.js';
@@ -28,21 +28,21 @@ let CustomIconButton = (() => {
         get icon() { return this.#icon_accessor_storage; }
         set icon(value) { this.#icon_accessor_storage = value; }
         static styles = [
-            css `
-      :host {
-        display: block;
-      }
-
-      custom-icon {
-        --custom-icon-color: var(--md-sys-color-on-surface);
-      }
+            css `
+      :host {
+        display: block;
+      }
+
+      custom-icon {
+        --custom-icon-color: var(--md-sys-color-on-surface);
+      }
     `
         ];
         render() {
-            return html `
-      <custom-button>
-        <custom-icon slot="icon" .icon=${this.icon}></custom-icon>
-      </custom-button>
+            return html `
+      <custom-button>
+        <custom-icon slot="icon" .icon=${this.icon}></custom-icon>
+      </custom-button>
     `;
         }
         constructor() {

package/exports/icon-set.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, css, LiteElement } from '@vandeurenglenn/lite';
 import PubSub from '@vandeurenglenn/little-pubsub';
 
@@ -18,10 +18,10 @@ let CustomIconSet = (() => {
             if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static styles = [
-            css `
-      :host {
-        display: none;
-      }
+            css `
+      :host {
+        display: none;
+      }
     `
         ];
         #getIcon(name) {

package/exports/icon.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import PubSub from '@vandeurenglenn/little-pubsub';
 import { customElement, property, css, html, LiteElement } from '@vandeurenglenn/lite';
 
@@ -66,21 +66,21 @@ let CustomIcon = (() => {
             }
         }
         static styles = [
-            css `
-      :host {
-        --__custom-icon-size: var(--custom-icon-size, 24px);
-        --custom-icon-color: var(--md-sys-color-on-surface);
-        display: flex;
-        height: var(--custom-icon-size, 24px);
-        width: var(--custom-icon-size, 24px);
-      }
-
-      svg {
-        fill: var(--custom-icon-color);
-        height: inherit;
-        width: inherit;
-        pointer-events: none;
-      }
+            css `
+      :host {
+        --__custom-icon-size: var(--custom-icon-size, 24px);
+        --custom-icon-color: var(--md-sys-color-on-surface);
+        display: flex;
+        height: var(--custom-icon-size, 24px);
+        width: var(--custom-icon-size, 24px);
+      }
+
+      svg {
+        fill: var(--custom-icon-color);
+        height: inherit;
+        width: inherit;
+        pointer-events: none;
+      }
     `
         ];
         connectedCallback() {

package/exports/input.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, css, html, LiteElement } from '@vandeurenglenn/lite';
 
 let TimePickerInput = (() => {
@@ -16,11 +16,11 @@ let TimePickerInput = (() => {
             if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static styles = [
-            css `
-      :host {
-        display: flex;
-        flex-direction: column;
-      }
+            css `
+      :host {
+        display: flex;
+        flex-direction: column;
+      }
     `
         ];
         render() {

package/exports/list-item.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, property, assignedElements, query, css, html, LiteElement } from '@vandeurenglenn/lite';
 
 let CustomListItem = (() => {
@@ -70,51 +70,51 @@ let CustomListItem = (() => {
             this.startSlot.addEventListener('slotchange', this.#startSlotChange);
         }
         static styles = [
-            css `
-      * {
-        pointer-events: none;
-        user-select: none;
-      }
-      :host {
-        display: flex;
-        /* top, right, bottom, left */
-        padding: 8px 24px 8px 16px;
-        box-sizing: border-box;
-        width: 100%;
-        cursor: pointer;
-        min-width: 112px;
-        max-width: 280px;
-        height: 48px;
-        pointer-events: auto;
-      }
-      :host([type='menu']) {
-        padding: 0 12px;
-        height: 48px;
-      }
-
-      :host([type='menu']),
-      :host([type='one-line']) {
-        align-items: center;
-      }
-
-      :host([has-start]) .body {
-        padding-left: 12px;
-      }
-
-      :host([non-interactive]) {
-        pointer-events: none;
-        cursor: default;
-      }
+            css `
+      * {
+        pointer-events: none;
+        user-select: none;
+      }
+      :host {
+        display: flex;
+        /* top, right, bottom, left */
+        padding: 8px 24px 8px 16px;
+        box-sizing: border-box;
+        width: 100%;
+        cursor: pointer;
+        min-width: 112px;
+        max-width: 280px;
+        height: 48px;
+        pointer-events: auto;
+      }
+      :host([type='menu']) {
+        padding: 0 12px;
+        height: 48px;
+      }
+
+      :host([type='menu']),
+      :host([type='one-line']) {
+        align-items: center;
+      }
+
+      :host([has-start]) .body {
+        padding-left: 12px;
+      }
+
+      :host([non-interactive]) {
+        pointer-events: none;
+        cursor: default;
+      }
     `
         ];
         render() {
-            return html `
-      <slot name="start"></slot>
-      <span class="body">
-        <slot></slot>
-      </span>
-      <flex-it></flex-it>
-      <slot name="end"></slot>
+            return html `
+      <slot name="start"></slot>
+      <span class="body">
+        <slot></slot>
+      </span>
+      <flex-it></flex-it>
+      <slot name="end"></slot>
     `;
         }
         static {

package/exports/menu.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, css, html, LiteElement } from '@vandeurenglenn/lite';
 import './dropdown.js';
 import './selector.js';
@@ -41,21 +41,21 @@ let CustomMenu = (() => {
             this.selector.removeEventListener('selected', this.#onselected);
         }
         static styles = [
-            css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        width: 100%;
-        min-width: 120px;
-        max-width: 280px;
-      }
+            css `
+      :host {
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        min-width: 120px;
+        max-width: 280px;
+      }
     `
         ];
         render() {
-            return html `
-      <custom-selector>
-        <slot></slot>
-      </custom-selector>
+            return html `
+      <custom-selector>
+        <slot></slot>
+      </custom-selector>
     `;
         }
         static {

package/exports/minute-field.js

@@ -1,4 +1,4 @@
-import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-CFl_-KPR.js';
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
 import { customElement, css, html, LiteElement } from '@vandeurenglenn/lite';
 
 // import
@@ -17,10 +17,10 @@ let TimePickerMinuteField = (() => {
             if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static styles = [
-            css `
-      :host {
-        display: block;
-      }
+            css `
+      :host {
+        display: block;
+      }
     `
         ];
         render() {

package/exports/mixins/scroll-mixin.d.ts

@@ -2,7 +2,7 @@ export declare const ScrollMixin: (Base: any) => {
     new (): {
         [x: string]: any;
         scrolling: any;
-        scrollElement: any;
+        scrollElement: /*elided*/ any;
         "__#2@#onscroll": () => void;
         connectedCallback(options?: {
             scrollElement: undefined | string;