@universal-material/web 3.0.2 → 3.0.3
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 +1 -1
- package/button/button-base.d.ts.map +1 -1
- package/button/button-base.js +17 -17
- package/button/button-base.js.map +1 -1
- package/button/button-set.d.ts +2 -1
- package/button/button-set.d.ts.map +1 -1
- package/button/button-set.js.map +1 -1
- package/button/button.d.ts +6 -4
- package/button/button.d.ts.map +1 -1
- package/button/button.js +2 -2
- package/button/button.js.map +1 -1
- package/button/fab.d.ts +7 -5
- package/button/fab.d.ts.map +1 -1
- package/button/fab.js +11 -11
- package/button/fab.js.map +1 -1
- package/button/icon-button.d.ts +4 -3
- package/button/icon-button.d.ts.map +1 -1
- package/button/icon-button.js +2 -2
- package/button/icon-button.js.map +1 -1
- package/container/container.d.ts +1 -2
- package/container/container.d.ts.map +1 -1
- package/container/container.js.map +1 -1
- package/package.json +1 -1
package/button/button-base.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { HTMLTemplateResult, LitElement, nothing } from 'lit';
|
|
2
2
|
import '../elevation/elevation.js';
|
|
3
3
|
import '../ripple/ripple.js';
|
|
4
|
-
export declare abstract class
|
|
4
|
+
export declare abstract class UmButtonBase extends LitElement {
|
|
5
5
|
#private;
|
|
6
6
|
static readonly formAssociated = true;
|
|
7
7
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAG7B,8BAAsB,
|
|
1
|
+
{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAG7B,8BAAsB,YAAa,SAAQ,UAAU;;IAEnD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC;;OAEG;IACuC,QAAQ,UAAS;IAE3D;;OAEG;IACS,IAAI,SAAM;IAEtB;;;OAGG;IACS,MAAM,EAAE,MAAM,CAAM;IAEpB,IAAI,EAAE,MAAM,CAAY;IAET,KAAK,EAAE,MAAM,CAAM;IAClC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAe;IAC5C,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD;;;OAGG;IACH,IACI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,MAAM;IAMzB,OAAO,CAAC,YAAY;IAepB,OAAO,CAAC,UAAU;IAelB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAIb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI,GAAG,OAAO,OAAO;IAIxD,OAAO,CAAC,gBAAgB;IA8BxB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}
|
package/button/button-base.js
CHANGED
|
@@ -15,18 +15,18 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
|
|
|
15
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
16
|
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
17
17
|
};
|
|
18
|
-
var
|
|
18
|
+
var _UmButtonBase_elementInternals;
|
|
19
19
|
import { html, LitElement, nothing } from 'lit';
|
|
20
20
|
import { property, query } from 'lit/decorators.js';
|
|
21
21
|
import '../elevation/elevation.js';
|
|
22
22
|
import '../ripple/ripple.js';
|
|
23
|
-
export class
|
|
23
|
+
export class UmButtonBase extends LitElement {
|
|
24
24
|
/**
|
|
25
25
|
* The `<form>` element to associate the button with (its form owner). The value of this attribute must be the id of a `<form>` in the same document. (If this attribute is not set, the button is associated with its ancestor `<form>` element, if any.)
|
|
26
26
|
* @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#form
|
|
27
27
|
*/
|
|
28
28
|
get form() {
|
|
29
|
-
return __classPrivateFieldGet(this,
|
|
29
|
+
return __classPrivateFieldGet(this, _UmButtonBase_elementInternals, "f").form;
|
|
30
30
|
}
|
|
31
31
|
constructor() {
|
|
32
32
|
super();
|
|
@@ -45,8 +45,8 @@ export class ButtonBase extends LitElement {
|
|
|
45
45
|
this.target = '';
|
|
46
46
|
this.type = 'submit';
|
|
47
47
|
this.value = '';
|
|
48
|
-
|
|
49
|
-
__classPrivateFieldSet(this,
|
|
48
|
+
_UmButtonBase_elementInternals.set(this, void 0);
|
|
49
|
+
__classPrivateFieldSet(this, _UmButtonBase_elementInternals, this.attachInternals(), "f");
|
|
50
50
|
}
|
|
51
51
|
render() {
|
|
52
52
|
return this.href
|
|
@@ -110,7 +110,7 @@ export class ButtonBase extends LitElement {
|
|
|
110
110
|
if (!this.form) {
|
|
111
111
|
return;
|
|
112
112
|
}
|
|
113
|
-
__classPrivateFieldGet(this,
|
|
113
|
+
__classPrivateFieldGet(this, _UmButtonBase_elementInternals, "f").setFormValue(this.value);
|
|
114
114
|
if (this.type === 'submit') {
|
|
115
115
|
this.form.requestSubmit();
|
|
116
116
|
return;
|
|
@@ -120,33 +120,33 @@ export class ButtonBase extends LitElement {
|
|
|
120
120
|
handleClick(_) {
|
|
121
121
|
}
|
|
122
122
|
}
|
|
123
|
-
|
|
124
|
-
|
|
123
|
+
_UmButtonBase_elementInternals = new WeakMap();
|
|
124
|
+
UmButtonBase.formAssociated = true;
|
|
125
125
|
__decorate([
|
|
126
126
|
property({ type: Boolean, reflect: true })
|
|
127
|
-
],
|
|
127
|
+
], UmButtonBase.prototype, "disabled", void 0);
|
|
128
128
|
__decorate([
|
|
129
129
|
property()
|
|
130
|
-
],
|
|
130
|
+
], UmButtonBase.prototype, "href", void 0);
|
|
131
131
|
__decorate([
|
|
132
132
|
property()
|
|
133
|
-
],
|
|
133
|
+
], UmButtonBase.prototype, "target", void 0);
|
|
134
134
|
__decorate([
|
|
135
135
|
property()
|
|
136
|
-
],
|
|
136
|
+
], UmButtonBase.prototype, "type", void 0);
|
|
137
137
|
__decorate([
|
|
138
138
|
property({ reflect: true })
|
|
139
|
-
],
|
|
139
|
+
], UmButtonBase.prototype, "value", void 0);
|
|
140
140
|
__decorate([
|
|
141
141
|
property()
|
|
142
|
-
],
|
|
142
|
+
], UmButtonBase.prototype, "name", void 0);
|
|
143
143
|
__decorate([
|
|
144
144
|
query('.button')
|
|
145
|
-
],
|
|
145
|
+
], UmButtonBase.prototype, "buttonElement", void 0);
|
|
146
146
|
__decorate([
|
|
147
147
|
query('u-ripple')
|
|
148
|
-
],
|
|
148
|
+
], UmButtonBase.prototype, "ripple", void 0);
|
|
149
149
|
__decorate([
|
|
150
150
|
property()
|
|
151
|
-
],
|
|
151
|
+
], UmButtonBase.prototype, "form", null);
|
|
152
152
|
//# sourceMappingURL=button-base.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAG7B,MAAM,OAAgB,
|
|
1
|
+
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\nimport { UmRipple } from '../ripple/ripple';\n\nexport abstract class UmButtonBase extends LitElement {\n\n static readonly formAssociated = true;\n\n /**\n * Whether the button is disabled or not.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * The URL that the link button points to.\n */\n @property() href = '';\n\n /**\n * Where to display the linked `href` URL for a link button. Common options\n * include `_blank` to open in a new tab.\n */\n @property() target: string = '';\n\n @property() type: string = 'submit';\n\n @property({reflect: true}) value: string = '';\n @property() name: string | undefined;\n\n @query('.button') private readonly buttonElement!: HTMLElement;\n @query('u-ripple') private readonly ripple!: UmRipple;\n\n /**\n * The `<form>` element to associate the button with (its form owner). The value of this attribute must be the id of a `<form>` in the same document. (If this attribute is not set, the button is associated with its ancestor `<form>` element, if any.)\n * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#form\n */\n @property()\n get form(): HTMLFormElement | null {\n return this.#elementInternals.form;\n }\n\n readonly #elementInternals: ElementInternals;\n\n constructor() {\n super();\n this.#elementInternals = this.attachInternals();\n }\n\n protected override render() {\n return this.href\n ? this.renderLink()\n : this.renderButton();\n }\n\n private renderButton() {\n\n return html`\n <button\n id=\"button\"\n class=\"button\"\n ?disabled=${this.disabled}\n aria-label=\"${this.getAriaLabel()}\"\n type=\"button\">\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n <u-elevation></u-elevation>\n </button>\n ${this.renderContent()}`;\n }\n\n private renderLink() {\n\n return html`<a\n id=\"link\"\n class=\"button\"\n href=${this.disabled ? nothing : this.href}\n aria-disabled=${this.disabled || nothing}\n aria-label=\"${this.getAriaLabel()}\"\n target=${this.target || nothing}>\n <u-elevation></u-elevation>\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n </a>\n ${this.renderContent()}`;\n }\n\n protected abstract renderContent(): HTMLTemplateResult;\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('click', this.innerHandleClick);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener('click', this.innerHandleClick);\n }\n\n override focus() {\n this.buttonElement?.focus();\n }\n\n override blur() {\n this.buttonElement?.blur();\n }\n\n protected getAriaLabel(): string | null | typeof nothing {\n return this.ariaLabel || nothing;\n }\n\n private innerHandleClick(event: UIEvent): void {\n\n if (this.disabled) {\n return;\n }\n\n if (event.detail === 0) {\n this.ripple.createRipple();\n }\n\n this.handleClick(event);\n\n if (this.type === 'button' || !!this.href) {\n return;\n }\n\n if (!this.form) {\n return;\n }\n\n this.#elementInternals.setFormValue(this.value);\n\n if (this.type === 'submit') {\n this.form.requestSubmit();\n return;\n }\n\n this.form.reset();\n }\n\n protected handleClick(_: UIEvent): void {\n\n }\n}\n"]}
|
package/button/button-set.d.ts
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
2
|
+
export type UmButtonSetAlignment = 'start' | 'center' | 'end';
|
|
2
3
|
export declare class UmButtonSet extends LitElement {
|
|
3
4
|
static styles: import("lit").CSSResult;
|
|
4
5
|
/**
|
|
5
6
|
* Set the alignment of the buttons at the `start`, `center` or at the `end`.
|
|
6
7
|
*/
|
|
7
|
-
align:
|
|
8
|
+
align: UmButtonSetAlignment;
|
|
8
9
|
/**
|
|
9
10
|
* Whether to render the buttons stacked or not
|
|
10
11
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,qBACa,WAAY,SAAQ,UAAU;IAEzC,OAAgB,MAAM,0BAAU;IAEhC;;OAEG;IACwB,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAE9D,qBACa,WAAY,SAAQ,UAAU;IAEzC,OAAgB,MAAM,0BAAU;IAEhC;;OAEG;IACwB,KAAK,EAAE,oBAAoB,CAAS;IAE/D;;OAEG;IACuC,KAAK,UAAS;IAE/C,MAAM,IAAI,kBAAkB;CAItC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
|
package/button/button-set.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAKtC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAIL;;WAEG;QACwB,UAAK,GAAyB,KAAK,CAAC;QAE/D;;WAEG;QACuC,UAAK,GAAG,KAAK,CAAC;IAM1D,CAAC;IAJU,MAAM;QACb,OAAO,IAAI,CAAA;oBACK,CAAC;IACnB,CAAC;;AAfe,kBAAM,GAAG,MAAM,AAAT,CAAU;AAKL;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;0CAAqC;AAKrB;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;0CAAe;AAZ7C,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAkBvB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './button-set.styles';\n\nexport type UmButtonSetAlignment = 'start' | 'center' | 'end';\n\n@customElement('u-button-set')\nexport class UmButtonSet extends LitElement {\n\n static override styles = styles;\n\n /**\n * Set the alignment of the buttons at the `start`, `center` or at the `end`.\n */\n @property({reflect: true}) align: UmButtonSetAlignment = 'end';\n\n /**\n * Whether to render the buttons stacked or not\n */\n @property({type: Boolean, reflect: true}) stack = false;\n\n override render(): HTMLTemplateResult {\n return html`\n <slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-button-set': UmButtonSet;\n }\n}\n"]}
|
package/button/button.d.ts
CHANGED
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
import { CSSResult, HTMLTemplateResult } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UmButtonBase } from './button-base';
|
|
3
3
|
import '../ripple/ripple.js';
|
|
4
|
-
export
|
|
4
|
+
export type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';
|
|
5
|
+
export type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error' | undefined;
|
|
6
|
+
export declare class UmButton extends UmButtonBase {
|
|
5
7
|
static styles: CSSResult | CSSResult[];
|
|
6
8
|
/**
|
|
7
9
|
* The Button variant to render
|
|
8
10
|
*/
|
|
9
|
-
variant:
|
|
11
|
+
variant: UmButtonVariant;
|
|
10
12
|
/**
|
|
11
13
|
* The Button color
|
|
12
14
|
*
|
|
13
15
|
* _Note:_ Filled buttons only
|
|
14
16
|
*/
|
|
15
|
-
color:
|
|
17
|
+
color: UmButtonColor;
|
|
16
18
|
trailingIcon: boolean;
|
|
17
19
|
/**
|
|
18
20
|
* Whether the button has icon or not
|
package/button/button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGnE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGnE,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAG7C,OAAO,qBAAqB,CAAC;AAE7B,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;AACpF,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,GAAG,SAAS,CAAC;AAEvF,qBACa,QAAS,SAAQ,YAAY;IAExC,OAAgB,MAAM,EAAE,SAAS,GAAG,SAAS,EAAE,CAA8B;IAE7E;;OAEG;IACwB,OAAO,EAAE,eAAe,CAAY;IAE/D;;;;OAIG;IACwB,KAAK,EAAE,aAAa,CAAC;IAEsB,YAAY,UAAS;IAE3F;;;;OAIG;IAC8D,OAAO,UAAS;IAGjF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;cAE5B,aAAa,IAAI,kBAAkB;IActD,OAAO,CAAC,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
|
package/button/button.js
CHANGED
|
@@ -6,11 +6,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
6
6
|
};
|
|
7
7
|
import { html, nothing } from 'lit';
|
|
8
8
|
import { customElement, property, queryAssignedElements } from 'lit/decorators.js';
|
|
9
|
-
import {
|
|
9
|
+
import { UmButtonBase } from './button-base';
|
|
10
10
|
import { styles as buttonBaseStyles } from './button-base.styles';
|
|
11
11
|
import { styles } from './button.styles';
|
|
12
12
|
import '../ripple/ripple.js';
|
|
13
|
-
let UmButton = class UmButton extends
|
|
13
|
+
let UmButton = class UmButton extends UmButtonBase {
|
|
14
14
|
constructor() {
|
|
15
15
|
super(...arguments);
|
|
16
16
|
/**
|
package/button/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,MAAM,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,qBAAqB,CAAC;AAMtB,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAAnC;;QAIL;;WAEG;QACwB,YAAO,GAAoB,QAAQ,CAAC;QASO,iBAAY,GAAG,KAAK,CAAC;QAE3F;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;IAsBnF,CAAC;IAjBoB,aAAa;QAC9B,MAAM,IAAI,GAAG,IAAI,CAAA;;;;uBAIE,IAAI,CAAC,gBAAgB,WAAW,CAAC;QAEpD,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI;;QAElC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO;KACrC,CAAC;IACJ,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;;AA1Ce,eAAM,GAA4B,CAAC,gBAAgB,EAAE,MAAM,CAAC,AAAtD,CAAuD;AAKlD;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;yCAAqC;AAOpC;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;uCAAsB;AAEsB;IAArE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAsB;AAO1B;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;yCAAiB;AAGhE;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;+CACN;AA1BpC,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CA6CpB","sourcesContent":["import { CSSResult, html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base';\nimport { styles as buttonBaseStyles } from './button-base.styles';\nimport { styles } from './button.styles';\nimport '../ripple/ripple.js';\n\nexport type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error' | undefined;\n\n@customElement('u-button')\nexport class UmButton extends UmButtonBase {\n\n static override styles: CSSResult | CSSResult[] = [buttonBaseStyles, styles];\n\n /**\n * The Button variant to render\n */\n @property({reflect: true}) variant: UmButtonVariant = 'filled';\n\n /**\n * The Button color\n *\n * _Note:_ Filled buttons only\n */\n @property({reflect: true}) color: UmButtonColor;\n\n @property({type: Boolean, attribute: 'trailing-icon', reflect: true}) trailingIcon = false;\n\n /**\n * Whether the button has icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-icon', reflect: true}) hasIcon = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n protected override renderContent(): HTMLTemplateResult {\n const icon = html`\n <slot\n name=\"icon\"\n aria-hidden=\"true\"\n @slotchange=\"${this.handleSlotChange}\"></slot>`;\n\n return html`\n ${this.trailingIcon ? nothing : icon}\n <span><slot></slot></span>\n ${this.trailingIcon ? icon : nothing}\n `;\n }\n\n private handleSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-button': UmButton;\n }\n}\n"]}
|
package/button/fab.d.ts
CHANGED
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
import { CSSResult, HTMLTemplateResult } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
export
|
|
2
|
+
import { UmButtonBase } from './button-base';
|
|
3
|
+
export type UmFabColor = 'primary' | 'secondary' | 'tertiary' | 'surface' | 'branded';
|
|
4
|
+
export type UmFabSize = 'small' | 'medium' | 'large';
|
|
5
|
+
export declare class UmFab extends UmButtonBase {
|
|
4
6
|
static styles: CSSResult | CSSResult[];
|
|
5
7
|
/**
|
|
6
8
|
* The FAB color variant to render.
|
|
7
9
|
*/
|
|
8
|
-
color:
|
|
10
|
+
color: UmFabColor;
|
|
9
11
|
/**
|
|
10
12
|
* The size of the FAB.
|
|
11
13
|
*/
|
|
12
|
-
size:
|
|
14
|
+
size: UmFabSize;
|
|
13
15
|
/**
|
|
14
16
|
* The text to display the FAB.
|
|
15
17
|
*/
|
|
@@ -23,7 +25,7 @@ export declare class UmFabButton extends ButtonBase {
|
|
|
23
25
|
}
|
|
24
26
|
declare global {
|
|
25
27
|
interface HTMLElementTagNameMap {
|
|
26
|
-
'u-fab':
|
|
28
|
+
'u-fab': UmFab;
|
|
27
29
|
}
|
|
28
30
|
}
|
|
29
31
|
//# sourceMappingURL=fab.d.ts.map
|
package/button/fab.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab.d.ts","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGnE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"fab.d.ts","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGnE,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAI7C,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AACtF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD,qBACa,KAAM,SAAQ,YAAY;IAErC,OAAgB,MAAM,EAAE,SAAS,GAAG,SAAS,EAAE,CAA8B;IAE7E;;OAEG;IACwB,KAAK,EAAE,UAAU,CAAa;IAEzD;;OAEG;IACwB,IAAI,EAAE,SAAS,CAAY;IAEtD;;OAEG;IACwB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEvD;;OAEG;IACuC,OAAO,UAAS;IAE1D,IACI,QAAQ,IAAI,OAAO,CAEtB;cAEkB,aAAa,IAAI,kBAAkB;CAQvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,OAAO,EAAE,KAAK,CAAC;KAChB;CACF"}
|
package/button/fab.js
CHANGED
|
@@ -6,10 +6,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
6
6
|
};
|
|
7
7
|
import { html, nothing } from 'lit';
|
|
8
8
|
import { customElement, property } from 'lit/decorators.js';
|
|
9
|
-
import {
|
|
9
|
+
import { UmButtonBase } from './button-base';
|
|
10
10
|
import { styles as buttonBaseStyles } from './button-base.styles';
|
|
11
11
|
import { styles } from './fab.styles';
|
|
12
|
-
let
|
|
12
|
+
let UmFab = class UmFab extends UmButtonBase {
|
|
13
13
|
constructor() {
|
|
14
14
|
super(...arguments);
|
|
15
15
|
/**
|
|
@@ -40,24 +40,24 @@ let UmFabButton = class UmFabButton extends ButtonBase {
|
|
|
40
40
|
`;
|
|
41
41
|
}
|
|
42
42
|
};
|
|
43
|
-
|
|
43
|
+
UmFab.styles = [buttonBaseStyles, styles];
|
|
44
44
|
__decorate([
|
|
45
45
|
property({ reflect: true })
|
|
46
|
-
],
|
|
46
|
+
], UmFab.prototype, "color", void 0);
|
|
47
47
|
__decorate([
|
|
48
48
|
property({ reflect: true })
|
|
49
|
-
],
|
|
49
|
+
], UmFab.prototype, "size", void 0);
|
|
50
50
|
__decorate([
|
|
51
51
|
property({ reflect: true })
|
|
52
|
-
],
|
|
52
|
+
], UmFab.prototype, "label", void 0);
|
|
53
53
|
__decorate([
|
|
54
54
|
property({ type: Boolean, reflect: true })
|
|
55
|
-
],
|
|
55
|
+
], UmFab.prototype, "lowered", void 0);
|
|
56
56
|
__decorate([
|
|
57
57
|
property({ type: Boolean, reflect: true })
|
|
58
|
-
],
|
|
59
|
-
|
|
58
|
+
], UmFab.prototype, "extended", null);
|
|
59
|
+
UmFab = __decorate([
|
|
60
60
|
customElement('u-fab')
|
|
61
|
-
],
|
|
62
|
-
export {
|
|
61
|
+
], UmFab);
|
|
62
|
+
export { UmFab };
|
|
63
63
|
//# sourceMappingURL=fab.js.map
|
package/button/fab.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,MAAM,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAM/B,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,YAAY;IAAhC;;QAIL;;WAEG;QACwB,UAAK,GAAe,SAAS,CAAC;QAEzD;;WAEG;QACwB,SAAI,GAAc,QAAQ,CAAC;QAEtD;;WAEG;QACwB,UAAK,GAAkB,IAAI,CAAC;QAEvD;;WAEG;QACuC,YAAO,GAAG,KAAK,CAAC;IAe5D,CAAC;IAZC,IAAI,QAAQ;QACV,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAEkB,aAAa;QAC9B,MAAM,QAAQ,GAAG,IAAI,CAAA,SAAS,IAAI,CAAC,KAAK,SAAS,CAAC;QAElD,OAAO,IAAI,CAAA;;QAEP,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;KAClC,CAAC;IACJ,CAAC;;AAlCe,YAAM,GAA4B,CAAC,gBAAgB,EAAE,MAAM,CAAC,AAAtD,CAAuD;AAKlD;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;oCAA+B;AAK9B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;mCAA4B;AAK3B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;oCAA6B;AAKb;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;sCAAiB;AAG1D;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;qCAGxC;AA3BU,KAAK;IADjB,aAAa,CAAC,OAAO,CAAC;GACV,KAAK,CAqCjB","sourcesContent":["import { CSSResult, html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base';\nimport { styles as buttonBaseStyles } from './button-base.styles';\nimport { styles } from './fab.styles';\n\nexport type UmFabColor = 'primary' | 'secondary' | 'tertiary' | 'surface' | 'branded';\nexport type UmFabSize = 'small' | 'medium' | 'large';\n\n@customElement('u-fab')\nexport class UmFab extends UmButtonBase {\n\n static override styles: CSSResult | CSSResult[] = [buttonBaseStyles, styles];\n \n /**\n * The FAB color variant to render.\n */\n @property({reflect: true}) color: UmFabColor = 'primary';\n\n /**\n * The size of the FAB.\n */\n @property({reflect: true}) size: UmFabSize = 'medium';\n\n /**\n * The text to display the FAB.\n */\n @property({reflect: true}) label: string | null = null;\n\n /**\n * Lowers the FAB's elevation.\n */\n @property({type: Boolean, reflect: true}) lowered = false;\n\n @property({type: Boolean, reflect: true})\n get extended(): boolean {\n return !!this.label;\n }\n\n protected override renderContent(): HTMLTemplateResult {\n const labelTag = html`<span>${this.label}</span>`;\n\n return html`\n <span class=\"icon\" aria-hidden=\"true\"><slot name=\"icon\"></slot></span>\n ${this.label ? labelTag : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-fab': UmFab;\n }\n}\n"]}
|
package/button/icon-button.d.ts
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { CSSResult, HTMLTemplateResult, nothing } from 'lit';
|
|
2
2
|
import '../ripple/ripple.js';
|
|
3
|
-
import {
|
|
4
|
-
export
|
|
3
|
+
import { UmButtonBase } from './button-base';
|
|
4
|
+
export type UmIconButtonVariant = 'standard' | 'filled' | 'tonal' | 'outlined';
|
|
5
|
+
export declare class UmIconButton extends UmButtonBase {
|
|
5
6
|
static styles: CSSResult | CSSResult[];
|
|
6
|
-
variant:
|
|
7
|
+
variant: UmIconButtonVariant;
|
|
7
8
|
/**
|
|
8
9
|
* When true, the button will toggle between selected and unselected
|
|
9
10
|
* states
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGnE,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,kBAAkB,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGnE,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAI7C,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;AAE/E,qBACa,YAAa,SAAQ,YAAY;IAE5C,OAAgB,MAAM,EAAE,SAAS,GAAG,SAAS,EAAE,CAA8B;IAElD,OAAO,EAAE,mBAAmB,CAAc;IAErE;;;OAGG;IACwB,MAAM,UAAS;IAEiC,gBAAgB,UAAS;IAEpG;;;;OAIG;IACuC,QAAQ,UAAS;IAE3D;;OAEG;IAC2C,iBAAiB,SAAM;IAGrE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;cAE5B,aAAa,IAAI,kBAAkB;cAUnC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;IAMvC,YAAY,IAAI,MAAM,GAAG,IAAI,GAAG,OAAO,OAAO;IAMvD,OAAO,CAAC,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
|
package/button/icon-button.js
CHANGED
|
@@ -7,10 +7,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
7
7
|
import { html } from 'lit';
|
|
8
8
|
import { customElement, property, queryAssignedElements } from 'lit/decorators.js';
|
|
9
9
|
import '../ripple/ripple.js';
|
|
10
|
-
import {
|
|
10
|
+
import { UmButtonBase } from './button-base';
|
|
11
11
|
import { styles as buttonBaseStyles } from './button-base.styles';
|
|
12
12
|
import { styles } from './icon-button.styles';
|
|
13
|
-
let UmIconButton = class UmIconButton extends
|
|
13
|
+
let UmIconButton = class UmIconButton extends UmButtonBase {
|
|
14
14
|
constructor() {
|
|
15
15
|
super(...arguments);
|
|
16
16
|
this.variant = 'standard';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAA+B,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAa,IAAI,EAA+B,MAAM,KAAK,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,MAAM,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAKvC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,YAAY;IAAvC;;QAIsB,YAAO,GAAwB,UAAU,CAAC;QAErE;;;WAGG;QACwB,WAAM,GAAG,KAAK,CAAC;QAEiC,qBAAgB,GAAG,KAAK,CAAC;QAEpG;;;;WAIG;QACuC,aAAQ,GAAG,KAAK,CAAC;QAE3D;;WAEG;QAC2C,sBAAiB,GAAG,EAAE,CAAC;IA8BvE,CAAC;IAzBoB,aAAa;QAE9B,OAAO,IAAI,CAAA;;;6CAG8B,IAAI,CAAC,gBAAgB;;KAE7D,CAAC;IACJ,CAAC;IAEkB,WAAW,CAAC,CAAU;QACvC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC;IACH,CAAC;IAEQ,YAAY;QACnB,OAAO,IAAI,CAAC,QAAQ;YAClB,CAAC,CAAC,IAAI,CAAC,iBAAiB,IAAI,KAAK,CAAC,YAAY,EAAE;YAChD,CAAC,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IACxD,CAAC;;AAnDe,mBAAM,GAA4B,CAAC,gBAAgB,EAAE,MAAM,CAAC,AAAtD,CAAuD;AAElD;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;6CAA2C;AAM1C;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAgB;AAEiC;IAA1E,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;sDAA0B;AAO1D;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAkB;AAKb;IAA7C,QAAQ,CAAC,EAAC,SAAS,EAAE,qBAAqB,EAAC,CAAC;uDAAwB;AAGpD;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;mDACV;AA3BpC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAsDxB","sourcesContent":["import { CSSResult, html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport '../ripple/ripple.js';\nimport { UmButtonBase } from './button-base';\nimport { styles as buttonBaseStyles } from './button-base.styles';\nimport { styles } from './icon-button.styles';\n\nexport type UmIconButtonVariant = 'standard' | 'filled' | 'tonal' | 'outlined';\n\n@customElement('u-icon-button')\nexport class UmIconButton extends UmButtonBase {\n\n static override styles: CSSResult | CSSResult[] = [buttonBaseStyles, styles];\n\n @property({reflect: true}) variant: UmIconButtonVariant = 'standard';\n\n /**\n * When true, the button will toggle between selected and unselected\n * states\n */\n @property({type: Boolean}) toggle = false;\n\n @property({type: Boolean, attribute: 'has-selection-icon', reflect: true}) hasSelectionIcon = false;\n\n /**\n * Sets the selected state. When false, displays the default icon. When true,\n * displays the selected icon, or the default icon If no `slot=\"selected\"`\n * icon is provided.\n */\n @property({type: Boolean, reflect: true}) selected = false;\n\n /**\n * The `aria-label` of the button when the button is toggleable and selected.\n */\n @property({attribute: 'aria-label-selected'}) ariaLabelSelected = '';\n\n @queryAssignedElements({slot: 'selected', flatten: true})\n private readonly selectedIcons!: HTMLElement[];\n\n protected override renderContent(): HTMLTemplateResult {\n\n return html`\n <span class=\"icon\" aria-hidden=\"true\"><slot></slot></span>\n <span class=\"icon icon-selected\" aria-hidden=\"true\">\n <slot name=\"selected\" @slotchange=\"${this.handleSlotChange}\"></slot>\n </span>\n `;\n }\n\n protected override handleClick(_: UIEvent): void {\n if (this.toggle) {\n this.selected = !this.selected;\n }\n }\n\n override getAriaLabel(): string | null | typeof nothing {\n return this.selected\n ? this.ariaLabelSelected || super.getAriaLabel()\n : super.getAriaLabel();\n }\n\n private handleSlotChange() {\n this.hasSelectionIcon = this.selectedIcons.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-icon-button': UmIconButton;\n }\n}\n"]}
|
package/container/container.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
2
|
-
type SpacingSizes = 'none' | 'small' | 'medium ' | 'large' | 'extra-large';
|
|
2
|
+
export type SpacingSizes = 'none' | 'small' | 'medium ' | 'large' | 'extra-large';
|
|
3
3
|
export declare class UmContainer extends LitElement {
|
|
4
4
|
static styles: import("lit").CSSResult;
|
|
5
5
|
margin: SpacingSizes | undefined;
|
|
@@ -10,5 +10,4 @@ declare global {
|
|
|
10
10
|
'u-container': UmContainer;
|
|
11
11
|
}
|
|
12
12
|
}
|
|
13
|
-
export {};
|
|
14
13
|
//# sourceMappingURL=container.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/container/container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,
|
|
1
|
+
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../src/container/container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAElF,qBACa,WAAY,SAAQ,UAAU;IAEzC,OAAgB,MAAM,0BAAU;IAEL,MAAM,EAAE,YAAY,GAAG,SAAS,CAAC;IAEnD,MAAM,IAAI,kBAAkB;CAGtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,WAAW,CAAC;KAC5B;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/container/container.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAKxC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAMhC,MAAM;QACb,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AANe,kBAAM,GAAG,MAAM,AAAT,CAAU;AAEL;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAkC;AAJjD,WAAW;IADvB,aAAa,CAAC,aAAa,CAAC;GAChB,WAAW,CASvB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './container.styles.js';\n\
|
|
1
|
+
{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/container/container.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAKxC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAMhC,MAAM;QACb,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AANe,kBAAM,GAAG,MAAM,AAAT,CAAU;AAEL;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAkC;AAJjD,WAAW;IADvB,aAAa,CAAC,aAAa,CAAC;GAChB,WAAW,CASvB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './container.styles.js';\n\nexport type SpacingSizes = 'none' | 'small' | 'medium ' | 'large' | 'extra-large';\n\n@customElement('u-container')\nexport class UmContainer extends LitElement {\n\n static override styles = styles;\n\n @property({reflect: true}) margin: SpacingSizes | undefined;\n\n override render(): HTMLTemplateResult {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-container': UmContainer;\n }\n}\n"]}
|