diff --git a/docs/getting-started/changelog.md b/docs/getting-started/changelog.md
index b4b1fd0c..25fc554d 100644
--- a/docs/getting-started/changelog.md
+++ b/docs/getting-started/changelog.md
@@ -6,6 +6,11 @@ Components with the <sl-badge type="warning" pill>Experimental</sl-badge> badge
 
 _During the beta period, these restrictions may be relaxed in the event of a mission-critical bug._ 🐛
 
+## 2.0.0-beta.30
+
+- Fix default exports for all components [#365](https://github.com/shoelace-style/shoelace/issues/365)
+- Revert FOUC base style because it interferes with some framework and custom element use cases
+
 ## 2.0.0-beta.29
 
 **This release migrates component implementations from Shoemaker to LitElement.** Due to feedback from the community, Shoelace will rely on a more heavily tested library for component implementations. This gives you a more solid foundation and reduces my maintenance burden. Thank you for all your comments, concerns, and encouragement! Aside from that, everything else from beta.28 still applies plus the following.
diff --git a/src/components/alert/alert.ts b/src/components/alert/alert.ts
index cb7a2ef0..167fa5ba 100644
--- a/src/components/alert/alert.ts
+++ b/src/components/alert/alert.ts
@@ -20,7 +20,7 @@ const toastStack = Object.assign(document.createElement('div'), { className: 'sl
  * @part close-button - The close button.
  */
 @tag('sl-alert')
-export class SlAlert extends LitElement {
+export default class SlAlert extends LitElement {
   static styles = unsafeCSS(styles);
 
   private autoHideTimeout: any;
diff --git a/src/components/animation/animation.ts b/src/components/animation/animation.ts
index 63795a51..79bc936a 100644
--- a/src/components/animation/animation.ts
+++ b/src/components/animation/animation.ts
@@ -10,7 +10,7 @@ import { animations } from './animations';
  * @slot - The element to animate. If multiple elements are to be animated, wrap them in a single container.
  */
 @tag('sl-animation')
-export class SlAnimation extends LitElement {
+export default class SlAnimation extends LitElement {
   static styles = unsafeCSS(styles);
 
   private animation: Animation;
diff --git a/src/components/avatar/avatar.ts b/src/components/avatar/avatar.ts
index cd9a6bf2..73ba56e8 100644
--- a/src/components/avatar/avatar.ts
+++ b/src/components/avatar/avatar.ts
@@ -17,7 +17,7 @@ import styles from 'sass:./avatar.scss';
  * @part image - The avatar image.
  */
 @tag('sl-avatar')
-export class SlAvatar extends LitElement {
+export default class SlAvatar extends LitElement {
   static styles = unsafeCSS(styles);
 
   @internalProperty() private hasError = false;
diff --git a/src/components/badge/badge.ts b/src/components/badge/badge.ts
index 350712ee..9e461ec6 100644
--- a/src/components/badge/badge.ts
+++ b/src/components/badge/badge.ts
@@ -12,7 +12,7 @@ import styles from 'sass:./badge.scss';
  * @part base - The base wrapper
  */
 @tag('sl-badge')
-export class SlBadge extends LitElement {
+export default class SlBadge extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** The badge's type. */
diff --git a/src/components/button-group/button-group.ts b/src/components/button-group/button-group.ts
index b6c46534..ea831961 100644
--- a/src/components/button-group/button-group.ts
+++ b/src/components/button-group/button-group.ts
@@ -11,7 +11,7 @@ import styles from 'sass:./button-group.scss';
  * @part base - The component's base wrapper.
  */
 @tag('sl-button-group')
-export class SlButtonGroup extends LitElement {
+export default class SlButtonGroup extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** A label to use for the button group's `aria-label` attribute. */
diff --git a/src/components/button/button.ts b/src/components/button/button.ts
index 1dfb5a70..cfb7dd29 100644
--- a/src/components/button/button.ts
+++ b/src/components/button/button.ts
@@ -22,7 +22,7 @@ import { hasSlot } from '../../internal/slot';
  * @part caret - The button's caret.
  */
 @tag('sl-button')
-export class SlButton extends LitElement {
+export default class SlButton extends LitElement {
   static styles = unsafeCSS(styles);
 
   button: HTMLButtonElement | HTMLLinkElement;
diff --git a/src/components/card/card.ts b/src/components/card/card.ts
index 6979aad1..8f26efeb 100644
--- a/src/components/card/card.ts
+++ b/src/components/card/card.ts
@@ -20,7 +20,7 @@ import { hasSlot } from '../../internal/slot';
  * @part footer - The card's footer, if present.
  */
 @tag('sl-card')
-export class SlCard extends LitElement {
+export default class SlCard extends LitElement {
   static styles = unsafeCSS(styles);
 
   @internalProperty() private hasFooter = false;
diff --git a/src/components/checkbox/checkbox.ts b/src/components/checkbox/checkbox.ts
index 19be8fe9..b555a5fc 100644
--- a/src/components/checkbox/checkbox.ts
+++ b/src/components/checkbox/checkbox.ts
@@ -18,7 +18,7 @@ let id = 0;
  * @part label - The checkbox label.
  */
 @tag('sl-checkbox')
-export class SlCheckbox extends LitElement {
+export default class SlCheckbox extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('input[type="checkbox"]') input: HTMLInputElement;
diff --git a/src/components/color-picker/color-picker.ts b/src/components/color-picker/color-picker.ts
index b4f1c5bb..f4638b6e 100644
--- a/src/components/color-picker/color-picker.ts
+++ b/src/components/color-picker/color-picker.ts
@@ -31,7 +31,7 @@ import { clamp } from '../../internal/math';
  * @part format-button - The toggle format button's base.
  */
 @tag('sl-color-picker')
-export class SlColorPicker extends LitElement {
+export default class SlColorPicker extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('[part="input"]') input: SlInput;
diff --git a/src/components/details/details.ts b/src/components/details/details.ts
index 36f91a2d..eed6ffab 100644
--- a/src/components/details/details.ts
+++ b/src/components/details/details.ts
@@ -22,7 +22,7 @@ let id = 0;
  * @part content - The details content.
  */
 @tag('sl-details')
-export class SlDetails extends LitElement {
+export default class SlDetails extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.details') details: HTMLElement;
diff --git a/src/components/dialog/dialog.ts b/src/components/dialog/dialog.ts
index b853f017..32a902e4 100644
--- a/src/components/dialog/dialog.ts
+++ b/src/components/dialog/dialog.ts
@@ -31,7 +31,7 @@ let id = 0;
  * @part footer - The dialog footer.
  */
 @tag('sl-dialog')
-export class SlDialog extends LitElement {
+export default class SlDialog extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.dialog') dialog: HTMLElement;
diff --git a/src/components/drawer/drawer.ts b/src/components/drawer/drawer.ts
index 042596bf..180c65e0 100644
--- a/src/components/drawer/drawer.ts
+++ b/src/components/drawer/drawer.ts
@@ -31,7 +31,7 @@ let id = 0;
  * @part footer - The drawer footer.
  */
 @tag('sl-drawer')
-export class SlDrawer extends LitElement {
+export default class SlDrawer extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.drawer') drawer: HTMLElement;
diff --git a/src/components/dropdown/dropdown.ts b/src/components/dropdown/dropdown.ts
index b2515f00..9a22a6b8 100644
--- a/src/components/dropdown/dropdown.ts
+++ b/src/components/dropdown/dropdown.ts
@@ -21,7 +21,7 @@ let id = 0;
  * @part panel - The panel that gets shown when the dropdown is open.
  */
 @tag('sl-dropdown')
-export class SlDropdown extends LitElement {
+export default class SlDropdown extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.dropdown__trigger') trigger: HTMLElement;
diff --git a/src/components/form/form.ts b/src/components/form/form.ts
index bba6dadc..e682d90c 100644
--- a/src/components/form/form.ts
+++ b/src/components/form/form.ts
@@ -29,7 +29,7 @@ interface FormControl {
  * @part base - The component's base wrapper.
  */
 @tag('sl-form')
-export class SlForm extends LitElement {
+export default class SlForm extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.form') form: HTMLElement;
diff --git a/src/components/format-bytes/format-bytes.ts b/src/components/format-bytes/format-bytes.ts
index 4b35bc4f..864cc76c 100644
--- a/src/components/format-bytes/format-bytes.ts
+++ b/src/components/format-bytes/format-bytes.ts
@@ -7,7 +7,7 @@ import { formatBytes } from '../../internal/number';
  * @status stable
  */
 @tag('sl-format-bytes')
-export class SlFormatBytes extends LitElement {
+export default class SlFormatBytes extends LitElement {
   /** The number to format in bytes. */
   @property({ type: Number }) value = 0;
 
diff --git a/src/components/format-date/format-date.ts b/src/components/format-date/format-date.ts
index 6cf8ccb2..4924715b 100644
--- a/src/components/format-date/format-date.ts
+++ b/src/components/format-date/format-date.ts
@@ -6,7 +6,7 @@ import { tag } from '../../internal/decorators';
  * @status stable
  */
 @tag('sl-format-date')
-export class SlFormatDate extends LitElement {
+export default class SlFormatDate extends LitElement {
   /** The date/time to format. If not set, the current date and time will be used. */
   @property() date: Date | string = new Date();
 
diff --git a/src/components/format-number/format-number.ts b/src/components/format-number/format-number.ts
index 02e85797..bbe9f321 100644
--- a/src/components/format-number/format-number.ts
+++ b/src/components/format-number/format-number.ts
@@ -6,7 +6,7 @@ import { tag } from '../../internal/decorators';
  * @status stable
  */
 @tag('sl-format-number')
-export class SlFormatNumber extends LitElement {
+export default class SlFormatNumber extends LitElement {
   /** The number to format. */
   @property({ type: Number }) value = 0;
 
diff --git a/src/components/icon-button/icon-button.ts b/src/components/icon-button/icon-button.ts
index 8e759eaf..40ebafb5 100644
--- a/src/components/icon-button/icon-button.ts
+++ b/src/components/icon-button/icon-button.ts
@@ -14,7 +14,7 @@ import { focusVisible } from '../../internal/focus-visible';
  * @part base - The component's base wrapper.
  */
 @tag('sl-icon-button')
-export class SlIconButton extends LitElement {
+export default class SlIconButton extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('button') button: HTMLButtonElement;
diff --git a/src/components/icon/icon.ts b/src/components/icon/icon.ts
index be262d36..21d438ce 100644
--- a/src/components/icon/icon.ts
+++ b/src/components/icon/icon.ts
@@ -14,7 +14,7 @@ const parser = new DOMParser();
  * @part base - The component's base wrapper.
  */
 @tag('sl-icon')
-export class SlIcon extends LitElement {
+export default class SlIcon extends LitElement {
   static styles = unsafeCSS(styles);
 
   @internalProperty() private svg = '';
diff --git a/src/components/icon/library.ts b/src/components/icon/library.ts
index 423af6b8..4edef680 100644
--- a/src/components/icon/library.ts
+++ b/src/components/icon/library.ts
@@ -1,4 +1,4 @@
-import { SlIcon } from './icon';
+import { SlIcon } from '../../shoelace';
 import { getBasePath } from '../../utilities/base-path';
 
 export type IconLibraryResolver = (name: string) => string;
diff --git a/src/components/image-comparer/image-comparer.ts b/src/components/image-comparer/image-comparer.ts
index 0589701f..998fed0e 100644
--- a/src/components/image-comparer/image-comparer.ts
+++ b/src/components/image-comparer/image-comparer.ts
@@ -21,7 +21,7 @@ import { clamp } from '../../internal/math';
  * @part handle - The handle that the user drags to expose the after image.
  */
 @tag('sl-image-comparer')
-export class SlImageComparer extends LitElement {
+export default class SlImageComparer extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.image-comparer') base: HTMLElement;
diff --git a/src/components/include/include.ts b/src/components/include/include.ts
index 1c293312..26042128 100644
--- a/src/components/include/include.ts
+++ b/src/components/include/include.ts
@@ -8,7 +8,7 @@ import { requestInclude } from './request';
  * @status stable
  */
 @tag('sl-include')
-export class SlInclude extends LitElement {
+export default class SlInclude extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** The location of the HTML file to include. */
diff --git a/src/components/input/input.ts b/src/components/input/input.ts
index 9a454f48..537a037b 100644
--- a/src/components/input/input.ts
+++ b/src/components/input/input.ts
@@ -33,7 +33,7 @@ let id = 0;
  * @part help-text - The input help text.
  */
 @tag('sl-input')
-export class SlInput extends LitElement {
+export default class SlInput extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.input__control') input: HTMLInputElement;
diff --git a/src/components/menu-divider/menu-divider.ts b/src/components/menu-divider/menu-divider.ts
index bf457cc8..bf7d5ac7 100644
--- a/src/components/menu-divider/menu-divider.ts
+++ b/src/components/menu-divider/menu-divider.ts
@@ -11,7 +11,7 @@ import styles from 'sass:./menu-divider.scss';
  * @part base - The component's base wrapper.
  */
 @tag('sl-menu-divider')
-export class SlMenuDivider extends LitElement {
+export default class SlMenuDivider extends LitElement {
   static styles = unsafeCSS(styles);
 
   render() {
diff --git a/src/components/menu-item/menu-item.ts b/src/components/menu-item/menu-item.ts
index 82d053fa..d39a6eda 100644
--- a/src/components/menu-item/menu-item.ts
+++ b/src/components/menu-item/menu-item.ts
@@ -20,7 +20,7 @@ import styles from 'sass:./menu-item.scss';
  * @part suffix - The suffix container.
  */
 @tag('sl-menu-item')
-export class SlMenuItem extends LitElement {
+export default class SlMenuItem extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.menu-item') menuItem: HTMLElement;
diff --git a/src/components/menu-label/menu-label.ts b/src/components/menu-label/menu-label.ts
index 64249ebe..dd7c7735 100644
--- a/src/components/menu-label/menu-label.ts
+++ b/src/components/menu-label/menu-label.ts
@@ -13,7 +13,7 @@ import styles from 'sass:./menu-label.scss';
  * @part base - The component's base wrapper.
  */
 @tag('sl-menu-label')
-export class SlMenuLabel extends LitElement {
+export default class SlMenuLabel extends LitElement {
   static styles = unsafeCSS(styles);
 
   render() {
diff --git a/src/components/menu/menu.ts b/src/components/menu/menu.ts
index abf8adba..b4785438 100644
--- a/src/components/menu/menu.ts
+++ b/src/components/menu/menu.ts
@@ -13,7 +13,7 @@ import { getTextContent } from '../../internal/slot';
  * @part base - The component's base wrapper.
  */
 @tag('sl-menu')
-export class SlMenu extends LitElement {
+export default class SlMenu extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.menu') menu: HTMLElement;
diff --git a/src/components/progress-bar/progress-bar.ts b/src/components/progress-bar/progress-bar.ts
index ecae564a..ab25c3a0 100644
--- a/src/components/progress-bar/progress-bar.ts
+++ b/src/components/progress-bar/progress-bar.ts
@@ -15,7 +15,7 @@ import styles from 'sass:./progress-bar.scss';
  * @part label - The progress bar label.
  */
 @tag('sl-progress-bar')
-export class SlProgressBar extends LitElement {
+export default class SlProgressBar extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** The progress bar's percentage, 0 to 100. */
diff --git a/src/components/progress-ring/progress-ring.ts b/src/components/progress-ring/progress-ring.ts
index f1ea13ad..485cb7db 100644
--- a/src/components/progress-ring/progress-ring.ts
+++ b/src/components/progress-ring/progress-ring.ts
@@ -12,7 +12,7 @@ import styles from 'sass:./progress-ring.scss';
  * @part label - The progress ring label.
  */
 @tag('sl-progress-ring')
-export class SlProgressRing extends LitElement {
+export default class SlProgressRing extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.progress-ring__indicator') indicator: SVGCircleElement;
diff --git a/src/components/radio/radio.ts b/src/components/radio/radio.ts
index d7557729..f3da6f17 100644
--- a/src/components/radio/radio.ts
+++ b/src/components/radio/radio.ts
@@ -17,7 +17,7 @@ let id = 0;
  * @part label - The radio label.
  */
 @tag('sl-radio')
-export class SlRadio extends LitElement {
+export default class SlRadio extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('input[type="radio"]') input: HTMLInputElement;
diff --git a/src/components/range/range.ts b/src/components/range/range.ts
index 3b6a0fb6..b1b66d37 100644
--- a/src/components/range/range.ts
+++ b/src/components/range/range.ts
@@ -20,7 +20,7 @@ let id = 0;
  * @part tooltip - The range tooltip.
  */
 @tag('sl-range')
-export class SlRange extends LitElement {
+export default class SlRange extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.range__control') input: HTMLInputElement;
diff --git a/src/components/rating/rating.ts b/src/components/rating/rating.ts
index ce8200b7..e02482cc 100644
--- a/src/components/rating/rating.ts
+++ b/src/components/rating/rating.ts
@@ -16,7 +16,7 @@ import { clamp } from '../../internal/math';
  * @part base - The component's base wrapper.
  */
 @tag('sl-rating')
-export class SlRating extends LitElement {
+export default class SlRating extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.rating') rating: HTMLElement;
diff --git a/src/components/relative-time/relative-time.ts b/src/components/relative-time/relative-time.ts
index bdf34dbb..3a33404d 100644
--- a/src/components/relative-time/relative-time.ts
+++ b/src/components/relative-time/relative-time.ts
@@ -6,7 +6,7 @@ import { tag, watch } from '../../internal/decorators';
  * @status stable
  */
 @tag('sl-relative-time')
-export class SlRelativeTime extends LitElement {
+export default class SlRelativeTime extends LitElement {
   private updateTimeout: any;
 
   @internalProperty() private isoTime = '';
diff --git a/src/components/resize-observer/resize-observer.ts b/src/components/resize-observer/resize-observer.ts
index 8acbc0cd..69418133 100644
--- a/src/components/resize-observer/resize-observer.ts
+++ b/src/components/resize-observer/resize-observer.ts
@@ -7,7 +7,7 @@ import styles from 'sass:./resize-observer.scss';
  * @status experimental
  */
 @tag('sl-resize-observer')
-export class SlResizeObserver extends LitElement {
+export default class SlResizeObserver extends LitElement {
   static styles = unsafeCSS(styles);
 
   private resizeObserver: ResizeObserver;
diff --git a/src/components/responsive-embed/responsive-embed.ts b/src/components/responsive-embed/responsive-embed.ts
index d728c1d5..e06509ff 100644
--- a/src/components/responsive-embed/responsive-embed.ts
+++ b/src/components/responsive-embed/responsive-embed.ts
@@ -9,7 +9,7 @@ import { tag, watch } from '../../internal/decorators';
  * @part base - The component's base wrapper.
  */
 @tag('sl-responsive-embed')
-export class SlResponsiveEmbed extends LitElement {
+export default class SlResponsiveEmbed extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.responsive-embed') base: HTMLElement;
diff --git a/src/components/select/select.ts b/src/components/select/select.ts
index 2f431159..ee233edc 100644
--- a/src/components/select/select.ts
+++ b/src/components/select/select.ts
@@ -34,7 +34,7 @@ let id = 0;
  * @part tags - The container in which multiselect options are rendered.
  */
 @tag('sl-select')
-export class SlSelect extends LitElement {
+export default class SlSelect extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.select') dropdown: SlDropdown;
diff --git a/src/components/skeleton/skeleton.ts b/src/components/skeleton/skeleton.ts
index 86577e2e..731c3ca5 100644
--- a/src/components/skeleton/skeleton.ts
+++ b/src/components/skeleton/skeleton.ts
@@ -11,7 +11,7 @@ import styles from 'sass:./skeleton.scss';
  * @part indicator - The skeleton's indicator which is responsible for its color and animation.
  */
 @tag('sl-skeleton')
-export class SlSkeleton extends LitElement {
+export default class SlSkeleton extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** Determines which effect the skeleton will use. */
diff --git a/src/components/spinner/spinner.ts b/src/components/spinner/spinner.ts
index 5caa8163..47e68403 100644
--- a/src/components/spinner/spinner.ts
+++ b/src/components/spinner/spinner.ts
@@ -9,7 +9,7 @@ import styles from 'sass:./spinner.scss';
  * @part base - The component's base wrapper.
  */
 @tag('sl-spinner')
-export class SlSpinner extends LitElement {
+export default class SlSpinner extends LitElement {
   static styles = unsafeCSS(styles);
 
   render() {
diff --git a/src/components/switch/switch.ts b/src/components/switch/switch.ts
index f3920533..99c7ffa8 100644
--- a/src/components/switch/switch.ts
+++ b/src/components/switch/switch.ts
@@ -17,7 +17,7 @@ let id = 0;
  * @part label - The switch label.
  */
 @tag('sl-switch')
-export class SlSwitch extends LitElement {
+export default class SlSwitch extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('input[type="checkbox"]') input: HTMLInputElement;
diff --git a/src/components/tab-group/tab-group.ts b/src/components/tab-group/tab-group.ts
index d8217e70..c23ab07f 100644
--- a/src/components/tab-group/tab-group.ts
+++ b/src/components/tab-group/tab-group.ts
@@ -24,7 +24,7 @@ import { focusVisible } from '../../internal/focus-visible';
  * @part scroll-button - The previous and next scroll buttons that appear when tabs are scrollable.
  */
 @tag('sl-tab-group')
-export class SlTabGroup extends LitElement {
+export default class SlTabGroup extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.tab-group') tabGroup: HTMLElement;
diff --git a/src/components/tab-panel/tab-panel.ts b/src/components/tab-panel/tab-panel.ts
index ad3c229a..5326f601 100644
--- a/src/components/tab-panel/tab-panel.ts
+++ b/src/components/tab-panel/tab-panel.ts
@@ -13,7 +13,7 @@ let id = 0;
  * @part base - The component's base wrapper.
  */
 @tag('sl-tab-panel')
-export class SlTabPanel extends LitElement {
+export default class SlTabPanel extends LitElement {
   static styles = unsafeCSS(styles);
 
   private componentId = `tab-panel-${++id}`;
diff --git a/src/components/tab/tab.ts b/src/components/tab/tab.ts
index de3054f1..4349bc95 100644
--- a/src/components/tab/tab.ts
+++ b/src/components/tab/tab.ts
@@ -17,7 +17,7 @@ let id = 0;
  * @part close-button - The close button, which is the icon button's base wrapper.
  */
 @tag('sl-tab')
-export class SlTab extends LitElement {
+export default class SlTab extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.tab') tab: HTMLElement;
diff --git a/src/components/tag/tag.ts b/src/components/tag/tag.ts
index 92993436..093ae1cb 100644
--- a/src/components/tag/tag.ts
+++ b/src/components/tag/tag.ts
@@ -16,7 +16,7 @@ import styles from 'sass:./tag.scss';
  * @part clear-button - The clear button.
  */
 @tag('sl-tag')
-export class SlTag extends LitElement {
+export default class SlTag extends LitElement {
   static styles = unsafeCSS(styles);
 
   /** The tag's type. */
diff --git a/src/components/textarea/textarea.ts b/src/components/textarea/textarea.ts
index 0048cbfb..79039daa 100644
--- a/src/components/textarea/textarea.ts
+++ b/src/components/textarea/textarea.ts
@@ -22,7 +22,7 @@ let id = 0;
  * @part help-text - The textarea help text.
  */
 @tag('sl-textarea')
-export class SlTextarea extends LitElement {
+export default class SlTextarea extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.textarea__control') input: HTMLTextAreaElement;
diff --git a/src/components/tooltip/tooltip.ts b/src/components/tooltip/tooltip.ts
index 1af040dd..284f2015 100644
--- a/src/components/tooltip/tooltip.ts
+++ b/src/components/tooltip/tooltip.ts
@@ -16,7 +16,7 @@ let id = 0;
  * @part base - The component's base wrapper.
  */
 @tag('sl-tooltip')
-export class SlTooltip extends LitElement {
+export default class SlTooltip extends LitElement {
   static styles = unsafeCSS(styles);
 
   @query('.tooltip-positioner') positioner: HTMLElement;
diff --git a/src/shoelace.ts b/src/shoelace.ts
index 2f5b845d..a3af2188 100644
--- a/src/shoelace.ts
+++ b/src/shoelace.ts
@@ -1,46 +1,46 @@
 export * from './utilities';
 
-export { SlAlert } from './components/alert/alert';
-export { SlAnimation } from './components/animation/animation';
-export { SlAvatar } from './components/avatar/avatar';
-export { SlBadge } from './components/badge/badge';
-export { SlButton } from './components/button/button';
-export { SlButtonGroup } from './components/button-group/button-group';
-export { SlCard } from './components/card/card';
-export { SlCheckbox } from './components/checkbox/checkbox';
-export { SlColorPicker } from './components/color-picker/color-picker';
-export { SlDetails } from './components/details/details';
-export { SlDialog } from './components/dialog/dialog';
-export { SlDrawer } from './components/drawer/drawer';
-export { SlDropdown } from './components/dropdown/dropdown';
-export { SlForm } from './components/form/form';
-export { SlFormatBytes } from './components/format-bytes/format-bytes';
-export { SlFormatDate } from './components/format-date/format-date';
-export { SlFormatNumber } from './components/format-number/format-number';
-export { SlIcon } from './components/icon/icon';
-export { SlIconButton } from './components/icon-button/icon-button';
-export { SlImageComparer } from './components/image-comparer/image-comparer';
-export { SlInclude } from './components/include/include';
-export { SlInput } from './components/input/input';
-export { SlMenu } from './components/menu/menu';
-export { SlMenuDivider } from './components/menu-divider/menu-divider';
-export { SlMenuItem } from './components/menu-item/menu-item';
-export { SlMenuLabel } from './components/menu-label/menu-label';
-export { SlProgressBar } from './components/progress-bar/progress-bar';
-export { SlProgressRing } from './components/progress-ring/progress-ring';
-export { SlRadio } from './components/radio/radio';
-export { SlRange } from './components/range/range';
-export { SlRating } from './components/rating/rating';
-export { SlRelativeTime } from './components/relative-time/relative-time';
-export { SlResizeObserver } from './components/resize-observer/resize-observer';
-export { SlResponsiveEmbed } from './components/responsive-embed/responsive-embed';
-export { SlSelect } from './components/select/select';
-export { SlSkeleton } from './components/skeleton/skeleton';
-export { SlSpinner } from './components/spinner/spinner';
-export { SlSwitch } from './components/switch/switch';
-export { SlTab } from './components/tab/tab';
-export { SlTabGroup } from './components/tab-group/tab-group';
-export { SlTabPanel } from './components/tab-panel/tab-panel';
-export { SlTag } from './components/tag/tag';
-export { SlTextarea } from './components/textarea/textarea';
-export { SlTooltip } from './components/tooltip/tooltip';
+export { default as SlAlert } from './components/alert/alert';
+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 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 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 SlDrawer } from './components/drawer/drawer';
+export { default as SlDropdown } from './components/dropdown/dropdown';
+export { default as SlForm } from './components/form/form';
+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 SlMenuDivider } from './components/menu-divider/menu-divider';
+export { default as SlMenuItem } from './components/menu-item/menu-item';
+export { default as SlMenuLabel } from './components/menu-label/menu-label';
+export { default as SlProgressBar } from './components/progress-bar/progress-bar';
+export { default as SlProgressRing } from './components/progress-ring/progress-ring';
+export { default as SlRadio } from './components/radio/radio';
+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 SlResponsiveEmbed } from './components/responsive-embed/responsive-embed';
+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 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';