npm - @material/web - Versions diffs - 2.4.2-nightly.082faad.0 → 2.4.2-nightly.259fd71.0 - Mend

@material/web 2.4.2-nightly.082faad.0 → 2.4.2-nightly.259fd71.0

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.

Files changed (1427) hide show

package/labs/badge/internal/badge-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/badge/internal/badge-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_color: var(--md-badge-color, var(--md-sys-color-error, #b3261e));--_large-color: var(--md-badge-large-color, var(--md-sys-color-error, #b3261e));--_large-label-text-color: var(--md-badge-large-label-text-color, var(--md-sys-color-on-error, #fff));--_large-label-text-font: var(--md-badge-large-label-text-font, var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto)));--_large-label-text-line-height: var(--md-badge-large-label-text-line-height, var(--md-sys-typescale-label-small-line-height, 1rem));--_large-label-text-size: var(--md-badge-large-label-text-size, var(--md-sys-typescale-label-small-size, 0.6875rem));--_large-label-text-weight: var(--md-badge-large-label-text-weight, var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500)));--_large-shape: var(--md-badge-large-shape, var(--md-sys-shape-corner-full, 9999px));--_large-size: var(--md-badge-large-size, 16px);--_shape: var(--md-badge-shape, var(--md-sys-shape-corner-full, 9999px));--_size: var(--md-badge-size, 6px)}.md3-badge{inset-inline-start:50%;margin-inline-start:6px;margin-block-start:4px;position:absolute;inset-block-start:0px;background-color:var(--_color);border-radius:var(--_shape);height:var(--_size)}.md3-badge:not(.md3-badge--large){width:var(--_size)}.md3-badge.md3-badge--large{display:flex;flex-direction:column;justify-content:center;margin-inline-start:2px;margin-block-start:1px;background-color:var(--_large-color);border-radius:var(--_large-shape);height:var(--_large-size);min-width:var(--_large-size);color:var(--_large-label-text-color)}.md3-badge.md3-badge--large .md3-badge__value{padding:0px 4px;text-align:center}.md3-badge__value{font-family:var(--_large-label-text-font);font-size:var(--_large-label-text-size);line-height:var(--_large-label-text-line-height);font-weight:var(--_large-label-text-weight)}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=badge-styles.cssresult.js.map

package/labs/badge/internal/badge-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"badge-styles.cssresult.js","sourceRoot":"","sources":["badge-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,mEAAmE;AACnE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/badge/internal/badge-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_color: var(--md-badge-color, var(--md-sys-color-error, #b3261e));--_large-color: var(--md-badge-large-color, var(--md-sys-color-error, #b3261e));--_large-label-text-color: var(--md-badge-large-label-text-color, var(--md-sys-color-on-error, #fff));--_large-label-text-font: var(--md-badge-large-label-text-font, var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto)));--_large-label-text-line-height: var(--md-badge-large-label-text-line-height, var(--md-sys-typescale-label-small-line-height, 1rem));--_large-label-text-size: var(--md-badge-large-label-text-size, var(--md-sys-typescale-label-small-size, 0.6875rem));--_large-label-text-weight: var(--md-badge-large-label-text-weight, var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500)));--_large-shape: var(--md-badge-large-shape, var(--md-sys-shape-corner-full, 9999px));--_large-size: var(--md-badge-large-size, 16px);--_shape: var(--md-badge-shape, var(--md-sys-shape-corner-full, 9999px));--_size: var(--md-badge-size, 6px)}.md3-badge{inset-inline-start:50%;margin-inline-start:6px;margin-block-start:4px;position:absolute;inset-block-start:0px;background-color:var(--_color);border-radius:var(--_shape);height:var(--_size)}.md3-badge:not(.md3-badge--large){width:var(--_size)}.md3-badge.md3-badge--large{display:flex;flex-direction:column;justify-content:center;margin-inline-start:2px;margin-block-start:1px;background-color:var(--_large-color);border-radius:var(--_large-shape);height:var(--_large-size);min-width:var(--_large-size);color:var(--_large-label-text-color)}.md3-badge.md3-badge--large .md3-badge__value{padding:0px 4px;text-align:center}.md3-badge__value{font-family:var(--_large-label-text-font);font-size:var(--_large-label-text-size);line-height:var(--_large-label-text-line-height);font-weight:var(--_large-label-text-weight)}\n`;\nexport default styles.styleSheet!;\n"]}

package/labs/behaviors/form-associated.d.ts CHANGED Viewed

@@ -8,17 +8,6 @@ import { WithElementInternals } from './element-internals.js';
 import { MixinBase, MixinReturn } from './mixin.js';
 /**
  * A form-associated element.
- *
- * IMPORTANT: Requires declares for lit-analyzer
- * @example
- * ```ts
- * const base = mixinFormAssociated(mixinElementInternals(LitElement));
- * class MyControl extends base {
- *   // Writable mixin properties for lit-html binding, needed for lit-analyzer
- *   declare disabled: boolean;
- *   declare name: string;
- * }
- * ```
  */
 export interface FormAssociated {
     /**
@@ -168,17 +157,6 @@ export declare const getFormState: unique symbol;
  * }
  * ```
  *
- * IMPORTANT: Requires declares for lit-analyzer
- * @example
- * ```ts
- * const base = mixinFormAssociated(mixinElementInternals(LitElement));
- * class MyControl extends base {
- *   // Writable mixin properties for lit-html binding, needed for lit-analyzer
- *   declare disabled: boolean;
- *   declare name: string;
- * }
- * ```
- *
  * @param base The class to mix functionality into. The base class must use
  *     `mixinElementInternals()`.
  * @return The provided class with `FormAssociated` mixed in.

package/labs/behaviors/form-associated.js CHANGED Viewed

@@ -77,17 +77,6 @@ export const getFormState = Symbol('getFormState');
  * }
  * ```
  *
- * IMPORTANT: Requires declares for lit-analyzer
- * @example
- * ```ts
- * const base = mixinFormAssociated(mixinElementInternals(LitElement));
- * class MyControl extends base {
- *   // Writable mixin properties for lit-html binding, needed for lit-analyzer
- *   declare disabled: boolean;
- *   declare name: string;
- * }
- * ```
- *
  * @param base The class to mix functionality into. The base class must use
  *     `mixinElementInternals()`.
  * @return The provided class with `FormAssociated` mixed in.

package/labs/behaviors/form-associated.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-associated.js","sourceRoot":"","sources":["form-associated.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {LitElement, PropertyDeclaration} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {internals, WithElementInternals} from './element-internals.js';\nimport {MixinBase, MixinReturn} from './mixin.js';\n\n/\n A form-associated element.\n \n IMPORTANT: Requires declares for lit-analyzer\n * @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n * class MyControl extends base {\n * // Writable mixin properties for lit-html binding, needed for lit-analyzer\n * declare disabled: boolean;\n * declare name: string;\n * }\n * ```\n /\nexport interface FormAssociated {\n /\n The associated form element with which this element's value will submit.\n /\n readonly form: HTMLFormElement \| null;\n\n /\n The labels this element is associated with.\n /\n readonly labels: NodeList;\n\n /\n The HTML name to use in form submission.\n /\n name: string;\n\n /\n Whether or not the element is disabled.\n /\n disabled: boolean;\n\n /\n Gets the current form value of a component. Defaults to the component's\n * `value` attribute.\n \n @return The current form value.\n /\n [getFormValue](): FormValue \| null;\n\n /\n Gets the current form state of a component. Defaults to the component's\n * `[getFormValue]()` result.\n \n Use this when the state of an element is different from its value, such as\n * checkboxes (internal boolean state and a user string value).\n \n @return The current form state, defaults to the form value.\n /\n [getFormState](): FormValue \| null;\n\n /\n A callback for when a form component should be disabled or enabled. This\n * can be called in a variety of situations, such as disabled `<fieldset>`s.\n \n @param disabled Whether or not the form control should be disabled.\n /\n formDisabledCallback(disabled: boolean): void;\n\n /\n An optional callback for when the form requests to reset its value.\n * Typically, the default value that is reset is represented in the attribute\n * of an element.\n \n This means the attribute used for the value should not update as the value\n * changes. For example, a checkbox should not change its default `checked`\n * attribute when selected. Ensure form values do not reflect.\n /\n formResetCallback?(): void;\n\n /\n An optional callback for when the form restores the state of a component.\n * For example, when a page is reloaded or forms are autofilled.\n \n @param state The state to restore, or null to reset the form control's\n * value.\n * @param reason The reason state was restored, either `'restore'` or\n * `'autocomplete'`.\n /\n formStateRestoreCallback?(\n state: FormRestoreState \| null,\n reason: FormRestoreReason,\n ): void;\n\n /\n An optional callback for when the associated form changes.\n \n @param form The new associated form, or `null` if there is none.\n /\n formAssociatedCallback?(form: HTMLFormElement \| null): void;\n}\n\n/\n The constructor of a `FormAssociated` element.\n /\nexport interface FormAssociatedConstructor {\n /\n Indicates that an element is participating in form association.\n /\n readonly formAssociated: true;\n}\n\n/\n A symbol property to retrieve the form value for an element.\n /\nexport const getFormValue = Symbol('getFormValue');\n\n/\n A symbol property to retrieve the form state for an element.\n /\nexport const getFormState = Symbol('getFormState');\n\n/\n Mixes in form-associated behavior for a class. This allows an element to add\n * values to `<form>` elements.\n \n Implementing classes should provide a `[formValue]` to return the current\n * value of the element, as well as reset and restore callbacks.\n \n @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n \n class MyControl extends base {\n * \\@property()\n * value = '';\n \n override [getFormValue]() {\n * return this.value;\n * }\n \n override formResetCallback() {\n * const defaultValue = this.getAttribute('value');\n * this.value = defaultValue;\n * }\n \n override formStateRestoreCallback(state: string) {\n * this.value = state;\n * }\n * }\n * ```\n \n Elements may optionally provide a `[formState]` if their values do not\n * represent the state of the component.\n \n @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n \n class MyCheckbox extends base {\n * \\@property()\n * value = 'on';\n \n \\@property({type: Boolean})\n * checked = false;\n \n override [getFormValue]() {\n * return this.checked ? this.value : null;\n * }\n \n override [getFormState]() {\n * return String(this.checked);\n * }\n \n override formResetCallback() {\n * const defaultValue = this.hasAttribute('checked');\n * this.checked = defaultValue;\n * }\n \n override formStateRestoreCallback(state: string) {\n * this.checked = Boolean(state);\n * }\n * }\n * ```\n \n IMPORTANT: Requires declares for lit-analyzer\n * @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n * class MyControl extends base {\n * // Writable mixin properties for lit-html binding, needed for lit-analyzer\n * declare disabled: boolean;\n * declare name: string;\n * }\n * ```\n \n @param base The class to mix functionality into. The base class must use\n * `mixinElementInternals()`.\n * @return The provided class with `FormAssociated` mixed in.\n /\nexport function mixinFormAssociated<\n T extends MixinBase<LitElement & WithElementInternals>,\n>(base: T): MixinReturn<T & FormAssociatedConstructor, FormAssociated> {\n abstract class FormAssociatedElement extends base implements FormAssociated {\n /* @nocollapse /\n static readonly formAssociated = true;\n\n get form() {\n return this[internals].form;\n }\n\n get labels() {\n return this[internals].labels;\n }\n\n // Use @property for the `name` and `disabled` properties to add them to the\n // `observedAttributes` array and trigger `attributeChangedCallback()`.\n //\n // We don't use Lit's default getter/setter (`noAccessor: true`) because\n // the attributes need to be updated synchronously to work with synchronous\n // form APIs, and Lit updates attributes async by default.\n @property({noAccessor: true})\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n // Note: setting name to null or empty does not remove the attribute.\n this.setAttribute('name', name);\n // We don't need to call `requestUpdate()` since it's called synchronously\n // in `attributeChangedCallback()`.\n }\n\n @property({type: Boolean, noAccessor: true})\n get disabled() {\n return this.hasAttribute('disabled');\n }\n set disabled(disabled: boolean) {\n // Coerce `disabled` in `Boolean()` to ensure that setting to `null` or\n // `undefined` sets the attribute to `false`.\n this.toggleAttribute('disabled', Boolean(disabled));\n // We don't need to call `requestUpdate()` since it's called synchronously\n // in `attributeChangedCallback()`.\n }\n\n override attributeChangedCallback(\n name: string,\n old: string \| null,\n value: string \| null,\n ) {\n // Manually `requestUpdate()` for `name` and `disabled` when their\n // attribute or property changes.\n // The properties update their attributes, so this callback is invoked\n // immediately when the properties are set. We call `requestUpdate()` here\n // instead of letting Lit set the properties from the attribute change.\n // That would cause the properties to re-set the attribute and invoke this\n // callback again in a loop. This leads to stale state when Lit tries to\n // determine if a property changed or not.\n if (name === 'name' \|\| name === 'disabled') {\n // Disabled's value is only false if the attribute is missing and null.\n const oldValue = name === 'disabled' ? old !== null : old;\n // Trigger a lit update when the attribute changes.\n this.requestUpdate(name, oldValue);\n return;\n }\n\n super.attributeChangedCallback(name, old, value);\n }\n\n override requestUpdate(\n name?: PropertyKey,\n oldValue?: unknown,\n options?: PropertyDeclaration,\n ) {\n super.requestUpdate(name, oldValue, options);\n // If any properties change, update the form value, which may have changed\n // as well.\n // Update the form value synchronously in `requestUpdate()` rather than\n // `update()` or `updated()`, which are async. This is necessary to ensure\n // that form data is updated in time for synchronous event listeners.\n this[internals].setFormValue(this[getFormValue](), this[getFormState]());\n }\n\n [getFormValue](): FormValue \| null {\n return this.getAttribute('value');\n }\n\n [getFormState](): FormValue \| null {\n return this[getFormValue]();\n }\n\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n }\n\n return FormAssociatedElement;\n}\n\n/\n A value that can be provided for form submission and state.\n /\nexport type FormValue = File \| string \| FormData;\n\n/\n A value to be restored for a component's form value. If a component's form\n * state is a `FormData` object, its entry list of name and values will be\n * provided.\n /\nexport type FormRestoreState =\n \| File\n \| string\n \| Array<[string, FormDataEntryValue]>;\n\n/\n The reason a form component is being restored for, either `'restore'` for\n * browser restoration or `'autocomplete'` for restoring user values.\n */\nexport type FormRestoreReason = 'restore' \| 'autocomplete';\n"]}
1	+ {"version":3,"file":"form-associated.js","sourceRoot":"","sources":["form-associated.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {LitElement, PropertyDeclaration} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {internals, WithElementInternals} from './element-internals.js';\nimport {MixinBase, MixinReturn} from './mixin.js';\n\n/\n A form-associated element.\n /\nexport interface FormAssociated {\n /\n The associated form element with which this element's value will submit.\n /\n readonly form: HTMLFormElement \| null;\n\n /\n The labels this element is associated with.\n /\n readonly labels: NodeList;\n\n /\n The HTML name to use in form submission.\n /\n name: string;\n\n /\n Whether or not the element is disabled.\n /\n disabled: boolean;\n\n /\n Gets the current form value of a component. Defaults to the component's\n * `value` attribute.\n \n @return The current form value.\n /\n [getFormValue](): FormValue \| null;\n\n /\n Gets the current form state of a component. Defaults to the component's\n * `[getFormValue]()` result.\n \n Use this when the state of an element is different from its value, such as\n * checkboxes (internal boolean state and a user string value).\n \n @return The current form state, defaults to the form value.\n /\n [getFormState](): FormValue \| null;\n\n /\n A callback for when a form component should be disabled or enabled. This\n * can be called in a variety of situations, such as disabled `<fieldset>`s.\n \n @param disabled Whether or not the form control should be disabled.\n /\n formDisabledCallback(disabled: boolean): void;\n\n /\n An optional callback for when the form requests to reset its value.\n * Typically, the default value that is reset is represented in the attribute\n * of an element.\n \n This means the attribute used for the value should not update as the value\n * changes. For example, a checkbox should not change its default `checked`\n * attribute when selected. Ensure form values do not reflect.\n /\n formResetCallback?(): void;\n\n /\n An optional callback for when the form restores the state of a component.\n * For example, when a page is reloaded or forms are autofilled.\n \n @param state The state to restore, or null to reset the form control's\n * value.\n * @param reason The reason state was restored, either `'restore'` or\n * `'autocomplete'`.\n /\n formStateRestoreCallback?(\n state: FormRestoreState \| null,\n reason: FormRestoreReason,\n ): void;\n\n /\n An optional callback for when the associated form changes.\n \n @param form The new associated form, or `null` if there is none.\n /\n formAssociatedCallback?(form: HTMLFormElement \| null): void;\n}\n\n/\n The constructor of a `FormAssociated` element.\n /\nexport interface FormAssociatedConstructor {\n /\n Indicates that an element is participating in form association.\n /\n readonly formAssociated: true;\n}\n\n/\n A symbol property to retrieve the form value for an element.\n /\nexport const getFormValue = Symbol('getFormValue');\n\n/\n A symbol property to retrieve the form state for an element.\n /\nexport const getFormState = Symbol('getFormState');\n\n/\n Mixes in form-associated behavior for a class. This allows an element to add\n * values to `<form>` elements.\n \n Implementing classes should provide a `[formValue]` to return the current\n * value of the element, as well as reset and restore callbacks.\n \n @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n \n class MyControl extends base {\n * \\@property()\n * value = '';\n \n override [getFormValue]() {\n * return this.value;\n * }\n \n override formResetCallback() {\n * const defaultValue = this.getAttribute('value');\n * this.value = defaultValue;\n * }\n \n override formStateRestoreCallback(state: string) {\n * this.value = state;\n * }\n * }\n * ```\n \n Elements may optionally provide a `[formState]` if their values do not\n * represent the state of the component.\n \n @example\n * ```ts\n * const base = mixinFormAssociated(mixinElementInternals(LitElement));\n \n class MyCheckbox extends base {\n * \\@property()\n * value = 'on';\n \n \\@property({type: Boolean})\n * checked = false;\n \n override [getFormValue]() {\n * return this.checked ? this.value : null;\n * }\n \n override [getFormState]() {\n * return String(this.checked);\n * }\n \n override formResetCallback() {\n * const defaultValue = this.hasAttribute('checked');\n * this.checked = defaultValue;\n * }\n \n override formStateRestoreCallback(state: string) {\n * this.checked = Boolean(state);\n * }\n * }\n * ```\n \n @param base The class to mix functionality into. The base class must use\n * `mixinElementInternals()`.\n * @return The provided class with `FormAssociated` mixed in.\n /\nexport function mixinFormAssociated<\n T extends MixinBase<LitElement & WithElementInternals>,\n>(base: T): MixinReturn<T & FormAssociatedConstructor, FormAssociated> {\n abstract class FormAssociatedElement extends base implements FormAssociated {\n /* @nocollapse /\n static readonly formAssociated = true;\n\n get form() {\n return this[internals].form;\n }\n\n get labels() {\n return this[internals].labels;\n }\n\n // Use @property for the `name` and `disabled` properties to add them to the\n // `observedAttributes` array and trigger `attributeChangedCallback()`.\n //\n // We don't use Lit's default getter/setter (`noAccessor: true`) because\n // the attributes need to be updated synchronously to work with synchronous\n // form APIs, and Lit updates attributes async by default.\n @property({noAccessor: true})\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n // Note: setting name to null or empty does not remove the attribute.\n this.setAttribute('name', name);\n // We don't need to call `requestUpdate()` since it's called synchronously\n // in `attributeChangedCallback()`.\n }\n\n @property({type: Boolean, noAccessor: true})\n get disabled() {\n return this.hasAttribute('disabled');\n }\n set disabled(disabled: boolean) {\n // Coerce `disabled` in `Boolean()` to ensure that setting to `null` or\n // `undefined` sets the attribute to `false`.\n this.toggleAttribute('disabled', Boolean(disabled));\n // We don't need to call `requestUpdate()` since it's called synchronously\n // in `attributeChangedCallback()`.\n }\n\n override attributeChangedCallback(\n name: string,\n old: string \| null,\n value: string \| null,\n ) {\n // Manually `requestUpdate()` for `name` and `disabled` when their\n // attribute or property changes.\n // The properties update their attributes, so this callback is invoked\n // immediately when the properties are set. We call `requestUpdate()` here\n // instead of letting Lit set the properties from the attribute change.\n // That would cause the properties to re-set the attribute and invoke this\n // callback again in a loop. This leads to stale state when Lit tries to\n // determine if a property changed or not.\n if (name === 'name' \|\| name === 'disabled') {\n // Disabled's value is only false if the attribute is missing and null.\n const oldValue = name === 'disabled' ? old !== null : old;\n // Trigger a lit update when the attribute changes.\n this.requestUpdate(name, oldValue);\n return;\n }\n\n super.attributeChangedCallback(name, old, value);\n }\n\n override requestUpdate(\n name?: PropertyKey,\n oldValue?: unknown,\n options?: PropertyDeclaration,\n ) {\n super.requestUpdate(name, oldValue, options);\n // If any properties change, update the form value, which may have changed\n // as well.\n // Update the form value synchronously in `requestUpdate()` rather than\n // `update()` or `updated()`, which are async. This is necessary to ensure\n // that form data is updated in time for synchronous event listeners.\n this[internals].setFormValue(this[getFormValue](), this[getFormState]());\n }\n\n [getFormValue](): FormValue \| null {\n return this.getAttribute('value');\n }\n\n [getFormState](): FormValue \| null {\n return this[getFormValue]();\n }\n\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n }\n\n return FormAssociatedElement;\n}\n\n/\n A value that can be provided for form submission and state.\n /\nexport type FormValue = File \| string \| FormData;\n\n/\n A value to be restored for a component's form value. If a component's form\n * state is a `FormData` object, its entry list of name and values will be\n * provided.\n /\nexport type FormRestoreState =\n \| File\n \| string\n \| Array<[string, FormDataEntryValue]>;\n\n/\n The reason a form component is being restored for, either `'restore'` for\n * browser restoration or `'autocomplete'` for restoring user values.\n */\nexport type FormRestoreReason = 'restore' \| 'autocomplete';\n"]}

package/labs/behaviors/form-submitter.d.ts CHANGED Viewed

@@ -30,7 +30,7 @@ export interface FormSubmitter {
      * - reset: The element resets the form.
      * - button: The element does nothing.
      */
-    type: FormSubmitterType;
+    type: string;
     /**
      * The HTML name to use in form submission. When combined with a `value`, the
      * submitting button's name/value will be added to the form.

package/labs/behaviors/form-submitter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-submitter.js","sourceRoot":"","sources":["form-submitter.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,QAAQ,EAAa,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EACL,aAAa,EACb,kBAAkB,GACnB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAC,SAAS,EAAuB,MAAM,wBAAwB,CAAC;AA6CvE;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,kBAAkB,CAEhC,IAAO;IACP,MAAe,oBAAqB,SAAQ,IAAI;QAI9C,kEAAkE;QAClE,IAAI,IAAI;YACN,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACzC,CAAC;QACD,IAAI,IAAI,CAAC,IAAY;YACnB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAClC,CAAC;QAED,uDAAuD;QACvD,kCAAkC;QAClC,YAAY,GAAG,IAAW;YACxB,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAdL,SAAI,~~GAAsB~~,QAAQ,CAAC;~~YACpB~~,UAAK,GAAG,EAAE,CAAC;YAcpC,IAAI,QAAQ;gBAAE,OAAO;YACrB,kBAAkB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;YAClC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAE,KAAY,EAAE,EAAE;gBACpD,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC;gBACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC;gBACxC,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;gBACzC,MAAM,EAAC,IAAI,EAAC,GAAG,gBAAgB,CAAC;gBAChC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,EAAE,CAAC;oBACpC,OAAO;gBACT,CAAC;gBAED,aAAa,CAAC,KAAK,EAAE,GAAG,EAAE;oBACxB,IAAI,KAAK,CAAC,gBAAgB,EAAE,CAAC;wBAC3B,OAAO;oBACT,CAAC;oBAED,IAAI,OAAO,EAAE,CAAC;wBACZ,IAAI,CAAC,KAAK,EAAE,CAAC;wBACb,OAAO;oBACT,CAAC;oBAED,0EAA0E;oBAC1E,wEAAwE;oBACxE,eAAe;oBACf,uDAAuD;oBACvD,IAAI,CAAC,gBAAgB,CACnB,QAAQ,EACR,CAAC,WAAkB,EAAE,EAAE;wBACrB,MAAM,CAAC,cAAc,CAAC,WAAW,EAAE,WAAW,EAAE;4BAC9C,YAAY,EAAE,IAAI;4BAClB,UAAU,EAAE,IAAI;4BAChB,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI;yBAChB,CAAC,CAAC;oBACL,CAAC,EACD,EAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,CAC5B,CAAC;oBAEF,gBAAgB,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;oBAC1C,IAAI,CAAC,aAAa,EAAE,CAAC;gBACvB,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC;KACF;IAzDa;QAAX,QAAQ,EAAE;~~sDAAoC~~;~~IACpB~~;QAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;uDAAY;IA0DxC,OAAO,oBAAoB,CAAC;AAC9B,CAAC","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {isServer, LitElement} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {\n afterDispatch,\n setupDispatchHooks,\n} from '../../internal/events/dispatch-hooks.js';\nimport {internals, WithElementInternals} from './element-internals.js';\nimport {MixinBase, MixinReturn} from './mixin.js';\n\n/\n A string indicating the form submission behavior of the element.\n \n - submit: The element submits the form. This is the default value if the\n * attribute is not specified, or if it is dynamically changed to an empty or\n * invalid value.\n * - reset: The element resets the form.\n * - button: The element does nothing.\n /\nexport type FormSubmitterType = 'button' \| 'submit' \| 'reset';\n\n/\n An element that can submit or reset a `<form>`, similar to\n * `<button type=\"submit\">`.\n /\nexport interface FormSubmitter {\n /\n A string indicating the form submission behavior of the element.\n \n - submit: The element submits the form. This is the default value if the\n * attribute is not specified, or if it is dynamically changed to an empty or\n * invalid value.\n * - reset: The element resets the form.\n * - button: The element does nothing.\n /\n type: ~~FormSubmitterType~~;\n\n /\n The HTML name to use in form submission. When combined with a `value`, the\n * submitting button's name/value will be added to the form.\n \n Names must reflect to a `name` attribute for form integration.\n /\n name: string;\n\n /\n The value of the button. When combined with a `name`, the submitting\n * button's name/value will be added to the form.\n /\n value: string;\n}\n\n/\n Mixes in form submitter behavior for a class.\n \n A click listener is added to each element instance. If the click is not\n * default prevented, it will submit the element's form, if any.\n \n @example\n * ```ts\n * const base = mixinFormSubmitter(mixinElementInternals(LitElement));\n * class MyButton extends base {\n * static formAssociated = true;\n * }\n * ```\n \n @param base The class to mix functionality into.\n * @return The provided class with `FormSubmitter` mixed in.\n */\nexport function mixinFormSubmitter<\n T extends MixinBase<LitElement & WithElementInternals>,\n>(base: T): MixinReturn<T, FormSubmitter> {\n abstract class FormSubmitterElement extends base implements FormSubmitter {\n @property() type: ~~FormSubmitterType~~ = 'submit';\n @property({reflect: true}) value = '';\n\n // Name attribute must reflect synchronously for form integration.\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n // Mixins must have a constructor with `...args: any[]`\n // tslint:disable-next-line:no-any\n constructor(...args: any[]) {\n super(...args);\n if (isServer) return;\n setupDispatchHooks(this, 'click');\n this.addEventListener('click', async (event: Event) => {\n const isReset = this.type === 'reset';\n const isSubmit = this.type === 'submit';\n const elementInternals = this[internals];\n const {form} = elementInternals;\n if (!form \|\| !(isSubmit \|\| isReset)) {\n return;\n }\n\n afterDispatch(event, () => {\n if (event.defaultPrevented) {\n return;\n }\n\n if (isReset) {\n form.reset();\n return;\n }\n\n // form.requestSubmit(submitter) does not work with form associated custom\n // elements. This patches the dispatched submit event to add the correct\n // `submitter`.\n // See https://github.com/WICG/webcomponents/issues/814\n form.addEventListener(\n 'submit',\n (submitEvent: Event) => {\n Object.defineProperty(submitEvent, 'submitter', {\n configurable: true,\n enumerable: true,\n get: () => this,\n });\n },\n {capture: true, once: true},\n );\n\n elementInternals.setFormValue(this.value);\n form.requestSubmit();\n });\n });\n }\n }\n\n return FormSubmitterElement;\n}\n"]}
1	+ {"version":3,"file":"form-submitter.js","sourceRoot":"","sources":["form-submitter.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,QAAQ,EAAa,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EACL,aAAa,EACb,kBAAkB,GACnB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAC,SAAS,EAAuB,MAAM,wBAAwB,CAAC;AA6CvE;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,kBAAkB,CAEhC,IAAO;IACP,MAAe,oBAAqB,SAAQ,IAAI;QAI9C,kEAAkE;QAClE,IAAI,IAAI;YACN,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACzC,CAAC;QACD,IAAI,IAAI,CAAC,IAAY;YACnB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAClC,CAAC;QAED,uDAAuD;QACvD,kCAAkC;QAClC,YAAY,GAAG,IAAW;YACxB,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAdL,SAAI,GAAG,QAAQ,CAAC;YACD,UAAK,GAAG,EAAE,CAAC;YAcpC,IAAI,QAAQ;gBAAE,OAAO;YACrB,kBAAkB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;YAClC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAE,KAAY,EAAE,EAAE;gBACpD,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC;gBACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC;gBACxC,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;gBACzC,MAAM,EAAC,IAAI,EAAC,GAAG,gBAAgB,CAAC;gBAChC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,EAAE,CAAC;oBACpC,OAAO;gBACT,CAAC;gBAED,aAAa,CAAC,KAAK,EAAE,GAAG,EAAE;oBACxB,IAAI,KAAK,CAAC,gBAAgB,EAAE,CAAC;wBAC3B,OAAO;oBACT,CAAC;oBAED,IAAI,OAAO,EAAE,CAAC;wBACZ,IAAI,CAAC,KAAK,EAAE,CAAC;wBACb,OAAO;oBACT,CAAC;oBAED,0EAA0E;oBAC1E,wEAAwE;oBACxE,eAAe;oBACf,uDAAuD;oBACvD,IAAI,CAAC,gBAAgB,CACnB,QAAQ,EACR,CAAC,WAAkB,EAAE,EAAE;wBACrB,MAAM,CAAC,cAAc,CAAC,WAAW,EAAE,WAAW,EAAE;4BAC9C,YAAY,EAAE,IAAI;4BAClB,UAAU,EAAE,IAAI;4BAChB,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI;yBAChB,CAAC,CAAC;oBACL,CAAC,EACD,EAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,CAC5B,CAAC;oBAEF,gBAAgB,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;oBAC1C,IAAI,CAAC,aAAa,EAAE,CAAC;gBACvB,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC;KACF;IAzDa;QAAX,QAAQ,EAAE;sDAAiB;IACD;QAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;uDAAY;IA0DxC,OAAO,oBAAoB,CAAC;AAC9B,CAAC","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {isServer, LitElement} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {\n afterDispatch,\n setupDispatchHooks,\n} from '../../internal/events/dispatch-hooks.js';\nimport {internals, WithElementInternals} from './element-internals.js';\nimport {MixinBase, MixinReturn} from './mixin.js';\n\n/\n A string indicating the form submission behavior of the element.\n \n - submit: The element submits the form. This is the default value if the\n * attribute is not specified, or if it is dynamically changed to an empty or\n * invalid value.\n * - reset: The element resets the form.\n * - button: The element does nothing.\n /\nexport type FormSubmitterType = 'button' \| 'submit' \| 'reset';\n\n/\n An element that can submit or reset a `<form>`, similar to\n * `<button type=\"submit\">`.\n /\nexport interface FormSubmitter {\n /\n A string indicating the form submission behavior of the element.\n \n - submit: The element submits the form. This is the default value if the\n * attribute is not specified, or if it is dynamically changed to an empty or\n * invalid value.\n * - reset: The element resets the form.\n * - button: The element does nothing.\n /\n type: string;\n\n /\n The HTML name to use in form submission. When combined with a `value`, the\n * submitting button's name/value will be added to the form.\n \n Names must reflect to a `name` attribute for form integration.\n /\n name: string;\n\n /\n The value of the button. When combined with a `name`, the submitting\n * button's name/value will be added to the form.\n /\n value: string;\n}\n\n/\n Mixes in form submitter behavior for a class.\n \n A click listener is added to each element instance. If the click is not\n * default prevented, it will submit the element's form, if any.\n \n @example\n * ```ts\n * const base = mixinFormSubmitter(mixinElementInternals(LitElement));\n * class MyButton extends base {\n * static formAssociated = true;\n * }\n * ```\n \n @param base The class to mix functionality into.\n * @return The provided class with `FormSubmitter` mixed in.\n */\nexport function mixinFormSubmitter<\n T extends MixinBase<LitElement & WithElementInternals>,\n>(base: T): MixinReturn<T, FormSubmitter> {\n abstract class FormSubmitterElement extends base implements FormSubmitter {\n @property() type = 'submit';\n @property({reflect: true}) value = '';\n\n // Name attribute must reflect synchronously for form integration.\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n // Mixins must have a constructor with `...args: any[]`\n // tslint:disable-next-line:no-any\n constructor(...args: any[]) {\n super(...args);\n if (isServer) return;\n setupDispatchHooks(this, 'click');\n this.addEventListener('click', async (event: Event) => {\n const isReset = this.type === 'reset';\n const isSubmit = this.type === 'submit';\n const elementInternals = this[internals];\n const {form} = elementInternals;\n if (!form \|\| !(isSubmit \|\| isReset)) {\n return;\n }\n\n afterDispatch(event, () => {\n if (event.defaultPrevented) {\n return;\n }\n\n if (isReset) {\n form.reset();\n return;\n }\n\n // form.requestSubmit(submitter) does not work with form associated custom\n // elements. This patches the dispatched submit event to add the correct\n // `submitter`.\n // See https://github.com/WICG/webcomponents/issues/814\n form.addEventListener(\n 'submit',\n (submitEvent: Event) => {\n Object.defineProperty(submitEvent, 'submitter', {\n configurable: true,\n enumerable: true,\n get: () => this,\n });\n },\n {capture: true, once: true},\n );\n\n elementInternals.setFormValue(this.value);\n form.requestSubmit();\n });\n });\n }\n }\n\n return FormSubmitterElement;\n}\n"]}

package/labs/card/elevated-card.js CHANGED Viewed

@@ -6,8 +6,8 @@
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
 import { Card } from './internal/card.js';
-import { styles as elevatedStyles } from './internal/elevated-styles.js';
-import { styles as sharedStyles } from './internal/shared-styles.js';
+import { styles as elevatedStyles } from './internal/elevated-styles.cssresult.js';
+import { styles as sharedStyles } from './internal/shared-styles.cssresult.js';
 /**
  * @final
  * @suppress {visibility}

package/labs/card/elevated-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"elevated-card.js","sourceRoot":"","sources":["elevated-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM~~,+BAA+B~~,CAAC;~~AACvE~~,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,~~6BAA6B~~,CAAC;~~AAQnE~~;;;GAGG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,IAAI;;AACtB,qBAAM,GAAwB,CAAC,YAAY,EAAE,cAAc,CAAC,AAAtD,CAAuD;AADlE,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAE1B","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as elevatedStyles} from './internal/elevated-styles.js';\nimport {styles as sharedStyles} from './internal/shared-styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-elevated-card': MdElevatedCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-elevated-card')\nexport class MdElevatedCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, elevatedStyles];\n}\n"]}
1	+ {"version":3,"file":"elevated-card.js","sourceRoot":"","sources":["elevated-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,uCAAuC,CAAC;AAQ7E;;;GAGG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,IAAI;;AACtB,qBAAM,GAAwB,CAAC,YAAY,EAAE,cAAc,CAAC,AAAtD,CAAuD;AADlE,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAE1B","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as elevatedStyles} from './internal/elevated-styles.cssresult.js';\nimport {styles as sharedStyles} from './internal/shared-styles.cssresult.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-elevated-card': MdElevatedCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-elevated-card')\nexport class MdElevatedCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, elevatedStyles];\n}\n"]}

package/labs/card/filled-card.js CHANGED Viewed

@@ -6,8 +6,8 @@
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
 import { Card } from './internal/card.js';
-import { styles as filledStyles } from './internal/filled-styles.js';
-import { styles as sharedStyles } from './internal/shared-styles.js';
+import { styles as filledStyles } from './internal/filled-styles.cssresult.js';
+import { styles as sharedStyles } from './internal/shared-styles.cssresult.js';
 /**
  * @final
  * @suppress {visibility}

package/labs/card/filled-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filled-card.js","sourceRoot":"","sources":["filled-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,~~6BAA6B~~,CAAC;~~AACnE~~,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,~~6BAA6B~~,CAAC;~~AAQnE~~;;;GAGG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,IAAI;;AACpB,mBAAM,GAAwB,CAAC,YAAY,EAAE,YAAY,CAAC,AAApD,CAAqD;AADhE,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as filledStyles} from './internal/filled-styles.js';\nimport {styles as sharedStyles} from './internal/shared-styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-filled-card': MdFilledCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-filled-card')\nexport class MdFilledCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, filledStyles];\n}\n"]}
1	+ {"version":3,"file":"filled-card.js","sourceRoot":"","sources":["filled-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,uCAAuC,CAAC;AAQ7E;;;GAGG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,IAAI;;AACpB,mBAAM,GAAwB,CAAC,YAAY,EAAE,YAAY,CAAC,AAApD,CAAqD;AADhE,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as filledStyles} from './internal/filled-styles.cssresult.js';\nimport {styles as sharedStyles} from './internal/shared-styles.cssresult.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-filled-card': MdFilledCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-filled-card')\nexport class MdFilledCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, filledStyles];\n}\n"]}

package/labs/card/internal/elevated-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/card/internal/elevated-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_container-color: var(--md-elevated-card-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_container-elevation: var(--md-elevated-card-container-elevation, 1);--_container-shadow-color: var(--md-elevated-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-elevated-card-container-shape, var(--md-sys-shape-corner-medium, 12px))}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=elevated-styles.cssresult.js.map

package/labs/card/internal/elevated-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"elevated-styles.cssresult.js","sourceRoot":"","sources":["elevated-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,qEAAqE;AACrE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/card/internal/elevated-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_container-color: var(--md-elevated-card-container-color, var(--md-sys-color-surface-container-low, #f7f2fa));--_container-elevation: var(--md-elevated-card-container-elevation, 1);--_container-shadow-color: var(--md-elevated-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-elevated-card-container-shape, var(--md-sys-shape-corner-medium, 12px))}\n`;\nexport default styles.styleSheet!;\n"]}

package/labs/card/internal/filled-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/card/internal/filled-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_container-color: var(--md-filled-card-container-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_container-elevation: var(--md-filled-card-container-elevation, 0);--_container-shadow-color: var(--md-filled-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-filled-card-container-shape, var(--md-sys-shape-corner-medium, 12px))}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=filled-styles.cssresult.js.map

package/labs/card/internal/filled-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"filled-styles.cssresult.js","sourceRoot":"","sources":["filled-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,mEAAmE;AACnE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/card/internal/filled-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_container-color: var(--md-filled-card-container-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_container-elevation: var(--md-filled-card-container-elevation, 0);--_container-shadow-color: var(--md-filled-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-filled-card-container-shape, var(--md-sys-shape-corner-medium, 12px))}\n`;\nexport default styles.styleSheet!;\n"]}

package/labs/card/internal/outlined-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/card/internal/outlined-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, var(--md-sys-shape-corner-medium, 12px));--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.outline{border-color:var(--_outline-color);border-width:var(--_outline-width)}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=outlined-styles.cssresult.js.map

package/labs/card/internal/outlined-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"outlined-styles.cssresult.js","sourceRoot":"","sources":["outlined-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,qEAAqE;AACrE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/card/internal/outlined-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, var(--md-sys-shape-corner-medium, 12px));--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.outline{border-color:var(--_outline-color);border-width:var(--_outline-width)}\n`;\nexport default styles.styleSheet!;\n"]}

package/labs/card/internal/shared-styles.cssresult.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/card/internal/shared-styles.css.
+import { css } from 'lit';
+export const styles = css `:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}md-elevation,.background,.outline{border-radius:inherit;inset:0;pointer-events:none;position:absolute}.background{background:var(--_container-color);z-index:-1}.outline{border:1px solid rgba(0,0,0,0);z-index:1}md-elevation{z-index:-1;--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}slot{border-radius:inherit}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=shared-styles.cssresult.js.map

package/labs/card/internal/shared-styles.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"shared-styles.cssresult.js","sourceRoot":"","sources":["shared-styles.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,mEAAmE;AACnE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/card/internal/shared-styles.css.\nimport {css} from 'lit';\nexport const styles = css`:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}md-elevation,.background,.outline{border-radius:inherit;inset:0;pointer-events:none;position:absolute}.background{background:var(--_container-color);z-index:-1}.outline{border:1px solid rgba(0,0,0,0);z-index:1}md-elevation{z-index:-1;--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}slot{border-radius:inherit}\n`;\nexport default styles.styleSheet!;\n"]}

package/labs/card/outlined-card.js CHANGED Viewed

@@ -6,8 +6,8 @@
 import { __decorate } from "tslib";
 import { customElement } from 'lit/decorators.js';
 import { Card } from './internal/card.js';
-import { styles as outlinedStyles } from './internal/outlined-styles.js';
-import { styles as sharedStyles } from './internal/shared-styles.js';
+import { styles as outlinedStyles } from './internal/outlined-styles.cssresult.js';
+import { styles as sharedStyles } from './internal/shared-styles.cssresult.js';
 /**
  * @final
  * @suppress {visibility}

package/labs/card/outlined-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"outlined-card.js","sourceRoot":"","sources":["outlined-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM~~,+BAA+B~~,CAAC;~~AACvE~~,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,~~6BAA6B~~,CAAC;~~AAQnE~~;;;GAGG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,IAAI;;AACtB,qBAAM,GAAwB,CAAC,YAAY,EAAE,cAAc,CAAC,AAAtD,CAAuD;AADlE,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAE1B","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as outlinedStyles} from './internal/outlined-styles.js';\nimport {styles as sharedStyles} from './internal/shared-styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-outlined-card': MdOutlinedCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-outlined-card')\nexport class MdOutlinedCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, outlinedStyles];\n}\n"]}
1	+ {"version":3,"file":"outlined-card.js","sourceRoot":"","sources":["outlined-card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAGH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,uCAAuC,CAAC;AAQ7E;;;GAGG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,IAAI;;AACtB,qBAAM,GAAwB,CAAC,YAAY,EAAE,cAAc,CAAC,AAAtD,CAAuD;AADlE,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAE1B","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {CSSResultOrNative} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Card} from './internal/card.js';\nimport {styles as outlinedStyles} from './internal/outlined-styles.cssresult.js';\nimport {styles as sharedStyles} from './internal/shared-styles.cssresult.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-outlined-card': MdOutlinedCard;\n }\n}\n\n/\n @final\n * @suppress {visibility}\n */\n@customElement('md-outlined-card')\nexport class MdOutlinedCard extends Card {\n static override styles: CSSResultOrNative[] = [sharedStyles, outlinedStyles];\n}\n"]}

package/labs/gb/components/button/_button-tokens.scss ADDED Viewed

@@ -0,0 +1,192 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+@mixin root {
+  --container-color: transparent;
+  --container-height: auto;
+  --container-elevation: var(--md-sys-elevation-shadow-0);
+  --container-shape: calc(var(--container-height) / 2);
+  --outline-width: 0;
+  --outline-color: transparent;
+  --icon-label-space: 8px;
+  --icon-color: currentColor;
+  --icon-size: 20px;
+  --label-text: var(--md-sys-typescale-label-lg);
+  --label-text-tracking: var(--md-sys-typescale-label-lg-tracking);
+  --label-text-color: currentColor;
+  --leading-space: 0;
+  --state-layer-color: transparent;
+  --trailing-space: 0;
+}
+@mixin selected {
+  --container-shape: var(--md-sys-shape-corner-md);
+}
+@mixin filled {
+  --container-color: var(--md-sys-color-primary);
+  --icon-color: var(--md-sys-color-on-primary);
+  --label-text-color: var(--md-sys-color-on-primary);
+}
+@mixin filled-unselected {
+  --container-color: var(--md-sys-color-surface-container);
+  --icon-color: var(--md-sys-color-on-surface-variant);
+  --label-text-color: var(--md-sys-color-on-surface-variant);
+}
+@mixin filled-selected {
+  --container-color: var(--md-sys-color-primary);
+  --icon-color: var(--md-sys-color-on-primary);
+  --label-text-color: var(--md-sys-color-on-primary);
+}
+@mixin elevated {
+  --container-color: var(--md-sys-color-surface-container-low);
+  --container-elevation: var(--md-sys-elevation-shadow-1);
+  --icon-color: var(--md-sys-color-primary);
+  --label-text-color: var(--md-sys-color-primary);
+}
+@mixin elevated-selected {
+  --container-color: var(--md-sys-color-primary);
+  --icon-color: var(--md-sys-color-on-primary);
+  --label-text-color: var(--md-sys-color-on-primary);
+}
+@mixin tonal {
+  --container-color: var(--md-sys-color-secondary-container);
+  --icon-color: var(--md-sys-color-on-secondary-container);
+  --label-text-color: var(--md-sys-color-on-secondary-container);
+}
+@mixin tonal-selected {
+  --container-color: var(--md-sys-color-secondary);
+  --icon-color: var(--md-sys-color-on-secondary);
+  --label-text-color: var(--md-sys-color-on-secondary);
+}
+@mixin outlined {
+  --icon-color: var(--md-sys-color-on-surface-variant);
+  --label-text-color: var(--md-sys-color-on-surface-variant);
+  --outline-color: var(--md-sys-color-outline-variant);
+  --outline-width: 1px;
+}
+@mixin outlined-lg {
+  --outline-width: 2px;
+}
+@mixin outlined-xl {
+  --outline-width: 3px;
+}
+@mixin outlined-selected {
+  --container-color: var(--md-sys-color-inverse-surface);
+  --icon-color: var(--md-sys-color-inverse-on-surface);
+  --label-text-color: var(--md-sys-color-inverse-on-surface);
+}
+@mixin text {
+  --label-text-color: var(--md-sys-color-primary);
+  --icon-color: var(--md-sys-color-primary);
+  --state-layer-color: var(--md-sys-color-primary);
+}
+@mixin xs {
+  --container-height: 32px;
+  --leading-space: 12px;
+  --trailing-space: 12px;
+}
+@mixin sm {
+  --container-height: 40px;
+  --leading-space: 16px;
+  --trailing-space: 16px;
+}
+@mixin md {
+  --container-height: 56px;
+  --leading-space: 24px;
+  --trailing-space: 24px;
+  --icon-size: 24px;
+  --label-text: var(--md-sys-typescale-title-md);
+  --label-text-tracking: var(--md-sys-typescale-title-md-tracking);
+}
+@mixin md-selected {
+  --container-shape: var(--md-sys-shape-corner-lg);
+}
+@mixin lg {
+  --container-height: 96px;
+  --icon-label-space: 12px;
+  --icon-size: 32px;
+  --leading-space: 48px;
+  --trailing-space: 48px;
+  --label-text: var(--md-sys-typescale-headline-sm);
+  --label-text-tracking: var(--md-sys-typescale-headline-sm-tracking);
+}
+@mixin lg-selected {
+  --container-shape: var(--md-sys-shape-corner-xl);
+}
+@mixin xl {
+  --container-height: 136px;
+  --icon-label-space: 16px;
+  --icon-size: 40px;
+  --leading-space: 64px;
+  --trailing-space: 64px;
+  --label-text: var(--md-sys-typescale-headline-lg);
+  --label-text-tracking: var(--md-sys-typescale-headline-lg-tracking);
+}
+@mixin xl-selected {
+  --container-shape: var(--md-sys-shape-corner-xl);
+}
+@mixin square {
+  --container-shape: var(--md-sys-shape-corner-md);
+}
+@mixin square-md {
+  --container-shape: var(--md-sys-shape-corner-lg);
+}
+@mixin square-lg {
+  --container-shape: var(--md-sys-shape-corner-xl);
+}
+@mixin square-xl {
+  --container-shape: var(--md-sys-shape-corner-xl);
+}
+@mixin square-selected {
+  --container-shape: calc(var(--container-height) / 2);
+}
+@mixin pressed {
+  --container-shape: var(--md-sys-shape-corner-sm);
+}
+@mixin pressed-md {
+  --container-shape: var(--md-sys-shape-corner-md);
+}
+@mixin pressed-lg {
+  --container-shape: var(--md-sys-shape-corner-lg);
+}
+@mixin pressed-xl {
+  --container-shape: var(--md-sys-shape-corner-lg);
+}
+@mixin disabled {
+  --container-color: hsl(from var(--md-sys-color-on-surface) h s l / 10%);
+  --container-elevation: var(--md-sys-elevation-shadow-0);
+  --icon-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%);
+  --label-text-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%);
+}

package/labs/gb/components/button/button.css ADDED Viewed

@@ -0,0 +1,4 @@
+/*!
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */@layer md.sys, md.comp.ripple, md.comp.focus-ring;@layer md.comp.button{.btn{--container-color: transparent;--container-height: auto;--container-elevation: var(--md-sys-elevation-shadow-0);--container-shape: calc(var(--container-height) / 2);--outline-width: 0;--outline-color: transparent;--icon-label-space: 8px;--icon-color: currentColor;--icon-size: 20px;--label-text: var(--md-sys-typescale-label-lg);--label-text-tracking: var(--md-sys-typescale-label-lg-tracking);--label-text-color: currentColor;--leading-space: 0;--state-layer-color: transparent;--trailing-space: 0}.btn:is(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-filled{--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-filled:where(.btn-unselected,[aria-pressed=false]){--container-color: var(--md-sys-color-surface-container);--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant)}.btn.btn-filled:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-elevated{--container-color: var(--md-sys-color-surface-container-low);--container-elevation: var(--md-sys-elevation-shadow-1);--icon-color: var(--md-sys-color-primary);--label-text-color: var(--md-sys-color-primary)}.btn.btn-elevated:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-tonal{--container-color: var(--md-sys-color-secondary-container);--icon-color: var(--md-sys-color-on-secondary-container);--label-text-color: var(--md-sys-color-on-secondary-container)}.btn.btn-tonal:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-secondary);--icon-color: var(--md-sys-color-on-secondary);--label-text-color: var(--md-sys-color-on-secondary)}.btn.btn-outlined{--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant);--outline-color: var(--md-sys-color-outline-variant);--outline-width: 1px}.btn.btn-outlined:where(.btn-lg){--outline-width: 2px}.btn.btn-outlined:where(.btn-xl){--outline-width: 3px}.btn.btn-outlined:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-inverse-surface);--icon-color: var(--md-sys-color-inverse-on-surface);--label-text-color: var(--md-sys-color-inverse-on-surface)}.btn.btn-text{--label-text-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-primary);--state-layer-color: var(--md-sys-color-primary)}.btn.btn-xs{--container-height: 32px;--leading-space: 12px;--trailing-space: 12px}.btn.btn-sm{--container-height: 40px;--leading-space: 16px;--trailing-space: 16px}.btn.btn-md{--container-height: 56px;--leading-space: 24px;--trailing-space: 24px;--icon-size: 24px;--label-text: var(--md-sys-typescale-title-md);--label-text-tracking: var(--md-sys-typescale-title-md-tracking)}.btn.btn-md:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-lg{--container-height: 96px;--icon-label-space: 12px;--icon-size: 32px;--leading-space: 48px;--trailing-space: 48px;--label-text: var(--md-sys-typescale-headline-sm);--label-text-tracking: var(--md-sys-typescale-headline-sm-tracking)}.btn.btn-lg:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-xl{--container-height: 136px;--icon-label-space: 16px;--icon-size: 40px;--leading-space: 64px;--trailing-space: 64px;--label-text: var(--md-sys-typescale-headline-lg);--label-text-tracking: var(--md-sys-typescale-headline-lg-tracking)}.btn.btn-xl:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square{--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-square:where(.btn-md){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-square:where(.btn-lg){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-xl){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-selected,[aria-pressed=true]){--container-shape: calc(var(--container-height) / 2)}.btn:is(:active,.active):where(:not(:disabled,.disabled)){--container-shape: var(--md-sys-shape-corner-sm)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-md){--container-shape: var(--md-sys-shape-corner-md)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-lg){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-xl){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:disabled,.disabled){--container-color: hsl(from var(--md-sys-color-on-surface) h s l / 10%);--container-elevation: var(--md-sys-elevation-shadow-0);--icon-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%);--label-text-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--container-height);gap:var(--icon-label-space);padding-inline:var(--leading-space) var(--trailing-space);border:var(--outline-width) solid var(--outline-color);border-radius:var(--container-shape);box-shadow:var(--container-elevation);background-color:var(--container-color);color:var(--label-text-color);font:var(--label-text);letter-spacing:var(--label-text-tracking);transition:border-radius 350ms cubic-bezier(0.42, 1.67, 0.21, 0.9),var(--ripple-transition);--md-icon-color: var(--icon-color);--md-icon-size: var(--icon-size)}.btn:not(:disabled,.disabled){cursor:pointer}}/*# sourceMappingURL=button.css.map */

package/labs/gb/components/button/button.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sourceRoot":"","sources":["button.scss","_button-tokens.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA,GASA,kDACA,sBACE,KCLA,+BACA,yBACA,wDACA,qDACA,mBACA,6BACA,wBACA,2BACA,kBACA,+CACA,iEACA,iCACA,mBACA,iCACA,oBDPE,2CCWF,iDDRE,gBCYF,+CACA,6CACA,mDDZI,4DCgBJ,yDACA,qDACA,2DDfI,yDCmBJ,+CACA,6CACA,mDDjBE,kBCqBF,6DACA,wDACA,0CACA,gDDtBI,2DC0BJ,+CACA,6CACA,mDDxBE,eC4BF,2DACA,yDACA,+DD5BI,wDCgCJ,iDACA,+CACA,qDD9BE,kBCkCF,qDACA,2DACA,qDACA,qBDnCI,iCCuCJ,qBDpCI,iCCwCJ,qBDrCI,2DCyCJ,uDACA,qDACA,2DDvCE,cC2CF,gDACA,0CACA,iDD1CE,YC8CF,yBACA,sBACA,uBD7CE,YCiDF,yBACA,sBACA,uBDhDE,YCoDF,yBACA,sBACA,uBACA,kBACA,+CACA,iEDvDI,qDC2DJ,iDDvDE,YC2DF,yBACA,yBACA,kBACA,sBACA,uBACA,kDACA,oED/DI,qDCmEJ,iDD/DE,YCmEF,0BACA,yBACA,kBACA,sBACA,uBACA,kDACA,oEDvEI,qDC2EJ,iDDvEE,gBC2EF,iDDzEI,+BC6EJ,iDD1EI,+BC8EJ,iDD3EI,+BC+EJ,iDD5EI,yDCgFJ,qDD5EE,0DCgFF,iDD9EI,yECkFJ,iDD/EI,yECmFJ,iDDhFI,yECoFJ,iDDhFE,6BCoFF,wEACA,wDACA,mEACA,yEDnFE,KACE,oBACA,mBACA,uBACA,mCACA,4BACA,0DACA,uDACA,qCACA,sCACA,wCACA,8BACA,uBACA,0CACA,WACE,iFAEF,mCACA,iCAEF,8BACE","file":"button.css"}

package/labs/gb/components/button/button.cssresult.js ADDED Viewed

@@ -0,0 +1,14 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Generated stylesheet for ./labs/gb/components/button/button.css.
+import { css } from 'lit';
+export const styles = css `/*!
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */@layer md.sys, md.comp.ripple, md.comp.focus-ring;@layer md.comp.button{.btn{--container-color: transparent;--container-height: auto;--container-elevation: var(--md-sys-elevation-shadow-0);--container-shape: calc(var(--container-height) / 2);--outline-width: 0;--outline-color: transparent;--icon-label-space: 8px;--icon-color: currentColor;--icon-size: 20px;--label-text: var(--md-sys-typescale-label-lg);--label-text-tracking: var(--md-sys-typescale-label-lg-tracking);--label-text-color: currentColor;--leading-space: 0;--state-layer-color: transparent;--trailing-space: 0}.btn:is(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-filled{--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-filled:where(.btn-unselected,[aria-pressed=false]){--container-color: var(--md-sys-color-surface-container);--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant)}.btn.btn-filled:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-elevated{--container-color: var(--md-sys-color-surface-container-low);--container-elevation: var(--md-sys-elevation-shadow-1);--icon-color: var(--md-sys-color-primary);--label-text-color: var(--md-sys-color-primary)}.btn.btn-elevated:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-tonal{--container-color: var(--md-sys-color-secondary-container);--icon-color: var(--md-sys-color-on-secondary-container);--label-text-color: var(--md-sys-color-on-secondary-container)}.btn.btn-tonal:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-secondary);--icon-color: var(--md-sys-color-on-secondary);--label-text-color: var(--md-sys-color-on-secondary)}.btn.btn-outlined{--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant);--outline-color: var(--md-sys-color-outline-variant);--outline-width: 1px}.btn.btn-outlined:where(.btn-lg){--outline-width: 2px}.btn.btn-outlined:where(.btn-xl){--outline-width: 3px}.btn.btn-outlined:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-inverse-surface);--icon-color: var(--md-sys-color-inverse-on-surface);--label-text-color: var(--md-sys-color-inverse-on-surface)}.btn.btn-text{--label-text-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-primary);--state-layer-color: var(--md-sys-color-primary)}.btn.btn-xs{--container-height: 32px;--leading-space: 12px;--trailing-space: 12px}.btn.btn-sm{--container-height: 40px;--leading-space: 16px;--trailing-space: 16px}.btn.btn-md{--container-height: 56px;--leading-space: 24px;--trailing-space: 24px;--icon-size: 24px;--label-text: var(--md-sys-typescale-title-md);--label-text-tracking: var(--md-sys-typescale-title-md-tracking)}.btn.btn-md:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-lg{--container-height: 96px;--icon-label-space: 12px;--icon-size: 32px;--leading-space: 48px;--trailing-space: 48px;--label-text: var(--md-sys-typescale-headline-sm);--label-text-tracking: var(--md-sys-typescale-headline-sm-tracking)}.btn.btn-lg:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-xl{--container-height: 136px;--icon-label-space: 16px;--icon-size: 40px;--leading-space: 64px;--trailing-space: 64px;--label-text: var(--md-sys-typescale-headline-lg);--label-text-tracking: var(--md-sys-typescale-headline-lg-tracking)}.btn.btn-xl:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square{--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-square:where(.btn-md){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-square:where(.btn-lg){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-xl){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-selected,[aria-pressed=true]){--container-shape: calc(var(--container-height) / 2)}.btn:is(:active,.active):where(:not(:disabled,.disabled)){--container-shape: var(--md-sys-shape-corner-sm)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-md){--container-shape: var(--md-sys-shape-corner-md)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-lg){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-xl){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:disabled,.disabled){--container-color: hsl(from var(--md-sys-color-on-surface) h s l / 10%);--container-elevation: var(--md-sys-elevation-shadow-0);--icon-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%);--label-text-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--container-height);gap:var(--icon-label-space);padding-inline:var(--leading-space) var(--trailing-space);border:var(--outline-width) solid var(--outline-color);border-radius:var(--container-shape);box-shadow:var(--container-elevation);background-color:var(--container-color);color:var(--label-text-color);font:var(--label-text);letter-spacing:var(--label-text-tracking);transition:border-radius 350ms cubic-bezier(0.42, 1.67, 0.21, 0.9),var(--ripple-transition);--md-icon-color: var(--icon-color);--md-icon-size: var(--icon-size)}.btn:not(:disabled,.disabled){cursor:pointer}}
+`;
+export default styles.styleSheet;
+//# sourceMappingURL=button.cssresult.js.map

package/labs/gb/components/button/button.cssresult.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"button.cssresult.js","sourceRoot":"","sources":["button.cssresult.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,mEAAmE;AACnE,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;CAIxB,CAAC;AACF,eAAe,MAAM,CAAC,UAAW,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n// Generated stylesheet for ./labs/gb/components/button/button.css.\nimport {css} from 'lit';\nexport const styles = css`/*!\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */@layer md.sys, md.comp.ripple, md.comp.focus-ring;@layer md.comp.button{.btn{--container-color: transparent;--container-height: auto;--container-elevation: var(--md-sys-elevation-shadow-0);--container-shape: calc(var(--container-height) / 2);--outline-width: 0;--outline-color: transparent;--icon-label-space: 8px;--icon-color: currentColor;--icon-size: 20px;--label-text: var(--md-sys-typescale-label-lg);--label-text-tracking: var(--md-sys-typescale-label-lg-tracking);--label-text-color: currentColor;--leading-space: 0;--state-layer-color: transparent;--trailing-space: 0}.btn:is(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-filled{--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-filled:where(.btn-unselected,[aria-pressed=false]){--container-color: var(--md-sys-color-surface-container);--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant)}.btn.btn-filled:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-elevated{--container-color: var(--md-sys-color-surface-container-low);--container-elevation: var(--md-sys-elevation-shadow-1);--icon-color: var(--md-sys-color-primary);--label-text-color: var(--md-sys-color-primary)}.btn.btn-elevated:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-on-primary);--label-text-color: var(--md-sys-color-on-primary)}.btn.btn-tonal{--container-color: var(--md-sys-color-secondary-container);--icon-color: var(--md-sys-color-on-secondary-container);--label-text-color: var(--md-sys-color-on-secondary-container)}.btn.btn-tonal:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-secondary);--icon-color: var(--md-sys-color-on-secondary);--label-text-color: var(--md-sys-color-on-secondary)}.btn.btn-outlined{--icon-color: var(--md-sys-color-on-surface-variant);--label-text-color: var(--md-sys-color-on-surface-variant);--outline-color: var(--md-sys-color-outline-variant);--outline-width: 1px}.btn.btn-outlined:where(.btn-lg){--outline-width: 2px}.btn.btn-outlined:where(.btn-xl){--outline-width: 3px}.btn.btn-outlined:where(.btn-selected,[aria-pressed=true]){--container-color: var(--md-sys-color-inverse-surface);--icon-color: var(--md-sys-color-inverse-on-surface);--label-text-color: var(--md-sys-color-inverse-on-surface)}.btn.btn-text{--label-text-color: var(--md-sys-color-primary);--icon-color: var(--md-sys-color-primary);--state-layer-color: var(--md-sys-color-primary)}.btn.btn-xs{--container-height: 32px;--leading-space: 12px;--trailing-space: 12px}.btn.btn-sm{--container-height: 40px;--leading-space: 16px;--trailing-space: 16px}.btn.btn-md{--container-height: 56px;--leading-space: 24px;--trailing-space: 24px;--icon-size: 24px;--label-text: var(--md-sys-typescale-title-md);--label-text-tracking: var(--md-sys-typescale-title-md-tracking)}.btn.btn-md:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-lg{--container-height: 96px;--icon-label-space: 12px;--icon-size: 32px;--leading-space: 48px;--trailing-space: 48px;--label-text: var(--md-sys-typescale-headline-sm);--label-text-tracking: var(--md-sys-typescale-headline-sm-tracking)}.btn.btn-lg:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-xl{--container-height: 136px;--icon-label-space: 16px;--icon-size: 40px;--leading-space: 64px;--trailing-space: 64px;--label-text: var(--md-sys-typescale-headline-lg);--label-text-tracking: var(--md-sys-typescale-headline-lg-tracking)}.btn.btn-xl:where(.btn-selected,[aria-pressed=true]){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square{--container-shape: var(--md-sys-shape-corner-md)}.btn.btn-square:where(.btn-md){--container-shape: var(--md-sys-shape-corner-lg)}.btn.btn-square:where(.btn-lg){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-xl){--container-shape: var(--md-sys-shape-corner-xl)}.btn.btn-square:where(.btn-selected,[aria-pressed=true]){--container-shape: calc(var(--container-height) / 2)}.btn:is(:active,.active):where(:not(:disabled,.disabled)){--container-shape: var(--md-sys-shape-corner-sm)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-md){--container-shape: var(--md-sys-shape-corner-md)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-lg){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:active,.active):where(:not(:disabled,.disabled)):where(.btn-xl){--container-shape: var(--md-sys-shape-corner-lg)}.btn:is(:disabled,.disabled){--container-color: hsl(from var(--md-sys-color-on-surface) h s l / 10%);--container-elevation: var(--md-sys-elevation-shadow-0);--icon-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%);--label-text-color: hsl(from var(--md-sys-color-on-surface) h s l / 38%)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--container-height);gap:var(--icon-label-space);padding-inline:var(--leading-space) var(--trailing-space);border:var(--outline-width) solid var(--outline-color);border-radius:var(--container-shape);box-shadow:var(--container-elevation);background-color:var(--container-color);color:var(--label-text-color);font:var(--label-text);letter-spacing:var(--label-text-tracking);transition:border-radius 350ms cubic-bezier(0.42, 1.67, 0.21, 0.9),var(--ripple-transition);--md-icon-color: var(--icon-color);--md-icon-size: var(--icon-size)}.btn:not(:disabled,.disabled){cursor:pointer}}\n`;\nexport default styles.styleSheet!;\n"]}