@lexriver/dome 1.5.11 → 2.0.1

package/out/{LongestCommonSubsequence.js → src/LongestCommonSubsequence.mjs}

@@ -1,164 +1,164 @@
-export var LongestCommonSubsequence;
-(function (LongestCommonSubsequence) {
-    // https://github.com/trekhleb/javascript-algorithms/tree/master/src/algorithms/sets/longest-common-subsequence
-    function getLongestCommonSubsequence(set1, set2) {
-        // Init LCS matrix.
-        const lcsMatrix = Array(set2.length + 1).fill(null).map(() => Array(set1.length + 1).fill(null));
-        // Fill first row with zeros.
-        for (let columnIndex = 0; columnIndex <= set1.length; columnIndex += 1) {
-            lcsMatrix[0][columnIndex] = 0;
-        }
-        // Fill first column with zeros.
-        for (let rowIndex = 0; rowIndex <= set2.length; rowIndex += 1) {
-            lcsMatrix[rowIndex][0] = 0;
-        }
-        // Fill rest of the column that correspond to each of two strings.
-        for (let rowIndex = 1; rowIndex <= set2.length; rowIndex += 1) {
-            for (let columnIndex = 1; columnIndex <= set1.length; columnIndex += 1) {
-                if (set1[columnIndex - 1] === set2[rowIndex - 1]) {
-                    lcsMatrix[rowIndex][columnIndex] = lcsMatrix[rowIndex - 1][columnIndex - 1] + 1;
-                }
-                else {
-                    lcsMatrix[rowIndex][columnIndex] = Math.max(lcsMatrix[rowIndex - 1][columnIndex], lcsMatrix[rowIndex][columnIndex - 1]);
-                }
-            }
-        }
-        // Calculate LCS based on LCS matrix.
-        if (!lcsMatrix[set2.length][set1.length]) {
-            // If the length of largest common string is zero then return empty string.
-            return [''];
-        }
-        const longestSequence = [];
-        let columnIndex = set1.length;
-        let rowIndex = set2.length;
-        while (columnIndex > 0 || rowIndex > 0) {
-            if (set1[columnIndex - 1] === set2[rowIndex - 1]) {
-                // Move by diagonal left-top.
-                longestSequence.unshift(set1[columnIndex - 1]);
-                columnIndex -= 1;
-                rowIndex -= 1;
-            }
-            else if (lcsMatrix[rowIndex][columnIndex] === lcsMatrix[rowIndex][columnIndex - 1]) {
-                // Move left.
-                columnIndex -= 1;
-            }
-            else {
-                // Move up.
-                rowIndex -= 1;
-            }
-        }
-        return longestSequence;
-    }
-    LongestCommonSubsequence.getLongestCommonSubsequence = getLongestCommonSubsequence;
-    function getPatch({ oldArray, newArray, onRemove, onAdd }) {
-        const lcsArray = getLongestCommonSubsequence(oldArray, newArray);
-        let countOfOperations = 0;
-        // console.log('oldArray=', oldArray.join(' '))
-        // console.log('newArray=', newArray.join(' '))
-        // console.log('lcsArray=', lcsArray.join(' '))
-        // old:   A B B B C
-        // new: X X B B B B C
-        // lcs:     B B B C
-        //let lcsStartIndexForOld = 0
-        //let lcsStartIndexForNew = 0
-        let lcsIndex = 0;
-        //let newIndex = 0
-        for (let oldIndex = 0; oldIndex < oldArray.length; oldIndex++) {
-            let oldItem = oldArray[oldIndex];
-            //let oldItemInLcs = itemInArray(oldItem, lcsArray, lcsStartIndexForOld)
-            let oldItemInLcs = lcsArray[lcsIndex] == oldItem;
-            //console.log('oldIndex=', oldIndex, 'oldItem=', oldItem, 'in LCS=', oldItemInLcs)
-            if (oldItemInLcs) {
-                //lcsStartIndexForOld++
-                lcsIndex++;
-                // so we must keep this element
-                //continue
-            }
-            else {
-                onRemove(oldIndex - countOfOperations, oldItem);
-                //indexForOperation++
-                countOfOperations++;
-            }
-        }
-        lcsIndex = 0;
-        for (let newIndex = 0; newIndex < newArray.length; newIndex++) {
-            let newItem = newArray[newIndex];
-            //let newItemInLcs = itemInArray(newItem, lcsArray, lcsStartIndexForNew)
-            let newItemInLcs = lcsArray[lcsIndex] == newItem;
-            if (newItemInLcs) {
-                lcsIndex++;
-                //lcsStartIndexForNew++
-                //keep
-            }
-            else {
-                onAdd(newIndex, newItem);
-                countOfOperations++;
-            }
-        }
-        return countOfOperations;
-    }
-    LongestCommonSubsequence.getPatch = getPatch;
-    function getPatchOrdered({ oldArray, newArray, onRemove, onAdd }) {
-        const lcsArray = getLongestCommonSubsequence(oldArray, newArray);
-        //let countOfOperations = 0
-        // console.log('oldArray=', oldArray.join(' '))
-        // console.log('newArray=', newArray.join(' '))
-        // console.log('lcsArray=', lcsArray.join(' '))
-        // old:   A B B B C
-        // new: X X B B B B C
-        // lcs:     B B B C
-        let lcsIndexForOld = 0;
-        let lcsIndexForNew = 0;
-        //let lcsIndex = 0
-        let oldIndex = 0;
-        let newIndex = 0;
-        let countOfRemoveOperations = 0;
-        let countOfAddOperations = 0;
-        let indexForOperation = 0;
-        while (oldIndex < oldArray.length || newIndex < newArray.length) {
-            while (oldIndex < oldArray.length) {
-                let oldItem = oldArray[oldIndex];
-                //let oldItemInLcs = itemInArray(oldItem, lcsArray, lcsStartIndexForOld)
-                let oldItemInLcs = lcsArray[lcsIndexForOld] == oldItem;
-                //console.log('oldItem', oldIndex, oldItem, oldItemInLcs)
-                if (oldItemInLcs) {
-                    //lcsStartIndexForNew++
-                    //lcsStartIndexForOld++
-                    lcsIndexForOld++;
-                    //indexForOperation++
-                    oldIndex++;
-                    break;
-                }
-                else {
-                    //onRemove(oldIndex-countOfRemoveOperations, oldItem)
-                    onRemove(indexForOperation, oldItem);
-                    countOfRemoveOperations++;
-                    oldIndex++;
-                }
-            }
-            while (newIndex < newArray.length) {
-                let newItem = newArray[newIndex];
-                //let newItemInLcs = itemInArray(newItem, lcsArray, lcsStartIndexForNew)
-                let newItemInLcs = lcsArray[lcsIndexForNew] == newItem;
-                //console.log('newItem', oldIndex, newItem, newItemInLcs)
-                if (newItemInLcs) {
-                    //lcsStartIndexForNew++
-                    lcsIndexForNew++;
-                    indexForOperation++;
-                    newIndex++;
-                    break;
-                }
-                else {
-                    onAdd(indexForOperation, newItem);
-                    indexForOperation++;
-                    countOfAddOperations++;
-                    newIndex++;
-                }
-            }
-        }
-        // console.log('countOf(+)operations', countOfAddOperations)
-        // console.log('countOf(-)operations', countOfRemoveOperations)
-        return countOfAddOperations + countOfRemoveOperations;
-    }
-    LongestCommonSubsequence.getPatchOrdered = getPatchOrdered;
-})(LongestCommonSubsequence || (LongestCommonSubsequence = {}));
+export var LongestCommonSubsequence;
+(function (LongestCommonSubsequence) {
+    // https://github.com/trekhleb/javascript-algorithms/tree/master/src/algorithms/sets/longest-common-subsequence
+    function getLongestCommonSubsequence(set1, set2) {
+        // Init LCS matrix.
+        const lcsMatrix = Array(set2.length + 1).fill(null).map(() => Array(set1.length + 1).fill(null));
+        // Fill first row with zeros.
+        for (let columnIndex = 0; columnIndex <= set1.length; columnIndex += 1) {
+            lcsMatrix[0][columnIndex] = 0;
+        }
+        // Fill first column with zeros.
+        for (let rowIndex = 0; rowIndex <= set2.length; rowIndex += 1) {
+            lcsMatrix[rowIndex][0] = 0;
+        }
+        // Fill rest of the column that correspond to each of two strings.
+        for (let rowIndex = 1; rowIndex <= set2.length; rowIndex += 1) {
+            for (let columnIndex = 1; columnIndex <= set1.length; columnIndex += 1) {
+                if (set1[columnIndex - 1] === set2[rowIndex - 1]) {
+                    lcsMatrix[rowIndex][columnIndex] = lcsMatrix[rowIndex - 1][columnIndex - 1] + 1;
+                }
+                else {
+                    lcsMatrix[rowIndex][columnIndex] = Math.max(lcsMatrix[rowIndex - 1][columnIndex], lcsMatrix[rowIndex][columnIndex - 1]);
+                }
+            }
+        }
+        // Calculate LCS based on LCS matrix.
+        if (!lcsMatrix[set2.length][set1.length]) {
+            // If the length of largest common string is zero then return empty string.
+            return [''];
+        }
+        const longestSequence = [];
+        let columnIndex = set1.length;
+        let rowIndex = set2.length;
+        while (columnIndex > 0 || rowIndex > 0) {
+            if (set1[columnIndex - 1] === set2[rowIndex - 1]) {
+                // Move by diagonal left-top.
+                longestSequence.unshift(set1[columnIndex - 1]);
+                columnIndex -= 1;
+                rowIndex -= 1;
+            }
+            else if (lcsMatrix[rowIndex][columnIndex] === lcsMatrix[rowIndex][columnIndex - 1]) {
+                // Move left.
+                columnIndex -= 1;
+            }
+            else {
+                // Move up.
+                rowIndex -= 1;
+            }
+        }
+        return longestSequence;
+    }
+    LongestCommonSubsequence.getLongestCommonSubsequence = getLongestCommonSubsequence;
+    function getPatch({ oldArray, newArray, onRemove, onAdd }) {
+        const lcsArray = getLongestCommonSubsequence(oldArray, newArray);
+        let countOfOperations = 0;
+        // console.log('oldArray=', oldArray.join(' '))
+        // console.log('newArray=', newArray.join(' '))
+        // console.log('lcsArray=', lcsArray.join(' '))
+        // old:   A B B B C
+        // new: X X B B B B C
+        // lcs:     B B B C
+        //let lcsStartIndexForOld = 0
+        //let lcsStartIndexForNew = 0
+        let lcsIndex = 0;
+        //let newIndex = 0
+        for (let oldIndex = 0; oldIndex < oldArray.length; oldIndex++) {
+            let oldItem = oldArray[oldIndex];
+            //let oldItemInLcs = itemInArray(oldItem, lcsArray, lcsStartIndexForOld)
+            let oldItemInLcs = lcsArray[lcsIndex] == oldItem;
+            //console.log('oldIndex=', oldIndex, 'oldItem=', oldItem, 'in LCS=', oldItemInLcs)
+            if (oldItemInLcs) {
+                //lcsStartIndexForOld++
+                lcsIndex++;
+                // so we must keep this element
+                //continue
+            }
+            else {
+                onRemove(oldIndex - countOfOperations, oldItem);
+                //indexForOperation++
+                countOfOperations++;
+            }
+        }
+        lcsIndex = 0;
+        for (let newIndex = 0; newIndex < newArray.length; newIndex++) {
+            let newItem = newArray[newIndex];
+            //let newItemInLcs = itemInArray(newItem, lcsArray, lcsStartIndexForNew)
+            let newItemInLcs = lcsArray[lcsIndex] == newItem;
+            if (newItemInLcs) {
+                lcsIndex++;
+                //lcsStartIndexForNew++
+                //keep
+            }
+            else {
+                onAdd(newIndex, newItem);
+                countOfOperations++;
+            }
+        }
+        return countOfOperations;
+    }
+    LongestCommonSubsequence.getPatch = getPatch;
+    function getPatchOrdered({ oldArray, newArray, onRemove, onAdd }) {
+        const lcsArray = getLongestCommonSubsequence(oldArray, newArray);
+        //let countOfOperations = 0
+        // console.log('oldArray=', oldArray.join(' '))
+        // console.log('newArray=', newArray.join(' '))
+        // console.log('lcsArray=', lcsArray.join(' '))
+        // old:   A B B B C
+        // new: X X B B B B C
+        // lcs:     B B B C
+        let lcsIndexForOld = 0;
+        let lcsIndexForNew = 0;
+        //let lcsIndex = 0
+        let oldIndex = 0;
+        let newIndex = 0;
+        let countOfRemoveOperations = 0;
+        let countOfAddOperations = 0;
+        let indexForOperation = 0;
+        while (oldIndex < oldArray.length || newIndex < newArray.length) {
+            while (oldIndex < oldArray.length) {
+                let oldItem = oldArray[oldIndex];
+                //let oldItemInLcs = itemInArray(oldItem, lcsArray, lcsStartIndexForOld)
+                let oldItemInLcs = lcsArray[lcsIndexForOld] == oldItem;
+                //console.log('oldItem', oldIndex, oldItem, oldItemInLcs)
+                if (oldItemInLcs) {
+                    //lcsStartIndexForNew++
+                    //lcsStartIndexForOld++
+                    lcsIndexForOld++;
+                    //indexForOperation++
+                    oldIndex++;
+                    break;
+                }
+                else {
+                    //onRemove(oldIndex-countOfRemoveOperations, oldItem)
+                    onRemove(indexForOperation, oldItem);
+                    countOfRemoveOperations++;
+                    oldIndex++;
+                }
+            }
+            while (newIndex < newArray.length) {
+                let newItem = newArray[newIndex];
+                //let newItemInLcs = itemInArray(newItem, lcsArray, lcsStartIndexForNew)
+                let newItemInLcs = lcsArray[lcsIndexForNew] == newItem;
+                //console.log('newItem', oldIndex, newItem, newItemInLcs)
+                if (newItemInLcs) {
+                    //lcsStartIndexForNew++
+                    lcsIndexForNew++;
+                    indexForOperation++;
+                    newIndex++;
+                    break;
+                }
+                else {
+                    onAdd(indexForOperation, newItem);
+                    indexForOperation++;
+                    countOfAddOperations++;
+                    newIndex++;
+                }
+            }
+        }
+        // console.log('countOf(+)operations', countOfAddOperations)
+        // console.log('countOf(-)operations', countOfRemoveOperations)
+        return countOfAddOperations + countOfRemoveOperations;
+    }
+    LongestCommonSubsequence.getPatchOrdered = getPatchOrdered;
+})(LongestCommonSubsequence || (LongestCommonSubsequence = {}));

package/out/src/index.d.mts

@@ -0,0 +1,11 @@
+export * from '@lexriver/async';
+export * from '@lexriver/data-types';
+export * from '@lexriver/observable';
+export * from '@lexriver/type-event';
+export * from './AnimatedArray.mjs';
+export * from './AnimatedTable.mjs';
+export * from './AnimatedText.mjs';
+export * from './Dome.mjs';
+export * from './DomeComponent.mjs';
+export * from './DomeManipulator.mjs';
+export * from './DomeRouter.console-test.mjs';

package/out/src/index.mjs

@@ -0,0 +1,11 @@
+export * from '@lexriver/async';
+export * from '@lexriver/data-types';
+export * from '@lexriver/observable';
+export * from '@lexriver/type-event';
+export * from './AnimatedArray.mjs';
+export * from './AnimatedTable.mjs';
+export * from './AnimatedText.mjs';
+export * from './Dome.mjs';
+export * from './DomeComponent.mjs';
+export * from './DomeManipulator.mjs';
+export * from './DomeRouter.console-test.mjs';

package/out/src/temp-test.d.mts

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

package/out/{temp-test.js → src/temp-test.mjs}

@@ -1,20 +1,20 @@
-import { LongestCommonSubsequence } from "./LongestCommonSubsequence";
-let oldArray = "ABCD".split('');
-let newArray = "AXYZBCD345".split('');
-const countOfOperations = LongestCommonSubsequence.getPatchOrdered({
-    oldArray: [...oldArray],
-    newArray: newArray,
-    onRemove: (index, item) => {
-        console.log('-', item, index);
-        oldArray.splice(index, 1);
-    },
-    onAdd: (index, item) => {
-        console.log('+', item, index);
-        oldArray.splice(index, 0, item);
-    }
-});
-console.log('expecting equal', oldArray, newArray);
-console.log('countOfOperations=', countOfOperations);
-//expect(oldArray).toEqual(newArray)
-// console.log('result oldArray=', oldArray)
-// console.log('result nweArray=', newArray)
+import { LongestCommonSubsequence } from "./LongestCommonSubsequence.mjs";
+let oldArray = "ABCD".split('');
+let newArray = "AXYZBCD345".split('');
+const countOfOperations = LongestCommonSubsequence.getPatchOrdered({
+    oldArray: [...oldArray],
+    newArray: newArray,
+    onRemove: (index, item) => {
+        console.log('-', item, index);
+        oldArray.splice(index, 1);
+    },
+    onAdd: (index, item) => {
+        console.log('+', item, index);
+        oldArray.splice(index, 0, item);
+    }
+});
+console.log('expecting equal', oldArray, newArray);
+console.log('countOfOperations=', countOfOperations);
+//expect(oldArray).toEqual(newArray)
+// console.log('result oldArray=', oldArray)
+// console.log('result nweArray=', newArray)

package/out/vitest.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vite").UserConfig;
+export default _default;

package/out/vitest.config.js

@@ -0,0 +1,9 @@
+import { defineConfig } from 'vitest/config';
+export default defineConfig({
+    test: {
+        exclude: [
+            './out/**',
+            './node_modules/**'
+        ]
+    }
+});

package/package.json

@@ -1,13 +1,13 @@
 {
-    "type": "module",
     "sideEffects": false,
     "name": "@lexriver/dome",
-    "version": "1.5.11",
-    "description": "",
-    "main": "out/index.js",
-    "types": "out/index.d.ts",
+    "version": "2.0.1",
+    "description": "DOM manipulator",
+    "type": "module",
+    "exports": "./out/src/index.mjs",
     "scripts": {
-        "build": "tsc"
+        "test": "vitest",
+        "build": "rimraf out && tsc"
     },
     "keywords": [
         "typescript",
@@ -23,14 +23,16 @@
     },
     "license": "MIT",
     "devDependencies": {
-        "@types/node": "^12.12.42",
-        "typescript": "^3.6.3"
+        "@types/node": "^22.7.0",
+        "rimraf": "^6.0.1",
+        "typescript": "^5.6.2",
+        "vitest": "^2.1.1"
     },
     "dependencies": {
-        "@lexriver/async": "^1.0.0",
-        "@lexriver/data-types": "^2.0.1",
-        "@lexriver/observable": "^1.0.0",
-        "svg-tag-names": "^2.0.0",
-        "ts-debounce": "^2.0.1"
+        "@lexriver/async": "^3.0.1",
+        "@lexriver/data-types": "^3.0.5",
+        "@lexriver/observable": "^3.0.0",
+        "svg-tag-names": "^3.0.1",
+        "ts-debounce": "^4.0.0"
     }
-}
+}

package/src/{AnimatedArray.ts → AnimatedArray.mts}

@@ -1,6 +1,6 @@
-import { DomeManipulator } from "./DomeManipulator"
-import { LongestCommonSubsequence } from "./LongestCommonSubsequence"
-import { Animation } from './Animation'
+import { Animation } from './Animation.mjs'
+import { DomeManipulator } from "./DomeManipulator.mjs"
+import { LongestCommonSubsequence } from "./LongestCommonSubsequence.mjs"
 
 interface KeyToElementPair{
     key:string

package/src/{AnimatedTable.ts → AnimatedTable.mts}

@@ -1,11 +1,11 @@
-import { DomeComponent, AnimatedArray } from "."
-import { DomeManipulator } from "./DomeManipulator"
-import { Animation } from './Animation'
-import {ObservableValue} from '@lexriver/observable'
+import { ObservableVariable } from '@lexriver/observable'
+import { Animation } from './Animation.mjs'
+import { DomeManipulator } from "./DomeManipulator.mjs"
+import { AnimatedArray, DomeComponent } from "./index.mjs"
 
 interface Attrs<T>{
-    isLoadingO?:ObservableValue<boolean>
-    itemsO:ObservableValue<T[]>
+    isLoadingO?:ObservableVariable<boolean>
+    itemsO:ObservableVariable<T[]>
     animationShowRow:Animation
     animationHideRow:Animation
     animationHideTable?:Animation

package/src/{AnimatedText.ts → AnimatedText.mts}

@@ -1,9 +1,9 @@
-import { ObservableValue } from "@lexriver/observable";
-import { DomeComponent } from ".";
-import { DomeManipulator, CssClass } from "./DomeManipulator";
+import { ObservableVariable } from "@lexriver/observable";
+import { CssClass, DomeManipulator } from "./DomeManipulator.mjs";
+import { DomeComponent } from "./index.mjs";
 
 interface Attrs{
-    textO:ObservableValue<string>
+    textO:ObservableVariable<string>
     tag?:string
     class?:CssClass
 }

package/src/{Dome.ts → Dome.mts}

@@ -1,13 +1,9 @@
 // inspiration: https://github.com/vadimdemedes/dom-chef/blob/master/index.js
-//import svgTagNames from 'svg-tag-names'
 const svgTagNames = require('svg-tag-names')
-//import svgTagNames from 'svg-tag-names'
-//import * as flatten from 'arr-flatten'
-//import { DomeEventDispatcher } from './DomeEventDispatcher.ts.old'
-import { DomeManipulator } from './DomeManipulator'
-import { ObservableValue, checkIfObservable } from '@lexriver/observable'
-import { DomeComponent } from './DomeComponent'
-import { DataTypes} from '@lexriver/data-types'
+import { DataTypes } from '@lexriver/data-types'
+import { ObservableVariable, checkIfObservable } from '@lexriver/observable'
+import { DomeComponent } from './DomeComponent.mjs'
+import { DomeManipulator } from './DomeManipulator.mjs'
 
 const filename = '[Dome]: '
 
@@ -219,7 +215,7 @@ const build = (tagName, attrs, children:DocumentFragment) => {
                     console.error('value=', value)
                     throw new Error('Please provide Observable<boolean> as argument for visibleIf')
                 }
-                let obs = value as ObservableValue<boolean>
+                let obs = value as ObservableVariable<boolean>
                 obs.eventOnChange.subscribe((isVisible) => {
                     if(isVisible){
                         DomeManipulator.unhideElementAsync(el)
@@ -266,7 +262,7 @@ const build = (tagName, attrs, children:DocumentFragment) => {
  * @param name 
  * @param element 
  */
-function assignDynamicCssClasses(name: string, value: {[key:string]:boolean|ObservableValue<boolean>}, element: any) {
+function assignDynamicCssClasses(name: string, value: {[key:string]:boolean|ObservableVariable<boolean>}, element: any) {
     if (DataTypes.isObjectWithKeys(value) == false){
         DomeManipulator.setCssClasses(element, value)
         return
@@ -283,7 +279,7 @@ function assignDynamicCssClasses(name: string, value: {[key:string]:boolean|Obse
             }
 
         } else if (checkIfObservable(v)) {
-            let o = v as ObservableValue<boolean>
+            let o = v as ObservableVariable<boolean>
             o.eventOnChange.subscribe((showThiCssClass) => {
                 if(!DomeManipulator.isInDom(element)) return {unsubscribe:true} //TODO: test it
                 // reassign whole attribute

package/src/{DomeComponent.ts → DomeComponent.mts}

@@ -1,6 +1,6 @@
-import { DomeManipulator } from "./DomeManipulator"
-import { Animation } from './Animation'
-import {debounce } from 'ts-debounce'
+import { debounce } from 'ts-debounce'
+import { Animation } from './Animation.mjs'
+import { DomeManipulator } from "./DomeManipulator.mjs"
 
 
 interface InternalAttrs{

package/src/{DomeManipulator.ts → DomeManipulator.mts}

@@ -1,12 +1,12 @@
-import { ObservableValue, checkIfObservable } from "@lexriver/observable"
-import { Animation } from './Animation'
 import { Async } from "@lexriver/async"
 import { DataTypes } from "@lexriver/data-types"
+import { ObservableVariable, checkIfObservable } from "@lexriver/observable"
+import { Animation } from './Animation.mjs'
 
 
-export type CssClass = {[key:string]:boolean|ObservableValue<boolean>} | string[] | string
+export type CssClass = {[key:string]:boolean|ObservableVariable<boolean>} | string[] | string
 
-export module DomeManipulator {
+export namespace DomeManipulator {
 
     export async function hideElementAsync(element: Element, animation?:Animation) {
         if(!element) throw new Error('hideElementAsync failed, no element')
@@ -256,7 +256,7 @@ export module DomeManipulator {
             let classNameArray: Array<string> = []
             for (let [k, v] of Object.entries(value)) {
                 if (checkIfObservable(v)) {
-                    if ((v as ObservableValue<boolean>).get()) {
+                    if ((v as ObservableVariable<boolean>).get()) {
                         classNameArray.push(k)
                     }
                 } else if (v) {

package/src/{DomeRouter.ts → DomeRouter.mts}

@@ -1,11 +1,12 @@
-import { DomeManipulator } from "./DomeManipulator"
+import { DomeManipulator } from "./DomeManipulator.mjs"
 
-const filename = '[DomeRouter]'
+// const filename = '[DomeRouter]'
 
 export type RouteAction = (
-    params:{[key:string]:string}, 
+    params:{[key:string]:string|number}, 
     url:string,
-    scrollToPreviousPositionAsync:()=>Promise<void>
+    scrollToPreviousPositionAsync:()=>Promise<void>,
+    query:{[key:string]:string}
     ) => void|Promise<void>
 
 interface Route{
@@ -19,7 +20,7 @@ interface HistoryUrl{
     scroll:number
 }
 
-export module DomeRouter {
+export namespace DomeRouter {
     const historyUrls:HistoryUrl[] = []
     const scrollPositionByUrl = new Map<string, number>()
     export let maxHistoryUrlsCount:number = 20
@@ -215,7 +216,20 @@ export module DomeRouter {
 
     }
 
+    function parseQueryString(search:string):{[key:string]:string}{
+        const query:{[key:string]:string} = {}
+        if(!search || search[0] !== '?') return query
+        const params = new URLSearchParams(search.substring(1))
+        for(const [key, value] of params.entries()){
+            query[key] = value
+        }
+        return query
+    }
+
     async function executeAsync(url:string = window.location.pathname, scrollToPosition:number){
+        const queryString = window.location.search
+        const query = parseQueryString(queryString)
+        url = url.split('?')[0]  // Strip query params
         //const url = window.location.pathname
         const urlSlices = getRouteSlices(url)
         // urlSlices = show, category, 345
@@ -259,7 +273,7 @@ export module DomeRouter {
                     await DomeManipulator.scrollToAsync({
                         pxFromTop: scrollToPosition
                     })
-                })
+                }, query)
             }
         }
         if(countOfFoundRoutes==0 && onNotFoundAction){