@material/web 1.0.0-pre.15 → 1.0.0-pre.16
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/README.md +22 -17
- package/button/internal/_filled-button.scss +0 -1
- package/button/internal/_outlined-button.scss +6 -0
- package/button/internal/_shared.scss +7 -1
- package/button/internal/button.d.ts +15 -14
- package/button/internal/button.js +41 -39
- package/button/internal/button.js.map +1 -1
- package/button/internal/outlined-styles.css.js +1 -1
- package/button/internal/outlined-styles.css.js.map +1 -1
- package/button/internal/shared-elevation-styles.css.js +1 -1
- package/button/internal/shared-elevation-styles.css.js.map +1 -1
- package/button/internal/shared-styles.css.js +1 -1
- package/button/internal/shared-styles.css.js.map +1 -1
- package/checkbox/internal/_checkbox.scss +1 -0
- package/checkbox/internal/checkbox-styles.css.js +1 -1
- package/checkbox/internal/checkbox-styles.css.js.map +1 -1
- package/checkbox/internal/checkbox.d.ts +2 -2
- package/checkbox/internal/checkbox.js +18 -14
- package/checkbox/internal/checkbox.js.map +1 -1
- package/chips/assist-chip.js +1 -2
- package/chips/assist-chip.js.map +1 -1
- package/chips/filter-chip.js +1 -3
- package/chips/filter-chip.js.map +1 -1
- package/chips/input-chip.js +1 -5
- package/chips/input-chip.js.map +1 -1
- package/chips/internal/_assist-chip.scss +6 -0
- package/chips/internal/_elevated.scss +1 -1
- package/chips/internal/_filter-chip.scss +6 -0
- package/chips/internal/_input-chip.scss +32 -0
- package/chips/internal/_selectable.scss +17 -13
- package/chips/internal/_shared.scss +17 -10
- package/chips/internal/_suggestion-chip.scss +6 -0
- package/chips/internal/_trailing-icon.scss +24 -24
- package/chips/internal/assist-styles.css.js +1 -1
- package/chips/internal/assist-styles.css.js.map +1 -1
- package/chips/internal/elevated-styles.css.js +1 -1
- package/chips/internal/elevated-styles.css.js.map +1 -1
- package/chips/internal/filter-styles.css.js +1 -1
- package/chips/internal/filter-styles.css.js.map +1 -1
- package/chips/internal/input-styles.css.js +1 -1
- package/chips/internal/input-styles.css.js.map +1 -1
- package/chips/internal/selectable-styles.css.js +1 -1
- package/chips/internal/selectable-styles.css.js.map +1 -1
- package/chips/internal/shared-styles.css.js +1 -1
- package/chips/internal/shared-styles.css.js.map +1 -1
- package/chips/internal/suggestion-styles.css.js +1 -1
- package/chips/internal/suggestion-styles.css.js.map +1 -1
- package/chips/internal/trailing-icon-styles.css.js +1 -1
- package/chips/internal/trailing-icon-styles.css.js.map +1 -1
- package/chips/suggestion-chip.js +1 -2
- package/chips/suggestion-chip.js.map +1 -1
- package/elevation/internal/_elevation.scss +14 -7
- package/elevation/internal/elevation-styles.css.js +1 -1
- package/elevation/internal/elevation-styles.css.js.map +1 -1
- package/fab/branded-fab.d.ts +0 -1
- package/fab/internal/_fab.scss +11 -10
- package/fab/internal/_shared.scss +4 -1
- package/fab/internal/fab-styles.css.js +1 -1
- package/fab/internal/fab-styles.css.js.map +1 -1
- package/fab/internal/fab.d.ts +0 -1
- package/fab/internal/shared-styles.css.js +1 -1
- package/fab/internal/shared-styles.css.js.map +1 -1
- package/fab/internal/shared.d.ts +0 -9
- package/fab/internal/shared.js +2 -18
- package/fab/internal/shared.js.map +1 -1
- package/field/internal/filled-styles.css.js +1 -1
- package/field/internal/filled-styles.css.js.map +1 -1
- package/field/internal/outlined-styles.css.js +1 -1
- package/field/internal/outlined-styles.css.js.map +1 -1
- package/icon/internal/_icon.scss +10 -5
- package/icon/internal/icon-styles.css.js +1 -1
- package/icon/internal/icon-styles.css.js.map +1 -1
- package/iconbutton/internal/_icon-button.scss +4 -0
- package/iconbutton/internal/_shared.scss +9 -0
- package/iconbutton/internal/icon-button.d.ts +16 -3
- package/iconbutton/internal/icon-button.js +31 -7
- package/iconbutton/internal/icon-button.js.map +1 -1
- package/iconbutton/internal/shared-styles.css.js +1 -1
- package/iconbutton/internal/shared-styles.css.js.map +1 -1
- package/iconbutton/internal/standard-styles.css.js +1 -1
- package/iconbutton/internal/standard-styles.css.js.map +1 -1
- package/internal/controller/form-submitter.d.ts +12 -0
- package/internal/controller/form-submitter.js +3 -1
- package/internal/controller/form-submitter.js.map +1 -1
- package/labs/badge/internal/_badge.scss +11 -8
- package/labs/navigationbar/internal/_navigation-bar.scss +11 -9
- package/labs/navigationbar/internal/navigation-bar-styles.css.js +1 -1
- package/labs/navigationbar/internal/navigation-bar-styles.css.js.map +1 -1
- package/labs/navigationdrawer/internal/_navigation-drawer-modal.scss +11 -8
- package/labs/navigationdrawer/internal/_navigation-drawer.scss +11 -8
- package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js.map +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js.map +1 -1
- package/labs/navigationtab/internal/_navigation-tab.scss +10 -10
- package/labs/segmentedbutton/internal/_outlined-segmented-button.scss +1 -3
- package/labs/segmentedbutton/internal/outlined-styles.css.js +1 -1
- package/labs/segmentedbutton/internal/outlined-styles.css.js.map +1 -1
- package/list/internal/_list.scss +6 -2
- package/list/internal/list-styles.css.js +1 -1
- package/list/internal/list-styles.css.js.map +1 -1
- package/list/internal/listitem/_list-item.scss +83 -93
- package/list/internal/listitem/forced-colors-styles.css.js +1 -1
- package/list/internal/listitem/forced-colors-styles.css.js.map +1 -1
- package/list/internal/listitem/forced-colors-styles.scss +6 -6
- package/list/internal/listitem/list-item-styles.css.js +1 -1
- package/list/internal/listitem/list-item-styles.css.js.map +1 -1
- package/menu/internal/_menu.scss +6 -3
- package/menu/internal/menu-styles.css.js +1 -1
- package/menu/internal/menu-styles.css.js.map +1 -1
- package/menu/internal/menu.js +6 -6
- package/menu/internal/menu.js.map +1 -1
- package/menu/internal/menuitem/_menu-item.scss +7 -4
- package/menu/internal/menuitem/menu-item-styles.css.js +1 -1
- package/menu/internal/menuitem/menu-item-styles.css.js.map +1 -1
- package/package.json +1 -1
- package/progress/harness.js +2 -4
- package/progress/harness.js.map +1 -1
- package/progress/internal/_circular-progress.scss +4 -4
- package/progress/internal/_linear-progress.scss +93 -132
- package/progress/internal/circular-progress-styles.css.js +1 -1
- package/progress/internal/circular-progress-styles.css.js.map +1 -1
- package/progress/internal/circular-progress.js +1 -1
- package/progress/internal/circular-progress.js.map +1 -1
- package/progress/internal/linear-progress-styles.css.js +1 -1
- package/progress/internal/linear-progress-styles.css.js.map +1 -1
- package/progress/internal/linear-progress.d.ts +0 -11
- package/progress/internal/linear-progress.js +4 -48
- package/progress/internal/linear-progress.js.map +1 -1
- package/radio/internal/radio.d.ts +1 -1
- package/radio/internal/radio.js.map +1 -1
- package/ripple/internal/_ripple.scss +1 -1
- package/ripple/internal/ripple-styles.css.js +1 -1
- package/ripple/internal/ripple-styles.css.js.map +1 -1
- package/select/internal/_filled-select.scss +0 -1
- package/select/internal/_outlined-select.scss +0 -1
- package/select/internal/_shared.scss +0 -1
- package/select/internal/filled-select-styles.css.js +1 -1
- package/select/internal/filled-select-styles.css.js.map +1 -1
- package/select/internal/outlined-select-styles.css.js +1 -1
- package/select/internal/outlined-select-styles.css.js.map +1 -1
- package/slider/internal/_slider.scss +33 -28
- package/slider/internal/forced-colors-styles.css.js +1 -1
- package/slider/internal/forced-colors-styles.css.js.map +1 -1
- package/slider/internal/slider-styles.css.js +1 -1
- package/slider/internal/slider-styles.css.js.map +1 -1
- package/slider/internal/slider.d.ts +22 -8
- package/slider/internal/slider.js +113 -22
- package/slider/internal/slider.js.map +1 -1
- package/switch/internal/_switch.scss +9 -1
- package/switch/internal/switch-styles.css.js +1 -1
- package/switch/internal/switch-styles.css.js.map +1 -1
- package/switch/internal/switch.d.ts +1 -1
- package/switch/internal/switch.js +2 -2
- package/switch/internal/switch.js.map +1 -1
- package/tabs/internal/_tab.scss +76 -20
- package/tabs/internal/tab-styles.css.js +1 -1
- package/tabs/internal/tab-styles.css.js.map +1 -1
- package/tabs/internal/tab.js +0 -1
- package/tabs/internal/tab.js.map +1 -1
- package/textfield/internal/filled-styles.css.js +1 -1
- package/textfield/internal/filled-styles.css.js.map +1 -1
- package/textfield/internal/outlined-styles.css.js +1 -1
- package/textfield/internal/outlined-styles.css.js.map +1 -1
- package/textfield/internal/text-field.d.ts +11 -10
- package/textfield/internal/text-field.js +60 -32
- package/textfield/internal/text-field.js.map +1 -1
- package/tokens/_md-comp-filled-field.scss +2 -2
- package/tokens/_md-comp-filled-select.scss +3 -0
- package/tokens/_md-comp-filled-text-field.scss +3 -1
- package/tokens/_md-comp-list-item.scss +117 -103
- package/tokens/_md-comp-menu-item.scss +3 -3
- package/tokens/_md-comp-outlined-field.scss +2 -1
- package/tokens/_md-comp-outlined-select.scss +8 -0
- package/tokens/_md-comp-outlined-text-field.scss +3 -1
- package/chips/internal/assist-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/assist-forced-colors-styles.css.js +0 -9
- package/chips/internal/assist-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/assist-forced-colors-styles.scss +0 -27
- package/chips/internal/filter-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/filter-forced-colors-styles.css.js +0 -9
- package/chips/internal/filter-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/filter-forced-colors-styles.scss +0 -34
- package/chips/internal/input-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/input-forced-colors-styles.css.js +0 -9
- package/chips/internal/input-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/input-forced-colors-styles.scss +0 -39
- package/chips/internal/suggestion-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/suggestion-forced-colors-styles.css.js +0 -9
- package/chips/internal/suggestion-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/suggestion-forced-colors-styles.scss +0 -27
- package/internal/sass/_theme.scss +0 -249
|
@@ -154,7 +154,7 @@ export class Checkbox extends LitElement {
|
|
|
154
154
|
* @param error The error message to display.
|
|
155
155
|
*/
|
|
156
156
|
setCustomValidity(error) {
|
|
157
|
-
this.internals.setValidity({ customError: !!error }, error);
|
|
157
|
+
this.internals.setValidity({ customError: !!error }, error, this.getInput());
|
|
158
158
|
}
|
|
159
159
|
update(changed) {
|
|
160
160
|
if (changed.has('checked') || changed.has('disabled') ||
|
|
@@ -188,17 +188,10 @@ export class Checkbox extends LitElement {
|
|
|
188
188
|
});
|
|
189
189
|
// Needed for closure conformance
|
|
190
190
|
const { ariaLabel, ariaInvalid } = this;
|
|
191
|
+
// Note: <input> needs to be rendered before the <svg> for
|
|
192
|
+
// form.reportValidity() to work in Chrome.
|
|
191
193
|
return html `
|
|
192
194
|
<div class="container ${containerClasses}">
|
|
193
|
-
<div class="outline"></div>
|
|
194
|
-
<div class="background"></div>
|
|
195
|
-
<md-focus-ring part="focus-ring" for="input"></md-focus-ring>
|
|
196
|
-
<md-ripple for="input" ?disabled=${this.disabled}></md-ripple>
|
|
197
|
-
<svg class="icon" viewBox="0 0 18 18" aria-hidden="true">
|
|
198
|
-
<rect class="mark short" />
|
|
199
|
-
<rect class="mark long" />
|
|
200
|
-
</svg>
|
|
201
|
-
|
|
202
195
|
<input type="checkbox"
|
|
203
196
|
id="input"
|
|
204
197
|
aria-checked=${isIndeterminate ? 'mixed' : nothing}
|
|
@@ -210,9 +203,23 @@ export class Checkbox extends LitElement {
|
|
|
210
203
|
.checked=${this.checked}
|
|
211
204
|
@change=${this.handleChange}
|
|
212
205
|
>
|
|
206
|
+
|
|
207
|
+
<div class="outline"></div>
|
|
208
|
+
<div class="background"></div>
|
|
209
|
+
<md-focus-ring part="focus-ring" for="input"></md-focus-ring>
|
|
210
|
+
<md-ripple for="input" ?disabled=${this.disabled}></md-ripple>
|
|
211
|
+
<svg class="icon" viewBox="0 0 18 18" aria-hidden="true">
|
|
212
|
+
<rect class="mark short" />
|
|
213
|
+
<rect class="mark long" />
|
|
214
|
+
</svg>
|
|
213
215
|
</div>
|
|
214
216
|
`;
|
|
215
217
|
}
|
|
218
|
+
updated() {
|
|
219
|
+
// Sync validity when properties change, since validation properties may
|
|
220
|
+
// have changed.
|
|
221
|
+
this.syncValidity();
|
|
222
|
+
}
|
|
216
223
|
handleChange(event) {
|
|
217
224
|
const target = event.target;
|
|
218
225
|
this.checked = target.checked;
|
|
@@ -229,7 +236,7 @@ export class Checkbox extends LitElement {
|
|
|
229
236
|
else {
|
|
230
237
|
input.setCustomValidity('');
|
|
231
238
|
}
|
|
232
|
-
this.internals.setValidity(input.validity, input.validationMessage, this.
|
|
239
|
+
this.internals.setValidity(input.validity, input.validationMessage, this.getInput());
|
|
233
240
|
}
|
|
234
241
|
getInput() {
|
|
235
242
|
if (!this.input) {
|
|
@@ -293,7 +300,4 @@ __decorate([
|
|
|
293
300
|
__decorate([
|
|
294
301
|
query('input')
|
|
295
302
|
], Checkbox.prototype, "input", void 0);
|
|
296
|
-
__decorate([
|
|
297
|
-
query('.outline')
|
|
298
|
-
], Checkbox.prototype, "outline", void 0);
|
|
299
303
|
//# sourceMappingURL=checkbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {requestUpdateOnAriaChange} from '../../internal/aria/delegate.js';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../internal/controller/events.js';\n\n/**\n * A checkbox component.\n */\nexport class Checkbox extends LitElement {\n static {\n requestUpdateOnAriaChange(Checkbox);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true\n };\n\n /** @nocollapse */\n static formAssociated = true;\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean}) checked = false;\n\n /**\n * Whether or not the checkbox is disabled.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * Whether or not the checkbox is indeterminate.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes\n */\n @property({type: Boolean}) indeterminate = false;\n\n /**\n * When true, require the checkbox to be selected when participating in\n * form submission.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n @property({type: Boolean}) required = false;\n\n /**\n * The value of the checkbox that is submitted with a form when selected.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value\n */\n @property() value = 'on';\n\n /**\n * The HTML name to use in form submission.\n */\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.internals.form;\n }\n\n /**\n * The labels this element is associated with.\n */\n get labels() {\n return this.internals.labels;\n }\n\n /**\n * Returns a ValidityState object that represents the validity states of the\n * checkbox.\n *\n * Note that checkboxes will only set `valueMissing` if `required` and not\n * checked.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n get validity() {\n this.syncValidity();\n return this.internals.validity;\n }\n\n /**\n * Returns the native validation error message.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get validationMessage() {\n this.syncValidity();\n return this.internals.validationMessage;\n }\n\n /**\n * Returns whether an element will successfully validate based on forms\n * validation rules and constraints.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get willValidate() {\n this.syncValidity();\n return this.internals.willValidate;\n }\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @query('input') private readonly input!: HTMLInputElement|null;\n @query('.outline') private readonly outline!: HTMLElement|null;\n private readonly internals =\n (this as HTMLElement /* needed for closure */).attachInternals();\n\n constructor() {\n super();\n if (!isServer) {\n this.addEventListener('click', (event: MouseEvent) => {\n if (!isActivationClick(event)) {\n return;\n }\n this.focus();\n dispatchActivationClick(this.input!);\n });\n }\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/checkValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n checkValidity() {\n this.syncValidity();\n return this.internals.checkValidity();\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * The `validationMessage` is reported to the user by the browser. Use\n * `setCustomValidity()` to customize the `validationMessage`.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/reportValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n reportValidity() {\n this.syncValidity();\n return this.internals.reportValidity();\n }\n\n /**\n * Sets the checkbox's native validation error message. This is used to\n * customize `validationMessage`.\n *\n * When the error is not an empty string, the checkbox is considered invalid\n * and `validity.customError` will be true.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setCustomValidity\n *\n * @param error The error message to display.\n */\n setCustomValidity(error: string) {\n this.internals.setValidity({customError: !!error}, error);\n }\n\n protected override update(changed: PropertyValues<this>) {\n if (changed.has('checked') || changed.has('disabled') ||\n changed.has('indeterminate')) {\n this.prevChecked = changed.get('checked') ?? this.checked;\n this.prevDisabled = changed.get('disabled') ?? this.disabled;\n this.prevIndeterminate =\n changed.get('indeterminate') ?? this.indeterminate;\n }\n\n const shouldAddFormValue = this.checked && !this.indeterminate;\n const state = String(this.checked);\n this.internals.setFormValue(shouldAddFormValue ? this.value : null, state);\n super.update(changed);\n }\n\n protected override render() {\n const prevNone = !this.prevChecked && !this.prevIndeterminate;\n const prevChecked = this.prevChecked && !this.prevIndeterminate;\n const prevIndeterminate = this.prevIndeterminate;\n const isChecked = this.checked && !this.indeterminate;\n const isIndeterminate = this.indeterminate;\n\n const containerClasses = classMap({\n 'disabled': this.disabled,\n 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'prev-unselected': prevNone,\n 'prev-checked': prevChecked,\n 'prev-indeterminate': prevIndeterminate,\n 'prev-disabled': this.prevDisabled,\n });\n\n // Needed for closure conformance\n const {ariaLabel, ariaInvalid} = this as ARIAMixinStrict;\n return html`\n <div class=\"container ${containerClasses}\">\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring part=\"focus-ring\" for=\"input\"></md-focus-ring>\n <md-ripple for=\"input\" ?disabled=${this.disabled}></md-ripple>\n <svg class=\"icon\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n\n <input type=\"checkbox\"\n id=\"input\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n aria-invalid=${ariaInvalid || nothing}\n ?disabled=${this.disabled}\n ?required=${this.required}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @change=${this.handleChange}\n >\n </div>\n `;\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n this.checked = target.checked;\n this.indeterminate = target.indeterminate;\n\n redispatchEvent(this, event);\n }\n\n private syncValidity() {\n // Sync the internal <input>'s validity and the host's ElementInternals\n // validity. We do this to re-use native `<input>` validation messages.\n const input = this.getInput();\n if (this.internals.validity.customError) {\n input.setCustomValidity(this.internals.validationMessage);\n } else {\n input.setCustomValidity('');\n }\n\n this.internals.setValidity(\n input.validity, input.validationMessage, this.outline!);\n }\n\n private getInput() {\n if (!this.input) {\n // If the input is not yet defined, synchronously render.\n this.connectedCallback();\n this.performUpdate();\n }\n\n if (this.isUpdatePending) {\n // If there are pending updates, synchronously perform them. This ensures\n // that constraint validation properties (like `required`) are synced\n // before interacting with input APIs that depend on them.\n this.scheduleUpdate();\n }\n\n return this.input!;\n }\n\n /** @private */\n formResetCallback() {\n // The checked property does not reflect, so the original attribute set by\n // the user is used to determine the default value.\n this.checked = this.hasAttribute('checked');\n }\n\n /** @private */\n formStateRestoreCallback(state: string) {\n this.checked = state === 'true';\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {requestUpdateOnAriaChange} from '../../internal/aria/delegate.js';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../internal/controller/events.js';\n\n/**\n * A checkbox component.\n */\nexport class Checkbox extends LitElement {\n static {\n requestUpdateOnAriaChange(Checkbox);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true\n };\n\n /** @nocollapse */\n static readonly formAssociated = true;\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean}) checked = false;\n\n /**\n * Whether or not the checkbox is disabled.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * Whether or not the checkbox is indeterminate.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes\n */\n @property({type: Boolean}) indeterminate = false;\n\n /**\n * When true, require the checkbox to be selected when participating in\n * form submission.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n @property({type: Boolean}) required = false;\n\n /**\n * The value of the checkbox that is submitted with a form when selected.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value\n */\n @property() value = 'on';\n\n /**\n * The HTML name to use in form submission.\n */\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.internals.form;\n }\n\n /**\n * The labels this element is associated with.\n */\n get labels() {\n return this.internals.labels;\n }\n\n /**\n * Returns a ValidityState object that represents the validity states of the\n * checkbox.\n *\n * Note that checkboxes will only set `valueMissing` if `required` and not\n * checked.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n get validity() {\n this.syncValidity();\n return this.internals.validity;\n }\n\n /**\n * Returns the native validation error message.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get validationMessage() {\n this.syncValidity();\n return this.internals.validationMessage;\n }\n\n /**\n * Returns whether an element will successfully validate based on forms\n * validation rules and constraints.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get willValidate() {\n this.syncValidity();\n return this.internals.willValidate;\n }\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @query('input') private readonly input!: HTMLInputElement|null;\n private readonly internals =\n (this as HTMLElement /* needed for closure */).attachInternals();\n\n constructor() {\n super();\n if (!isServer) {\n this.addEventListener('click', (event: MouseEvent) => {\n if (!isActivationClick(event)) {\n return;\n }\n this.focus();\n dispatchActivationClick(this.input!);\n });\n }\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/checkValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n checkValidity() {\n this.syncValidity();\n return this.internals.checkValidity();\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * The `validationMessage` is reported to the user by the browser. Use\n * `setCustomValidity()` to customize the `validationMessage`.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/reportValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n reportValidity() {\n this.syncValidity();\n return this.internals.reportValidity();\n }\n\n /**\n * Sets the checkbox's native validation error message. This is used to\n * customize `validationMessage`.\n *\n * When the error is not an empty string, the checkbox is considered invalid\n * and `validity.customError` will be true.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setCustomValidity\n *\n * @param error The error message to display.\n */\n setCustomValidity(error: string) {\n this.internals.setValidity({customError: !!error}, error, this.getInput());\n }\n\n protected override update(changed: PropertyValues<this>) {\n if (changed.has('checked') || changed.has('disabled') ||\n changed.has('indeterminate')) {\n this.prevChecked = changed.get('checked') ?? this.checked;\n this.prevDisabled = changed.get('disabled') ?? this.disabled;\n this.prevIndeterminate =\n changed.get('indeterminate') ?? this.indeterminate;\n }\n\n const shouldAddFormValue = this.checked && !this.indeterminate;\n const state = String(this.checked);\n this.internals.setFormValue(shouldAddFormValue ? this.value : null, state);\n super.update(changed);\n }\n\n protected override render() {\n const prevNone = !this.prevChecked && !this.prevIndeterminate;\n const prevChecked = this.prevChecked && !this.prevIndeterminate;\n const prevIndeterminate = this.prevIndeterminate;\n const isChecked = this.checked && !this.indeterminate;\n const isIndeterminate = this.indeterminate;\n\n const containerClasses = classMap({\n 'disabled': this.disabled,\n 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'prev-unselected': prevNone,\n 'prev-checked': prevChecked,\n 'prev-indeterminate': prevIndeterminate,\n 'prev-disabled': this.prevDisabled,\n });\n\n // Needed for closure conformance\n const {ariaLabel, ariaInvalid} = this as ARIAMixinStrict;\n // Note: <input> needs to be rendered before the <svg> for\n // form.reportValidity() to work in Chrome.\n return html`\n <div class=\"container ${containerClasses}\">\n <input type=\"checkbox\"\n id=\"input\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n aria-invalid=${ariaInvalid || nothing}\n ?disabled=${this.disabled}\n ?required=${this.required}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @change=${this.handleChange}\n >\n\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring part=\"focus-ring\" for=\"input\"></md-focus-ring>\n <md-ripple for=\"input\" ?disabled=${this.disabled}></md-ripple>\n <svg class=\"icon\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n </div>\n `;\n }\n\n protected override updated() {\n // Sync validity when properties change, since validation properties may\n // have changed.\n this.syncValidity();\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n this.checked = target.checked;\n this.indeterminate = target.indeterminate;\n\n redispatchEvent(this, event);\n }\n\n private syncValidity() {\n // Sync the internal <input>'s validity and the host's ElementInternals\n // validity. We do this to re-use native `<input>` validation messages.\n const input = this.getInput();\n if (this.internals.validity.customError) {\n input.setCustomValidity(this.internals.validationMessage);\n } else {\n input.setCustomValidity('');\n }\n\n this.internals.setValidity(\n input.validity, input.validationMessage, this.getInput());\n }\n\n private getInput() {\n if (!this.input) {\n // If the input is not yet defined, synchronously render.\n this.connectedCallback();\n this.performUpdate();\n }\n\n if (this.isUpdatePending) {\n // If there are pending updates, synchronously perform them. This ensures\n // that constraint validation properties (like `required`) are synced\n // before interacting with input APIs that depend on them.\n this.scheduleUpdate();\n }\n\n return this.input!;\n }\n\n /** @private */\n formResetCallback() {\n // The checked property does not reflect, so the original attribute set by\n // the user is used to determine the default value.\n this.checked = this.hasAttribute('checked');\n }\n\n /** @private */\n formStateRestoreCallback(state: string) {\n this.checked = state === 'true';\n }\n}\n"]}
|
package/chips/assist-chip.js
CHANGED
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
import { __decorate } from "tslib";
|
|
7
7
|
import { customElement } from 'lit/decorators.js';
|
|
8
8
|
import { AssistChip } from './internal/assist-chip.js';
|
|
9
|
-
import { styles as forcedColorsStyles } from './internal/assist-forced-colors-styles.css.js';
|
|
10
9
|
import { styles } from './internal/assist-styles.css.js';
|
|
11
10
|
import { styles as elevatedStyles } from './internal/elevated-styles.css.js';
|
|
12
11
|
import { styles as sharedStyles } from './internal/shared-styles.css.js';
|
|
@@ -18,7 +17,7 @@ import { styles as sharedStyles } from './internal/shared-styles.css.js';
|
|
|
18
17
|
*/
|
|
19
18
|
let MdAssistChip = class MdAssistChip extends AssistChip {
|
|
20
19
|
};
|
|
21
|
-
MdAssistChip.styles = [sharedStyles, elevatedStyles, styles
|
|
20
|
+
MdAssistChip.styles = [sharedStyles, elevatedStyles, styles];
|
|
22
21
|
MdAssistChip = __decorate([
|
|
23
22
|
customElement('md-assist-chip')
|
|
24
23
|
], MdAssistChip);
|
package/chips/assist-chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM,iCAAiC,CAAC;AACvD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AAQvE;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG,CAAC,YAAY,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;AADrD,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB;SAFY,YAAY","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {AssistChip} from './internal/assist-chip.js';\nimport {styles} from './internal/assist-styles.css.js';\nimport {styles as elevatedStyles} from './internal/elevated-styles.css.js';\nimport {styles as sharedStyles} from './internal/shared-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-assist-chip': MdAssistChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-assist-chip')\nexport class MdAssistChip extends AssistChip {\n static override styles = [sharedStyles, elevatedStyles, styles];\n}\n"]}
|
package/chips/filter-chip.js
CHANGED
|
@@ -7,7 +7,6 @@ import { __decorate } from "tslib";
|
|
|
7
7
|
import { customElement } from 'lit/decorators.js';
|
|
8
8
|
import { styles as elevatedStyles } from './internal/elevated-styles.css.js';
|
|
9
9
|
import { FilterChip } from './internal/filter-chip.js';
|
|
10
|
-
import { styles as forcedColorsStyles } from './internal/filter-forced-colors-styles.css.js';
|
|
11
10
|
import { styles } from './internal/filter-styles.css.js';
|
|
12
11
|
import { styles as selectableStyles } from './internal/selectable-styles.css.js';
|
|
13
12
|
import { styles as sharedStyles } from './internal/shared-styles.css.js';
|
|
@@ -21,8 +20,7 @@ import { styles as trailingIconStyles } from './internal/trailing-icon-styles.cs
|
|
|
21
20
|
let MdFilterChip = class MdFilterChip extends FilterChip {
|
|
22
21
|
};
|
|
23
22
|
MdFilterChip.styles = [
|
|
24
|
-
sharedStyles, elevatedStyles, trailingIconStyles, selectableStyles, styles
|
|
25
|
-
forcedColorsStyles
|
|
23
|
+
sharedStyles, elevatedStyles, trailingIconStyles, selectableStyles, styles
|
|
26
24
|
];
|
|
27
25
|
MdFilterChip = __decorate([
|
|
28
26
|
customElement('md-filter-chip')
|
package/chips/filter-chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM,iCAAiC,CAAC;AACvD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG;IACvB,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM;CAC3E,CAAC;AAHS,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAIxB;SAJY,YAAY","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as elevatedStyles} from './internal/elevated-styles.css.js';\nimport {FilterChip} from './internal/filter-chip.js';\nimport {styles} from './internal/filter-styles.css.js';\nimport {styles as selectableStyles} from './internal/selectable-styles.css.js';\nimport {styles as sharedStyles} from './internal/shared-styles.css.js';\nimport {styles as trailingIconStyles} from './internal/trailing-icon-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-filter-chip': MdFilterChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-filter-chip')\nexport class MdFilterChip extends FilterChip {\n static override styles = [\n sharedStyles, elevatedStyles, trailingIconStyles, selectableStyles, styles\n ];\n}\n"]}
|
package/chips/input-chip.js
CHANGED
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
import { __decorate } from "tslib";
|
|
7
7
|
import { customElement } from 'lit/decorators.js';
|
|
8
8
|
import { InputChip } from './internal/input-chip.js';
|
|
9
|
-
import { styles as forcedColorsStyles } from './internal/input-forced-colors-styles.css.js';
|
|
10
9
|
import { styles } from './internal/input-styles.css.js';
|
|
11
10
|
import { styles as selectableStyles } from './internal/selectable-styles.css.js';
|
|
12
11
|
import { styles as sharedStyles } from './internal/shared-styles.css.js';
|
|
@@ -19,10 +18,7 @@ import { styles as trailingIconStyles } from './internal/trailing-icon-styles.cs
|
|
|
19
18
|
*/
|
|
20
19
|
let MdInputChip = class MdInputChip extends InputChip {
|
|
21
20
|
};
|
|
22
|
-
MdInputChip.styles = [
|
|
23
|
-
sharedStyles, trailingIconStyles, selectableStyles, styles,
|
|
24
|
-
forcedColorsStyles
|
|
25
|
-
];
|
|
21
|
+
MdInputChip.styles = [sharedStyles, trailingIconStyles, selectableStyles, styles];
|
|
26
22
|
MdInputChip = __decorate([
|
|
27
23
|
customElement('md-input-chip')
|
|
28
24
|
], MdInputChip);
|
package/chips/input-chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,SAAS,EAAC,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,SAAS,EAAC,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAC,MAAM,EAAC,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,SAAS;;AACxB,kBAAM,GAClB,CAAC,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,CAAC,CAAC;AAFtD,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CAGvB;SAHY,WAAW","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {InputChip} from './internal/input-chip.js';\nimport {styles} from './internal/input-styles.css.js';\nimport {styles as selectableStyles} from './internal/selectable-styles.css.js';\nimport {styles as sharedStyles} from './internal/shared-styles.css.js';\nimport {styles as trailingIconStyles} from './internal/trailing-icon-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-input-chip': MdInputChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-input-chip')\nexport class MdInputChip extends InputChip {\n static override styles =\n [sharedStyles, trailingIconStyles, selectableStyles, styles];\n}\n"]}
|
|
@@ -59,6 +59,28 @@
|
|
|
59
59
|
);
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
+
:host([avatar]) {
|
|
63
|
+
// Use a rounded border by default for avatar chips. Recreating the
|
|
64
|
+
// fallbacks allows `--md-input-chip-container-shape` to cascade and
|
|
65
|
+
// override this without needing to add more specificity for avatar chips.
|
|
66
|
+
--_container-shape-start-start: var(
|
|
67
|
+
--md-input-chip-container-shape-start-start,
|
|
68
|
+
var(--md-input-chip-container-shape, calc(var(--_container-height) / 2))
|
|
69
|
+
);
|
|
70
|
+
--_container-shape-start-end: var(
|
|
71
|
+
--md-input-chip-container-shape-start-end,
|
|
72
|
+
var(--md-input-chip-container-shape, calc(var(--_container-height) / 2))
|
|
73
|
+
);
|
|
74
|
+
--_container-shape-end-end: var(
|
|
75
|
+
--md-input-chip-container-shape-end-end,
|
|
76
|
+
var(--md-input-chip-container-shape, calc(var(--_container-height) / 2))
|
|
77
|
+
);
|
|
78
|
+
--_container-shape-end-start: var(
|
|
79
|
+
--md-input-chip-container-shape-end-start,
|
|
80
|
+
var(--md-input-chip-container-shape, calc(var(--_container-height) / 2))
|
|
81
|
+
);
|
|
82
|
+
}
|
|
83
|
+
|
|
62
84
|
.avatar .primary.action {
|
|
63
85
|
padding-inline-start: 4px;
|
|
64
86
|
}
|
|
@@ -72,4 +94,14 @@
|
|
|
72
94
|
.disabled.avatar .leading.icon {
|
|
73
95
|
opacity: var(--_disabled-avatar-opacity);
|
|
74
96
|
}
|
|
97
|
+
|
|
98
|
+
@media (forced-colors: active) {
|
|
99
|
+
.link .outline {
|
|
100
|
+
border-color: ActiveText;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.disabled.avatar .leading.icon {
|
|
104
|
+
opacity: 1;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
75
107
|
}
|
|
@@ -19,56 +19,60 @@
|
|
|
19
19
|
);
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
.selected::before {
|
|
22
|
+
:where(.selected)::before {
|
|
23
23
|
background: var(--_selected-container-color);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
.selected .outline {
|
|
26
|
+
:where(.selected) .outline {
|
|
27
27
|
border-width: var(--_selected-outline-width);
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.selected.disabled::before {
|
|
30
|
+
:where(.selected.disabled)::before {
|
|
31
31
|
background: var(--_disabled-selected-container-color);
|
|
32
32
|
opacity: var(--_disabled-selected-container-opacity);
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
.selected .label {
|
|
35
|
+
:where(.selected) .label {
|
|
36
36
|
color: var(--_selected-label-text-color);
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
.selected:hover .label {
|
|
39
|
+
:where(.selected:hover) .label {
|
|
40
40
|
color: var(--_selected-hover-label-text-color);
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
.selected:focus .label {
|
|
43
|
+
:where(.selected:focus) .label {
|
|
44
44
|
color: var(--_selected-focus-label-text-color);
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
-
.selected:active .label {
|
|
47
|
+
:where(.selected:active) .label {
|
|
48
48
|
color: var(--_selected-pressed-label-text-color);
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
-
.selected .leading.icon {
|
|
51
|
+
:where(.selected) .leading.icon {
|
|
52
52
|
color: var(--_selected-leading-icon-color);
|
|
53
53
|
}
|
|
54
54
|
|
|
55
|
-
.selected:hover .leading.icon {
|
|
55
|
+
:where(.selected:hover) .leading.icon {
|
|
56
56
|
color: var(--_selected-hover-leading-icon-color);
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
.selected:focus .leading.icon {
|
|
59
|
+
:where(.selected:focus) .leading.icon {
|
|
60
60
|
color: var(--_selected-focus-leading-icon-color);
|
|
61
61
|
}
|
|
62
62
|
|
|
63
|
-
.selected:active .leading.icon {
|
|
63
|
+
:where(.selected:active) .leading.icon {
|
|
64
64
|
color: var(--_selected-pressed-leading-icon-color);
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
@media (forced-colors: active) {
|
|
68
|
-
.selected:not(.elevated)::before {
|
|
68
|
+
:where(.selected:not(.elevated))::before {
|
|
69
69
|
// for forced-colors. Don't add it to elevated containers since elevation
|
|
70
70
|
// already have a border added.
|
|
71
|
-
border: 1px solid
|
|
71
|
+
border: 1px solid CanvasText;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
:where(.selected) .outline {
|
|
75
|
+
border-width: 1px;
|
|
72
76
|
}
|
|
73
77
|
}
|
|
74
78
|
}
|
|
@@ -116,11 +116,11 @@
|
|
|
116
116
|
position: absolute;
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
-
:focus .outline {
|
|
119
|
+
:where(:focus) .outline {
|
|
120
120
|
border-color: var(--_focus-outline-color);
|
|
121
121
|
}
|
|
122
122
|
|
|
123
|
-
.disabled .outline {
|
|
123
|
+
:where(.disabled) .outline {
|
|
124
124
|
border-color: var(--_disabled-outline-color);
|
|
125
125
|
opacity: var(--_disabled-outline-opacity);
|
|
126
126
|
}
|
|
@@ -147,19 +147,19 @@
|
|
|
147
147
|
white-space: nowrap;
|
|
148
148
|
}
|
|
149
149
|
|
|
150
|
-
:hover .label {
|
|
150
|
+
:where(:hover) .label {
|
|
151
151
|
color: var(--_hover-label-text-color);
|
|
152
152
|
}
|
|
153
153
|
|
|
154
|
-
:focus .label {
|
|
154
|
+
:where(:focus) .label {
|
|
155
155
|
color: var(--_focus-label-text-color);
|
|
156
156
|
}
|
|
157
157
|
|
|
158
|
-
:active .label {
|
|
158
|
+
:where(:active) .label {
|
|
159
159
|
color: var(--_pressed-label-text-color);
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
-
.disabled .label {
|
|
162
|
+
:where(.disabled) .label {
|
|
163
163
|
color: var(--_disabled-label-text-color);
|
|
164
164
|
opacity: var(--_disabled-label-text-opacity);
|
|
165
165
|
}
|
|
@@ -181,20 +181,27 @@
|
|
|
181
181
|
color: var(--_leading-icon-color);
|
|
182
182
|
}
|
|
183
183
|
|
|
184
|
-
:hover .leading.icon {
|
|
184
|
+
:where(:hover) .leading.icon {
|
|
185
185
|
color: var(--_hover-leading-icon-color);
|
|
186
186
|
}
|
|
187
187
|
|
|
188
|
-
:focus .leading.icon {
|
|
188
|
+
:where(:focus) .leading.icon {
|
|
189
189
|
color: var(--_focus-leading-icon-color);
|
|
190
190
|
}
|
|
191
191
|
|
|
192
|
-
:active .leading.icon {
|
|
192
|
+
:where(:active) .leading.icon {
|
|
193
193
|
color: var(--_pressed-leading-icon-color);
|
|
194
194
|
}
|
|
195
195
|
|
|
196
|
-
.disabled .leading.icon {
|
|
196
|
+
:where(.disabled) .leading.icon {
|
|
197
197
|
color: var(--_disabled-leading-icon-color);
|
|
198
198
|
opacity: var(--_disabled-leading-icon-opacity);
|
|
199
199
|
}
|
|
200
|
+
|
|
201
|
+
@media (forced-colors: active) {
|
|
202
|
+
:where(.disabled) :is(.label, .outline, .leading.icon) {
|
|
203
|
+
color: GrayText;
|
|
204
|
+
opacity: 1;
|
|
205
|
+
}
|
|
206
|
+
}
|
|
200
207
|
}
|
|
@@ -14,27 +14,16 @@
|
|
|
14
14
|
padding: 0 8px;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
.trailing.action md-focus-ring {
|
|
18
|
-
// Note: the trailing action's shape only follows the trailing end of the
|
|
19
|
-
// chip. For example, if the leading end is rounded, but the trailing is end
|
|
20
|
-
// squared, then the focus ring will be squared (not rounded+squared).
|
|
21
|
-
@include focus-ring.theme(
|
|
22
|
-
(
|
|
23
|
-
'shape-start-start': var(--_container-shape-start-end),
|
|
24
|
-
'shape-end-start': var(--_container-shape-end-end),
|
|
25
|
-
'shape-end-end': var(--_container-shape-end-end),
|
|
26
|
-
'shape-start-end': var(--_container-shape-start-end),
|
|
27
|
-
'outward-offset': -2px,
|
|
28
|
-
)
|
|
29
|
-
);
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.trailing.action md-ripple {
|
|
17
|
+
.trailing.action :is(md-ripple, md-focus-ring) {
|
|
33
18
|
border-radius: 50%;
|
|
34
19
|
height: calc(4 / 3 * var(--_icon-size)); // 24px default
|
|
35
20
|
width: calc(4 / 3 * var(--_icon-size)); // 24px default
|
|
36
21
|
}
|
|
37
22
|
|
|
23
|
+
.trailing.action md-focus-ring {
|
|
24
|
+
inset: unset;
|
|
25
|
+
}
|
|
26
|
+
|
|
38
27
|
.has-trailing .primary.action {
|
|
39
28
|
padding-inline-end: 0;
|
|
40
29
|
}
|
|
@@ -45,36 +34,47 @@
|
|
|
45
34
|
width: var(--_icon-size);
|
|
46
35
|
}
|
|
47
36
|
|
|
48
|
-
:hover .trailing.icon {
|
|
37
|
+
:where(:hover) .trailing.icon {
|
|
49
38
|
color: var(--_hover-trailing-icon-color);
|
|
50
39
|
}
|
|
51
40
|
|
|
52
|
-
:focus .trailing.icon {
|
|
41
|
+
:where(:focus) .trailing.icon {
|
|
53
42
|
color: var(--_focus-trailing-icon-color);
|
|
54
43
|
}
|
|
55
44
|
|
|
56
|
-
:active .trailing.icon {
|
|
45
|
+
:where(:active) .trailing.icon {
|
|
57
46
|
color: var(--_pressed-trailing-icon-color);
|
|
58
47
|
}
|
|
59
48
|
|
|
60
|
-
.disabled .trailing.icon {
|
|
49
|
+
:where(.disabled) .trailing.icon {
|
|
61
50
|
color: var(--_disabled-trailing-icon-color);
|
|
62
51
|
opacity: var(--_disabled-trailing-icon-opacity);
|
|
63
52
|
}
|
|
64
53
|
|
|
65
|
-
.selected .trailing.icon {
|
|
54
|
+
:where(.selected) .trailing.icon {
|
|
66
55
|
color: var(--_selected-trailing-icon-color);
|
|
67
56
|
}
|
|
68
57
|
|
|
69
|
-
.selected:hover .trailing.icon {
|
|
58
|
+
:where(.selected:hover) .trailing.icon {
|
|
70
59
|
color: var(--_selected-hover-trailing-icon-color);
|
|
71
60
|
}
|
|
72
61
|
|
|
73
|
-
.selected:focus .trailing.icon {
|
|
62
|
+
:where(.selected:focus) .trailing.icon {
|
|
74
63
|
color: var(--_selected-focus-trailing-icon-color);
|
|
75
64
|
}
|
|
76
65
|
|
|
77
|
-
.selected:active .trailing.icon {
|
|
66
|
+
:where(.selected:active) .trailing.icon {
|
|
78
67
|
color: var(--_selected-pressed-trailing-icon-color);
|
|
79
68
|
}
|
|
69
|
+
|
|
70
|
+
@media (forced-colors: active) {
|
|
71
|
+
.trailing.icon {
|
|
72
|
+
color: ButtonText;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
:where(.disabled) .trailing.icon {
|
|
76
|
+
color: GrayText;
|
|
77
|
+
opacity: 1;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
80
|
}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{--_container-height: var(--md-assist-chip-container-height, 32px);--_container-shape: var(--md-assist-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-assist-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-assist-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-assist-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-assist-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-assist-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-assist-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-assist-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-assist-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-assist-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-assist-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-assist-chip-elevated-pressed-container-elevation, 1);--_focus-label-text-color: var(--md-assist-chip-focus-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-assist-chip-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-color: var(--md-assist-chip-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-opacity: var(--md-assist-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-assist-chip-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_label-text-type: var(--md-assist-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-assist-chip-pressed-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-assist-chip-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-opacity: var(--md-assist-chip-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-assist-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-assist-chip-disabled-outline-opacity, 0.12);--_focus-outline-color: var(--md-assist-chip-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_outline-color: var(--md-assist-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-assist-chip-outline-width, 1px);--_disabled-leading-icon-color: var(--md-assist-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-assist-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-assist-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-assist-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-assist-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-assist-chip-icon-size, 18px);--_pressed-leading-icon-color: var(--md-assist-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var( --md-assist-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-assist-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-assist-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-assist-chip-container-shape-end-start, var(--_container-shape) )}/*# sourceMappingURL=assist-styles.css.map */
|
|
7
|
+
export const styles = css `:host{--_container-height: var(--md-assist-chip-container-height, 32px);--_container-shape: var(--md-assist-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-assist-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-assist-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-assist-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-assist-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-assist-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-assist-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-assist-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-assist-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-assist-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-assist-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-assist-chip-elevated-pressed-container-elevation, 1);--_focus-label-text-color: var(--md-assist-chip-focus-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-assist-chip-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-color: var(--md-assist-chip-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-opacity: var(--md-assist-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-assist-chip-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_label-text-type: var(--md-assist-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-assist-chip-pressed-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-assist-chip-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-opacity: var(--md-assist-chip-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-assist-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-assist-chip-disabled-outline-opacity, 0.12);--_focus-outline-color: var(--md-assist-chip-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_outline-color: var(--md-assist-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-assist-chip-outline-width, 1px);--_disabled-leading-icon-color: var(--md-assist-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-assist-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-assist-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-assist-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-assist-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-assist-chip-icon-size, 18px);--_pressed-leading-icon-color: var(--md-assist-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var( --md-assist-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-assist-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-assist-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-assist-chip-container-shape-end-start, var(--_container-shape) )}@media(forced-colors: active){.link .outline{border-color:ActiveText}}/*# sourceMappingURL=assist-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=assist-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"assist-styles.css.js","sourceRoot":"","sources":["assist-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-height: var(--md-assist-chip-container-height, 32px);--_container-shape: var(--md-assist-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-assist-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-assist-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-assist-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-assist-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-assist-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-assist-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-assist-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-assist-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-assist-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-assist-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-assist-chip-elevated-pressed-container-elevation, 1);--_focus-label-text-color: var(--md-assist-chip-focus-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-assist-chip-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-color: var(--md-assist-chip-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-opacity: var(--md-assist-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-assist-chip-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_label-text-type: var(--md-assist-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-assist-chip-pressed-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-assist-chip-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-opacity: var(--md-assist-chip-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-assist-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-assist-chip-disabled-outline-opacity, 0.12);--_focus-outline-color: var(--md-assist-chip-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_outline-color: var(--md-assist-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-assist-chip-outline-width, 1px);--_disabled-leading-icon-color: var(--md-assist-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-assist-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-assist-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-assist-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-assist-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-assist-chip-icon-size, 18px);--_pressed-leading-icon-color: var(--md-assist-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var( --md-assist-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-assist-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-assist-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-assist-chip-container-shape-end-start, var(--_container-shape) )}/*# sourceMappingURL=assist-styles.css.map */\n`;\n "]}
|
|
1
|
+
{"version":3,"file":"assist-styles.css.js","sourceRoot":"","sources":["assist-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-height: var(--md-assist-chip-container-height, 32px);--_container-shape: var(--md-assist-chip-container-shape, 8px);--_disabled-label-text-color: var(--md-assist-chip-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-assist-chip-disabled-label-text-opacity, 0.38);--_elevated-container-color: var(--md-assist-chip-elevated-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_elevated-container-elevation: var(--md-assist-chip-elevated-container-elevation, 1);--_elevated-container-shadow-color: var(--md-assist-chip-elevated-container-shadow-color, var(--md-sys-color-shadow, #000));--_elevated-disabled-container-color: var(--md-assist-chip-elevated-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_elevated-disabled-container-elevation: var(--md-assist-chip-elevated-disabled-container-elevation, 0);--_elevated-disabled-container-opacity: var(--md-assist-chip-elevated-disabled-container-opacity, 0.12);--_elevated-focus-container-elevation: var(--md-assist-chip-elevated-focus-container-elevation, 1);--_elevated-hover-container-elevation: var(--md-assist-chip-elevated-hover-container-elevation, 2);--_elevated-pressed-container-elevation: var(--md-assist-chip-elevated-pressed-container-elevation, 1);--_focus-label-text-color: var(--md-assist-chip-focus-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-assist-chip-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-color: var(--md-assist-chip-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-opacity: var(--md-assist-chip-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-assist-chip-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_label-text-type: var(--md-assist-chip-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-label-text-color: var(--md-assist-chip-pressed-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-assist-chip-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-opacity: var(--md-assist-chip-pressed-state-layer-opacity, 0.12);--_disabled-outline-color: var(--md-assist-chip-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-assist-chip-disabled-outline-opacity, 0.12);--_focus-outline-color: var(--md-assist-chip-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_outline-color: var(--md-assist-chip-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-assist-chip-outline-width, 1px);--_disabled-leading-icon-color: var(--md-assist-chip-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-assist-chip-disabled-leading-icon-opacity, 0.38);--_focus-leading-icon-color: var(--md-assist-chip-focus-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-leading-icon-color: var(--md-assist-chip-hover-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_leading-icon-color: var(--md-assist-chip-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-assist-chip-icon-size, 18px);--_pressed-leading-icon-color: var(--md-assist-chip-pressed-leading-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var( --md-assist-chip-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-assist-chip-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-assist-chip-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-assist-chip-container-shape-end-start, var(--_container-shape) )}@media(forced-colors: active){.link .outline{border-color:ActiveText}}/*# sourceMappingURL=assist-styles.css.map */\n`;\n "]}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}@media(forced-colors: active){.elevated md-elevation{border:1px solid
|
|
7
|
+
export const styles = css `.elevated{--md-elevation-level: var(--_elevated-container-elevation);--md-elevation-shadow-color: var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level: var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level: var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level: var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level: var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}@media(forced-colors: active){.elevated md-elevation{border:1px solid CanvasText}.elevated.link md-elevation{border-color:ActiveText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=elevated-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"elevated-styles.css.js","sourceRoot":"","sources":["elevated-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`.elevated{--md-elevation-level:var(--_elevated-container-elevation);--md-elevation-shadow-color:var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level:var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level:var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level:var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level:var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}@media(forced-colors: active){.elevated md-elevation{border:1px solid
|
|
1
|
+
{"version":3,"file":"elevated-styles.css.js","sourceRoot":"","sources":["elevated-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`.elevated{--md-elevation-level: var(--_elevated-container-elevation);--md-elevation-shadow-color: var(--_elevated-container-shadow-color)}.elevated::before{background:var(--_elevated-container-color)}.elevated:hover{--md-elevation-level: var(--_elevated-hover-container-elevation)}.elevated:focus-within{--md-elevation-level: var(--_elevated-focus-container-elevation)}.elevated:active{--md-elevation-level: var(--_elevated-pressed-container-elevation)}.elevated.disabled{--md-elevation-level: var(--_elevated-disabled-container-elevation)}.elevated.disabled::before{background:var(--_elevated-disabled-container-color);opacity:var(--_elevated-disabled-container-opacity)}@media(forced-colors: active){.elevated md-elevation{border:1px solid CanvasText}.elevated.link md-elevation{border-color:ActiveText}.elevated.disabled md-elevation{border-color:GrayText}}/*# sourceMappingURL=elevated-styles.css.map */\n`;\n "]}
|