@fragmentsx/client-core 0.3.0 → 0.4.1

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.
Files changed (49) hide show
  1. package/dist/createAreaManager.d.ts +18 -0
  2. package/dist/createAreaManager.d.ts.map +1 -0
  3. package/dist/fragmentsClient.d.ts +3 -2
  4. package/dist/fragmentsClient.d.ts.map +1 -1
  5. package/dist/index.cjs.js +254 -235
  6. package/dist/index.d.ts +3 -0
  7. package/dist/index.d.ts.map +1 -1
  8. package/dist/index.es.js +254 -235
  9. package/dist/plugins/fetch/areaQueries.test.d.ts +2 -0
  10. package/dist/plugins/fetch/areaQueries.test.d.ts.map +1 -0
  11. package/dist/plugins/fetch/index.d.ts +10 -7
  12. package/dist/plugins/fetch/index.d.ts.map +1 -1
  13. package/dist/plugins/fetch/restFetcher.d.ts +6 -0
  14. package/dist/plugins/fetch/restFetcher.d.ts.map +1 -0
  15. package/dist/plugins/fetch/restFetcher.test.d.ts +2 -0
  16. package/dist/plugins/fetch/restFetcher.test.d.ts.map +1 -0
  17. package/dist/plugins/filters/__tests__/filtersPlugin.test.d.ts +2 -0
  18. package/dist/plugins/filters/__tests__/filtersPlugin.test.d.ts.map +1 -0
  19. package/dist/plugins/filters/index.d.ts +9 -0
  20. package/dist/plugins/filters/index.d.ts.map +1 -0
  21. package/dist/plugins/fonts/index.d.ts.map +1 -1
  22. package/dist/plugins/fonts/index.test.d.ts +2 -0
  23. package/dist/plugins/fonts/index.test.d.ts.map +1 -0
  24. package/dist/plugins/fragments/index.d.ts.map +1 -1
  25. package/dist/plugins/load/index.d.ts +1 -1
  26. package/dist/plugins/load/index.d.ts.map +1 -1
  27. package/dist/plugins/metrics/globalMetrics.d.ts +8 -1
  28. package/dist/plugins/metrics/globalMetrics.d.ts.map +1 -1
  29. package/dist/plugins/metrics/index.d.ts.map +1 -1
  30. package/dist/plugins/properties/index.d.ts +17 -0
  31. package/dist/plugins/properties/index.d.ts.map +1 -0
  32. package/dist/plugins/properties/index.test.d.ts +2 -0
  33. package/dist/plugins/properties/index.test.d.ts.map +1 -0
  34. package/dist/plugins/styleSheet/utils/autoInjector.d.ts.map +1 -1
  35. package/dist/testing/createTestFragmentsClient.d.ts +4 -0
  36. package/dist/testing/createTestFragmentsClient.d.ts.map +1 -1
  37. package/package.json +3 -3
  38. package/dist/plugins/fetch/fetcher.d.ts +0 -8
  39. package/dist/plugins/fetch/fetcher.d.ts.map +0 -1
  40. package/dist/plugins/fetch/fetcher.test.d.ts +0 -2
  41. package/dist/plugins/fetch/fetcher.test.d.ts.map +0 -1
  42. package/dist/plugins/fetch/queries/AreaListQuery.d.ts +0 -43
  43. package/dist/plugins/fetch/queries/AreaListQuery.d.ts.map +0 -1
  44. package/dist/plugins/fetch/queries/AreaQuery.d.ts +0 -24
  45. package/dist/plugins/fetch/queries/AreaQuery.d.ts.map +0 -1
  46. package/dist/plugins/fetch/queries/FragmentQuery.d.ts +0 -31
  47. package/dist/plugins/fetch/queries/FragmentQuery.d.ts.map +0 -1
  48. package/dist/plugins/fetch/queries/parts.d.ts +0 -5
  49. package/dist/plugins/fetch/queries/parts.d.ts.map +0 -1
package/dist/index.es.js CHANGED
@@ -1688,100 +1688,48 @@ const CssOverrideSchema = /* @__PURE__ */ object({
1688
1688
  const BASE_HEADERS = {
1689
1689
  "Content-Type": "application/json"
1690
1690
  };
1691
- const createFetcher = (baseUrl, defaultHeaders = {}) => {
1691
+ const createRestFetcher = (baseUrl, defaultHeaders = {}) => {
1692
1692
  const cache = /* @__PURE__ */ new Map();
1693
1693
  const inflightRequests = /* @__PURE__ */ new Map();
1694
- const getCacheKey = (query2, variables, options) => JSON.stringify({ query: query2, variables, options });
1695
- const query = async (query2, variables = {}, options = {}) => {
1696
- const cacheKey = getCacheKey(query2, variables, options);
1697
- if (cache.has(cacheKey)) {
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(cacheKey)) {
1701
- return inflightRequests.get(cacheKey);
1699
+ if (inflightRequests.has(fullUrl)) {
1700
+ return inflightRequests.get(fullUrl);
1702
1701
  }
1703
- const request = fetch(baseUrl, {
1704
- ...options,
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
1709
  if (!res.ok) {
1715
- if (process.env.NODE_ENV === "production") {
1716
- console.error(`Fetch error: ${res.status}`);
1717
- return null;
1718
- }
1719
- throw new Error(`Fetch error: ${res.status}`);
1710
+ throw new Error(`Fetch error: ${res.status} ${res.statusText}`);
1720
1711
  }
1721
- const data = await res.json();
1722
- if (!query2.includes("mutation")) {
1723
- cache.set(cacheKey, data);
1712
+ let data;
1713
+ try {
1714
+ data = await res.json();
1715
+ } catch {
1716
+ return null;
1724
1717
  }
1718
+ cache.set(fullUrl, data);
1725
1719
  return data;
1726
1720
  }).finally(() => {
1727
- inflightRequests.delete(cacheKey);
1721
+ inflightRequests.delete(fullUrl);
1728
1722
  });
1729
- inflightRequests.set(cacheKey, request);
1723
+ inflightRequests.set(fullUrl, request);
1730
1724
  return request;
1731
1725
  };
1732
- const invalidate = (endpoint, options) => {
1733
- cache.delete(getCacheKey(endpoint, options));
1726
+ const invalidate = (url) => {
1727
+ cache.delete(`${baseUrl}${url}`);
1734
1728
  };
1735
- const clearCache = () => cache.clear();
1736
- return { query, invalidate, clearCache };
1737
- };
1738
- const googleFonts = `googleFonts {
1739
- id
1740
- variants
1741
- subsets
1742
- family
1743
- version
1744
- files {
1745
- url
1746
- variant
1747
- }
1748
- category
1749
- }`;
1750
- const linkedCssChunk = `linkedCssChunk {
1751
- id
1752
- content
1753
- }`;
1754
- const linkedFragments = `{
1755
- id
1756
- document
1757
- ${googleFonts}
1758
- ${linkedCssChunk}
1759
- }`;
1760
- const fragment = `
1761
- {
1762
- id
1763
- document
1764
- linkedFragments ${linkedFragments}
1765
- ${googleFonts}
1766
- ${linkedCssChunk}
1767
- }
1768
- `;
1769
- const getFragmentQuery = (fragmentId, isSelf) => {
1770
- return {
1771
- query: isSelf ? `
1772
- query FragmentDocument($fragmentId: Int!) {
1773
- fragment(fragmentIds: [$fragmentId]) ${fragment}
1774
- }
1775
- ` : `
1776
- query FragmentDocument($fragmentId: Int!) {
1777
- clientFragment(fragmentId: $fragmentId) ${fragment}
1778
- }
1779
- }`,
1780
- variables: {
1781
- fragmentId
1782
- },
1783
- _type: null
1729
+ const clearCache = () => {
1730
+ cache.clear();
1784
1731
  };
1732
+ return { get, invalidate, clearCache };
1785
1733
  };
1786
1734
  var isObject = (input) => {
1787
1735
  return typeof input === "object" && input !== null && !Array.isArray(input);
@@ -1796,6 +1744,7 @@ var createConstants = (...constants) => {
1796
1744
  };
1797
1745
  var noop = () => void 0;
1798
1746
  var isBrowser_default = typeof window !== "undefined";
1747
+ var generateId = () => Math.random().toString(16).slice(2);
1799
1748
  var getKey = (v) => isKey(v) ? v.slice(1) : null;
1800
1749
  var isKey = (v) => typeof v === "string" && v.startsWith("$");
1801
1750
  function hashGenerator(layerKey) {
@@ -1953,159 +1902,104 @@ const fetchBeacon = (baseUrl) => {
1953
1902
  sendBeacon
1954
1903
  };
1955
1904
  };
1956
- const getAreaListQuery = (areaCodes) => {
1957
- return {
1958
- query: `query($areaCodes: [String!]!) {
1959
- clientAreas(areaCodes: $areaCodes) {
1960
- areaId
1961
- campaignId
1962
- areaProperties
1963
- projectProperties
1964
- font {
1965
- id
1966
- variants
1967
- subsets
1968
- family
1969
- version
1970
- files {
1971
- url
1972
- variant
1973
- }
1974
- category
1975
- }
1976
- variant {
1977
- id
1978
- fragment {
1979
- props
1980
- fragment ${fragment}
1981
- }
1982
- }
1983
- }
1984
- }`,
1985
- variables: {
1986
- areaCodes
1987
- }
1988
- };
1989
- };
1990
1905
  const fetchPlugin = (state) => {
1991
1906
  var _a, _b, _c, _d;
1992
- const isSelf = ((_a = state == null ? void 0 : state.env) == null ? void 0 : _a.isSelf) ?? false;
1993
- const url = (_b = state == null ? void 0 : state.env) == null ? void 0 : _b.backendEndpoint;
1994
- const apiToken = (_c = state == null ? void 0 : state.env) == null ? void 0 : _c.apiToken;
1995
- const referer = (_d = state == null ? void 0 : state.env) == null ? void 0 : _d.referer;
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;
1910
+ const filterOverrides = (_d = state == null ? void 0 : state.env) == null ? void 0 : _d.filterOverrides;
1996
1911
  let headers = {
1997
- Authorization: `Bearer ${apiToken}`
1912
+ "X-Api-Key": apiToken
1998
1913
  };
1999
1914
  if (referer) {
2000
1915
  headers.Referer = referer;
2001
1916
  }
2002
- const fetcher = createFetcher(url, headers);
1917
+ if (filterOverrides == null ? void 0 : filterOverrides.deviceType) {
1918
+ headers["X-Filter-Device-Type"] = filterOverrides.deviceType;
1919
+ }
1920
+ if (filterOverrides == null ? void 0 : filterOverrides.osType) {
1921
+ headers["X-Filter-OS-Type"] = filterOverrides.osType;
1922
+ }
1923
+ if (filterOverrides == null ? void 0 : filterOverrides.page) {
1924
+ headers["X-Filter-Page"] = filterOverrides.page;
1925
+ }
1926
+ if (filterOverrides == null ? void 0 : filterOverrides.ip) {
1927
+ headers["X-Filter-IP"] = filterOverrides.ip;
1928
+ }
1929
+ const restFetcher = createRestFetcher(url, headers);
2003
1930
  const beaconFetcher = fetchBeacon();
2004
- const registerFragmentDocument = (fragmentId, fragment2) => {
2005
- var _a2, _b2;
2006
- const fragmentDocument = fragment2 == null ? void 0 : fragment2.document;
1931
+ const registerFragmentDocument = (fragmentId, fragment) => {
1932
+ const fragmentDocument = fragment == null ? void 0 : fragment.document;
2007
1933
  if (!fragmentDocument) {
2008
1934
  console.error("Empty document");
2009
1935
  return null;
2010
1936
  }
2011
- if (fragment2) {
2012
- state.$fetch.cacheDocuments.set(fragmentId, fragmentDocument);
2013
- if (Array.isArray(fragment2.linkedFragments)) {
2014
- fragment2.linkedFragments.forEach(
2015
- (linkedFragment) => registerFragmentDocument(linkedFragment.id, linkedFragment)
2016
- );
2017
- }
2018
- if (Array.isArray(fragment2.linkedCssChunk)) {
2019
- fragment2.linkedCssChunk.forEach(
2020
- (linkedChunk) => state.$fetch.cacheCssChunks.set(linkedChunk.id, linkedChunk.content)
2021
- );
2022
- }
2023
- if ("$fonts" in state) {
2024
- (_b2 = fragment2 == null ? void 0 : fragment2.googleFonts) == null ? void 0 : _b2.forEach((_a2 = state.$fonts) == null ? void 0 : _a2.registerFont);
2025
- }
2026
- return fragmentDocument;
2027
- }
2028
- return null;
2029
- };
2030
- const queryFragment = async (fragmentId) => {
2031
- var _a2;
2032
- if (!apiToken || !fragmentId) return null;
2033
- if (state.$fetch.cacheDocuments.has(fragmentId)) {
2034
- return state.$fetch.cacheDocuments.get(fragmentId);
2035
- }
2036
- const fragmentQuery = getFragmentQuery(fragmentId, isSelf);
2037
- const response = await fetcher.query(
2038
- fragmentQuery.query,
2039
- fragmentQuery.variables,
2040
- { referrerPolicy: "unsafe-url" }
2041
- );
2042
- let fragment2 = null;
2043
- if (!!(response == null ? void 0 : response.data) && "clientFragment" in response.data) {
2044
- fragment2 = response.data.clientFragment;
1937
+ state.$fetch.cacheDocuments.set(fragmentId, fragmentDocument);
1938
+ if (fragment.linkedFragments !== void 0) {
1939
+ fragment.linkedFragments.forEach((linked) => {
1940
+ if ((linked == null ? void 0 : linked.id) && (linked == null ? void 0 : linked.document)) {
1941
+ registerFragmentDocument(linked.id, linked);
1942
+ }
1943
+ });
2045
1944
  }
2046
- if (!!(response == null ? void 0 : response.data) && "fragment" in response.data) {
2047
- fragment2 = (_a2 = response.data.fragment) == null ? void 0 : _a2.at(0);
1945
+ if (Array.isArray(fragment.linkedCssChunk)) {
1946
+ fragment.linkedCssChunk.forEach(({ id, content }) => {
1947
+ if (id != null && content != null) {
1948
+ state.$fetch.cacheCssChunks.set(id, content);
1949
+ }
1950
+ });
2048
1951
  }
2049
- return registerFragmentDocument(fragmentId, fragment2);
2050
- };
2051
- const queryArea = async (areaCode) => {
2052
- return queryAreaList([areaCode]).then((res) => res == null ? void 0 : res.at(0));
1952
+ return fragmentDocument;
2053
1953
  };
2054
- const queryAreaList = async (areaCodes2) => {
2055
- var _a2;
2056
- if (!apiToken || !areaCodes2) return null;
2057
- const nonLoadedAreas = areaCodes2.filter(
1954
+ const queryAreaList = async (areaCodes) => {
1955
+ if (!apiToken || !(areaCodes == null ? void 0 : areaCodes.length)) return [];
1956
+ const nonLoadedCodes = areaCodes.filter(
2058
1957
  (code) => !state.$fetch.cacheAreaDocuments.has(code)
2059
1958
  );
2060
- if (!nonLoadedAreas.length) {
2061
- return areaCodes2.map(state.$fetch.cacheAreaDocuments.get);
1959
+ if (nonLoadedCodes.length > 0) {
1960
+ await Promise.all(
1961
+ nonLoadedCodes.map(async (code) => {
1962
+ var _a2, _b2, _c2, _d2;
1963
+ const dto = await restFetcher.get(`/api/area/${code}`);
1964
+ if (!dto) {
1965
+ state.$fetch.cacheAreaDocuments.set(code, null);
1966
+ return;
1967
+ }
1968
+ const fragment = (_a2 = dto.variant) == null ? void 0 : _a2.fragment;
1969
+ if (fragment) {
1970
+ registerFragmentDocument(fragment.id, fragment);
1971
+ }
1972
+ if ("$fonts" in state && dto.font) {
1973
+ (_b2 = state.$fonts) == null ? void 0 : _b2.registerFont(dto.font);
1974
+ }
1975
+ const entity = {
1976
+ fragmentId: fragment == null ? void 0 : fragment.id,
1977
+ props: ((_c2 = dto.variant) == null ? void 0 : _c2.props) ?? {},
1978
+ font: dto.font,
1979
+ areaId: dto.areaId,
1980
+ campaignId: dto.campaignId,
1981
+ variantId: (_d2 = dto.variant) == null ? void 0 : _d2.id
1982
+ };
1983
+ state.$fetch.cacheAreaDocuments.set(code, entity);
1984
+ })
1985
+ );
2062
1986
  }
2063
- const areaQuery = getAreaListQuery(areaCodes2);
2064
- const response = await fetcher.query(
2065
- areaQuery.query,
2066
- areaQuery.variables,
2067
- { referrerPolicy: "unsafe-url" }
1987
+ return areaCodes.map(
1988
+ (code) => state.$fetch.cacheAreaDocuments.get(code) ?? null
2068
1989
  );
2069
- const areas = (_a2 = response == null ? void 0 : response.data) == null ? void 0 : _a2.clientAreas;
2070
- if (areas) {
2071
- areas.forEach((area, index2) => {
2072
- var _a3;
2073
- const areaCode = areaCodes2 == null ? void 0 : areaCodes2.at(index2);
2074
- const areaFragment = area.variant.fragment.fragment;
2075
- registerFragmentDocument(areaFragment.id, areaFragment);
2076
- const resultProps = [
2077
- ...area.projectProperties ?? [],
2078
- ...area.areaProperties ?? []
2079
- ].reduce((acc, prop) => {
2080
- acc[prop._id] = prop.defaultValue;
2081
- return acc;
2082
- }, area.variant.fragment.props);
2083
- const entity = {
2084
- areaId: area.areaId,
2085
- campaignId: area.campaignId,
2086
- variantId: area.variant.id,
2087
- fragmentId: area.variant.fragment.fragment.id,
2088
- font: area.font,
2089
- props: resultProps
2090
- };
2091
- if ("$fonts" in state) {
2092
- (_a3 = state.$fonts) == null ? void 0 : _a3.registerFont(area.font);
2093
- }
2094
- state.$fetch.cacheAreaDocuments.set(areaCode, entity);
2095
- });
2096
- return areaCodes2.map((code) => state.$fetch.cacheAreaDocuments.get(code));
2097
- }
2098
- return null;
1990
+ };
1991
+ const queryArea = async (areaCode) => {
1992
+ return queryAreaList([areaCode]).then((res) => (res == null ? void 0 : res.at(0)) ?? null);
2099
1993
  };
2100
1994
  state.$fetch = {
2101
1995
  cacheCssChunks: /* @__PURE__ */ new Map(),
2102
1996
  cacheDocuments: /* @__PURE__ */ new Map(),
2103
1997
  cacheAreaDocuments: /* @__PURE__ */ new Map(),
2104
- queryFragment,
1998
+ registerFragmentDocument,
2105
1999
  queryArea,
2106
2000
  queryAreaList,
2107
- query: fetcher.query,
2108
2001
  sendBeacon: beaconFetcher.sendBeacon,
2002
+ get: restFetcher.get,
2109
2003
  readCssChunk: (id) => state.$fetch.cacheCssChunks.get(id) ?? null,
2110
2004
  readFragment: (fragmentId) => state.$fetch.cacheDocuments.get(fragmentId) ?? null,
2111
2005
  readArea: (areaCode) => state.$fetch.cacheAreaDocuments.get(areaCode) ?? null
@@ -2322,22 +2216,12 @@ const fragmentStylesheetPlugin = (globalState) => (state) => {
2322
2216
  }
2323
2217
  return noop;
2324
2218
  };
2325
- const destroyStyles = () => {
2326
- state.mutate(
2327
- KEY,
2328
- {
2329
- styles: {}
2330
- },
2331
- { replace: true }
2332
- );
2333
- fragmentStyleInjector.unmount();
2334
- };
2335
2219
  state.$styleSheet = {
2336
2220
  key: KEY,
2337
2221
  addStyle,
2338
2222
  addCssChunk,
2339
2223
  mount: fragmentStyleInjector.mount,
2340
- unmount: destroyStyles,
2224
+ unmount: fragmentStyleInjector.unmount,
2341
2225
  extract: (withTag) => {
2342
2226
  var _a;
2343
2227
  const graph = state.resolve(KEY);
@@ -2408,6 +2292,84 @@ const scopesPlugin = (state) => {
2408
2292
  };
2409
2293
  return state;
2410
2294
  };
2295
+ const PROPERTIES_ROOT_KEY = "PropertiesRoot:root";
2296
+ const propertiesPlugin = (state) => {
2297
+ const hydrate = (properties) => {
2298
+ if (!Array.isArray(properties)) return;
2299
+ const keys = [];
2300
+ for (const prop of properties) {
2301
+ if (!prop || !prop._id) continue;
2302
+ const key = `${index.nodes.Variable}:${prop._id}`;
2303
+ state.mutate(
2304
+ { ...prop, _type: index.nodes.Variable, _id: String(prop._id) },
2305
+ { replace: true }
2306
+ );
2307
+ keys.push(key);
2308
+ }
2309
+ state.mutate(
2310
+ PROPERTIES_ROOT_KEY,
2311
+ { propertyKeys: keys },
2312
+ { replace: true }
2313
+ );
2314
+ };
2315
+ const addProperty = (type, initialData) => {
2316
+ const id = (initialData == null ? void 0 : initialData._id) || generateId();
2317
+ const key = `${index.nodes.Variable}:${id}`;
2318
+ state.mutate({
2319
+ _type: index.nodes.Variable,
2320
+ _id: String(id),
2321
+ type,
2322
+ name: `${type} property`,
2323
+ ...initialData
2324
+ });
2325
+ const root = state.resolve(PROPERTIES_ROOT_KEY);
2326
+ const currentKeys = (root == null ? void 0 : root.propertyKeys) ?? [];
2327
+ state.mutate(
2328
+ PROPERTIES_ROOT_KEY,
2329
+ { propertyKeys: [...currentKeys, key] },
2330
+ { replace: true }
2331
+ );
2332
+ return key;
2333
+ };
2334
+ const removeProperty = (key) => {
2335
+ state.invalidate(key);
2336
+ const root = state.resolve(PROPERTIES_ROOT_KEY);
2337
+ const currentKeys = (root == null ? void 0 : root.propertyKeys) ?? [];
2338
+ state.mutate(
2339
+ PROPERTIES_ROOT_KEY,
2340
+ { propertyKeys: currentKeys.filter((k) => k !== key) },
2341
+ { replace: true }
2342
+ );
2343
+ };
2344
+ const extractProperties = () => {
2345
+ const root = state.resolve(PROPERTIES_ROOT_KEY);
2346
+ const keys = (root == null ? void 0 : root.propertyKeys) ?? [];
2347
+ return keys.map((key) => state.resolve(key, { deep: true })).filter(Boolean);
2348
+ };
2349
+ const getPropertyKeys = () => {
2350
+ const root = state.resolve(PROPERTIES_ROOT_KEY);
2351
+ return (root == null ? void 0 : root.propertyKeys) ?? [];
2352
+ };
2353
+ state.addSkip((dataField) => {
2354
+ if (typeof dataField === "object" && dataField !== null && !Array.isArray(dataField)) {
2355
+ return dataField._type === index.nodes.Variable && (dataField._id === "replaceBeforeSave" || !dataField._id);
2356
+ }
2357
+ return false;
2358
+ });
2359
+ state.mutate({
2360
+ _type: "PropertiesRoot",
2361
+ _id: "root",
2362
+ propertyKeys: []
2363
+ });
2364
+ state.$properties = {
2365
+ key: PROPERTIES_ROOT_KEY,
2366
+ hydrate,
2367
+ addProperty,
2368
+ removeProperty,
2369
+ extractProperties,
2370
+ getPropertyKeys
2371
+ };
2372
+ };
2411
2373
  const fragmentsPlugin = (options) => (state) => {
2412
2374
  const plugins = (options == null ? void 0 : options.plugins) ?? [];
2413
2375
  const createFragmentManager = (fragmentId, initialDocument = {}) => {
@@ -2444,6 +2406,7 @@ const fragmentsPlugin = (options) => (state) => {
2444
2406
  // cssPlugin,
2445
2407
  fragmentStylesheetPlugin(state),
2446
2408
  scopesPlugin,
2409
+ propertiesPlugin,
2447
2410
  ...plugins
2448
2411
  ],
2449
2412
  skip: [
@@ -2454,12 +2417,19 @@ const fragmentsPlugin = (options) => (state) => {
2454
2417
  ...Object.keys(index.nodes),
2455
2418
  "Temp",
2456
2419
  "Spring",
2457
- PLUGIN_TYPES.FragmentStylesheet
2420
+ PLUGIN_TYPES.FragmentStylesheet,
2421
+ "PropertiesRoot"
2458
2422
  ])
2459
2423
  ]
2460
2424
  });
2461
2425
  manager.mutate(tempGraph);
2462
2426
  manager.mutate(springGraph);
2427
+ const fragmentRoot = manager.resolve(manager.$fragment.root);
2428
+ const propertyLinks = (fragmentRoot == null ? void 0 : fragmentRoot.properties) ?? [];
2429
+ const propertyEntities = propertyLinks.map((link) => manager.resolve(link)).filter(Boolean);
2430
+ if (propertyEntities.length > 0) {
2431
+ manager.$properties.hydrate(propertyEntities);
2432
+ }
2463
2433
  state.mutate(state.$fragments.key, {
2464
2434
  managers: {
2465
2435
  [fragmentId]: manager
@@ -2488,9 +2458,6 @@ const fragmentsPlugin = (options) => (state) => {
2488
2458
  });
2489
2459
  return state;
2490
2460
  };
2491
- const addClientMetric = `mutation AddClientMetric($type: ClientMetricType!, $value: GoalAchievementPost!) {
2492
- addClientMetric(metric: {metricType: $type, achievement: $value})
2493
- }`;
2494
2461
  const pendingPixels = /* @__PURE__ */ new Set();
2495
2462
  const sendWithImage = (url) => {
2496
2463
  try {
@@ -2564,10 +2531,16 @@ const types = createConstants(
2564
2531
  "REACH_PROJECT_GOAL"
2565
2532
  );
2566
2533
  const globalMetricsPlugin = (state) => {
2567
- const sendMetric = async (type, value) => {
2534
+ const sendMetric = (type, value) => {
2568
2535
  var _a;
2569
- const query = (_a = state == null ? void 0 : state.$fetch) == null ? void 0 : _a.query;
2570
- await query(addClientMetric, { type, value });
2536
+ if (type !== types.REACH_PROJECT_GOAL || !value) return;
2537
+ const params = new URLSearchParams({
2538
+ goal_id: String(value.goalId),
2539
+ variant_id: String(value.variantId),
2540
+ area_id: String(value.areaId),
2541
+ campaign_id: String(value.campaignId)
2542
+ });
2543
+ (_a = state.$fetch) == null ? void 0 : _a.get(`/api/metric/goal?${params}`).catch(() => void 0);
2571
2544
  };
2572
2545
  const reachGoal = (goal) => {
2573
2546
  sendMetric(types.REACH_PROJECT_GOAL, goal);
@@ -2591,23 +2564,17 @@ const loadPlugin = (state) => {
2591
2564
  const readFragment = (_a = state == null ? void 0 : state.$fetch) == null ? void 0 : _a.readFragment(fragmentId);
2592
2565
  const fragmentManager = (_b = state == null ? void 0 : state.$fragments) == null ? void 0 : _b.getManager(fragmentId);
2593
2566
  if (readFragment && !fragmentManager) {
2594
- const fragmentManager2 = state.$fragments.createFragmentManager(
2595
- fragmentId,
2596
- readFragment
2597
- );
2598
- return fragmentManager2;
2567
+ return state.$fragments.createFragmentManager(fragmentId, readFragment);
2599
2568
  }
2600
2569
  if (readFragment && fragmentManager) return fragmentManager;
2601
- return state.$fetch.queryFragment(fragmentId).then(
2602
- (fragmentDocument) => state.$fragments.createFragmentManager(fragmentId, fragmentDocument)
2603
- );
2570
+ return null;
2604
2571
  };
2605
2572
  const loadArea = (areaCode) => {
2606
2573
  var _a;
2607
2574
  const readArea2 = (_a = state == null ? void 0 : state.$fetch) == null ? void 0 : _a.readArea(areaCode);
2608
2575
  if (readArea2) return readArea2;
2609
- return state.$fetch.queryArea(areaCode).then(async (areaEntity) => {
2610
- await loadFragment(areaEntity == null ? void 0 : areaEntity.fragmentId);
2576
+ return state.$fetch.queryArea(areaCode).then((areaEntity) => {
2577
+ loadFragment(areaEntity == null ? void 0 : areaEntity.fragmentId);
2611
2578
  return areaEntity;
2612
2579
  });
2613
2580
  };
@@ -2624,6 +2591,7 @@ const fontsPlugin = (state) => {
2624
2591
  const fonts = /* @__PURE__ */ new Map();
2625
2592
  let defaultFontFamily = null;
2626
2593
  const registerFont = (font) => {
2594
+ if (!font) return;
2627
2595
  const fontFamily = font.family;
2628
2596
  if (!fonts.has(fontFamily)) {
2629
2597
  fonts.set(fontFamily, font);
@@ -2637,7 +2605,8 @@ const fontsPlugin = (state) => {
2637
2605
  const getStyles = () => {
2638
2606
  const styles = [];
2639
2607
  for (const [fontFamily, font] of fonts) {
2640
- const files = font.files ?? [];
2608
+ const rawFiles = font.files ?? [];
2609
+ const files = Array.isArray(rawFiles) ? rawFiles : Object.entries(rawFiles).map(([variant, url]) => ({ variant, url }));
2641
2610
  for (const file of files) {
2642
2611
  const [weightItem] = getFontWeights([file.variant]);
2643
2612
  styles.push(`@font-face {
@@ -2676,27 +2645,28 @@ const PLUGIN_TYPES = createConstants(
2676
2645
  "FragmentStylesheet"
2677
2646
  );
2678
2647
  const createFragmentsClient = (options) => {
2679
- const BACKEND_TARGET = (options == null ? void 0 : options.isSelf) ? "/graphql" : "http://85.192.29.65/graphql";
2680
2648
  return kt({
2681
2649
  _type: "GlobalManager",
2682
2650
  initialState: {},
2683
2651
  skip: [
2684
2652
  u([
2685
2653
  ...Object.keys(index.nodes),
2686
- ...Object.keys(PLUGIN_TYPES)
2654
+ ...Object.keys(PLUGIN_TYPES),
2655
+ "PropertiesRoot"
2687
2656
  ])
2688
2657
  ],
2689
2658
  plugins: [
2690
2659
  (state) => {
2691
2660
  state.env = {
2692
- isSelf: (options == null ? void 0 : options.isSelf) ?? false,
2693
- backendEndpoint: (options == null ? void 0 : options.backendEndpoint) ?? BACKEND_TARGET,
2661
+ backendEndpoint: (options == null ? void 0 : options.backendEndpoint) ?? "https://client-api.fragmentsx.com",
2694
2662
  apiToken: options == null ? void 0 : options.apiToken,
2695
2663
  referer: options == null ? void 0 : options.referer
2696
2664
  };
2697
2665
  },
2666
+ ...(options == null ? void 0 : options.plugins) ?? [],
2698
2667
  fetchPlugin,
2699
2668
  fontsPlugin,
2669
+ propertiesPlugin,
2700
2670
  fragmentsPlugin({
2701
2671
  plugins: options == null ? void 0 : options.fragmentPlugins
2702
2672
  }),
@@ -2707,6 +2677,39 @@ const createFragmentsClient = (options) => {
2707
2677
  ]
2708
2678
  });
2709
2679
  };
2680
+ const areaMetaPlugin = (options) => (state) => {
2681
+ state.$area = {
2682
+ areaId: options.areaId,
2683
+ campaignId: options.campaignId,
2684
+ variantId: options.variantId
2685
+ };
2686
+ };
2687
+ const createAreaManager = (options) => {
2688
+ var _a;
2689
+ const manager = kt({
2690
+ _type: "AreaManager",
2691
+ _id: String(options.areaId),
2692
+ initialState: {},
2693
+ skip: [
2694
+ u([
2695
+ ...Object.keys(index.nodes),
2696
+ "PropertiesRoot"
2697
+ ])
2698
+ ],
2699
+ plugins: [
2700
+ areaMetaPlugin({
2701
+ areaId: options.areaId,
2702
+ campaignId: options.campaignId,
2703
+ variantId: options.variantId
2704
+ }),
2705
+ propertiesPlugin
2706
+ ]
2707
+ });
2708
+ if ((_a = options.areaProperties) == null ? void 0 : _a.length) {
2709
+ manager.$properties.hydrate(options.areaProperties);
2710
+ }
2711
+ return manager;
2712
+ };
2710
2713
  const ssrPlugin = (state) => {
2711
2714
  var _a, _b, _c;
2712
2715
  if (!["$fragments"].every((field) => field in state)) {
@@ -2751,6 +2754,19 @@ const ssrPlugin = (state) => {
2751
2754
  };
2752
2755
  return state;
2753
2756
  };
2757
+ const VALID_DEVICE_TYPES = ["mobile", "tablet", "desktop"];
2758
+ const VALID_OS_TYPES = ["android", "ios", "windows", "macos", "linux"];
2759
+ const filtersPlugin = (overrides) => (state) => {
2760
+ if (overrides.deviceType && !VALID_DEVICE_TYPES.includes(overrides.deviceType)) {
2761
+ console.warn(
2762
+ `[filtersPlugin] Unknown deviceType: "${overrides.deviceType}"`
2763
+ );
2764
+ }
2765
+ if (overrides.osType && !VALID_OS_TYPES.includes(overrides.osType)) {
2766
+ console.warn(`[filtersPlugin] Unknown osType: "${overrides.osType}"`);
2767
+ }
2768
+ state.env.filterOverrides = overrides;
2769
+ };
2754
2770
  function createTestFragmentsClient(options) {
2755
2771
  const client = createFragmentsClient({
2756
2772
  apiToken: (options == null ? void 0 : options.apiToken) ?? "test-token"
@@ -2768,7 +2784,10 @@ function createTestFragmentsClient(options) {
2768
2784
  return client;
2769
2785
  }
2770
2786
  export {
2787
+ createAreaManager,
2771
2788
  createFragmentsClient,
2772
2789
  createTestFragmentsClient,
2790
+ filtersPlugin,
2791
+ propertiesPlugin,
2773
2792
  ssrPlugin
2774
2793
  };
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=areaQueries.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"areaQueries.test.d.ts","sourceRoot":"","sources":["../../../src/plugins/fetch/areaQueries.test.ts"],"names":[],"mappings":""}