fix: add js extension for lit tooling (#3401)

FUTURE_COPYBARA_INTEGRATE_REVIEW=#3393 from material-components:release-0.26 1fedae4 PiperOrigin-RevId: 446764286
material-components · May 6, 2022 · d99e305 · d99e305
1 parent 4284c9e
commit d99e305
Show file tree

Hide file tree

Showing 347 changed files with 5,822 additions and 1,529 deletions.
diff --git a/components/action-element/README.md b/components/action-element/README.md
@@ -40,10 +40,10 @@ from `endPress()` have a `detail` object, it should be included in the call to
 ### Example
 
 ```ts
-import {ActionElement, BeginPressConfig, EndPressConfig} from '../action-element/action-element';
+import {ActionElement, BeginPressConfig, EndPressConfig} from '../action-element/action-element.js';
 
 import {html} from 'lit';
-import {property} from 'lit/decorators';
+import {property} from 'lit/decorators.js';
 
 export class MyElement extends ActionElement {
   @property({type: Boolean}) disabled = false;
@@ -81,11 +81,11 @@ export class MyElement extends ActionElement {
 ### Example with ripple
 
 ```ts
-import {ActionElement, BeginPressConfig, EndPressConfig} from '../action-element/action-element';
-import {MdRipple} from '../ripple/ripple';
+import {ActionElement, BeginPressConfig, EndPressConfig} from '../action-element/action-element.js';
+import {MdRipple} from '../ripple/ripple.js';
 
 import {html} from 'lit';
-import {property, query} from 'lit/decorators';
+import {property, query} from 'lit/decorators.js';
 
 
 export class MyElementWithRipple extends ActionElement {

diff --git a/components/action-element/action-element.ts b/components/action-element/action-element.ts
@@ -6,7 +6,7 @@
 
 import {LitElement} from 'lit';
 
-import {ActionController, ActionControllerHost, BeginPressConfig, EndPressConfig} from '../controller/action-controller';
+import {ActionController, ActionControllerHost, BeginPressConfig, EndPressConfig} from '../controller/action-controller.js';
 
 export {BeginPressConfig, EndPressConfig};
 

diff --git a/components/action-element/test/action-element_test.ts b/components/action-element/test/action-element_test.ts
@@ -7,10 +7,10 @@
 import 'jasmine';
 
 import {html} from 'lit';
-import {customElement, property} from 'lit/decorators';
+import {customElement, property} from 'lit/decorators.js';
 
-import {Environment} from '../../testing/environment';
-import {ActionElement} from '../action-element';
+import {Environment} from '../../testing/environment.js';
+import {ActionElement} from '../action-element.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/badge/badge.ts b/components/badge/badge.ts
@@ -4,10 +4,10 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {Badge} from './lib/badge';
-import {styles} from './lib/badge-styles.css';
+import {Badge} from './lib/badge.js';
+import {styles} from './lib/badge-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/badge/lib/badge.ts b/components/badge/lib/badge.ts
@@ -5,8 +5,8 @@
  */
 
 import {html, LitElement, TemplateResult} from 'lit';
-import {property} from 'lit/decorators';
-import {ClassInfo, classMap} from 'lit/directives/class-map';
+import {property} from 'lit/decorators.js';
+import {ClassInfo, classMap} from 'lit/directives/class-map.js';
 
 /** @soyCompatible */
 export class Badge extends LitElement {

diff --git a/components/button/elevated-button.ts b/components/button/elevated-button.ts
@@ -4,13 +4,13 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {styles as elevationOverlayStyles} from '../elevation/lib/elevation-overlay-styles.css';
+import {styles as elevationOverlayStyles} from '../elevation/lib/elevation-overlay-styles.css.js';
 
-import {ElevatedButton} from './lib/elevated-button';
-import {styles as elevatedStyles} from './lib/elevated-styles.css';
-import {styles as sharedStyles} from './lib/shared-styles.css';
+import {ElevatedButton} from './lib/elevated-button.js';
+import {styles as elevatedStyles} from './lib/elevated-styles.css.js';
+import {styles as sharedStyles} from './lib/shared-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/button/elevated-link-button.ts b/components/button/elevated-link-button.ts
@@ -4,13 +4,13 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {styles as elevationOverlayStyles} from '../elevation/lib/elevation-overlay-styles.css';
+import {styles as elevationOverlayStyles} from '../elevation/lib/elevation-overlay-styles.css.js';
 
-import {ElevatedLinkButton} from './lib/elevated-link-button';
-import {styles as elevatedStyles} from './lib/elevated-styles.css';
-import {styles as sharedStyles} from './lib/shared-styles.css';
+import {ElevatedLinkButton} from './lib/elevated-link-button.js';
+import {styles as elevatedStyles} from './lib/elevated-styles.css.js';
+import {styles as sharedStyles} from './lib/shared-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/button/filled-button.ts b/components/button/filled-button.ts
@@ -4,11 +4,11 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {FilledButton} from './lib/filled-button';
-import {styles as filledStyles} from './lib/filled-styles.css';
-import {styles as sharedStyles} from './lib/shared-styles.css';
+import {FilledButton} from './lib/filled-button.js';
+import {styles as filledStyles} from './lib/filled-styles.css.js';
+import {styles as sharedStyles} from './lib/shared-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/button/filled-link-button.ts b/components/button/filled-link-button.ts
@@ -4,11 +4,11 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {FilledLinkButton} from './lib/filled-link-button';
-import {styles as filledStyles} from './lib/filled-styles.css';
-import {styles as sharedStyles} from './lib/shared-styles.css';
+import {FilledLinkButton} from './lib/filled-link-button.js';
+import {styles as filledStyles} from './lib/filled-styles.css.js';
+import {styles as sharedStyles} from './lib/shared-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {

diff --git a/components/button/harness.ts b/components/button/harness.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {Harness} from '../testing/harness';
+import {Harness} from '../testing/harness.js';
 
-import {Button} from './lib/button';
+import {Button} from './lib/button.js';
 
 /**
  * Test harness for buttons.

diff --git a/components/button/lib/_button-theme.scss b/components/button/lib/_button-theme.scss
@@ -9,7 +9,7 @@
 // TODO(b/228217731): Remove MDC/MWC dependencies
 @use 'sass:map';
 @use 'third_party/javascript/material_web_components/m3/ripple/ripple-theme';
-@use '@material/theme/state';
+@use '../../compat/theme/state';
 @use '@material/typography/typography';
 
 $light-theme: (

diff --git a/components/button/lib/_button.scss b/components/button/lib/_button.scss
@@ -8,7 +8,7 @@
 
 // TODO(b/228217731): Remove MDC/MWC dependencies
 @use '@material/touch-target/touch-target';
-@use '@material/theme/selector-ext';
+@use '../../compat/theme/selector-ext';
 @use '../../elevation/lib/surface' as elevation-surface;
 
 @mixin static-styles() {

diff --git a/components/button/lib/_elevation-theme.scss b/components/button/lib/_elevation-theme.scss
@@ -7,7 +7,7 @@
 @use 'sass:map';
 @use 'sass:meta';
 @use 'third_party/javascript/material_web_components/m3/ripple/ripple-theme';
-@use '@material/theme/state';
+@use '../../compat/theme/state';
 @use '../../elevation/lib/elevation-theme';
 @use './button-theme';
 

diff --git a/components/button/lib/_icon-theme.scss b/components/button/lib/_icon-theme.scss
@@ -9,7 +9,7 @@
 // TODO(b/228217731): Remove MDC/MWC dependencies
 @use 'sass:map';
 @use 'third_party/javascript/material_web_components/m3/ripple/ripple-theme';
-@use '@material/theme/state';
+@use '../../compat/theme/state';
 @use './button-theme';
 
 $_selectors: button-theme.$selectors;

diff --git a/components/button/lib/_outlined-button-theme.scss b/components/button/lib/_outlined-button-theme.scss
@@ -9,7 +9,7 @@
 // TODO(b/228217731): Remove MDC/MWC dependencies
 @use 'sass:map';
 @use '@material/shape/shape';
-@use '@material/theme/state';
+@use '../../compat/theme/state';
 @use '../../sass/resolvers';
 @use '../../sass/theme';
 @use './button-theme';

diff --git a/components/button/lib/button.ts b/components/button/lib/button.ts
@@ -4,21 +4,21 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import '@material/mwc-icon/mwc-icon';
-import '../../focus/focus-ring';
-import '../../ripple/ripple';
+import '@material/mwc-icon/mwc-icon.js';
+import '../../focus/focus-ring.js';
+import '../../ripple/ripple.js';
 
 import {html, LitElement, TemplateResult} from 'lit';
-import {eventOptions, property, query, queryAssignedElements, state} from 'lit/decorators';
-import {ClassInfo, classMap} from 'lit/directives/class-map';
-import {ifDefined} from 'lit/directives/if-defined';
+import {eventOptions, property, query, queryAssignedElements, state} from 'lit/decorators.js';
+import {ClassInfo, classMap} from 'lit/directives/class-map.js';
+import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {ariaProperty} from '../../decorators/aria-property';
-import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus';
-import {MdRipple} from '../../ripple/ripple';
-import {ARIAHasPopup} from '../../types/aria';
+import {ariaProperty} from '../../decorators/aria-property.js';
+import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
+import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAHasPopup} from '../../types/aria.js';
 
-import {ButtonState} from './state';
+import {ButtonState} from './state.js';
 
 /** @soyCompatible */
 export abstract class Button extends LitElement implements ButtonState {

diff --git a/components/button/lib/elevated-button.ts b/components/button/lib/elevated-button.ts
@@ -5,9 +5,9 @@
  */
 
 import {html, TemplateResult} from 'lit';
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 /** @soyCompatible */
 export class ElevatedButton extends Button {

diff --git a/components/button/lib/elevated-link-button.ts b/components/button/lib/elevated-link-button.ts
@@ -5,9 +5,9 @@
  */
 
 import {html, TemplateResult} from 'lit';
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {LinkButton} from './link-button';
+import {LinkButton} from './link-button.js';
 
 /** @soyCompatible */
 export class ElevatedLinkButton extends LinkButton {

diff --git a/components/button/lib/filled-button.ts b/components/button/lib/filled-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 /** @soyCompatible */
 export class FilledButton extends Button {

diff --git a/components/button/lib/filled-link-button.ts b/components/button/lib/filled-link-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {LinkButton} from './link-button';
+import {LinkButton} from './link-button.js';
 
 /** @soyCompatible */
 export class FilledLinkButton extends LinkButton {

diff --git a/components/button/lib/link-button.ts b/components/button/lib/link-button.ts
@@ -5,11 +5,11 @@
  */
 
 import {html, TemplateResult} from 'lit';
-import {property} from 'lit/decorators';
-import {classMap} from 'lit/directives/class-map';
-import {ifDefined} from 'lit/directives/if-defined';
+import {property} from 'lit/decorators.js';
+import {classMap} from 'lit/directives/class-map.js';
+import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 type LinkTarget = '_blank'|'_parent'|'_self'|'_top';
 

diff --git a/components/button/lib/outlined-button.ts b/components/button/lib/outlined-button.ts
@@ -5,9 +5,9 @@
  */
 
 import {html, TemplateResult} from 'lit';
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 /** @soyCompatible */
 export class OutlinedButton extends Button {

diff --git a/components/button/lib/outlined-link-button.ts b/components/button/lib/outlined-link-button.ts
@@ -5,9 +5,9 @@
  */
 
 import {html, TemplateResult} from 'lit';
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {LinkButton} from './link-button';
+import {LinkButton} from './link-button.js';
 
 /** @soyCompatible */
 export class OutlinedLinkButton extends LinkButton {

diff --git a/components/button/lib/text-button.ts b/components/button/lib/text-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 /** @soyCompatible */
 export class TextButton extends Button {

diff --git a/components/button/lib/text-link-button.ts b/components/button/lib/text-link-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {LinkButton} from './link-button';
+import {LinkButton} from './link-button.js';
 
 /** @soyCompatible */
 export class TextLinkButton extends LinkButton {

diff --git a/components/button/lib/tonal-button.ts b/components/button/lib/tonal-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {Button} from './button';
+import {Button} from './button.js';
 
 /** @soyCompatible */
 export class TonalButton extends Button {

diff --git a/components/button/lib/tonal-link-button.ts b/components/button/lib/tonal-link-button.ts
@@ -4,9 +4,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {ClassInfo} from 'lit/directives/class-map';
+import {ClassInfo} from 'lit/directives/class-map.js';
 
-import {LinkButton} from './link-button';
+import {LinkButton} from './link-button.js';
 
 /** @soyCompatible */
 export class TonalLinkButton extends LinkButton {

diff --git a/components/button/outlined-button.ts b/components/button/outlined-button.ts
@@ -4,11 +4,11 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {customElement} from 'lit/decorators';
+import {customElement} from 'lit/decorators.js';
 
-import {OutlinedButton} from './lib/outlined-button';
-import {styles as outlinedStyles} from './lib/outlined-styles.css';
-import {styles as sharedStyles} from './lib/shared-styles.css';
+import {OutlinedButton} from './lib/outlined-button.js';
+import {styles as outlinedStyles} from './lib/outlined-styles.css.js';
+import {styles as sharedStyles} from './lib/shared-styles.css.js';
 
 declare global {
   interface HTMLElementTagNameMap {