@fragmentsx/client-core 0.2.4 → 0.4.0
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/dist/createAreaManager.d.ts +18 -0
- package/dist/createAreaManager.d.ts.map +1 -0
- package/dist/fragmentsClient.d.ts +0 -2
- package/dist/fragmentsClient.d.ts.map +1 -1
- package/dist/index.cjs.js +228 -270
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.es.js +228 -270
- package/dist/plugins/fetch/areaQueries.test.d.ts +2 -0
- package/dist/plugins/fetch/areaQueries.test.d.ts.map +1 -0
- package/dist/plugins/fetch/index.d.ts +10 -7
- package/dist/plugins/fetch/index.d.ts.map +1 -1
- package/dist/plugins/fetch/restFetcher.d.ts +6 -0
- package/dist/plugins/fetch/restFetcher.d.ts.map +1 -0
- package/dist/plugins/fetch/restFetcher.test.d.ts +2 -0
- package/dist/plugins/fetch/restFetcher.test.d.ts.map +1 -0
- package/dist/plugins/fonts/index.d.ts.map +1 -1
- package/dist/plugins/fonts/index.test.d.ts +2 -0
- package/dist/plugins/fonts/index.test.d.ts.map +1 -0
- package/dist/plugins/fragments/index.d.ts.map +1 -1
- package/dist/plugins/load/index.d.ts +6 -7
- package/dist/plugins/load/index.d.ts.map +1 -1
- package/dist/plugins/metrics/globalMetrics.d.ts +8 -1
- package/dist/plugins/metrics/globalMetrics.d.ts.map +1 -1
- package/dist/plugins/metrics/index.d.ts.map +1 -1
- package/dist/plugins/properties/index.d.ts +17 -0
- package/dist/plugins/properties/index.d.ts.map +1 -0
- package/dist/plugins/properties/index.test.d.ts +2 -0
- package/dist/plugins/properties/index.test.d.ts.map +1 -0
- package/dist/testing/createTestFragmentsClient.d.ts +4 -0
- package/dist/testing/createTestFragmentsClient.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/plugins/fetch/fetcher.d.ts +0 -8
- package/dist/plugins/fetch/fetcher.d.ts.map +0 -1
- package/dist/plugins/fetch/fetcher.test.d.ts +0 -2
- package/dist/plugins/fetch/fetcher.test.d.ts.map +0 -1
- package/dist/plugins/fetch/queries/AreaListQuery.d.ts +0 -43
- package/dist/plugins/fetch/queries/AreaListQuery.d.ts.map +0 -1
- package/dist/plugins/fetch/queries/AreaQuery.d.ts +0 -24
- package/dist/plugins/fetch/queries/AreaQuery.d.ts.map +0 -1
- package/dist/plugins/fetch/queries/FragmentQuery.d.ts +0 -31
- package/dist/plugins/fetch/queries/FragmentQuery.d.ts.map +0 -1
- package/dist/plugins/fetch/queries/parts.d.ts +0 -5
- package/dist/plugins/fetch/queries/parts.d.ts.map +0 -1
package/dist/index.es.js
CHANGED
|
@@ -1688,94 +1688,48 @@ const CssOverrideSchema = /* @__PURE__ */ object({
|
|
|
1688
1688
|
const BASE_HEADERS = {
|
|
1689
1689
|
"Content-Type": "application/json"
|
|
1690
1690
|
};
|
|
1691
|
-
const
|
|
1691
|
+
const createRestFetcher = (baseUrl, defaultHeaders = {}) => {
|
|
1692
1692
|
const cache = /* @__PURE__ */ new Map();
|
|
1693
1693
|
const inflightRequests = /* @__PURE__ */ new Map();
|
|
1694
|
-
const
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
return cache.get(cacheKey);
|
|
1694
|
+
const get = (url) => {
|
|
1695
|
+
const fullUrl = `${baseUrl}${url}`;
|
|
1696
|
+
if (cache.has(fullUrl)) {
|
|
1697
|
+
return Promise.resolve(cache.get(fullUrl));
|
|
1699
1698
|
}
|
|
1700
|
-
if (inflightRequests.has(
|
|
1701
|
-
return inflightRequests.get(
|
|
1699
|
+
if (inflightRequests.has(fullUrl)) {
|
|
1700
|
+
return inflightRequests.get(fullUrl);
|
|
1702
1701
|
}
|
|
1703
|
-
const request = fetch(
|
|
1704
|
-
|
|
1705
|
-
method: "POST",
|
|
1706
|
-
body: JSON.stringify({ query: query2, variables }),
|
|
1707
|
-
credentials: "include",
|
|
1702
|
+
const request = fetch(fullUrl, {
|
|
1703
|
+
method: "GET",
|
|
1708
1704
|
headers: {
|
|
1709
1705
|
...BASE_HEADERS,
|
|
1710
|
-
...defaultHeaders
|
|
1711
|
-
...options.headers
|
|
1706
|
+
...defaultHeaders
|
|
1712
1707
|
}
|
|
1713
1708
|
}).then(async (res) => {
|
|
1714
|
-
if (!res.ok)
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1709
|
+
if (!res.ok) {
|
|
1710
|
+
throw new Error(`Fetch error: ${res.status} ${res.statusText}`);
|
|
1711
|
+
}
|
|
1712
|
+
let data;
|
|
1713
|
+
try {
|
|
1714
|
+
data = await res.json();
|
|
1715
|
+
} catch {
|
|
1716
|
+
return null;
|
|
1718
1717
|
}
|
|
1718
|
+
cache.set(fullUrl, data);
|
|
1719
1719
|
return data;
|
|
1720
1720
|
}).finally(() => {
|
|
1721
|
-
inflightRequests.delete(
|
|
1721
|
+
inflightRequests.delete(fullUrl);
|
|
1722
1722
|
});
|
|
1723
|
-
inflightRequests.set(
|
|
1723
|
+
inflightRequests.set(fullUrl, request);
|
|
1724
1724
|
return request;
|
|
1725
1725
|
};
|
|
1726
|
-
const invalidate = (
|
|
1727
|
-
cache.delete(
|
|
1726
|
+
const invalidate = (url) => {
|
|
1727
|
+
cache.delete(`${baseUrl}${url}`);
|
|
1728
1728
|
};
|
|
1729
|
-
const clearCache = () =>
|
|
1730
|
-
|
|
1731
|
-
};
|
|
1732
|
-
const googleFonts = `googleFonts {
|
|
1733
|
-
id
|
|
1734
|
-
variants
|
|
1735
|
-
subsets
|
|
1736
|
-
family
|
|
1737
|
-
version
|
|
1738
|
-
files {
|
|
1739
|
-
url
|
|
1740
|
-
variant
|
|
1741
|
-
}
|
|
1742
|
-
category
|
|
1743
|
-
}`;
|
|
1744
|
-
const linkedCssChunk = `linkedCssChunk {
|
|
1745
|
-
id
|
|
1746
|
-
content
|
|
1747
|
-
}`;
|
|
1748
|
-
const linkedFragments = `{
|
|
1749
|
-
id
|
|
1750
|
-
document
|
|
1751
|
-
${googleFonts}
|
|
1752
|
-
${linkedCssChunk}
|
|
1753
|
-
}`;
|
|
1754
|
-
const fragment = `
|
|
1755
|
-
{
|
|
1756
|
-
id
|
|
1757
|
-
document
|
|
1758
|
-
linkedFragments ${linkedFragments}
|
|
1759
|
-
${googleFonts}
|
|
1760
|
-
${linkedCssChunk}
|
|
1761
|
-
}
|
|
1762
|
-
`;
|
|
1763
|
-
const getFragmentQuery = (fragmentId, isSelf) => {
|
|
1764
|
-
return {
|
|
1765
|
-
query: isSelf ? `
|
|
1766
|
-
query FragmentDocument($fragmentId: Int!) {
|
|
1767
|
-
fragment(fragmentIds: [$fragmentId]) ${fragment}
|
|
1768
|
-
}
|
|
1769
|
-
` : `
|
|
1770
|
-
query FragmentDocument($fragmentId: Int!) {
|
|
1771
|
-
clientFragment(fragmentId: $fragmentId) ${fragment}
|
|
1772
|
-
}
|
|
1773
|
-
}`,
|
|
1774
|
-
variables: {
|
|
1775
|
-
fragmentId
|
|
1776
|
-
},
|
|
1777
|
-
_type: null
|
|
1729
|
+
const clearCache = () => {
|
|
1730
|
+
cache.clear();
|
|
1778
1731
|
};
|
|
1732
|
+
return { get, invalidate, clearCache };
|
|
1779
1733
|
};
|
|
1780
1734
|
var isObject = (input) => {
|
|
1781
1735
|
return typeof input === "object" && input !== null && !Array.isArray(input);
|
|
@@ -1790,6 +1744,7 @@ var createConstants = (...constants) => {
|
|
|
1790
1744
|
};
|
|
1791
1745
|
var noop = () => void 0;
|
|
1792
1746
|
var isBrowser_default = typeof window !== "undefined";
|
|
1747
|
+
var generateId = () => Math.random().toString(16).slice(2);
|
|
1793
1748
|
var getKey = (v) => isKey(v) ? v.slice(1) : null;
|
|
1794
1749
|
var isKey = (v) => typeof v === "string" && v.startsWith("$");
|
|
1795
1750
|
function hashGenerator(layerKey) {
|
|
@@ -1947,159 +1902,88 @@ const fetchBeacon = (baseUrl) => {
|
|
|
1947
1902
|
sendBeacon
|
|
1948
1903
|
};
|
|
1949
1904
|
};
|
|
1950
|
-
const getAreaListQuery = (areaCodes) => {
|
|
1951
|
-
return {
|
|
1952
|
-
query: `query($areaCodes: [String!]!) {
|
|
1953
|
-
clientAreas(areaCodes: $areaCodes) {
|
|
1954
|
-
areaId
|
|
1955
|
-
campaignId
|
|
1956
|
-
areaProperties
|
|
1957
|
-
projectProperties
|
|
1958
|
-
font {
|
|
1959
|
-
id
|
|
1960
|
-
variants
|
|
1961
|
-
subsets
|
|
1962
|
-
family
|
|
1963
|
-
version
|
|
1964
|
-
files {
|
|
1965
|
-
url
|
|
1966
|
-
variant
|
|
1967
|
-
}
|
|
1968
|
-
category
|
|
1969
|
-
}
|
|
1970
|
-
variant {
|
|
1971
|
-
id
|
|
1972
|
-
fragment {
|
|
1973
|
-
props
|
|
1974
|
-
fragment ${fragment}
|
|
1975
|
-
}
|
|
1976
|
-
}
|
|
1977
|
-
}
|
|
1978
|
-
}`,
|
|
1979
|
-
variables: {
|
|
1980
|
-
areaCodes
|
|
1981
|
-
}
|
|
1982
|
-
};
|
|
1983
|
-
};
|
|
1984
1905
|
const fetchPlugin = (state) => {
|
|
1985
|
-
var _a, _b, _c
|
|
1986
|
-
const
|
|
1987
|
-
const
|
|
1988
|
-
const
|
|
1989
|
-
const referer = (_d = state == null ? void 0 : state.env) == null ? void 0 : _d.referer;
|
|
1906
|
+
var _a, _b, _c;
|
|
1907
|
+
const url = (_a = state == null ? void 0 : state.env) == null ? void 0 : _a.backendEndpoint;
|
|
1908
|
+
const apiToken = (_b = state == null ? void 0 : state.env) == null ? void 0 : _b.apiToken;
|
|
1909
|
+
const referer = (_c = state == null ? void 0 : state.env) == null ? void 0 : _c.referer;
|
|
1990
1910
|
let headers = {
|
|
1991
|
-
|
|
1911
|
+
"X-Api-Key": apiToken
|
|
1992
1912
|
};
|
|
1993
1913
|
if (referer) {
|
|
1994
1914
|
headers.Referer = referer;
|
|
1995
1915
|
}
|
|
1996
|
-
const
|
|
1916
|
+
const restFetcher = createRestFetcher(url, headers);
|
|
1997
1917
|
const beaconFetcher = fetchBeacon();
|
|
1998
|
-
const registerFragmentDocument = (fragmentId,
|
|
1999
|
-
|
|
2000
|
-
const fragmentDocument = fragment2 == null ? void 0 : fragment2.document;
|
|
1918
|
+
const registerFragmentDocument = (fragmentId, fragment) => {
|
|
1919
|
+
const fragmentDocument = fragment == null ? void 0 : fragment.document;
|
|
2001
1920
|
if (!fragmentDocument) {
|
|
2002
1921
|
console.error("Empty document");
|
|
2003
1922
|
return null;
|
|
2004
1923
|
}
|
|
2005
|
-
|
|
2006
|
-
|
|
2007
|
-
|
|
2008
|
-
|
|
2009
|
-
(
|
|
2010
|
-
|
|
2011
|
-
}
|
|
2012
|
-
if (Array.isArray(fragment2.linkedCssChunk)) {
|
|
2013
|
-
fragment2.linkedCssChunk.forEach(
|
|
2014
|
-
(linkedChunk) => state.$fetch.cacheCssChunks.set(linkedChunk.id, linkedChunk.content)
|
|
2015
|
-
);
|
|
2016
|
-
}
|
|
2017
|
-
if ("$fonts" in state) {
|
|
2018
|
-
(_b2 = fragment2 == null ? void 0 : fragment2.googleFonts) == null ? void 0 : _b2.forEach((_a2 = state.$fonts) == null ? void 0 : _a2.registerFont);
|
|
2019
|
-
}
|
|
2020
|
-
return fragmentDocument;
|
|
2021
|
-
}
|
|
2022
|
-
return null;
|
|
2023
|
-
};
|
|
2024
|
-
const queryFragment = async (fragmentId) => {
|
|
2025
|
-
var _a2;
|
|
2026
|
-
if (!apiToken || !fragmentId) return null;
|
|
2027
|
-
if (state.$fetch.cacheDocuments.has(fragmentId)) {
|
|
2028
|
-
return state.$fetch.cacheDocuments.get(fragmentId);
|
|
2029
|
-
}
|
|
2030
|
-
const fragmentQuery = getFragmentQuery(fragmentId, isSelf);
|
|
2031
|
-
const response = await fetcher.query(
|
|
2032
|
-
fragmentQuery.query,
|
|
2033
|
-
fragmentQuery.variables,
|
|
2034
|
-
{ referrerPolicy: "unsafe-url" }
|
|
2035
|
-
);
|
|
2036
|
-
let fragment2 = null;
|
|
2037
|
-
if (!!(response == null ? void 0 : response.data) && "clientFragment" in response.data) {
|
|
2038
|
-
fragment2 = response.data.clientFragment;
|
|
1924
|
+
state.$fetch.cacheDocuments.set(fragmentId, fragmentDocument);
|
|
1925
|
+
if (fragment.linkedFragments !== void 0) {
|
|
1926
|
+
fragment.linkedFragments.forEach((linked) => {
|
|
1927
|
+
if ((linked == null ? void 0 : linked.id) && (linked == null ? void 0 : linked.document)) {
|
|
1928
|
+
state.$fetch.cacheDocuments.set(linked.id, linked.document);
|
|
1929
|
+
}
|
|
1930
|
+
});
|
|
2039
1931
|
}
|
|
2040
|
-
if (
|
|
2041
|
-
|
|
1932
|
+
if (Array.isArray(fragment.fragmentCssChunks)) {
|
|
1933
|
+
fragment.fragmentCssChunks.forEach(({ cssChunk }) => {
|
|
1934
|
+
if (cssChunk) {
|
|
1935
|
+
state.$fetch.cacheCssChunks.set(cssChunk.id, cssChunk.content);
|
|
1936
|
+
}
|
|
1937
|
+
});
|
|
2042
1938
|
}
|
|
2043
|
-
return
|
|
1939
|
+
return fragmentDocument;
|
|
2044
1940
|
};
|
|
2045
|
-
const
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
const queryAreaList = async (areaCodes2) => {
|
|
2049
|
-
var _a2;
|
|
2050
|
-
if (!apiToken || !areaCodes2) return null;
|
|
2051
|
-
const nonLoadedAreas = areaCodes2.filter(
|
|
1941
|
+
const queryAreaList = async (areaCodes) => {
|
|
1942
|
+
if (!apiToken || !(areaCodes == null ? void 0 : areaCodes.length)) return [];
|
|
1943
|
+
const nonLoadedCodes = areaCodes.filter(
|
|
2052
1944
|
(code) => !state.$fetch.cacheAreaDocuments.has(code)
|
|
2053
1945
|
);
|
|
2054
|
-
if (
|
|
2055
|
-
|
|
1946
|
+
if (nonLoadedCodes.length > 0) {
|
|
1947
|
+
await Promise.all(
|
|
1948
|
+
nonLoadedCodes.map(async (code) => {
|
|
1949
|
+
var _a2, _b2, _c2, _d;
|
|
1950
|
+
const dto = await restFetcher.get(`/api/area/${code}`);
|
|
1951
|
+
if (!dto) return;
|
|
1952
|
+
const fragment = (_a2 = dto.variant) == null ? void 0 : _a2.fragment;
|
|
1953
|
+
if (fragment) {
|
|
1954
|
+
registerFragmentDocument(fragment.id, fragment);
|
|
1955
|
+
}
|
|
1956
|
+
if ("$fonts" in state && dto.font) {
|
|
1957
|
+
(_b2 = state.$fonts) == null ? void 0 : _b2.registerFont(dto.font);
|
|
1958
|
+
}
|
|
1959
|
+
const entity = {
|
|
1960
|
+
fragmentId: fragment == null ? void 0 : fragment.id,
|
|
1961
|
+
props: ((_c2 = dto.variant) == null ? void 0 : _c2.props) ?? {},
|
|
1962
|
+
font: dto.font,
|
|
1963
|
+
areaId: dto.areaId,
|
|
1964
|
+
campaignId: dto.campaignId,
|
|
1965
|
+
variantId: (_d = dto.variant) == null ? void 0 : _d.id
|
|
1966
|
+
};
|
|
1967
|
+
state.$fetch.cacheAreaDocuments.set(code, entity);
|
|
1968
|
+
})
|
|
1969
|
+
);
|
|
2056
1970
|
}
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
areaQuery.query,
|
|
2060
|
-
areaQuery.variables,
|
|
2061
|
-
{ referrerPolicy: "unsafe-url" }
|
|
1971
|
+
return areaCodes.map(
|
|
1972
|
+
(code) => state.$fetch.cacheAreaDocuments.get(code) ?? null
|
|
2062
1973
|
);
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
var _a3;
|
|
2067
|
-
const areaCode = areaCodes2 == null ? void 0 : areaCodes2.at(index2);
|
|
2068
|
-
const areaFragment = area.variant.fragment.fragment;
|
|
2069
|
-
registerFragmentDocument(areaFragment.id, areaFragment);
|
|
2070
|
-
const resultProps = [
|
|
2071
|
-
...area.projectProperties ?? [],
|
|
2072
|
-
...area.areaProperties ?? []
|
|
2073
|
-
].reduce((acc, prop) => {
|
|
2074
|
-
acc[prop._id] = prop.defaultValue;
|
|
2075
|
-
return acc;
|
|
2076
|
-
}, area.variant.fragment.props);
|
|
2077
|
-
const entity = {
|
|
2078
|
-
areaId: area.areaId,
|
|
2079
|
-
campaignId: area.campaignId,
|
|
2080
|
-
variantId: area.variant.id,
|
|
2081
|
-
fragmentId: area.variant.fragment.fragment.id,
|
|
2082
|
-
font: area.font,
|
|
2083
|
-
props: resultProps
|
|
2084
|
-
};
|
|
2085
|
-
if ("$fonts" in state) {
|
|
2086
|
-
(_a3 = state.$fonts) == null ? void 0 : _a3.registerFont(area.font);
|
|
2087
|
-
}
|
|
2088
|
-
state.$fetch.cacheAreaDocuments.set(areaCode, entity);
|
|
2089
|
-
});
|
|
2090
|
-
return areaCodes2.map((code) => state.$fetch.cacheAreaDocuments.get(code));
|
|
2091
|
-
}
|
|
2092
|
-
return null;
|
|
1974
|
+
};
|
|
1975
|
+
const queryArea = async (areaCode) => {
|
|
1976
|
+
return queryAreaList([areaCode]).then((res) => (res == null ? void 0 : res.at(0)) ?? null);
|
|
2093
1977
|
};
|
|
2094
1978
|
state.$fetch = {
|
|
2095
1979
|
cacheCssChunks: /* @__PURE__ */ new Map(),
|
|
2096
1980
|
cacheDocuments: /* @__PURE__ */ new Map(),
|
|
2097
1981
|
cacheAreaDocuments: /* @__PURE__ */ new Map(),
|
|
2098
|
-
|
|
1982
|
+
registerFragmentDocument,
|
|
2099
1983
|
queryArea,
|
|
2100
1984
|
queryAreaList,
|
|
2101
|
-
query: fetcher.query,
|
|
2102
1985
|
sendBeacon: beaconFetcher.sendBeacon,
|
|
1986
|
+
get: restFetcher.get,
|
|
2103
1987
|
readCssChunk: (id) => state.$fetch.cacheCssChunks.get(id) ?? null,
|
|
2104
1988
|
readFragment: (fragmentId) => state.$fetch.cacheDocuments.get(fragmentId) ?? null,
|
|
2105
1989
|
readArea: (areaCode) => state.$fetch.cacheAreaDocuments.get(areaCode) ?? null
|
|
@@ -2402,6 +2286,84 @@ const scopesPlugin = (state) => {
|
|
|
2402
2286
|
};
|
|
2403
2287
|
return state;
|
|
2404
2288
|
};
|
|
2289
|
+
const PROPERTIES_ROOT_KEY = "PropertiesRoot:root";
|
|
2290
|
+
const propertiesPlugin = (state) => {
|
|
2291
|
+
const hydrate = (properties) => {
|
|
2292
|
+
if (!Array.isArray(properties)) return;
|
|
2293
|
+
const keys = [];
|
|
2294
|
+
for (const prop of properties) {
|
|
2295
|
+
if (!prop || !prop._id) continue;
|
|
2296
|
+
const key = `${index.nodes.Variable}:${prop._id}`;
|
|
2297
|
+
state.mutate(
|
|
2298
|
+
{ ...prop, _type: index.nodes.Variable, _id: String(prop._id) },
|
|
2299
|
+
{ replace: true }
|
|
2300
|
+
);
|
|
2301
|
+
keys.push(key);
|
|
2302
|
+
}
|
|
2303
|
+
state.mutate(
|
|
2304
|
+
PROPERTIES_ROOT_KEY,
|
|
2305
|
+
{ propertyKeys: keys },
|
|
2306
|
+
{ replace: true }
|
|
2307
|
+
);
|
|
2308
|
+
};
|
|
2309
|
+
const addProperty = (type, initialData) => {
|
|
2310
|
+
const id = (initialData == null ? void 0 : initialData._id) || generateId();
|
|
2311
|
+
const key = `${index.nodes.Variable}:${id}`;
|
|
2312
|
+
state.mutate({
|
|
2313
|
+
_type: index.nodes.Variable,
|
|
2314
|
+
_id: String(id),
|
|
2315
|
+
type,
|
|
2316
|
+
name: `${type} property`,
|
|
2317
|
+
...initialData
|
|
2318
|
+
});
|
|
2319
|
+
const root = state.resolve(PROPERTIES_ROOT_KEY);
|
|
2320
|
+
const currentKeys = (root == null ? void 0 : root.propertyKeys) ?? [];
|
|
2321
|
+
state.mutate(
|
|
2322
|
+
PROPERTIES_ROOT_KEY,
|
|
2323
|
+
{ propertyKeys: [...currentKeys, key] },
|
|
2324
|
+
{ replace: true }
|
|
2325
|
+
);
|
|
2326
|
+
return key;
|
|
2327
|
+
};
|
|
2328
|
+
const removeProperty = (key) => {
|
|
2329
|
+
state.invalidate(key);
|
|
2330
|
+
const root = state.resolve(PROPERTIES_ROOT_KEY);
|
|
2331
|
+
const currentKeys = (root == null ? void 0 : root.propertyKeys) ?? [];
|
|
2332
|
+
state.mutate(
|
|
2333
|
+
PROPERTIES_ROOT_KEY,
|
|
2334
|
+
{ propertyKeys: currentKeys.filter((k) => k !== key) },
|
|
2335
|
+
{ replace: true }
|
|
2336
|
+
);
|
|
2337
|
+
};
|
|
2338
|
+
const extractProperties = () => {
|
|
2339
|
+
const root = state.resolve(PROPERTIES_ROOT_KEY);
|
|
2340
|
+
const keys = (root == null ? void 0 : root.propertyKeys) ?? [];
|
|
2341
|
+
return keys.map((key) => state.resolve(key, { deep: true })).filter(Boolean);
|
|
2342
|
+
};
|
|
2343
|
+
const getPropertyKeys = () => {
|
|
2344
|
+
const root = state.resolve(PROPERTIES_ROOT_KEY);
|
|
2345
|
+
return (root == null ? void 0 : root.propertyKeys) ?? [];
|
|
2346
|
+
};
|
|
2347
|
+
state.addSkip((dataField) => {
|
|
2348
|
+
if (typeof dataField === "object" && dataField !== null && !Array.isArray(dataField)) {
|
|
2349
|
+
return dataField._type === index.nodes.Variable && (dataField._id === "replaceBeforeSave" || !dataField._id);
|
|
2350
|
+
}
|
|
2351
|
+
return false;
|
|
2352
|
+
});
|
|
2353
|
+
state.mutate({
|
|
2354
|
+
_type: "PropertiesRoot",
|
|
2355
|
+
_id: "root",
|
|
2356
|
+
propertyKeys: []
|
|
2357
|
+
});
|
|
2358
|
+
state.$properties = {
|
|
2359
|
+
key: PROPERTIES_ROOT_KEY,
|
|
2360
|
+
hydrate,
|
|
2361
|
+
addProperty,
|
|
2362
|
+
removeProperty,
|
|
2363
|
+
extractProperties,
|
|
2364
|
+
getPropertyKeys
|
|
2365
|
+
};
|
|
2366
|
+
};
|
|
2405
2367
|
const fragmentsPlugin = (options) => (state) => {
|
|
2406
2368
|
const plugins = (options == null ? void 0 : options.plugins) ?? [];
|
|
2407
2369
|
const createFragmentManager = (fragmentId, initialDocument = {}) => {
|
|
@@ -2438,6 +2400,7 @@ const fragmentsPlugin = (options) => (state) => {
|
|
|
2438
2400
|
// cssPlugin,
|
|
2439
2401
|
fragmentStylesheetPlugin(state),
|
|
2440
2402
|
scopesPlugin,
|
|
2403
|
+
propertiesPlugin,
|
|
2441
2404
|
...plugins
|
|
2442
2405
|
],
|
|
2443
2406
|
skip: [
|
|
@@ -2448,12 +2411,19 @@ const fragmentsPlugin = (options) => (state) => {
|
|
|
2448
2411
|
...Object.keys(index.nodes),
|
|
2449
2412
|
"Temp",
|
|
2450
2413
|
"Spring",
|
|
2451
|
-
PLUGIN_TYPES.FragmentStylesheet
|
|
2414
|
+
PLUGIN_TYPES.FragmentStylesheet,
|
|
2415
|
+
"PropertiesRoot"
|
|
2452
2416
|
])
|
|
2453
2417
|
]
|
|
2454
2418
|
});
|
|
2455
2419
|
manager.mutate(tempGraph);
|
|
2456
2420
|
manager.mutate(springGraph);
|
|
2421
|
+
const fragmentRoot = manager.resolve(manager.$fragment.root);
|
|
2422
|
+
const propertyLinks = (fragmentRoot == null ? void 0 : fragmentRoot.properties) ?? [];
|
|
2423
|
+
const propertyEntities = propertyLinks.map((link) => manager.resolve(link)).filter(Boolean);
|
|
2424
|
+
if (propertyEntities.length > 0) {
|
|
2425
|
+
manager.$properties.hydrate(propertyEntities);
|
|
2426
|
+
}
|
|
2457
2427
|
state.mutate(state.$fragments.key, {
|
|
2458
2428
|
managers: {
|
|
2459
2429
|
[fragmentId]: manager
|
|
@@ -2482,9 +2452,6 @@ const fragmentsPlugin = (options) => (state) => {
|
|
|
2482
2452
|
});
|
|
2483
2453
|
return state;
|
|
2484
2454
|
};
|
|
2485
|
-
const addClientMetric = `mutation AddClientMetric($type: ClientMetricType!, $value: GoalAchievementPost!) {
|
|
2486
|
-
addClientMetric(metric: {metricType: $type, achievement: $value})
|
|
2487
|
-
}`;
|
|
2488
2455
|
const pendingPixels = /* @__PURE__ */ new Set();
|
|
2489
2456
|
const sendWithImage = (url) => {
|
|
2490
2457
|
try {
|
|
@@ -2558,10 +2525,16 @@ const types = createConstants(
|
|
|
2558
2525
|
"REACH_PROJECT_GOAL"
|
|
2559
2526
|
);
|
|
2560
2527
|
const globalMetricsPlugin = (state) => {
|
|
2561
|
-
const sendMetric =
|
|
2528
|
+
const sendMetric = (type, value) => {
|
|
2562
2529
|
var _a;
|
|
2563
|
-
|
|
2564
|
-
|
|
2530
|
+
if (type !== types.REACH_PROJECT_GOAL || !value) return;
|
|
2531
|
+
const params = new URLSearchParams({
|
|
2532
|
+
goal_id: String(value.goalId),
|
|
2533
|
+
variant_id: String(value.variantId),
|
|
2534
|
+
area_id: String(value.areaId),
|
|
2535
|
+
campaign_id: String(value.campaignId)
|
|
2536
|
+
});
|
|
2537
|
+
(_a = state.$fetch) == null ? void 0 : _a.get(`/api/metric/goal?${params}`).catch(() => void 0);
|
|
2565
2538
|
};
|
|
2566
2539
|
const reachGoal = (goal) => {
|
|
2567
2540
|
sendMetric(types.REACH_PROJECT_GOAL, goal);
|
|
@@ -2580,76 +2553,24 @@ const loadPlugin = (state) => {
|
|
|
2580
2553
|
console.error("LoadFragmentPlugin depends from Fetch and Fragments plugin");
|
|
2581
2554
|
return state;
|
|
2582
2555
|
}
|
|
2583
|
-
const
|
|
2584
|
-
const createSuspenseResource = (key, fetcher) => {
|
|
2585
|
-
if (resourceCache.has(key)) return resourceCache.get(key);
|
|
2586
|
-
let status = "pending";
|
|
2587
|
-
let result;
|
|
2588
|
-
const suspender = fetcher().then(
|
|
2589
|
-
(r2) => {
|
|
2590
|
-
status = "success";
|
|
2591
|
-
result = r2;
|
|
2592
|
-
},
|
|
2593
|
-
(e) => {
|
|
2594
|
-
status = "error";
|
|
2595
|
-
result = e;
|
|
2596
|
-
}
|
|
2597
|
-
);
|
|
2598
|
-
const resource = {
|
|
2599
|
-
read() {
|
|
2600
|
-
if (status === "pending") throw suspender;
|
|
2601
|
-
if (status === "error") throw result;
|
|
2602
|
-
return result;
|
|
2603
|
-
}
|
|
2604
|
-
};
|
|
2605
|
-
resourceCache.set(key, resource);
|
|
2606
|
-
return resource;
|
|
2607
|
-
};
|
|
2608
|
-
const loadFragment = (fragmentId, options) => {
|
|
2556
|
+
const loadFragment = (fragmentId) => {
|
|
2609
2557
|
var _a, _b;
|
|
2610
|
-
const suspense = options == null ? void 0 : options.suspense;
|
|
2611
2558
|
const readFragment = (_a = state == null ? void 0 : state.$fetch) == null ? void 0 : _a.readFragment(fragmentId);
|
|
2612
2559
|
const fragmentManager = (_b = state == null ? void 0 : state.$fragments) == null ? void 0 : _b.getManager(fragmentId);
|
|
2613
2560
|
if (readFragment && !fragmentManager) {
|
|
2614
|
-
|
|
2615
|
-
fragmentId,
|
|
2616
|
-
readFragment
|
|
2617
|
-
);
|
|
2618
|
-
return fragmentManager2;
|
|
2561
|
+
return state.$fragments.createFragmentManager(fragmentId, readFragment);
|
|
2619
2562
|
}
|
|
2620
2563
|
if (readFragment && fragmentManager) return fragmentManager;
|
|
2621
|
-
|
|
2622
|
-
var _a2;
|
|
2623
|
-
const fragmentDocument = await ((_a2 = state == null ? void 0 : state.$fetch) == null ? void 0 : _a2.queryFragment(fragmentId));
|
|
2624
|
-
return state.$fragments.createFragmentManager(
|
|
2625
|
-
fragmentId,
|
|
2626
|
-
fragmentDocument
|
|
2627
|
-
);
|
|
2628
|
-
};
|
|
2629
|
-
if (suspense) {
|
|
2630
|
-
const resource = createSuspenseResource(fragmentId, loader);
|
|
2631
|
-
return resource.read();
|
|
2632
|
-
}
|
|
2633
|
-
return loader();
|
|
2564
|
+
return null;
|
|
2634
2565
|
};
|
|
2635
|
-
const loadArea = (areaCode
|
|
2566
|
+
const loadArea = (areaCode) => {
|
|
2636
2567
|
var _a;
|
|
2637
|
-
const suspense = options == null ? void 0 : options.suspense;
|
|
2638
2568
|
const readArea2 = (_a = state == null ? void 0 : state.$fetch) == null ? void 0 : _a.readArea(areaCode);
|
|
2639
2569
|
if (readArea2) return readArea2;
|
|
2640
|
-
|
|
2641
|
-
|
|
2642
|
-
const areaEntity = await ((_a2 = state == null ? void 0 : state.$fetch) == null ? void 0 : _a2.queryArea(areaCode));
|
|
2643
|
-
await loadFragment(areaEntity == null ? void 0 : areaEntity.fragmentId, {
|
|
2644
|
-
suspense: false
|
|
2645
|
-
});
|
|
2570
|
+
return state.$fetch.queryArea(areaCode).then((areaEntity) => {
|
|
2571
|
+
loadFragment(areaEntity == null ? void 0 : areaEntity.fragmentId);
|
|
2646
2572
|
return areaEntity;
|
|
2647
|
-
};
|
|
2648
|
-
if (suspense) {
|
|
2649
|
-
const resource = createSuspenseResource(areaCode, loader);
|
|
2650
|
-
return resource.read();
|
|
2651
|
-
}
|
|
2652
|
-
return loader();
|
|
2573
|
+
});
|
|
2653
2574
|
};
|
|
2654
2575
|
const readArea = () => {
|
|
2655
2576
|
return state;
|
|
@@ -2664,6 +2585,7 @@ const fontsPlugin = (state) => {
|
|
|
2664
2585
|
const fonts = /* @__PURE__ */ new Map();
|
|
2665
2586
|
let defaultFontFamily = null;
|
|
2666
2587
|
const registerFont = (font) => {
|
|
2588
|
+
if (!font) return;
|
|
2667
2589
|
const fontFamily = font.family;
|
|
2668
2590
|
if (!fonts.has(fontFamily)) {
|
|
2669
2591
|
fonts.set(fontFamily, font);
|
|
@@ -2677,7 +2599,8 @@ const fontsPlugin = (state) => {
|
|
|
2677
2599
|
const getStyles = () => {
|
|
2678
2600
|
const styles = [];
|
|
2679
2601
|
for (const [fontFamily, font] of fonts) {
|
|
2680
|
-
const
|
|
2602
|
+
const rawFiles = font.files ?? [];
|
|
2603
|
+
const files = Array.isArray(rawFiles) ? rawFiles : Object.entries(rawFiles).map(([variant, url]) => ({ variant, url }));
|
|
2681
2604
|
for (const file of files) {
|
|
2682
2605
|
const [weightItem] = getFontWeights([file.variant]);
|
|
2683
2606
|
styles.push(`@font-face {
|
|
@@ -2716,27 +2639,27 @@ const PLUGIN_TYPES = createConstants(
|
|
|
2716
2639
|
"FragmentStylesheet"
|
|
2717
2640
|
);
|
|
2718
2641
|
const createFragmentsClient = (options) => {
|
|
2719
|
-
const BACKEND_TARGET = (options == null ? void 0 : options.isSelf) ? "/graphql" : "http://85.192.29.65/graphql";
|
|
2720
2642
|
return kt({
|
|
2721
2643
|
_type: "GlobalManager",
|
|
2722
2644
|
initialState: {},
|
|
2723
2645
|
skip: [
|
|
2724
2646
|
u([
|
|
2725
2647
|
...Object.keys(index.nodes),
|
|
2726
|
-
...Object.keys(PLUGIN_TYPES)
|
|
2648
|
+
...Object.keys(PLUGIN_TYPES),
|
|
2649
|
+
"PropertiesRoot"
|
|
2727
2650
|
])
|
|
2728
2651
|
],
|
|
2729
2652
|
plugins: [
|
|
2730
2653
|
(state) => {
|
|
2731
2654
|
state.env = {
|
|
2732
|
-
|
|
2733
|
-
backendEndpoint: (options == null ? void 0 : options.backendEndpoint) ?? BACKEND_TARGET,
|
|
2655
|
+
backendEndpoint: (options == null ? void 0 : options.backendEndpoint) ?? "https://client-api.fragmentsx.com",
|
|
2734
2656
|
apiToken: options == null ? void 0 : options.apiToken,
|
|
2735
2657
|
referer: options == null ? void 0 : options.referer
|
|
2736
2658
|
};
|
|
2737
2659
|
},
|
|
2738
2660
|
fetchPlugin,
|
|
2739
2661
|
fontsPlugin,
|
|
2662
|
+
propertiesPlugin,
|
|
2740
2663
|
fragmentsPlugin({
|
|
2741
2664
|
plugins: options == null ? void 0 : options.fragmentPlugins
|
|
2742
2665
|
}),
|
|
@@ -2747,6 +2670,39 @@ const createFragmentsClient = (options) => {
|
|
|
2747
2670
|
]
|
|
2748
2671
|
});
|
|
2749
2672
|
};
|
|
2673
|
+
const areaMetaPlugin = (options) => (state) => {
|
|
2674
|
+
state.$area = {
|
|
2675
|
+
areaId: options.areaId,
|
|
2676
|
+
campaignId: options.campaignId,
|
|
2677
|
+
variantId: options.variantId
|
|
2678
|
+
};
|
|
2679
|
+
};
|
|
2680
|
+
const createAreaManager = (options) => {
|
|
2681
|
+
var _a;
|
|
2682
|
+
const manager = kt({
|
|
2683
|
+
_type: "AreaManager",
|
|
2684
|
+
_id: String(options.areaId),
|
|
2685
|
+
initialState: {},
|
|
2686
|
+
skip: [
|
|
2687
|
+
u([
|
|
2688
|
+
...Object.keys(index.nodes),
|
|
2689
|
+
"PropertiesRoot"
|
|
2690
|
+
])
|
|
2691
|
+
],
|
|
2692
|
+
plugins: [
|
|
2693
|
+
areaMetaPlugin({
|
|
2694
|
+
areaId: options.areaId,
|
|
2695
|
+
campaignId: options.campaignId,
|
|
2696
|
+
variantId: options.variantId
|
|
2697
|
+
}),
|
|
2698
|
+
propertiesPlugin
|
|
2699
|
+
]
|
|
2700
|
+
});
|
|
2701
|
+
if ((_a = options.areaProperties) == null ? void 0 : _a.length) {
|
|
2702
|
+
manager.$properties.hydrate(options.areaProperties);
|
|
2703
|
+
}
|
|
2704
|
+
return manager;
|
|
2705
|
+
};
|
|
2750
2706
|
const ssrPlugin = (state) => {
|
|
2751
2707
|
var _a, _b, _c;
|
|
2752
2708
|
if (!["$fragments"].every((field) => field in state)) {
|
|
@@ -2808,7 +2764,9 @@ function createTestFragmentsClient(options) {
|
|
|
2808
2764
|
return client;
|
|
2809
2765
|
}
|
|
2810
2766
|
export {
|
|
2767
|
+
createAreaManager,
|
|
2811
2768
|
createFragmentsClient,
|
|
2812
2769
|
createTestFragmentsClient,
|
|
2770
|
+
propertiesPlugin,
|
|
2813
2771
|
ssrPlugin
|
|
2814
2772
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"areaQueries.test.d.ts","sourceRoot":"","sources":["../../../src/plugins/fetch/areaQueries.test.ts"],"names":[],"mappings":""}
|