@lana-commerce/core 11.0.0

package/esm/modules/recentlyVisitedProducts.js

@@ -0,0 +1,70 @@
+import { combine, createEffect, createEvent, createStore, forward, sample } from "effector";
+import { request } from "../request.js";
+import { compact } from "../compact.js";
+export function createRecentlyVisitedProducts(config) {
+    const init = () => {
+        try {
+            return JSON.parse(localStorage.getItem(config.key) || "[]");
+        }
+        catch {
+            return [];
+        }
+    };
+    const recentlyVisitedProducts = createStore([]);
+    const recentlyVisitedProductIDs = createStore(init());
+    recentlyVisitedProductIDs.updates.watch((v) => {
+        try {
+            localStorage.setItem(config.key, JSON.stringify(v));
+        }
+        catch { }
+    });
+    const fetchProductsFx = createEffect(async (pl) => {
+        const existingIDs = new Set(pl.currentProducts.map((p) => p.id));
+        const missingIDs = pl.ids.filter((id) => !existingIDs.has(id));
+        let newProducts = [];
+        if (missingIDs.length > 0) {
+            const resp = await request(config.graphql.getProductsQuery)({
+                shopID: config.shopID,
+                ids: missingIDs,
+            }, config.opts);
+            newProducts = resp.kind === "data" ? resp.data : [];
+        }
+        return {
+            ...pl,
+            newProducts,
+        };
+    });
+    const addRecentlyVisitedProduct = createEvent();
+    recentlyVisitedProductIDs.on(addRecentlyVisitedProduct, (ids, id) => {
+        const a = ids.filter((v) => v !== id);
+        a.splice(0, 0, id);
+        if (a.length > 10) {
+            a.length = 10;
+        }
+        return a;
+    });
+    recentlyVisitedProducts.on(fetchProductsFx.doneData, (_, result) => {
+        const allProducts = new Map();
+        for (const p of [...result.currentProducts, ...result.newProducts]) {
+            allProducts.set(p.id, p);
+        }
+        return compact(result.ids.map((id) => allProducts.get(id)));
+    });
+    const fetchNow = createEvent();
+    forward({
+        from: sample(combine({ currentProducts: recentlyVisitedProducts, ids: recentlyVisitedProductIDs }), fetchNow),
+        to: fetchProductsFx,
+    });
+    forward({
+        from: sample(recentlyVisitedProducts, recentlyVisitedProductIDs, (currentProducts, ids) => ({
+            currentProducts,
+            ids,
+        })),
+        to: fetchProductsFx,
+    });
+    fetchNow();
+    return {
+        addRecentlyVisitedProduct,
+        recentlyVisitedProducts,
+    };
+}

package/esm/modules/search.js

@@ -0,0 +1,103 @@
+import { combine, createEffect, createEvent, createStore, forward, guard, restore, sample, } from "effector";
+import { request } from "../request.js";
+import { combineEvery } from "../effector/combineEvery.js";
+import { compact } from "../compact.js";
+import { deserialize, serialize } from "./persist.js";
+import { requestResponseSplit } from "../effector/requestResponse.js";
+export function createSearch(config) {
+    const configWithJWTAndLocale = combine(config.jwt, config.locale, (authToken, locale) => ({
+        ...config,
+        opts: {
+            ...config.opts,
+            authToken,
+            locale,
+        },
+    }));
+    const clear = createEvent();
+    const unexpectedError = createEvent();
+    const setQuery = createEvent();
+    const submit = createEvent();
+    const setAllState = createEvent();
+    const query = restore(setQuery, "")
+        .reset(clear)
+        .on(setAllState, (_, v) => v.query);
+    const result = createStore({ kind: "not_submitted" })
+        .reset(clear)
+        .on(setAllState, (_, v) => v.result);
+    const resultQuery = createStore("")
+        .reset(clear)
+        .on(setAllState, (_, v) => v.resultQuery);
+    const resultSubmitted = result.map((v) => (v.kind !== "not_submitted" ? true : false));
+    if (config.persist) {
+        const VERSION = 1;
+        const { load, save, onChange, maxAgeMs } = config.persist;
+        const realMaxAgeMs = Math.max(maxAgeMs ?? 0, 0) || 1800000;
+        const allState = combine({
+            query,
+            result,
+            resultQuery,
+        });
+        {
+            const allState = deserialize(load(), VERSION, realMaxAgeMs);
+            if (allState) {
+                setAllState(allState);
+            }
+        }
+        allState.updates.watch((data) => {
+            save(serialize(data, VERSION));
+        });
+        onChange((data) => {
+            const allState = deserialize(data, VERSION, realMaxAgeMs);
+            if (allState) {
+                setAllState(allState);
+            }
+        });
+    }
+    const searchFx = createEffect(async (p) => {
+        return request(p.config.graphql.searchProductsQuery)({ shopID: p.config.shopID, query: p.query }, p.config.opts);
+    });
+    const searchFxIdle = searchFx.pending.map((pending) => !pending);
+    const searchResult = requestResponseSplit(searchFx.doneData);
+    // success
+    resultQuery.on(searchFx.done.filterMap((v) => (v.result.kind === "data" ? v.params.query : undefined)), (_, v) => v);
+    forward({
+        from: searchResult.data.map((v) => ({ kind: "result", result: compact(v.items) })),
+        to: result,
+    });
+    // failure
+    forward({
+        from: searchResult.error.map(() => ({ kind: "error" })),
+        to: result,
+    });
+    forward({
+        from: searchResult.error,
+        to: unexpectedError,
+    });
+    // submit -> (if not pending) -> searchFx
+    guard({
+        source: sample(combine(configWithJWTAndLocale, query), submit, ([config, query]) => ({
+            config,
+            query,
+        })),
+        filter: searchFxIdle,
+        target: searchFx,
+    });
+    // on locale change, let's re-submit the query, but only if there was some result
+    guard({
+        source: sample(combine(configWithJWTAndLocale, resultQuery), config.locale, ([config, query]) => ({
+            config,
+            query,
+        })),
+        filter: combineEvery(searchFxIdle, resultSubmitted),
+        target: searchFx,
+    });
+    return {
+        clear,
+        unexpectedError,
+        setQuery,
+        query,
+        submit,
+        result,
+        pending: searchFx.pending,
+    };
+}

package/esm/multiResponseToResponse.js

@@ -0,0 +1,18 @@
+import { prettyPrintGraphErrors } from "./request.js";
+export function multiResponseToResponse(resp, f, ignoreErrors) {
+    if (resp.kind === "system_error") {
+        return resp;
+    }
+    if (resp.errors && !ignoreErrors) {
+        return { kind: "custom_error", text: prettyPrintGraphErrors(resp.errors) };
+    }
+    if (!resp.data) {
+        return { kind: "system_error", type: "unrecognized_data_body", details: resp.details };
+    }
+    const data = f(resp.data);
+    return data
+        ? { kind: "data", data: data }
+        : resp.errors
+            ? { kind: "custom_error", text: prettyPrintGraphErrors(resp.errors) }
+            : { kind: "system_error", type: "unrecognized_data_body", details: resp.details };
+}

package/esm/nonNull.js

@@ -0,0 +1,6 @@
+export function nonNull(v, msg) {
+    if (v !== null && v !== undefined) {
+        return v;
+    }
+    throw new Error("assertion failed, value is null or undefined" + (msg ? `: ${msg}` : ""));
+}

package/esm/oauthState.js

@@ -0,0 +1,35 @@
+function ensureNoColon(v) {
+    if (v.indexOf(":") !== -1) {
+        throw new Error(`invalid state key/value (${v}), must not contain a colon (":")`);
+    }
+}
+export function encodeOauthState(kvs) {
+    const keys = Object.keys(kvs).sort();
+    keys.forEach(ensureNoColon);
+    let out = "";
+    for (const k of keys) {
+        const v = kvs[k];
+        if (v === undefined)
+            continue;
+        ensureNoColon(v);
+        if (out)
+            out += ":";
+        out += `${k}:${v}`;
+    }
+    return out;
+}
+export function decodeOauthState(state) {
+    const out = {};
+    if (state === "")
+        return out;
+    const components = state.split(":");
+    if (components.length % 2 !== 0) {
+        throw new Error("even number of components expected");
+    }
+    for (let i = 0; i < components.length; i += 2) {
+        const k = components[i + 0];
+        const v = components[i + 1];
+        out[k] = v;
+    }
+    return out;
+}

package/esm/orderShippingAddress.js

@@ -0,0 +1,3 @@
+export function orderShippingAddress(o) {
+    return o.shipping_address_override || o.shipping_address;
+}

package/esm/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

package/esm/pender.js

@@ -0,0 +1,11 @@
+export function pender(pender, f) {
+    return (async (...args) => {
+        pender.pending = true;
+        try {
+            return await f(...args);
+        }
+        finally {
+            pender.pending = false;
+        }
+    });
+}

package/esm/percentageOff.js

@@ -0,0 +1,3 @@
+export function percentageOff(from, to) {
+    return Math.round((1.0 - to / from) * 100);
+}

package/esm/popupConnectQueue.js

@@ -0,0 +1,55 @@
+import * as ss from "superstruct";
+import { BUILD_CONFIG } from "./buildconfig.js";
+import { loadFromLocalStorageTyped, saveToLocalStorageTyped } from "./typedLocalStorage.js";
+export const QueueItemType = ss.union([
+    ss.object({
+        kind: ss.literal("success"),
+        code: ss.string(),
+        state: ss.string(),
+    }),
+    ss.object({
+        kind: ss.literal("success_oauth1"),
+        oauth_token: ss.string(),
+        oauth_verifier: ss.string(),
+    }),
+    ss.object({
+        kind: ss.literal("failure"),
+        state: ss.string(),
+    }),
+]);
+export const QueueItemArrayType = ss.array(QueueItemType);
+export const POPUP_CONNECT_QUEUE_KEY = BUILD_CONFIG.POPUP_CONNECT_QUEUE_KEY;
+export function addQueueChangeListener(callback) {
+    if (listeners.find((v) => v === callback))
+        return;
+    listeners.push(callback);
+    if (listeners.length === 1) {
+        window.addEventListener("storage", onStorageEvent);
+    }
+}
+export function removeQueueChangeListener(callback) {
+    const i = listeners.findIndex((v) => v === callback);
+    if (i !== -1) {
+        listeners.splice(i, 1);
+    }
+    if (listeners.length === 0) {
+        window.removeEventListener("storage", onStorageEvent);
+    }
+}
+export function enqueueItem(item) {
+    const queue = loadFromLocalStorageTyped(POPUP_CONNECT_QUEUE_KEY, QueueItemArrayType) || [];
+    queue.push(item);
+    saveToLocalStorageTyped(POPUP_CONNECT_QUEUE_KEY, queue);
+}
+const listeners = [];
+function onStorageEvent(storageEvent) {
+    if (storageEvent.key !== POPUP_CONNECT_QUEUE_KEY)
+        return;
+    const queue = loadFromLocalStorageTyped(POPUP_CONNECT_QUEUE_KEY, QueueItemArrayType) || [];
+    for (const item of queue) {
+        for (const cb of listeners) {
+            cb(item);
+        }
+    }
+    saveToLocalStorageTyped(POPUP_CONNECT_QUEUE_KEY, []);
+}

package/esm/preact/components/SixDigitInput.js

@@ -0,0 +1,159 @@
+/** @jsx h */
+import { Component, h } from "preact";
+export class SixDigitInput extends Component {
+    inputRefs = [null, null, null, null, null, null];
+    focusedOnce = false;
+    cursorOverride;
+    cursorKeyDownPos = 0;
+    focus() {
+        const v = this.inputRefs[0];
+        if (v)
+            v.focus();
+    }
+    onChangeNth(e, idx) {
+        const newValue = e.currentTarget.value;
+        const { value } = this.props;
+        const oldValue = value.length > idx ? value[idx] : "";
+        let nextValue = "";
+        let move = 0;
+        if (oldValue === "") {
+            nextValue = value + newValue;
+            const shouldBeAt = Math.min(5, nextValue.length);
+            move = shouldBeAt - idx;
+        }
+        else if (oldValue !== "") {
+            const ar = value.split("");
+            ar.splice(idx, 1, ...newValue.split(""));
+            nextValue = ar.join("");
+            if (this.cursorKeyDownPos === 1)
+                move = 1;
+        }
+        nextValue = nextValue.substring(0, 6);
+        this.onChange(nextValue, idx, move);
+    }
+    onChange(nextValue, idx, move) {
+        this.props.onChange(nextValue);
+        if (nextValue.length === 6) {
+            const e6 = this.props.onEnteredSixDigits;
+            if (e6) {
+                setTimeout(e6, 0);
+            }
+        }
+        if (move !== 0) {
+            const r = this.inputRefs[idx + move];
+            if (r) {
+                r.focus();
+                if (move > 0) {
+                    r.setSelectionRange(0, 0);
+                }
+                else {
+                    r.setSelectionRange(1, 1);
+                }
+            }
+        }
+    }
+    onKeyDownNth(idx, e) {
+        const pos = this.inputRefs[idx]?.selectionStart || 0;
+        const { value } = this.props;
+        const v = value.length > idx ? value[idx] : "";
+        const absPos = idx + pos;
+        const isFirst = pos === 0;
+        const isLast = v.length > 0 ? pos === 1 : true;
+        switch (e.keyCode) {
+            case 8: // backspace
+                e.preventDefault();
+                if (absPos > 0 && absPos <= value.length) {
+                    if (pos === 1)
+                        this.cursorOverride = { idx, pos: 0 };
+                    if (pos === 0)
+                        this.cursorOverride = { idx: idx - 1, pos: 0 };
+                    const ar = value.split("");
+                    ar.splice(absPos - 1, 1);
+                    this.onChange(ar.join(""), idx, pos === 0 ? -1 : 0);
+                }
+                break;
+            case 46: // delete
+                e.preventDefault();
+                if (value.length > absPos) {
+                    if (pos === 0)
+                        this.cursorOverride = { idx, pos: 0 };
+                    const ar = value.split("");
+                    ar.splice(absPos, 1);
+                    this.onChange(ar.join(""), idx, 0);
+                }
+                break;
+            case 37: // arrow left
+                if (isFirst) {
+                    e.preventDefault();
+                    if (idx > 0) {
+                        const r = this.inputRefs[idx - 1];
+                        if (r) {
+                            r.focus();
+                            r.setSelectionRange(1, 1);
+                        }
+                    }
+                }
+                break;
+            case 39: // arrow right
+                if (isLast) {
+                    e.preventDefault();
+                    if (idx < 5) {
+                        const r = this.inputRefs[idx + 1];
+                        if (r) {
+                            r.focus();
+                            r.setSelectionRange(0, 0);
+                        }
+                    }
+                }
+                break;
+            case 36: // home
+                {
+                    const r = this.inputRefs[0];
+                    if (r) {
+                        r.focus();
+                        r.setSelectionRange(0, 0);
+                    }
+                }
+                break;
+            case 35: // end
+                {
+                    const r = this.inputRefs[value.length === 6 ? 5 : value.length];
+                    if (r) {
+                        r.focus();
+                        r.setSelectionRange(1, 1);
+                    }
+                }
+                break;
+            default:
+                if (value.length === 6)
+                    e.preventDefault();
+                this.cursorKeyDownPos = pos;
+                break;
+        }
+    }
+    getValue(idx) {
+        const { value } = this.props;
+        return value.length > idx ? value[idx] : "";
+    }
+    componentDidUpdate() {
+        const co = this.cursorOverride;
+        if (co) {
+            this.inputRefs[co.idx]?.setSelectionRange(co.pos, co.pos);
+            this.cursorOverride = undefined;
+        }
+    }
+    render() {
+        const { autoFocus, className, inputClassName } = this.props;
+        return (h("div", { className: className }, [0, 1, 2, 3, 4, 5].map((i) => (h("input", { key: i, inputMode: "numeric", pattern: "[0-9]*", autoComplete: "off", type: "text", ref: (e) => {
+                this.inputRefs[i] = e;
+                if (i === 0 && autoFocus && !this.focusedOnce && e) {
+                    this.focusedOnce = true;
+                    e.focus();
+                }
+            }, className: inputClassName, value: this.getValue(i), onKeyDown: (e) => {
+                this.onKeyDownNth(i, e);
+            }, onInput: (e) => {
+                this.onChangeNth(e, i);
+            } })))));
+    }
+}

package/esm/preact/effector.js

@@ -0,0 +1,69 @@
+import { clearNode, createStore, is } from "effector";
+import { useEffect, useLayoutEffect, useMemo, useReducer, useRef } from "preact/hooks";
+const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+const throwError = (message) => {
+    throw Error(message);
+};
+export function useStore(store) {
+    if (!is.store(store))
+        throwError("expect useStore argument to be a store");
+    const currentValue = store.getState();
+    const inc = useReducer((n, _action) => n + 1, 0)[1];
+    const currentStore = useRef({
+        store,
+        value: currentValue,
+        pending: false,
+    });
+    useIsomorphicLayoutEffect(() => {
+        const stop = store.updates.watch((upd) => {
+            const ref = currentStore.current;
+            if (!ref.pending) {
+                ref.value = upd;
+                ref.pending = true;
+                inc();
+                ref.pending = false;
+            }
+        });
+        const newValue = store.getState();
+        const ref = currentStore.current;
+        if (ref.store === store && ref.value !== newValue) {
+            ref.value = newValue;
+            ref.pending = true;
+            inc();
+            ref.pending = false;
+        }
+        ref.store = store;
+        return stop;
+    }, [store]);
+    return currentValue;
+}
+export function useStoreMap(configOrStore, separateFn) {
+    let fn;
+    let updateFilter;
+    let store;
+    let keys;
+    if (separateFn) {
+        fn = separateFn;
+        store = configOrStore;
+        keys = [];
+    }
+    else {
+        fn = configOrStore.fn;
+        store = configOrStore.store;
+        keys = configOrStore.keys;
+        updateFilter = configOrStore.updateFilter;
+    }
+    if (!is.store(store))
+        throwError("useStoreMap expects a store");
+    if (!Array.isArray(keys))
+        throwError("useStoreMap expects an array as keys");
+    if (typeof fn !== "function")
+        throwError("useStoreMap expects a function");
+    const result = useMemo(() => createStore(fn(store.getState(), keys), { updateFilter }).on(store, (_, state) => fn(state, keys)), keys);
+    const state = useStore(result);
+    useIsomorphicLayoutEffect(() => () => {
+        result.off(store);
+        clearNode(result, { deep: true });
+    }, keys);
+    return state;
+}

package/esm/preact/transition/CSSTransition.js

@@ -0,0 +1,47 @@
+/** @jsx h */
+import { cloneElement, h } from "preact";
+import { useMemo } from "preact/hooks";
+import { Transition } from "./Transition.js";
+const createClassName = (transition, classNames) => {
+    const { appear, appearActive, appearDone, enter, enterActive, enterDone, exit, exitActive, exitDone } = transition;
+    const classes = typeof classNames === "string"
+        ? {
+            appear: `${classNames}-appear`,
+            appearActive: `${classNames}-appear-active`,
+            appearDone: `${classNames}-appear-done`,
+            enter: `${classNames}-enter`,
+            enterActive: `${classNames}-enter-active`,
+            enterDone: `${classNames}-enter-done`,
+            exit: `${classNames}-exit`,
+            exitActive: `${classNames}-exit-active`,
+            exitDone: `${classNames}-exit-done`,
+        }
+        : classNames;
+    switch (true) {
+        case appear:
+            return classes.appear;
+        case appearActive:
+            return `${classes.appear} ${classes.appearActive}`;
+        case appearDone:
+            return classes.appearDone;
+        case enter:
+            return classes.enter;
+        case enterActive:
+            return `${classes.enter} ${classes.enterActive}`;
+        case enterDone:
+            return classes.enterDone;
+        case exit:
+            return classes.exit;
+        case exitActive:
+            return `${classes.exit} ${classes.exitActive}`;
+        case exitDone:
+            return classes.exitDone;
+        default:
+            return "";
+    }
+};
+export const CSSTransition = ({ classNames, children, ...rest }) => (h(Transition, { ...rest }, (transition) => {
+    const { className: childClassName } = children.props;
+    const className = useMemo(() => `${childClassName ? `${childClassName} ` : ""}${createClassName(transition, classNames)}`, [childClassName, classNames, transition]);
+    return cloneElement(children, { className });
+}));