fusee-framework 2.7.0 → 2.7.2

package/framework/server/actions.js

@@ -1,184 +1,184 @@
-import { signal, batch } from '../core/signal.js'
-import { getCurrentInstance } from '../core/component.js'
-
-const ACTION_BASE_URL = '/__fusee/actions'
-const _actionHydrationRegistry = new Map()
-
-/** Creates a client action proxy from a function or explicit action name. */
-export function defineAction(fnOrName, opts = {}) {
-    const name = opts.name
-        || (typeof fnOrName === 'function' ? fnOrName.name : fnOrName)
-
-    if (!name) {
-        throw new Error('[fusee] defineAction() client stub: nu s-a putut determina numele acțiunii')
-    }
-
-    return createActionProxy(name, opts)
-}
-
-/** Creates a proxy that POSTs action arguments and returns server data. */
-export function createActionProxy(name, opts = {}) {
-    const baseUrl = opts.baseUrl ?? ACTION_BASE_URL
-
-    /** Sends one action invocation to the configured server endpoint. */
-    async function actionProxy(...args) {
-        const res = await fetch(`${baseUrl}/${name}`, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-                ...(opts.headers ?? {})
-            },
-            body: JSON.stringify({ args })
-        })
-
-        const json = await res.json()
-
-        if (!res.ok) {
-            const err = new Error(json.error ?? `Action "${name}" failed (${res.status})`)
-            err.status = res.status
-            err.code = json.code
-            throw err
-        }
-
-        return json.data
-    }
-
-    actionProxy._isAction = true
-    actionProxy._actionName = name
-
-    return actionProxy
-}
-
-/** Wraps an action in reactive pending, data, error, and reset state. */
-export function useAction(action, opts = {}) {
-    if (typeof action !== 'function') {
-        throw new Error('[fusee] useAction() requires an action function (result of defineAction or createActionProxy)')
-    }
-
-    const pending = signal(false)
-    const data = signal(undefined)
-    const error = signal(undefined)
-
-    const { onSuccess, onError, resetOnCall = true } = opts
-
-    let callId = 0
-
-    /** Executes the action and ignores stale responses from superseded calls. */
-    async function execute(...args) {
-        const id = ++callId
-
-        batch(() => {
-            pending(true)
-            if (resetOnCall) {
-                data(undefined)
-                error(undefined)
-            }
-        })
-
-        try {
-            const result = await action(...args)
-
-            if (id !== callId) return result
-
-            batch(() => {
-                data(result)
-                pending(false)
-            })
-
-            if (typeof onSuccess === 'function') {
-                onSuccess(result)
-            }
-
-            return result
-        } catch (err) {
-            if (id !== callId) return
-
-            batch(() => {
-                error(err)
-                pending(false)
-            })
-
-            if (typeof onError === 'function') {
-                onError(err)
-            } else {
-                console.error(`[fusee] useAction("${action._actionName ?? '?'}") error:`, err)
-            }
-        }
-    }
-
-    /** Clears action state and invalidates any in-flight result. */
-    function reset() {
-        batch(() => {
-            pending(false)
-            data(undefined)
-            error(undefined)
-        })
-        callId++
-    }
-
-    const instance = getCurrentInstance()
-    if (instance) {
-        instance._unmountHooks.push(() => {
-            callId++
-        })
-    }
-
-    return { execute, pending, data, error, reset }
-}
-
-/** Stores server-provided action data for client-side hydration. */
-export function hydrateAction(actionName, data, opts = {}) {
-    const key = `action:${actionName}`
-    _actionHydrationRegistry.set(key, {
-        data,
-        timestamp: Date.now(),
-        staleTime: opts.staleTime ?? 0
-    })
-}
-
-/** Returns hydrated action data when its configured freshness window is valid. */
-export function getHydratedAction(actionName, staleTime) {
-    const key = `action:${actionName}`
-    const entry = _actionHydrationRegistry.get(key)
-    if (!entry) return undefined
-
-    if (staleTime !== undefined && (Date.now() - entry.timestamp) > staleTime) {
-        return undefined
-    }
-    if (entry.staleTime && (Date.now() - entry.timestamp) > entry.staleTime) {
-        return undefined
-    }
-
-    return entry.data
-}
-
-/** Clears all hydrated action entries. */
-export function clearActionHydration() {
-    _actionHydrationRegistry.clear()
-}
-
-/** Serializes hydrated action entries for transfer to a client. */
-export function extractActionHydration() {
-    const snapshot = {}
-    for (const [key, entry] of _actionHydrationRegistry) {
-        snapshot[key] = {
-            data: entry.data,
-            timestamp: entry.timestamp,
-            staleTime: entry.staleTime
-        }
-    }
-    return snapshot
-}
-
-/** Loads a serialized action hydration snapshot into the client registry. */
-export function loadActionHydration(snapshot) {
-    if (!snapshot || typeof snapshot !== 'object') return
-
-    for (const [key, entry] of Object.entries(snapshot)) {
-        _actionHydrationRegistry.set(key, {
-            data: entry.data,
-            timestamp: entry.timestamp,
-            staleTime: entry.staleTime
-        })
-    }
+import { signal, batch } from '../core/signal.js'
+import { getCurrentInstance } from '../core/component-core.js'
+
+const ACTION_BASE_URL = '/__fusee/actions'
+const _actionHydrationRegistry = new Map()
+
+/** Creates a client action proxy from a function or explicit action name. */
+export function defineAction(fnOrName, opts = {}) {
+    const name = opts.name
+        || (typeof fnOrName === 'function' ? fnOrName.name : fnOrName)
+
+    if (!name) {
+        throw new Error('[fusee] defineAction() client stub: nu s-a putut determina numele acțiunii')
+    }
+
+    return createActionProxy(name, opts)
+}
+
+/** Creates a proxy that POSTs action arguments and returns server data. */
+export function createActionProxy(name, opts = {}) {
+    const baseUrl = opts.baseUrl ?? ACTION_BASE_URL
+
+    /** Sends one action invocation to the configured server endpoint. */
+    async function actionProxy(...args) {
+        const res = await fetch(`${baseUrl}/${name}`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                ...(opts.headers ?? {})
+            },
+            body: JSON.stringify({ args })
+        })
+
+        const json = await res.json()
+
+        if (!res.ok) {
+            const err = new Error(json.error ?? `Action "${name}" failed (${res.status})`)
+            err.status = res.status
+            err.code = json.code
+            throw err
+        }
+
+        return json.data
+    }
+
+    actionProxy._isAction = true
+    actionProxy._actionName = name
+
+    return actionProxy
+}
+
+/** Wraps an action in reactive pending, data, error, and reset state. */
+export function useAction(action, opts = {}) {
+    if (typeof action !== 'function') {
+        throw new Error('[fusee] useAction() requires an action function (result of defineAction or createActionProxy)')
+    }
+
+    const pending = signal(false)
+    const data = signal(undefined)
+    const error = signal(undefined)
+
+    const { onSuccess, onError, resetOnCall = true } = opts
+
+    let callId = 0
+
+    /** Executes the action and ignores stale responses from superseded calls. */
+    async function execute(...args) {
+        const id = ++callId
+
+        batch(() => {
+            pending(true)
+            if (resetOnCall) {
+                data(undefined)
+                error(undefined)
+            }
+        })
+
+        try {
+            const result = await action(...args)
+
+            if (id !== callId) return result
+
+            batch(() => {
+                data(result)
+                pending(false)
+            })
+
+            if (typeof onSuccess === 'function') {
+                onSuccess(result)
+            }
+
+            return result
+        } catch (err) {
+            if (id !== callId) return
+
+            batch(() => {
+                error(err)
+                pending(false)
+            })
+
+            if (typeof onError === 'function') {
+                onError(err)
+            } else {
+                console.error(`[fusee] useAction("${action._actionName ?? '?'}") error:`, err)
+            }
+        }
+    }
+
+    /** Clears action state and invalidates any in-flight result. */
+    function reset() {
+        batch(() => {
+            pending(false)
+            data(undefined)
+            error(undefined)
+        })
+        callId++
+    }
+
+    const instance = getCurrentInstance()
+    if (instance) {
+        instance._unmountHooks.push(() => {
+            callId++
+        })
+    }
+
+    return { execute, pending, data, error, reset }
+}
+
+/** Stores server-provided action data for client-side hydration. */
+export function hydrateAction(actionName, data, opts = {}) {
+    const key = `action:${actionName}`
+    _actionHydrationRegistry.set(key, {
+        data,
+        timestamp: Date.now(),
+        staleTime: opts.staleTime ?? 0
+    })
+}
+
+/** Returns hydrated action data when its configured freshness window is valid. */
+export function getHydratedAction(actionName, staleTime) {
+    const key = `action:${actionName}`
+    const entry = _actionHydrationRegistry.get(key)
+    if (!entry) return undefined
+
+    if (staleTime !== undefined && (Date.now() - entry.timestamp) > staleTime) {
+        return undefined
+    }
+    if (entry.staleTime && (Date.now() - entry.timestamp) > entry.staleTime) {
+        return undefined
+    }
+
+    return entry.data
+}
+
+/** Clears all hydrated action entries. */
+export function clearActionHydration() {
+    _actionHydrationRegistry.clear()
+}
+
+/** Serializes hydrated action entries for transfer to a client. */
+export function extractActionHydration() {
+    const snapshot = {}
+    for (const [key, entry] of _actionHydrationRegistry) {
+        snapshot[key] = {
+            data: entry.data,
+            timestamp: entry.timestamp,
+            staleTime: entry.staleTime
+        }
+    }
+    return snapshot
+}
+
+/** Loads a serialized action hydration snapshot into the client registry. */
+export function loadActionHydration(snapshot) {
+    if (!snapshot || typeof snapshot !== 'object') return
+
+    for (const [key, entry] of Object.entries(snapshot)) {
+        _actionHydrationRegistry.set(key, {
+            data: entry.data,
+            timestamp: entry.timestamp,
+            staleTime: entry.staleTime
+        })
+    }
 }

package/framework/server/generate-manifest.js

@@ -123,8 +123,8 @@ let elementRuntimeReady = false
  * Prepares plain Node to import app element modules the way Vite does:
  * - `fusee-framework` (and subpaths) resolves to this framework copy when normal
  *   resolution fails, as scaffolded apps only map it through a Vite alias;
- * - the framework entry is loaded first, which installs fusée's globals, so modules
- *   written for auto-imports (bare `signal()`, `defineElement()`) work as well.
+ * - fusée's opt-in globals are installed first, standing in for Vite's auto-imports, so
+ *   modules that call the API without importing it (bare `signal()`) work as well.
  */
 async function prepareElementRuntime() {
     if (elementRuntimeReady) return
@@ -146,7 +146,7 @@ async function prepareElementRuntime() {
         register('data:text/javascript,' + encodeURIComponent(hooks))
     }
 
-    await import(pathToFileURL(path.join(frameworkDir, 'index.js')).href)
+    await import(pathToFileURL(path.join(frameworkDir, 'globals.js')).href)
 }
 
 /**

package/framework/types/component.d.ts

@@ -1,87 +1,98 @@
-export type ComponentProps = Record<string, any>
-export type EmptyProps = Record<string, never>
-export type PropSchema = string[] | Record<string, PropConfig>
-
-export type PropConfig = {
-    type?: FunctionConstructor | StringConstructor | NumberConstructor | BooleanConstructor
-    default?: any | (() => any)
-    required?: boolean
-}
-
-export type EmitFn = (eventName: string, ...args: any[]) => void
-
-export type Slots = Record<string, string>
-
-export type SetupContext = {
-    emit: EmitFn
-    slots: Slots
-}
-
-export type ComponentInstance = {
-    props: ComponentProps
-    state?: any
-    provides: Record<string | symbol, any>
-    _mountHooks: (() => void)[]
-    _unmountHooks: (() => void)[]
-    _effects: import('./signal').EffectRunner[]
-    _element: HTMLElement | null
-    _parent: ComponentInstance | null
-    _app: any
-    _components: Record<string, ComponentFactory<any>>
-    _injector: import('./di').Injector
-    _ownsInjector: boolean
-}
-
-export type ComponentResult = {
-    template: string
-    [key: string]: any
-}
-
-export type ComponentOptions<TProps = ComponentProps, P = PropSchema> = {
-    props?: P
-    components?: Record<string, ComponentFactory<any>>
-    setup: (props: TProps, ctx: SetupContext) => ComponentResult
-    render?: (state: any, components: Record<string, ComponentFactory<any>>) => any[]
-}
-
-export type ComponentFactory<TProps = ComponentProps> = (props?: TProps, options?: { listeners?: Record<string, Function>, slots?: Slots, parent?: ComponentInstance | Record<string, any> | null }) => ComponentApi
-
-export type ComponentApi = {
-    render: (container: HTMLElement) => ComponentInstance
-    unmount: () => void
-    instance: ComponentInstance
-}
-
-export declare function onMount(fn: () => void): void
-export declare function onUnmount(fn: () => void): void
-export declare function parseSlots(slotHTML: string): Slots
-export declare function getCurrentInstance(): ComponentInstance | null
-export declare function setCurrentInstance(instance: ComponentInstance | null): void
-
-export declare function provide<T = any>(key: any, value?: T): void
-export { inject } from './di'
-
-type InferPropType<T> = T extends StringConstructor ? string :
-    T extends NumberConstructor ? number :
-    T extends BooleanConstructor ? boolean :
-    any;
-
-type InferProps<P> = P extends string[]
-    ? Record<P[number], any>
-    : P extends Record<string, PropConfig>
-    ? {
-        [K in keyof P]: P[K]['required'] extends true
-        ? InferPropType<P[K]['type']>
-        : InferPropType<P[K]['type']> | (P[K] extends { default: any } ? never : undefined)
-    }
-    : Record<string, any>;
-
-export declare function defineComponent<P extends PropSchema = any, TProps = InferProps<P>>(options: ComponentOptions<TProps, P>): ComponentFactory<TProps>
-export type AsyncComponentLoader<TProps = ComponentProps> = () => Promise<ComponentFactory<TProps> | { default: ComponentFactory<TProps> } | Record<string, any>>
-
-export type AsyncComponentOptions<TProps = ComponentProps> = {
-    loader: AsyncComponentLoader<TProps>
-    loadingComponent?: ComponentFactory<any>
-}
-
+export type ComponentProps = Record<string, any>
+export type EmptyProps = Record<string, never>
+export type PropSchema = string[] | Record<string, PropConfig>
+
+export type PropConfig = {
+    type?: FunctionConstructor | StringConstructor | NumberConstructor | BooleanConstructor
+    default?: any | (() => any)
+    required?: boolean
+}
+
+export type EmitFn = (eventName: string, ...args: any[]) => void
+
+export type Slots = Record<string, string>
+
+export type SetupContext = {
+    emit: EmitFn
+    slots: Slots
+}
+
+export type ComponentInstance = {
+    props: ComponentProps
+    state?: any
+    provides: Record<string | symbol, any>
+    _mountHooks: (() => void)[]
+    _unmountHooks: (() => void)[]
+    _effects: import('./signal').EffectRunner[]
+    _element: HTMLElement | null
+    _parent: ComponentInstance | null
+    _app: any
+    _components: Record<string, ComponentFactory<any>>
+    _injector: import('./di').Injector
+    _ownsInjector: boolean
+}
+
+export type ComponentResult = {
+    template: string
+    [key: string]: any
+}
+
+export type ComponentOptions<TProps = ComponentProps, P = PropSchema> = {
+    props?: P
+    components?: Record<string, ComponentFactory<any>>
+    setup: (props: TProps, ctx: SetupContext) => ComponentResult
+    render?: (state: any, components: Record<string, ComponentFactory<any>>) => any[]
+}
+
+export type ComponentFactory<TProps = ComponentProps> = (props?: TProps, options?: { listeners?: Record<string, Function>, slots?: Slots, parent?: ComponentInstance | Record<string, any> | null }) => ComponentApi
+
+export type ComponentApi = {
+    render: (container: HTMLElement) => ComponentInstance
+    unmount: () => void
+    instance: ComponentInstance
+}
+
+export declare function onMount(fn: () => void): void
+export declare function onUnmount(fn: () => void): void
+export declare function parseSlots(slotHTML: string): Slots
+export declare function getCurrentInstance(): ComponentInstance | null
+export declare function setCurrentInstance(instance: ComponentInstance | null): void
+
+export declare function provide<T = any>(key: any, value?: T): void
+export { inject } from './di'
+
+type InferPropType<T> = T extends StringConstructor ? string :
+    T extends NumberConstructor ? number :
+    T extends BooleanConstructor ? boolean :
+    any;
+
+type InferProps<P> = P extends string[]
+    ? Record<P[number], any>
+    : P extends Record<string, PropConfig>
+    ? {
+        [K in keyof P]: P[K]['required'] extends true
+        ? InferPropType<P[K]['type']>
+        : InferPropType<P[K]['type']> | (P[K] extends { default: any } ? never : undefined)
+    }
+    : Record<string, any>;
+
+export declare function defineComponent<P extends PropSchema = any, TProps = InferProps<P>>(options: ComponentOptions<TProps, P>): ComponentFactory<TProps>
+
+export type CompiledComponentOptions<TProps = ComponentProps, P = PropSchema> = {
+    props?: P
+    components?: Record<string, ComponentFactory<any>>
+    setup?: (props: TProps, ctx: SetupContext) => Record<string, any>
+    /** Compiled render function (a .fusee file's `render`, or JSX). String templates are not supported. */
+    render?: (state: any, components: Record<string, ComponentFactory<any>>) => any[]
+}
+
+/** Like defineComponent(), for compiled `render` functions only: keeps the runtime template compiler out of the bundle. */
+export declare function defineCompiledComponent<P extends PropSchema = any, TProps = InferProps<P>>(options: CompiledComponentOptions<TProps, P>): ComponentFactory<TProps>
+export type AsyncComponentLoader<TProps = ComponentProps> = () => Promise<ComponentFactory<TProps> | { default: ComponentFactory<TProps> } | Record<string, any>>
+
+export type AsyncComponentOptions<TProps = ComponentProps> = {
+    loader: AsyncComponentLoader<TProps>
+    loadingComponent?: ComponentFactory<any>
+}
+
 export declare function defineAsyncComponent<TProps = ComponentProps>(loaderOrOptions: AsyncComponentLoader<TProps> | AsyncComponentOptions<TProps>): ComponentFactory<TProps>