@ossy/router 0.0.1-beta.0

package/build/esm/data.mock.d.ts

@@ -0,0 +1,22 @@
+import { MultiLanguagePage, SingleLanguagePage } from './router';
+export interface ExtendedSingleLangaugePage extends SingleLanguagePage {
+    matchingUrls: string[];
+}
+export interface ExtendedMultiLanguagePage extends MultiLanguagePage {
+    matchingUrls: string[];
+}
+export declare class MockData {
+    static getPagesForSingleLanguageRouter(): {
+        id: string;
+        path: string;
+        matchingUrls: string[];
+    }[];
+    static getPagesForMultiLanguageRouter(): {
+        id: string;
+        path: {
+            en: string;
+            es: string;
+        };
+        matchingUrls: string[];
+    }[];
+}

package/build/esm/public.index.d.ts

@@ -0,0 +1 @@
+export * from './router';

package/build/esm/public.index.js

@@ -0,0 +1 @@
+export { Router } from './router.js';

package/build/esm/router.d.ts

@@ -0,0 +1,39 @@
+export interface SingleLanguagePage {
+    id: string;
+    path: string;
+}
+export interface MultiLanguagePage {
+    id: string;
+    path: {
+        [language: string]: string;
+    };
+}
+export type Page = SingleLanguagePage | MultiLanguagePage;
+export interface RouterOptions<T extends Page = Page> {
+    pages: T[];
+    /** Required for multi language router */
+    defaultLanguage?: string;
+    /** Required for multi language router */
+    supportedLanguages?: string[];
+}
+/** Router
+ *
+ * Handles
+ * - build href from route id
+ *
+ * */
+export declare class Router<T extends Page = Page> {
+    static of<T extends Page = Page>(options: RouterOptions<T>): Router<T>;
+    pages: T[];
+    defaultLanguage?: string;
+    supportedLanguages?: string[];
+    constructor({ pages, defaultLanguage, supportedLanguages }: RouterOptions<T>);
+    getPageById(id: string): T | undefined;
+    getPageByUrl(_url: string): T | undefined;
+    getParamsFromUrl(_url: string): Record<string, string>;
+    getPathname({ id, params, language }: {
+        id: string;
+        params?: Record<string, string>;
+        language?: string;
+    }): string | undefined;
+}

package/build/esm/router.js

@@ -0,0 +1,144 @@
+import { padWithSlash } from './utli.js';
+
+/** Router
+ *
+ * Handles
+ * - build href from route id
+ *
+ * */
+class Router {
+    static of(options) {
+        return new Router(options);
+    }
+    constructor({ pages, defaultLanguage, supportedLanguages }) {
+        this.pages = pages || [];
+        this.defaultLanguage = defaultLanguage;
+        this.supportedLanguages = supportedLanguages || [];
+    }
+    getPageById(id) {
+        var _a;
+        return (_a = this.pages.find(page => page.id === id)) !== null && _a !== void 0 ? _a : this.pages.find(page => page.id === '404');
+    }
+    getPageByUrl(_url) {
+        var _a, _b;
+        console.log('[Router][getPageByUrl()] _url', _url);
+        console.log('[Router][getPageByUrl()] this.pages?.length', (_a = this.pages) === null || _a === void 0 ? void 0 : _a.length);
+        if (typeof _url !== 'string' || ((_b = this.pages) === null || _b === void 0 ? void 0 : _b.length) === 0)
+            return;
+        let url;
+        try {
+            url = new URL(_url);
+        }
+        catch (_c) {
+            // If url is not valid, try to parse it with localhost.com fince URL needs domain, but it wont be used
+            url = new URL(_url, 'http://localhost.com');
+        }
+        console.log('[Router][getPageByUrl()] url', url);
+        const pathname = padWithSlash(url.pathname);
+        const pathnameParts = pathname.split('/').filter(x => !!x);
+        console.log('[Router][getPageByUrl()] pathname', pathname);
+        console.log('[Router][getPageByUrl()] pathnameParts', pathnameParts);
+        const exactMatch = this.pages.find(page => {
+            const paths = typeof page.path === 'string'
+                ? [page.path]
+                : Object.entries(page.path).map(([language, path]) => `/${language}${path}`);
+            return paths.map(padWithSlash).includes(pathname);
+        });
+        console.log('[Router][getPageByUrl()] exactMatch', exactMatch);
+        if (exactMatch)
+            return exactMatch;
+        const dynamicMatch = this.pages.find(page => {
+            // take path from page and find positions of params
+            // then take params from url and insert them into url
+            // then see if url matches
+            const paths = typeof page.path === 'string'
+                ? [page.path]
+                : Object.entries(page.path).map(([language, path]) => `/${language}${path}`);
+            const matchContenders = paths.map(path => path
+                .split('/')
+                .filter(x => !!x)
+                .reduce((contender, part, index) => {
+                return part.startsWith(':')
+                    ? contender + pathnameParts[index] + '/'
+                    : contender + part + '/';
+            }, '/'));
+            return matchContenders.includes(pathname);
+        });
+        console.log('[Router][getPageByUrl()] dynamicMatch', dynamicMatch);
+        return dynamicMatch;
+    }
+    getParamsFromUrl(_url) {
+        var _a;
+        if (typeof _url !== 'string' || ((_a = this.pages) === null || _a === void 0 ? void 0 : _a.length) === 0)
+            return {};
+        let url;
+        try {
+            url = new URL(_url);
+        }
+        catch (_b) {
+            // If url is not valid, try to parse it with localhost.com fince URL needs domain, but it wont be used
+            url = new URL(_url, 'http://localhost.com');
+        }
+        const pathname = padWithSlash(url.pathname);
+        const pathnameParts = pathname.split('/').filter(x => !!x);
+        const page = this.getPageByUrl(_url);
+        let params = {};
+        if (typeof (page === null || page === void 0 ? void 0 : page.path) === 'string') {
+            const pageParts = page.path.split('/').filter(x => !!x);
+            pageParts.forEach((part, index) => {
+                if (part.startsWith(':')) {
+                    params[part.slice(1)] = pathnameParts[index];
+                }
+            });
+        }
+        if (typeof (page === null || page === void 0 ? void 0 : page.path) === 'object') {
+            const language = pathname.split('/')[1];
+            const pageParts = page.path[language].split('/').filter(x => !!x);
+            pageParts.forEach((part, index) => {
+                if (part.startsWith(':')) {
+                    params[part.slice(1)] = pathnameParts[index + 1];
+                }
+            });
+        }
+        return params;
+    }
+    getPathname({ id, params, language }) {
+        const page = this.getPageById(id);
+        if (!page)
+            return undefined;
+        let pathnameTemplate = page.path;
+        if (typeof pathnameTemplate === 'object') {
+            if (!language)
+                throw new Error('[Router][getPathname()] Language is required for multi language router');
+            if (!params)
+                return '/' + language + pathnameTemplate[language];
+            return pathnameTemplate[language]
+                .split('/')
+                .filter(x => !!x)
+                .reduce((pathanme, part) => {
+                if (part.startsWith(':')) {
+                    const key = part.replace(':', '');
+                    return pathanme + '/' + params[key];
+                }
+                return pathanme + '/' + part;
+            }, `/${language}`);
+        }
+        if (typeof pathnameTemplate === 'string') {
+            if (!params)
+                return pathnameTemplate;
+            return pathnameTemplate
+                .split('/')
+                .filter(x => !!x)
+                .reduce((pathanme, part) => {
+                if (part.startsWith(':')) {
+                    const key = part.replace(':', '');
+                    return pathanme + '/' + params[key];
+                }
+                return pathanme + '/' + part;
+            }, '');
+        }
+        return undefined;
+    }
+}
+
+export { Router };

package/build/esm/router.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/build/esm/utli.d.ts

@@ -0,0 +1 @@
+export declare const padWithSlash: (string?: string) => string;

package/build/esm/utli.js

@@ -0,0 +1,7 @@
+const appendSlash = (string) => string[string.length - 1] === '/'
+    ? string : `${string}/`;
+const prependSlash = (string) => string[0] === '/'
+    ? string : `/${string}`;
+const padWithSlash = (string = '') => appendSlash(prependSlash(string));
+
+export { padWithSlash };

package/build/public.index.d.ts

@@ -0,0 +1,41 @@
+interface SingleLanguagePage {
+    id: string;
+    path: string;
+}
+interface MultiLanguagePage {
+    id: string;
+    path: {
+        [language: string]: string;
+    };
+}
+type Page = SingleLanguagePage | MultiLanguagePage;
+interface RouterOptions<T extends Page = Page> {
+    pages: T[];
+    /** Required for multi language router */
+    defaultLanguage?: string;
+    /** Required for multi language router */
+    supportedLanguages?: string[];
+}
+/** Router
+ *
+ * Handles
+ * - build href from route id
+ *
+ * */
+declare class Router<T extends Page = Page> {
+    static of<T extends Page = Page>(options: RouterOptions<T>): Router<T>;
+    pages: T[];
+    defaultLanguage?: string;
+    supportedLanguages?: string[];
+    constructor({ pages, defaultLanguage, supportedLanguages }: RouterOptions<T>);
+    getPageById(id: string): T | undefined;
+    getPageByUrl(_url: string): T | undefined;
+    getParamsFromUrl(_url: string): Record<string, string>;
+    getPathname({ id, params, language }: {
+        id: string;
+        params?: Record<string, string>;
+        language?: string;
+    }): string | undefined;
+}
+
+export { type MultiLanguagePage, type Page, Router, type RouterOptions, type SingleLanguagePage };

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@ossy/router",
+  "version": "0.0.1-beta.0",
+  "description": "",
+  "type": "module",
+  "source": "src/public.index.ts",
+  "module": "build/esm/public.index.js",
+  "main": "build/cjs/public.index.js",
+  "types": "build/public.index.d.ts",
+  "files": [
+    "/build",
+    "README.md"
+  ],
+  "scripts": {
+    "start": "storybook dev -p 6006",
+    "build": "rollup -c rollup.config.js",
+    "test": "jest --verbose",
+    "test:watch": "jest --watch"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@jest/globals": "^29.7.0",
+    "@rollup/plugin-commonjs": "^25.0.5",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-typescript": "^11.1.5",
+    "@types/react": "18.2.79",
+    "@types/react-dom": "18.2.18",
+    "autoprefixer": "^10.4.16",
+    "casual": "^1.6.2",
+    "jest": "^29.7.0",
+    "rollup": "^4.6.0",
+    "rollup-plugin-dts": "^6.1.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss-modules": "^2.1.1",
+    "rollup-plugin-preserve-directives": "^0.4.0",
+    "ts-jest": "^29.1.1",
+    "tslib": "^2.6.2"
+  },
+  "peerDependencies": {
+    "typescript": "4 - 5"
+  }
+}