amateras 0.4.1 → 0.5.0

package/ext/idb/src/structure/builder/$IDBBuilder.ts

@@ -0,0 +1,230 @@
+import { $IDB, type $IDBConfig } from "#structure/$IDB";
+import { _Array_from, _instanceof, _JSON_stringify, _null, _Object_assign, _Object_fromEntries, _Promise, forEach, isFunction } from "amateras/lib/native";
+import { $IDBStoreBuilder } from "./$IDBStoreBuilder";
+import type { $IDBIndexConfig } from "#structure/$IDBIndex";
+import type { $IDBStoreConfig } from "#structure/$IDBStore";
+import { trycatch } from "amateras/lib/trycatch";
+// optimizer variables
+const objectStoreNames = 'objectStoreNames';
+const deleteObjectStore = 'deleteObjectStore';
+const createObjectStore = 'createObjectStore';
+const _indexedDB = indexedDB;
+const onupgradeneeded = 'onupgradeneeded';
+const onsuccess = 'onsuccess';
+
+export interface $IDBBuilder {
+    readonly name: string;
+    readonly version: number;
+}
+export class $IDBBuilder<Config extends $IDBConfig = { name: string, stores: {}, version: number }> {
+    #deleteUnused = false;
+    storeMap = new Map<string, $IDBStoreBuilder>();
+    #devMode: boolean = false;
+    constructor(config: Config) {
+        _Object_assign(this, config);
+    }
+
+    /**
+     * This option helping developer to debug when initializing.
+     * @param dev - Enable dev mode
+     */
+    devMode(dev: boolean) {
+        this.#devMode = dev;
+        return this;
+    }
+    
+    /**
+     * If set to true, unused store will be deleted when initialize.
+     * @param enable - Enable delete unused stores
+     */
+    deleteUnused(enable: boolean) {
+        this.#deleteUnused = enable;
+        return this;
+    }
+
+    /**
+     * Add new store to builder.
+     * @param name - Store name
+     * @param builder - Store builder or builder function
+     */
+    store<N extends string, B extends $IDBStoreBuilderFunction>(name: N, builder: B): $IDBBuilder<Prettify<Config & { stores: Config['stores'] & Prettify<Record<N, ReturnType<B>['config']>> }>>
+    store<N extends string, B extends $IDBStoreBuilder<any>>(name: N, builder: B): $IDBBuilder<Prettify<Config & { stores: Config['stores'] & Prettify<Record<N, B['config']>> }>>
+    store(name: string, builder: $IDBStoreBuilderFunction | $IDBStoreBuilder)
+    {
+        this.storeMap.set(name, isFunction(builder) ? builder(new $IDBStoreBuilder({autoIncrement: false, keyPath: null, indexes: {}, name, schema: null})) : builder);
+        return this as any;
+    }
+
+    /**
+     * Open IDB and initialize, create new IDB if the name of IDB is not exists, or perform the upgrade if version number change.
+     */
+    async open(): Promise<$IDB<Config>> {
+        return new _Promise<$IDB>((resolve, reject) => {
+            const {version: dbVersion, name: dbName, storeMap} = this;
+            const initDBRequest = _indexedDB.open(dbName);
+            const createStoresMap = new Map<string, $IDBStoreBuilder<$IDBStoreConfig>>();
+            const createIndexMap = new Map<$IDBStoreBuilder, Map<string, $IDBIndexConfig>>();
+            const upgradeStoreMap = new Map<string, $IDBStoreBuilder<$IDBStoreConfig>>();
+            const cachedObjectMap = new Map<string, {key: any, value: any}[]>();
+            const unusedStoreNameList: string[] = [];
+            const debug = (message: string) => this.#devMode && console.debug(`[$IDBBuilder (${dbName})]`, message);
+            const storesObject: $IDBConfig['stores'] = _Object_fromEntries(_Array_from(storeMap).map(([name, {config: {keyPath, autoIncrement}, indexes}]) => [
+                name, 
+                {
+                    autoIncrement, keyPath, name,
+                    schema: _null,
+                    indexes: _Object_fromEntries(_Array_from(indexes).map(([name, {keyPath, multiEntry, unique}]) => [
+                        name,
+                        { keyPath, multiEntry, unique } as $IDBIndexConfig
+                    ]))
+                } as $IDBStoreConfig
+            ]))
+            const idbConfig = { version: dbVersion, name: dbName, stores: storesObject };
+            /** IndexedDB initial create function */
+            const initialCreateDB = () => {
+                debug(`No IDB detected, create IDB`);
+                const {transaction, result: idb} = initDBRequest;
+                forEach(storeMap, (storeBuilder, name) => {
+                    createStoresMap.set(name, storeBuilder);
+                    createIndexMap.set(storeBuilder, new Map(storeBuilder.indexes))
+                })
+                if (idb.version === dbVersion) upgradeStore(initDBRequest);
+                else transaction!.oncomplete = _ => {
+                    const upgradeDBRequest = indexedDB.open(dbName, dbVersion);
+                    upgradeDBRequest.onupgradeneeded = _ => upgradeStore(upgradeDBRequest);
+                }
+            }
+            /** IndexedDB initial open function */
+            const initialOpenDB = async () => {
+                debug(`IDB Detected`);
+                const idb = initDBRequest.result;
+                const $idb = new $IDB(idb, idbConfig);
+                const transaction = idb[objectStoreNames].length ?  idb.transaction(_Array_from(idb[objectStoreNames]), 'readonly') : null;
+                const noUpgrade = () => {
+                    debug(`No Upgrade`);
+                    resolve($idb);
+                }
+                if (idb.version === dbVersion) return noUpgrade();
+                // get unused stores
+                transaction && forEach(_Array_from(transaction[objectStoreNames]), name => storeMap.has(name) && unusedStoreNameList.push(name))
+                // check store config matches
+                forEach(storeMap, (storeBuilder, storeName) => {
+                    const {keyPath, autoIncrement} = storeBuilder.config;
+                    const indexMap = new Map();
+                    const checkIndexes = () =>
+                        forEach(storeBuilder.indexes, (indexBuilder, indexName) => {
+                            const [index] = trycatch(() => store?.index(indexName));
+                            const CONFIG_CHANGED = _JSON_stringify(indexBuilder.keyPath) !== _JSON_stringify(index?.keyPath)
+                                || !!indexBuilder.multiEntry !== index?.multiEntry 
+                                || !!indexBuilder.unique !== index?.unique;
+                            if (!index || CONFIG_CHANGED) {
+                                indexMap.set(indexName, indexBuilder);
+                                createIndexMap.set(storeBuilder, indexMap);
+                            }
+                        })
+                    // get store from idb
+                    const [store] = trycatch(() => transaction?.objectStore(storeName));
+                    // create store and break if idb have no store exist
+                    if (!store) return createStoresMap.set(storeName, storeBuilder), checkIndexes();
+                    // define matches variables
+                    const OBJECT_UPGRADE = _Array_from(storeBuilder.upgrades).find(([upgradeVersion],) => 
+                        dbVersion >= upgradeVersion && idb.version < upgradeVersion
+                    )
+                    const CONFIG_CHANGED = 
+                        _JSON_stringify(keyPath) !== _JSON_stringify(store.keyPath)
+                        || autoIncrement !== store?.autoIncrement
+                    const UPGRADE_NEEDED = OBJECT_UPGRADE || CONFIG_CHANGED;
+                    // add indexes
+                    checkIndexes();
+                    // store existed and not need upgrade
+                    if (store && !UPGRADE_NEEDED) return;
+                    // add upgrade store queue
+                    upgradeStoreMap.set(storeName, storeBuilder)
+                    
+                })
+                // resolve if no need upgrade
+                if (dbVersion === idb.version && !createStoresMap.size && !upgradeStoreMap.size && !unusedStoreNameList.length && !createIndexMap.size)
+                    return noUpgrade();
+                // cache objects
+                for (const [storeName, storeBuilder] of upgradeStoreMap) {
+                    const cache: {key: any, value: any}[] = [];
+                    // filter version lower than current idb
+                    const upgradeHandleList = _Array_from(storeBuilder.upgrades)
+                        .filter(([upgradeVersion]) => dbVersion >= upgradeVersion && idb.version < upgradeVersion )
+                        .sort((a, b) => a[0] - b[0])
+                        .map(config => config[1]);
+                    // cache objects from store
+                    await $idb.transaction(storeName, false, async $tx => {
+                        cachedObjectMap.set(storeName, cache);
+                        await $tx.store(storeName).cursor(async cursor => {
+                            cache.push({key: cursor.key, value: cursor.value});
+                            cursor.continue();
+                        })
+                    })
+                    // upgrade objects
+                    for (const upgradeHandle of upgradeHandleList) 
+                        cachedObjectMap.set(storeName, await upgradeHandle(cache, $idb));
+                }
+                // upgrade db from lower version
+                idb.close();
+                const upgradeDBRequest = _indexedDB.open(dbName, dbVersion);
+                upgradeDBRequest[onupgradeneeded] = _ => upgradeStore(upgradeDBRequest);
+                upgradeDBRequest[onsuccess] = _ => {
+                    debug('IDB Upgrade Completed');
+                    resolve(new $IDB(upgradeDBRequest.result, idbConfig));
+                }
+            }
+
+            /** IndexedDB upgrade version */
+            const upgradeStore = (req: IDBOpenDBRequest) => {
+                debug('Upgrade DB')
+                const idb = req.result;
+                /** 'versionchange' type transaction */
+                const transaction = req.transaction as IDBTransaction;
+                // create stores
+                forEach(createStoresMap, ({config}, name) => {
+                    idb[createObjectStore](name, config);
+                    debug(`Store Created: ${name}`);
+                });
+                // upgrade stores
+                forEach(upgradeStoreMap, ({config}, name) => {
+                    idb[deleteObjectStore](name); 
+                    idb[createObjectStore](name, config);
+                    debug(`Store Upgraded: ${name}`);
+                })
+                // create indexes
+                forEach(createIndexMap, (indexMap, {config: {name}}) => {
+                    const store = transaction.objectStore(name);
+                    forEach(indexMap, ({keyPath, ...config}, indexName) => {
+                        // if indexes existed, delete and create again
+                        if (store.indexNames.contains(indexName)) store.deleteIndex(indexName);
+                        store.createIndex(indexName, keyPath, config);
+                        debug(`Store '${name}' Index Created: ${indexName}`);
+                    })
+                })
+                // delete unused stores
+                if (this.#deleteUnused) forEach(unusedStoreNameList, name => {
+                    idb[deleteObjectStore](name);
+                    debug(`Unused Store Deleted: ${name}`);
+                });
+                // open db again for insert objects
+                forEach(cachedObjectMap, (objectList, storeName) => {
+                    const store = transaction.objectStore(storeName);
+                    forEach(objectList, ({key, value}) => {
+                        if (store.autoIncrement || store.keyPath) store.add(value);
+                        else store.add(value, key)
+                    })
+                    debug(`Recovered Store Objects: ${objectList.length} objects of store '${storeName}'`);
+                })
+            }
+
+            // If db not exist, create db will trigger upgraedneeded event
+            initDBRequest[onupgradeneeded] = initialCreateDB;
+            // If db exist, trigger success event
+            initDBRequest[onsuccess] = initialOpenDB;
+            initDBRequest.onerror = _ => reject(initDBRequest.error);
+        })
+    }
+}
+
+export type $IDBStoreBuilderFunction = (store: $IDBStoreBuilder) => $IDBStoreBuilder<any>;

package/ext/idb/src/structure/builder/$IDBStoreBuilder.ts

@@ -0,0 +1,100 @@
+import type { $IDB } from "#structure/$IDB";
+import { _null } from "amateras/lib/native";
+import type { $IDBStoreConfig } from "#structure/$IDBStore";
+import type { $IDBIndexConfig } from "#structure/$IDBIndex";
+
+export class $IDBStoreBuilder<Config extends $IDBStoreConfig = { name: string, keyPath: null, autoIncrement: false, schema: any, indexes: {} }> {
+    readonly config: Config
+    upgrades = new Map<number, $IDBStoreUpgradeFunction>();
+    indexes = new Map<string, $IDBIndexConfig>();
+    constructor(config: Config) {
+        this.config = config;
+    }
+
+    /**
+     * Define the `keyPath` option of store.
+     * 
+     * [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB#structuring_the_database).
+     */
+    keyPath<K extends string[]>(keyPath: K): $IDBStoreBuilder<Prettify<Omit<Config, 'keyPath'> & { keyPath: K }>>;
+    keyPath<K extends string>(keyPath: K): $IDBStoreBuilder<Prettify<Omit<Config, 'keyPath'> & { keyPath: K }>>;
+    keyPath(keyPath: string | string[]) {
+        this.config.keyPath = keyPath;
+        return this as any;
+    }
+
+    /**
+     * Define the `autoIncrement` option of store. 
+     * 
+     * [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB#structuring_the_database).
+     */
+    autoIncrement<K extends boolean>(enable: K): $IDBStoreBuilder<Prettify<Omit<Config, 'autoIncrement'> & { autoIncrement: K }>>;
+    autoIncrement(enable: boolean) {
+        this.config.autoIncrement = enable;
+        return this as any;
+    }
+
+    /**
+     * Use the generic type to define store object type.
+     *
+     * @example
+     * store.schema<{
+     *     id: number,
+     *     name: string,
+     *     created: Date,
+     *     updated: Date
+     * }>()
+     */
+    schema<T extends $IDBStoreBuilderSchema<Config>>(): $IDBStoreBuilder<Prettify<Omit<Config, 'schema'> & { schema: T }>>;
+    schema() { return this as any }
+
+    /**
+     * Add new index to store builder.
+     * @param name - Index name
+     * @param config - {@link $IDBIndexOptionalConfig}
+     */
+    index<N extends string, C extends $IDBIndexOptionalConfig<Config>>(name: N, config: C): $IDBStoreBuilder<Prettify<Config & { indexes: Config['indexes'] & Prettify<Record<N, Prettify<$IDBIndexOptionalHandle<N, C>>>> }>>
+    index<C extends $IDBIndexConfig>(name: string, config: C) {
+        this.indexes.set(name, {
+            ...config, name,
+            multiEntry: config.multiEntry ?? false,
+            unique: config.unique ?? false
+        });
+        return this as any;
+    }
+
+    /**
+     * Add store upgrade function to store builder. The store upgrade function is used for change object structure when the store is upgrading. 
+     * @param version - Target version of database
+     * @param handle - Upgrade handle function
+     */
+    upgrade(version: number, handle: $IDBStoreUpgradeFunction) {
+        this.upgrades.set(version, handle);
+        return this;
+    }
+
+}
+
+export type $IDBStoreUpgradeFunction = (objects: {key: IDBValidKey, value: any}[], idb: $IDB<any>) => OrPromise<{key: IDBValidKey, value: any}[]>;
+
+export type $IDBIndexOptionalConfig<StoreConfig extends $IDBStoreConfig = any> = { 
+    keyPath: OrArray<keyof StoreConfig['schema']>, 
+    unique?: boolean, 
+    multiEntry?: boolean 
+}
+
+type $IDBIndexOptionalHandle<N extends string, Config extends $IDBIndexOptionalConfig> = {
+    name: N;
+    keyPath: Config['keyPath'];
+    multiEntry: Config['multiEntry'] extends boolean ? Config['multiEntry'] : false;
+    unique: Config['unique'] extends boolean ? Config['unique'] : false;
+}
+
+type $IDBStoreBuilderSchema<Config extends $IDBStoreConfig> = 
+    Config['keyPath'] extends string
+        ?   Config['autoIncrement'] extends true
+            ?   { [key in Config['keyPath']]: number }
+            :   { [key in Config['keyPath']]: IDBValidKey } 
+        : Config['keyPath'] extends string[]
+            ? { [key in Config['keyPath'][number]]: IDBValidKey }
+            : any;

package/ext/markdown/index.ts

@@ -0,0 +1,121 @@
+import { _Array_from, forEach } from "amateras/lib/native";
+
+const blockProcesses = new Set<MarkdownBlockProcessOptions>();
+const inlineProcesses = new Set<MarkdownProcessFunction>();
+
+export class Markdown {
+    blockProcessSet = new Set(blockProcesses);
+    inlineProcessSet = new Set(inlineProcesses);
+    constructor() {}
+
+    blockProcess(options: MarkdownBlockProcessOptions) {
+        this.blockProcessSet.add(options);
+        return this;
+    }
+
+    inlineProcess(handle: MarkdownProcessFunction) {
+        this.inlineProcessSet.add(handle);
+        return this;
+    }
+
+    toHTML(text: string) {
+        const blocks = _Array_from(text.matchAll(/(?:.+?\n?)+/gm));
+        return blocks.map(block => {
+            let matched, blockText = block[0]
+            for (const blockProcess of blockProcesses) {
+                matched = blockText.match(blockProcess.regexp);
+                if (!matched) continue;
+                blockText = blockProcess.handle(blockText);
+                const removeHTML = blockText.replaceAll(/<.+>[^<]+?<\/.+>/gm, '');
+                if (!removeHTML) break;
+            }
+            if (!matched) blockText = paragraph(blockText);
+            inlineProcesses.forEach(fn => blockText = fn(blockText))
+            return blockText;
+        }).join('')
+    }
+
+    toDOM(text: string) {
+        return $('article').innerHTML(this.toHTML(text))
+    }
+}
+
+export type MarkdownProcessFunction = (text: string) => string;
+export interface MarkdownBlockProcessOptions {
+    regexp: RegExp,
+    handle: (text: string) => string;
+}
+
+const blockProcess = (options: MarkdownBlockProcessOptions) => blockProcesses.add(options);
+const inlineProcess = (handle: MarkdownProcessFunction) => inlineProcesses.add(handle);
+const replaceAll = (str: string, searchValue: string | RegExp, replacer: ((substring: string, ...args: any[]) => string) | string): string => str.replaceAll(searchValue, replacer as any);
+const trim = (str: string) => str.trim();
+const paragraph = (str: string) => replaceAll(str, /(?:.+?\n?)+/gm, $0 => `<p>${trim($0)}</p>`);
+// Headings
+blockProcess({
+    regexp: /^(#+) (.+)/gm,
+    handle: text => replaceAll(text, /^(#+) (.+)/gm, (_, $1: string, $2) => `<h${$1.length}>${$2}</h${$1.length}>`)
+});
+blockProcess({
+    regexp: /^(.+)\n==+$/gm,
+    handle: text => replaceAll(text, /^(.+)\n==+$/gm, (_, $1) => `<h1>${$1}</h1>`)
+});
+blockProcess({
+    regexp: /^(.+)\n--+$/gm,
+    handle: text => replaceAll(text, /^(.+)\n--+$/gm, (_, $1) => `<h2>${$1}</h2>`)
+});
+// Blockquote
+blockProcess({
+    regexp: /(?:^> ?.*(?:\n|$))+/gm,
+    handle: text => {
+        const fn = (str: string) => {
+            const blocks = _Array_from(str.matchAll(/(?:^> ?.*(?:\n|$))+/gm));
+            forEach(blocks, block => {
+                const blocked = fn(replaceAll(block[0], /^> ?/gm, ''));
+                str = str.replace(block[0], `<blockquote>\n${paragraph(blocked)}\n</blockquote>`);
+            })
+            return str;
+        }
+        return fn(text);
+    }
+});
+// List
+blockProcess({
+    regexp: /(?:^(?:\t|(?:  )+)?(?:-|[0-9]+\.) (?:.+\n?))+/gm,
+    handle: text => {
+        const fn = (str: string) => {
+            const blocks = _Array_from(str.matchAll(/(?:^(?:\t|(?:  )+)?(?:-|[0-9]+\.) (?:.+\n?))+/gm));
+            forEach(blocks, block => {
+                let haveList = false // check this loop have list
+                const type = block[0].match(/^(-|[0-9]+\.) /)?.[1] === '-' ? 'ul' : 'ol';
+                const listed = replaceAll(block[0], /^(?:-|[0-9]+\.) (.+)/gm, (_, $1: string) => (haveList = true, `<li>\n${trim($1)}\n</li>`));
+                const clearTabbed = replaceAll(listed, /^(?:\t|(?:  ))/gm, '');
+                const convertedList = fn(clearTabbed);
+                str = str.replace(block[0], haveList ? `<${type}>\n${trim(convertedList)}\n</${type}>` : convertedList);
+            })
+            return str;
+        }
+        return fn(text);
+    }
+})
+// Codeblock
+blockProcess({
+    regexp: /^```([^`\n]+)\n([^`]+)?```/gm,
+    handle: text => replaceAll(text, /^```([^`\n]+)\n([^`]+)?```/gm, (_, $1, $2: string) => `<pre><code>\n${trim($2)}\n</code></pre>`)
+})
+// Horizontal Rule
+blockProcess({
+    regexp: /^(?:---|\*\*\*|___)(\s+)?$/gm,
+    handle: text => replaceAll(text, /^(?:---|\*\*\*|___)(\s+)?$/gm, _ => `<hr>`)
+})
+// Bold
+inlineProcess(text => replaceAll(text, /\*\*([^*]+?)\*\*/g, (_, $1) => `<b>${$1}</b>`));
+// Italic
+inlineProcess(text => replaceAll(text, /\*([^*]+?)\*/g, (_, $1) => `<i>${$1}</i>`));
+// Image
+inlineProcess(text => replaceAll(text, /!\[(.+?)\]\((.+?)(?: "(.+?)?")?\)/g, (_, alt, src, title) => `<img src="${src}" alt="${alt}"${title ? ` title="${title}"` : ''}>`));
+// Link
+inlineProcess(text => replaceAll(text, /\[(.+?)\]\((?:(\w\w+?:[^\s]+?)(?: "(.+?)?")?)\)/g, (_, content, href, title) => `<a href="${href}"${title ? ` title="${title}"` : ''}>${content}</a>`));
+inlineProcess(text => replaceAll(text, /\[(.+?)\]\((?:(\w+?@(?:\w|\.\w)+?)(?: "(.+)?")?)\)/g, (_, content, mail, title) => `<a href="mailto:${mail}"${title ? ` title="${title}"` : ''}>${content}</a>`));
+inlineProcess(text => replaceAll(text, /<(\w\w+?:[^\s]+?)>/g, (_, href) => `<a href="${href}">${href}</a>`));
+inlineProcess(text => replaceAll(text, /<(\w+?@(?:\w|\.\w)+?)>/g, (_, mail) => `<a href="mailto:${mail}">${mail}</a>`));

package/ext/markdown/package.json

@@ -0,0 +1,8 @@
+{
+    "name": "@amateras/markdown",
+    "peerDependencies": {
+        "amateras": "../../"
+    },
+    "imports": {
+    }
+}

package/ext/router/index.ts

@@ -15,7 +15,7 @@ declare module 'amateras/core' {
     export function $(nodeName: 'router', page?: Page<any>): Router;
     export function $(nodeName: 'ra'): RouterAnchor;
     export namespace $ {
-        export function open(url: string | URL | Nullish, target: AnchorTarget): typeof Router;
+        export function open(url: string | URL | Nullish, target?: AnchorTarget): typeof Router;
         export function replace(url: string | URL | Nullish): typeof Router;
         export function back(): typeof Router;
         export function forward(): typeof Router;

package/ext/router/node/Route.ts

@@ -1,4 +1,4 @@
-import { _instanceof, _Object_fromEntries, _Array_from } from "#lib/native";
+import { _instanceof, _Object_fromEntries, _Array_from, _Promise } from "#lib/native";
 import { $Element } from "#node/$Element";
 import type { AsyncRoute, RouteBuilder, RouteDataResolver } from "..";
 import { Page } from "./Page";
@@ -39,7 +39,7 @@ export class Route<Path extends string = string> extends BaseRouteNode<Path> {
         page.params = data.params;
         page.initial = true;
         let resolver: any = this.builder(page);
-        if (_instanceof(resolver, Promise)) {
+        if (_instanceof(resolver, _Promise)) {
             const result = await resolver as any;
             // Module import
             if (result[Symbol.toStringTag] === 'Module') {

package/ext/router/node/RouterAnchor.ts

@@ -3,6 +3,11 @@ import { $Anchor } from "#html/$Anchor";
 export class RouterAnchor extends $Anchor {
     constructor() {
         super();
-        this.on('click', e => { e.preventDefault(); $.open(this.href(), this.target()) })
+        this.on('click', e => { 
+            e.preventDefault();
+            this.target() === '_replace' 
+            ?   $.replace(this.href()) 
+            :   $.open(this.href(), this.target())
+        })
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amateras",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "Amateras is a DOM Utility library.",
   "module": "index.ts",
   "type": "module",
@@ -35,7 +35,10 @@
     "./css/color/*": "./ext/css/src/lib/colors/*.ts",
     "./router": "./ext/router/index.ts",
     "./ssr": "./ext/ssr/index.ts",
-    "./i18n": "./ext/i18n/src/index.ts"
+    "./i18n": "./ext/i18n/src/index.ts",
+    "./idb": "./ext/idb/src/index.ts",
+    "./idb/core": "./ext/idb/src/core.ts",
+    "./markdown": "./ext/markdown/index.ts"
   },
   "workspaces": [
     "./ext/*"

package/src/core.ts

@@ -6,6 +6,7 @@ import { $Node, type $NodeContentResolver, type $NodeContentTypes } from '#node/
 import { _instanceof, isString, isFunction, _Object_assign, isObject, isNull, _Object_entries, _Object_defineProperty, forEach, isNumber, _Array_from, isUndefined, _bind, _null } from '#lib/native';
 import { $HTMLElement } from '#node/$HTMLElement';
 import { _document } from '#lib/env';
+import { toArray } from '#lib/toArray';
 
 const nodeNameMap: {[key: string]: Constructor<$Node>} = {}
 const _stylesheet = new CSSStyleSheet();
@@ -45,6 +46,7 @@ export function $(resolver: string | number | null | undefined | Element | HTMLE
     if (isNumber(resolver)) return _Array_from({length: resolver}).map(_ => $(args[0], ...args.slice(1)));
     if (_instanceof(resolver, HTMLElement)) return new $HTMLElement(resolver);
     if (_instanceof(resolver, Element)) return new $Element(resolver);
+    if (_instanceof(resolver, Node)) return new $Node(resolver as any);
     if (_instanceof(resolver, NodeList)) return _Array_from(resolver).map($)
     return new $HTMLElement(resolver);
 }
@@ -104,9 +106,9 @@ export namespace $ {
         return $;
     }
 
-    export const toArray = <T>(item: OrArray<T>): T[] => _instanceof(item, Array) ? item : [item];
-
     export const span = (content: string) => $('span').content(content);
 }
+
 export type $ = typeof $;
-globalThis.$ = $;
+globalThis.$ = $;
+_Object_assign($, {toArray})

package/src/global.ts

@@ -12,6 +12,9 @@ declare global {
     type OrNullish<T> = T | Nullish;
     type Constructor<T> = { new (...args: any[]): T }
     type $Parameter<T> = T | undefined | Signal<T> | Signal<T | undefined>
+    type Ok<D> = [data: D, err: null];
+    type Err<E> = [data: null, err: E]
+    type Result<D, E> = Ok<D> | Err<E>
     type Repeat<T, N extends number, Acc extends T[] = []> = 
         Acc['length'] extends N 
             ? Acc 

package/src/lib/native.ts

@@ -1,5 +1,6 @@
 // Value
 export const _null = null;
+export const _undefined = undefined;
 // Object
 export const _Object_fromEntries = Object.fromEntries;
 export const _Object_entries = Object.entries;
@@ -14,11 +15,13 @@ export const forEach: forEach = <T>(arr: any, fn: any, thisArgs?: any) => arr.fo
 export const _typeof = (target: any, type: 'string' | 'number' | 'object' | 'boolean' | 'function' | 'bigint' | 'symbol' | 'undefined') => typeof target === type;
 export const equal = <T, V extends T>(target: T, ...args: V[]): target is V => !!args.find(a => a === target);
 export const isString = (target: any): target is string => _typeof(target, 'string');
-export const isNumber = (target: any): target is number => _typeof(target, 'number')
-export const isObject = (target: any): target is object => _typeof(target, 'object')
-export const isFunction = (target: any): target is Function => _typeof(target, 'function')
+export const isBoolean = (target: any): target is boolean => _typeof(target, 'boolean');
+export const isNumber = (target: any): target is number => _typeof(target, 'number');
+export const isObject = (target: any): target is object => _typeof(target, 'object');
+export const isFunction = (target: any): target is Function => _typeof(target, 'function');
 export const isUndefined = (target: any): target is undefined => target === undefined;
 export const isNull = (target: any): target is null => target === _null;
+export const isArray = Array.isArray;
 export const _instanceof = <T extends (abstract new (...args: any[]) => any)[]>(target: any, ...instance: T): target is InstanceType<T[number]> => !!instance.find(i => target instanceof i);
 // JSON
 export const _JSON_stringify = JSON.stringify;
@@ -32,4 +35,6 @@ interface forEach {
     <T>(set: Set<T>, fn: (value: T, index: number, set: Set<T>) => any, thisArgs?: any): void;
     <K, V>(set: Map<K, V>, fn: (value: V, key: K, index: number, map: Map<K, V>) => any, thisArgs?: any): void;
     <N extends Node>(set: NodeListOf<N>, fn: (value: N, index: number, parent: NodeListOf<N>) => any, thisArgs?: any): void;
-}
+}
+// Promise
+export const _Promise = Promise;

package/src/lib/sleep.ts

@@ -1 +1,3 @@
-export const sleep = async (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
+import { _Promise } from "./native";
+
+export const sleep = async (ms: number) => new _Promise(resolve => setTimeout(resolve, ms));

package/src/lib/toArray.ts

@@ -0,0 +1,9 @@
+import { _instanceof, _Object_assign } from "./native";
+
+export const toArray = <T>(item: OrArray<T>): T[] => _instanceof(item, Array) ? item : [item];
+
+declare module '#core' {
+    export namespace $ {
+        export function toArray<T>(item: OrArray<T>): T[];
+    }
+}

package/src/lib/trycatch.ts

@@ -0,0 +1,17 @@
+import { _instanceof, _JSON_stringify, _null, _Object_assign } from "./native";
+
+export const trycatch = <D>(callback: () => D): Result<D, Error> => {
+    try {
+        return [callback(), _null];
+    } catch (err) {
+        return [_null, _instanceof(err, Error) ? err : new Error(_JSON_stringify(err))];
+    }
+}
+
+_Object_assign($, {trycatch})
+
+declare module '#core' {
+    export namespace $ {
+        export function trycatch <D>(callback: () => D): Result<D, Error>
+    }
+}

package/src/node/$Element.ts

@@ -13,8 +13,8 @@ export class $Element<Ele extends Element = Element, EvMap = ElementEventMap> ex
 
     attr(): {[key: string]: string};
     attr(key: string): string | null;
-    attr(obj: {[key: string]: string | number | boolean | Signal<any> | null}): this;
-    attr(resolver?: {[key: string]: string | number | boolean | Signal<any> | null} | string) {
+    attr(obj: {[key: string]: string | number | boolean | Signal<any> | null | undefined}): this;
+    attr(resolver?: {[key: string]: string | number | boolean | Signal<any> | null | undefined} | string) {
         if (!arguments.length) return _Object_fromEntries(_Array_from(this.attributes).map(attr => [attr.name, attr.value]));
         if (isString(resolver)) return this.getAttribute(resolver);
         if (resolver) for (let [key, value] of _Object_entries(resolver)) {
@@ -39,18 +39,6 @@ export class $Element<Ele extends Element = Element, EvMap = ElementEventMap> ex
         return this;
     }
 
-    on<K extends keyof EvMap, Ev extends EvMap[K]>(type: K, listener: $EventListener<this, Ev> | $EventListenerObject<this, Ev>, options?: boolean | AddEventListenerOptions) {
-        return this.addEventListener(type as string, listener as any, options);
-    }
-
-    off<K extends keyof EvMap, Ev extends EvMap[K]>(type: K, listener: $EventListener<this, Ev> | $EventListenerObject<this, Ev>, options?: boolean | EventListenerOptions) {
-        return this.removeEventListener(type as string, listener as any, options);
-    }
-    
-    once<K extends keyof EvMap, Ev extends EvMap[K]>(type: K, listener: $EventListener<this, Ev> | $EventListenerObject<this, Ev>, options?: boolean | AddEventListenerOptions) {
-        return this.on(type, listener, {once: true})
-    }
-
     toString() {
         return this.outerHTML();
     }