library exports organization

playground/counter.tsx

@@ -1,8 +1,5 @@
 import * as React from "react"
-import { Button } from "../src.new/button.js"
+import { Button, Embed, EmbedField, EmbedTitle } from "../src.new/main"
-import { EmbedField } from "../src.new/embed/embed-field.js"
-import { EmbedTitle } from "../src.new/embed/embed-title.js"
-import { Embed } from "../src.new/embed/embed.js"
 
 export function Counter(props: { onDeactivate: () => void }) {
   const [count, setCount] = React.useState(0)

src.new/embed/embed-field.tsx

@@ -1,6 +1,6 @@
-import { MessageEmbedOptions } from "discord.js"
+import type { MessageEmbedOptions } from "discord.js"
 import React from "react"
-import { ReacordElement } from "../element.jsx"
+import { ReacordElement } from "../element.js"
 import { EmbedChildNode } from "./embed-child.js"
 
 export type EmbedFieldProps = {

src.new/embed/embed-title.tsx

@@ -1,6 +1,6 @@
-import { MessageEmbedOptions } from "discord.js"
+import type { MessageEmbedOptions } from "discord.js"
 import React from "react"
-import { ReacordElement } from "../element.jsx"
+import { ReacordElement } from "../element.js"
 import { EmbedChildNode } from "./embed-child.js"
 
 export type EmbedTitleProps = {

src.new/jsx.d.ts

@@ -1,15 +0,0 @@
-import type { ReactNode } from "react"
-import type { Node } from "./node.js"
-
-declare global {
-  namespace JSX {
-    // eslint-disable-next-line @typescript-eslint/consistent-type-definitions
-    interface IntrinsicElements {
-      "reacord-element": {
-        props: Record<string, unknown>
-        createNode: (props: Record<string, unknown>) => Node
-        children?: ReactNode
-      }
-    }
-  }
-}

src.new/main.ts

@@ -1,86 +1,5 @@
-import type {
+export * from "./button"
-  Client,
+export * from "./embed/embed"
-  CommandInteraction,
+export * from "./embed/embed-field"
-  MessageComponentInteraction,
+export * from "./embed/embed-title"
-} from "discord.js"
+export * from "./reacord"
-import type { ReactNode } from "react"
-import type { OpaqueRoot } from "react-reconciler"
-import { reconciler } from "./reconciler.js"
-import { Renderer } from "./renderer.js"
-
-export type ReacordConfig = {
-  /**
-   * A Discord.js client. Reacord will listen to interaction events
-   * and send them to active instances. */
-  client: Client
-
-  /**
-   * The max number of active instances.
-   * When this limit is exceeded, the oldest instances will be disabled.
-   */
-  maxInstances?: number
-}
-
-export class Reacord {
-  private instances: Instance[] = []
-
-  private constructor(private readonly config: ReacordConfig) {}
-
-  private get maxInstances() {
-    return this.config.maxInstances ?? 50
-  }
-
-  static create(config: ReacordConfig) {
-    const manager = new Reacord(config)
-
-    config.client.on("interactionCreate", (interaction) => {
-      if (!interaction.isMessageComponent()) return
-      for (const instance of manager.instances) {
-        if (instance.handleInteraction(interaction)) return
-      }
-    })
-
-    return manager
-  }
-
-  reply(interaction: CommandInteraction) {
-    const instance = new Instance(interaction)
-    this.instances.push(instance)
-
-    if (this.instances.length > this.maxInstances) {
-      this.deactivate(this.instances[0]!)
-    }
-
-    return {
-      render: (content: ReactNode) => instance.render(content),
-      deactivate: () => this.deactivate(instance),
-    }
-  }
-
-  private deactivate(instance: Instance) {
-    this.instances = this.instances.filter((it) => it !== instance)
-    instance.deactivate()
-  }
-}
-
-class Instance {
-  private renderer: Renderer
-  private container: OpaqueRoot
-
-  constructor(interaction: CommandInteraction) {
-    this.renderer = new Renderer(interaction)
-    this.container = reconciler.createContainer(this.renderer, 0, false, {})
-  }
-
-  render(content: ReactNode) {
-    reconciler.updateContainer(content, this.container)
-  }
-
-  deactivate() {
-    this.renderer.deactivate()
-  }
-
-  handleInteraction(interaction: MessageComponentInteraction) {
-    return this.renderer.handleInteraction(interaction)
-  }
-}

src.new/reacord.ts

@@ -0,0 +1,70 @@
+import type { Client, CommandInteraction } from "discord.js"
+import type { ReactNode } from "react"
+import { reconciler } from "./reconciler.js"
+import { Renderer } from "./renderer.js"
+
+export type ReacordConfig = {
+  /**
+   * A Discord.js client. Reacord will listen to interaction events
+   * and send them to active instances. */
+  client: Client
+
+  /**
+   * The max number of active instances.
+   * When this limit is exceeded, the oldest instances will be disabled.
+   */
+  maxInstances?: number
+}
+
+export type ReacordInstance = {
+  render: (content: ReactNode) => void
+  deactivate: () => void
+}
+
+export class Reacord {
+  private renderers: Renderer[] = []
+
+  private constructor(private readonly config: ReacordConfig) {}
+
+  private get maxInstances() {
+    return this.config.maxInstances ?? 50
+  }
+
+  static create(config: ReacordConfig) {
+    const manager = new Reacord(config)
+
+    config.client.on("interactionCreate", (interaction) => {
+      if (!interaction.isMessageComponent()) return
+      for (const renderer of manager.renderers) {
+        if (renderer.handleInteraction(interaction)) return
+      }
+    })
+
+    return manager
+  }
+
+  reply(interaction: CommandInteraction): ReacordInstance {
+    if (this.renderers.length > this.maxInstances) {
+      this.deactivate(this.renderers[0]!)
+    }
+
+    const renderer = new Renderer(interaction)
+    this.renderers.push(renderer)
+
+    const container = reconciler.createContainer(renderer, 0, false, {})
+
+    return {
+      render: (content: ReactNode) => {
+        reconciler.updateContainer(content, container)
+      },
+      deactivate: () => {
+        this.deactivate(renderer)
+      },
+    }
+  }
+
+  private deactivate(renderer: Renderer) {
+    this.renderers = this.renderers.filter((it) => it !== renderer)
+    renderer.deactivate()
+  }
+}