@allurereport/web-commons 3.0.1 → 3.2.0

package/dist/stores/loadableStore/store.d.ts

@@ -0,0 +1,13 @@
+import { LOADABLE_STORE_BRAND } from "./constants.js";
+import type { LoadableStoreValue } from "./types.js";
+export type LoadableStore<T> = ReturnType<typeof loadableStore<T>>;
+export declare const loadableStore: <T>(options: {
+    initialState: T;
+}) => {
+    readonly value: LoadableStoreValue<T>;
+    readonly onInit: () => void;
+    readonly onLoad: (silent?: boolean) => void;
+    readonly onSuccess: (data: T) => void;
+    readonly onError: (error?: Error) => void;
+    readonly brand: typeof LOADABLE_STORE_BRAND;
+};

package/dist/stores/loadableStore/store.js

@@ -0,0 +1,47 @@
+import { batch, computed, signal } from "@preact/signals-core";
+import { LOADABLE_STORE_BRAND } from "./constants.js";
+export const loadableStore = (options) => {
+    const loadingSignal = signal(false);
+    const errorSignal = signal(undefined);
+    const dataSignal = signal(options.initialState);
+    return {
+        value: {
+            data: computed(() => dataSignal.value),
+            loading: computed(() => loadingSignal.value),
+            error: computed(() => errorSignal.value),
+            errorMessage: computed(() => {
+                if (errorSignal.value) {
+                    return errorSignal.value.message;
+                }
+                return undefined;
+            }),
+        },
+        onInit: () => {
+            batch(() => {
+                loadingSignal.value = false;
+                errorSignal.value = undefined;
+                dataSignal.value = options.initialState;
+            });
+        },
+        onLoad: (silent = false) => {
+            batch(() => {
+                loadingSignal.value = !silent;
+                errorSignal.value = undefined;
+            });
+        },
+        onSuccess: (data) => {
+            batch(() => {
+                loadingSignal.value = false;
+                errorSignal.value = undefined;
+                dataSignal.value = data;
+            });
+        },
+        onError: (error = new Error("Unknown error")) => {
+            batch(() => {
+                loadingSignal.value = false;
+                errorSignal.value = error;
+            });
+        },
+        brand: LOADABLE_STORE_BRAND,
+    };
+};

package/dist/stores/loadableStore/types.d.ts

@@ -0,0 +1,7 @@
+import type { ReadonlySignal } from "@preact/signals-core";
+export type LoadableStoreValue<T> = {
+    error: ReadonlySignal<Error | undefined>;
+    errorMessage: ReadonlySignal<string | undefined>;
+    loading: ReadonlySignal<boolean>;
+    data: ReadonlySignal<T>;
+};

package/dist/stores/loadableStore/types.js

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

package/dist/stores/loadableStore/utils.d.ts

@@ -0,0 +1,2 @@
+import type { LoadableStore } from "./store.js";
+export declare const isLoadableStore: <T>(value: unknown) => value is LoadableStore<T>;

package/dist/stores/loadableStore/utils.js

@@ -0,0 +1,7 @@
+import { LOADABLE_STORE_BRAND } from "./constants.js";
+export const isLoadableStore = (value) => {
+    if (typeof value !== "object" || value === null) {
+        return false;
+    }
+    return "brand" in value && value.brand === LOADABLE_STORE_BRAND;
+};

package/dist/stores/persister/index.d.ts

@@ -0,0 +1,12 @@
+import { type Signal } from "@preact/signals-core";
+export declare const persistSignal: <S extends Signal<unknown>>(options: {
+    signal: S;
+    key: string;
+    shouldPersist?: (v: S extends Signal<infer U> ? U : never) => boolean;
+}) => (() => void) | undefined;
+export declare const restoreSignal: <S extends Signal<unknown>, V = S extends Signal<infer U> ? U : unknown>(options: {
+    signal: S;
+    key: string;
+    defaultValue?: V;
+    onRestore?: (value: any) => V | undefined;
+}) => void;

package/dist/stores/persister/index.js

@@ -0,0 +1,36 @@
+import { effect } from "@preact/signals-core";
+export const persistSignal = (options) => {
+    if (typeof window === "undefined") {
+        return;
+    }
+    const { signal, key, shouldPersist = () => true } = options;
+    return effect(() => {
+        const value = signal.value;
+        if (!shouldPersist(value)) {
+            return;
+        }
+        try {
+            window.localStorage.setItem(key, typeof value === "string" ? value : JSON.stringify(value));
+        }
+        catch { }
+    });
+};
+export const restoreSignal = (options) => {
+    if (typeof window === "undefined") {
+        return;
+    }
+    const { signal, key, defaultValue, onRestore = (v) => v } = options;
+    const value = window.localStorage.getItem(key);
+    if (value !== null) {
+        let parsedValue = value;
+        try {
+            parsedValue = JSON.parse(value);
+        }
+        catch { }
+        signal.value = onRestore(parsedValue);
+        return;
+    }
+    if ("defaultValue" in options) {
+        signal.value = defaultValue;
+    }
+};

package/dist/stores/router/index.d.ts

@@ -0,0 +1,18 @@
+export declare const router: import("@preact/signals-core").ReadonlySignal<{
+    readonly path: string;
+    readonly pathParts: string[];
+}>;
+type NavigateTo = {
+    path: string;
+    keepSearchParams?: boolean;
+    searchParams?: Record<string, string | string[] | number | undefined>;
+    params?: Record<string, string | undefined>;
+    replace?: boolean;
+};
+export declare const navigateTo: (to: NavigateTo) => void;
+type Route<Params extends Record<string, string | undefined>> = {
+    matches: boolean;
+    params: Params;
+};
+export declare const createRoute: <Params extends Record<string, string | undefined>>(path: string, validate?: (route: Route<Params>) => boolean) => Route<Params>;
+export {};

package/dist/stores/router/index.js

@@ -0,0 +1,95 @@
+import { computed } from "@preact/signals-core";
+import { paramsToSearchParams } from "../url/helpers.js";
+import { currentUrl, goTo } from "../url/index.js";
+export const router = computed(() => {
+    const hash = currentUrl.value.hash.startsWith("#") ? currentUrl.value.hash.slice(1) : currentUrl.value.hash;
+    return {
+        path: hash,
+        pathParts: hash.split("/").filter(Boolean),
+    };
+});
+const createRouteUrl = (path, params) => {
+    return path
+        .split("/")
+        .map((part) => {
+        if (part.startsWith(":")) {
+            const isOptional = part.endsWith("?");
+            const paramKey = isOptional ? part.slice(1, -1) : part.slice(1);
+            const value = params[paramKey];
+            if (value) {
+                return value.toString();
+            }
+            if (isOptional) {
+                return "";
+            }
+            return part;
+        }
+        return part;
+    })
+        .filter(Boolean)
+        .join("/");
+};
+export const navigateTo = (to) => {
+    const { path, params = {}, replace = false, searchParams = {}, keepSearchParams = false } = to;
+    const currentPathname = currentUrl.value.pathname;
+    const newUrl = new URL(currentPathname, currentUrl.value.origin);
+    const routeUrl = createRouteUrl(path, params);
+    newUrl.hash = routeUrl === "" || routeUrl === "/" ? "" : `#${routeUrl}`;
+    if (keepSearchParams) {
+        paramsToSearchParams(currentUrl.value.params, newUrl.searchParams);
+    }
+    Object.entries(searchParams).forEach(([key, value]) => {
+        if (!value) {
+            return;
+        }
+        if (Array.isArray(value)) {
+            for (const v of value) {
+                newUrl.searchParams.set(key, v.toString());
+            }
+        }
+        newUrl.searchParams.set(key, value.toString());
+    });
+    goTo(newUrl, { replace });
+};
+export const createRoute = (path, validate = () => true) => {
+    if (path === "/" && router.value.pathParts.length === 0) {
+        return { matches: true, params: {} };
+    }
+    const routeParts = path.split("/").filter(Boolean);
+    const currentParts = router.value.pathParts;
+    const params = {};
+    let routeIndex = 0;
+    let currentIndex = 0;
+    while (routeIndex < routeParts.length && currentIndex < currentParts.length) {
+        const routePart = routeParts[routeIndex];
+        const currentPart = currentParts[currentIndex];
+        if (routePart.startsWith(":")) {
+            const isOptional = routePart.endsWith("?");
+            const paramKey = isOptional ? routePart.slice(1, -1) : routePart.slice(1);
+            params[paramKey] = currentPart;
+            routeIndex++;
+            currentIndex++;
+        }
+        else if (routePart === currentPart) {
+            routeIndex++;
+            currentIndex++;
+        }
+        else {
+            return { matches: false, params: {} };
+        }
+    }
+    while (routeIndex < routeParts.length) {
+        const routePart = routeParts[routeIndex];
+        if (routePart.startsWith(":") && routePart.endsWith("?")) {
+            const paramKey = routePart.slice(1, -1);
+            params[paramKey] = undefined;
+            routeIndex++;
+        }
+        else {
+            return { matches: false, params: {} };
+        }
+    }
+    const matches = currentIndex === currentParts.length;
+    const route = { matches, params };
+    return { matches: matches && validate(route), params };
+};

package/dist/stores/theme/actions.d.ts

@@ -0,0 +1,3 @@
+import type { UserTheme } from "./types.js";
+export declare const setUserTheme: (theme: UserTheme) => void;
+export declare const toggleUserTheme: () => void;

package/dist/stores/theme/actions.js

@@ -0,0 +1,30 @@
+import { effect } from "@preact/signals-core";
+import { SELECTED_THEMES, THEME_DARK, THEME_LIGHT } from "./constants.js";
+import { currentTheme, preferredTheme, userTheme } from "./store.js";
+import { getPrefersColorSchemeMQ } from "./utils.js";
+const initThemeStore = () => {
+    if (typeof window === "undefined") {
+        return;
+    }
+    effect(() => {
+        document.documentElement.setAttribute("data-theme", currentTheme.value);
+    });
+    const preffersMediaQuery = getPrefersColorSchemeMQ();
+    preffersMediaQuery.addEventListener("change", (event) => {
+        if (event.matches) {
+            preferredTheme.value = THEME_DARK;
+        }
+        else {
+            preferredTheme.value = THEME_LIGHT;
+        }
+    });
+};
+export const setUserTheme = (theme) => {
+    userTheme.value = theme;
+};
+export const toggleUserTheme = () => {
+    const current = userTheme.peek();
+    const next = SELECTED_THEMES[(SELECTED_THEMES.indexOf(current) + 1) % SELECTED_THEMES.length];
+    setUserTheme(next);
+};
+initThemeStore();

package/dist/stores/theme/constants.d.ts

@@ -0,0 +1,6 @@
+import type { UserTheme } from "./types.js";
+export declare const THEME_AUTO = "auto";
+export declare const THEME_LIGHT = "light";
+export declare const THEME_DARK = "dark";
+export declare const STORAGE_KEY = "theme";
+export declare const SELECTED_THEMES: UserTheme[];

package/dist/stores/theme/constants.js

@@ -0,0 +1,5 @@
+export const THEME_AUTO = "auto";
+export const THEME_LIGHT = "light";
+export const THEME_DARK = "dark";
+export const STORAGE_KEY = "theme";
+export const SELECTED_THEMES = [THEME_LIGHT, THEME_DARK, THEME_AUTO];

package/dist/stores/theme/index.d.ts

@@ -0,0 +1,2 @@
+export { setUserTheme, toggleUserTheme } from "./actions.js";
+export { themeStore } from "./store.js";

package/dist/stores/theme/index.js

@@ -0,0 +1,2 @@
+export { setUserTheme, toggleUserTheme } from "./actions.js";
+export { themeStore } from "./store.js";

package/dist/stores/theme/store.d.ts

@@ -0,0 +1,8 @@
+import type { UITheme, UserTheme } from "./types.js";
+export declare const currentTheme: import("@preact/signals-core").ReadonlySignal<UITheme>;
+export declare const userTheme: import("@preact/signals-core").Signal<UserTheme>;
+export declare const preferredTheme: import("@preact/signals-core").Signal<UITheme>;
+export declare const themeStore: import("@preact/signals-core").ReadonlySignal<{
+    readonly current: UITheme;
+    readonly selected: UserTheme;
+}>;

package/dist/stores/theme/store.js

@@ -0,0 +1,41 @@
+import { computed, signal } from "@preact/signals-core";
+import { getReportOptions } from "../../data.js";
+import { persistSignal, restoreSignal } from "../persister/index.js";
+import { STORAGE_KEY, THEME_AUTO, THEME_DARK, THEME_LIGHT } from "./constants.js";
+import { getPrefersColorSchemeMQ, isAcceptedThemeValue, isAutoTheme } from "./utils.js";
+const reportConfigTheme = getReportOptions()?.theme;
+const getInitialPreferredTheme = () => {
+    if (typeof window === "undefined") {
+        return THEME_LIGHT;
+    }
+    if (getPrefersColorSchemeMQ().matches) {
+        return THEME_DARK;
+    }
+    return THEME_LIGHT;
+};
+export const currentTheme = computed(() => {
+    if (isAutoTheme(userTheme.value)) {
+        return preferredTheme.value;
+    }
+    return userTheme.value;
+});
+export const userTheme = signal(THEME_AUTO);
+export const preferredTheme = signal(getInitialPreferredTheme());
+restoreSignal({
+    signal: userTheme,
+    key: STORAGE_KEY,
+    onRestore: (value) => {
+        if (isAcceptedThemeValue(value)) {
+            return value;
+        }
+        return reportConfigTheme ?? THEME_AUTO;
+    },
+});
+persistSignal({
+    signal: userTheme,
+    key: STORAGE_KEY,
+});
+export const themeStore = computed(() => ({
+    current: currentTheme.value,
+    selected: userTheme.value,
+}));

package/dist/stores/theme/types.d.ts

@@ -0,0 +1,2 @@
+export type UITheme = "light" | "dark";
+export type UserTheme = UITheme | "auto";

package/dist/stores/theme/types.js

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

package/dist/stores/theme/utils.d.ts

@@ -0,0 +1,4 @@
+import type { UserTheme } from "./types.js";
+export declare const getPrefersColorSchemeMQ: () => MediaQueryList;
+export declare const isAcceptedThemeValue: (value: unknown) => value is UserTheme;
+export declare const isAutoTheme: (theme: UserTheme) => theme is "auto";

package/dist/stores/theme/utils.js

@@ -0,0 +1,23 @@
+import { SELECTED_THEMES, THEME_AUTO } from "./constants.js";
+const nullMediaQueryList = {
+    matches: false,
+    addEventListener: () => { },
+    removeEventListener: () => { },
+    media: "",
+    onchange: () => { },
+    addListener: () => { },
+    removeListener: () => { },
+    dispatchEvent: () => true,
+};
+export const getPrefersColorSchemeMQ = () => {
+    if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
+        return nullMediaQueryList;
+    }
+    return window.matchMedia("(prefers-color-scheme: dark)");
+};
+export const isAcceptedThemeValue = (value) => {
+    return SELECTED_THEMES.includes(value);
+};
+export const isAutoTheme = (theme) => {
+    return theme === THEME_AUTO;
+};

package/dist/stores/url/helpers.d.ts

@@ -0,0 +1,12 @@
+export declare const subscribeToUrlChange: (callback: () => void) => (() => void) | undefined;
+type NavigateTo = URL | string | {
+    path: string;
+};
+type NavigateToOptions = {
+    replace?: boolean;
+};
+export declare const goTo: (to: NavigateTo, options?: NavigateToOptions) => void;
+export declare const getCurrentUrl: () => string;
+export declare const paramsToSearchParams: (params: Record<string, string | string[]>, searchParams?: URLSearchParams) => URLSearchParams;
+export declare const searchParamsToParams: (searchParams: URLSearchParams) => Record<string, string | string[]>;
+export {};

package/dist/stores/url/helpers.js

@@ -0,0 +1,74 @@
+export const subscribeToUrlChange = (callback) => {
+    if (typeof window === "undefined") {
+        return;
+    }
+    window.addEventListener("popstate", callback);
+    window.addEventListener("replaceState", callback);
+    window.addEventListener("pushState", callback);
+    window.addEventListener("hashchange", callback);
+    return () => {
+        window.removeEventListener("popstate", callback);
+        window.removeEventListener("replaceState", callback);
+        window.removeEventListener("pushState", callback);
+        window.removeEventListener("hashchange", callback);
+    };
+};
+const getUrl = (to) => {
+    if (typeof to === "string") {
+        return to;
+    }
+    if (to instanceof URL) {
+        return to;
+    }
+    return new URL(to.path, getCurrentUrl());
+};
+export const goTo = (to, options) => {
+    if (typeof window === "undefined") {
+        return;
+    }
+    const url = getUrl(to);
+    if (options?.replace) {
+        window.history.replaceState(null, "", url);
+        window.dispatchEvent(new Event("replaceState"));
+    }
+    else {
+        window.history.pushState(null, "", url);
+        window.dispatchEvent(new Event("pushState"));
+    }
+};
+export const getCurrentUrl = () => {
+    if (typeof window === "undefined") {
+        return "";
+    }
+    return window.location.href;
+};
+export const paramsToSearchParams = (params, searchParams = new URLSearchParams()) => {
+    Object.entries(params).forEach(([key, value]) => {
+        if (Array.isArray(value)) {
+            for (const v of value) {
+                searchParams.append(key, v);
+            }
+        }
+        else {
+            searchParams.set(key, value);
+        }
+    });
+    return searchParams;
+};
+export const searchParamsToParams = (searchParams) => {
+    const params = {};
+    searchParams.forEach((value, key) => {
+        if (key in params) {
+            if (Array.isArray(params[key])) {
+                params[key].push(value);
+            }
+            else {
+                params[key] = [params[key], value];
+            }
+        }
+        else {
+            params[key] = value;
+        }
+    });
+    return params;
+};

package/dist/stores/url/index.d.ts

@@ -0,0 +1,2 @@
+export { getParamValue, getParamValues, hasParam, setParams, currentUrl, type Param } from "./store.js";
+export { goTo, getCurrentUrl } from "./helpers.js";

package/dist/stores/url/index.js

@@ -0,0 +1,2 @@
+export { getParamValue, getParamValues, hasParam, setParams, currentUrl } from "./store.js";
+export { goTo, getCurrentUrl } from "./helpers.js";

package/dist/stores/url/store.d.ts

@@ -0,0 +1,19 @@
+export declare const currentUrlSignal: import("@preact/signals-core").Signal<string>;
+export declare const urlSearchParams: import("@preact/signals-core").ReadonlySignal<URLSearchParams>;
+export type Param = {
+    key: string;
+    value: string | string[] | undefined;
+};
+export declare const setParams: (...params: Param[]) => void;
+export declare const currentUrl: import("@preact/signals-core").ReadonlySignal<{
+    readonly hash: string;
+    readonly pathname: string;
+    readonly origin: string;
+    readonly params: Record<string, string | string[]>;
+}>;
+export declare const getParamValue: (key: string) => string | null;
+export declare const getParamValues: (key: string) => string[];
+export declare const hasParam: (key: string) => boolean;
+export declare const getParamValueComputed: (key: string) => import("@preact/signals-core").ReadonlySignal<string | null>;
+export declare const getParamValuesComputed: (key: string) => import("@preact/signals-core").ReadonlySignal<string[]>;
+export declare const hasParamComputed: (key: string) => import("@preact/signals-core").ReadonlySignal<boolean>;

package/dist/stores/url/store.js

@@ -0,0 +1,45 @@
+import { computed, signal } from "@preact/signals-core";
+import { getCurrentUrl, goTo, searchParamsToParams, subscribeToUrlChange } from "./helpers.js";
+export const currentUrlSignal = signal(getCurrentUrl());
+subscribeToUrlChange(() => {
+    if (currentUrlSignal.peek() === getCurrentUrl()) {
+        return;
+    }
+    currentUrlSignal.value = getCurrentUrl();
+});
+const urlSignal = computed(() => new URL(currentUrlSignal.value));
+export const urlSearchParams = computed(() => urlSignal.value.searchParams);
+export const setParams = (...params) => {
+    const newUrl = new URL(getCurrentUrl());
+    for (const param of params) {
+        newUrl.searchParams.delete(param.key);
+        if (Array.isArray(param.value)) {
+            for (const value of param.value) {
+                newUrl.searchParams.append(param.key, value);
+            }
+        }
+        else if (typeof param.value === "string") {
+            newUrl.searchParams.set(param.key, param.value);
+        }
+    }
+    if (newUrl.href === urlSignal.peek().href) {
+        return;
+    }
+    goTo(newUrl.href, {
+        replace: true,
+    });
+};
+export const currentUrl = computed(() => {
+    return {
+        hash: urlSignal.value.hash,
+        pathname: urlSignal.value.pathname,
+        origin: urlSignal.value.origin,
+        params: searchParamsToParams(urlSearchParams.value),
+    };
+});
+export const getParamValue = (key) => urlSearchParams.value.get(key);
+export const getParamValues = (key) => urlSearchParams.value.getAll(key);
+export const hasParam = (key) => urlSearchParams.value.has(key);
+export const getParamValueComputed = (key) => computed(() => getParamValue(key));
+export const getParamValuesComputed = (key) => computed(() => getParamValues(key));
+export const hasParamComputed = (key) => computed(() => hasParam(key));

package/dist/utils.d.ts

@@ -0,0 +1,2 @@
+import { type ReadonlySignal, type Signal } from "@preact/signals-core";
+export declare const isSignal: (value: unknown) => value is Signal | ReadonlySignal;

package/dist/utils.js

@@ -0,0 +1,9 @@
+import { signal } from "@preact/signals-core";
+const signalExample = signal(1);
+export const isSignal = (value) => {
+    return (typeof value === "object" &&
+        value !== null &&
+        "brand" in value &&
+        typeof value.brand === "symbol" &&
+        value.brand === signalExample.brand);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@allurereport/web-commons",
-  "version": "3.0.1",
+  "version": "3.2.0",
   "description": "Collection of utilities used across the web Allure reports",
   "keywords": [
     "allure",
@@ -20,12 +20,16 @@
   ],
   "scripts": {
     "build": "run clean && tsc --project ./tsconfig.json",
-    "clean": "rimraf ./dist"
+    "clean": "rimraf ./dist",
+    "test": "vitest run"
   },
   "dependencies": {
-    "@allurereport/charts-api": "3.0.1",
-    "@allurereport/core-api": "3.0.1",
-    "@allurereport/plugin-api": "3.0.1",
+    "@allurereport/aql": "3.2.0",
+    "@allurereport/charts-api": "3.2.0",
+    "@allurereport/core-api": "3.2.0",
+    "@allurereport/plugin-api": "3.2.0",
+    "@preact/signals": "^2.6.1",
+    "@preact/signals-core": "^1.12.2",
     "ansi-to-html": "^0.7.2",
     "d3-interpolate": "^3.0.1",
     "d3-scale": "^4.0.2",
@@ -51,6 +55,7 @@
     "eslint-plugin-n": "^17.10.1",
     "eslint-plugin-no-null": "^1.0.2",
     "eslint-plugin-prefer-arrow": "^1.2.3",
+    "jsdom": "^26.1.0",
     "rimraf": "^6.0.1",
     "tslib": "^2.7.0",
     "typescript": "^5.6.3",

package/dist/charts/generateFBSUAgePyramid.d.ts

@@ -1,5 +0,0 @@
-import type { AllureChartsStoreData, FBSUAgePyramidChartData, FBSUAgePyramidChartOptions } from "@allurereport/charts-api";
-export declare const generateFBSUAgePyramid: (props: {
-    options: FBSUAgePyramidChartOptions;
-    storeData: AllureChartsStoreData;
-}) => FBSUAgePyramidChartData;