fusee-framework 1.8.0 → 1.9.0

package/framework/server/actions.js

@@ -0,0 +1,173 @@
+import { signal, batch } from '../core/signal.js'
+import { getCurrentInstance } from '../core/component.js'
+
+const ACTION_BASE_URL = '/__fusee/actions'
+const _actionHydrationRegistry = new Map()
+
+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)
+}
+
+export function createActionProxy(name, opts = {}) {
+    const baseUrl = opts.baseUrl ?? ACTION_BASE_URL
+
+    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
+}
+
+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
+
+    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)
+            }
+        }
+    }
+
+    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 }
+}
+
+export function hydrateAction(actionName, data, opts = {}) {
+    const key = `action:${actionName}`
+    _actionHydrationRegistry.set(key, {
+        data,
+        timestamp: Date.now(),
+        staleTime: opts.staleTime ?? 0
+    })
+}
+
+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
+}
+
+export function clearActionHydration() {
+    _actionHydrationRegistry.clear()
+}
+
+export function extractActionHydration() {
+    const snapshot = {}
+    for (const [key, entry] of _actionHydrationRegistry) {
+        snapshot[key] = {
+            data: entry.data,
+            timestamp: entry.timestamp,
+            staleTime: entry.staleTime
+        }
+    }
+    return snapshot
+}
+
+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/actions.server.js

@@ -0,0 +1,88 @@
+import { withRequestContext, createRequestContext } from './index.js'
+
+const _actionRegistry = new Map()
+
+export function defineAction(fn, opts = {}) {
+    if (typeof fn !== 'function') {
+        throw new Error('[fusee] defineAction() requires a function')
+    }
+
+    const name = opts.name || fn.name
+    if (!name) {
+        throw new Error(
+            '[fusee] defineAction(): funcția trebuie să aibă un nume sau să specifici opts.name'
+        )
+    }
+
+    const wrapped = async function (...args) {
+        if (opts.authorize) {
+            await opts.authorize(...args)
+        }
+        return fn(...args)
+    }
+
+    wrapped._isAction = true
+    wrapped._actionName = name
+    _actionRegistry.set(name, { fn: wrapped, opts })
+
+    return wrapped
+}
+
+export async function handleActionRequest(req, res) {
+    let actionName
+    if (req.params?.name) {
+        actionName = req.params.name
+    } else {
+        const url = new URL(req.url, 'http://localhost')
+        const parts = url.pathname.split('/')
+        actionName = parts[parts.length - 1]
+    }
+
+    const entry = _actionRegistry.get(actionName)
+    if (!entry) {
+        return _sendJson(res, 404, { error: `Action "${actionName}" not found` })
+    }
+
+    let body
+    try {
+        body = req.body ?? (await _parseBody(req))
+    } catch {
+        return _sendJson(res, 400, { error: 'Invalid JSON body' })
+    }
+
+    const args = Array.isArray(body?.args) ? body.args : body != null ? [body] : []
+    const ctx = createRequestContext()
+
+    try {
+        const data = await withRequestContext(ctx, () => entry.fn(...args))
+        return _sendJson(res, 200, { data: data ?? null })
+    } catch (err) {
+        const isPublic = err?.expose === true
+        console.error(`[fusee] Action "${actionName}" threw:`, err)
+        return _sendJson(res, err?.status ?? 500, {
+            error: isPublic ? err.message : 'Internal server error',
+            code: err?.code
+        })
+    }
+}
+
+export function getRegisteredActions() {
+    return [..._actionRegistry.keys()]
+}
+
+async function _parseBody(req) {
+    const chunks = []
+    for await (const chunk of req) chunks.push(chunk)
+    return JSON.parse(Buffer.concat(chunks).toString('utf8'))
+}
+
+function _sendJson(res, status, body) {
+    if (typeof res.status === 'function') {
+        return res.status(status).json(body)
+    }
+
+    return new Response(JSON.stringify(body), {
+        status,
+        headers: { 'Content-Type': 'application/json' }
+    })
+}

package/framework/server/index.js

@@ -0,0 +1,18 @@
+import { AsyncLocalStorage } from 'node:async_hooks'
+import { _registerALS } from '../core/async-context.js'
+
+const _als = new AsyncLocalStorage()
+_registerALS(_als)
+
+export function createRequestContext() {
+    return {
+        inFlightMaps: {
+            byKey: new Map(),
+            byFetcher: new WeakMap()
+        }
+    }
+}
+
+export function withRequestContext(ctx, fn) {
+    return _als.run(ctx, fn)
+}

package/framework/types/actions.d.ts

@@ -0,0 +1,50 @@
+export interface ActionOptions {
+    name?: string
+    baseUrl?: string
+    headers?: Record<string, string>
+}
+
+export interface UseActionOptions {
+    onSuccess?: (data: any) => void
+    onError?: (error: Error) => void
+    resetOnCall?: boolean
+}
+
+export interface ActionReturn {
+    execute: (...args: any[]) => Promise<any>
+    pending: Signal<boolean>
+    data: Signal<any>
+    error: Signal<any>
+    reset: () => void
+}
+
+export interface ActionProxy extends Function {
+    _isAction: boolean
+    _actionName: string
+}
+
+export declare function defineAction(fnOrName: Function | string, opts?: ActionOptions): ActionProxy
+export declare function createActionProxy(name: string, opts?: ActionOptions): ActionProxy
+export declare function useAction(action: ActionProxy, opts?: UseActionOptions): ActionReturn
+
+// ─── Hydration Support ─────────────────────────────────────────────────────
+
+export interface ActionHydrationOptions {
+    staleTime?: number
+}
+
+export interface ActionHydrationEntry {
+    data: any
+    timestamp: number
+    staleTime: number
+}
+
+export interface ActionHydrationSnapshot {
+    [key: string]: ActionHydrationEntry
+}
+
+export declare function hydrateAction(actionName: string, data: any, opts?: ActionHydrationOptions): void
+export declare function getHydratedAction(actionName: string, staleTime?: number): any
+export declare function clearActionHydration(): void
+export declare function extractActionHydration(): ActionHydrationSnapshot
+export declare function loadActionHydration(snapshot: ActionHydrationSnapshot): void

package/framework/types/actions.server.d.ts

@@ -0,0 +1,36 @@
+export interface ActionServerOptions {
+    name?: string
+    authorize?: (...args: any[]) => Promise<void> | void
+}
+
+export interface RegisteredAction {
+    fn: Function
+    opts: ActionServerOptions
+}
+
+export interface ActionRegistry {
+    get(name: string): RegisteredAction | undefined
+    set(name: string, entry: RegisteredAction): void
+    keys(): IterableIterator<string>
+}
+
+export interface RequestLike {
+    params?: { name?: string }
+    body?: any
+    url?: string
+}
+
+export interface ResponseLike {
+    status(code: number): ResponseLike
+    json(body: any): any
+}
+
+export interface ActionError extends Error {
+    status?: number
+    code?: string
+    expose?: boolean
+}
+
+export declare function defineAction(fn: Function, opts?: ActionServerOptions): Function
+export declare function handleActionRequest(req: RequestLike, res: ResponseLike): Promise<void>
+export declare function getRegisteredActions(): string[]

package/framework/types/compiler/ast.d.ts

@@ -0,0 +1,166 @@
+export declare const NodeType: {
+    readonly ROOT: 'Root'
+    readonly ELEMENT: 'Element'
+    readonly COMPONENT: 'Component'
+    readonly TEXT: 'Text'
+    readonly INTERPOLATION: 'Interpolation'
+    readonly EXPRESSION: 'Expression'
+    readonly ATTRIBUTE: 'Attribute'
+    readonly BINDING: 'Binding'
+    readonly EVENT: 'Event'
+    readonly DIRECTIVE: 'Directive'
+    readonly SLOT_OUTLET: 'SlotOutlet'
+    readonly SLOT_CONTENT: 'SlotContent'
+}
+
+export type NodeTypeValue = typeof NodeType[keyof typeof NodeType]
+
+export interface Position {
+    line: number
+    col: number
+    offset: number
+}
+
+export interface SourceLocation {
+    start: Position
+    end: Position
+    source?: string
+}
+
+export interface BaseNode {
+    type: NodeTypeValue | 'If'
+    loc: SourceLocation | null
+}
+
+export interface RootNode extends BaseNode {
+    type: 'Root'
+    children: ChildNode[]
+    _hoisted?: AnyNode[]
+}
+
+export interface ElementNode extends BaseNode {
+    type: 'Element'
+    tag: string
+    props: PropNode[]
+    children: ChildNode[]
+    selfClosing: boolean
+    isStatic: boolean
+    hoisted: boolean
+}
+
+export interface ComponentNode extends BaseNode {
+    type: 'Component'
+    name: string
+    props: PropNode[]
+    slots: Record<string, ChildNode[]>
+    isStatic: boolean
+}
+
+export interface TextNode extends BaseNode {
+    type: 'Text'
+    content: string
+    isStatic: true
+}
+
+export interface InterpolationNode extends BaseNode {
+    type: 'Interpolation'
+    expression: ExpressionNode
+    isStatic: boolean
+}
+
+export interface ExpressionNode extends BaseNode {
+    type: 'Expression'
+    content: string
+    isStatic: boolean
+    _isForKey?: boolean
+}
+
+export interface AttributeNode extends BaseNode {
+    type: 'Attribute'
+    name: string
+    value: string | null
+}
+
+export interface BindingNode extends BaseNode {
+    type: 'Binding'
+    name: string
+    expression: ExpressionNode
+    isProp: boolean
+}
+
+export interface EventNode extends BaseNode {
+    type: 'Event'
+    name: string
+    expression: ExpressionNode
+    modifiers: string[]
+}
+
+export type DirectiveName = 'if' | 'else-if' | 'else' | 'for' | 'model' | 'show' | 'once' | 'ref' | 'html' | string
+
+export interface DirectiveNode extends BaseNode {
+    type: 'Directive'
+    name: DirectiveName
+    expression: ExpressionNode | null
+    arg: ForArg | null
+}
+
+export interface SlotOutletNode extends BaseNode {
+    type: 'SlotOutlet'
+    slotName: string
+    fallback: ChildNode[]
+}
+
+export interface SlotContentNode extends BaseNode {
+    type: 'SlotContent'
+    slotName: string
+    children: ChildNode[]
+}
+
+export interface IfNode {
+    type: 'If'
+    branches: IfBranch[]
+    loc: SourceLocation | null
+    isStatic: false
+}
+
+export interface IfBranch {
+    condition: ExpressionNode | null
+    node: ElementNode | ComponentNode
+}
+
+export interface ForArg {
+    item: string
+    source: string
+    index: string | null
+    loc: SourceLocation | null
+}
+
+export type PropNode = AttributeNode | BindingNode | EventNode | DirectiveNode
+export type ChildNode = ElementNode | ComponentNode | TextNode | InterpolationNode | SlotOutletNode | SlotContentNode | IfNode
+export type AnyNode = RootNode | ChildNode | PropNode | ExpressionNode | ForArg
+
+export declare function createLoc(start: Position, end: Position, source?: string): SourceLocation
+export declare function createPos(line: number, col: number, offset: number): Position
+export declare function createRoot(children?: ChildNode[], loc?: SourceLocation | null): RootNode
+export declare function createElement(tag: string, props?: PropNode[], children?: ChildNode[], selfClosing?: boolean, loc?: SourceLocation | null): ElementNode
+export declare function createComponent(name: string, props?: PropNode[], slots?: Record<string, ChildNode[]>, loc?: SourceLocation | null): ComponentNode
+export declare function createText(content: string, loc?: SourceLocation | null): TextNode
+export declare function createInterpolation(expression: ExpressionNode, loc?: SourceLocation | null): InterpolationNode
+export declare function createExpression(content: string, isStatic?: boolean, loc?: SourceLocation | null): ExpressionNode
+export declare function createAttribute(name: string, value: string | null, loc?: SourceLocation | null): AttributeNode
+export declare function createBinding(name: string, expression: ExpressionNode, isProp?: boolean, loc?: SourceLocation | null): BindingNode
+export declare function createEvent(name: string, expression: ExpressionNode, modifiers?: string[], loc?: SourceLocation | null): EventNode
+export declare function createDirective(name: DirectiveName, expression?: ExpressionNode | null, arg?: ForArg | null, loc?: SourceLocation | null): DirectiveNode
+export declare function createSlotOutlet(slotName?: string, fallback?: ChildNode[], loc?: SourceLocation | null): SlotOutletNode
+export declare function createSlotContent(slotName?: string, children?: ChildNode[], loc?: SourceLocation | null): SlotContentNode
+export declare function createForArg(item: string, source: string, index?: string | null, loc?: SourceLocation | null): ForArg
+
+export declare function isElement(node: AnyNode | null | undefined): node is ElementNode
+export declare function isComponent(node: AnyNode | null | undefined): node is ComponentNode
+export declare function isText(node: AnyNode | null | undefined): node is TextNode
+export declare function isInterpolation(node: AnyNode | null | undefined): node is InterpolationNode
+export declare function isDirective(node: AnyNode | null | undefined, name?: DirectiveName): node is DirectiveNode
+export declare function isStaticText(node: AnyNode | null | undefined): boolean
+export declare function findDirective(element: ElementNode | ComponentNode, name: DirectiveName): DirectiveNode | null
+export declare function getEvents(element: ElementNode | ComponentNode): EventNode[]
+export declare function cloneNode<T extends AnyNode>(node: T): T

package/framework/types/compiler/errors-codes.d.ts

@@ -0,0 +1,23 @@
+export declare const ErrorCode: {
+    readonly UNEXPECTED_CHAR: 'E001'
+    readonly UNTERMINATED_STRING: 'E002'
+    readonly UNTERMINATED_MUSTACHE: 'E003'
+    readonly UNTERMINATED_TAG: 'E004'
+    readonly MALFORMED_COMMENT: 'E005'
+    readonly UNEXPECTED_TOKEN: 'P001'
+    readonly MISSING_CLOSING_TAG: 'P002'
+    readonly UNEXPECTED_CLOSING_TAG: 'P003'
+    readonly INVALID_DIRECTIVE_SYNTAX: 'P004'
+    readonly INVALID_FOR_SYNTAX: 'P005'
+    readonly DUPLICATE_KEY: 'P006'
+    readonly V_ELSE_NO_IF: 'P007'
+    readonly EMPTY_EXPRESSION: 'P008'
+    readonly INVALID_SLOT_NAME: 'P009'
+    readonly DUPLICATE_DIRECTIVE: 'T001'
+    readonly FOR_MISSING_KEY: 'T002'
+    readonly MODEL_ON_NON_INPUT: 'T003'
+    readonly COMPONENT_NOT_REGISTERED: 'T004'
+    readonly UNKNOWN_IDENTIFIER: 'S001'
+    readonly STATIC_FOR_KEY: 'S002'
+    readonly UNKNOWN_NODE_TYPE: 'G001'
+}

package/framework/types/compiler/errors.d.ts

@@ -0,0 +1,43 @@
+import type { SourceLocation } from './ast.js'
+import type { ErrorCode } from './errors-list.js'
+
+export type ErrorCodeValue = typeof ErrorCode[keyof typeof ErrorCode]
+
+export declare class CompileError extends Error {
+    readonly name: 'CompileError'
+    readonly code: ErrorCodeValue
+    readonly loc: SourceLocation | null
+    readonly source: string
+
+    constructor(code: ErrorCodeValue, loc: SourceLocation | null, source: string, ...args: string[])
+
+    format(filePath?: string): string
+    _buildSnippet(): string
+}
+
+export declare class CompileWarning {
+    readonly message: string
+    readonly code: ErrorCodeValue
+    readonly loc: SourceLocation | null
+    readonly source: string
+
+    constructor(code: ErrorCodeValue, loc: SourceLocation | null, source: string, ...args: string[])
+
+    format(filePath?: string): string
+}
+
+export declare class ErrorCollector {
+    readonly source: string
+    readonly errors: CompileError[]
+    readonly warnings: CompileWarning[]
+    readonly hasErrors: boolean
+    readonly hasWarnings: boolean
+
+    constructor(source: string)
+
+    error(code: ErrorCodeValue, loc: SourceLocation | null, ...args: string[]): CompileError
+    warn(code: ErrorCodeValue, loc: SourceLocation | null, ...args: string[]): CompileWarning
+    throwIfAny(): void
+}
+
+export declare function throwError(code: ErrorCodeValue, loc: SourceLocation | null, source: string, ...args: string[]): never

package/framework/types/compiler/generator.d.ts

@@ -0,0 +1,8 @@
+import type { RootNode } from './ast.js'
+
+export interface GenerateOptions {
+    runtimePath?: string
+    source?: string
+}
+
+export declare function generate(ast: RootNode, options?: GenerateOptions): string

package/framework/types/compiler/h.d.ts

@@ -0,0 +1,46 @@
+export interface FNode {
+    node: Node
+    effects: Array<() => void>
+    _isIf?: boolean
+    _isFor?: boolean
+    _isSlot?: boolean
+    _tag?: string
+    _component?: ComponentApi
+    _ifBranchNodes?: () => FNode[]
+    _getNodes?: () => FNode[]
+    _slotNodes?: FNode[]
+    props?: Record<string, unknown>
+    children?: FNode[]
+}
+
+export interface ComponentApi {
+    render(container: HTMLElement): unknown
+    unmount(): void
+    instance: unknown
+}
+
+export type StaticPropValue = string | boolean | null
+export type PropGetter<T = unknown> = () => T
+export interface EventDescriptor {
+    handler:   ((...args: unknown[]) => void) | null
+    modifiers: string[]
+}
+
+export type SlotMap = Record<string, () => FNode[]>
+export type PropsMap = Record<string, StaticPropValue | PropGetter | EventDescriptor | true>
+
+export declare function h(tag: string, props?: PropsMap, children?: FNode[], isStatic?: boolean): FNode
+export declare function hText(value: string | (() => string)): FNode
+export declare function hIf(branches: Array<[(() => boolean) | null, () => FNode[]]>): FNode
+export declare function hFor<T>(sourceGetter: () => T[], renderItem: (item: T, index?: number) => FNode, keyFn: (item: T, index?: number) => unknown): FNode
+export declare function hSlot(slots: SlotMap | null | undefined, name: string, fallback?: FNode[]): FNode
+export declare function createComponent(name: string, ComponentFn: ((...args: unknown[]) => ComponentApi) | undefined | null, rawProps?: PropsMap, rawSlots?: SlotMap): FNode
+
+export interface MountedApp {
+    unmount(): void
+}
+
+export declare function mount(renderFn: (ctx: unknown, components: Record<string, unknown>) => FNode[], ctx: unknown, components: Record<string, unknown>, container: HTMLElement): MountedApp
+
+export declare const _effect: (fn: () => void) => () => void
+export declare const _batch:  <T>(fn: () => T) => T

package/framework/types/compiler/lexer.d.ts

@@ -0,0 +1,27 @@
+import type { SourceLocation } from './ast.js'
+
+export declare const TokenType: {
+    readonly TAG_OPEN: 'TAG_OPEN'
+    readonly TAG_OPEN_CLOSE: 'TAG_OPEN_CLOSE'
+    readonly TAG_CLOSE: 'TAG_CLOSE'
+    readonly TAG_SELF_CLOSE: 'TAG_SELF_CLOSE'
+    readonly COMMENT: 'COMMENT'
+    readonly ATTR_NAME: 'ATTR_NAME'
+    readonly ATTR_EQUALS: 'ATTR_EQUALS'
+    readonly ATTR_VALUE: 'ATTR_VALUE'
+    readonly TEXT: 'TEXT'
+    readonly MUSTACHE_OPEN: 'MUSTACHE_OPEN'
+    readonly MUSTACHE_EXPR: 'MUSTACHE_EXPR'
+    readonly MUSTACHE_CLOSE: 'MUSTACHE_CLOSE'
+    readonly EOF: 'EOF'
+}
+
+export type TokenTypeValue = typeof TokenType[keyof typeof TokenType]
+
+export interface Token {
+    type: TokenTypeValue
+    value: string
+    loc: SourceLocation
+}
+
+export declare function tokenize(source: string): Token[]