crelte 0.1.0

package/dist/routing/Router.js

@@ -0,0 +1,333 @@
+import Route from './Route.js';
+import InnerRouter from './InnerRouter.js';
+import PageLoader from './PageLoader.js';
+import { Writable } from 'crelte-std/stores';
+import { Barrier, Listeners } from 'crelte-std/sync';
+const defaultRouterOpts = {
+    preloadOnMouseOver: false,
+    deubgTiming: false,
+};
+export function trimSlashEnd(str) {
+    return str.endsWith('/') ? str.substring(0, str.length - 1) : str;
+}
+// Make sure route and nextRoute are not the same object as _inner.route
+export default class Router {
+    /**
+     * The current route
+     */
+    _route;
+    /**
+     * The current site
+     */
+    _site;
+    /**
+     * The next route which is currently being loaded
+     */
+    _nextRoute;
+    /**
+     * The next site which is currently being loaded
+     */
+    _nextSite;
+    /**
+     * The loading flag, specifies if a page is currently
+     * getting loaded
+     */
+    _loading;
+    /**
+     * The loading progress, the value is between 0 and 1
+     */
+    _loadingProgress;
+    _onRouteEv;
+    _onNextRoute;
+    _renderBarrier;
+    // doc hidden
+    _internal;
+    inner;
+    pageLoader;
+    constructor(sites, opts = {}) {
+        opts = { ...defaultRouterOpts, ...opts };
+        this.inner = new InnerRouter(sites, {
+            preloadOnMouseOver: opts.preloadOnMouseOver,
+        });
+        this.pageLoader = new PageLoader({
+            debugTiming: opts.debugTiming,
+        });
+        // in the first onRoute call we will update this value
+        this._route = new Writable(null);
+        this._site = new Writable(null);
+        this._nextRoute = new Writable(null);
+        this._nextSite = new Writable(null);
+        this._loading = new Writable(false);
+        this._loadingProgress = new Writable(0);
+        this._onRouteEv = new Listeners();
+        this._onNextRoute = new Listeners();
+        this._renderBarrier = null;
+        this._internal = {
+            onLoaded: () => { },
+            onLoad: () => { },
+            domReady: route => this.inner.domReady(route),
+            initClient: () => this._initClient(),
+            initServer: (url, acceptLang) => this._initServer(url, acceptLang),
+        };
+        this.inner.onRoute = (route, site, changeHistory) => this._onRoute(route, site, changeHistory);
+        this.inner.onPreload = (route, site) => this._onPreload(route, site);
+        this.pageLoader.onLoaded = (resp, route, site, more) => this._onLoaded(resp, route, site, more);
+        this.pageLoader.loadFn = (route, site, opts) => this._internal.onLoad(route, site, opts);
+        this.pageLoader.onProgress = (loading, progress) => this._onProgress(loading, progress);
+    }
+    /**
+     * The current route
+     *
+     * this is a svelte store
+     */
+    get route() {
+        return this._route.readclone();
+    }
+    /**
+     * The current site
+     */
+    get site() {
+        return this._site.readonly();
+    }
+    /**
+     * The next route which is currently being loaded
+     */
+    get nextRoute() {
+        return this._nextRoute.readclone();
+    }
+    /**
+     * The next site which is currently being loaded
+     */
+    get nextSite() {
+        return this._nextSite.readonly();
+    }
+    /**
+     * The sites which are available
+     */
+    get sites() {
+        return this.inner.sites;
+    }
+    /**
+     * The loading flag, specifies if a page is currently
+     * getting loaded
+     */
+    get loading() {
+        return this._loading.readonly();
+    }
+    /**
+     * The loading progress, the value is between 0 and 1
+     */
+    get loadingProgress() {
+        return this._loadingProgress.readonly();
+    }
+    /**
+     * Open a new route
+     *
+     * @param target the target to open can be an url or a route
+     * the url needs to start with http or with a / which will be considered as
+     * the site baseUrl
+     */
+    open(target) {
+        this.inner.open(target);
+    }
+    /**
+     * This pushes the state of the route without triggering an event
+     *
+     * You can use this when using pagination for example change the route object
+     * (search argument) and then call pushState
+     *
+     * @param route
+     */
+    pushState(route) {
+        this.pageLoader.discard();
+        this.inner.pushState(route);
+        this.setNewRoute(route);
+    }
+    /**
+     * This replaces the state of the route without triggering an event
+     *
+     * @param route
+     */
+    replaceState(route) {
+        this.pageLoader.discard();
+        this.inner.replaceState(route);
+        this.setNewRoute(route);
+    }
+    /**
+     * Checks if there are previous routes which would allow it to go back
+     */
+    canGoBack() {
+        return this.inner.route?.canGoBack() ?? false;
+    }
+    /**
+     * Go back in the history
+     */
+    back() {
+        window.history.back();
+    }
+    /**
+     * Preload a url
+     */
+    preload(target) {
+        this.inner.preload(target);
+    }
+    /**
+     * Add a listener for the onRoute event
+     *
+     * This differs from router.route.subscribe in the way that
+     * it will only trigger if a new render / load will occur
+     */
+    onRoute(fn) {
+        return this._onRouteEv.add(fn);
+    }
+    onNextRoute(fn) {
+        return this._onNextRoute.add(fn);
+    }
+    setNewRoute(route) {
+        this._route.setSilent(route);
+        this._nextRoute.setSilent(route);
+        if (route.site) {
+            this._site.setSilent(route.site);
+            this._nextSite.setSilent(route.site);
+        }
+        this._nextRoute.notify();
+        this._route.notify();
+        if (route.site) {
+            this._nextSite.notify();
+            this._site.notify();
+        }
+    }
+    async _initClient() {
+        this.inner.initClient();
+    }
+    async _initServer(url, acceptLang) {
+        this.inner.initServer();
+        const prom = new Promise(resolve => {
+            this._internal.onLoaded = (success, route, site, ready) => {
+                const props = ready();
+                this._internal.onLoaded = () => { };
+                resolve({
+                    success,
+                    redirect: false,
+                    route,
+                    site,
+                    props,
+                });
+            };
+        });
+        const route = this.inner.targetToRoute(url);
+        route.origin = 'init';
+        // let's see if the url matches any route and site
+        // if not let's redirect to the site which matches the acceptLang
+        if (!route.site) {
+            const site = this.inner.siteByAcceptLang(acceptLang);
+            return {
+                success: true,
+                redirect: true,
+                route: new Route(site.url, site),
+                site,
+                props: {},
+            };
+        }
+        const hist = this.inner.history;
+        if (hist.url) {
+            const nRoute = new Route(hist.url, null);
+            if (!route.eq(nRoute)) {
+                return {
+                    success: true,
+                    redirect: true,
+                    route: nRoute,
+                    site: route.site,
+                    props: {},
+                };
+            }
+        }
+        this.inner.setRoute(route);
+        return await prom;
+    }
+    _onRoute(route, site, changeHistory) {
+        this._nextRoute.setSilent(route);
+        const siteChanged = this.nextSite.get()?.id !== site.id;
+        this._nextSite.setSilent(site);
+        this._nextRoute.notify();
+        if (siteChanged)
+            this._nextSite.notify();
+        if (this._renderBarrier) {
+            const barr = this._renderBarrier;
+            this._renderBarrier = null;
+            // make sure nobody waits forevery
+            barr.cancel();
+        }
+        const barrier = new RenderBarrier();
+        this._renderBarrier = barrier;
+        this._onNextRoute.trigger(route.clone(), site, {
+            delayRender: () => barrier.add(),
+        });
+        // route prepared
+        this.pageLoader.load(route.clone(), site, { changeHistory });
+    }
+    _onPreload(route, site) {
+        this.pageLoader.preload(route, site);
+    }
+    async _onLoaded(resp, route, site, more) {
+        // we need to wait on the renderBarrier
+        const renderBarrier = this._renderBarrier;
+        if (renderBarrier) {
+            // check if the render was cancelled
+            if (await renderBarrier.ready())
+                return;
+            this._renderBarrier = null;
+        }
+        // when the data is loaded let's update the route of the inner
+        // this is will only happen if no other route has been requested
+        // in the meantime
+        more.changeHistory();
+        const updateRoute = () => {
+            this._route.setSilent(route);
+            const siteChanged = this.site.get()?.id !== site.id;
+            this._site.setSilent(site);
+            this._route.notify();
+            if (siteChanged)
+                this._site.notify();
+            this._onRouteEv.trigger(route.clone(), site);
+        };
+        this._internal.onLoaded(resp.success, route, site, () => {
+            updateRoute();
+            return resp.data;
+        });
+    }
+    _onProgress(loading, progress) {
+        if (this._loading.get() !== loading)
+            this._loading.set(loading);
+        if (typeof progress === 'number')
+            this._loadingProgress.set(progress);
+    }
+}
+class RenderBarrier {
+    inner;
+    cancelled;
+    root;
+    constructor() {
+        this.inner = new Barrier();
+        this.cancelled = false;
+        this.root = this.add();
+    }
+    add() {
+        const action = this.inner.add();
+        return {
+            ready: async () => {
+                await action.ready(null);
+                return this.cancelled;
+            },
+            remove: () => action.remove(),
+        };
+    }
+    cancel() {
+        this.cancelled = true;
+        this.root.remove();
+    }
+    // returns if the render was cancelled
+    ready() {
+        return this.root.ready();
+    }
+}

package/dist/routing/Site.d.ts

@@ -0,0 +1,47 @@
+export type SiteFromGraphQl = {
+    id: number;
+    baseUrl: string;
+    language: string;
+    name: string | null;
+    handle: string;
+    primary: boolean;
+};
+/**
+ * Craft Site
+ */
+export default class Site {
+    /**
+     * The id of the site
+     */
+    id: number;
+    /**
+     * The base url of the site
+     */
+    url: URL;
+    /**
+     * The language of the site
+     *
+     * ex: de-CH
+     */
+    language: string;
+    /**
+     * The name of the site
+     */
+    name: string | null;
+    /**
+     * The handle of the site
+     */
+    handle: string;
+    /**
+     * Is this the primary site
+     */
+    primary: boolean;
+    constructor(obj: SiteFromGraphQl);
+    /**
+     * Returns the uri of the site
+     *
+     * Never ends with a slash
+     */
+    get uri(): string;
+}
+//# sourceMappingURL=Site.d.ts.map

package/dist/routing/Site.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Site.d.ts","sourceRoot":"","sources":["../../../../src/routing/Site.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,eAAe,GAAG;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,IAAI;IACxB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,GAAG,EAAE,GAAG,CAAC;IAET;;;;OAIG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpB;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;gBAEL,GAAG,EAAE,eAAe;IAShC;;;;OAIG;IACH,IAAI,GAAG,IAAI,MAAM,CAEhB;CACD"}

package/dist/routing/Site.js

@@ -0,0 +1,48 @@
+import { trimSlashEnd } from './Router.js';
+/**
+ * Craft Site
+ */
+export default class Site {
+    /**
+     * The id of the site
+     */
+    id;
+    /**
+     * The base url of the site
+     */
+    url;
+    /**
+     * The language of the site
+     *
+     * ex: de-CH
+     */
+    language;
+    /**
+     * The name of the site
+     */
+    name;
+    /**
+     * The handle of the site
+     */
+    handle;
+    /**
+     * Is this the primary site
+     */
+    primary;
+    constructor(obj) {
+        this.id = obj.id;
+        this.url = new URL(obj.baseUrl);
+        this.language = obj.language;
+        this.name = obj.name;
+        this.handle = obj.handle;
+        this.primary = obj.primary;
+    }
+    /**
+     * Returns the uri of the site
+     *
+     * Never ends with a slash
+     */
+    get uri() {
+        return trimSlashEnd(this.url.pathname);
+    }
+}

package/dist/routing/index.d.ts

@@ -0,0 +1,5 @@
+import Router, { type DelayRender, type OnNextRouteOpts } from './Router.js';
+import Route from './Route.js';
+import Site from './Site.js';
+export { Router, Route, Site, OnNextRouteOpts, DelayRender };
+//# sourceMappingURL=index.d.ts.map

package/dist/routing/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/routing/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,KAAK,WAAW,EAAE,KAAK,eAAe,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,IAAI,MAAM,WAAW,CAAC;AAE7B,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,eAAe,EAAE,WAAW,EAAE,CAAC"}

package/dist/routing/index.js

@@ -0,0 +1,4 @@
+import Router from './Router.js';
+import Route from './Route.js';
+import Site from './Site.js';
+export { Router, Route, Site };

package/dist/ssr/SsrCache.d.ts

@@ -0,0 +1,12 @@
+export declare function calcKey(data: any): Promise<string>;
+export default class SsrCache {
+    private store;
+    constructor();
+    load<T>(key: string, fn: () => Promise<T>): Promise<any>;
+    get<T>(key: string): T | null;
+    set<T>(key: string, val: T): T;
+    clear(): void;
+    private exportAsJson;
+    _exportToHead(): string;
+}
+//# sourceMappingURL=SsrCache.d.ts.map

package/dist/ssr/SsrCache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SsrCache.d.ts","sourceRoot":"","sources":["../../../../src/ssr/SsrCache.ts"],"names":[],"mappings":"AAAA,wBAAsB,OAAO,CAAC,IAAI,EAAE,GAAG,mBAetC;AAED,MAAM,CAAC,OAAO,OAAO,QAAQ;IAC5B,OAAO,CAAC,KAAK,CAAsB;;IAa7B,IAAI,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC;IAQ/C,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,GAAG,CAAC,GAAG,IAAI;IAI7B,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC;IAI9B,KAAK;IAKL,OAAO,CAAC,YAAY;IAKpB,aAAa,IAAI,MAAM;CAGvB"}

package/dist/ssr/SsrCache.js

@@ -0,0 +1,50 @@
+export async function calcKey(data) {
+    // Convert the string data to an ArrayBuffer
+    const encoder = new TextEncoder();
+    const dataBuffer = encoder.encode(JSON.stringify(data));
+    // Use the Web Crypto API to hash the data with SHA-1
+    const hashBuffer = await crypto.subtle.digest('SHA-1', dataBuffer);
+    // Convert the ArrayBuffer to a hex string
+    const hashArray = Array.from(new Uint8Array(hashBuffer)); // Create an array from the buffer
+    const hashHex = hashArray
+        .map(b => b.toString(16).padStart(2, '0'))
+        .join(''); // Convert to hex string
+    return hashHex;
+}
+export default class SsrCache {
+    store;
+    constructor() {
+        this.store = {};
+        // @ts-ignore
+        if (typeof window !== 'undefined' && window.SSR_STORE) {
+            // @ts-ignore
+            this.store = window.SSR_STORE;
+        }
+    }
+    /// check if the value is in the cache else calls the fn
+    async load(key, fn) {
+        if (key in this.store)
+            return this.store[key];
+        const v = await fn();
+        this.set(key, v);
+        return v;
+    }
+    /// returns null if the data does not exists
+    get(key) {
+        return this.store[key] ?? null;
+    }
+    set(key, val) {
+        return (this.store[key] = val);
+    }
+    clear() {
+        this.store = {};
+    }
+    // internal
+    exportAsJson() {
+        return JSON.stringify(this.store).replace(/</g, '\\u003c');
+    }
+    // internal
+    _exportToHead() {
+        return `\n\t\t<script>window.SSR_STORE = ${this.exportAsJson()};</script>`;
+    }
+}

package/dist/ssr/SsrComponents.d.ts

@@ -0,0 +1,7 @@
+export default class SsrComponents {
+    private modules;
+    constructor();
+    addToContext(ctx: Map<string, any>): void;
+    toHead(ssrManifest: Record<string, string[]>): string;
+}
+//# sourceMappingURL=SsrComponents.d.ts.map

package/dist/ssr/SsrComponents.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SsrComponents.d.ts","sourceRoot":"","sources":["../../../../src/ssr/SsrComponents.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,aAAa;IACjC,OAAO,CAAC,OAAO,CAAc;;IAO7B,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC;IAOlC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;CAkB5C"}

package/dist/ssr/SsrComponents.js

@@ -0,0 +1,30 @@
+export default class SsrComponents {
+    modules;
+    constructor() {
+        this.modules = new Set();
+    }
+    /// ctx: Map
+    addToContext(ctx) {
+        ctx.set('modules', this.modules);
+    }
+    /// Returns preload for js and link stylesheet for css
+    ///
+    /// ssrManifest: {}, gets generated by client build
+    toHead(ssrManifest) {
+        const requirements = new Set();
+        for (const mod of this.modules) {
+            const deps = ssrManifest[mod] ?? [];
+            deps.forEach(dep => requirements.add(dep));
+        }
+        let head = '';
+        for (const req of requirements) {
+            if (req.endsWith('.js')) {
+                head += `\n\t\t<link rel="preload" href="${req}" as="script">`;
+            }
+            else if (req.endsWith('.css')) {
+                head += `\n\t\t<link rel="stylesheet" href="${req}">`;
+            }
+        }
+        return head;
+    }
+}

package/dist/ssr/index.d.ts

@@ -0,0 +1,4 @@
+import SsrCache from './SsrCache.js';
+import SsrComponents from './SsrComponents.js';
+export { SsrCache, SsrComponents };
+//# sourceMappingURL=index.d.ts.map

package/dist/ssr/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ssr/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,CAAC"}

package/dist/ssr/index.js

@@ -0,0 +1,3 @@
+import SsrCache from './SsrCache.js';
+import SsrComponents from './SsrComponents.js';
+export { SsrCache, SsrComponents };

package/package.json

@@ -0,0 +1,79 @@
+{
+	"name": "crelte",
+	"version": "0.1.0",
+	"author": "Crelte <support@crelte.com>",
+	"type": "module",
+	"scripts": {
+		"check": "prettier -c .",
+		"lint": "eslint ./src",
+		"test": "vitest",
+		"build": "svelte-package -i ./src",
+		"watch": "svelte-package -i ./src -w"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/crelte/crelte"
+	},
+	"files": [
+		"dist",
+		"src"
+	],
+	"module": "dist/index.js",
+	"main": "dist/index.js",
+	"types": "dist/index.d.ts",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"default": "./dist/index.js"
+		},
+		"./client": {
+			"types": "./dist/init/client.d.ts",
+			"default": "./dist/init/client.js"
+		},
+		"./server": {
+			"types": "./dist/init/server.d.ts",
+			"default": "./dist/init/server.js"
+		},
+		"./graphql": {
+			"types": "./dist/graphql/index.d.ts",
+			"default": "./dist/graphql/index.js"
+		},
+		"./routing": {
+			"types": "./dist/routing/index.d.ts",
+			"default": "./dist/routing/index.js"
+		},
+		"./ssr": {
+			"types": "./dist/ssr/index.d.ts",
+			"default": "./dist/ssr/index.js"
+		},
+		"./loadData": {
+			"types": "./dist/loadData/index.d.ts",
+			"default": "./dist/loadData/index.js"
+		},
+		"./plugins": {
+			"types": "./dist/plugins/index.d.ts",
+			"default": "./dist/plugins/index.js"
+		},
+		"./cookies": {
+			"types": "./dist/cookies/index.d.ts",
+			"default": "./dist/cookies/index.js"
+		},
+		"./blocks": {
+			"types": "./dist/blocks/index.d.ts",
+			"default": "./dist/blocks/index.js"
+		}
+	},
+	"dependencies": {
+		"crelte-std": "^0.1.0",
+		"svelte": "^4.2.12"
+	},
+	"devDependencies": {
+		"@sveltejs/package": "^2.3.1",
+		"@sveltejs/vite-plugin-svelte": "^3.0.0",
+		"@tsconfig/svelte": "^5.0.2",
+		"tslib": "^2.6.2",
+		"typescript": "^5.2.2",
+		"typescript-eslint": "^7.11.0",
+		"vitest": "^2.0.0"
+	}
+}