From 60d7f688eb8ffd7916c6057351e872a3da4cf0e4 Mon Sep 17 00:00:00 2001 From: Konnor Rogers Date: Thu, 22 Jun 2023 10:56:24 -0400 Subject: [PATCH] fix extensionless imports (#1394) --- .eslintrc.cjs | 11 ++ scripts/make-react.js | 2 +- scripts/plop/plopfile.js | 2 +- .../plop/templates/component/component.hbs | 8 +- scripts/plop/templates/component/styles.hbs | 2 +- src/components/alert/alert.styles.ts | 2 +- src/components/alert/alert.test.ts | 8 +- src/components/alert/alert.ts | 18 +-- .../animated-image/animated-image.styles.ts | 2 +- .../animated-image/animated-image.test.ts | 4 +- .../animated-image/animated-image.ts | 8 +- src/components/animation/animation.styles.ts | 2 +- src/components/animation/animation.test.ts | 2 +- src/components/animation/animation.ts | 8 +- src/components/avatar/avatar.styles.ts | 2 +- src/components/avatar/avatar.test.ts | 2 +- src/components/avatar/avatar.ts | 8 +- src/components/badge/badge.styles.ts | 2 +- src/components/badge/badge.test.ts | 2 +- src/components/badge/badge.ts | 4 +- .../breadcrumb-item/breadcrumb-item.styles.ts | 2 +- .../breadcrumb-item/breadcrumb-item.test.ts | 2 +- .../breadcrumb-item/breadcrumb-item.ts | 6 +- .../breadcrumb/breadcrumb.styles.ts | 2 +- src/components/breadcrumb/breadcrumb.test.ts | 2 +- src/components/breadcrumb/breadcrumb.ts | 10 +- .../button-group/button-group.styles.ts | 2 +- .../button-group/button-group.test.ts | 2 +- src/components/button-group/button-group.ts | 4 +- src/components/button/button.styles.ts | 2 +- src/components/button/button.test.ts | 4 +- src/components/button/button.ts | 18 +-- src/components/card/card.styles.ts | 2 +- src/components/card/card.test.ts | 2 +- src/components/card/card.ts | 6 +- .../carousel-item/carousel-item.styles.ts | 2 +- src/components/carousel-item/carousel-item.ts | 4 +- src/components/carousel/carousel.styles.ts | 2 +- src/components/carousel/carousel.test.ts | 4 +- src/components/carousel/carousel.ts | 20 +-- src/components/carousel/scroll-controller.ts | 6 +- src/components/checkbox/checkbox.styles.ts | 2 +- src/components/checkbox/checkbox.test.ts | 6 +- src/components/checkbox/checkbox.ts | 14 +- .../color-picker/color-picker.styles.ts | 2 +- .../color-picker/color-picker.test.ts | 8 +- src/components/color-picker/color-picker.ts | 38 +++--- src/components/details/details.styles.ts | 2 +- src/components/details/details.ts | 16 +-- src/components/dialog/dialog.styles.ts | 2 +- src/components/dialog/dialog.ts | 22 ++-- src/components/divider/divider.styles.ts | 2 +- src/components/divider/divider.test.ts | 2 +- src/components/divider/divider.ts | 6 +- src/components/drawer/drawer.styles.ts | 2 +- src/components/drawer/drawer.ts | 24 ++-- src/components/dropdown/dropdown.styles.ts | 2 +- src/components/dropdown/dropdown.test.ts | 4 +- src/components/dropdown/dropdown.ts | 28 ++-- src/components/format-bytes/format-bytes.ts | 4 +- src/components/format-date/format-date.ts | 4 +- src/components/format-number/format-number.ts | 4 +- .../icon-button/icon-button.styles.ts | 2 +- src/components/icon-button/icon-button.ts | 6 +- src/components/icon/icon.styles.ts | 2 +- src/components/icon/icon.ts | 8 +- src/components/icon/library.default.ts | 4 +- src/components/icon/library.system.ts | 2 +- src/components/icon/library.ts | 6 +- .../image-comparer/image-comparer.styles.ts | 2 +- .../image-comparer/image-comparer.ts | 14 +- src/components/include/include.styles.ts | 2 +- src/components/include/include.ts | 8 +- src/components/input/input.styles.ts | 4 +- src/components/input/input.test.ts | 2 +- src/components/input/input.ts | 18 +-- src/components/menu-item/menu-item.styles.ts | 2 +- src/components/menu-item/menu-item.test.ts | 2 +- src/components/menu-item/menu-item.ts | 10 +- .../menu-label/menu-label.styles.ts | 2 +- src/components/menu-label/menu-label.ts | 4 +- src/components/menu/menu.styles.ts | 2 +- src/components/menu/menu.test.ts | 2 +- src/components/menu/menu.ts | 6 +- .../mutation-observer.styles.ts | 2 +- .../mutation-observer/mutation-observer.ts | 6 +- src/components/option/option.styles.ts | 2 +- src/components/option/option.ts | 10 +- src/components/popup/popup.styles.ts | 2 +- src/components/popup/popup.ts | 4 +- .../progress-bar/progress-bar.styles.ts | 2 +- src/components/progress-bar/progress-bar.ts | 6 +- .../progress-ring/progress-ring.styles.ts | 2 +- src/components/progress-ring/progress-ring.ts | 6 +- src/components/qr-code/qr-code.styles.ts | 2 +- src/components/qr-code/qr-code.ts | 6 +- .../radio-button/radio-button.styles.ts | 2 +- src/components/radio-button/radio-button.ts | 8 +- .../radio-group/radio-group.styles.ts | 4 +- .../radio-group/radio-group.test.ts | 10 +- src/components/radio-group/radio-group.ts | 18 +-- src/components/radio/radio.styles.ts | 2 +- src/components/radio/radio.ts | 8 +- src/components/range/range.styles.ts | 4 +- src/components/range/range.test.ts | 8 +- src/components/range/range.ts | 16 +-- src/components/rating/rating.styles.ts | 2 +- src/components/rating/rating.test.ts | 4 +- src/components/rating/rating.ts | 12 +- .../relative-time/relative-time.test.ts | 2 +- src/components/relative-time/relative-time.ts | 4 +- .../resize-observer/resize-observer.styles.ts | 2 +- .../resize-observer/resize-observer.ts | 6 +- src/components/select/select.styles.ts | 4 +- src/components/select/select.test.ts | 10 +- src/components/select/select.ts | 36 ++--- src/components/skeleton/skeleton.styles.ts | 2 +- src/components/skeleton/skeleton.ts | 4 +- src/components/spinner/spinner.styles.ts | 2 +- src/components/spinner/spinner.ts | 6 +- .../split-panel/split-panel.styles.ts | 2 +- .../split-panel/split-panel.test.ts | 6 +- src/components/split-panel/split-panel.ts | 12 +- src/components/switch/switch.styles.ts | 2 +- src/components/switch/switch.test.ts | 4 +- src/components/switch/switch.ts | 12 +- src/components/tab-group/tab-group.styles.ts | 2 +- src/components/tab-group/tab-group.test.ts | 16 +-- src/components/tab-group/tab-group.ts | 16 +-- src/components/tab-panel/tab-panel.styles.ts | 2 +- src/components/tab-panel/tab-panel.ts | 6 +- src/components/tab/tab.styles.ts | 2 +- src/components/tab/tab.ts | 10 +- src/components/tag/tag.styles.ts | 2 +- src/components/tag/tag.ts | 8 +- src/components/textarea/textarea.styles.ts | 4 +- src/components/textarea/textarea.test.ts | 6 +- src/components/textarea/textarea.ts | 14 +- src/components/tooltip/tooltip.styles.ts | 2 +- src/components/tooltip/tooltip.ts | 18 +-- src/components/tree-item/tree-item.styles.ts | 2 +- src/components/tree-item/tree-item.ts | 18 +-- src/components/tree/tree.styles.ts | 2 +- src/components/tree/tree.test.ts | 6 +- src/components/tree/tree.ts | 12 +- .../visually-hidden/visually-hidden.styles.ts | 2 +- .../visually-hidden/visually-hidden.ts | 4 +- src/internal/form.ts | 4 +- src/internal/modal.ts | 2 +- src/internal/scroll.ts | 2 +- src/internal/test/form-control-base-tests.ts | 2 +- src/shoelace-autoloader.ts | 2 +- src/shoelace.ts | 124 +++++++++--------- src/translations/da.ts | 4 +- src/translations/de-ch.ts | 6 +- src/translations/de.ts | 4 +- src/translations/en-gb.ts | 6 +- src/translations/en.ts | 2 +- src/translations/es.ts | 4 +- src/translations/fa.ts | 4 +- src/translations/fr.ts | 4 +- src/translations/he.ts | 4 +- src/translations/hu.ts | 4 +- src/translations/ja.ts | 4 +- src/translations/nl.ts | 4 +- src/translations/pl.ts | 4 +- src/translations/pt.ts | 4 +- src/translations/ru.ts | 4 +- src/translations/sv.ts | 4 +- src/translations/tr.ts | 4 +- src/translations/zh-tw.ts | 4 +- src/utilities/animation.ts | 2 +- src/utilities/form.ts | 2 +- src/utilities/icon-library.ts | 2 +- 174 files changed, 576 insertions(+), 565 deletions(-) diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 29eff8bf..4d9622d5 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -185,6 +185,17 @@ module.exports = { ] } ], + 'import/extensions': [ + 'error', + 'always', + { + ignorePackages: true, + pattern: { + js: 'always', + ts: 'never' + } + } + ], 'import/no-duplicates': 'warn', 'sort-imports-es6-autofix/sort-imports-es6': [ 2, diff --git a/scripts/make-react.js b/scripts/make-react.js index fff87269..d56491de 100644 --- a/scripts/make-react.js +++ b/scripts/make-react.js @@ -49,7 +49,7 @@ components.map(component => { }) ); - index.push(`export { default as ${component.name} } from './${tagWithoutPrefix}';`); + index.push(`export { default as ${component.name} } from './${tagWithoutPrefix}/index.js';`); fs.writeFileSync(componentFile, source, 'utf8'); }); diff --git a/scripts/plop/plopfile.js b/scripts/plop/plopfile.js index 601826c3..cc658ebf 100644 --- a/scripts/plop/plopfile.js +++ b/scripts/plop/plopfile.js @@ -54,7 +54,7 @@ export default function (plop) { type: 'modify', path: '../../src/shoelace.ts', pattern: /\/\* plop:component \*\//, - template: `export { default as {{ properCase tag }} } from './components/{{ tagWithoutPrefix tag }}/{{ tagWithoutPrefix tag }}';\n/* plop:component */` + template: `export { default as {{ properCase tag }} } from './components/{{ tagWithoutPrefix tag }}/{{ tagWithoutPrefix tag }}.js';\n/* plop:component */` } ] }); diff --git a/scripts/plop/templates/component/component.hbs b/scripts/plop/templates/component/component.hbs index 47154f27..5cac0157 100644 --- a/scripts/plop/templates/component/component.hbs +++ b/scripts/plop/templates/component/component.hbs @@ -1,9 +1,9 @@ import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './{{ tagWithoutPrefix tag }}.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './{{ tagWithoutPrefix tag }}.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/scripts/plop/templates/component/styles.hbs b/scripts/plop/templates/component/styles.hbs index a4aafbb9..1775f7f7 100644 --- a/scripts/plop/templates/component/styles.hbs +++ b/scripts/plop/templates/component/styles.hbs @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/alert/alert.styles.ts b/src/components/alert/alert.styles.ts index c8096d8e..eb955cde 100644 --- a/src/components/alert/alert.styles.ts +++ b/src/components/alert/alert.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/alert/alert.test.ts b/src/components/alert/alert.test.ts index 6883f34c..e3b70a25 100644 --- a/src/components/alert/alert.test.ts +++ b/src/components/alert/alert.test.ts @@ -1,11 +1,11 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing'; -import { clickOnElement, moveMouseOnElement } from '../../internal/test'; -import { queryByTestId } from '../../internal/test/data-testid-helpers'; +import { clickOnElement, moveMouseOnElement } from '../../internal/test.js'; +import { queryByTestId } from '../../internal/test/data-testid-helpers.js'; import { resetMouse } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlAlert from './alert'; -import type SlIconButton from '../icon-button/icon-button'; +import type SlAlert from './alert.js'; +import type SlIconButton from '../icon-button/icon-button.js'; const getAlertContainer = (alert: SlAlert): HTMLElement => { return alert.shadowRoot!.querySelector('[part="base"]')!; diff --git a/src/components/alert/alert.ts b/src/components/alert/alert.ts index 19f5519c..8d220afa 100644 --- a/src/components/alert/alert.ts +++ b/src/components/alert/alert.ts @@ -1,15 +1,15 @@ -import '../icon-button/icon-button'; -import { animateTo, stopAnimations } from '../../internal/animate'; +import '../icon-button/icon-button.js'; +import { animateTo, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; -import { HasSlotController } from '../../internal/slot'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './alert.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './alert.styles.js'; import type { CSSResultGroup } from 'lit'; const toastStack = Object.assign(document.createElement('div'), { className: 'sl-toast-stack' }); diff --git a/src/components/animated-image/animated-image.styles.ts b/src/components/animated-image/animated-image.styles.ts index 171ee80d..3f326284 100644 --- a/src/components/animated-image/animated-image.styles.ts +++ b/src/components/animated-image/animated-image.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/animated-image/animated-image.test.ts b/src/components/animated-image/animated-image.test.ts index c0981b83..4e77bb42 100644 --- a/src/components/animated-image/animated-image.test.ts +++ b/src/components/animated-image/animated-image.test.ts @@ -1,7 +1,7 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html, oneEvent } from '@open-wc/testing'; -import type SlAnimatedImage from './animated-image'; +import type SlAnimatedImage from './animated-image.js'; describe('', () => { it('should render a component', async () => { diff --git a/src/components/animated-image/animated-image.ts b/src/components/animated-image/animated-image.ts index 71aaf6e8..6c47bc2f 100644 --- a/src/components/animated-image/animated-image.ts +++ b/src/components/animated-image/animated-image.ts @@ -1,9 +1,9 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './animated-image.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './animated-image.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/animation/animation.styles.ts b/src/components/animation/animation.styles.ts index cb10fcc6..674851ee 100644 --- a/src/components/animation/animation.styles.ts +++ b/src/components/animation/animation.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/animation/animation.test.ts b/src/components/animation/animation.test.ts index 3d67fd44..43010a50 100644 --- a/src/components/animation/animation.test.ts +++ b/src/components/animation/animation.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing'; -import type SlAnimation from './animation'; +import type SlAnimation from './animation.js'; describe('', () => { const boxToAnimate = html`
`; diff --git a/src/components/animation/animation.ts b/src/components/animation/animation.ts index c9eb9884..81c1bc51 100644 --- a/src/components/animation/animation.ts +++ b/src/components/animation/animation.ts @@ -1,9 +1,9 @@ -import { animations } from './animations'; +import { animations } from './animations.js'; import { customElement, property, queryAsync } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './animation.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './animation.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/avatar/avatar.styles.ts b/src/components/avatar/avatar.styles.ts index 307d3b05..0d556b8f 100644 --- a/src/components/avatar/avatar.styles.ts +++ b/src/components/avatar/avatar.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/avatar/avatar.test.ts b/src/components/avatar/avatar.test.ts index 6412cd81..4cfcb955 100644 --- a/src/components/avatar/avatar.test.ts +++ b/src/components/avatar/avatar.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, waitUntil } from '@open-wc/testing'; -import type SlAvatar from './avatar'; +import type SlAvatar from './avatar.js'; // The default avatar background just misses AA contrast, but the next step up is way too dark. Since avatars aren't // used to display text, we're going to relax this rule. diff --git a/src/components/avatar/avatar.ts b/src/components/avatar/avatar.ts index 287ea2d7..0fafaa60 100644 --- a/src/components/avatar/avatar.ts +++ b/src/components/avatar/avatar.ts @@ -1,10 +1,10 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './avatar.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './avatar.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/badge/badge.styles.ts b/src/components/badge/badge.styles.ts index 73219fae..d1b1334a 100644 --- a/src/components/badge/badge.styles.ts +++ b/src/components/badge/badge.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/badge/badge.test.ts b/src/components/badge/badge.test.ts index 91538ded..1c052ce5 100644 --- a/src/components/badge/badge.test.ts +++ b/src/components/badge/badge.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html } from '@open-wc/testing'; -import type SlBadge from './badge'; +import type SlBadge from './badge.js'; describe('', () => { let el: SlBadge; diff --git a/src/components/badge/badge.ts b/src/components/badge/badge.ts index c0557d10..2a90d823 100644 --- a/src/components/badge/badge.ts +++ b/src/components/badge/badge.ts @@ -1,8 +1,8 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './badge.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './badge.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/breadcrumb-item/breadcrumb-item.styles.ts b/src/components/breadcrumb-item/breadcrumb-item.styles.ts index dbf71a51..df1a3272 100644 --- a/src/components/breadcrumb-item/breadcrumb-item.styles.ts +++ b/src/components/breadcrumb-item/breadcrumb-item.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/breadcrumb-item/breadcrumb-item.test.ts b/src/components/breadcrumb-item/breadcrumb-item.test.ts index 2e34c101..b89964f6 100644 --- a/src/components/breadcrumb-item/breadcrumb-item.test.ts +++ b/src/components/breadcrumb-item/breadcrumb-item.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html } from '@open-wc/testing'; -import type SlBreadcrumbItem from './breadcrumb-item'; +import type SlBreadcrumbItem from './breadcrumb-item.js'; describe('', () => { let el: SlBreadcrumbItem; diff --git a/src/components/breadcrumb-item/breadcrumb-item.ts b/src/components/breadcrumb-item/breadcrumb-item.ts index 4376a0d6..5d8d20f2 100644 --- a/src/components/breadcrumb-item/breadcrumb-item.ts +++ b/src/components/breadcrumb-item/breadcrumb-item.ts @@ -1,10 +1,10 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; -import { HasSlotController } from '../../internal/slot'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './breadcrumb-item.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './breadcrumb-item.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/breadcrumb/breadcrumb.styles.ts b/src/components/breadcrumb/breadcrumb.styles.ts index 281a00f5..8974f84a 100644 --- a/src/components/breadcrumb/breadcrumb.styles.ts +++ b/src/components/breadcrumb/breadcrumb.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/breadcrumb/breadcrumb.test.ts b/src/components/breadcrumb/breadcrumb.test.ts index 01b3e83b..ae2f86c7 100644 --- a/src/components/breadcrumb/breadcrumb.test.ts +++ b/src/components/breadcrumb/breadcrumb.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html } from '@open-wc/testing'; -import type SlBreadcrumb from './breadcrumb'; +import type SlBreadcrumb from './breadcrumb.js'; // The default link color just misses AA contrast, but the next step up is way too dark. Maybe we can solve this in the // future with a prefers-contrast media query. diff --git a/src/components/breadcrumb/breadcrumb.ts b/src/components/breadcrumb/breadcrumb.ts index b5ce0682..3b1d5399 100644 --- a/src/components/breadcrumb/breadcrumb.ts +++ b/src/components/breadcrumb/breadcrumb.ts @@ -1,11 +1,11 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { customElement, property, query } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './breadcrumb.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './breadcrumb.styles.js'; import type { CSSResultGroup } from 'lit'; -import type SlBreadcrumbItem from '../breadcrumb-item/breadcrumb-item'; +import type SlBreadcrumbItem from '../breadcrumb-item/breadcrumb-item.js'; /** * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy. diff --git a/src/components/button-group/button-group.styles.ts b/src/components/button-group/button-group.styles.ts index 03cbf62e..868f5a83 100644 --- a/src/components/button-group/button-group.styles.ts +++ b/src/components/button-group/button-group.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/button-group/button-group.test.ts b/src/components/button-group/button-group.test.ts index a0f8cc17..2dfdbecf 100644 --- a/src/components/button-group/button-group.test.ts +++ b/src/components/button-group/button-group.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { elementUpdated, expect, fixture, html } from '@open-wc/testing'; -import type SlButtonGroup from './button-group'; +import type SlButtonGroup from './button-group.js'; describe('', () => { describe('defaults ', () => { diff --git a/src/components/button-group/button-group.ts b/src/components/button-group/button-group.ts index 6d8dca90..88ae444e 100644 --- a/src/components/button-group/button-group.ts +++ b/src/components/button-group/button-group.ts @@ -1,7 +1,7 @@ import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './button-group.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './button-group.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/button/button.styles.ts b/src/components/button/button.styles.ts index 54276e73..1a6f66c9 100644 --- a/src/components/button/button.styles.ts +++ b/src/components/button/button.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/button/button.test.ts b/src/components/button/button.test.ts index b5920b63..1f1fe8c1 100644 --- a/src/components/button/button.test.ts +++ b/src/components/button/button.test.ts @@ -1,8 +1,8 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html, waitUntil } from '@open-wc/testing'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import sinon from 'sinon'; -import type SlButton from './button'; +import type SlButton from './button.js'; const variants = ['default', 'primary', 'success', 'neutral', 'warning', 'danger']; diff --git a/src/components/button/button.ts b/src/components/button/button.ts index c800e379..0ef28a3f 100644 --- a/src/components/button/button.ts +++ b/src/components/button/button.ts @@ -1,17 +1,17 @@ -import '../icon/icon'; -import '../spinner/spinner'; +import '../icon/icon.js'; +import '../spinner/spinner.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { FormControlController, validValidityState } from '../../internal/form'; -import { HasSlotController } from '../../internal/slot'; +import { FormControlController, validValidityState } from '../../internal/form.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html, literal } from 'lit/static-html.js'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './button.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './button.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Buttons represent actions that are available to the user. diff --git a/src/components/card/card.styles.ts b/src/components/card/card.styles.ts index 375ba748..b334c126 100644 --- a/src/components/card/card.styles.ts +++ b/src/components/card/card.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/card/card.test.ts b/src/components/card/card.test.ts index 2b7900be..02096871 100644 --- a/src/components/card/card.test.ts +++ b/src/components/card/card.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html } from '@open-wc/testing'; -import type SlCard from './card'; +import type SlCard from './card.js'; describe('', () => { let el: SlCard; diff --git a/src/components/card/card.ts b/src/components/card/card.ts index 567f3685..3ad0e3f2 100644 --- a/src/components/card/card.ts +++ b/src/components/card/card.ts @@ -1,9 +1,9 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement } from 'lit/decorators.js'; -import { HasSlotController } from '../../internal/slot'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './card.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './card.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/carousel-item/carousel-item.styles.ts b/src/components/carousel-item/carousel-item.styles.ts index 6bb8efb4..65327e84 100644 --- a/src/components/carousel-item/carousel-item.styles.ts +++ b/src/components/carousel-item/carousel-item.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/carousel-item/carousel-item.ts b/src/components/carousel-item/carousel-item.ts index eda5ea73..ce471526 100644 --- a/src/components/carousel-item/carousel-item.ts +++ b/src/components/carousel-item/carousel-item.ts @@ -1,7 +1,7 @@ import { customElement } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './carousel-item.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './carousel-item.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/carousel/carousel.styles.ts b/src/components/carousel/carousel.styles.ts index ce6d2206..569fd9cf 100644 --- a/src/components/carousel/carousel.styles.ts +++ b/src/components/carousel/carousel.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/carousel/carousel.test.ts b/src/components/carousel/carousel.test.ts index ee80532e..b5625dc0 100644 --- a/src/components/carousel/carousel.test.ts +++ b/src/components/carousel/carousel.test.ts @@ -1,8 +1,8 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html, oneEvent } from '@open-wc/testing'; import sinon from 'sinon'; -import type SlCarousel from './carousel'; +import type SlCarousel from './carousel.js'; describe('', () => { it('should render a carousel with default configuration', async () => { diff --git a/src/components/carousel/carousel.ts b/src/components/carousel/carousel.ts index f4a508a8..05e89038 100644 --- a/src/components/carousel/carousel.ts +++ b/src/components/carousel/carousel.ts @@ -1,18 +1,18 @@ -import '../icon/icon'; -import { AutoplayController } from './autoplay-controller'; -import { clamp } from '../../internal/math'; +import '../icon/icon.js'; +import { AutoplayController } from './autoplay-controller.js'; +import { clamp } from '../../internal/math.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; +import { LocalizeController } from '../../utilities/localize.js'; import { map } from 'lit/directives/map.js'; -import { prefersReducedMotion } from '../../internal/animate'; +import { prefersReducedMotion } from '../../internal/animate.js'; import { range } from 'lit/directives/range.js'; -import { ScrollController } from './scroll-controller'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import SlCarouselItem from '../carousel-item/carousel-item'; -import styles from './carousel.styles'; +import { ScrollController } from './scroll-controller.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import SlCarouselItem from '../carousel-item/carousel-item.js'; +import styles from './carousel.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/carousel/scroll-controller.ts b/src/components/carousel/scroll-controller.ts index dcd32cb4..e8e0b17c 100644 --- a/src/components/carousel/scroll-controller.ts +++ b/src/components/carousel/scroll-controller.ts @@ -1,6 +1,6 @@ -import { debounce } from '../../internal/debounce'; -import { prefersReducedMotion } from '../../internal/animate'; -import { waitForEvent } from '../../internal/event'; +import { debounce } from '../../internal/debounce.js'; +import { prefersReducedMotion } from '../../internal/animate.js'; +import { waitForEvent } from '../../internal/event.js'; import type { ReactiveController, ReactiveElement } from 'lit'; interface ScrollHost extends ReactiveElement { diff --git a/src/components/checkbox/checkbox.styles.ts b/src/components/checkbox/checkbox.styles.ts index 0f29c20e..ae741796 100644 --- a/src/components/checkbox/checkbox.styles.ts +++ b/src/components/checkbox/checkbox.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/checkbox/checkbox.test.ts b/src/components/checkbox/checkbox.test.ts index 3b3dbc2d..2757fde4 100644 --- a/src/components/checkbox/checkbox.test.ts +++ b/src/components/checkbox/checkbox.test.ts @@ -1,10 +1,10 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { clickOnElement } from '../../internal/test.js'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlCheckbox from './checkbox'; +import type SlCheckbox from './checkbox.js'; describe('', () => { it('should pass accessibility tests', async () => { diff --git a/src/components/checkbox/checkbox.ts b/src/components/checkbox/checkbox.ts index 7a223d39..6709c382 100644 --- a/src/components/checkbox/checkbox.ts +++ b/src/components/checkbox/checkbox.ts @@ -1,16 +1,16 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { live } from 'lit/directives/live.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './checkbox.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './checkbox.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Checkboxes allow the user to toggle an option on or off. diff --git a/src/components/color-picker/color-picker.styles.ts b/src/components/color-picker/color-picker.styles.ts index 52bffd8a..6ebec95e 100644 --- a/src/components/color-picker/color-picker.styles.ts +++ b/src/components/color-picker/color-picker.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/color-picker/color-picker.test.ts b/src/components/color-picker/color-picker.test.ts index d7db744e..34f3d57c 100644 --- a/src/components/color-picker/color-picker.test.ts +++ b/src/components/color-picker/color-picker.test.ts @@ -1,11 +1,11 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { clickOnElement } from '../../internal/test.js'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; -import { serialize } from '../../utilities/form'; +import { serialize } from '../../utilities/form.js'; import sinon from 'sinon'; -import type SlColorPicker from './color-picker'; +import type SlColorPicker from './color-picker.js'; describe('', () => { describe('when the value changes', () => { diff --git a/src/components/color-picker/color-picker.ts b/src/components/color-picker/color-picker.ts index f6ec601e..eb51b9f7 100644 --- a/src/components/color-picker/color-picker.ts +++ b/src/components/color-picker/color-picker.ts @@ -1,29 +1,29 @@ -import '../button-group/button-group'; -import '../button/button'; -import '../dropdown/dropdown'; -import '../icon/icon'; -import '../input/input'; -import '../visually-hidden/visually-hidden'; -import { clamp } from '../../internal/math'; +import '../button-group/button-group.js'; +import '../button/button.js'; +import '../dropdown/dropdown.js'; +import '../icon/icon.js'; +import '../input/input.js'; +import '../visually-hidden/visually-hidden.js'; +import { clamp } from '../../internal/math.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { drag } from '../../internal/drag'; -import { FormControlController } from '../../internal/form'; +import { defaultValue } from '../../internal/default-value.js'; +import { drag } from '../../internal/drag.js'; +import { FormControlController } from '../../internal/form.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; +import { LocalizeController } from '../../utilities/localize.js'; import { styleMap } from 'lit/directives/style-map.js'; import { TinyColor } from '@ctrl/tinycolor'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './color-picker.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './color-picker.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; -import type SlChangeEvent from '../../events/sl-change'; -import type SlDropdown from '../dropdown/dropdown'; -import type SlInput from '../input/input'; -import type SlInputEvent from '../../events/sl-input'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; +import type SlChangeEvent from '../../events/sl-change.js'; +import type SlDropdown from '../dropdown/dropdown.js'; +import type SlInput from '../input/input.js'; +import type SlInputEvent from '../../events/sl-input.js'; const hasEyeDropper = 'EyeDropper' in window; diff --git a/src/components/details/details.styles.ts b/src/components/details/details.styles.ts index 2152dbc1..7c4a3a63 100644 --- a/src/components/details/details.styles.ts +++ b/src/components/details/details.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/details/details.ts b/src/components/details/details.ts index 908d0bfe..44b6c7a6 100644 --- a/src/components/details/details.ts +++ b/src/components/details/details.ts @@ -1,14 +1,14 @@ -import '../icon/icon'; -import { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate'; +import '../icon/icon.js'; +import { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './details.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './details.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/dialog/dialog.styles.ts b/src/components/dialog/dialog.styles.ts index 83b213b3..8202a892 100644 --- a/src/components/dialog/dialog.styles.ts +++ b/src/components/dialog/dialog.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/dialog/dialog.ts b/src/components/dialog/dialog.ts index 655fab2c..b483922b 100644 --- a/src/components/dialog/dialog.ts +++ b/src/components/dialog/dialog.ts @@ -1,18 +1,18 @@ -import '../icon-button/icon-button'; -import { animateTo, stopAnimations } from '../../internal/animate'; +import '../icon-button/icon-button.js'; +import { animateTo, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; -import { HasSlotController } from '../../internal/slot'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; -import { lockBodyScrolling, unlockBodyScrolling } from '../../internal/scroll'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import Modal from '../../internal/modal'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './dialog.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { lockBodyScrolling, unlockBodyScrolling } from '../../internal/scroll.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import Modal from '../../internal/modal.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './dialog.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/divider/divider.styles.ts b/src/components/divider/divider.styles.ts index f7d10246..8c750961 100644 --- a/src/components/divider/divider.styles.ts +++ b/src/components/divider/divider.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/divider/divider.test.ts b/src/components/divider/divider.test.ts index d1fee9f7..7c6c55b7 100644 --- a/src/components/divider/divider.test.ts +++ b/src/components/divider/divider.test.ts @@ -1,6 +1,6 @@ import '../../../dist/shoelace.js'; import { elementUpdated, expect, fixture, html } from '@open-wc/testing'; -import type SlDivider from './divider'; +import type SlDivider from './divider.js'; describe('', () => { describe('defaults ', () => { diff --git a/src/components/divider/divider.ts b/src/components/divider/divider.ts index e16919a2..0a7bd0a1 100644 --- a/src/components/divider/divider.ts +++ b/src/components/divider/divider.ts @@ -1,7 +1,7 @@ import { customElement, property } from 'lit/decorators.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './divider.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './divider.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/drawer/drawer.styles.ts b/src/components/drawer/drawer.styles.ts index f02527f0..99b49c24 100644 --- a/src/components/drawer/drawer.styles.ts +++ b/src/components/drawer/drawer.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/drawer/drawer.ts b/src/components/drawer/drawer.ts index 97aef662..3971a788 100644 --- a/src/components/drawer/drawer.ts +++ b/src/components/drawer/drawer.ts @@ -1,19 +1,19 @@ -import '../icon-button/icon-button'; -import { animateTo, stopAnimations } from '../../internal/animate'; +import '../icon-button/icon-button.js'; +import { animateTo, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; -import { HasSlotController } from '../../internal/slot'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; -import { lockBodyScrolling, unlockBodyScrolling } from '../../internal/scroll'; -import { uppercaseFirstLetter } from '../../internal/string'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import Modal from '../../internal/modal'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './drawer.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { lockBodyScrolling, unlockBodyScrolling } from '../../internal/scroll.js'; +import { uppercaseFirstLetter } from '../../internal/string.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import Modal from '../../internal/modal.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './drawer.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/dropdown/dropdown.styles.ts b/src/components/dropdown/dropdown.styles.ts index 32fb234a..79b74981 100644 --- a/src/components/dropdown/dropdown.styles.ts +++ b/src/components/dropdown/dropdown.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/dropdown/dropdown.test.ts b/src/components/dropdown/dropdown.test.ts index 1e9c9a26..36f4d672 100644 --- a/src/components/dropdown/dropdown.test.ts +++ b/src/components/dropdown/dropdown.test.ts @@ -1,9 +1,9 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html, waitUntil } from '@open-wc/testing'; import { sendKeys, sendMouse } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlDropdown from './dropdown'; +import type SlDropdown from './dropdown.js'; describe('', () => { it('should be visible with the open attribute', async () => { diff --git a/src/components/dropdown/dropdown.ts b/src/components/dropdown/dropdown.ts index 8c4cbe20..e292bddc 100644 --- a/src/components/dropdown/dropdown.ts +++ b/src/components/dropdown/dropdown.ts @@ -1,21 +1,21 @@ -import '../popup/popup'; -import { animateTo, stopAnimations } from '../../internal/animate'; +import '../popup/popup.js'; +import { animateTo, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; -import { getTabbableBoundary } from '../../internal/tabbable'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; +import { getTabbableBoundary } from '../../internal/tabbable.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './dropdown.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './dropdown.styles.js'; import type { CSSResultGroup } from 'lit'; -import type SlButton from '../button/button'; -import type SlIconButton from '../icon-button/icon-button'; -import type SlMenu from '../menu/menu'; -import type SlPopup from '../popup/popup'; -import type SlSelectEvent from '../../events/sl-select'; +import type SlButton from '../button/button.js'; +import type SlIconButton from '../icon-button/icon-button.js'; +import type SlMenu from '../menu/menu.js'; +import type SlPopup from '../popup/popup.js'; +import type SlSelectEvent from '../../events/sl-select.js'; /** * @summary Dropdowns expose additional content that "drops down" in a panel. diff --git a/src/components/format-bytes/format-bytes.ts b/src/components/format-bytes/format-bytes.ts index d3411fb7..6fde89c1 100644 --- a/src/components/format-bytes/format-bytes.ts +++ b/src/components/format-bytes/format-bytes.ts @@ -1,6 +1,6 @@ import { customElement, property } from 'lit/decorators.js'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; /** * @summary Formats a number as a human readable bytes value. diff --git a/src/components/format-date/format-date.ts b/src/components/format-date/format-date.ts index 459e15fa..9c86e2e3 100644 --- a/src/components/format-date/format-date.ts +++ b/src/components/format-date/format-date.ts @@ -1,7 +1,7 @@ import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; /** * @summary Formats a date/time using the specified locale and options. diff --git a/src/components/format-number/format-number.ts b/src/components/format-number/format-number.ts index b6d36294..804c94f6 100644 --- a/src/components/format-number/format-number.ts +++ b/src/components/format-number/format-number.ts @@ -1,6 +1,6 @@ import { customElement, property } from 'lit/decorators.js'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; /** * @summary Formats a number using the specified locale and options. diff --git a/src/components/icon-button/icon-button.styles.ts b/src/components/icon-button/icon-button.styles.ts index c86ff38c..fadb11d9 100644 --- a/src/components/icon-button/icon-button.styles.ts +++ b/src/components/icon-button/icon-button.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/icon-button/icon-button.ts b/src/components/icon-button/icon-button.ts index 74f86f13..69875c03 100644 --- a/src/components/icon-button/icon-button.ts +++ b/src/components/icon-button/icon-button.ts @@ -1,10 +1,10 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { html, literal } from 'lit/static-html.js'; import { ifDefined } from 'lit/directives/if-defined.js'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './icon-button.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './icon-button.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/icon/icon.styles.ts b/src/components/icon/icon.styles.ts index 813887ff..85c3a19c 100644 --- a/src/components/icon/icon.styles.ts +++ b/src/components/icon/icon.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/icon/icon.ts b/src/components/icon/icon.ts index 16da4f20..2cc1f109 100644 --- a/src/components/icon/icon.ts +++ b/src/components/icon/icon.ts @@ -1,10 +1,10 @@ import { customElement, property, state } from 'lit/decorators.js'; -import { getIconLibrary, type IconLibrary, unwatchIcon, watchIcon } from './library'; +import { getIconLibrary, type IconLibrary, unwatchIcon, watchIcon } from './library.js'; import { html } from 'lit'; import { isTemplateResult } from 'lit/directive-helpers.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './icon.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './icon.styles.js'; import type { CSSResultGroup, HTMLTemplateResult } from 'lit'; diff --git a/src/components/icon/library.default.ts b/src/components/icon/library.default.ts index f001c61a..928dc5a6 100644 --- a/src/components/icon/library.default.ts +++ b/src/components/icon/library.default.ts @@ -1,5 +1,5 @@ -import { getBasePath } from '../../utilities/base-path'; -import type { IconLibrary } from './library'; +import { getBasePath } from '../../utilities/base-path.js'; +import type { IconLibrary } from './library.js'; const library: IconLibrary = { name: 'default', diff --git a/src/components/icon/library.system.ts b/src/components/icon/library.system.ts index 850e0a2b..a0b6ab3e 100644 --- a/src/components/icon/library.system.ts +++ b/src/components/icon/library.system.ts @@ -1,4 +1,4 @@ -import type { IconLibrary } from './library'; +import type { IconLibrary } from './library.js'; // // System icons are a separate library to ensure they're always available, regardless of how the default icon library is diff --git a/src/components/icon/library.ts b/src/components/icon/library.ts index f8d00c94..202f54ac 100644 --- a/src/components/icon/library.ts +++ b/src/components/icon/library.ts @@ -1,6 +1,6 @@ -import defaultLibrary from './library.default'; -import systemLibrary from './library.system'; -import type SlIcon from '../icon/icon'; +import defaultLibrary from './library.default.js'; +import systemLibrary from './library.system.js'; +import type SlIcon from '../icon/icon.js'; export type IconLibraryResolver = (name: string) => string; export type IconLibraryMutator = (svg: SVGElement) => void; diff --git a/src/components/image-comparer/image-comparer.styles.ts b/src/components/image-comparer/image-comparer.styles.ts index e49f10a1..0571c96e 100644 --- a/src/components/image-comparer/image-comparer.styles.ts +++ b/src/components/image-comparer/image-comparer.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/image-comparer/image-comparer.ts b/src/components/image-comparer/image-comparer.ts index 8c624347..32eba95f 100644 --- a/src/components/image-comparer/image-comparer.ts +++ b/src/components/image-comparer/image-comparer.ts @@ -1,14 +1,14 @@ -import '../icon/icon'; -import { clamp } from '../../internal/math'; +import '../icon/icon.js'; +import { clamp } from '../../internal/math.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { drag } from '../../internal/drag'; +import { drag } from '../../internal/drag.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; +import { LocalizeController } from '../../utilities/localize.js'; import { styleMap } from 'lit/directives/style-map.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './image-comparer.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './image-comparer.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/include/include.styles.ts b/src/components/include/include.styles.ts index a4aafbb9..1775f7f7 100644 --- a/src/components/include/include.styles.ts +++ b/src/components/include/include.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/include/include.ts b/src/components/include/include.ts index 3936fb44..695c929f 100644 --- a/src/components/include/include.ts +++ b/src/components/include/include.ts @@ -1,9 +1,9 @@ import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { requestInclude } from './request'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './include.styles'; +import { requestInclude } from './request.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './include.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/input/input.styles.ts b/src/components/input/input.styles.ts index 4dc162cc..19fc2078 100644 --- a/src/components/input/input.styles.ts +++ b/src/components/input/input.styles.ts @@ -1,6 +1,6 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; -import formControlStyles from '../../styles/form-control.styles'; +import componentStyles from '../../styles/component.styles.js'; +import formControlStyles from '../../styles/form-control.styles.js'; export default css` ${componentStyles} diff --git a/src/components/input/input.test.ts b/src/components/input/input.test.ts index 1e5c5aa3..e0149ede 100644 --- a/src/components/input/input.test.ts +++ b/src/components/input/input.test.ts @@ -1,7 +1,7 @@ // eslint-disable @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment import { elementUpdated, expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; import { getFormControls, serialize } from '../../../dist/shoelace.js'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; // must come from the same module import sinon from 'sinon'; import type SlInput from './input'; diff --git a/src/components/input/input.ts b/src/components/input/input.ts index 5d42d549..4d80890e 100644 --- a/src/components/input/input.ts +++ b/src/components/input/input.ts @@ -1,18 +1,18 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; -import { HasSlotController } from '../../internal/slot'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { live } from 'lit/directives/live.js'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './input.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './input.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Inputs collect data from the user. diff --git a/src/components/menu-item/menu-item.styles.ts b/src/components/menu-item/menu-item.styles.ts index 9f1c312c..55c9e2ff 100644 --- a/src/components/menu-item/menu-item.styles.ts +++ b/src/components/menu-item/menu-item.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/menu-item/menu-item.test.ts b/src/components/menu-item/menu-item.test.ts index fba1dde9..34370f98 100644 --- a/src/components/menu-item/menu-item.test.ts +++ b/src/components/menu-item/menu-item.test.ts @@ -1,5 +1,5 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html, waitUntil } from '@open-wc/testing'; import sinon from 'sinon'; import type SlMenuItem from './menu-item'; diff --git a/src/components/menu-item/menu-item.ts b/src/components/menu-item/menu-item.ts index 6de8a123..ccbc8aec 100644 --- a/src/components/menu-item/menu-item.ts +++ b/src/components/menu-item/menu-item.ts @@ -1,11 +1,11 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getTextContent } from '../../internal/slot'; +import { getTextContent } from '../../internal/slot.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './menu-item.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './menu-item.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/menu-label/menu-label.styles.ts b/src/components/menu-label/menu-label.styles.ts index 3cdfafb4..cf57c077 100644 --- a/src/components/menu-label/menu-label.styles.ts +++ b/src/components/menu-label/menu-label.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/menu-label/menu-label.ts b/src/components/menu-label/menu-label.ts index e6bba734..00ab1d94 100644 --- a/src/components/menu-label/menu-label.ts +++ b/src/components/menu-label/menu-label.ts @@ -1,7 +1,7 @@ import { customElement } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './menu-label.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './menu-label.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/menu/menu.styles.ts b/src/components/menu/menu.styles.ts index 07473336..d5d0fe74 100644 --- a/src/components/menu/menu.styles.ts +++ b/src/components/menu/menu.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/menu/menu.test.ts b/src/components/menu/menu.test.ts index 5ecc3416..0588a8ca 100644 --- a/src/components/menu/menu.test.ts +++ b/src/components/menu/menu.test.ts @@ -1,5 +1,5 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture } from '@open-wc/testing'; import { html } from 'lit'; import { sendKeys } from '@web/test-runner-commands'; diff --git a/src/components/menu/menu.ts b/src/components/menu/menu.ts index f44ee3cd..8fecda05 100644 --- a/src/components/menu/menu.ts +++ b/src/components/menu/menu.ts @@ -1,9 +1,9 @@ import { customElement, query } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './menu.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './menu.styles.js'; import type { CSSResultGroup } from 'lit'; -import type SlMenuItem from '../menu-item/menu-item'; +import type SlMenuItem from '../menu-item/menu-item.js'; export interface MenuSelectEventDetail { item: SlMenuItem; } diff --git a/src/components/mutation-observer/mutation-observer.styles.ts b/src/components/mutation-observer/mutation-observer.styles.ts index cb10fcc6..674851ee 100644 --- a/src/components/mutation-observer/mutation-observer.styles.ts +++ b/src/components/mutation-observer/mutation-observer.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/mutation-observer/mutation-observer.ts b/src/components/mutation-observer/mutation-observer.ts index 8e1940bb..c0109fea 100644 --- a/src/components/mutation-observer/mutation-observer.ts +++ b/src/components/mutation-observer/mutation-observer.ts @@ -1,8 +1,8 @@ import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './mutation-observer.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './mutation-observer.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/option/option.styles.ts b/src/components/option/option.styles.ts index 6f5bb367..cc50ce3d 100644 --- a/src/components/option/option.styles.ts +++ b/src/components/option/option.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/option/option.ts b/src/components/option/option.ts index 1cfccd14..40159adf 100644 --- a/src/components/option/option.ts +++ b/src/components/option/option.ts @@ -1,11 +1,11 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './option.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './option.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/popup/popup.styles.ts b/src/components/popup/popup.styles.ts index eff1f86c..449f1576 100644 --- a/src/components/popup/popup.styles.ts +++ b/src/components/popup/popup.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/popup/popup.ts b/src/components/popup/popup.ts index 1527e7e4..f2ac9fb0 100644 --- a/src/components/popup/popup.ts +++ b/src/components/popup/popup.ts @@ -3,8 +3,8 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; import { html } from 'lit'; import { offsetParent } from 'composed-offset-position'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './popup.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './popup.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/progress-bar/progress-bar.styles.ts b/src/components/progress-bar/progress-bar.styles.ts index 9d74328a..e4522d9f 100644 --- a/src/components/progress-bar/progress-bar.styles.ts +++ b/src/components/progress-bar/progress-bar.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/progress-bar/progress-bar.ts b/src/components/progress-bar/progress-bar.ts index 18f4255d..b2867c63 100644 --- a/src/components/progress-bar/progress-bar.ts +++ b/src/components/progress-bar/progress-bar.ts @@ -2,10 +2,10 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; +import { LocalizeController } from '../../utilities/localize.js'; import { styleMap } from 'lit/directives/style-map.js'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './progress-bar.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './progress-bar.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/progress-ring/progress-ring.styles.ts b/src/components/progress-ring/progress-ring.styles.ts index 1ce08dc7..b0a0586d 100644 --- a/src/components/progress-ring/progress-ring.styles.ts +++ b/src/components/progress-ring/progress-ring.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/progress-ring/progress-ring.ts b/src/components/progress-ring/progress-ring.ts index 8ff0aff8..6740e352 100644 --- a/src/components/progress-ring/progress-ring.ts +++ b/src/components/progress-ring/progress-ring.ts @@ -1,8 +1,8 @@ import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './progress-ring.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './progress-ring.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/qr-code/qr-code.styles.ts b/src/components/qr-code/qr-code.styles.ts index ec928598..af9afa4e 100644 --- a/src/components/qr-code/qr-code.styles.ts +++ b/src/components/qr-code/qr-code.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/qr-code/qr-code.ts b/src/components/qr-code/qr-code.ts index 1a9cb6f4..11614d94 100644 --- a/src/components/qr-code/qr-code.ts +++ b/src/components/qr-code/qr-code.ts @@ -1,10 +1,10 @@ import { customElement, property, query } from 'lit/decorators.js'; import { html } from 'lit'; import { styleMap } from 'lit/directives/style-map.js'; -import { watch } from '../../internal/watch'; +import { watch } from '../../internal/watch.js'; import QrCreator from 'qr-creator'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './qr-code.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './qr-code.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/radio-button/radio-button.styles.ts b/src/components/radio-button/radio-button.styles.ts index 63ded398..5a9e4501 100644 --- a/src/components/radio-button/radio-button.styles.ts +++ b/src/components/radio-button/radio-button.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import buttonStyles from '../button/button.styles'; +import buttonStyles from '../button/button.styles.js'; export default css` ${buttonStyles} diff --git a/src/components/radio-button/radio-button.ts b/src/components/radio-button/radio-button.ts index 9ee4d896..f87256cd 100644 --- a/src/components/radio-button/radio-button.ts +++ b/src/components/radio-button/radio-button.ts @@ -1,11 +1,11 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { HasSlotController } from '../../internal/slot'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit/static-html.js'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './radio-button.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './radio-button.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/radio-group/radio-group.styles.ts b/src/components/radio-group/radio-group.styles.ts index 4b58e058..0fcc2658 100644 --- a/src/components/radio-group/radio-group.styles.ts +++ b/src/components/radio-group/radio-group.styles.ts @@ -1,6 +1,6 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; -import formControlStyles from '../../styles/form-control.styles'; +import componentStyles from '../../styles/component.styles.js'; +import formControlStyles from '../../styles/form-control.styles.js'; export default css` ${componentStyles} diff --git a/src/components/radio-group/radio-group.test.ts b/src/components/radio-group/radio-group.test.ts index e11cd502..0e4cb743 100644 --- a/src/components/radio-group/radio-group.test.ts +++ b/src/components/radio-group/radio-group.test.ts @@ -1,12 +1,12 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { clickOnElement } from '../../internal/test.js'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlChangeEvent from '../../events/sl-change'; -import type SlRadio from '../radio/radio'; -import type SlRadioGroup from './radio-group'; +import type SlChangeEvent from '../../events/sl-change.js'; +import type SlRadio from '../radio/radio.js'; +import type SlRadioGroup from './radio-group.js'; describe('', () => { describe('validation tests', () => { diff --git a/src/components/radio-group/radio-group.ts b/src/components/radio-group/radio-group.ts index 6dbe8a33..77aaa222 100644 --- a/src/components/radio-group/radio-group.ts +++ b/src/components/radio-group/radio-group.ts @@ -1,4 +1,4 @@ -import '../button-group/button-group'; +import '../button-group/button-group.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { @@ -6,16 +6,16 @@ import { FormControlController, validValidityState, valueMissingValidityState -} from '../../internal/form'; -import { HasSlotController } from '../../internal/slot'; +} from '../../internal/form.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './radio-group.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './radio-group.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; -import type SlRadio from '../radio/radio'; -import type SlRadioButton from '../radio-button/radio-button'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; +import type SlRadio from '../radio/radio.js'; +import type SlRadioButton from '../radio-button/radio-button.js'; /** * @summary Radio groups are used to group multiple [radios](/components/radio) or [radio buttons](/components/radio-button) so they function as a single form control. diff --git a/src/components/radio/radio.styles.ts b/src/components/radio/radio.styles.ts index e1ec20cb..b98f17ba 100644 --- a/src/components/radio/radio.styles.ts +++ b/src/components/radio/radio.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/radio/radio.ts b/src/components/radio/radio.ts index 15a952ea..c8bf8dc5 100644 --- a/src/components/radio/radio.ts +++ b/src/components/radio/radio.ts @@ -1,10 +1,10 @@ -import '../icon/icon'; +import '../icon/icon.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './radio.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './radio.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/range/range.styles.ts b/src/components/range/range.styles.ts index d9920c7b..7c4f3b56 100644 --- a/src/components/range/range.styles.ts +++ b/src/components/range/range.styles.ts @@ -1,6 +1,6 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; -import formControlStyles from '../../styles/form-control.styles'; +import componentStyles from '../../styles/component.styles.js'; +import formControlStyles from '../../styles/form-control.styles.js'; export default css` ${componentStyles} diff --git a/src/components/range/range.test.ts b/src/components/range/range.test.ts index 681da458..3bae7d28 100644 --- a/src/components/range/range.test.ts +++ b/src/components/range/range.test.ts @@ -1,11 +1,11 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html, oneEvent } from '@open-wc/testing'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; -import { serialize } from '../../utilities/form'; +import { serialize } from '../../utilities/form.js'; import sinon from 'sinon'; -import type SlRange from './range'; +import type SlRange from './range.js'; describe('', () => { it('should pass accessibility tests', async () => { diff --git a/src/components/range/range.ts b/src/components/range/range.ts index bb125f1e..ce25c777 100644 --- a/src/components/range/range.ts +++ b/src/components/range/range.ts @@ -1,17 +1,17 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, eventOptions, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; -import { HasSlotController } from '../../internal/slot'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { live } from 'lit/directives/live.js'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './range.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './range.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Ranges allow the user to select a single value within a given range using a slider. diff --git a/src/components/rating/rating.styles.ts b/src/components/rating/rating.styles.ts index 0caebbf0..d01360c2 100644 --- a/src/components/rating/rating.styles.ts +++ b/src/components/rating/rating.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/rating/rating.test.ts b/src/components/rating/rating.test.ts index f21bdd64..f840ccf2 100644 --- a/src/components/rating/rating.test.ts +++ b/src/components/rating/rating.test.ts @@ -1,9 +1,9 @@ import '../../../dist/shoelace.js'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { expect, fixture, html } from '@open-wc/testing'; import { sendKeys } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlRating from './rating'; +import type SlRating from './rating.js'; describe('', () => { it('should pass accessibility tests', async () => { diff --git a/src/components/rating/rating.ts b/src/components/rating/rating.ts index 2697ec53..227593bf 100644 --- a/src/components/rating/rating.ts +++ b/src/components/rating/rating.ts @@ -1,14 +1,14 @@ -import '../icon/icon'; -import { clamp } from '../../internal/math'; +import '../icon/icon.js'; +import { clamp } from '../../internal/math.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, eventOptions, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; +import { LocalizeController } from '../../utilities/localize.js'; import { styleMap } from 'lit/directives/style-map.js'; import { unsafeHTML } from 'lit/directives/unsafe-html.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './rating.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './rating.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/relative-time/relative-time.test.ts b/src/components/relative-time/relative-time.test.ts index ac02bd9e..0c264539 100644 --- a/src/components/relative-time/relative-time.test.ts +++ b/src/components/relative-time/relative-time.test.ts @@ -2,7 +2,7 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html } from '@open-wc/testing'; import { LocalizeController } from '@shoelace-style/localize'; import sinon from 'sinon'; -import type SlRelativeTime from './relative-time'; +import type SlRelativeTime from './relative-time.js'; interface SlRelativeTimeTestCase { date: Date; diff --git a/src/components/relative-time/relative-time.ts b/src/components/relative-time/relative-time.ts index 23f8b173..97b9c4ff 100644 --- a/src/components/relative-time/relative-time.ts +++ b/src/components/relative-time/relative-time.ts @@ -1,7 +1,7 @@ import { customElement, property, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; interface UnitConfig { max: number; diff --git a/src/components/resize-observer/resize-observer.styles.ts b/src/components/resize-observer/resize-observer.styles.ts index cb10fcc6..674851ee 100644 --- a/src/components/resize-observer/resize-observer.styles.ts +++ b/src/components/resize-observer/resize-observer.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/resize-observer/resize-observer.ts b/src/components/resize-observer/resize-observer.ts index 8fac95a6..4c370e40 100644 --- a/src/components/resize-observer/resize-observer.ts +++ b/src/components/resize-observer/resize-observer.ts @@ -1,8 +1,8 @@ import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './resize-observer.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './resize-observer.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/select/select.styles.ts b/src/components/select/select.styles.ts index d48dfa20..380e0f4f 100644 --- a/src/components/select/select.styles.ts +++ b/src/components/select/select.styles.ts @@ -1,6 +1,6 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; -import formControlStyles from '../../styles/form-control.styles'; +import componentStyles from '../../styles/component.styles.js'; +import formControlStyles from '../../styles/form-control.styles.js'; export default css` ${componentStyles} diff --git a/src/components/select/select.test.ts b/src/components/select/select.test.ts index 34bd527b..acd4ea35 100644 --- a/src/components/select/select.test.ts +++ b/src/components/select/select.test.ts @@ -1,12 +1,12 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { clickOnElement } from '../../internal/test.js'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; -import { serialize } from '../../utilities/form'; +import { serialize } from '../../utilities/form.js'; import sinon from 'sinon'; -import type SlOption from '../option/option'; -import type SlSelect from './select'; +import type SlOption from '../option/option.js'; +import type SlSelect from './select.js'; describe('', () => { describe('accessibility', () => { diff --git a/src/components/select/select.ts b/src/components/select/select.ts index 24749ab4..49a99106 100644 --- a/src/components/select/select.ts +++ b/src/components/select/select.ts @@ -1,25 +1,25 @@ -import '../icon/icon'; -import '../popup/popup'; -import '../tag/tag'; -import { animateTo, stopAnimations } from '../../internal/animate'; +import '../icon/icon.js'; +import '../popup/popup.js'; +import '../tag/tag.js'; +import { animateTo, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; -import { HasSlotController } from '../../internal/slot'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { scrollIntoView } from '../../internal/scroll'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './select.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { scrollIntoView } from '../../internal/scroll.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './select.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; -import type SlOption from '../option/option'; -import type SlPopup from '../popup/popup'; -import type SlRemoveEvent from '../../events/sl-remove'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; +import type SlOption from '../option/option.js'; +import type SlPopup from '../popup/popup.js'; +import type SlRemoveEvent from '../../events/sl-remove.js'; /** * @summary Selects allow you to choose items from a menu of predefined options. diff --git a/src/components/skeleton/skeleton.styles.ts b/src/components/skeleton/skeleton.styles.ts index 9098e73d..c25de469 100644 --- a/src/components/skeleton/skeleton.styles.ts +++ b/src/components/skeleton/skeleton.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/skeleton/skeleton.ts b/src/components/skeleton/skeleton.ts index ab9eec67..f99ddc4f 100644 --- a/src/components/skeleton/skeleton.ts +++ b/src/components/skeleton/skeleton.ts @@ -1,8 +1,8 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './skeleton.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './skeleton.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/spinner/spinner.styles.ts b/src/components/spinner/spinner.styles.ts index 22932b26..fd69d41a 100644 --- a/src/components/spinner/spinner.styles.ts +++ b/src/components/spinner/spinner.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/spinner/spinner.ts b/src/components/spinner/spinner.ts index f043a27b..9953ba99 100644 --- a/src/components/spinner/spinner.ts +++ b/src/components/spinner/spinner.ts @@ -1,8 +1,8 @@ import { customElement } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './spinner.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './spinner.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/split-panel/split-panel.styles.ts b/src/components/split-panel/split-panel.styles.ts index 73eda0d3..ff5ae250 100644 --- a/src/components/split-panel/split-panel.styles.ts +++ b/src/components/split-panel/split-panel.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/split-panel/split-panel.test.ts b/src/components/split-panel/split-panel.test.ts index 034c798b..82ae5114 100644 --- a/src/components/split-panel/split-panel.test.ts +++ b/src/components/split-panel/split-panel.test.ts @@ -1,9 +1,9 @@ import '../../../dist/shoelace.js'; -import { dragElement } from '../../internal/test'; +import { dragElement } from '../../internal/test.js'; import { expect, fixture, html, oneEvent } from '@open-wc/testing'; -import { queryByTestId } from '../../internal/test/data-testid-helpers'; +import { queryByTestId } from '../../internal/test/data-testid-helpers.js'; import { resetMouse } from '@web/test-runner-commands'; -import type SlSplitPanel from './split-panel'; +import type SlSplitPanel from './split-panel.js'; const DIVIDER_WIDTH_IN_PX = 4; diff --git a/src/components/split-panel/split-panel.ts b/src/components/split-panel/split-panel.ts index a44d8c92..2cb9c421 100644 --- a/src/components/split-panel/split-panel.ts +++ b/src/components/split-panel/split-panel.ts @@ -1,12 +1,12 @@ -import { clamp } from '../../internal/math'; +import { clamp } from '../../internal/math.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { drag } from '../../internal/drag'; +import { drag } from '../../internal/drag.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './split-panel.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './split-panel.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/switch/switch.styles.ts b/src/components/switch/switch.styles.ts index 7af5d33e..920f9dc5 100644 --- a/src/components/switch/switch.styles.ts +++ b/src/components/switch/switch.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/switch/switch.test.ts b/src/components/switch/switch.test.ts index d93860a7..7fef64f3 100644 --- a/src/components/switch/switch.test.ts +++ b/src/components/switch/switch.test.ts @@ -1,9 +1,9 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlSwitch from './switch'; +import type SlSwitch from './switch.js'; describe('', () => { it('should pass accessibility tests', async () => { diff --git a/src/components/switch/switch.ts b/src/components/switch/switch.ts index 06ddfafe..3b0177ed 100644 --- a/src/components/switch/switch.ts +++ b/src/components/switch/switch.ts @@ -1,15 +1,15 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { live } from 'lit/directives/live.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './switch.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './switch.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Switches allow the user to toggle an option on or off. diff --git a/src/components/tab-group/tab-group.styles.ts b/src/components/tab-group/tab-group.styles.ts index 38e510a2..94825ba6 100644 --- a/src/components/tab-group/tab-group.styles.ts +++ b/src/components/tab-group/tab-group.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tab-group/tab-group.test.ts b/src/components/tab-group/tab-group.test.ts index 6e703051..4a353a55 100644 --- a/src/components/tab-group/tab-group.test.ts +++ b/src/components/tab-group/tab-group.test.ts @@ -1,16 +1,16 @@ import '../../../dist/shoelace.js'; import { aTimeout, elementUpdated, expect, fixture, oneEvent, waitUntil } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { html } from 'lit'; -import { isElementVisibleFromOverflow } from '../../internal/test/element-visible-overflow'; -import { queryByTestId } from '../../internal/test/data-testid-helpers'; +import { isElementVisibleFromOverflow } from '../../internal/test/element-visible-overflow.js'; +import { queryByTestId } from '../../internal/test/data-testid-helpers.js'; import { sendKeys } from '@web/test-runner-commands'; -import { waitForScrollingToEnd } from '../../internal/test/wait-for-scrolling'; +import { waitForScrollingToEnd } from '../../internal/test/wait-for-scrolling.js'; import type { HTMLTemplateResult } from 'lit'; -import type SlTab from '../tab/tab'; -import type SlTabGroup from './tab-group'; -import type SlTabPanel from '../tab-panel/tab-panel'; -import type SlTabShowEvent from '../../events/sl-tab-show'; +import type SlTab from '../tab/tab.js'; +import type SlTabGroup from './tab-group.js'; +import type SlTabPanel from '../tab-panel/tab-panel.js'; +import type SlTabShowEvent from '../../events/sl-tab-show.js'; interface ClientRectangles { body?: DOMRect; diff --git a/src/components/tab-group/tab-group.ts b/src/components/tab-group/tab-group.ts index 6c9ae6a3..074257f5 100644 --- a/src/components/tab-group/tab-group.ts +++ b/src/components/tab-group/tab-group.ts @@ -1,15 +1,15 @@ -import '../icon-button/icon-button'; +import '../icon-button/icon-button.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { scrollIntoView } from '../../internal/scroll'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tab-group.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { scrollIntoView } from '../../internal/scroll.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tab-group.styles.js'; import type { CSSResultGroup } from 'lit'; -import type SlTab from '../tab/tab'; -import type SlTabPanel from '../tab-panel/tab-panel'; +import type SlTab from '../tab/tab.js'; +import type SlTabPanel from '../tab-panel/tab-panel.js'; /** * @summary Tab groups organize content into a container that shows one section at a time. diff --git a/src/components/tab-panel/tab-panel.styles.ts b/src/components/tab-panel/tab-panel.styles.ts index 7302ffd7..dfec6b30 100644 --- a/src/components/tab-panel/tab-panel.styles.ts +++ b/src/components/tab-panel/tab-panel.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tab-panel/tab-panel.ts b/src/components/tab-panel/tab-panel.ts index 5c59f277..a2065b01 100644 --- a/src/components/tab-panel/tab-panel.ts +++ b/src/components/tab-panel/tab-panel.ts @@ -1,9 +1,9 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tab-panel.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tab-panel.styles.js'; import type { CSSResultGroup } from 'lit'; let id = 0; diff --git a/src/components/tab/tab.styles.ts b/src/components/tab/tab.styles.ts index c43ea8d0..acbe36fb 100644 --- a/src/components/tab/tab.styles.ts +++ b/src/components/tab/tab.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tab/tab.ts b/src/components/tab/tab.ts index 9db04c54..efca85f2 100644 --- a/src/components/tab/tab.ts +++ b/src/components/tab/tab.ts @@ -1,11 +1,11 @@ -import '../icon-button/icon-button'; +import '../icon-button/icon-button.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tab.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tab.styles.js'; import type { CSSResultGroup } from 'lit'; let id = 0; diff --git a/src/components/tag/tag.styles.ts b/src/components/tag/tag.styles.ts index 0b55c1ff..07fd25d9 100644 --- a/src/components/tag/tag.styles.ts +++ b/src/components/tag/tag.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tag/tag.ts b/src/components/tag/tag.ts index 7cb3f0b2..ccee7fb3 100644 --- a/src/components/tag/tag.ts +++ b/src/components/tag/tag.ts @@ -1,10 +1,10 @@ -import '../icon-button/icon-button'; +import '../icon-button/icon-button.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tag.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tag.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/components/textarea/textarea.styles.ts b/src/components/textarea/textarea.styles.ts index a1e8dded..ac18266a 100644 --- a/src/components/textarea/textarea.styles.ts +++ b/src/components/textarea/textarea.styles.ts @@ -1,6 +1,6 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; -import formControlStyles from '../../styles/form-control.styles'; +import componentStyles from '../../styles/component.styles.js'; +import formControlStyles from '../../styles/form-control.styles.js'; export default css` ${componentStyles} diff --git a/src/components/textarea/textarea.test.ts b/src/components/textarea/textarea.test.ts index 228e93f8..5f79a4cf 100644 --- a/src/components/textarea/textarea.test.ts +++ b/src/components/textarea/textarea.test.ts @@ -1,10 +1,10 @@ import '../../../dist/shoelace.js'; import { expect, fixture, html, oneEvent, waitUntil } from '@open-wc/testing'; -import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests'; +import { runFormControlBaseTests } from '../../internal/test/form-control-base-tests.js'; import { sendKeys } from '@web/test-runner-commands'; -import { serialize } from '../../utilities/form'; +import { serialize } from '../../utilities/form.js'; import sinon from 'sinon'; -import type SlTextarea from './textarea'; +import type SlTextarea from './textarea.js'; describe('', () => { it('should pass accessibility tests', async () => { diff --git a/src/components/textarea/textarea.ts b/src/components/textarea/textarea.ts index 20ed4e8a..5f5f1fae 100644 --- a/src/components/textarea/textarea.ts +++ b/src/components/textarea/textarea.ts @@ -1,16 +1,16 @@ import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { defaultValue } from '../../internal/default-value'; -import { FormControlController } from '../../internal/form'; -import { HasSlotController } from '../../internal/slot'; +import { defaultValue } from '../../internal/default-value.js'; +import { FormControlController } from '../../internal/form.js'; +import { HasSlotController } from '../../internal/slot.js'; import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { live } from 'lit/directives/live.js'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './textarea.styles'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './textarea.styles.js'; import type { CSSResultGroup } from 'lit'; -import type { ShoelaceFormControl } from '../../internal/shoelace-element'; +import type { ShoelaceFormControl } from '../../internal/shoelace-element.js'; /** * @summary Textareas collect data from the user and allow multiple lines of text. diff --git a/src/components/tooltip/tooltip.styles.ts b/src/components/tooltip/tooltip.styles.ts index 2361486f..a88bf1f6 100644 --- a/src/components/tooltip/tooltip.styles.ts +++ b/src/components/tooltip/tooltip.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tooltip/tooltip.ts b/src/components/tooltip/tooltip.ts index b9de800b..b650a9a1 100644 --- a/src/components/tooltip/tooltip.ts +++ b/src/components/tooltip/tooltip.ts @@ -1,16 +1,16 @@ -import '../popup/popup'; -import { animateTo, parseDuration, stopAnimations } from '../../internal/animate'; +import '../popup/popup.js'; +import { animateTo, parseDuration, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { waitForEvent } from '../../internal/event'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tooltip.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { waitForEvent } from '../../internal/event.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tooltip.styles.js'; import type { CSSResultGroup } from 'lit'; -import type SlPopup from '../popup/popup'; +import type SlPopup from '../popup/popup.js'; /** * @summary Tooltips display additional information based on a specific action. diff --git a/src/components/tree-item/tree-item.styles.ts b/src/components/tree-item/tree-item.styles.ts index b9ad162a..5f8d1fab 100644 --- a/src/components/tree-item/tree-item.styles.ts +++ b/src/components/tree-item/tree-item.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tree-item/tree-item.ts b/src/components/tree-item/tree-item.ts index 3c8ca7bd..ee3dfa48 100644 --- a/src/components/tree-item/tree-item.ts +++ b/src/components/tree-item/tree-item.ts @@ -1,17 +1,17 @@ -import '../checkbox/checkbox'; -import '../icon/icon'; -import '../spinner/spinner'; -import { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate'; +import '../checkbox/checkbox.js'; +import '../icon/icon.js'; +import '../spinner/spinner.js'; +import { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate.js'; import { classMap } from 'lit/directives/class-map.js'; import { customElement, property, query, state } from 'lit/decorators.js'; -import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry'; +import { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js'; import { html } from 'lit'; import { live } from 'lit/directives/live.js'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; import { when } from 'lit/directives/when.js'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './tree-item.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './tree-item.styles.js'; import type { CSSResultGroup, PropertyValueMap } from 'lit'; /** diff --git a/src/components/tree/tree.styles.ts b/src/components/tree/tree.styles.ts index 61a40e89..0733fcbd 100644 --- a/src/components/tree/tree.styles.ts +++ b/src/components/tree/tree.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/tree/tree.test.ts b/src/components/tree/tree.test.ts index 9b0075e4..e654df36 100644 --- a/src/components/tree/tree.test.ts +++ b/src/components/tree/tree.test.ts @@ -1,10 +1,10 @@ import '../../../dist/shoelace.js'; import { aTimeout, expect, fixture, html, triggerBlurFor, triggerFocusFor } from '@open-wc/testing'; -import { clickOnElement } from '../../internal/test'; +import { clickOnElement } from '../../internal/test.js'; import { sendKeys } from '@web/test-runner-commands'; import sinon from 'sinon'; -import type SlTree from './tree'; -import type SlTreeItem from '../tree-item/tree-item'; +import type SlTree from './tree.js'; +import type SlTreeItem from '../tree-item/tree-item.js'; describe('', () => { let el: SlTree; diff --git a/src/components/tree/tree.ts b/src/components/tree/tree.ts index 365d27db..3c615611 100644 --- a/src/components/tree/tree.ts +++ b/src/components/tree/tree.ts @@ -1,11 +1,11 @@ -import { clamp } from '../../internal/math'; +import { clamp } from '../../internal/math.js'; import { customElement, property, query } from 'lit/decorators.js'; import { html } from 'lit'; -import { LocalizeController } from '../../utilities/localize'; -import { watch } from '../../internal/watch'; -import ShoelaceElement from '../../internal/shoelace-element'; -import SlTreeItem from '../tree-item/tree-item'; -import styles from './tree.styles'; +import { LocalizeController } from '../../utilities/localize.js'; +import { watch } from '../../internal/watch.js'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import SlTreeItem from '../tree-item/tree-item.js'; +import styles from './tree.styles.js'; import type { CSSResultGroup } from 'lit'; function syncCheckboxes(changedTreeItem: SlTreeItem, initialSync = false) { diff --git a/src/components/visually-hidden/visually-hidden.styles.ts b/src/components/visually-hidden/visually-hidden.styles.ts index fda6bce7..1f72aab5 100644 --- a/src/components/visually-hidden/visually-hidden.styles.ts +++ b/src/components/visually-hidden/visually-hidden.styles.ts @@ -1,5 +1,5 @@ import { css } from 'lit'; -import componentStyles from '../../styles/component.styles'; +import componentStyles from '../../styles/component.styles.js'; export default css` ${componentStyles} diff --git a/src/components/visually-hidden/visually-hidden.ts b/src/components/visually-hidden/visually-hidden.ts index b292d546..265e9efc 100644 --- a/src/components/visually-hidden/visually-hidden.ts +++ b/src/components/visually-hidden/visually-hidden.ts @@ -1,7 +1,7 @@ import { customElement } from 'lit/decorators.js'; import { html } from 'lit'; -import ShoelaceElement from '../../internal/shoelace-element'; -import styles from './visually-hidden.styles'; +import ShoelaceElement from '../../internal/shoelace-element.js'; +import styles from './visually-hidden.styles.js'; import type { CSSResultGroup } from 'lit'; /** diff --git a/src/internal/form.ts b/src/internal/form.ts index 79c76b9a..be04a4ba 100644 --- a/src/internal/form.ts +++ b/src/internal/form.ts @@ -1,6 +1,6 @@ import type { ReactiveController, ReactiveControllerHost } from 'lit'; -import type { ShoelaceFormControl } from '../internal/shoelace-element'; -import type SlButton from '../components/button/button'; +import type { ShoelaceFormControl } from '../internal/shoelace-element.js'; +import type SlButton from '../components/button/button.js'; // // We store a WeakMap of forms + controls so we can keep references to all Shoelace controls within a given form. As diff --git a/src/internal/modal.ts b/src/internal/modal.ts index c0037353..fc8715b9 100644 --- a/src/internal/modal.ts +++ b/src/internal/modal.ts @@ -1,4 +1,4 @@ -import { getTabbableBoundary } from './tabbable'; +import { getTabbableBoundary } from './tabbable.js'; let activeModals: HTMLElement[] = []; diff --git a/src/internal/scroll.ts b/src/internal/scroll.ts index 9a1e299c..81460e2e 100644 --- a/src/internal/scroll.ts +++ b/src/internal/scroll.ts @@ -1,4 +1,4 @@ -import { getOffset } from './offset'; +import { getOffset } from './offset.js'; const locks = new Set(); diff --git a/src/internal/test/form-control-base-tests.ts b/src/internal/test/form-control-base-tests.ts index 821e25a5..b503974c 100644 --- a/src/internal/test/form-control-base-tests.ts +++ b/src/internal/test/form-control-base-tests.ts @@ -1,5 +1,5 @@ import { expect, fixture } from '@open-wc/testing'; -import type { ShoelaceFormControl } from '../shoelace-element'; +import type { ShoelaceFormControl } from '../shoelace-element.js'; type CreateControlFn = () => Promise; diff --git a/src/shoelace-autoloader.ts b/src/shoelace-autoloader.ts index d5f3ca11..4e04fe11 100644 --- a/src/shoelace-autoloader.ts +++ b/src/shoelace-autoloader.ts @@ -1,4 +1,4 @@ -import { getBasePath } from './utilities/base-path'; +import { getBasePath } from './utilities/base-path.js'; const observer = new MutationObserver(mutations => { for (const { addedNodes } of mutations) { diff --git a/src/shoelace.ts b/src/shoelace.ts index 1131157a..1fff365f 100644 --- a/src/shoelace.ts +++ b/src/shoelace.ts @@ -1,68 +1,68 @@ // Components -export { default as SlAlert } from './components/alert/alert'; -export { default as SlAnimatedImage } from './components/animated-image/animated-image'; -export { default as SlAnimation } from './components/animation/animation'; -export { default as SlAvatar } from './components/avatar/avatar'; -export { default as SlBadge } from './components/badge/badge'; -export { default as SlBreadcrumb } from './components/breadcrumb/breadcrumb'; -export { default as SlBreadcrumbItem } from './components/breadcrumb-item/breadcrumb-item'; -export { default as SlButton } from './components/button/button'; -export { default as SlButtonGroup } from './components/button-group/button-group'; -export { default as SlCard } from './components/card/card'; -export { default as SlCarousel } from './components/carousel/carousel'; -export { default as SlCarouselItem } from './components/carousel-item/carousel-item'; -export { default as SlCheckbox } from './components/checkbox/checkbox'; -export { default as SlColorPicker } from './components/color-picker/color-picker'; -export { default as SlDetails } from './components/details/details'; -export { default as SlDialog } from './components/dialog/dialog'; -export { default as SlDivider } from './components/divider/divider'; -export { default as SlDrawer } from './components/drawer/drawer'; -export { default as SlDropdown } from './components/dropdown/dropdown'; -export { default as SlFormatBytes } from './components/format-bytes/format-bytes'; -export { default as SlFormatDate } from './components/format-date/format-date'; -export { default as SlFormatNumber } from './components/format-number/format-number'; -export { default as SlIcon } from './components/icon/icon'; -export { default as SlIconButton } from './components/icon-button/icon-button'; -export { default as SlImageComparer } from './components/image-comparer/image-comparer'; -export { default as SlInclude } from './components/include/include'; -export { default as SlInput } from './components/input/input'; -export { default as SlMenu } from './components/menu/menu'; -export { default as SlMenuItem } from './components/menu-item/menu-item'; -export { default as SlMenuLabel } from './components/menu-label/menu-label'; -export { default as SlMutationObserver } from './components/mutation-observer/mutation-observer'; -export { default as SlOption } from './components/option/option'; -export { default as SlPopup } from './components/popup/popup'; -export { default as SlProgressBar } from './components/progress-bar/progress-bar'; -export { default as SlProgressRing } from './components/progress-ring/progress-ring'; -export { default as SlQrCode } from './components/qr-code/qr-code'; -export { default as SlRadio } from './components/radio/radio'; -export { default as SlRadioButton } from './components/radio-button/radio-button'; -export { default as SlRadioGroup } from './components/radio-group/radio-group'; -export { default as SlRange } from './components/range/range'; -export { default as SlRating } from './components/rating/rating'; -export { default as SlRelativeTime } from './components/relative-time/relative-time'; -export { default as SlResizeObserver } from './components/resize-observer/resize-observer'; -export { default as SlSelect } from './components/select/select'; -export { default as SlSkeleton } from './components/skeleton/skeleton'; -export { default as SlSpinner } from './components/spinner/spinner'; -export { default as SlSplitPanel } from './components/split-panel/split-panel'; -export { default as SlSwitch } from './components/switch/switch'; -export { default as SlTab } from './components/tab/tab'; -export { default as SlTabGroup } from './components/tab-group/tab-group'; -export { default as SlTabPanel } from './components/tab-panel/tab-panel'; -export { default as SlTag } from './components/tag/tag'; -export { default as SlTextarea } from './components/textarea/textarea'; -export { default as SlTooltip } from './components/tooltip/tooltip'; -export { default as SlTree } from './components/tree/tree'; -export { default as SlTreeItem } from './components/tree-item/tree-item'; -export { default as SlVisuallyHidden } from './components/visually-hidden/visually-hidden'; +export { default as SlAlert } from './components/alert/alert.js'; +export { default as SlAnimatedImage } from './components/animated-image/animated-image.js'; +export { default as SlAnimation } from './components/animation/animation.js'; +export { default as SlAvatar } from './components/avatar/avatar.js'; +export { default as SlBadge } from './components/badge/badge.js'; +export { default as SlBreadcrumb } from './components/breadcrumb/breadcrumb.js'; +export { default as SlBreadcrumbItem } from './components/breadcrumb-item/breadcrumb-item.js'; +export { default as SlButton } from './components/button/button.js'; +export { default as SlButtonGroup } from './components/button-group/button-group.js'; +export { default as SlCard } from './components/card/card.js'; +export { default as SlCarousel } from './components/carousel/carousel.js'; +export { default as SlCarouselItem } from './components/carousel-item/carousel-item.js'; +export { default as SlCheckbox } from './components/checkbox/checkbox.js'; +export { default as SlColorPicker } from './components/color-picker/color-picker.js'; +export { default as SlDetails } from './components/details/details.js'; +export { default as SlDialog } from './components/dialog/dialog.js'; +export { default as SlDivider } from './components/divider/divider.js'; +export { default as SlDrawer } from './components/drawer/drawer.js'; +export { default as SlDropdown } from './components/dropdown/dropdown.js'; +export { default as SlFormatBytes } from './components/format-bytes/format-bytes.js'; +export { default as SlFormatDate } from './components/format-date/format-date.js'; +export { default as SlFormatNumber } from './components/format-number/format-number.js'; +export { default as SlIcon } from './components/icon/icon.js'; +export { default as SlIconButton } from './components/icon-button/icon-button.js'; +export { default as SlImageComparer } from './components/image-comparer/image-comparer.js'; +export { default as SlInclude } from './components/include/include.js'; +export { default as SlInput } from './components/input/input.js'; +export { default as SlMenu } from './components/menu/menu.js'; +export { default as SlMenuItem } from './components/menu-item/menu-item.js'; +export { default as SlMenuLabel } from './components/menu-label/menu-label.js'; +export { default as SlMutationObserver } from './components/mutation-observer/mutation-observer.js'; +export { default as SlOption } from './components/option/option.js'; +export { default as SlPopup } from './components/popup/popup.js'; +export { default as SlProgressBar } from './components/progress-bar/progress-bar.js'; +export { default as SlProgressRing } from './components/progress-ring/progress-ring.js'; +export { default as SlQrCode } from './components/qr-code/qr-code.js'; +export { default as SlRadio } from './components/radio/radio.js'; +export { default as SlRadioButton } from './components/radio-button/radio-button.js'; +export { default as SlRadioGroup } from './components/radio-group/radio-group.js'; +export { default as SlRange } from './components/range/range.js'; +export { default as SlRating } from './components/rating/rating.js'; +export { default as SlRelativeTime } from './components/relative-time/relative-time.js'; +export { default as SlResizeObserver } from './components/resize-observer/resize-observer.js'; +export { default as SlSelect } from './components/select/select.js'; +export { default as SlSkeleton } from './components/skeleton/skeleton.js'; +export { default as SlSpinner } from './components/spinner/spinner.js'; +export { default as SlSplitPanel } from './components/split-panel/split-panel.js'; +export { default as SlSwitch } from './components/switch/switch.js'; +export { default as SlTab } from './components/tab/tab.js'; +export { default as SlTabGroup } from './components/tab-group/tab-group.js'; +export { default as SlTabPanel } from './components/tab-panel/tab-panel.js'; +export { default as SlTag } from './components/tag/tag.js'; +export { default as SlTextarea } from './components/textarea/textarea.js'; +export { default as SlTooltip } from './components/tooltip/tooltip.js'; +export { default as SlTree } from './components/tree/tree.js'; +export { default as SlTreeItem } from './components/tree-item/tree-item.js'; +export { default as SlVisuallyHidden } from './components/visually-hidden/visually-hidden.js'; /* plop:component */ // Utilities -export * from './utilities/animation'; -export * from './utilities/base-path'; -export * from './utilities/icon-library'; -export * from './utilities/form'; +export * from './utilities/animation.js'; +export * from './utilities/base-path.js'; +export * from './utilities/icon-library.js'; +export * from './utilities/form.js'; // Events -export * from './events/events'; +export * from './events/events.js'; diff --git a/src/translations/da.ts b/src/translations/da.ts index bd7c4f63..e0d459c8 100644 --- a/src/translations/da.ts +++ b/src/translations/da.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'da', diff --git a/src/translations/de-ch.ts b/src/translations/de-ch.ts index 59f5e74d..8990b7a7 100644 --- a/src/translations/de-ch.ts +++ b/src/translations/de-ch.ts @@ -1,6 +1,6 @@ -import { registerTranslation } from '../utilities/localize'; -import baseTranslation from './de'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import baseTranslation from './de.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { ...baseTranslation, diff --git a/src/translations/de.ts b/src/translations/de.ts index 726fcdb4..4c1df4fb 100644 --- a/src/translations/de.ts +++ b/src/translations/de.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'de', diff --git a/src/translations/en-gb.ts b/src/translations/en-gb.ts index fd6bd15a..196984e4 100644 --- a/src/translations/en-gb.ts +++ b/src/translations/en-gb.ts @@ -1,6 +1,6 @@ -import { registerTranslation } from '../utilities/localize'; -import baseTranslation from './en'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import baseTranslation from './en.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { ...baseTranslation, diff --git a/src/translations/en.ts b/src/translations/en.ts index d242bca5..86a5e015 100644 --- a/src/translations/en.ts +++ b/src/translations/en.ts @@ -1,5 +1,5 @@ import { registerTranslation } from '@shoelace-style/localize'; -import type { Translation } from '../utilities/localize'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'en', diff --git a/src/translations/es.ts b/src/translations/es.ts index 6e846174..d15fdff7 100644 --- a/src/translations/es.ts +++ b/src/translations/es.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'es', diff --git a/src/translations/fa.ts b/src/translations/fa.ts index 88385451..2f39bde1 100644 --- a/src/translations/fa.ts +++ b/src/translations/fa.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'fa', diff --git a/src/translations/fr.ts b/src/translations/fr.ts index 9e443bd2..a760fe84 100644 --- a/src/translations/fr.ts +++ b/src/translations/fr.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'fr', diff --git a/src/translations/he.ts b/src/translations/he.ts index e0dd1588..59187804 100644 --- a/src/translations/he.ts +++ b/src/translations/he.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'he', diff --git a/src/translations/hu.ts b/src/translations/hu.ts index ba77b8e1..7ff13be2 100644 --- a/src/translations/hu.ts +++ b/src/translations/hu.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'hu', diff --git a/src/translations/ja.ts b/src/translations/ja.ts index 9e7d06b9..47217e80 100644 --- a/src/translations/ja.ts +++ b/src/translations/ja.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'ja', diff --git a/src/translations/nl.ts b/src/translations/nl.ts index 6ec9048b..a4c859b8 100644 --- a/src/translations/nl.ts +++ b/src/translations/nl.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'nl', diff --git a/src/translations/pl.ts b/src/translations/pl.ts index 8b1a76b7..5630a4e0 100644 --- a/src/translations/pl.ts +++ b/src/translations/pl.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'pl', diff --git a/src/translations/pt.ts b/src/translations/pt.ts index 4ff1d9d4..b433c6a3 100644 --- a/src/translations/pt.ts +++ b/src/translations/pt.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'pt', diff --git a/src/translations/ru.ts b/src/translations/ru.ts index b12086ca..ee9f1472 100644 --- a/src/translations/ru.ts +++ b/src/translations/ru.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'ru', diff --git a/src/translations/sv.ts b/src/translations/sv.ts index f892310e..9c1015c8 100644 --- a/src/translations/sv.ts +++ b/src/translations/sv.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'sv', diff --git a/src/translations/tr.ts b/src/translations/tr.ts index 533ae1bb..1d983a92 100644 --- a/src/translations/tr.ts +++ b/src/translations/tr.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'tr', diff --git a/src/translations/zh-tw.ts b/src/translations/zh-tw.ts index 71cdc6ef..425c182a 100644 --- a/src/translations/zh-tw.ts +++ b/src/translations/zh-tw.ts @@ -1,5 +1,5 @@ -import { registerTranslation } from '../utilities/localize'; -import type { Translation } from '../utilities/localize'; +import { registerTranslation } from '../utilities/localize.js'; +import type { Translation } from '../utilities/localize.js'; const translation: Translation = { $code: 'zh-tw', diff --git a/src/utilities/animation.ts b/src/utilities/animation.ts index 81e27c18..ea1d0f2e 100644 --- a/src/utilities/animation.ts +++ b/src/utilities/animation.ts @@ -1 +1 @@ -export { getAnimationNames, getEasingNames } from '../components/animation/animations'; +export { getAnimationNames, getEasingNames } from '../components/animation/animations.js'; diff --git a/src/utilities/form.ts b/src/utilities/form.ts index b2d79866..14fafe55 100644 --- a/src/utilities/form.ts +++ b/src/utilities/form.ts @@ -1,4 +1,4 @@ -import { formCollections } from '../internal/form'; +import { formCollections } from '../internal/form.js'; /** * Serializes a form and returns a plain object. If a form control with the same name appears more than once, the diff --git a/src/utilities/icon-library.ts b/src/utilities/icon-library.ts index 1293a560..ee1f8437 100644 --- a/src/utilities/icon-library.ts +++ b/src/utilities/icon-library.ts @@ -1 +1 @@ -export { registerIconLibrary, unregisterIconLibrary } from '../components/icon/library'; +export { registerIconLibrary, unregisterIconLibrary } from '../components/icon/library.js';