Update

server/dmodule.ts

@@ -1,11 +1,25 @@
 import { signal } from "@preact/signals";
-import type _MdOutlinedTextField from "./md3/md-outlined-text-field.ts";
+import type {
+    MdOutlinedButton as _MdOutlinedButton,
+    MdOutlinedTextField as _MdOutlinedTextField,
+    MdTonalButton as _MdTonalButton,
+} from "./md3.ts";
 
 export const MdOutlinedTextField = signal<
     typeof _MdOutlinedTextField | undefined
 >(undefined);
 
+export const MdOutlinedButton = signal<typeof _MdOutlinedButton | undefined>(
+    undefined,
+);
+
+export const MdTonalButton = signal<typeof _MdTonalButton | undefined>(
+    undefined,
+);
+
 export async function load_dmodule() {
-    MdOutlinedTextField.value =
-        (await import("./md3/md-outlined-text-field.ts")).default;
+    const md3 = await import("./md3.ts");
+    MdOutlinedTextField.value = md3.MdOutlinedTextField;
+    MdOutlinedButton.value = md3.MdOutlinedButton;
+    MdTonalButton.value = md3.MdTonalButton;
 }

server/md3.ts

@@ -0,0 +1,30 @@
+import { MdOutlinedTextField as _MdOutlinedTextField } from "@material/web/textfield/outlined-text-field.js?dts=1";
+import { MdOutlinedButton as _MdOutlinedButton } from "@material/web/button/outlined-button.js?dts=1";
+import { MdTonalButton as _MdTonalButton } from "@material/web/button/tonal-button.js?dts=1";
+import { createComponent } from "@lit-labs/react/?target=es2022";
+import * as Preact from "preact/compat";
+
+export const MdOutlinedTextField = createComponent({
+    tagName: "md-outlined-text-field",
+    elementClass: _MdOutlinedTextField,
+    // @ts-ignore Checked
+    react: Preact,
+});
+
+export const MdOutlinedButton = createComponent({
+    tagName: "md-outlined-button",
+    elementClass: _MdOutlinedButton,
+    // @ts-ignore Checked
+    react: Preact,
+});
+
+export const MdTonalButton = createComponent({
+    tagName: "md-tonal-button",
+    elementClass: _MdTonalButton,
+    // @ts-ignore Checked
+    react: Preact,
+});
+
+export { _MdOutlinedTextField };
+export { _MdOutlinedButton };
+export { _MdTonalButton };

server/md3/md-outlined-text-field.ts

@@ -1,13 +0,0 @@
-import { MdOutlinedTextField as _MdOutlinedTextField } from "@material/web/textfield/outlined-text-field.js?target=es2022";
-import { createComponent } from "@lit-labs/react/?target=es2022";
-import * as Preact from "preact/compat";
-
-const MdOutlinedTextField = createComponent({
-    tagName: "md-outlined-text-field",
-    elementClass: _MdOutlinedTextField,
-    // @ts-ignore Checked
-    react: Preact,
-});
-
-export { _MdOutlinedTextField as MdOutlinedTextField };
-export default MdOutlinedTextField;