@raubjo/architect 0.5.1

package/src/renderers/adapters/react.tsx

@@ -0,0 +1,25 @@
+import type { ReactElement } from "react"
+import { createElement } from "react"
+import ReactDOM from "react-dom/client"
+import { ApplicationProvider } from "../../runtimes/react"
+import type { Cleanup } from "../../support/service-provider"
+import type Contract from "../contract"
+import type { RendererContext } from "../contract"
+
+type ReactRootComponent = () => ReactElement | null
+
+export default class ReactRenderer implements Contract {
+    render({ RootComponent, container, rootElementId }: RendererContext): Cleanup {
+        const mountNode = document.getElementById(rootElementId)
+        if (!mountNode) {
+            throw new Error(`Missing mount node #${rootElementId}.`)
+        }
+
+        const root = ReactDOM.createRoot(mountNode)
+        root.render(
+            createElement(ApplicationProvider, { container }, createElement(RootComponent as ReactRootComponent)),
+        )
+
+        return () => root.unmount()
+    }
+}

package/src/renderers/adapters/solid.tsx

@@ -0,0 +1,26 @@
+import { createComponent, type JSX } from "solid-js"
+import { render } from "solid-js/web"
+import { ApplicationProvider } from "../../runtimes/solid"
+import type { Cleanup } from "../../support/service-provider"
+import type Contract from "../contract"
+import type { RendererContext } from "../contract"
+
+type SolidRootComponent = () => JSX.Element
+
+export default class SolidRenderer implements Contract {
+    render({ RootComponent, container, rootElementId }: RendererContext): Cleanup {
+        const mountNode = document.getElementById(rootElementId)
+        if (!mountNode) {
+            throw new Error(`Missing mount node #${rootElementId}.`)
+        }
+
+        return render(
+            () =>
+                createComponent(ApplicationProvider, {
+                    container,
+                    children: () => (RootComponent as SolidRootComponent)(),
+                }),
+            mountNode,
+        )
+    }
+}

package/src/renderers/adapters/svelte.ts

@@ -0,0 +1,73 @@
+import { mount, unmount } from "svelte"
+import type { Cleanup } from "../../support/service-provider"
+import type Contract from "../contract"
+import type { RendererContext } from "../contract"
+
+type SvelteComponentInstance = {
+    $destroy?: () => void
+    destroy?: () => void
+}
+
+type SvelteComponentConstructor = new (options: {
+    target: Element
+    props?: Record<string, unknown>
+}) => SvelteComponentInstance
+
+type SvelteMount = (component: unknown, options: { target: Element; props?: Record<string, unknown> }) => unknown
+type SvelteUnmount = (instance: unknown) => void | Promise<void>
+
+export default class SvelteRenderer implements Contract {
+    render({ RootComponent, container, rootElementId }: RendererContext): Cleanup {
+        const mountNode = document.getElementById(rootElementId)
+        if (!mountNode) {
+            throw new Error(`Missing mount node #${rootElementId}.`)
+        }
+
+        const props = { container }
+        const modernCleanup = tryRenderModernSvelte(RootComponent, mountNode, props)
+
+        return modernCleanup ?? renderLegacySvelte(RootComponent, mountNode, props)
+    }
+}
+
+function tryRenderModernSvelte(
+    RootComponent: unknown,
+    mountNode: Element,
+    props: Record<string, unknown>,
+): Cleanup | null {
+    const svelteMount = mount as unknown as SvelteMount | undefined
+    const svelteUnmount = unmount as unknown as SvelteUnmount | undefined
+
+    if (typeof svelteMount !== "function" || typeof svelteUnmount !== "function") {
+        return null
+    }
+
+    try {
+        const instance = svelteMount(RootComponent, {
+            target: mountNode,
+            props,
+        })
+
+        return () => {
+            void svelteUnmount(instance)
+        }
+    } catch (_error) {
+        return null
+    }
+}
+
+function renderLegacySvelte(RootComponent: unknown, mountNode: Element, props: Record<string, unknown>): Cleanup {
+    const Component = RootComponent as SvelteComponentConstructor
+    const instance = new Component({ target: mountNode, props })
+
+    return () => {
+        if (typeof instance.$destroy === "function") {
+            instance.$destroy()
+            return
+        }
+
+        if (typeof instance.destroy === "function") {
+            instance.destroy()
+        }
+    }
+}

package/src/renderers/adapters/vue.ts

@@ -0,0 +1,22 @@
+import { type Component, createApp } from "vue"
+import { containerKey } from "../../runtimes/vue"
+import type { Cleanup } from "../../support/service-provider"
+import type Contract from "../contract"
+import type { RendererContext } from "../contract"
+
+type VueRootComponent = Component
+
+export default class VueRenderer implements Contract {
+    render({ RootComponent, container, rootElementId }: RendererContext): Cleanup {
+        const mountNode = document.getElementById(rootElementId)
+        if (!mountNode) {
+            throw new Error(`Missing mount node #${rootElementId}.`)
+        }
+
+        const app = createApp(RootComponent as VueRootComponent)
+        app.provide(containerKey, container)
+        app.mount(mountNode)
+
+        return () => app.unmount()
+    }
+}

package/src/renderers/contract.ts

@@ -0,0 +1,12 @@
+import type { Cleanup, ServiceProviderContext } from "../support/service-provider"
+
+export type RootComponent = unknown
+
+export type RendererContext = ServiceProviderContext & {
+    RootComponent: RootComponent
+    rootElementId: string
+}
+
+export default interface Contract {
+    render(context: RendererContext): void | Cleanup
+}

package/src/runtimes/react.tsx

@@ -0,0 +1,81 @@
+import { createContext, type ReactNode, useContext, useEffect, useMemo, useRef, useState } from "react"
+import type { ContainerContract, ContainerIdentifier } from "../container/contract"
+import type { Application } from "../foundation/application"
+
+const Context = createContext<ContainerContract | null>(null)
+
+type ApplicationProviderProps = {
+    container: ContainerContract
+    children?: ReactNode
+}
+
+export function ApplicationProvider({ container, children }: ApplicationProviderProps) {
+    return <Context.Provider value={container}>{children}</Context.Provider>
+}
+
+export type ContextProviderProps = {
+    application?: Application
+    container?: ContainerContract
+    fallback?: ReactNode
+    children?: ReactNode
+}
+
+export function ContextProvider({ application, container, fallback = null, children }: ContextProviderProps) {
+    if (!application && !container) {
+        throw new Error("ContextProvider requires either `application` or `container`.")
+    }
+
+    const externalRuntime = useMemo(() => (container ? { container, stop: () => {} } : null), [container])
+    const [runtime, setRuntime] = useState<{ container: ContainerContract; stop: () => void } | null>(externalRuntime)
+
+    const stopRef = useRef<null | (() => void)>(null)
+    const startedRef = useRef(false)
+
+    useEffect(() => {
+        if (externalRuntime) {
+            setRuntime(externalRuntime)
+            return
+        }
+
+        if (startedRef.current) {
+            return
+        }
+
+        startedRef.current = true
+
+        const running = application?.run()
+        stopRef.current = running.stop
+        setRuntime(running)
+
+        return () => {
+            stopRef.current?.()
+            stopRef.current = null
+            startedRef.current = false
+            setRuntime(null)
+        }
+    }, [application, externalRuntime])
+
+    if (!runtime) {
+        return <>{fallback}</>
+    }
+
+    return <ApplicationProvider container={runtime.container}>{children}</ApplicationProvider>
+}
+
+export function useService<T>(identifier: ContainerIdentifier<T>): T {
+    const container = useContext(Context)
+    if (!container) {
+        throw new Error("You must use `useService` inside the Application Context.")
+    }
+
+    return container.make<T>(identifier)
+}
+
+export function useContainer(): ContainerContract {
+    const container = useContext(Context)
+    if (!container) {
+        throw new Error("You must use `useContainer` inside the Application Context.")
+    }
+
+    return container
+}

package/src/runtimes/solid.tsx

@@ -0,0 +1,47 @@
+import { createComponent, createContext, type JSX, onCleanup, useContext } from "solid-js"
+import type { ContainerContract, ContainerIdentifier } from "../container/contract"
+import type { Application } from "../foundation/application"
+
+const ContainerContext = createContext<ContainerContract | null>(null)
+
+type ApplicationProviderProps = {
+    container: ContainerContract
+    children?: JSX.Element | (() => JSX.Element)
+}
+
+export function ApplicationProvider(props: ApplicationProviderProps) {
+    return createComponent(ContainerContext.Provider, {
+        value: props.container,
+        children: props.children as never,
+    })
+}
+
+export type ContextProviderProps = {
+    application?: Application
+    container?: ContainerContract
+    children?: JSX.Element | (() => JSX.Element)
+}
+
+export function ContextProvider(props: ContextProviderProps) {
+    if (props.container) {
+        return createComponent(ApplicationProvider, { container: props.container, children: props.children as never })
+    }
+
+    if (!props.application) {
+        throw new Error("ContextProvider requires either `application` or `container`.")
+    }
+
+    const runtime = props.application.run()
+    onCleanup(() => runtime.stop())
+
+    return createComponent(ApplicationProvider, { container: runtime.container, children: props.children as never })
+}
+
+export function useService<T>(identifier: ContainerIdentifier<T>): T {
+    const container = useContext(ContainerContext)
+    if (!container) {
+        throw new Error("Application container is not available in Solid context.")
+    }
+
+    return container.make<T>(identifier)
+}

package/src/runtimes/svelte.ts

@@ -0,0 +1,17 @@
+import { getContext, setContext } from "svelte"
+import type { ContainerContract, ContainerIdentifier } from "../container/contract"
+
+export const containerKey: unique symbol = Symbol("application.container")
+
+export function provideContainer(container: ContainerContract): void {
+    setContext(containerKey, container)
+}
+
+export function useService<T>(identifier: ContainerIdentifier<T>): T {
+    const container = getContext<ContainerContract | null>(containerKey) ?? null
+    if (!container) {
+        throw new Error("Application container is not available in Svelte context.")
+    }
+
+    return container.make<T>(identifier)
+}

package/src/runtimes/vue.ts

@@ -0,0 +1,34 @@
+import { defineComponent, type InjectionKey, inject, onUnmounted, provide } from "vue"
+import type { ContainerContract, ContainerIdentifier } from "../container/contract"
+import type { Application } from "../foundation/application"
+
+export const containerKey: InjectionKey<ContainerContract> = Symbol("application.container")
+
+export const ContextProvider = defineComponent({
+    name: "ArchitectContextProvider",
+    props: {
+        application: { type: Object as () => Application, required: false },
+        container: { type: Object as () => ContainerContract, required: false },
+    },
+    setup(props, { slots }) {
+        if (!props.application && !props.container) {
+            throw new Error("ContextProvider requires either `application` or `container`.")
+        }
+
+        const runtime = props.container ? { container: props.container, stop: () => {} } : props.application?.run()
+
+        provide(containerKey, runtime.container)
+        onUnmounted(() => runtime.stop())
+
+        return () => slots.default?.() ?? []
+    },
+})
+
+export function useService<T>(identifier: ContainerIdentifier<T>): T {
+    const container = inject(containerKey, null)
+    if (!container) {
+        throw new Error("Application container is not available in Vue context.")
+    }
+
+    return container.make<T>(identifier)
+}

package/src/solid.ts

@@ -0,0 +1,2 @@
+export { default as Renderer } from "./renderers/adapters/solid"
+export { ApplicationProvider, ContextProvider, useService } from "./runtimes/solid"

package/src/store/adapters/contract.ts

@@ -0,0 +1,11 @@
+export interface Adapter {
+    get(key: string): Promise<unknown>
+    get<T>(key: string): Promise<T | null>
+    set<T = unknown>(key: string, value: T): Promise<void>
+    has(key: string): Promise<boolean>
+    delete(key: string): Promise<void>
+    clear(): Promise<void>
+    keys(): Promise<string[]>
+}
+
+export type Contract = Adapter

package/src/store/adapters/indexed-db.ts

@@ -0,0 +1,187 @@
+import type { Adapter } from "./contract"
+import MemoryStoreAdapter from "./memory"
+
+type OpenFactory = Pick<IDBFactory, "open">
+
+export default class IndexedDbAdapter implements Adapter {
+    protected fallback: Adapter
+    protected name: string
+    protected factory: OpenFactory | null
+    protected dbPromise: Promise<IDBDatabase> | null
+
+    constructor(
+        options: {
+            factory?: OpenFactory | null
+            name?: string
+            fallback?: Adapter
+        } = {},
+    ) {
+        this.factory = resolveOpenFactory(options.factory)
+        this.name = resolveDatabaseName(options.name)
+        this.fallback = resolveFallbackAdapter(options.fallback)
+        this.dbPromise = null
+    }
+
+    protected req<T>(request: IDBRequest<T>): Promise<T> {
+        return new Promise<T>((resolve, reject) => {
+            request.onsuccess = () => resolve(request.result)
+            request.onerror = () => reject(request.error ?? new Error("IndexedDB request failed."))
+        })
+    }
+
+    protected openDb(): Promise<IDBDatabase> {
+        if (this.dbPromise) {
+            return this.dbPromise
+        }
+
+        if (!this.factory) {
+            return Promise.reject(new Error("IndexedDB is not available."))
+        }
+
+        this.dbPromise = new Promise<IDBDatabase>((resolve, reject) => {
+            const request = this.factory?.open(this.name, 1)
+            if (!request) {
+                reject(new Error("IndexedDB open request could not be created."))
+                return
+            }
+
+            request.onupgradeneeded = () => {
+                const db = request.result
+                if (!db.objectStoreNames.contains("kv")) {
+                    db.createObjectStore("kv")
+                }
+            }
+            request.onsuccess = () => resolve(request.result)
+            request.onerror = () => reject(request.error ?? new Error("IndexedDB database could not be opened."))
+        }).catch((error) => {
+            this.dbPromise = null
+            throw error
+        })
+
+        return this.dbPromise
+    }
+
+    protected async withStore<T>(mode: IDBTransactionMode, action: (store: IDBObjectStore) => Promise<T>): Promise<T> {
+        try {
+            const db = await this.openDb()
+            const tx = db.transaction("kv", mode)
+            const store = tx.objectStore("kv")
+            return await action(store)
+        } catch (_error) {
+            return actionFallback(this.fallback, mode, action)
+        }
+    }
+
+    async get(key: string): Promise<unknown>
+    async get<T>(key: string): Promise<T | null>
+    async get<T = unknown>(key: string): Promise<T | null> {
+        return this.withStore("readonly", async (store) => {
+            const value = await this.req<unknown>(store.get(key))
+            return value === undefined ? null : (value as T)
+        })
+    }
+
+    async set<T = unknown>(key: string, value: T): Promise<void> {
+        await this.withStore("readwrite", async (store) => {
+            await this.req(store.put(value, key))
+            return undefined
+        })
+    }
+
+    async has(key: string): Promise<boolean> {
+        return this.withStore("readonly", async (store) => {
+            const count = await this.req<number>(store.count(key))
+            return count > 0
+        })
+    }
+
+    async delete(key: string): Promise<void> {
+        await this.withStore("readwrite", async (store) => {
+            await this.req(store.delete(key))
+            return undefined
+        })
+    }
+
+    async clear(): Promise<void> {
+        await this.withStore("readwrite", async (store) => {
+            await this.req(store.clear())
+            return undefined
+        })
+    }
+
+    async keys(): Promise<string[]> {
+        return this.withStore("readonly", async (store) => {
+            const keys = await this.req<Array<IDBValidKey>>(store.getAllKeys())
+            return keys.map(String)
+        })
+    }
+}
+
+function resolveOpenFactory(factory?: OpenFactory | null): OpenFactory | null {
+    return factory ?? globalThis.indexedDB ?? null
+}
+
+function resolveDatabaseName(name?: string): string {
+    return name ?? "ioc-store"
+}
+
+function resolveFallbackAdapter(fallback?: Adapter): Adapter {
+    return fallback ?? new MemoryStoreAdapter()
+}
+
+async function actionFallback<T>(
+    fallback: Adapter,
+    mode: IDBTransactionMode,
+    action: (store: IDBObjectStore) => Promise<T>,
+): Promise<T> {
+    // Keep call sites small: map IDB actions to the same short storage contract.
+    if (mode === "readonly") {
+        const store = createReadonlyProxy(fallback)
+        return action(store as unknown as IDBObjectStore)
+    }
+
+    const store = createReadWriteProxy(fallback)
+    return action(store as unknown as IDBObjectStore)
+}
+
+function createReadonlyProxy(fallback: Adapter): Partial<IDBObjectStore> {
+    return {
+        get: (key: IDBValidKey) => wrapPromiseRequest(fallback.get(String(key))),
+        count: (key?: IDBValidKey | IDBKeyRange) =>
+            wrapPromiseRequest(fallback.has(String(key as IDBValidKey)).then((exists) => (exists ? 1 : 0))),
+        getAllKeys: () => wrapPromiseRequest(fallback.keys().then((keys) => keys as Array<IDBValidKey>)),
+    }
+}
+
+function createReadWriteProxy(fallback: Adapter): Partial<IDBObjectStore> {
+    return {
+        ...createReadonlyProxy(fallback),
+        put: (value: unknown, key?: IDBValidKey) =>
+            wrapPromiseRequest(fallback.set(String(key as IDBValidKey), value)) as unknown as IDBRequest<IDBValidKey>,
+        delete: (key: IDBValidKey | IDBKeyRange) =>
+            wrapPromiseRequest(fallback.delete(String(key as IDBValidKey))) as unknown as IDBRequest<undefined>,
+        clear: () => wrapPromiseRequest(fallback.clear()) as unknown as IDBRequest<undefined>,
+    }
+}
+
+function wrapPromiseRequest<T>(promise: Promise<T>): IDBRequest<T> {
+    const request = {
+        onsuccess: null as ((this: IDBRequest<T>, ev: Event) => unknown) | null,
+        onerror: null as ((this: IDBRequest<T>, ev: Event) => unknown) | null,
+        result: undefined as T | undefined,
+        error: null as DOMException | null,
+    }
+
+    promise.then(
+        (result) => {
+            request.result = result
+            request.onsuccess?.call(request as unknown as IDBRequest<T>, new Event("success"))
+        },
+        (error) => {
+            request.error = error as DOMException
+            request.onerror?.call(request as unknown as IDBRequest<T>, new Event("error"))
+        },
+    )
+
+    return request as unknown as IDBRequest<T>
+}

package/src/store/adapters/local-storage.ts

@@ -0,0 +1,48 @@
+import type { Adapter } from "./contract"
+
+export default class LocalStorageAdapter implements Adapter {
+    protected storage: Storage
+
+    constructor(storage: Storage = window.localStorage) {
+        this.storage = storage
+    }
+
+    async get(key: string): Promise<unknown>
+    async get<T>(key: string): Promise<T | null>
+    async get<T = unknown>(key: string): Promise<T | null> {
+        const value = this.storage.getItem(key)
+        if (value === null) {
+            return null
+        }
+
+        return JSON.parse(value) as T
+    }
+
+    async set<T = unknown>(key: string, value: T): Promise<void> {
+        this.storage.setItem(key, JSON.stringify(value))
+    }
+
+    async has(key: string): Promise<boolean> {
+        return this.storage.getItem(key) !== null
+    }
+
+    async delete(key: string): Promise<void> {
+        this.storage.removeItem(key)
+    }
+
+    async clear(): Promise<void> {
+        this.storage.clear()
+    }
+
+    async keys(): Promise<string[]> {
+        const keys: string[] = []
+        for (let i = 0; i < this.storage.length; i += 1) {
+            const key = this.storage.key(i)
+            if (key !== null) {
+                keys.push(key)
+            }
+        }
+
+        return keys
+    }
+}

package/src/store/adapters/memory.ts

@@ -0,0 +1,35 @@
+import type { Adapter } from "./contract"
+
+export default class MemoryStoreAdapter implements Adapter {
+    protected items = new Map<string, unknown>()
+
+    async get(key: string): Promise<unknown>
+    async get<T>(key: string): Promise<T | null>
+    async get<T = unknown>(key: string): Promise<T | null> {
+        if (!this.items.has(key)) {
+            return null
+        }
+
+        return this.items.get(key) as T
+    }
+
+    async set<T = unknown>(key: string, value: T): Promise<void> {
+        this.items.set(key, value)
+    }
+
+    async has(key: string): Promise<boolean> {
+        return this.items.has(key)
+    }
+
+    async delete(key: string): Promise<void> {
+        this.items.delete(key)
+    }
+
+    async clear(): Promise<void> {
+        this.items.clear()
+    }
+
+    async keys(): Promise<string[]> {
+        return Array.from(this.items.keys())
+    }
+}