@universal-material/web 3.0.65 → 3.0.67
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/button/button-base.d.ts +0 -4
- package/button/button-base.d.ts.map +1 -1
- package/button/button-base.js +0 -7
- package/button/button-base.js.map +1 -1
- package/custom-elements.json +7276 -5950
- package/field/field-base.d.ts +6 -3
- package/field/field-base.d.ts.map +1 -1
- package/field/field-base.js +18 -5
- package/field/field-base.js.map +1 -1
- package/field/field-base.styles.d.ts.map +1 -1
- package/field/field-base.styles.js +3 -0
- package/field/field-base.styles.js.map +1 -1
- package/index.d.ts +3 -0
- package/index.d.ts.map +1 -1
- package/index.js +3 -0
- package/index.js.map +1 -1
- package/menu/menu.d.ts.map +1 -1
- package/menu/menu.js.map +1 -1
- package/package.json +1 -1
- package/select/option.d.ts +20 -0
- package/select/option.d.ts.map +1 -0
- package/select/option.js +126 -0
- package/select/option.js.map +1 -0
- package/select/option.styles.d.ts +2 -0
- package/select/option.styles.d.ts.map +1 -0
- package/select/option.styles.js +5 -0
- package/select/option.styles.js.map +1 -0
- package/select/select.d.ts +31 -0
- package/select/select.d.ts.map +1 -0
- package/select/select.js +130 -0
- package/select/select.js.map +1 -0
- package/select/select.styles.d.ts +2 -0
- package/select/select.styles.d.ts.map +1 -0
- package/select/select.styles.js +20 -0
- package/select/select.styles.js.map +1 -0
- package/shared/text-field-base/text-field-base.styles.js +1 -1
- package/shared/text-field-base/text-field-base.styles.js.map +1 -1
package/field/field-base.d.ts
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import { Context, ContextProvider } from '@lit/context';
|
|
2
2
|
import { CSSResultGroup } from '@lit/reactive-element/css-tag';
|
|
3
|
-
import {
|
|
3
|
+
import { LitElement } from 'lit';
|
|
4
|
+
import { TemplateResult } from 'lit-html';
|
|
4
5
|
import { UmFieldDefaults } from './field-defaults.js';
|
|
5
6
|
export declare abstract class UmFieldBase extends LitElement {
|
|
7
|
+
#private;
|
|
6
8
|
static styles: CSSResultGroup;
|
|
7
9
|
private config;
|
|
8
10
|
variant: 'filled' | 'outlined' | undefined;
|
|
@@ -39,8 +41,9 @@ export declare abstract class UmFieldBase extends LitElement {
|
|
|
39
41
|
container: HTMLElement;
|
|
40
42
|
private labelSizeObserver;
|
|
41
43
|
constructor();
|
|
42
|
-
protected render():
|
|
43
|
-
protected abstract renderControl():
|
|
44
|
+
protected render(): TemplateResult;
|
|
45
|
+
protected abstract renderControl(): TemplateResult;
|
|
46
|
+
protected renderAfterContent(): TemplateResult;
|
|
44
47
|
connectedCallback(): void;
|
|
45
48
|
disconnectedCallback(): void;
|
|
46
49
|
private handleLeadingIconSlotChange;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-base.d.ts","sourceRoot":"","sources":["../../src/field/field-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,
|
|
1
|
+
{"version":3,"file":"field-base.d.ts","sourceRoot":"","sources":["../../src/field/field-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAO1C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,8BAAsB,WAAY,SAAQ,UAAU;;IAClD,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAI9D,OAAO,CAAC,MAAM,CAA8B;IAEhC,OAAO,EAAE,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAY;IAEtD,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IACE,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAEzB,KAAK,UAAS;IACd,QAAQ,UAAS;IACjB,OAAO,UAAS;IAE1D,MAAM,CAAC,WAAW,CAAC,WAAW,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,GAAG,eAAe,CAAC,OAAO,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;IAO7H;;;;OAIG;IACsE,cAAc,UAAS;IAEhG;;;;OAIG;IACuE,eAAe,UAAS;IAElG;;;;OAIG;IACoE,YAAY,UAAS;IAG5F,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAiB;IAGtD,OAAO,CAAC,QAAQ,CAAC,qBAAqB,CAAiB;IAGvD,OAAO,CAAC,QAAQ,CAAC,kBAAkB,CAAiB;IAEnC,YAAY,EAAG,WAAW,CAAC;IACvB,SAAS,EAAG,WAAW,CAAC;IAE7C,OAAO,CAAC,iBAAiB,CAA+B;;cAOrC,MAAM,IAAI,cAAc;IAsC3C,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,cAAc;IAClD,SAAS,CAAC,kBAAkB,IAAI,cAAc;IAIrC,iBAAiB;IAOjB,oBAAoB;IAc7B,OAAO,CAAC,2BAA2B;IASnC,OAAO,CAAC,4BAA4B;IAIpC,OAAO,CAAC,yBAAyB;IAIjC,OAAO,CAAC,uBAAuB;CAchC"}
|
package/field/field-base.js
CHANGED
|
@@ -4,6 +4,12 @@ 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
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
8
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
|
|
9
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
10
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
11
|
+
};
|
|
12
|
+
var _UmFieldBase_instances, _UmFieldBase_attach;
|
|
7
13
|
import { consume, ContextProvider } from '@lit/context';
|
|
8
14
|
import { html, LitElement } from 'lit';
|
|
9
15
|
import { property, query, queryAssignedElements, state } from 'lit/decorators.js';
|
|
@@ -19,6 +25,7 @@ export class UmFieldBase extends LitElement {
|
|
|
19
25
|
}
|
|
20
26
|
constructor() {
|
|
21
27
|
super();
|
|
28
|
+
_UmFieldBase_instances.add(this);
|
|
22
29
|
this.variant = 'filled';
|
|
23
30
|
this.empty = false;
|
|
24
31
|
this.disabled = false;
|
|
@@ -78,16 +85,16 @@ export class UmFieldBase extends LitElement {
|
|
|
78
85
|
<div>${this.counter}</div>
|
|
79
86
|
</slot>
|
|
80
87
|
</div>
|
|
88
|
+
${this.renderAfterContent()}
|
|
81
89
|
`;
|
|
82
90
|
}
|
|
91
|
+
renderAfterContent() {
|
|
92
|
+
return html ``;
|
|
93
|
+
}
|
|
83
94
|
connectedCallback() {
|
|
84
95
|
super.connectedCallback();
|
|
85
96
|
this.hasLeadingIcon = !!this.assignedLeadingIcons.length;
|
|
86
|
-
|
|
87
|
-
this.labelSizeObserver = new ResizeObserver(() => this.setLabelWidthProperties());
|
|
88
|
-
this.labelSizeObserver.observe(this.labelElement);
|
|
89
|
-
this.setLabelWidthProperties();
|
|
90
|
-
});
|
|
97
|
+
__classPrivateFieldGet(this, _UmFieldBase_instances, "m", _UmFieldBase_attach).call(this);
|
|
91
98
|
}
|
|
92
99
|
disconnectedCallback() {
|
|
93
100
|
super.disconnectedCallback();
|
|
@@ -118,6 +125,12 @@ export class UmFieldBase extends LitElement {
|
|
|
118
125
|
this.container.classList.remove('no-label');
|
|
119
126
|
}
|
|
120
127
|
}
|
|
128
|
+
_UmFieldBase_instances = new WeakSet(), _UmFieldBase_attach = async function _UmFieldBase_attach() {
|
|
129
|
+
await this.updateComplete;
|
|
130
|
+
this.labelSizeObserver = new ResizeObserver(() => this.setLabelWidthProperties());
|
|
131
|
+
this.labelSizeObserver.observe(this.labelElement);
|
|
132
|
+
this.setLabelWidthProperties();
|
|
133
|
+
};
|
|
121
134
|
UmFieldBase.styles = [baseStyles, styles];
|
|
122
135
|
__decorate([
|
|
123
136
|
consume({ context: fieldDefaultsContext, subscribe: true }),
|
package/field/field-base.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-base.js","sourceRoot":"","sources":["../../src/field/field-base.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"field-base.js","sourceRoot":"","sources":["../../src/field/field-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { consume, Context, ContextProvider } from '@lit/context';\nimport { CSSResultGroup } from '@lit/reactive-element/css-tag';\nimport { html, LitElement } from 'lit';\nimport { TemplateResult } from 'lit-html';\nimport { property, query, queryAssignedElements, state } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './field-base.styles.js';\n\nimport { fieldDefaultsContext } from './field-defaults-context.js';\nimport { UmFieldDefaults } from './field-defaults.js';\n\nexport abstract class UmFieldBase extends LitElement {\n static override styles: CSSResultGroup = [baseStyles, styles];\n\n @consume({context: fieldDefaultsContext, subscribe: true})\n @state()\n private config: UmFieldDefaults | undefined;\n\n @property() variant: 'filled' | 'outlined' | undefined = 'filled';\n\n @property() label: string | undefined;\n @property() counter: string | undefined;\n @property({attribute: 'supporting-text'}) supportingText: string | undefined;\n @property({attribute: 'error-text'}) errorText: string | undefined;\n\n @property({type: Boolean, reflect: true}) empty = false;\n @property({type: Boolean, reflect: true}) disabled = false;\n @property({type: Boolean, reflect: true}) invalid = false;\n\n static setDefaults(contextRoot: HTMLElement, config: UmFieldDefaults): ContextProvider<Context<HTMLElement, UmFieldDefaults>> {\n return new ContextProvider(contextRoot, {\n context: fieldDefaultsContext,\n initialValue: config\n });\n }\n\n /**\n * Whether the field has a leading icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-leading-icon', reflect: true}) hasLeadingIcon = false;\n\n /**\n * Whether the field has a trailing icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-trailing-icon', reflect: true}) hasTrailingIcon = false;\n\n /**\n * Whether the field has an error text or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-error-text', reflect: true}) hasErrorText = false;\n\n @queryAssignedElements({slot: 'leading-icon', flatten: true})\n private readonly assignedLeadingIcons!: HTMLElement[];\n\n @queryAssignedElements({slot: 'trailing-icon', flatten: true})\n private readonly assignedTrailingIcons!: HTMLElement[];\n\n @queryAssignedElements({slot: 'error-text', flatten: true})\n private readonly assignedErrorTexts!: HTMLElement[];\n\n @query('.label') labelElement!: HTMLElement;\n @query('.container') container!: HTMLElement;\n\n private labelSizeObserver: ResizeObserver | null = null;\n\n constructor() {\n super();\n this.variant = undefined;\n }\n\n protected override render(): TemplateResult {\n return html`\n <div class=\"container ${this.variant ?? this.config?.variant ?? 'filled'}\">\n <slot\n class=\"icon leading-icon\"\n name=\"leading-icon\"\n @slotchange=\"${this.handleLeadingIconSlotChange}\">\n </slot>\n <label class=\"label\" slot=\"label\" id=\"label\">\n <slot name=\"label\">${this.label}</slot>\n </label>\n <div class=\"input-wrapper\" part=\"wrapper\">\n ${this.renderControl()}\n </div>\n <slot\n class=\"icon trailing-icon\"\n name=\"trailing-icon\"\n @slotchange=\"${this.handleTrailingIconSlotChange}\">\n </slot>\n </div>\n <div class=\"supporting-text\" id=\"supporting-text\">\n <slot\n class=\"error-text\"\n name=\"error-text\"\n @slotchange=\"${this.handleErrorTextSlotChange}\">\n <div>${this.errorText}</div>\n </slot>\n <slot name=\"supporting-text\" id=\"supporting-text\">\n <div>${this.supportingText}</div>\n </slot>\n <slot class=\"counter\" name=\"counter\">\n <div>${this.counter}</div>\n </slot>\n </div>\n ${this.renderAfterContent()}\n `;\n }\n\n protected abstract renderControl(): TemplateResult;\n protected renderAfterContent(): TemplateResult {\n return html``;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.hasLeadingIcon = !!this.assignedLeadingIcons.length;\n\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.labelSizeObserver!.disconnect();\n this.labelSizeObserver = null;\n }\n\n async #attach(): Promise<void> {\n await this.updateComplete;\n this.labelSizeObserver = new ResizeObserver(() => this.setLabelWidthProperties())\n this.labelSizeObserver.observe(this.labelElement);\n this.setLabelWidthProperties();\n }\n\n private handleLeadingIconSlotChange() {\n this.labelElement.style.transition = 'none';\n this.hasLeadingIcon = this.assignedLeadingIcons.length > 0;\n\n setTimeout(() => {\n this.labelElement.style.transition = '';\n });\n }\n\n private handleTrailingIconSlotChange() {\n this.hasTrailingIcon = this.assignedTrailingIcons.length > 0;\n }\n\n private handleErrorTextSlotChange() {\n this.hasErrorText = this.assignedErrorTexts.length > 0;\n }\n\n private setLabelWidthProperties() {\n\n const width = this.labelElement.offsetWidth;\n\n this.style.setProperty('--u-field-label-width', `${width}px`);\n this.style.setProperty('--u-field-label-half-width', `${width / 2}px`);\n\n if (!width) {\n this.container.classList.add('no-label');\n return;\n }\n\n this.container.classList.remove('no-label');\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-base.styles.d.ts","sourceRoot":"","sources":["../../src/field/field-base.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"field-base.styles.d.ts","sourceRoot":"","sources":["../../src/field/field-base.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAqTlB,CAAC"}
|
|
@@ -117,6 +117,7 @@ export const styles = css `
|
|
|
117
117
|
.input:focus {
|
|
118
118
|
outline: 0;
|
|
119
119
|
}
|
|
120
|
+
.input select,
|
|
120
121
|
.input input,
|
|
121
122
|
.input ::slotted(*) {
|
|
122
123
|
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"));
|
|
@@ -293,6 +294,8 @@ export const styles = css `
|
|
|
293
294
|
:host([disabled]) .label {
|
|
294
295
|
color: var(--u-field-label-disabled-color, var(--_disabled-color));
|
|
295
296
|
}
|
|
297
|
+
:host([disabled]) .input select,
|
|
298
|
+
:host([disabled]) .input select::placeholder,
|
|
296
299
|
:host([disabled]) .input input,
|
|
297
300
|
:host([disabled]) .input input::placeholder,
|
|
298
301
|
:host([disabled]) .input ::slotted(*),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-base.styles.js","sourceRoot":"","sources":["../../src/field/field-base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkTzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n --_control-line-height: var(--u-field-control-line-height, 1.5rem);\n --_label-line-height: var(--u-field-label-line-height, 1rem);\n --_field-icon-size: var(--u-field-icon-size, 1.5rem);\n --_field-control-padding: var(--u-field-control-padding, 16px);\n --_field-control-inline-padding: var(--u-field-control-inline-padding, var(--_field-control-padding));\n --_field-control-block-padding: var(--u-field-control-block-padding, var(--_field-control-padding));\n --_field-min-height: var(--u-field-min-height, 56px);\n --_field-placeholder-color: var(--u-field-placeholder-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_disabled-color: var(--u-field-disabled-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, .38)));\n --_disabled-background-color: var(--u-filled-field-disabled-background-color, rgba(var(--u-color-on-surface-rgb, ), var(--u-filled-field-background-disabled-opacity, .12)));\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n --_color-error: var(--u-field-error-color, var(--u-color-error, rgb(179, 38, 30)));\n --_active-indicator-opacity: 1;\n --_vertical-padding: var(--u-field-vertical-padding, 8px);\n --_icon-size: var(--u-field-icon-size, 1.5rem);\n --_icon-padding: var(--u-field-icon-padding, 12px);\n --_icon-color: var(--u-icon-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_focus-border-width: var(--u-text-field-focus-border-width, 2px);\n --_field-control-leading-padding: var(--_field-control-inline-padding);\n --_outlined-label-margin: var(--u-outlined-field-label-margin, 12px);\n --_outlined-label-padding: var(--u-outlined-field-label-padding, 4px);\n --u-label-input-start: auto;\n --u-label-input-span-leading-offset: 0;\n --u-label-input-span-trailing-offset: 0;\n --u-text-field-horizontal-padding: 12px;\n display: block;\n }\n\n .container {\n display: flex;\n align-items: center;\n position: relative;\n }\n .container::before, .container::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n pointer-events: none;\n }\n .container::before {\n background: var(--u-color-on-surface, rgb(29, 27, 32));\n transition: opacity 150ms;\n opacity: 0;\n }\n .container::after {\n border-width: var(--u-field-border-width, 1px);\n border-color: var(--u-field-border-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n @media (hover: hover) {\n :host(:not([disabled]):not([invalid]):hover) .container.filled::before {\n opacity: var(--u-state-hover-opacity, 0.08);\n }\n :host(:not([disabled]):not([invalid]):not(:focus-within):hover) .container::after {\n border-color: var(--u-field-hover-border-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n }\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--_icon-size);\n color: var(--_icon-color);\n font-size: var(--_icon-size);\n line-height: var(--_icon-size);\n }\n .icon::slotted(*) {\n flex-shrink: 0;\n }\n\n .leading-icon {\n margin-inline-start: var(--_icon-padding);\n }\n\n .trailing-icon {\n margin-inline-end: var(--_icon-padding);\n }\n\n .label {\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-field-label-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-label-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-label-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n font-size: var(--u-field-label-font-size, var(--u-body-s-font-size, 0.75rem));\n display: block;\n position: absolute;\n inset-inline-start: var(--_field-control-leading-padding);\n margin-bottom: 0;\n line-height: var(--_label-line-height);\n color: var(--u-field-label-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n transition: inset 200ms, font-size 200ms;\n }\n\n .input-wrapper {\n display: flex;\n align-items: center;\n flex: 1;\n padding-block: var(--_vertical-padding);\n padding-inline: var(--_field-control-inline-padding);\n min-height: var(--_field-min-height);\n transition: opacity 150ms;\n }\n\n .input {\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n flex: 1;\n }\n .input:focus {\n outline: 0;\n }\n .input input,\n .input ::slotted(*) {\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-field-control-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-control-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-control-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-control-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n display: block;\n width: 100%;\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n min-height: var(--_control-line-height);\n line-height: var(--_control-line-height);\n padding: 0;\n margin: 0;\n appearance: none;\n background: transparent;\n border: none;\n outline: 0 !important;\n }\n .input,\n .input ::slotted(select),\n .input ::slotted(:is(input, textarea))::placeholder {\n transition: color 150ms 100ms;\n }\n .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--_field-placeholder-color);\n }\n\n .supporting-text {\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-field-supporting-text-line-height, var(--u-body-s-line-height, 1rem));\n font-size: var(--u-field-supporting-text-font-size, var(--u-body-s-font-size, 0.75rem));\n letter-spacing: var(--u-field-supporting-text-letter-spacing, var(--u-body-s-letter-spacing, 0.0333333333rem));\n font-weight: var(--u-field-supporting-text-font-weight, var(--u-body-s-font-weight, var(--u-font-weight-regular, 400)));\n display: flex;\n color: var(--u-field-supporting-text, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n padding-inline: 16px;\n gap: 16px;\n }\n .supporting-text div:empty {\n display: none;\n }\n .supporting-text div,\n .supporting-text ::slotted(*) {\n display: inline-block;\n margin-top: 4px;\n }\n\n .error-text {\n display: none;\n }\n\n .counter div, .counter::slotted(*) {\n margin-inline-start: auto;\n }\n\n :host([has-leading-icon]) {\n --_field-control-leading-padding: calc(var(--_icon-padding) + var(--_icon-size) + var(--_field-control-inline-padding)) ;\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .trailing-icon {\n display: none;\n }\n\n :host(:focus-within) {\n --u-field-border-width: var(--_focus-border-width);\n }\n :host(:focus-within) .container::after {\n border-color: var(--u-field-focused-border-color, var(--_color-primary));\n }\n :host(:focus-within) .label {\n color: var(--u-field-label-focused-color, var(--_color-primary));\n }\n\n :host([invalid]) .container::after {\n border-color: var(--u-field-error-border-color, var(--_color-error));\n }\n :host([invalid]) .label {\n color: var(--u-field-label-error-color, var(--_color-error));\n }\n :host([invalid]) .supporting-text {\n color: var(--u-field-supporting-text-error-color, var(--_color-error));\n }\n :host([invalid]) .trailing-icon {\n color: var(--u-field-trailing-icon-error-color, var(--_color-error));\n }\n :host([invalid]) .leading-icon {\n color: var(--u-field-leading-icon-error-color, var(--_icon-color));\n }\n\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) .error-text,\n :host([invalid][has-error-text]) .error-text {\n display: contents;\n }\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) slot[name=supporting-text],\n :host([invalid][has-error-text]) slot[name=supporting-text] {\n display: none;\n }\n\n .container.filled {\n border-radius: var(--u-field-filled-border-radius, 4px 4px 0 0);\n background-color: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n }\n .container.filled::after {\n border-bottom-style: solid;\n }\n .container.filled:not(.no-label) .input-wrapper {\n padding-top: calc(var(--_vertical-padding) + var(--_label-line-height));\n padding-bottom: var(--_vertical-padding);\n }\n .container.filled .label {\n top: var(--_vertical-padding);\n }\n .container.filled .input ::slotted(:is(input, textarea, select, button)) {\n display: block;\n }\n .container.outlined::after {\n --_mid-point: calc(var(--u-field-label-half-width) + var(--_outlined-label-margin) + var(--_outlined-label-padding));\n border-radius: var(--u-outlined-field-shape-corder, var(--u-shape-corner-small, 8px));\n border-style: solid;\n clip-path: polygon(0 0, var(--_mid-point) 0, var(--_mid-point) var(--_focus-border-width), var(--_mid-point) var(--_focus-border-width), var(--_mid-point) 0, 100% 0, 100% 100%, 0 100%);\n transition: clip-path 100ms;\n }\n .container.outlined .label {\n top: calc(var(--_label-line-height) / -2);\n }\n\n .container.outlined:focus-within::after,\n :host(:not([empty])) .container.outlined::after {\n --_end-point: calc(var(--u-field-label-width) + var(--_outlined-label-margin) + (var(--_outlined-label-padding) * 2));\n clip-path: polygon(0 0, var(--_outlined-label-margin) 0, var(--_outlined-label-margin) var(--_focus-border-width), var(--_end-point) var(--_focus-border-width), var(--_end-point) 0, 100% 0, 100% 100%, 0 100%);\n }\n .container.outlined:focus-within .label,\n :host(:not([empty])) .container.outlined .label {\n inset-inline-start: calc(var(--_outlined-label-margin) + var(--_outlined-label-padding));\n }\n\n :host([empty]) ::slotted(select) {\n color: var(--_field-placeholder-color);\n }\n\n :host([empty]:not(:focus-within)) .label {\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n pointer-events: none;\n top: calc(var(--_field-min-height) / 2 - var(--_label-line-height) / 2);\n }\n :host([empty]:not(:focus-within)) .input-wrapper {\n opacity: 0;\n }\n :host([empty]:not(:focus-within)) .input,\n :host([empty]:not(:focus-within)) ::slotted(:is(input, textarea))::placeholder,\n :host([empty]:not(:focus-within)) ::slotted(select) {\n color: transparent;\n transition: color 150ms;\n }\n\n .container.no-label::after {\n clip-path: none !important;\n }\n\n :host([disabled]) .container .filled {\n background-color: var(--u-filled-field-disabled-background-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-filled-field-background-disabled-opacity, 0.04)));\n }\n :host([disabled]) .container::after {\n border-color: var(--u-field-disabled-border-color, var(--_disabled-color));\n }\n :host([disabled]) .supporting-text {\n color: var(--u-field-supporting-text-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .label {\n color: var(--u-field-label-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .input input,\n :host([disabled]) .input input::placeholder,\n :host([disabled]) .input ::slotted(*),\n :host([disabled]) .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--u-field-input-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .trailing-icon {\n color: var(--u-field-trailing-icon-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .leading-icon {\n color: var(--u-field-leading-icon-disabled-color, var(--_disabled-color));\n }\n`;\n"]}
|
|
1
|
+
{"version":3,"file":"field-base.styles.js","sourceRoot":"","sources":["../../src/field/field-base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqTzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n --_control-line-height: var(--u-field-control-line-height, 1.5rem);\n --_label-line-height: var(--u-field-label-line-height, 1rem);\n --_field-icon-size: var(--u-field-icon-size, 1.5rem);\n --_field-control-padding: var(--u-field-control-padding, 16px);\n --_field-control-inline-padding: var(--u-field-control-inline-padding, var(--_field-control-padding));\n --_field-control-block-padding: var(--u-field-control-block-padding, var(--_field-control-padding));\n --_field-min-height: var(--u-field-min-height, 56px);\n --_field-placeholder-color: var(--u-field-placeholder-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_disabled-color: var(--u-field-disabled-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, .38)));\n --_disabled-background-color: var(--u-filled-field-disabled-background-color, rgba(var(--u-color-on-surface-rgb, ), var(--u-filled-field-background-disabled-opacity, .12)));\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n --_color-error: var(--u-field-error-color, var(--u-color-error, rgb(179, 38, 30)));\n --_active-indicator-opacity: 1;\n --_vertical-padding: var(--u-field-vertical-padding, 8px);\n --_icon-size: var(--u-field-icon-size, 1.5rem);\n --_icon-padding: var(--u-field-icon-padding, 12px);\n --_icon-color: var(--u-icon-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_focus-border-width: var(--u-text-field-focus-border-width, 2px);\n --_field-control-leading-padding: var(--_field-control-inline-padding);\n --_outlined-label-margin: var(--u-outlined-field-label-margin, 12px);\n --_outlined-label-padding: var(--u-outlined-field-label-padding, 4px);\n --u-label-input-start: auto;\n --u-label-input-span-leading-offset: 0;\n --u-label-input-span-trailing-offset: 0;\n --u-text-field-horizontal-padding: 12px;\n display: block;\n }\n\n .container {\n display: flex;\n align-items: center;\n position: relative;\n }\n .container::before, .container::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n pointer-events: none;\n }\n .container::before {\n background: var(--u-color-on-surface, rgb(29, 27, 32));\n transition: opacity 150ms;\n opacity: 0;\n }\n .container::after {\n border-width: var(--u-field-border-width, 1px);\n border-color: var(--u-field-border-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n @media (hover: hover) {\n :host(:not([disabled]):not([invalid]):hover) .container.filled::before {\n opacity: var(--u-state-hover-opacity, 0.08);\n }\n :host(:not([disabled]):not([invalid]):not(:focus-within):hover) .container::after {\n border-color: var(--u-field-hover-border-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n }\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--_icon-size);\n color: var(--_icon-color);\n font-size: var(--_icon-size);\n line-height: var(--_icon-size);\n }\n .icon::slotted(*) {\n flex-shrink: 0;\n }\n\n .leading-icon {\n margin-inline-start: var(--_icon-padding);\n }\n\n .trailing-icon {\n margin-inline-end: var(--_icon-padding);\n }\n\n .label {\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-field-label-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-label-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-label-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n font-size: var(--u-field-label-font-size, var(--u-body-s-font-size, 0.75rem));\n display: block;\n position: absolute;\n inset-inline-start: var(--_field-control-leading-padding);\n margin-bottom: 0;\n line-height: var(--_label-line-height);\n color: var(--u-field-label-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n transition: inset 200ms, font-size 200ms;\n }\n\n .input-wrapper {\n display: flex;\n align-items: center;\n flex: 1;\n padding-block: var(--_vertical-padding);\n padding-inline: var(--_field-control-inline-padding);\n min-height: var(--_field-min-height);\n transition: opacity 150ms;\n }\n\n .input {\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n flex: 1;\n }\n .input:focus {\n outline: 0;\n }\n .input select,\n .input input,\n .input ::slotted(*) {\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-field-control-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-control-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-control-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-control-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n display: block;\n width: 100%;\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n min-height: var(--_control-line-height);\n line-height: var(--_control-line-height);\n padding: 0;\n margin: 0;\n appearance: none;\n background: transparent;\n border: none;\n outline: 0 !important;\n }\n .input,\n .input ::slotted(select),\n .input ::slotted(:is(input, textarea))::placeholder {\n transition: color 150ms 100ms;\n }\n .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--_field-placeholder-color);\n }\n\n .supporting-text {\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-field-supporting-text-line-height, var(--u-body-s-line-height, 1rem));\n font-size: var(--u-field-supporting-text-font-size, var(--u-body-s-font-size, 0.75rem));\n letter-spacing: var(--u-field-supporting-text-letter-spacing, var(--u-body-s-letter-spacing, 0.0333333333rem));\n font-weight: var(--u-field-supporting-text-font-weight, var(--u-body-s-font-weight, var(--u-font-weight-regular, 400)));\n display: flex;\n color: var(--u-field-supporting-text, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n padding-inline: 16px;\n gap: 16px;\n }\n .supporting-text div:empty {\n display: none;\n }\n .supporting-text div,\n .supporting-text ::slotted(*) {\n display: inline-block;\n margin-top: 4px;\n }\n\n .error-text {\n display: none;\n }\n\n .counter div, .counter::slotted(*) {\n margin-inline-start: auto;\n }\n\n :host([has-leading-icon]) {\n --_field-control-leading-padding: calc(var(--_icon-padding) + var(--_icon-size) + var(--_field-control-inline-padding)) ;\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .trailing-icon {\n display: none;\n }\n\n :host(:focus-within) {\n --u-field-border-width: var(--_focus-border-width);\n }\n :host(:focus-within) .container::after {\n border-color: var(--u-field-focused-border-color, var(--_color-primary));\n }\n :host(:focus-within) .label {\n color: var(--u-field-label-focused-color, var(--_color-primary));\n }\n\n :host([invalid]) .container::after {\n border-color: var(--u-field-error-border-color, var(--_color-error));\n }\n :host([invalid]) .label {\n color: var(--u-field-label-error-color, var(--_color-error));\n }\n :host([invalid]) .supporting-text {\n color: var(--u-field-supporting-text-error-color, var(--_color-error));\n }\n :host([invalid]) .trailing-icon {\n color: var(--u-field-trailing-icon-error-color, var(--_color-error));\n }\n :host([invalid]) .leading-icon {\n color: var(--u-field-leading-icon-error-color, var(--_icon-color));\n }\n\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) .error-text,\n :host([invalid][has-error-text]) .error-text {\n display: contents;\n }\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) slot[name=supporting-text],\n :host([invalid][has-error-text]) slot[name=supporting-text] {\n display: none;\n }\n\n .container.filled {\n border-radius: var(--u-field-filled-border-radius, 4px 4px 0 0);\n background-color: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n }\n .container.filled::after {\n border-bottom-style: solid;\n }\n .container.filled:not(.no-label) .input-wrapper {\n padding-top: calc(var(--_vertical-padding) + var(--_label-line-height));\n padding-bottom: var(--_vertical-padding);\n }\n .container.filled .label {\n top: var(--_vertical-padding);\n }\n .container.filled .input ::slotted(:is(input, textarea, select, button)) {\n display: block;\n }\n .container.outlined::after {\n --_mid-point: calc(var(--u-field-label-half-width) + var(--_outlined-label-margin) + var(--_outlined-label-padding));\n border-radius: var(--u-outlined-field-shape-corder, var(--u-shape-corner-small, 8px));\n border-style: solid;\n clip-path: polygon(0 0, var(--_mid-point) 0, var(--_mid-point) var(--_focus-border-width), var(--_mid-point) var(--_focus-border-width), var(--_mid-point) 0, 100% 0, 100% 100%, 0 100%);\n transition: clip-path 100ms;\n }\n .container.outlined .label {\n top: calc(var(--_label-line-height) / -2);\n }\n\n .container.outlined:focus-within::after,\n :host(:not([empty])) .container.outlined::after {\n --_end-point: calc(var(--u-field-label-width) + var(--_outlined-label-margin) + (var(--_outlined-label-padding) * 2));\n clip-path: polygon(0 0, var(--_outlined-label-margin) 0, var(--_outlined-label-margin) var(--_focus-border-width), var(--_end-point) var(--_focus-border-width), var(--_end-point) 0, 100% 0, 100% 100%, 0 100%);\n }\n .container.outlined:focus-within .label,\n :host(:not([empty])) .container.outlined .label {\n inset-inline-start: calc(var(--_outlined-label-margin) + var(--_outlined-label-padding));\n }\n\n :host([empty]) ::slotted(select) {\n color: var(--_field-placeholder-color);\n }\n\n :host([empty]:not(:focus-within)) .label {\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n pointer-events: none;\n top: calc(var(--_field-min-height) / 2 - var(--_label-line-height) / 2);\n }\n :host([empty]:not(:focus-within)) .input-wrapper {\n opacity: 0;\n }\n :host([empty]:not(:focus-within)) .input,\n :host([empty]:not(:focus-within)) ::slotted(:is(input, textarea))::placeholder,\n :host([empty]:not(:focus-within)) ::slotted(select) {\n color: transparent;\n transition: color 150ms;\n }\n\n .container.no-label::after {\n clip-path: none !important;\n }\n\n :host([disabled]) .container .filled {\n background-color: var(--u-filled-field-disabled-background-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-filled-field-background-disabled-opacity, 0.04)));\n }\n :host([disabled]) .container::after {\n border-color: var(--u-field-disabled-border-color, var(--_disabled-color));\n }\n :host([disabled]) .supporting-text {\n color: var(--u-field-supporting-text-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .label {\n color: var(--u-field-label-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .input select,\n :host([disabled]) .input select::placeholder,\n :host([disabled]) .input input,\n :host([disabled]) .input input::placeholder,\n :host([disabled]) .input ::slotted(*),\n :host([disabled]) .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--u-field-input-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .trailing-icon {\n color: var(--u-field-trailing-icon-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .leading-icon {\n color: var(--u-field-leading-icon-disabled-color, var(--_disabled-color));\n }\n`;\n"]}
|
package/index.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ import './switch/switch-list-item.js';
|
|
|
17
17
|
import './elevation/elevation.js';
|
|
18
18
|
import './field/field.js';
|
|
19
19
|
import './text-field/text-field.js';
|
|
20
|
+
import './select/select.js';
|
|
20
21
|
import './list/list.js';
|
|
21
22
|
import './list/list-item.js';
|
|
22
23
|
import './menu/menu.js';
|
|
@@ -50,6 +51,8 @@ export * from './switch/switch-list-item.js';
|
|
|
50
51
|
export * from './elevation/elevation.js';
|
|
51
52
|
export * from './field/field.js';
|
|
52
53
|
export * from './text-field/text-field.js';
|
|
54
|
+
export * from './select/select.js';
|
|
55
|
+
export * from './select/option.js';
|
|
53
56
|
export * from './list/list.js';
|
|
54
57
|
export * from './list/list-item.js';
|
|
55
58
|
export * from './menu/menu.js';
|
package/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","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,gBAAgB,CAAC;AACxB,OAAO,oBAAoB,CAAC;AAC5B,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,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,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAElC,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,gBAAgB,CAAC;AAC/B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","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,gBAAgB,CAAC;AACxB,OAAO,oBAAoB,CAAC;AAC5B,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,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,oBAAoB,CAAC;AAC5B,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,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAElC,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,gBAAgB,CAAC;AAC/B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC"}
|
package/index.js
CHANGED
|
@@ -17,6 +17,7 @@ import './switch/switch-list-item.js';
|
|
|
17
17
|
import './elevation/elevation.js';
|
|
18
18
|
import './field/field.js';
|
|
19
19
|
import './text-field/text-field.js';
|
|
20
|
+
import './select/select.js';
|
|
20
21
|
import './list/list.js';
|
|
21
22
|
import './list/list-item.js';
|
|
22
23
|
import './menu/menu.js';
|
|
@@ -50,6 +51,8 @@ export * from './switch/switch-list-item.js';
|
|
|
50
51
|
export * from './elevation/elevation.js';
|
|
51
52
|
export * from './field/field.js';
|
|
52
53
|
export * from './text-field/text-field.js';
|
|
54
|
+
export * from './select/select.js';
|
|
55
|
+
export * from './select/option.js';
|
|
53
56
|
export * from './list/list.js';
|
|
54
57
|
export * from './list/list-item.js';
|
|
55
58
|
export * from './menu/menu.js';
|
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,gBAAgB,CAAC;AACxB,OAAO,oBAAoB,CAAC;AAC5B,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,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,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAElC,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,gBAAgB,CAAC;AAC/B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,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 './chip/chip.js';\nimport './chip/chip-set.js';\nimport './chip-field/chip-field.js';\nimport './dialog/dialog.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 './progress/circular-progress.js';\nimport './progress/progress-bar.js';\nimport './ripple/ripple.js';\nimport './snackbar/snackbar.js';\nimport './typeahead/highlight.js';\nimport './typeahead/typeahead.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 './chip/chip.js';\nexport * from './chip-field/chip-field.js';\nexport * from './chip/chip-set.js';\nexport * from './dialog/dialog.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 './progress/circular-progress.js';\nexport * from './progress/progress-bar.js';\nexport * from './ripple/ripple.js';\nexport * from './snackbar/snackbar.js';\nexport * from './theme/theme-builder.js';\nexport * from './typeahead/highlight.js';\nexport * from './typeahead/typeahead.js';\n"]}
|
|
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,gBAAgB,CAAC;AACxB,OAAO,oBAAoB,CAAC;AAC5B,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,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,oBAAoB,CAAC;AAC5B,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,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,oBAAoB,CAAC;AAC5B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAElC,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,gBAAgB,CAAC;AAC/B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,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,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,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 './chip/chip.js';\nimport './chip/chip-set.js';\nimport './chip-field/chip-field.js';\nimport './dialog/dialog.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 './select/select.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 './progress/circular-progress.js';\nimport './progress/progress-bar.js';\nimport './ripple/ripple.js';\nimport './snackbar/snackbar.js';\nimport './typeahead/highlight.js';\nimport './typeahead/typeahead.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 './chip/chip.js';\nexport * from './chip-field/chip-field.js';\nexport * from './chip/chip-set.js';\nexport * from './dialog/dialog.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 './select/select.js';\nexport * from './select/option.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 './progress/circular-progress.js';\nexport * from './progress/progress-bar.js';\nexport * from './ripple/ripple.js';\nexport * from './snackbar/snackbar.js';\nexport * from './theme/theme-builder.js';\nexport * from './typeahead/highlight.js';\nexport * from './typeahead/typeahead.js';\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;AAiCnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAK9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAAsB;IACzC,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAYrB;IAE0B,WAAW,EAAE,UAAU,GAAG,OAAO,CAAc;IAE/C,WAAW,UAAS;IAE/C;;;OAGG;IAEH,YAAY,EAAE,YAAY,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAe;IAE9G;;;;;OAKG;IACwB,SAAS,EAAE,UAAU,GAAG,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAc;IAErG;;OAEG;IACoE,aAAa,UAAS;IAE7E,IAAI,EAAG,WAAW,CAAC;IACpB,GAAG,EAAG,WAAW,CAAC;IAIjC,IAAI,aAAa,IAAI,WAAW,GAAG,IAAI,GAAG,SAAS,CAElD;IACD,IAAI,aAAa,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,EAE9D;cAEkB,MAAM,IAAI,kBAAkB;IAYtC,iBAAiB;IAQjB,oBAAoB;IAK7B,MAAM,aAOJ;IAEF,IAAI,IAAI,IAAI;IASZ,KAAK,
|
|
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;AAiCnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAK9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAAsB;IACzC,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAYrB;IAE0B,WAAW,EAAE,UAAU,GAAG,OAAO,CAAc;IAE/C,WAAW,UAAS;IAE/C;;;OAGG;IAEH,YAAY,EAAE,YAAY,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAe;IAE9G;;;;;OAKG;IACwB,SAAS,EAAE,UAAU,GAAG,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAc;IAErG;;OAEG;IACoE,aAAa,UAAS;IAE7E,IAAI,EAAG,WAAW,CAAC;IACpB,GAAG,EAAG,WAAW,CAAC;IAIjC,IAAI,aAAa,IAAI,WAAW,GAAG,IAAI,GAAG,SAAS,CAElD;IACD,IAAI,aAAa,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,EAE9D;cAEkB,MAAM,IAAI,kBAAkB;IAYtC,iBAAiB;IAQjB,oBAAoB;IAK7B,MAAM,aAOJ;IAEF,IAAI,IAAI,IAAI;IASZ,KAAK,aAQJ;IAED,OAAO,CAAC,uBAAuB;IA0J/B,OAAO,CAAC,eAAe;IAqDvB,OAAO,CAAC,WAAW;CAWpB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF"}
|
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 AnchorCornerBlockSide {\n top: number;\n bottom: number;\n relativeY: number;\n}\n\ninterface AnchorCornerInlineSide {\n left: number;\n right: number;\n relativeX: number;\n}\n\ninterface AnchorBounds {\n top: AnchorCornerBlockSide;\n bottom: AnchorCornerBlockSide;\n start: AnchorCornerInlineSide;\n end: AnchorCornerInlineSide;\n width: number;\n height: number;\n}\n\ninterface MenuPosition {\n bounds: AnchorBounds;\n isRtl: boolean;\n}\n\ninterface MenuSize {\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 if (!this.manualFocus) {\n setTimeout(() => this.querySelector<HTMLElement>('u-menu-item:not([disabled])')?.focus());\n }\n }\n\n @property({reflect: true}) positioning: 'relative' | 'fixed' = 'relative';\n\n @property({type: Boolean}) manualFocus = false;\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})\n anchorCorner: 'auto-start' | 'auto-end' | 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'down-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: 'up-start' | 'up-end' | 'down-start' | 'down-end' = 'down-end';\n\n /**\n * Don't limit the height of the menu\n */\n @property({type: Boolean, attribute: 'allow-overflow', reflect: true}) allowOverflow = false;\n\n @query('.menu') menu!: HTMLElement;\n @query('.ref') ref!: HTMLElement;\n\n #anchorElement: HTMLElement | null | undefined;\n\n get anchorElement(): HTMLElement | null | undefined {\n return this.#anchorElement ?? this.parentElement! ?? (<ShadowRoot>this.getRootNode()).host;\n }\n set anchorElement(anchorElement: HTMLElement | null | undefined) {\n this.#anchorElement = anchorElement;\n }\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"ref\"></div>\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 // eslint-disable-next-line no-self-assign\n this.open = this.open;\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 if (!this.anchorElement) {\n return;\n }\n\n const menuPosition = this.getMenuPosition();\n const menuSize = this.getMenuSize()\n\n this.#resetMenu();\n this.#setToOpenUpOrDown(menuPosition, menuSize);\n this.#setToOpenToStartOrEnd(menuPosition, menuSize);\n }\n\n #resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.top = '';\n this.menu.style.bottom = '';\n this.menu.style.left = '';\n this.menu.style.right = '';\n this.menu.style.maxHeight = '';\n }\n\n #setToOpenUpOrDown(menuPosition: MenuPosition, menuSize: MenuSize): void {\n if (this.anchorCorner.startsWith('auto-')) {\n this.#openBlockAuto(menuPosition, menuSize);\n return;\n }\n\n const side = this.anchorCorner.startsWith('start-')\n ? menuPosition.bounds.top\n : menuPosition.bounds.bottom;\n\n if (this.direction.startsWith('up-')) {\n this.#tryOpenUp(side, menuSize);\n return;\n }\n\n this.#tryOpenDown(side, menuSize);\n }\n\n #openBlockAuto(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const topSide = menuPosition.bounds.top;\n const bottomSide = menuPosition.bounds.bottom;\n\n const viewPortHeight = window.innerHeight;\n\n if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {\n this.#openDown(bottomSide);\n return;\n }\n\n this.#openUp(topSide);\n }\n\n #tryOpenUp(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n if (side.top === side.bottom || side.top - menuSize.height >= 0) {\n this.#openUp(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #tryOpenDown(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n const viewPortHeight = window.innerHeight;\n\n if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {\n this.#openDown(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #openToLargestBlockSide(side: AnchorCornerBlockSide) {\n if (side.top > side.bottom) {\n this.#openUp(side);\n return;\n }\n\n this.#openDown(side);\n }\n\n #setToOpenToStartOrEnd(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const openStart = menuPosition.isRtl\n ? this.#tryOpenRight.bind(this)\n : this.#tryOpenLeft.bind(this);\n const openEnd = menuPosition.isRtl\n ? this.#tryOpenLeft.bind(this)\n : this.#tryOpenRight.bind(this);\n\n const side = this.anchorCorner.endsWith('-start')\n ? menuPosition.bounds.start\n : menuPosition.bounds.end;\n\n if (this.direction.endsWith('-start')) {\n openStart(side, menuSize);\n return;\n }\n\n openEnd(side, menuSize);\n }\n\n #tryOpenLeft(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n if (side.left === side.right || side.left - menuSize.width >= 0) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #tryOpenRight(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n const viewPortWidth = window.innerWidth;\n\n if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {\n this.menu.style.left = `${side.relativeX}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #openToLargestInlineSide(side: AnchorCornerInlineSide) {\n if (side.left > side.right) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.menu.style.left = `${side.relativeX}px`;\n }\n\n #openUp(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n\n this.menu.style.bottom = `${side.relativeY * -1}px`;\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.bottom}px`;\n }\n\n #openDown(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n this.menu.style.top = `${side.relativeY}px`;\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.top}px`;\n }\n\n private getMenuPosition(): MenuPosition {\n const viewPortWidth = window.innerWidth;\n const viewPortHeight = window.innerHeight;\n\n const anchorElement = this.anchorElement!;\n const anchorRect = anchorElement.getBoundingClientRect() as DOMRect\n const refRect = this.ref.getBoundingClientRect() as DOMRect\n const anchorStyles = getComputedStyle(anchorElement);\n const isRtl = anchorStyles.direction === 'rtl';\n\n const width = parseInt(anchorStyles.width, 10);\n const height = parseInt(anchorStyles.height, 10);\n\n const rectX = refRect.left;\n const rectY = refRect.top;\n\n const leftPoint: AnchorCornerInlineSide = {\n left: anchorRect.left,\n right: viewPortWidth - anchorRect.left,\n relativeX: anchorRect.left - rectX\n };\n\n const rightPoint: AnchorCornerInlineSide = {\n left: anchorRect.right,\n right: viewPortWidth - anchorRect.right,\n relativeX: leftPoint.relativeX + width\n };\n\n const topPoint: AnchorCornerBlockSide = {\n top: anchorRect.top,\n relativeY: anchorRect.top - rectY,\n bottom: viewPortHeight - anchorRect.top\n };\n\n const anchorBounds: AnchorBounds = {\n top: topPoint,\n bottom: {\n top: anchorRect.bottom,\n relativeY: topPoint.relativeY + height,\n bottom: viewPortHeight - anchorRect.bottom\n },\n start: isRtl ? rightPoint : leftPoint,\n end: isRtl ? leftPoint : rightPoint,\n width,\n height\n }\n\n return {\n isRtl: isRtl,\n bounds: anchorBounds\n };\n }\n\n private getMenuSize(): MenuSize {\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 AnchorCornerBlockSide {\n top: number;\n bottom: number;\n relativeY: number;\n}\n\ninterface AnchorCornerInlineSide {\n left: number;\n right: number;\n relativeX: number;\n}\n\ninterface AnchorBounds {\n top: AnchorCornerBlockSide;\n bottom: AnchorCornerBlockSide;\n start: AnchorCornerInlineSide;\n end: AnchorCornerInlineSide;\n width: number;\n height: number;\n}\n\ninterface MenuPosition {\n bounds: AnchorBounds;\n isRtl: boolean;\n}\n\ninterface MenuSize {\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 if (!this.manualFocus) {\n setTimeout(() => this.querySelector<HTMLElement>('u-menu-item:not([disabled])')?.focus());\n }\n }\n\n @property({reflect: true}) positioning: 'relative' | 'fixed' = 'relative';\n\n @property({type: Boolean}) manualFocus = false;\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})\n anchorCorner: 'auto-start' | 'auto-end' | 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'down-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: 'up-start' | 'up-end' | 'down-start' | 'down-end' = 'down-end';\n\n /**\n * Don't limit the height of the menu\n */\n @property({type: Boolean, attribute: 'allow-overflow', reflect: true}) allowOverflow = false;\n\n @query('.menu') menu!: HTMLElement;\n @query('.ref') ref!: HTMLElement;\n\n #anchorElement: HTMLElement | null | undefined;\n\n get anchorElement(): HTMLElement | null | undefined {\n return this.#anchorElement ?? this.parentElement! ?? (<ShadowRoot>this.getRootNode()).host;\n }\n set anchorElement(anchorElement: HTMLElement | null | undefined) {\n this.#anchorElement = anchorElement;\n }\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"ref\"></div>\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 // eslint-disable-next-line no-self-assign\n this.open = this.open;\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\n if (this.open && !this.#justShow) {\n this.open = false;\n return;\n }\n\n this.#justShow = false;\n }\n\n private calcDropdownPositioning() {\n if (!this.anchorElement) {\n return;\n }\n\n const menuPosition = this.getMenuPosition();\n const menuSize = this.getMenuSize()\n\n this.#resetMenu();\n this.#setToOpenUpOrDown(menuPosition, menuSize);\n this.#setToOpenToStartOrEnd(menuPosition, menuSize);\n }\n\n #resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.top = '';\n this.menu.style.bottom = '';\n this.menu.style.left = '';\n this.menu.style.right = '';\n this.menu.style.maxHeight = '';\n }\n\n #setToOpenUpOrDown(menuPosition: MenuPosition, menuSize: MenuSize): void {\n if (this.anchorCorner.startsWith('auto-')) {\n this.#openBlockAuto(menuPosition, menuSize);\n return;\n }\n\n const side = this.anchorCorner.startsWith('start-')\n ? menuPosition.bounds.top\n : menuPosition.bounds.bottom;\n\n if (this.direction.startsWith('up-')) {\n this.#tryOpenUp(side, menuSize);\n return;\n }\n\n this.#tryOpenDown(side, menuSize);\n }\n\n #openBlockAuto(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const topSide = menuPosition.bounds.top;\n const bottomSide = menuPosition.bounds.bottom;\n\n const viewPortHeight = window.innerHeight;\n\n if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {\n this.#openDown(bottomSide);\n return;\n }\n\n this.#openUp(topSide);\n }\n\n #tryOpenUp(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n if (side.top === side.bottom || side.top - menuSize.height >= 0) {\n this.#openUp(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #tryOpenDown(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n const viewPortHeight = window.innerHeight;\n\n if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {\n this.#openDown(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #openToLargestBlockSide(side: AnchorCornerBlockSide) {\n if (side.top > side.bottom) {\n this.#openUp(side);\n return;\n }\n\n this.#openDown(side);\n }\n\n #setToOpenToStartOrEnd(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const openStart = menuPosition.isRtl\n ? this.#tryOpenRight.bind(this)\n : this.#tryOpenLeft.bind(this);\n const openEnd = menuPosition.isRtl\n ? this.#tryOpenLeft.bind(this)\n : this.#tryOpenRight.bind(this);\n\n const side = this.anchorCorner.endsWith('-start')\n ? menuPosition.bounds.start\n : menuPosition.bounds.end;\n\n if (this.direction.endsWith('-start')) {\n openStart(side, menuSize);\n return;\n }\n\n openEnd(side, menuSize);\n }\n\n #tryOpenLeft(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n if (side.left === side.right || side.left - menuSize.width >= 0) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #tryOpenRight(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n const viewPortWidth = window.innerWidth;\n\n if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {\n this.menu.style.left = `${side.relativeX}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #openToLargestInlineSide(side: AnchorCornerInlineSide) {\n if (side.left > side.right) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.menu.style.left = `${side.relativeX}px`;\n }\n\n #openUp(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n\n this.menu.style.bottom = `${side.relativeY * -1}px`;\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.bottom}px`;\n }\n\n #openDown(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n this.menu.style.top = `${side.relativeY}px`;\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.top}px`;\n }\n\n private getMenuPosition(): MenuPosition {\n const viewPortWidth = window.innerWidth;\n const viewPortHeight = window.innerHeight;\n\n const anchorElement = this.anchorElement!;\n const anchorRect = anchorElement.getBoundingClientRect() as DOMRect\n const refRect = this.ref.getBoundingClientRect() as DOMRect\n const anchorStyles = getComputedStyle(anchorElement);\n const isRtl = anchorStyles.direction === 'rtl';\n\n const width = parseInt(anchorStyles.width, 10);\n const height = parseInt(anchorStyles.height, 10);\n\n const rectX = refRect.left;\n const rectY = refRect.top;\n\n const leftPoint: AnchorCornerInlineSide = {\n left: anchorRect.left,\n right: viewPortWidth - anchorRect.left,\n relativeX: anchorRect.left - rectX\n };\n\n const rightPoint: AnchorCornerInlineSide = {\n left: anchorRect.right,\n right: viewPortWidth - anchorRect.right,\n relativeX: leftPoint.relativeX + width\n };\n\n const topPoint: AnchorCornerBlockSide = {\n top: anchorRect.top,\n relativeY: anchorRect.top - rectY,\n bottom: viewPortHeight - anchorRect.top\n };\n\n const anchorBounds: AnchorBounds = {\n top: topPoint,\n bottom: {\n top: anchorRect.bottom,\n relativeY: topPoint.relativeY + height,\n bottom: viewPortHeight - anchorRect.bottom\n },\n start: isRtl ? rightPoint : leftPoint,\n end: isRtl ? leftPoint : rightPoint,\n width,\n height\n }\n\n return {\n isRtl: isRtl,\n bounds: anchorBounds\n };\n }\n\n private getMenuSize(): MenuSize {\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/package.json
CHANGED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { UmMenuItem } from '../menu/menu-item.js';
|
|
2
|
+
import './select.js';
|
|
3
|
+
export declare class UmOption extends UmMenuItem {
|
|
4
|
+
#private;
|
|
5
|
+
get value(): string;
|
|
6
|
+
set value(value: string);
|
|
7
|
+
get selected(): boolean;
|
|
8
|
+
set selected(selected: boolean);
|
|
9
|
+
private get _selectedAttribute();
|
|
10
|
+
private set _selectedAttribute(value);
|
|
11
|
+
connectedCallback(): void;
|
|
12
|
+
disconnectedCallback(): void;
|
|
13
|
+
private setNativeOption;
|
|
14
|
+
}
|
|
15
|
+
declare global {
|
|
16
|
+
interface HTMLElementTagNameMap {
|
|
17
|
+
'u-option': UmOption;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=option.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option.d.ts","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAGlD,OAAO,aAAa,CAAC;AAErB,qBACa,QAAS,SAAQ,UAAU;;IAItC,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAEtB;IAED,IACI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,QAAQ,EAAE,OAAO,EAU7B;IAID,OAAO,KAAK,kBAAkB,GAE7B;IAED,OAAO,KAAK,kBAAkB,QAO7B;IAIQ,iBAAiB;IAQjB,oBAAoB;IA2C7B,OAAO,CAAC,eAAe;CAYxB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
|
package/select/option.js
ADDED
|
@@ -0,0 +1,126 @@
|
|
|
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
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
8
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
|
|
9
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
10
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
11
|
+
};
|
|
12
|
+
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
13
|
+
if (kind === "m") throw new TypeError("Private method is not writable");
|
|
14
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
|
|
15
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
16
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
17
|
+
};
|
|
18
|
+
var _UmOption_instances, _UmOption_nativeOption, _UmOption_select, _UmOption_attach, _UmOption_handleClick;
|
|
19
|
+
import { customElement, property, state } from 'lit/decorators.js';
|
|
20
|
+
import { UmMenuItem } from '../menu/menu-item.js';
|
|
21
|
+
import './select.js';
|
|
22
|
+
let UmOption = class UmOption extends UmMenuItem {
|
|
23
|
+
constructor() {
|
|
24
|
+
super(...arguments);
|
|
25
|
+
_UmOption_instances.add(this);
|
|
26
|
+
_UmOption_nativeOption.set(this, document.createElement('option'));
|
|
27
|
+
_UmOption_select.set(this, void 0);
|
|
28
|
+
}
|
|
29
|
+
get value() {
|
|
30
|
+
return __classPrivateFieldGet(this, _UmOption_nativeOption, "f").value;
|
|
31
|
+
}
|
|
32
|
+
set value(value) {
|
|
33
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").value = value;
|
|
34
|
+
}
|
|
35
|
+
get selected() {
|
|
36
|
+
return __classPrivateFieldGet(this, _UmOption_nativeOption, "f").selected;
|
|
37
|
+
}
|
|
38
|
+
set selected(selected) {
|
|
39
|
+
if (this.selected === selected) {
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").selected = selected;
|
|
43
|
+
if (__classPrivateFieldGet(this, _UmOption_select, "f")) {
|
|
44
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").empty = !__classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent?.trim();
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
get _selectedAttribute() {
|
|
48
|
+
return __classPrivateFieldGet(this, _UmOption_nativeOption, "f").hasAttribute('selected');
|
|
49
|
+
}
|
|
50
|
+
// @ts-ignore
|
|
51
|
+
set _selectedAttribute(selected) {
|
|
52
|
+
if (selected) {
|
|
53
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").setAttribute('selected', '');
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").removeAttribute('selected');
|
|
57
|
+
}
|
|
58
|
+
connectedCallback() {
|
|
59
|
+
super.connectedCallback();
|
|
60
|
+
this.addEventListener('click', __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_handleClick));
|
|
61
|
+
this.setAttribute('tabindex', '-1');
|
|
62
|
+
__classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_attach).call(this);
|
|
63
|
+
}
|
|
64
|
+
disconnectedCallback() {
|
|
65
|
+
super.disconnectedCallback();
|
|
66
|
+
this.removeEventListener('click', __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_handleClick));
|
|
67
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").remove();
|
|
68
|
+
if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
// eslint-disable-next-line no-self-assign
|
|
72
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").value = __classPrivateFieldGet(this, _UmOption_select, "f").value;
|
|
73
|
+
__classPrivateFieldSet(this, _UmOption_select, null, "f");
|
|
74
|
+
}
|
|
75
|
+
setNativeOption() {
|
|
76
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent = this.textContent;
|
|
77
|
+
if (this.hasAttribute('selected')) {
|
|
78
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").setAttribute('selected', '');
|
|
79
|
+
}
|
|
80
|
+
else {
|
|
81
|
+
__classPrivateFieldGet(this, _UmOption_nativeOption, "f").removeAttribute('selected');
|
|
82
|
+
}
|
|
83
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").nativeSelect.appendChild(__classPrivateFieldGet(this, _UmOption_nativeOption, "f"));
|
|
84
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").empty = !__classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent?.trim();
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
_UmOption_nativeOption = new WeakMap();
|
|
88
|
+
_UmOption_select = new WeakMap();
|
|
89
|
+
_UmOption_instances = new WeakSet();
|
|
90
|
+
_UmOption_attach = async function _UmOption_attach() {
|
|
91
|
+
await this.updateComplete;
|
|
92
|
+
__classPrivateFieldSet(this, _UmOption_select, this.parentElement.tagName === 'U-SELECT'
|
|
93
|
+
? this.parentElement
|
|
94
|
+
: null, "f");
|
|
95
|
+
if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
|
|
96
|
+
return;
|
|
97
|
+
}
|
|
98
|
+
this.setNativeOption();
|
|
99
|
+
};
|
|
100
|
+
_UmOption_handleClick = function _UmOption_handleClick(e) {
|
|
101
|
+
if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
|
|
102
|
+
return;
|
|
103
|
+
}
|
|
104
|
+
e.stopPropagation();
|
|
105
|
+
this.selected = true;
|
|
106
|
+
// eslint-disable-next-line no-self-assign
|
|
107
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").value = __classPrivateFieldGet(this, _UmOption_select, "f").value;
|
|
108
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
|
|
109
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").dispatchEvent(new Event('change', { bubbles: true }));
|
|
110
|
+
__classPrivateFieldGet(this, _UmOption_select, "f").menu?.close();
|
|
111
|
+
};
|
|
112
|
+
__decorate([
|
|
113
|
+
property({ reflect: true })
|
|
114
|
+
], UmOption.prototype, "value", null);
|
|
115
|
+
__decorate([
|
|
116
|
+
state()
|
|
117
|
+
], UmOption.prototype, "selected", null);
|
|
118
|
+
__decorate([
|
|
119
|
+
property({ type: Boolean, attribute: 'selected' })
|
|
120
|
+
// @ts-ignore
|
|
121
|
+
], UmOption.prototype, "_selectedAttribute", null);
|
|
122
|
+
UmOption = __decorate([
|
|
123
|
+
customElement('u-option')
|
|
124
|
+
], UmOption);
|
|
125
|
+
export { UmOption };
|
|
126
|
+
//# sourceMappingURL=option.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option.js","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, state } from 'lit/decorators.js';\n\nimport { UmMenuItem } from '../menu/menu-item.js';\nimport { UmSelect } from './select.js';\n\nimport './select.js';\n\n@customElement('u-option')\nexport class UmOption extends UmMenuItem {\n\n #nativeOption: HTMLOptionElement = document.createElement('option');\n\n @property({reflect: true})\n get value(): string {\n return this.#nativeOption.value;\n }\n set value(value: string) {\n this.#nativeOption.value = value;\n }\n\n @state()\n get selected(): boolean {\n return this.#nativeOption.selected;\n }\n set selected(selected: boolean) {\n if (this.selected === selected) {\n return;\n }\n\n this.#nativeOption.selected = selected;\n\n if (this.#select) {\n this.#select.empty = !this.#nativeOption.textContent?.trim();\n }\n }\n\n @property({type: Boolean, attribute: 'selected'})\n // @ts-ignore\n private get _selectedAttribute(): boolean {\n return this.#nativeOption.hasAttribute('selected');\n }\n // @ts-ignore\n private set _selectedAttribute(selected: boolean) {\n if (selected) {\n this.#nativeOption.setAttribute('selected', '');\n return;\n }\n\n this.#nativeOption.removeAttribute('selected');\n }\n\n #select!: UmSelect | null;\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.#handleClick);\n this.setAttribute('tabindex', '-1');\n\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#handleClick);\n this.#nativeOption.remove();\n\n if (!this.#select) {\n return;\n }\n\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select = null;\n }\n\n async #attach(): Promise<void> {\n await this.updateComplete;\n this.#select = this.parentElement!.tagName === 'U-SELECT'\n ? this.parentElement as UmSelect\n : null;\n\n if (!this.#select) {\n return;\n }\n\n this.setNativeOption();\n }\n\n #handleClick(e: Event) {\n if (!this.#select) {\n return;\n }\n\n e.stopPropagation();\n\n this.selected = true;\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n this.#select.dispatchEvent(new Event('change', {bubbles: true}));\n\n this.#select.menu?.close();\n }\n\n private setNativeOption() {\n this.#nativeOption.textContent = this.textContent;\n\n if (this.hasAttribute('selected')) {\n this.#nativeOption.setAttribute('selected', '');\n } else {\n this.#nativeOption.removeAttribute('selected');\n }\n\n this.#select!.nativeSelect.appendChild(this.#nativeOption);\n this.#select!.empty = !this.#nativeOption.textContent?.trim();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-option': UmOption;\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option.styles.d.ts","sourceRoot":"","sources":["../../src/select/option.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAElB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option.styles.js","sourceRoot":"","sources":["../../src/select/option.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;CAEzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n\n`;\n"]}
|