fusee-framework 1.6.0 → 1.7.0

package/create-fusee-go/internal/assets/embed/framework/core/signal.js

@@ -0,0 +1,412 @@
+let currentEffect = null
+let currentOwner = null
+let onEffectCreated = null
+
+export function setEffectHook(fn) { onEffectCreated = fn }
+
+export function onCleanup(fn) {
+    if (!currentOwner) return
+    currentOwner.cleanups.add(fn)
+}
+
+let batchDepth = 0
+const pendingEffects = new Set()
+
+export function batch(fn) {
+    batchDepth++
+    try {
+        return fn()
+    } finally {
+        batchDepth--
+        if (batchDepth === 0) {
+            while (pendingEffects.size > 0) {
+                const toRun = [...pendingEffects]
+                pendingEffects.clear()
+                for (const eff of toRun) eff()
+            }
+        }
+    }
+}
+
+function scheduleEffect(effectFn) {
+    if (batchDepth > 0) {
+        pendingEffects.add(effectFn)
+    } else {
+        effectFn()
+    }
+}
+
+export function signal(initialValue) {
+    let value = initialValue
+    const subscribers = new Set()
+
+    function accessor() {
+        if (arguments.length === 0) {
+            if (currentEffect) {
+                subscribers.add(currentEffect)
+                currentEffect.deps.add(subscribers)
+            }
+            return value
+        } else {
+            const newValue = arguments[0]
+            if (!Object.is(value, newValue)) {
+                value = newValue
+                for (const sub of [...subscribers]) scheduleEffect(sub)
+            }
+        }
+    }
+
+    accessor.isSignal = true
+
+    if (Array.isArray(initialValue)) addMutatingArrayMethods(accessor)
+    addReactiveArrayMethods(accessor)
+
+    return accessor
+}
+
+export function effect(fn) {
+    let active = true
+    let running = false
+
+    const owner = {
+        children: new Set(),
+        cleanups: new Set()
+    }
+
+    const run = () => {
+        if (!active || running) {
+            if (running) console.warn('[framework] Recursive effect detected')
+            return
+        }
+
+        running = true
+
+        for (const dep of run.deps) dep.delete(run)
+        run.deps.clear()
+
+        const prevEffect = currentEffect
+        const prevOwner = currentOwner
+
+        currentEffect = run
+        currentOwner = owner
+
+        try { fn() }
+        finally {
+            currentEffect = prevEffect
+            currentOwner = prevOwner
+            running = false
+        }
+    }
+
+    run.deps = new Set()
+
+    const cleanup = () => {
+        if (!active) return
+        active = false
+
+        pendingEffects.delete(run)
+
+        for (const dep of run.deps) dep.delete(run)
+        run.deps.clear()
+
+        for (const child of owner.children) child()
+        owner.children.clear()
+
+        for (const fn of owner.cleanups) fn()
+        owner.cleanups.clear()
+    }
+
+    if (onEffectCreated) onEffectCreated(cleanup)
+    if (currentOwner) {
+        currentOwner.children.add(cleanup)
+    }
+
+    run()
+    return cleanup
+}
+
+export function computed(fn) {
+    let value
+    let dirty = true
+    let active = true
+    const subscribers = new Set()
+    const deps = new Set()
+
+    const computedNode = () => {
+    if (!active || dirty) return
+
+    if (subscribers.size > 0) {
+        if (!runRecompute()) return
+    } else {
+        dirty = true
+        for (const d of deps) d.delete(computedNode)
+        deps.clear()
+        return
+    }
+
+    for (const sub of [...subscribers]) scheduleEffect(sub)
+}
+
+    computedNode.deps = deps
+
+    let computing = false
+
+    function runRecompute() {
+        if (computing) {
+            console.warn('[framework] Circular dependency detected in computed()')
+            return false
+        }
+
+        computing = true
+        for (const d of deps) d.delete(computedNode)
+        deps.clear()
+
+        const prevEffect = currentEffect
+        currentEffect = active ? computedNode : null
+        try {
+            const newValue = fn()
+            const changed = !Object.is(newValue, value)
+            value = newValue
+            dirty = false
+            return changed
+        } finally {
+            currentEffect = prevEffect
+            computing = false
+        }
+    }
+
+    function accessor() {
+        if (arguments.length === 0) {
+            if (active && currentEffect) {
+                subscribers.add(currentEffect)
+                currentEffect.deps.add(subscribers)
+            }
+
+            if (dirty) {
+                runRecompute()
+            }
+
+            return value
+        }
+        console.warn('[framework] computed() is read-only')
+    }
+
+    accessor.dispose = () => {
+        active = false
+        dirty = true
+        pendingEffects.delete(computedNode)
+        for (const d of deps) d.delete(computedNode)
+        deps.clear()
+        subscribers.clear()
+    }
+
+    accessor.isSignal = true
+    accessor.readonly = true
+    addReactiveArrayMethods(accessor)
+
+    return accessor
+}
+
+export function untrack(fn) {
+    const prevEffect = currentEffect
+    currentEffect = null
+    try {
+        return fn()
+    } finally {
+        currentEffect = prevEffect
+    }
+}
+
+export function watch(source, callback, options = {}) {
+    if (typeof callback !== 'function') {
+        console.warn('[framework] watch() callback must be a function')
+        return () => { }
+    }
+
+    const { immediate = false, equals = Object.is } = options
+    const { getter, isMultiSource } = normalizeWatchSource(source)
+
+    let initialized = false
+    let oldValue
+    const cleanupRef = { fn: null }
+
+    const onCleanup = (fn) => {
+        if (typeof fn !== 'function') {
+            console.warn('[framework] onCleanup() expects a function')
+            return
+        }
+        cleanupRef.fn = fn
+    }
+
+    const stopEffect = effect(() => {
+        const newValue = getter()
+
+        if (!initialized) {
+            initialized = true
+            oldValue = cloneWatchValue(newValue, isMultiSource)
+            if (immediate) {
+                untrack(() => callback(newValue, undefined, onCleanup))
+            }
+            return
+        }
+
+        if (!hasWatchChanged(newValue, oldValue, isMultiSource, equals)) {
+            return
+        }
+
+        const previousValue = oldValue
+        oldValue = cloneWatchValue(newValue, isMultiSource)
+
+        runWatchCleanup(cleanupRef)
+        untrack(() => callback(newValue, previousValue, onCleanup))
+    })
+
+    return () => {
+        stopEffect()
+        runWatchCleanup(cleanupRef)
+    }
+}
+
+export function inspect(...args) {
+    const isDev = typeof import.meta.env !== 'undefined' ? !!import.meta.env.DEV : true
+    if (!isDev) return
+
+    return effect(() => {
+        const values = args.map(arg => {
+            if (typeof arg === 'function') {
+                return arg()
+            }
+            return arg
+        })
+        console.log('[inspect]', ...values)
+    })
+}
+
+function addReactiveArrayMethods(accessor) {
+    // Transformations
+    accessor.map = (fn) => computed(() => accessor()?.map?.(fn) ?? [])
+    accessor.filter = (fn) => computed(() => accessor()?.filter?.(fn) ?? [])
+    accessor.slice = (...args) => computed(() => accessor()?.slice?.(...args) ?? [])
+    accessor.concat = (...args) => computed(() => accessor()?.concat?.(...args) ?? [])
+    accessor.flat = (depth) => computed(() => accessor()?.flat?.(depth) ?? [])
+    accessor.flatMap = (fn) => computed(() => accessor()?.flatMap?.(fn) ?? [])
+
+    // Searches
+    accessor.find = (fn) => computed(() => accessor()?.find?.(fn))
+    accessor.findLast = (fn) => computed(() => accessor()?.findLast?.(fn))
+    accessor.findIndex = (fn) => computed(() => accessor()?.findIndex?.(fn))
+    accessor.findLastIndex = (fn) => computed(() => accessor()?.findLastIndex?.(fn))
+    accessor.indexOf = (searchElement, fromIdx) => computed(() => accessor()?.indexOf?.(searchElement, fromIdx))
+    accessor.lastIndexOf = (searchElement, fromIdx) => computed(() => accessor()?.lastIndexOf?.(searchElement, fromIdx))
+    accessor.includes = (searchElement, fromIdx) => computed(() => accessor()?.includes?.(searchElement, fromIdx))
+
+    // Validations
+    accessor.every = (fn) => computed(() => accessor()?.every?.(fn))
+    accessor.some = (fn) => computed(() => accessor()?.some?.(fn))
+
+    // Accumulators & Access
+    accessor.reduce = (...args) => computed(() => accessor()?.reduce?.(...args))
+    accessor.at = (index) => computed(() => accessor()?.at?.(index))
+    accessor.join = (separator) => computed(() => accessor()?.join?.(separator) ?? '')
+}
+
+function addMutatingArrayMethods(accessor) {
+    accessor.push = (...items) => {
+        const next = [...accessor(), ...items]
+        accessor(next)
+        return next.length
+    }
+
+    accessor.pop = () => {
+        const arr = accessor()
+        if (arr.length === 0) return undefined
+        const item = arr[arr.length - 1]
+        accessor(arr.slice(0, -1))
+        return item
+    }
+
+    accessor.shift = () => {
+        const arr = accessor()
+        if (arr.length === 0) return undefined
+        const item = arr[0]
+        accessor(arr.slice(1))
+        return item
+    }
+
+    accessor.unshift = (...items) => {
+        const next = [...items, ...accessor()]
+        accessor(next)
+        return next.length
+    }
+
+    accessor.splice = (start, deleteCount, ...items) => {
+        const arr = [...accessor()]
+        const removed = arr.splice(start, deleteCount, ...items)
+        accessor(arr)
+        return removed
+    }
+
+    accessor.remove = (predicate) => {
+        accessor(accessor().filter((item, i) => !predicate(item, i)))
+    }
+
+    accessor.clear = () => {
+        accessor([])
+    }
+
+    accessor.sort = (compareFn) => {
+        const next = [...accessor()].sort(compareFn)
+        accessor(next)
+        return accessor
+    }
+
+    accessor.reverse = () => {
+        const next = [...accessor()].reverse()
+        accessor(next)
+        return accessor
+    }
+}
+
+function normalizeWatchSource(source) {
+    if (Array.isArray(source)) {
+        const getters = source.map(normalizeSingleWatchSource)
+        return {
+            getter: () => getters.map(get => get()),
+            isMultiSource: true
+        }
+    }
+    return {
+        getter: normalizeSingleWatchSource(source),
+        isMultiSource: false
+    }
+}
+
+function normalizeSingleWatchSource(source) {
+    if (typeof source === 'function') return source
+    console.warn('[framework] watch() source should be a signal, getter, or an array of those')
+    return () => source
+}
+
+function cloneWatchValue(value, isMultiSource) {
+    if (isMultiSource && Array.isArray(value)) return value.slice()
+    return value
+}
+
+function hasWatchChanged(newValue, oldValue, isMultiSource, equals) {
+    if (isMultiSource) {
+        if (!Array.isArray(oldValue) || newValue.length !== oldValue.length) return true
+        for (let i = 0; i < newValue.length; i++) {
+            if (!equals(newValue[i], oldValue[i])) return true
+        }
+        return false
+    }
+    return !equals(newValue, oldValue)
+}
+
+function runWatchCleanup(cleanupRef) {
+    if (typeof cleanupRef.fn === 'function') {
+        const fn = cleanupRef.fn
+        cleanupRef.fn = null
+        untrack(() => fn())
+    }
+}

package/create-fusee-go/internal/assets/embed/framework/core/store.js

@@ -0,0 +1,81 @@
+import { getCurrentInstance, setCurrentInstance } from './component.js'
+
+const storesRegistry = new Map()
+const storePlugins = []
+
+export function registerStorePlugin(plugin) {
+    if (typeof plugin === 'function') {
+        storePlugins.push(plugin)
+    }
+}
+
+const isDev = typeof import.meta.env !== 'undefined' ? !!import.meta.env.DEV : true
+if (isDev && typeof window !== 'undefined') {
+    window.__FRAMEWORK_STORES__ = storesRegistry
+}
+
+export function defineStore(id, setup) {
+    if (typeof id !== 'string' || !id.trim()) {
+        console.error('[framework] defineStore requires a valid string ID.')
+    }
+
+    function useStore() {
+        let store = storesRegistry.get(id)
+
+        if (!store) {
+            const prevInstance = getCurrentInstance()
+
+            setCurrentInstance(null)
+
+            try {
+                store = setup()
+
+                if (store instanceof Promise) {
+                    console.error(`[framework] Store "${id}" cannot be async.`)
+                    throw new Error(`Async store "${id}" is not supported.`)
+                }
+
+            } catch (err) {
+                console.error(`[framework] Error initializing store "${id}":`, err)
+                throw err
+            } finally {
+                setCurrentInstance(prevInstance)
+            }
+
+            Object.defineProperties(store, {
+                $id: {
+                    value: id,
+                    enumerable: false
+                },
+                $type: {
+                    value: 'store',
+                    enumerable: false
+                }
+            })
+
+            for (const plugin of storePlugins) {
+                try {
+                    plugin(store, id)
+                } catch (e) {
+                    console.warn(`[framework] Store plugin error for "${id}":`, e)
+                }
+            }
+
+            storesRegistry.set(id, store)
+        }
+
+        return store
+    }
+
+    useStore.$id = id
+
+    return useStore
+}
+
+export function resetStore(id) {
+    storesRegistry.delete(id)
+}
+
+export function clearStores() {
+    storesRegistry.clear()
+}

package/create-fusee-go/internal/assets/embed/framework/index.d.ts

@@ -0,0 +1,3 @@
+// ─── Fusée Framework Main Types ──────────────────────────────────────────────
+
+export * from './types/index'

package/create-fusee-go/internal/assets/embed/framework/index.js

@@ -0,0 +1,10 @@
+// ─── Framework Public API ─────────────────────────────────────────────────────
+export { signal, computed, effect, batch, untrack, inspect, watch, onCleanup } from './core/signal.js'
+export { defineComponent, defineAsyncComponent, onMount, onUnmount, parseSlots, provide, inject, getCurrentInstance } from './core/component.js'
+export { createRouter, navigate, mountOutlet, currentRoute, routeParams, matchedRoutes } from './router/router.js'
+export { generateRoutes } from './router/file-router.js'
+export { mountTemplate } from './core/compiler.js'
+export { defineComposable, assertSetupContext } from './core/composable.js'
+export { defineStore, resetStore, clearStores, registerStorePlugin } from './core/store.js'
+export { directive } from './core/directives.js'
+export const emit = () => console.warn('[framework] emit() can only be used inside component setup()')

package/create-fusee-go/internal/assets/embed/framework/router/file-router.js

@@ -0,0 +1,177 @@
+import { defineAsyncComponent } from '../core/component.js';
+
+export function generateRoutes(globResults, options = {}) {
+    const entries = _parseGlobEntries(globResults, options);
+    const tree = _buildRouteTree(entries, false);
+    _sortRoutesRecursive(tree);
+    return tree;
+}
+
+function _parseGlobEntries(globResults, options) {
+    const entries = [];
+
+    for (const filePath of Object.keys(globResults)) {
+        const loader = globResults[filePath];
+
+        let cleanPath = filePath
+            .replace(/^\.?\/?app\/pages\//, '')
+            .replace(/^\.?\/?pages\//, '')
+            .replace(/\.[jt]sx?$/, '');
+
+        const parts = cleanPath.split('/');
+        const rawFileName = parts.pop();
+        const rawDirSegments = parts;
+
+        const dirSegments = rawDirSegments.map(_transformSegment);
+        const fileName = _transformSegment(rawFileName);
+
+        const isIndex = rawFileName === 'index';
+        const isCatchAll = /^\[\.\.\./.test(rawFileName);
+
+        entries.push({
+            filePath,
+            loader,
+            dirSegments,
+            fileName,
+            isIndex,
+            isCatchAll,
+            component: defineAsyncComponent({
+                loader,
+                loadingComponent: options.loadingComponent
+            })
+        });
+    }
+
+    return entries;
+}
+
+function _transformSegment(seg) {
+    return seg
+        .replace(/\[\.\.\.([^\]]+)\]/g, '*')
+        .replace(/\[([^\]]+)\]/g, ':$1');
+}
+
+function _buildRouteTree(entries, isChild) {
+    const filesHere = new Map();
+    const grouped = new Map();
+
+    for (const entry of entries) {
+        if (entry.dirSegments.length === 0) {
+            filesHere.set(entry.fileName, entry);
+        } else {
+            const firstDir = entry.dirSegments[0];
+            if (!grouped.has(firstDir)) grouped.set(firstDir, []);
+            grouped.get(firstDir).push(entry);
+        }
+    }
+
+    let rootLayoutEntry = null;
+    if (filesHere.has('_layout')) {
+        rootLayoutEntry = filesHere.get('_layout');
+        filesHere.delete('_layout');
+    }
+
+    const routes = [];
+    const usedAsLayout = new Set();
+
+    for (const [dirName, dirEntries] of grouped) {
+        const layoutEntry = filesHere.get(dirName);
+
+        if (layoutEntry) {
+            usedAsLayout.add(dirName);
+
+            const childEntries = dirEntries.map(e => ({
+                ...e,
+                dirSegments: e.dirSegments.slice(1)
+            }));
+
+            const children = _buildRouteTree(childEntries, true);
+
+            routes.push({
+                path: isChild ? dirName : '/' + dirName,
+                component: layoutEntry.component,
+                children
+            });
+        } else {
+            for (const entry of dirEntries) {
+                const segments = [...entry.dirSegments];
+                if (!entry.isIndex) segments.push(entry.fileName);
+
+                const routePath = isChild
+                    ? segments.join('/')
+                    : '/' + segments.join('/');
+
+                routes.push({
+                    path: routePath,
+                    component: entry.component
+                });
+            }
+        }
+    }
+
+    for (const [name, entry] of filesHere) {
+        if (usedAsLayout.has(name)) continue;
+
+        if (entry.isIndex) {
+            routes.push({ path: isChild ? '' : '/', component: entry.component });
+        } else if (entry.isCatchAll || name === '*') {
+            routes.push({ path: '*', component: entry.component });
+        } else {
+            routes.push({
+                path: isChild ? name : '/' + name,
+                component: entry.component
+            });
+        }
+    }
+
+    if (rootLayoutEntry) {
+        return [{
+            path: '',
+            component: rootLayoutEntry.component,
+            children: routes
+        }];
+    }
+
+    return routes;
+}
+
+function _sortRoutesRecursive(routes) {
+    routes.sort(_compareRoutes);
+    for (const route of routes) {
+        if (route.children) _sortRoutesRecursive(route.children);
+    }
+}
+
+function _getPathArray(path) {
+    return Array.isArray(path) ? path : [path];
+}
+
+function _compareRoutes(a, b) {
+    const aPaths = _getPathArray(a.path);
+    const bPaths = _getPathArray(b.path);
+    
+    const aPath = aPaths[0];
+    const bPath = bPaths[0];
+    
+    if (aPath === '*' && bPath !== '*') return 1;
+    if (aPath !== '*' && bPath === '*') return -1;
+
+    const aWild = aPath.endsWith('/*');
+    const bWild = bPath.endsWith('/*');
+    if (aWild && !bWild) return 1;
+    if (!aWild && bWild) return -1;
+
+    const aDynamic = aPath.includes(':');
+    const bDynamic = bPath.includes(':');
+    if (aDynamic && !bDynamic) return 1;
+    if (!aDynamic && bDynamic) return -1;
+
+    if (a.children && !b.children) return -1;
+    if (!a.children && b.children) return 1;
+
+    const aSegs = aPath.split('/').filter(Boolean).length;
+    const bSegs = bPath.split('/').filter(Boolean).length;
+    if (aSegs !== bSegs) return bSegs - aSegs;
+
+    return bPath.length - aPath.length;
+}