@lexriver/dome 2.0.3 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/out/index.cjs +192 -0
- package/out/index.mjs +177 -0
- package/out/src/index.d.mts +5 -1
- package/out/src/index.d.ts +5 -1
- package/out/src/index.mjs +5 -1
- package/package.json +3 -2
- package/out/src/DomeRouter.console-test.d.mts +0 -1
- package/out/src/DomeRouter.console-test.d.ts +0 -1
- package/out/src/DomeRouter.console-test.mjs +0 -44
- package/out/src/concurrent-updates.test.d.mts +0 -1
- package/out/src/concurrent-updates.test.d.ts +0 -1
- package/out/src/concurrent-updates.test.mjs +0 -203
- package/out/src/temp-test.d.mts +0 -1
- package/out/src/temp-test.d.ts +0 -1
- package/out/src/temp-test.mjs +0 -20
package/out/index.cjs
CHANGED
|
@@ -26,16 +26,33 @@ __export(src_exports, {
|
|
|
26
26
|
AnimatedArray: () => AnimatedArray,
|
|
27
27
|
AnimatedTable: () => AnimatedTable,
|
|
28
28
|
AnimatedText: () => AnimatedText,
|
|
29
|
+
Async: () => import_async2.Async,
|
|
30
|
+
DataTypes: () => import_data_types3.DataTypes,
|
|
29
31
|
DomeComponent: () => DomeComponent,
|
|
30
32
|
DomeManipulator: () => DomeManipulator,
|
|
33
|
+
DomeRouter: () => DomeRouter,
|
|
34
|
+
Lock: () => import_async2.Lock,
|
|
35
|
+
ObservableArray: () => import_observable3.ObservableArray,
|
|
36
|
+
ObservableLocalStorageArray: () => import_observable3.ObservableLocalStorageArray,
|
|
37
|
+
ObservableLocalStorageVariable: () => import_observable3.ObservableLocalStorageVariable,
|
|
38
|
+
ObservableMap: () => import_observable3.ObservableMap,
|
|
39
|
+
ObservableValue: () => import_observable3.ObservableVariable,
|
|
40
|
+
ObservableVariable: () => import_observable3.ObservableVariable,
|
|
31
41
|
React: () => React,
|
|
42
|
+
TypeEvent: () => import_type_event.TypeEvent,
|
|
43
|
+
checkIfObservable: () => import_observable3.checkIfObservable,
|
|
44
|
+
createObservable: () => import_observable3.createObservable,
|
|
32
45
|
h: () => h
|
|
33
46
|
});
|
|
34
47
|
module.exports = __toCommonJS(src_exports);
|
|
35
48
|
__reExport(src_exports, require("@lexriver/async"), module.exports);
|
|
49
|
+
var import_async2 = require("@lexriver/async");
|
|
36
50
|
__reExport(src_exports, require("@lexriver/data-types"), module.exports);
|
|
51
|
+
var import_data_types3 = require("@lexriver/data-types");
|
|
37
52
|
__reExport(src_exports, require("@lexriver/observable"), module.exports);
|
|
53
|
+
var import_observable3 = require("@lexriver/observable");
|
|
38
54
|
__reExport(src_exports, require("@lexriver/type-event"), module.exports);
|
|
55
|
+
var import_type_event = require("@lexriver/type-event");
|
|
39
56
|
|
|
40
57
|
// src/DomeManipulator.mts
|
|
41
58
|
var import_async = require("@lexriver/async");
|
|
@@ -800,3 +817,178 @@ var React = {
|
|
|
800
817
|
Fragment: typeof DocumentFragment === "function" ? DocumentFragment : () => {
|
|
801
818
|
}
|
|
802
819
|
};
|
|
820
|
+
|
|
821
|
+
// src/DomeRouter.mts
|
|
822
|
+
var DomeRouter;
|
|
823
|
+
((DomeRouter2) => {
|
|
824
|
+
const historyUrls = [];
|
|
825
|
+
const scrollPositionByUrl = /* @__PURE__ */ new Map();
|
|
826
|
+
DomeRouter2.maxHistoryUrlsCount = 20;
|
|
827
|
+
const allRoutes = [];
|
|
828
|
+
let onNotFoundAction = void 0;
|
|
829
|
+
window.addEventListener("popstate", async (e) => {
|
|
830
|
+
const url = window.location.pathname;
|
|
831
|
+
await executeAsync(url, getScrollPositionForUrl(url));
|
|
832
|
+
await DomeManipulator.scrollToAsync({
|
|
833
|
+
pxFromTop: getScrollPositionForUrl(window.location.pathname)
|
|
834
|
+
});
|
|
835
|
+
});
|
|
836
|
+
function getScrollPositionForUrl(url) {
|
|
837
|
+
var _a;
|
|
838
|
+
return (_a = scrollPositionByUrl.get(url)) != null ? _a : 0;
|
|
839
|
+
}
|
|
840
|
+
function saveScrollPositionForUrl(url) {
|
|
841
|
+
scrollPositionByUrl.set(url, DomeManipulator.getCurrentScrollPosition());
|
|
842
|
+
}
|
|
843
|
+
function saveScrollPositionForCurrentUrl() {
|
|
844
|
+
scrollPositionByUrl.set(getCurrentUrl(), DomeManipulator.getCurrentScrollPosition());
|
|
845
|
+
}
|
|
846
|
+
function navigate(url) {
|
|
847
|
+
addUrlToHistory(getCurrentUrl());
|
|
848
|
+
saveScrollPositionForCurrentUrl();
|
|
849
|
+
window.history.pushState(null, "", url);
|
|
850
|
+
executeAsync(url, 0);
|
|
851
|
+
DomeManipulator.scrollToTop();
|
|
852
|
+
}
|
|
853
|
+
DomeRouter2.navigate = navigate;
|
|
854
|
+
function goBack() {
|
|
855
|
+
window.history.go(-1);
|
|
856
|
+
}
|
|
857
|
+
DomeRouter2.goBack = goBack;
|
|
858
|
+
function goForward() {
|
|
859
|
+
window.history.go(1);
|
|
860
|
+
}
|
|
861
|
+
DomeRouter2.goForward = goForward;
|
|
862
|
+
function changeUrl(url) {
|
|
863
|
+
window.history.replaceState(null, "", url);
|
|
864
|
+
}
|
|
865
|
+
DomeRouter2.changeUrl = changeUrl;
|
|
866
|
+
function addUrlToHistory(url) {
|
|
867
|
+
historyUrls.push({ url, scroll: 0 });
|
|
868
|
+
while (historyUrls.length > DomeRouter2.maxHistoryUrlsCount) {
|
|
869
|
+
historyUrls.shift();
|
|
870
|
+
}
|
|
871
|
+
if (historyUrls.length > 1) {
|
|
872
|
+
historyUrls[historyUrls.length - 2].scroll = DomeManipulator.getCurrentScrollPosition();
|
|
873
|
+
}
|
|
874
|
+
}
|
|
875
|
+
function getCurrentUrl() {
|
|
876
|
+
return window.location.pathname;
|
|
877
|
+
}
|
|
878
|
+
DomeRouter2.getCurrentUrl = getCurrentUrl;
|
|
879
|
+
function getPreviousPageUrl(previousPageIndex = 0) {
|
|
880
|
+
let index = historyUrls.length - 2 - previousPageIndex;
|
|
881
|
+
if (index >= 0 && index < historyUrls.length) return historyUrls[index].url;
|
|
882
|
+
return void 0;
|
|
883
|
+
}
|
|
884
|
+
DomeRouter2.getPreviousPageUrl = getPreviousPageUrl;
|
|
885
|
+
function resolveUrl(url = window.location.pathname, addToHistory = true) {
|
|
886
|
+
if (addToHistory) addUrlToHistory(window.location.pathname);
|
|
887
|
+
executeAsync(url, getScrollPositionForUrl(url));
|
|
888
|
+
}
|
|
889
|
+
DomeRouter2.resolveUrl = resolveUrl;
|
|
890
|
+
function onRoute(route, exactMatch, action) {
|
|
891
|
+
if (route[0] !== "/") throw new Error("Please provide correct route. route=" + route);
|
|
892
|
+
let routeSlices = getRouteSlices(route);
|
|
893
|
+
allRoutes.push({ routeSlices, exactMatch, action });
|
|
894
|
+
}
|
|
895
|
+
DomeRouter2.onRoute = onRoute;
|
|
896
|
+
function getRouteSlices(route) {
|
|
897
|
+
return route.split("/").map((x) => decodeURIComponent(x));
|
|
898
|
+
}
|
|
899
|
+
function onNotFound(action) {
|
|
900
|
+
onNotFoundAction = action;
|
|
901
|
+
}
|
|
902
|
+
DomeRouter2.onNotFound = onNotFound;
|
|
903
|
+
function checkUrlMatchRouteAndGetParameters(url, route, exactMatch = true) {
|
|
904
|
+
const urlSlices = getRouteSlices(url);
|
|
905
|
+
const routeSlices = getRouteSlices(route);
|
|
906
|
+
if (exactMatch && routeSlices.length !== urlSlices.length) return void 0;
|
|
907
|
+
const extractedParameters = {};
|
|
908
|
+
for (let i = 0; i < routeSlices.length; i++) {
|
|
909
|
+
let cRouteSlice = routeSlices[i];
|
|
910
|
+
let cUrlSlice = urlSlices[i];
|
|
911
|
+
if (cRouteSlice.startsWith(":")) {
|
|
912
|
+
if (cUrlSlice === void 0) {
|
|
913
|
+
return void 0;
|
|
914
|
+
}
|
|
915
|
+
const [name, value] = parseToNameAndValue(cRouteSlice, cUrlSlice);
|
|
916
|
+
extractedParameters[name] = value;
|
|
917
|
+
} else {
|
|
918
|
+
if (cRouteSlice !== cUrlSlice) {
|
|
919
|
+
return void 0;
|
|
920
|
+
}
|
|
921
|
+
}
|
|
922
|
+
}
|
|
923
|
+
return extractedParameters;
|
|
924
|
+
}
|
|
925
|
+
DomeRouter2.checkUrlMatchRouteAndGetParameters = checkUrlMatchRouteAndGetParameters;
|
|
926
|
+
function parseToNameAndValue(name, value) {
|
|
927
|
+
if (!name) throw new Error("no name");
|
|
928
|
+
const haveMatch = name.match(/:(.+)<(.+)>/);
|
|
929
|
+
if (haveMatch) {
|
|
930
|
+
const paramName = haveMatch[1];
|
|
931
|
+
const paramType = haveMatch[2].toLowerCase();
|
|
932
|
+
if (paramType == "int") {
|
|
933
|
+
return [paramName, parseInt(value)];
|
|
934
|
+
} else if (paramType == "float") {
|
|
935
|
+
return [paramName, parseFloat(value)];
|
|
936
|
+
} else if (paramType == "number") {
|
|
937
|
+
return [paramName, Number(value)];
|
|
938
|
+
} else {
|
|
939
|
+
return [paramName, value];
|
|
940
|
+
}
|
|
941
|
+
} else {
|
|
942
|
+
return [name.substring(1), value];
|
|
943
|
+
}
|
|
944
|
+
}
|
|
945
|
+
function parseQueryString(search) {
|
|
946
|
+
const query = {};
|
|
947
|
+
if (!search || search[0] !== "?") return query;
|
|
948
|
+
const params = new URLSearchParams(search.substring(1));
|
|
949
|
+
for (const [key, value] of params.entries()) {
|
|
950
|
+
query[key] = value;
|
|
951
|
+
}
|
|
952
|
+
return query;
|
|
953
|
+
}
|
|
954
|
+
async function executeAsync(url = window.location.pathname, scrollToPosition) {
|
|
955
|
+
const queryString = window.location.search;
|
|
956
|
+
const query = parseQueryString(queryString);
|
|
957
|
+
url = url.split("?")[0];
|
|
958
|
+
const urlSlices = getRouteSlices(url);
|
|
959
|
+
let countOfFoundRoutes = 0;
|
|
960
|
+
for (let route of allRoutes) {
|
|
961
|
+
if (route.exactMatch && route.routeSlices.length != urlSlices.length) continue;
|
|
962
|
+
let matched = true;
|
|
963
|
+
const extractedParameters = {};
|
|
964
|
+
for (let i = 0; i < route.routeSlices.length; i++) {
|
|
965
|
+
let cRouteSlice = route.routeSlices[i];
|
|
966
|
+
let cUrlSlice = urlSlices[i];
|
|
967
|
+
if (cRouteSlice && typeof cRouteSlice === "string" && cRouteSlice.startsWith(":")) {
|
|
968
|
+
if (cUrlSlice === void 0) {
|
|
969
|
+
matched = false;
|
|
970
|
+
continue;
|
|
971
|
+
}
|
|
972
|
+
const [name, value] = parseToNameAndValue(cRouteSlice, cUrlSlice);
|
|
973
|
+
extractedParameters[name] = value;
|
|
974
|
+
} else {
|
|
975
|
+
if (cRouteSlice !== cUrlSlice) {
|
|
976
|
+
matched = false;
|
|
977
|
+
continue;
|
|
978
|
+
}
|
|
979
|
+
}
|
|
980
|
+
}
|
|
981
|
+
if (matched) {
|
|
982
|
+
countOfFoundRoutes++;
|
|
983
|
+
await route.action(extractedParameters, url, async () => {
|
|
984
|
+
await DomeManipulator.scrollToAsync({
|
|
985
|
+
pxFromTop: scrollToPosition
|
|
986
|
+
});
|
|
987
|
+
}, query);
|
|
988
|
+
}
|
|
989
|
+
}
|
|
990
|
+
if (countOfFoundRoutes == 0 && onNotFoundAction) {
|
|
991
|
+
onNotFoundAction();
|
|
992
|
+
}
|
|
993
|
+
}
|
|
994
|
+
})(DomeRouter || (DomeRouter = {}));
|
package/out/index.mjs
CHANGED
|
@@ -1965,6 +1965,181 @@ var React = {
|
|
|
1965
1965
|
Fragment: typeof DocumentFragment === "function" ? DocumentFragment : () => {
|
|
1966
1966
|
}
|
|
1967
1967
|
};
|
|
1968
|
+
|
|
1969
|
+
// src/DomeRouter.mts
|
|
1970
|
+
var DomeRouter;
|
|
1971
|
+
((DomeRouter2) => {
|
|
1972
|
+
const historyUrls = [];
|
|
1973
|
+
const scrollPositionByUrl = /* @__PURE__ */ new Map();
|
|
1974
|
+
DomeRouter2.maxHistoryUrlsCount = 20;
|
|
1975
|
+
const allRoutes = [];
|
|
1976
|
+
let onNotFoundAction = void 0;
|
|
1977
|
+
window.addEventListener("popstate", async (e) => {
|
|
1978
|
+
const url = window.location.pathname;
|
|
1979
|
+
await executeAsync(url, getScrollPositionForUrl(url));
|
|
1980
|
+
await DomeManipulator.scrollToAsync({
|
|
1981
|
+
pxFromTop: getScrollPositionForUrl(window.location.pathname)
|
|
1982
|
+
});
|
|
1983
|
+
});
|
|
1984
|
+
function getScrollPositionForUrl(url) {
|
|
1985
|
+
var _a;
|
|
1986
|
+
return (_a = scrollPositionByUrl.get(url)) != null ? _a : 0;
|
|
1987
|
+
}
|
|
1988
|
+
function saveScrollPositionForUrl(url) {
|
|
1989
|
+
scrollPositionByUrl.set(url, DomeManipulator.getCurrentScrollPosition());
|
|
1990
|
+
}
|
|
1991
|
+
function saveScrollPositionForCurrentUrl() {
|
|
1992
|
+
scrollPositionByUrl.set(getCurrentUrl(), DomeManipulator.getCurrentScrollPosition());
|
|
1993
|
+
}
|
|
1994
|
+
function navigate(url) {
|
|
1995
|
+
addUrlToHistory(getCurrentUrl());
|
|
1996
|
+
saveScrollPositionForCurrentUrl();
|
|
1997
|
+
window.history.pushState(null, "", url);
|
|
1998
|
+
executeAsync(url, 0);
|
|
1999
|
+
DomeManipulator.scrollToTop();
|
|
2000
|
+
}
|
|
2001
|
+
DomeRouter2.navigate = navigate;
|
|
2002
|
+
function goBack() {
|
|
2003
|
+
window.history.go(-1);
|
|
2004
|
+
}
|
|
2005
|
+
DomeRouter2.goBack = goBack;
|
|
2006
|
+
function goForward() {
|
|
2007
|
+
window.history.go(1);
|
|
2008
|
+
}
|
|
2009
|
+
DomeRouter2.goForward = goForward;
|
|
2010
|
+
function changeUrl(url) {
|
|
2011
|
+
window.history.replaceState(null, "", url);
|
|
2012
|
+
}
|
|
2013
|
+
DomeRouter2.changeUrl = changeUrl;
|
|
2014
|
+
function addUrlToHistory(url) {
|
|
2015
|
+
historyUrls.push({ url, scroll: 0 });
|
|
2016
|
+
while (historyUrls.length > DomeRouter2.maxHistoryUrlsCount) {
|
|
2017
|
+
historyUrls.shift();
|
|
2018
|
+
}
|
|
2019
|
+
if (historyUrls.length > 1) {
|
|
2020
|
+
historyUrls[historyUrls.length - 2].scroll = DomeManipulator.getCurrentScrollPosition();
|
|
2021
|
+
}
|
|
2022
|
+
}
|
|
2023
|
+
function getCurrentUrl() {
|
|
2024
|
+
return window.location.pathname;
|
|
2025
|
+
}
|
|
2026
|
+
DomeRouter2.getCurrentUrl = getCurrentUrl;
|
|
2027
|
+
function getPreviousPageUrl(previousPageIndex = 0) {
|
|
2028
|
+
let index = historyUrls.length - 2 - previousPageIndex;
|
|
2029
|
+
if (index >= 0 && index < historyUrls.length) return historyUrls[index].url;
|
|
2030
|
+
return void 0;
|
|
2031
|
+
}
|
|
2032
|
+
DomeRouter2.getPreviousPageUrl = getPreviousPageUrl;
|
|
2033
|
+
function resolveUrl(url = window.location.pathname, addToHistory = true) {
|
|
2034
|
+
if (addToHistory) addUrlToHistory(window.location.pathname);
|
|
2035
|
+
executeAsync(url, getScrollPositionForUrl(url));
|
|
2036
|
+
}
|
|
2037
|
+
DomeRouter2.resolveUrl = resolveUrl;
|
|
2038
|
+
function onRoute(route, exactMatch, action) {
|
|
2039
|
+
if (route[0] !== "/") throw new Error("Please provide correct route. route=" + route);
|
|
2040
|
+
let routeSlices = getRouteSlices(route);
|
|
2041
|
+
allRoutes.push({ routeSlices, exactMatch, action });
|
|
2042
|
+
}
|
|
2043
|
+
DomeRouter2.onRoute = onRoute;
|
|
2044
|
+
function getRouteSlices(route) {
|
|
2045
|
+
return route.split("/").map((x) => decodeURIComponent(x));
|
|
2046
|
+
}
|
|
2047
|
+
function onNotFound(action) {
|
|
2048
|
+
onNotFoundAction = action;
|
|
2049
|
+
}
|
|
2050
|
+
DomeRouter2.onNotFound = onNotFound;
|
|
2051
|
+
function checkUrlMatchRouteAndGetParameters(url, route, exactMatch = true) {
|
|
2052
|
+
const urlSlices = getRouteSlices(url);
|
|
2053
|
+
const routeSlices = getRouteSlices(route);
|
|
2054
|
+
if (exactMatch && routeSlices.length !== urlSlices.length) return void 0;
|
|
2055
|
+
const extractedParameters = {};
|
|
2056
|
+
for (let i = 0; i < routeSlices.length; i++) {
|
|
2057
|
+
let cRouteSlice = routeSlices[i];
|
|
2058
|
+
let cUrlSlice = urlSlices[i];
|
|
2059
|
+
if (cRouteSlice.startsWith(":")) {
|
|
2060
|
+
if (cUrlSlice === void 0) {
|
|
2061
|
+
return void 0;
|
|
2062
|
+
}
|
|
2063
|
+
const [name, value] = parseToNameAndValue(cRouteSlice, cUrlSlice);
|
|
2064
|
+
extractedParameters[name] = value;
|
|
2065
|
+
} else {
|
|
2066
|
+
if (cRouteSlice !== cUrlSlice) {
|
|
2067
|
+
return void 0;
|
|
2068
|
+
}
|
|
2069
|
+
}
|
|
2070
|
+
}
|
|
2071
|
+
return extractedParameters;
|
|
2072
|
+
}
|
|
2073
|
+
DomeRouter2.checkUrlMatchRouteAndGetParameters = checkUrlMatchRouteAndGetParameters;
|
|
2074
|
+
function parseToNameAndValue(name, value) {
|
|
2075
|
+
if (!name) throw new Error("no name");
|
|
2076
|
+
const haveMatch = name.match(/:(.+)<(.+)>/);
|
|
2077
|
+
if (haveMatch) {
|
|
2078
|
+
const paramName = haveMatch[1];
|
|
2079
|
+
const paramType = haveMatch[2].toLowerCase();
|
|
2080
|
+
if (paramType == "int") {
|
|
2081
|
+
return [paramName, parseInt(value)];
|
|
2082
|
+
} else if (paramType == "float") {
|
|
2083
|
+
return [paramName, parseFloat(value)];
|
|
2084
|
+
} else if (paramType == "number") {
|
|
2085
|
+
return [paramName, Number(value)];
|
|
2086
|
+
} else {
|
|
2087
|
+
return [paramName, value];
|
|
2088
|
+
}
|
|
2089
|
+
} else {
|
|
2090
|
+
return [name.substring(1), value];
|
|
2091
|
+
}
|
|
2092
|
+
}
|
|
2093
|
+
function parseQueryString(search) {
|
|
2094
|
+
const query = {};
|
|
2095
|
+
if (!search || search[0] !== "?") return query;
|
|
2096
|
+
const params = new URLSearchParams(search.substring(1));
|
|
2097
|
+
for (const [key, value] of params.entries()) {
|
|
2098
|
+
query[key] = value;
|
|
2099
|
+
}
|
|
2100
|
+
return query;
|
|
2101
|
+
}
|
|
2102
|
+
async function executeAsync(url = window.location.pathname, scrollToPosition) {
|
|
2103
|
+
const queryString = window.location.search;
|
|
2104
|
+
const query = parseQueryString(queryString);
|
|
2105
|
+
url = url.split("?")[0];
|
|
2106
|
+
const urlSlices = getRouteSlices(url);
|
|
2107
|
+
let countOfFoundRoutes = 0;
|
|
2108
|
+
for (let route of allRoutes) {
|
|
2109
|
+
if (route.exactMatch && route.routeSlices.length != urlSlices.length) continue;
|
|
2110
|
+
let matched = true;
|
|
2111
|
+
const extractedParameters = {};
|
|
2112
|
+
for (let i = 0; i < route.routeSlices.length; i++) {
|
|
2113
|
+
let cRouteSlice = route.routeSlices[i];
|
|
2114
|
+
let cUrlSlice = urlSlices[i];
|
|
2115
|
+
if (cRouteSlice && typeof cRouteSlice === "string" && cRouteSlice.startsWith(":")) {
|
|
2116
|
+
if (cUrlSlice === void 0) {
|
|
2117
|
+
matched = false;
|
|
2118
|
+
continue;
|
|
2119
|
+
}
|
|
2120
|
+
const [name, value] = parseToNameAndValue(cRouteSlice, cUrlSlice);
|
|
2121
|
+
extractedParameters[name] = value;
|
|
2122
|
+
} else {
|
|
2123
|
+
if (cRouteSlice !== cUrlSlice) {
|
|
2124
|
+
matched = false;
|
|
2125
|
+
continue;
|
|
2126
|
+
}
|
|
2127
|
+
}
|
|
2128
|
+
}
|
|
2129
|
+
if (matched) {
|
|
2130
|
+
countOfFoundRoutes++;
|
|
2131
|
+
await route.action(extractedParameters, url, async () => {
|
|
2132
|
+
await DomeManipulator.scrollToAsync({
|
|
2133
|
+
pxFromTop: scrollToPosition
|
|
2134
|
+
});
|
|
2135
|
+
}, query);
|
|
2136
|
+
}
|
|
2137
|
+
}
|
|
2138
|
+
if (countOfFoundRoutes == 0 && onNotFoundAction) {
|
|
2139
|
+
onNotFoundAction();
|
|
2140
|
+
}
|
|
2141
|
+
}
|
|
2142
|
+
})(DomeRouter || (DomeRouter = {}));
|
|
1968
2143
|
export {
|
|
1969
2144
|
AnimatedArray,
|
|
1970
2145
|
AnimatedTable,
|
|
@@ -1973,11 +2148,13 @@ export {
|
|
|
1973
2148
|
DataTypes,
|
|
1974
2149
|
DomeComponent,
|
|
1975
2150
|
DomeManipulator,
|
|
2151
|
+
DomeRouter,
|
|
1976
2152
|
Lock,
|
|
1977
2153
|
ObservableArray,
|
|
1978
2154
|
ObservableLocalStorageArray,
|
|
1979
2155
|
ObservableLocalStorageVariable,
|
|
1980
2156
|
ObservableMap,
|
|
2157
|
+
ObservableVariable as ObservableValue,
|
|
1981
2158
|
ObservableVariable,
|
|
1982
2159
|
React,
|
|
1983
2160
|
TypeEvent,
|
package/out/src/index.d.mts
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
export * from '@lexriver/async';
|
|
2
|
+
export { Async, Lock } from '@lexriver/async';
|
|
2
3
|
export * from '@lexriver/data-types';
|
|
4
|
+
export { DataTypes } from '@lexriver/data-types';
|
|
3
5
|
export * from '@lexriver/observable';
|
|
6
|
+
export { ObservableArray, ObservableLocalStorageArray, ObservableLocalStorageVariable, ObservableMap, ObservableVariable, ObservableVariable as ObservableValue, checkIfObservable, createObservable } from '@lexriver/observable';
|
|
4
7
|
export * from '@lexriver/type-event';
|
|
8
|
+
export { TypeEvent } from '@lexriver/type-event';
|
|
5
9
|
export * from './AnimatedArray.mjs';
|
|
6
10
|
export * from './AnimatedTable.mjs';
|
|
7
11
|
export * from './AnimatedText.mjs';
|
|
8
12
|
export * from './Dome.mjs';
|
|
9
13
|
export * from './DomeComponent.mjs';
|
|
10
14
|
export * from './DomeManipulator.mjs';
|
|
11
|
-
export * from './DomeRouter.
|
|
15
|
+
export * from './DomeRouter.mjs';
|
package/out/src/index.d.ts
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
export * from '@lexriver/async';
|
|
2
|
+
export { Async, Lock } from '@lexriver/async';
|
|
2
3
|
export * from '@lexriver/data-types';
|
|
4
|
+
export { DataTypes } from '@lexriver/data-types';
|
|
3
5
|
export * from '@lexriver/observable';
|
|
6
|
+
export { ObservableArray, ObservableLocalStorageArray, ObservableLocalStorageVariable, ObservableMap, ObservableVariable, ObservableVariable as ObservableValue, checkIfObservable, createObservable } from '@lexriver/observable';
|
|
4
7
|
export * from '@lexriver/type-event';
|
|
8
|
+
export { TypeEvent } from '@lexriver/type-event';
|
|
5
9
|
export * from './AnimatedArray';
|
|
6
10
|
export * from './AnimatedTable';
|
|
7
11
|
export * from './AnimatedText';
|
|
8
12
|
export * from './Dome';
|
|
9
13
|
export * from './DomeComponent';
|
|
10
14
|
export * from './DomeManipulator';
|
|
11
|
-
export * from './DomeRouter
|
|
15
|
+
export * from './DomeRouter';
|
package/out/src/index.mjs
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
export * from '@lexriver/async';
|
|
2
|
+
export { Async, Lock } from '@lexriver/async';
|
|
2
3
|
export * from '@lexriver/data-types';
|
|
4
|
+
export { DataTypes } from '@lexriver/data-types';
|
|
3
5
|
export * from '@lexriver/observable';
|
|
6
|
+
export { ObservableArray, ObservableLocalStorageArray, ObservableLocalStorageVariable, ObservableMap, ObservableVariable, ObservableVariable as ObservableValue, checkIfObservable, createObservable } from '@lexriver/observable';
|
|
4
7
|
export * from '@lexriver/type-event';
|
|
8
|
+
export { TypeEvent } from '@lexriver/type-event';
|
|
5
9
|
export * from './AnimatedArray.mjs';
|
|
6
10
|
export * from './AnimatedTable.mjs';
|
|
7
11
|
export * from './AnimatedText.mjs';
|
|
8
12
|
export * from './Dome.mjs';
|
|
9
13
|
export * from './DomeComponent.mjs';
|
|
10
14
|
export * from './DomeManipulator.mjs';
|
|
11
|
-
export * from './DomeRouter.
|
|
15
|
+
export * from './DomeRouter.mjs';
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"sideEffects": false,
|
|
3
3
|
"name": "@lexriver/dome",
|
|
4
|
-
"version": "2.0.
|
|
4
|
+
"version": "2.0.4",
|
|
5
5
|
"description": "DOM manipulator",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"types": "./out/src/index.d.ts",
|
|
@@ -22,7 +22,8 @@
|
|
|
22
22
|
"scripts": {
|
|
23
23
|
"test": "vitest",
|
|
24
24
|
"build": "rimraf out && tsc && node scripts/build-compat.mjs",
|
|
25
|
-
"test:compat": "npm run build &&
|
|
25
|
+
"test:api-compat": "npm run build && node scripts/test-api-compat.mjs",
|
|
26
|
+
"test:compat": "npm run build && node scripts/test-api-compat.mjs && npm --prefix compatibility/ts39-webpack4 install && npm --prefix compatibility/ts39-webpack4 run build"
|
|
26
27
|
},
|
|
27
28
|
"keywords": [
|
|
28
29
|
"typescript",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
// //import { DomeRouter } from "./DomeRouter"
|
|
2
|
-
// function getRouteSlices(route:string){
|
|
3
|
-
// return route.split('/').filter(x => x.length>0)
|
|
4
|
-
// }
|
|
5
|
-
export {};
|
|
6
|
-
// function checkUrlMatchRouteAndGetParameters(url:string, route:string, exactMatch:boolean = true):Map<string,string>|undefined{
|
|
7
|
-
// // this function is purely for export
|
|
8
|
-
// const urlSlices = getRouteSlices(url)
|
|
9
|
-
// const routeSlices = getRouteSlices(route)
|
|
10
|
-
// if(exactMatch && routeSlices.length !== urlSlices.length) return undefined
|
|
11
|
-
// // all routeSlices must match for !exactMatch
|
|
12
|
-
// const extractedParameters = new Map<string,string>()
|
|
13
|
-
// for(let i=0;i<routeSlices.length;i++){
|
|
14
|
-
// let cRouteSlice = routeSlices[i]
|
|
15
|
-
// let cUrlSlice = urlSlices[i] // could be undefined
|
|
16
|
-
// //console.info('\t\t cRouteSlice=', cRouteSlice, 'cUrlSlice=', cUrlSlice)
|
|
17
|
-
// if(cRouteSlice.startsWith(':')){
|
|
18
|
-
// // we have a param name
|
|
19
|
-
// if(cUrlSlice === undefined){
|
|
20
|
-
// return undefined
|
|
21
|
-
// }
|
|
22
|
-
// // we have some variable, save it
|
|
23
|
-
// extractedParameters.set(cRouteSlice.substring(1), cUrlSlice)
|
|
24
|
-
// } else {
|
|
25
|
-
// // no param name
|
|
26
|
-
// if(cRouteSlice !== cUrlSlice){
|
|
27
|
-
// return undefined
|
|
28
|
-
// }
|
|
29
|
-
// }
|
|
30
|
-
// }
|
|
31
|
-
// return extractedParameters
|
|
32
|
-
// }
|
|
33
|
-
// DomeRouter.onRoute('/', true, ()=>{ console.log('exact /')})
|
|
34
|
-
// DomeRouter.onRoute('/', false, ()=>{ console.log('notexact /')})
|
|
35
|
-
// DomeRouter.onRoute('/test', true, ()=>{ console.log('exact /test')})
|
|
36
|
-
// DomeRouter.onRoute('/test/:id', true, (p)=>{ console.log('exact /test/:id', 'params=', p)})
|
|
37
|
-
// DomeRouter.onRoute('/test/:id', false, (p)=>{ console.log('notexact /test/:id', 'params=', p)})
|
|
38
|
-
// DomeRouter.onRoute('/test', false, ()=>{ console.log('notexact /test')})
|
|
39
|
-
// DomeRouter.onRoute('/test/:id/:id2', true, (p)=>{ console.log('exact /test/:id/:id2', 'params=', p)})
|
|
40
|
-
// let testRoute = '//test/34/st'
|
|
41
|
-
// console.log('** testing route:', testRoute)
|
|
42
|
-
// DomeRouter.execute(testRoute)
|
|
43
|
-
// //expect(!true).toBeTruthy()
|
|
44
|
-
//console.log(checkUrlMatchRouteAndGetParameters('/get-product/123', '/get-product/:id/:id2', false))
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,203 +0,0 @@
|
|
|
1
|
-
import { afterAll, beforeAll, describe, expect, it, vi } from 'vitest';
|
|
2
|
-
import { DomeComponent } from './DomeComponent.mjs';
|
|
3
|
-
import { DomeManipulator } from './DomeManipulator.mjs';
|
|
4
|
-
class FakeElement {
|
|
5
|
-
nodeType = 1;
|
|
6
|
-
childNodes = [];
|
|
7
|
-
classList = {
|
|
8
|
-
values: new Set(),
|
|
9
|
-
add: (name) => this.classList.values.add(name),
|
|
10
|
-
remove: (name) => this.classList.values.delete(name)
|
|
11
|
-
};
|
|
12
|
-
parentNode = null;
|
|
13
|
-
throwOnAppend = false;
|
|
14
|
-
get firstChild() {
|
|
15
|
-
return this.childNodes[0] ?? null;
|
|
16
|
-
}
|
|
17
|
-
appendChild(child) {
|
|
18
|
-
if (child.throwOnAppend) {
|
|
19
|
-
throw new Error('append failed');
|
|
20
|
-
}
|
|
21
|
-
child.parentNode = this;
|
|
22
|
-
this.childNodes.push(child);
|
|
23
|
-
return child;
|
|
24
|
-
}
|
|
25
|
-
remove() {
|
|
26
|
-
if (!this.parentNode)
|
|
27
|
-
return;
|
|
28
|
-
const index = this.parentNode.childNodes.indexOf(this);
|
|
29
|
-
if (index >= 0) {
|
|
30
|
-
this.parentNode.childNodes.splice(index, 1);
|
|
31
|
-
}
|
|
32
|
-
this.parentNode = null;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
const asElement = (element) => element;
|
|
36
|
-
const animation = (name) => ({ cssClassName: name, timeMs: 5 });
|
|
37
|
-
const waitAsync = (timeMs) => new Promise(resolve => setTimeout(resolve, timeMs));
|
|
38
|
-
async function waitForAsync(condition) {
|
|
39
|
-
const timeoutAt = Date.now() + 500;
|
|
40
|
-
while (!condition()) {
|
|
41
|
-
if (Date.now() >= timeoutAt) {
|
|
42
|
-
throw new Error('Timed out waiting for condition');
|
|
43
|
-
}
|
|
44
|
-
await waitAsync(1);
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
function deferred() {
|
|
48
|
-
let resolve;
|
|
49
|
-
const promise = new Promise(resolvePromise => {
|
|
50
|
-
resolve = resolvePromise;
|
|
51
|
-
});
|
|
52
|
-
return { promise, resolve };
|
|
53
|
-
}
|
|
54
|
-
const originalNode = Object.getOwnPropertyDescriptor(globalThis, 'Node');
|
|
55
|
-
beforeAll(() => {
|
|
56
|
-
Object.defineProperty(globalThis, 'Node', {
|
|
57
|
-
configurable: true,
|
|
58
|
-
value: { ELEMENT_NODE: 1 }
|
|
59
|
-
});
|
|
60
|
-
});
|
|
61
|
-
afterAll(() => {
|
|
62
|
-
if (originalNode) {
|
|
63
|
-
Object.defineProperty(globalThis, 'Node', originalNode);
|
|
64
|
-
}
|
|
65
|
-
else {
|
|
66
|
-
delete globalThis.Node;
|
|
67
|
-
}
|
|
68
|
-
});
|
|
69
|
-
describe('DomeManipulator.replaceAllChildrenAsync', () => {
|
|
70
|
-
async function expectLastQueuedReplacement(animationForHide, animationForShow) {
|
|
71
|
-
const container = new FakeElement();
|
|
72
|
-
const existing = new FakeElement();
|
|
73
|
-
const first = new FakeElement();
|
|
74
|
-
const second = new FakeElement();
|
|
75
|
-
container.appendChild(existing);
|
|
76
|
-
await Promise.all([
|
|
77
|
-
DomeManipulator.replaceAllChildrenAsync(asElement(container), asElement(first), animationForHide, animationForShow),
|
|
78
|
-
DomeManipulator.replaceAllChildrenAsync(asElement(container), asElement(second), animationForHide, animationForShow)
|
|
79
|
-
]);
|
|
80
|
-
expect(container.childNodes).toEqual([second]);
|
|
81
|
-
}
|
|
82
|
-
it('serializes two concurrent replacements without animations', async () => {
|
|
83
|
-
await expectLastQueuedReplacement();
|
|
84
|
-
});
|
|
85
|
-
it('serializes concurrent replacements with a hide animation', async () => {
|
|
86
|
-
await expectLastQueuedReplacement(animation('hide'));
|
|
87
|
-
});
|
|
88
|
-
it('serializes concurrent replacements with a show animation', async () => {
|
|
89
|
-
await expectLastQueuedReplacement(undefined, animation('show'));
|
|
90
|
-
});
|
|
91
|
-
it('serializes concurrent replacements with hide and show animations', async () => {
|
|
92
|
-
await expectLastQueuedReplacement(animation('hide'), animation('show'));
|
|
93
|
-
});
|
|
94
|
-
it('runs replacements on different containers independently', async () => {
|
|
95
|
-
const slowContainer = new FakeElement();
|
|
96
|
-
const fastContainer = new FakeElement();
|
|
97
|
-
const oldSlowChild = new FakeElement();
|
|
98
|
-
const slowChild = new FakeElement();
|
|
99
|
-
const fastChild = new FakeElement();
|
|
100
|
-
slowContainer.appendChild(oldSlowChild);
|
|
101
|
-
let slowReplacementFinished = false;
|
|
102
|
-
const slowReplacement = DomeManipulator.replaceAllChildrenAsync(asElement(slowContainer), asElement(slowChild), { cssClassName: 'hide', timeMs: 30 }).then(() => {
|
|
103
|
-
slowReplacementFinished = true;
|
|
104
|
-
});
|
|
105
|
-
await waitAsync(1);
|
|
106
|
-
await DomeManipulator.replaceAllChildrenAsync(asElement(fastContainer), asElement(fastChild));
|
|
107
|
-
expect(fastContainer.childNodes).toEqual([fastChild]);
|
|
108
|
-
expect(slowReplacementFinished).toBe(false);
|
|
109
|
-
expect(slowContainer.childNodes).toEqual([oldSlowChild]);
|
|
110
|
-
await slowReplacement;
|
|
111
|
-
});
|
|
112
|
-
it('does not let a failed replacement block a later replacement', async () => {
|
|
113
|
-
const container = new FakeElement();
|
|
114
|
-
const failingChild = new FakeElement();
|
|
115
|
-
const successfulChild = new FakeElement();
|
|
116
|
-
failingChild.throwOnAppend = true;
|
|
117
|
-
const failedReplacement = DomeManipulator.replaceAllChildrenAsync(asElement(container), asElement(failingChild));
|
|
118
|
-
const queuedReplacement = DomeManipulator.replaceAllChildrenAsync(asElement(container), asElement(successfulChild));
|
|
119
|
-
await expect(failedReplacement).rejects.toThrow('append failed');
|
|
120
|
-
await queuedReplacement;
|
|
121
|
-
expect(container.childNodes).toEqual([successfulChild]);
|
|
122
|
-
});
|
|
123
|
-
});
|
|
124
|
-
class ScheduledTestComponent extends DomeComponent {
|
|
125
|
-
updateCount = 0;
|
|
126
|
-
activeUpdates = 0;
|
|
127
|
-
maximumActiveUpdates = 0;
|
|
128
|
-
updateBehavior = async () => undefined;
|
|
129
|
-
render() {
|
|
130
|
-
return {};
|
|
131
|
-
}
|
|
132
|
-
async updateAsync() {
|
|
133
|
-
this.updateCount++;
|
|
134
|
-
this.activeUpdates++;
|
|
135
|
-
this.maximumActiveUpdates = Math.max(this.maximumActiveUpdates, this.activeUpdates);
|
|
136
|
-
try {
|
|
137
|
-
await this.updateBehavior();
|
|
138
|
-
}
|
|
139
|
-
finally {
|
|
140
|
-
this.activeUpdates--;
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
describe('DomeComponent.scheduleUpdate', () => {
|
|
145
|
-
it('debounces repeated requests made before an update starts', async () => {
|
|
146
|
-
const component = new ScheduledTestComponent({}, null);
|
|
147
|
-
await Promise.all([
|
|
148
|
-
component.scheduleUpdate(),
|
|
149
|
-
component.scheduleUpdate(),
|
|
150
|
-
component.scheduleUpdate()
|
|
151
|
-
]);
|
|
152
|
-
expect(component.updateCount).toBe(1);
|
|
153
|
-
});
|
|
154
|
-
it('coalesces requests during an update into exactly one follow-up update', async () => {
|
|
155
|
-
const component = new ScheduledTestComponent({}, null);
|
|
156
|
-
const firstUpdate = deferred();
|
|
157
|
-
component.updateBehavior = () => component.updateCount === 1
|
|
158
|
-
? firstUpdate.promise
|
|
159
|
-
: Promise.resolve();
|
|
160
|
-
const initialSchedule = component.scheduleUpdate();
|
|
161
|
-
await waitForAsync(() => component.updateCount === 1);
|
|
162
|
-
component.scheduleUpdate();
|
|
163
|
-
component.scheduleUpdate();
|
|
164
|
-
component.scheduleUpdate();
|
|
165
|
-
await waitAsync(10);
|
|
166
|
-
firstUpdate.resolve();
|
|
167
|
-
await initialSchedule;
|
|
168
|
-
expect(component.updateCount).toBe(2);
|
|
169
|
-
});
|
|
170
|
-
it('never runs scheduled updates concurrently for one component', async () => {
|
|
171
|
-
const component = new ScheduledTestComponent({}, null);
|
|
172
|
-
const firstUpdate = deferred();
|
|
173
|
-
component.updateBehavior = () => component.updateCount === 1
|
|
174
|
-
? firstUpdate.promise
|
|
175
|
-
: Promise.resolve();
|
|
176
|
-
const initialSchedule = component.scheduleUpdate();
|
|
177
|
-
await waitForAsync(() => component.updateCount === 1);
|
|
178
|
-
component.scheduleUpdate();
|
|
179
|
-
await waitAsync(10);
|
|
180
|
-
expect(component.maximumActiveUpdates).toBe(1);
|
|
181
|
-
firstUpdate.resolve();
|
|
182
|
-
await initialSchedule;
|
|
183
|
-
expect(component.maximumActiveUpdates).toBe(1);
|
|
184
|
-
});
|
|
185
|
-
it('allows subsequent scheduled updates after updateAsync rejects', async () => {
|
|
186
|
-
const component = new ScheduledTestComponent({}, null);
|
|
187
|
-
const consoleError = vi.spyOn(console, 'error').mockImplementation(() => undefined);
|
|
188
|
-
component.updateBehavior = async () => {
|
|
189
|
-
if (component.updateCount === 1) {
|
|
190
|
-
throw new Error('update failed');
|
|
191
|
-
}
|
|
192
|
-
};
|
|
193
|
-
try {
|
|
194
|
-
await component.scheduleUpdate();
|
|
195
|
-
await component.scheduleUpdate();
|
|
196
|
-
}
|
|
197
|
-
finally {
|
|
198
|
-
consoleError.mockRestore();
|
|
199
|
-
}
|
|
200
|
-
expect(component.updateCount).toBe(2);
|
|
201
|
-
expect(component.maximumActiveUpdates).toBe(1);
|
|
202
|
-
});
|
|
203
|
-
});
|
package/out/src/temp-test.d.mts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/out/src/temp-test.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/out/src/temp-test.mjs
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { LongestCommonSubsequence } from "./LongestCommonSubsequence.mjs";
|
|
2
|
-
let oldArray = "ABCD".split('');
|
|
3
|
-
let newArray = "AXYZBCD345".split('');
|
|
4
|
-
const countOfOperations = LongestCommonSubsequence.getPatchOrdered({
|
|
5
|
-
oldArray: [...oldArray],
|
|
6
|
-
newArray: newArray,
|
|
7
|
-
onRemove: (index, item) => {
|
|
8
|
-
console.log('-', item, index);
|
|
9
|
-
oldArray.splice(index, 1);
|
|
10
|
-
},
|
|
11
|
-
onAdd: (index, item) => {
|
|
12
|
-
console.log('+', item, index);
|
|
13
|
-
oldArray.splice(index, 0, item);
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
console.log('expecting equal', oldArray, newArray);
|
|
17
|
-
console.log('countOfOperations=', countOfOperations);
|
|
18
|
-
//expect(oldArray).toEqual(newArray)
|
|
19
|
-
// console.log('result oldArray=', oldArray)
|
|
20
|
-
// console.log('result nweArray=', newArray)
|