@makeswift/runtime 0.0.11 → 0.0.15
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/actions.cjs.js +6 -1
- package/dist/actions.cjs.js.map +1 -1
- package/dist/actions.es.js +6 -2
- package/dist/actions.es.js.map +1 -1
- package/dist/components.cjs.js +5 -5
- package/dist/components.es.js +3 -5
- package/dist/components.es.js.map +1 -1
- package/dist/constants.cjs.js +128 -1
- package/dist/constants.cjs.js.map +1 -1
- package/dist/constants.es.js +128 -1
- package/dist/constants.es.js.map +1 -1
- package/dist/index.cjs.js +383 -47
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +376 -48
- package/dist/index.es.js.map +1 -1
- package/dist/next.cjs.js +30 -19
- package/dist/next.cjs.js.map +1 -1
- package/dist/next.es.js +31 -20
- package/dist/next.es.js.map +1 -1
- package/dist/react-builder-preview.cjs.js +44 -45
- package/dist/react-builder-preview.cjs.js.map +1 -1
- package/dist/react-builder-preview.es.js +43 -44
- package/dist/react-builder-preview.es.js.map +1 -1
- package/dist/react.cjs.js +2 -3
- package/dist/react.cjs.js.map +1 -1
- package/dist/react.es.js +2 -3
- package/dist/react.es.js.map +1 -1
- package/dist/types/api/constants.d.ts.map +1 -1
- package/dist/types/api/generated/graphql.d.ts +55 -0
- package/dist/types/api/generated/graphql.d.ts.map +1 -1
- package/dist/types/api/react.d.ts +2 -3
- package/dist/types/api/react.d.ts.map +1 -1
- package/dist/types/api/types.d.ts +2 -2
- package/dist/types/api/types.d.ts.map +1 -1
- package/dist/types/components/builtin/Image/Image.d.ts.map +1 -1
- package/dist/types/components/builtin/Navigation/components/DropDownButton/index.d.ts.map +1 -1
- package/dist/types/components/page/Page.d.ts +23 -0
- package/dist/types/components/page/Page.d.ts.map +1 -1
- package/dist/types/components/shared/BackgroundsContainer/components/Backgrounds/index.d.ts.map +1 -1
- package/dist/types/next.d.ts +10 -5
- package/dist/types/next.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/style.d.ts.map +1 -1
- package/dist/types/state/actions.d.ts +13 -1
- package/dist/types/state/actions.d.ts.map +1 -1
- package/dist/types/state/react-builder-preview.d.ts.map +1 -1
- package/package.json +2 -1
- package/dist/Page.cjs.js +0 -222
- package/dist/Page.cjs.js.map +0 -1
- package/dist/Page.es.js +0 -216
- package/dist/Page.es.js.map +0 -1
package/dist/index.cjs.js
CHANGED
|
@@ -43,23 +43,22 @@ var actions = require("./actions.cjs.js");
|
|
|
43
43
|
var styled = require("styled-components");
|
|
44
44
|
var framerMotion = require("framer-motion");
|
|
45
45
|
var css = require("@emotion/css");
|
|
46
|
-
var ssr = require("@apollo/client/react/ssr");
|
|
47
|
-
var slate = require("slate");
|
|
48
|
-
var uuid = require("uuid/v4");
|
|
49
46
|
var jsxRuntime = require("react/jsx-runtime");
|
|
50
|
-
require("html-react-parser");
|
|
51
|
-
require("next/head");
|
|
47
|
+
var parse = require("html-react-parser");
|
|
48
|
+
var Head = require("next/head");
|
|
52
49
|
var descriptors = require("./descriptors.cjs.js");
|
|
53
50
|
var ColorHelper = require("color");
|
|
54
51
|
var scrollIntoView = require("scroll-into-view-if-needed");
|
|
55
52
|
var NextLink = require("next/link");
|
|
56
53
|
var reactUseGesture = require("react-use-gesture");
|
|
57
54
|
var popcorn = require("@popmotion/popcorn");
|
|
55
|
+
var uuid = require("uuid/v4");
|
|
58
56
|
var NextImage = require("next/image");
|
|
59
57
|
var formik = require("formik");
|
|
60
58
|
var boxModels = require("./box-models.cjs.js");
|
|
61
59
|
var polished = require("polished");
|
|
62
60
|
var ReactPlayer = require("react-player");
|
|
61
|
+
var slate = require("slate");
|
|
63
62
|
var Hotkeys = require("slate-hotkeys");
|
|
64
63
|
var ipsum = require("corporate-ipsum");
|
|
65
64
|
var isHotkey = require("is-hotkey");
|
|
@@ -94,10 +93,12 @@ function _interopNamespace(e) {
|
|
|
94
93
|
}
|
|
95
94
|
var React__namespace = /* @__PURE__ */ _interopNamespace(React);
|
|
96
95
|
var styled__default = /* @__PURE__ */ _interopDefaultLegacy(styled);
|
|
97
|
-
var
|
|
96
|
+
var parse__default = /* @__PURE__ */ _interopDefaultLegacy(parse);
|
|
97
|
+
var Head__default = /* @__PURE__ */ _interopDefaultLegacy(Head);
|
|
98
98
|
var ColorHelper__default = /* @__PURE__ */ _interopDefaultLegacy(ColorHelper);
|
|
99
99
|
var scrollIntoView__default = /* @__PURE__ */ _interopDefaultLegacy(scrollIntoView);
|
|
100
100
|
var NextLink__default = /* @__PURE__ */ _interopDefaultLegacy(NextLink);
|
|
101
|
+
var uuid__default = /* @__PURE__ */ _interopDefaultLegacy(uuid);
|
|
101
102
|
var NextImage__default = /* @__PURE__ */ _interopDefaultLegacy(NextImage);
|
|
102
103
|
var ReactPlayer__default = /* @__PURE__ */ _interopDefaultLegacy(ReactPlayer);
|
|
103
104
|
var Hotkeys__default = /* @__PURE__ */ _interopDefaultLegacy(Hotkeys);
|
|
@@ -318,13 +319,35 @@ const typePolicies = {
|
|
|
318
319
|
__typename: "Table",
|
|
319
320
|
id: args == null ? void 0 : args.id
|
|
320
321
|
}, true);
|
|
322
|
+
},
|
|
323
|
+
page(existingData, {
|
|
324
|
+
args,
|
|
325
|
+
toReference
|
|
326
|
+
}) {
|
|
327
|
+
return existingData != null ? existingData : toReference({
|
|
328
|
+
__typename: "Page",
|
|
329
|
+
id: args == null ? void 0 : args.id
|
|
330
|
+
}, true);
|
|
331
|
+
},
|
|
332
|
+
site(existingData, {
|
|
333
|
+
args,
|
|
334
|
+
toReference
|
|
335
|
+
}) {
|
|
336
|
+
return existingData != null ? existingData : toReference({
|
|
337
|
+
__typename: "Site",
|
|
338
|
+
id: args == null ? void 0 : args.id
|
|
339
|
+
}, true);
|
|
321
340
|
}
|
|
322
341
|
}
|
|
323
342
|
}
|
|
324
343
|
};
|
|
325
|
-
const
|
|
326
|
-
|
|
327
|
-
|
|
344
|
+
const isServer$1 = typeof window === "undefined";
|
|
345
|
+
let globalApolloClient = null;
|
|
346
|
+
function garbageCollectGlobalCacheData() {
|
|
347
|
+
globalApolloClient = null;
|
|
348
|
+
}
|
|
349
|
+
function getGlobalCacheData() {
|
|
350
|
+
return globalApolloClient == null ? void 0 : globalApolloClient.cache.extract();
|
|
328
351
|
}
|
|
329
352
|
function createApolloClient({
|
|
330
353
|
uri,
|
|
@@ -337,7 +360,8 @@ function createApolloClient({
|
|
|
337
360
|
cache.restore(cacheData);
|
|
338
361
|
return new client.ApolloClient({
|
|
339
362
|
uri,
|
|
340
|
-
cache
|
|
363
|
+
cache,
|
|
364
|
+
ssrMode: isServer$1
|
|
341
365
|
});
|
|
342
366
|
}
|
|
343
367
|
class MakeswiftClient {
|
|
@@ -346,25 +370,14 @@ class MakeswiftClient {
|
|
|
346
370
|
cacheData
|
|
347
371
|
}) {
|
|
348
372
|
__publicField(this, "apolloClient");
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
value: true,
|
|
358
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(RuntimeProvider, {
|
|
359
|
-
client: this,
|
|
360
|
-
rootElements: /* @__PURE__ */ new Map([[id, element]]),
|
|
361
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(DocumentReference, {
|
|
362
|
-
documentReference: reactPage.createDocumentReference(id)
|
|
363
|
-
})
|
|
364
|
-
})
|
|
365
|
-
}));
|
|
366
|
-
slate.KeyUtils.resetGenerator();
|
|
367
|
-
return this.apolloClient.cache.extract();
|
|
373
|
+
if (globalApolloClient == null)
|
|
374
|
+
globalApolloClient = createApolloClient({
|
|
375
|
+
uri,
|
|
376
|
+
cacheData
|
|
377
|
+
});
|
|
378
|
+
else if (cacheData != null)
|
|
379
|
+
globalApolloClient.cache.restore(cacheData);
|
|
380
|
+
this.apolloClient = globalApolloClient;
|
|
368
381
|
}
|
|
369
382
|
updateCacheData(cacheData) {
|
|
370
383
|
this.apolloClient.cache.restore(cacheData);
|
|
@@ -1383,9 +1396,6 @@ const BackgroundsContainer$1 = styled__default["default"](Container$c)`
|
|
|
1383
1396
|
function Backgrounds({
|
|
1384
1397
|
backgrounds
|
|
1385
1398
|
}) {
|
|
1386
|
-
const isPrefetching = useIsPrefetching();
|
|
1387
|
-
if (isPrefetching)
|
|
1388
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
1389
1399
|
if (backgrounds == null)
|
|
1390
1400
|
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
1391
1401
|
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
@@ -2365,7 +2375,6 @@ const ImageComponent = React.forwardRef(function Image2({
|
|
|
2365
2375
|
const dataDimensions = (fileData == null ? void 0 : fileData.publicUrl) ? fileData == null ? void 0 : fileData.dimensions : placeholder2.dimensions;
|
|
2366
2376
|
const [measuredDimensions, setMeasuredDimensions] = React.useState(null);
|
|
2367
2377
|
const isInBuilder = useIsInBuilder();
|
|
2368
|
-
const isPrefetching = useIsPrefetching();
|
|
2369
2378
|
React.useEffect(() => {
|
|
2370
2379
|
if (dataDimensions)
|
|
2371
2380
|
return;
|
|
@@ -2386,8 +2395,6 @@ const ImageComponent = React.forwardRef(function Image2({
|
|
|
2386
2395
|
if (!dimensions)
|
|
2387
2396
|
return null;
|
|
2388
2397
|
const widthClass = css.css(responsiveWidth(width, `${dimensions.width}px`));
|
|
2389
|
-
if (isPrefetching)
|
|
2390
|
-
return null;
|
|
2391
2398
|
return /* @__PURE__ */ jsxRuntime.jsx(ImageContainer, {
|
|
2392
2399
|
as: link ? Link : "div",
|
|
2393
2400
|
link,
|
|
@@ -2550,7 +2557,7 @@ const Reel = styled__default["default"](framerMotion.motion.div)`
|
|
|
2550
2557
|
}
|
|
2551
2558
|
`)}
|
|
2552
2559
|
`;
|
|
2553
|
-
const Page = styled__default["default"](framerMotion.motion.div)`
|
|
2560
|
+
const Page$1 = styled__default["default"](framerMotion.motion.div)`
|
|
2554
2561
|
position: relative;
|
|
2555
2562
|
width: 100%;
|
|
2556
2563
|
`;
|
|
@@ -2763,7 +2770,7 @@ const Carousel = React.forwardRef(function Carousel2({
|
|
|
2763
2770
|
},
|
|
2764
2771
|
children: [/* @__PURE__ */ jsxRuntime.jsxs(Container$b, {
|
|
2765
2772
|
children: [/* @__PURE__ */ jsxRuntime.jsx(ClipMask, {
|
|
2766
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(Page, __spreadProps(__spreadValues({}, bindPage()), {
|
|
2773
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(Page$1, __spreadProps(__spreadValues({}, bindPage()), {
|
|
2767
2774
|
animate: animation,
|
|
2768
2775
|
children: /* @__PURE__ */ jsxRuntime.jsx(Reel, {
|
|
2769
2776
|
gap,
|
|
@@ -3552,7 +3559,7 @@ const defaultHtml = `<div style="padding: 24px; background-color: rgba(161, 168,
|
|
|
3552
3559
|
<rect y="160" width="40" height="8" rx="2" fill="#A1A8C2" fill-opacity="0.5"/>
|
|
3553
3560
|
</svg>
|
|
3554
3561
|
</div>`;
|
|
3555
|
-
const SCRIPT_TAG = "script";
|
|
3562
|
+
const SCRIPT_TAG$1 = "script";
|
|
3556
3563
|
const Embed = React.forwardRef(function Embed2({
|
|
3557
3564
|
id,
|
|
3558
3565
|
width,
|
|
@@ -3570,7 +3577,7 @@ const Embed = React.forwardRef(function Embed2({
|
|
|
3570
3577
|
return;
|
|
3571
3578
|
const walker = container.ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
3572
3579
|
acceptNode(node) {
|
|
3573
|
-
return node.tagName.toLowerCase() === SCRIPT_TAG ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT;
|
|
3580
|
+
return node.tagName.toLowerCase() === SCRIPT_TAG$1 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT;
|
|
3574
3581
|
}
|
|
3575
3582
|
});
|
|
3576
3583
|
const nodes = [];
|
|
@@ -3581,7 +3588,7 @@ const Embed = React.forwardRef(function Embed2({
|
|
|
3581
3588
|
await new Promise((resolve) => {
|
|
3582
3589
|
var _a, _b;
|
|
3583
3590
|
const node = nodes[i];
|
|
3584
|
-
const script = node.ownerDocument.createElement(SCRIPT_TAG);
|
|
3591
|
+
const script = node.ownerDocument.createElement(SCRIPT_TAG$1);
|
|
3585
3592
|
script.textContent = node.textContent;
|
|
3586
3593
|
Array.from(node.attributes).forEach(({
|
|
3587
3594
|
name,
|
|
@@ -4910,7 +4917,7 @@ function useTableFormFieldRefs(propController, { fieldsCount }) {
|
|
|
4910
4917
|
}
|
|
4911
4918
|
}, [propController, container, items, isInBuilder]);
|
|
4912
4919
|
const itemRefs = React.useMemo(() => Array.from({ length: fieldsCount + 1 }).map((_, index) => (item) => {
|
|
4913
|
-
setItems((
|
|
4920
|
+
setItems((is2) => [...is2.slice(0, index), item, ...is2.slice(index + 1)]);
|
|
4914
4921
|
}), [fieldsCount, setItems]);
|
|
4915
4922
|
return { container: setContainer, items: itemRefs };
|
|
4916
4923
|
}
|
|
@@ -5634,6 +5641,7 @@ const StyledDropDownItem = styled__default["default"](Link)`
|
|
|
5634
5641
|
color: black;
|
|
5635
5642
|
background-color: transparent;
|
|
5636
5643
|
transition: background-color 0.2s;
|
|
5644
|
+
${cssTextStyle()}
|
|
5637
5645
|
${(p) => cssMediaRules([p.color, p.textStyle], ([color, textStyle = {}]) => {
|
|
5638
5646
|
const fontSize = textStyle.fontSize || {
|
|
5639
5647
|
value: 14,
|
|
@@ -7837,6 +7845,325 @@ function registerBuiltinComponents(runtime) {
|
|
|
7837
7845
|
unregisterVideoComponent();
|
|
7838
7846
|
};
|
|
7839
7847
|
}
|
|
7848
|
+
const SCRIPT_TAG = "script";
|
|
7849
|
+
function BodySnippet({
|
|
7850
|
+
code,
|
|
7851
|
+
cleanup
|
|
7852
|
+
}) {
|
|
7853
|
+
React.useEffect(() => {
|
|
7854
|
+
const container = document.createElement("div");
|
|
7855
|
+
container.innerHTML = code;
|
|
7856
|
+
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT);
|
|
7857
|
+
const scripts = [];
|
|
7858
|
+
while (walker.nextNode()) {
|
|
7859
|
+
if (walker.currentNode instanceof HTMLScriptElement)
|
|
7860
|
+
scripts.push(walker.currentNode);
|
|
7861
|
+
}
|
|
7862
|
+
scripts.forEach((inlineScript) => {
|
|
7863
|
+
var _a;
|
|
7864
|
+
const executableScript = document.createElement(SCRIPT_TAG);
|
|
7865
|
+
executableScript.textContent = inlineScript.textContent;
|
|
7866
|
+
Array.from(inlineScript.attributes).forEach(({
|
|
7867
|
+
name,
|
|
7868
|
+
value
|
|
7869
|
+
}) => {
|
|
7870
|
+
executableScript.setAttribute(name, value);
|
|
7871
|
+
});
|
|
7872
|
+
(_a = inlineScript.parentNode) == null ? void 0 : _a.replaceChild(executableScript, inlineScript);
|
|
7873
|
+
});
|
|
7874
|
+
const nodes = Array.from(container.childNodes);
|
|
7875
|
+
document.body.append(...nodes);
|
|
7876
|
+
return () => {
|
|
7877
|
+
nodes.forEach((node) => {
|
|
7878
|
+
var _a;
|
|
7879
|
+
(_a = node.parentNode) == null ? void 0 : _a.removeChild(node);
|
|
7880
|
+
});
|
|
7881
|
+
if (cleanup == null)
|
|
7882
|
+
return;
|
|
7883
|
+
const cleanUp = new Function(cleanup);
|
|
7884
|
+
try {
|
|
7885
|
+
cleanUp();
|
|
7886
|
+
} catch {
|
|
7887
|
+
}
|
|
7888
|
+
};
|
|
7889
|
+
}, [code, cleanup]);
|
|
7890
|
+
return null;
|
|
7891
|
+
}
|
|
7892
|
+
function is(x, y) {
|
|
7893
|
+
if (x === y)
|
|
7894
|
+
return x !== 0 || y !== 0 || 1 / x === 1 / y;
|
|
7895
|
+
return x !== x && y !== y;
|
|
7896
|
+
}
|
|
7897
|
+
const { hasOwnProperty: hasOwnProperty$1 } = Object.prototype;
|
|
7898
|
+
const shallowEqual = (a, b) => {
|
|
7899
|
+
if (is(a, b))
|
|
7900
|
+
return true;
|
|
7901
|
+
if (typeof a !== "object" || a === null || typeof b !== "object" || b === null)
|
|
7902
|
+
return false;
|
|
7903
|
+
const keysA = Object.keys(a);
|
|
7904
|
+
const keysB = Object.keys(b);
|
|
7905
|
+
if (keysA.length !== keysB.length)
|
|
7906
|
+
return false;
|
|
7907
|
+
for (let i = 0; i < keysA.length; i += 1) {
|
|
7908
|
+
if (!hasOwnProperty$1.call(b, keysA[i]) || !is(a[keysA[i]], b[keysA[i]]))
|
|
7909
|
+
return false;
|
|
7910
|
+
}
|
|
7911
|
+
return true;
|
|
7912
|
+
};
|
|
7913
|
+
const { hasOwnProperty } = Object.prototype;
|
|
7914
|
+
const deepEqual = (a, b) => {
|
|
7915
|
+
if (shallowEqual(a, b))
|
|
7916
|
+
return true;
|
|
7917
|
+
if (typeof a !== "object" || a === null || typeof b !== "object" || b === null)
|
|
7918
|
+
return false;
|
|
7919
|
+
const keysA = Object.keys(a);
|
|
7920
|
+
const keysB = Object.keys(b);
|
|
7921
|
+
if (keysA.length !== keysB.length)
|
|
7922
|
+
return false;
|
|
7923
|
+
for (let i = 0; i < keysA.length; i += 1) {
|
|
7924
|
+
if (!hasOwnProperty.call(b, keysA[i]) || !deepEqual(a[keysA[i]], b[keysA[i]]))
|
|
7925
|
+
return false;
|
|
7926
|
+
}
|
|
7927
|
+
return true;
|
|
7928
|
+
};
|
|
7929
|
+
const defaultFavicon = {
|
|
7930
|
+
mimetype: "image/png",
|
|
7931
|
+
publicUrl: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC"
|
|
7932
|
+
};
|
|
7933
|
+
const VALID_TAG_REGEX = /^[a-zA-Z][a-zA-Z:_.\-\d]*$/;
|
|
7934
|
+
const VALID_HEAD_ELEMENT_TYPES = ["title", "base", "link", "style", "meta", "script", "noscript", "template"];
|
|
7935
|
+
function snippetToElement(snippet) {
|
|
7936
|
+
return React.Children.map(parse__default["default"](snippet.code), (element) => {
|
|
7937
|
+
if (typeof element === "string")
|
|
7938
|
+
return element;
|
|
7939
|
+
if (!VALID_TAG_REGEX.test(element.type))
|
|
7940
|
+
return null;
|
|
7941
|
+
const key = element.key ? `${snippet.id}:${element.key}` : snippet.id;
|
|
7942
|
+
return React.createElement(element.type, __spreadProps(__spreadValues({}, element.props), {
|
|
7943
|
+
key
|
|
7944
|
+
}));
|
|
7945
|
+
});
|
|
7946
|
+
}
|
|
7947
|
+
const filterUsedSnippetProperties = ({
|
|
7948
|
+
code,
|
|
7949
|
+
builderEnabled,
|
|
7950
|
+
liveEnabled,
|
|
7951
|
+
location,
|
|
7952
|
+
cleanup
|
|
7953
|
+
}) => ({
|
|
7954
|
+
code,
|
|
7955
|
+
builderEnabled,
|
|
7956
|
+
liveEnabled,
|
|
7957
|
+
location,
|
|
7958
|
+
cleanup
|
|
7959
|
+
});
|
|
7960
|
+
const PAGE_SNIPPETS_QUERY = client.gql`
|
|
7961
|
+
query PageById($id: ID!) {
|
|
7962
|
+
page(id: $id) {
|
|
7963
|
+
__typename
|
|
7964
|
+
id
|
|
7965
|
+
snippets {
|
|
7966
|
+
__typename
|
|
7967
|
+
id
|
|
7968
|
+
name
|
|
7969
|
+
code
|
|
7970
|
+
cleanup
|
|
7971
|
+
location
|
|
7972
|
+
shouldAddToNewPages
|
|
7973
|
+
liveEnabled
|
|
7974
|
+
builderEnabled
|
|
7975
|
+
}
|
|
7976
|
+
}
|
|
7977
|
+
}
|
|
7978
|
+
`;
|
|
7979
|
+
const SITE_FONTS_QUERY = client.gql`
|
|
7980
|
+
query SiteById($id: ID!) {
|
|
7981
|
+
site(id: $id) {
|
|
7982
|
+
id
|
|
7983
|
+
googleFonts {
|
|
7984
|
+
edges {
|
|
7985
|
+
activeVariants {
|
|
7986
|
+
specifier
|
|
7987
|
+
}
|
|
7988
|
+
node {
|
|
7989
|
+
family
|
|
7990
|
+
variants {
|
|
7991
|
+
specifier
|
|
7992
|
+
}
|
|
7993
|
+
}
|
|
7994
|
+
}
|
|
7995
|
+
}
|
|
7996
|
+
}
|
|
7997
|
+
}
|
|
7998
|
+
`;
|
|
7999
|
+
function Page({
|
|
8000
|
+
page,
|
|
8001
|
+
preview = false
|
|
8002
|
+
}) {
|
|
8003
|
+
var _a;
|
|
8004
|
+
const isInBuilder = useIsInBuilder();
|
|
8005
|
+
const [snippets, setSnippets] = React.useState(page.snippets);
|
|
8006
|
+
useQuery(PAGE_SNIPPETS_QUERY, {
|
|
8007
|
+
variables: {
|
|
8008
|
+
id: page.id
|
|
8009
|
+
},
|
|
8010
|
+
skip: isInBuilder === false,
|
|
8011
|
+
fetchPolicy: "cache-only",
|
|
8012
|
+
onCompleted(data) {
|
|
8013
|
+
if (data == null)
|
|
8014
|
+
return;
|
|
8015
|
+
const oldSnippets = snippets.map(filterUsedSnippetProperties);
|
|
8016
|
+
const newSnippets = data.page.snippets.map(filterUsedSnippetProperties);
|
|
8017
|
+
if (deepEqual(newSnippets, oldSnippets))
|
|
8018
|
+
return;
|
|
8019
|
+
setSnippets(data.page.snippets);
|
|
8020
|
+
}
|
|
8021
|
+
});
|
|
8022
|
+
const {
|
|
8023
|
+
data: siteData
|
|
8024
|
+
} = useQuery(SITE_FONTS_QUERY, {
|
|
8025
|
+
variables: {
|
|
8026
|
+
id: page.site.id
|
|
8027
|
+
},
|
|
8028
|
+
skip: isInBuilder === false,
|
|
8029
|
+
fetchPolicy: "cache-only"
|
|
8030
|
+
});
|
|
8031
|
+
const favicon = (_a = page.meta.favicon) != null ? _a : defaultFavicon;
|
|
8032
|
+
const {
|
|
8033
|
+
title,
|
|
8034
|
+
description,
|
|
8035
|
+
keywords,
|
|
8036
|
+
socialImage
|
|
8037
|
+
} = page.meta;
|
|
8038
|
+
const {
|
|
8039
|
+
canonicalUrl,
|
|
8040
|
+
isIndexingBlocked
|
|
8041
|
+
} = page.seo;
|
|
8042
|
+
const fontFamilyParamValue = React.useMemo(() => {
|
|
8043
|
+
if ((siteData == null ? void 0 : siteData.site) == null) {
|
|
8044
|
+
return page.fonts.map(({
|
|
8045
|
+
family,
|
|
8046
|
+
variants
|
|
8047
|
+
}) => {
|
|
8048
|
+
return `${family.replace(/ /g, "+")}:${variants.join()}`;
|
|
8049
|
+
}).join("|");
|
|
8050
|
+
}
|
|
8051
|
+
return siteData.site.googleFonts.edges.filter((edge) => edge != null).map(({
|
|
8052
|
+
activeVariants,
|
|
8053
|
+
node: {
|
|
8054
|
+
family,
|
|
8055
|
+
variants
|
|
8056
|
+
}
|
|
8057
|
+
}) => {
|
|
8058
|
+
const activeVariantSpecifiers = variants.filter((variant) => activeVariants.some((activeVariant) => activeVariant.specifier === variant.specifier)).map((variant) => variant.specifier).join();
|
|
8059
|
+
return `${family.replace(/ /g, "+")}:${activeVariantSpecifiers}`;
|
|
8060
|
+
}).join("|");
|
|
8061
|
+
}, [siteData, page]);
|
|
8062
|
+
const filteredSnippets = React.useMemo(() => snippets.filter((snippet) => preview ? snippet.builderEnabled : snippet.liveEnabled), [snippets]);
|
|
8063
|
+
const headSnippets = React.useMemo(() => filteredSnippets.filter((snippet) => snippet.location === "HEAD"), [filteredSnippets]);
|
|
8064
|
+
const previousHeadSnippets = React.useRef(null);
|
|
8065
|
+
React.useEffect(() => {
|
|
8066
|
+
var _a2;
|
|
8067
|
+
const headSnippetsToCleanUp = ((_a2 = previousHeadSnippets.current) != null ? _a2 : []).filter((previousSnippet) => previousSnippet.cleanup != null).filter((previousSnippet) => !headSnippets.some((snippet) => previousSnippet.id === snippet.id));
|
|
8068
|
+
headSnippetsToCleanUp.forEach((snippetToCleanUp) => {
|
|
8069
|
+
if (snippetToCleanUp.cleanup == null)
|
|
8070
|
+
return;
|
|
8071
|
+
const cleanUp = new Function(snippetToCleanUp.cleanup);
|
|
8072
|
+
try {
|
|
8073
|
+
cleanUp();
|
|
8074
|
+
} catch {
|
|
8075
|
+
}
|
|
8076
|
+
});
|
|
8077
|
+
previousHeadSnippets.current = headSnippets;
|
|
8078
|
+
}, [headSnippets]);
|
|
8079
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
8080
|
+
children: [/* @__PURE__ */ jsxRuntime.jsxs(Head__default["default"], {
|
|
8081
|
+
children: [/* @__PURE__ */ jsxRuntime.jsx("style", {
|
|
8082
|
+
children: `
|
|
8083
|
+
html {
|
|
8084
|
+
font-family: sans-serif;
|
|
8085
|
+
}
|
|
8086
|
+
div#__next {
|
|
8087
|
+
overflow: hidden;
|
|
8088
|
+
}
|
|
8089
|
+
`
|
|
8090
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("link", {
|
|
8091
|
+
rel: "icon",
|
|
8092
|
+
type: favicon.mimetype,
|
|
8093
|
+
href: favicon.publicUrl
|
|
8094
|
+
}), canonicalUrl && /* @__PURE__ */ jsxRuntime.jsx("link", {
|
|
8095
|
+
rel: "canonical",
|
|
8096
|
+
href: canonicalUrl
|
|
8097
|
+
}), isIndexingBlocked && /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8098
|
+
name: "robots",
|
|
8099
|
+
content: "noindex"
|
|
8100
|
+
}), title && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
8101
|
+
children: [/* @__PURE__ */ jsxRuntime.jsx("title", {
|
|
8102
|
+
children: title
|
|
8103
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8104
|
+
property: "og:title",
|
|
8105
|
+
content: title
|
|
8106
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8107
|
+
name: "twitter:title",
|
|
8108
|
+
content: title
|
|
8109
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8110
|
+
itemProp: "name",
|
|
8111
|
+
content: title
|
|
8112
|
+
})]
|
|
8113
|
+
}), description && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
8114
|
+
children: [/* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8115
|
+
name: "description",
|
|
8116
|
+
content: description
|
|
8117
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8118
|
+
property: "og:description",
|
|
8119
|
+
content: description
|
|
8120
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8121
|
+
name: "twitter:description",
|
|
8122
|
+
content: description
|
|
8123
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8124
|
+
itemProp: "description",
|
|
8125
|
+
content: description
|
|
8126
|
+
})]
|
|
8127
|
+
}), keywords && /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8128
|
+
name: "keywords",
|
|
8129
|
+
content: keywords
|
|
8130
|
+
}), socialImage && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
8131
|
+
children: [/* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8132
|
+
property: "og:image",
|
|
8133
|
+
content: socialImage.publicUrl
|
|
8134
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8135
|
+
property: "og:image:type",
|
|
8136
|
+
content: socialImage.publicUrl
|
|
8137
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8138
|
+
name: "twitter:image",
|
|
8139
|
+
content: socialImage.publicUrl
|
|
8140
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8141
|
+
name: "twitter:card",
|
|
8142
|
+
content: socialImage.publicUrl
|
|
8143
|
+
}), /* @__PURE__ */ jsxRuntime.jsx("meta", {
|
|
8144
|
+
itemProp: "image",
|
|
8145
|
+
content: socialImage.publicUrl
|
|
8146
|
+
})]
|
|
8147
|
+
}), fontFamilyParamValue !== "" && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
8148
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("link", {
|
|
8149
|
+
rel: "stylesheet",
|
|
8150
|
+
href: `https://fonts.googleapis.com/css?family=${fontFamilyParamValue}&display=swap`
|
|
8151
|
+
})
|
|
8152
|
+
}), headSnippets.map(snippetToElement).map((children) => React.Children.map(children, (child) => {
|
|
8153
|
+
if (typeof child === "string")
|
|
8154
|
+
return child;
|
|
8155
|
+
if (VALID_HEAD_ELEMENT_TYPES.includes(child.type))
|
|
8156
|
+
return child;
|
|
8157
|
+
return null;
|
|
8158
|
+
}))]
|
|
8159
|
+
}), /* @__PURE__ */ jsxRuntime.jsx(DocumentReference, {
|
|
8160
|
+
documentReference: reactPage.createDocumentReference(page.id)
|
|
8161
|
+
}), filteredSnippets.filter((snippet) => snippet.location === "BODY").map((snippet) => /* @__PURE__ */ jsxRuntime.jsx(BodySnippet, {
|
|
8162
|
+
code: snippet.code,
|
|
8163
|
+
cleanup: snippet.cleanup
|
|
8164
|
+
}, snippet.id))]
|
|
8165
|
+
});
|
|
8166
|
+
}
|
|
7840
8167
|
var _path;
|
|
7841
8168
|
function _extends() {
|
|
7842
8169
|
_extends = Object.assign || function(target) {
|
|
@@ -8213,8 +8540,11 @@ function useStyleControlCssObject(style$1, controlDefinition) {
|
|
|
8213
8540
|
}
|
|
8214
8541
|
const useInsertionEffectSpecifier = "useInsertionEffect";
|
|
8215
8542
|
const useInsertionEffect = (_ea = React__namespace[useInsertionEffectSpecifier]) != null ? _ea : React__namespace.useLayoutEffect;
|
|
8543
|
+
const isServer = typeof window === "undefined";
|
|
8216
8544
|
function useFormattedStyle(styleControlData, controlDefinition) {
|
|
8217
8545
|
const style2 = useStyleControlCssObject(styleControlData, controlDefinition);
|
|
8546
|
+
if (isServer)
|
|
8547
|
+
return css.css(style2);
|
|
8218
8548
|
const serialized = serializeStyles([style2], css.cache.registered);
|
|
8219
8549
|
useInsertionEffect(() => {
|
|
8220
8550
|
insertStyles(css.cache, serialized, false);
|
|
@@ -8692,21 +9022,21 @@ const Element$1 = React.memo(React.forwardRef(function Element2({
|
|
|
8692
9022
|
}, elementKey);
|
|
8693
9023
|
}));
|
|
8694
9024
|
const Document = React.memo(React.forwardRef(function Document2({
|
|
8695
|
-
document
|
|
9025
|
+
document: document2
|
|
8696
9026
|
}, ref) {
|
|
8697
9027
|
return /* @__PURE__ */ jsxRuntime.jsx(DocumentContext.Provider, {
|
|
8698
|
-
value:
|
|
9028
|
+
value: document2.key,
|
|
8699
9029
|
children: /* @__PURE__ */ jsxRuntime.jsx(Element$1, {
|
|
8700
9030
|
ref,
|
|
8701
|
-
element:
|
|
9031
|
+
element: document2.rootElement
|
|
8702
9032
|
})
|
|
8703
9033
|
});
|
|
8704
9034
|
}));
|
|
8705
9035
|
const DocumentReference = React.memo(React.forwardRef(function DocumentReference2({
|
|
8706
9036
|
documentReference
|
|
8707
9037
|
}, ref) {
|
|
8708
|
-
const
|
|
8709
|
-
if (
|
|
9038
|
+
const document2 = useDocument(documentReference.key);
|
|
9039
|
+
if (document2 == null) {
|
|
8710
9040
|
return /* @__PURE__ */ jsxRuntime.jsx(FallbackComponent, {
|
|
8711
9041
|
ref,
|
|
8712
9042
|
text: "Document not found"
|
|
@@ -8714,7 +9044,7 @@ const DocumentReference = React.memo(React.forwardRef(function DocumentReference
|
|
|
8714
9044
|
}
|
|
8715
9045
|
return /* @__PURE__ */ jsxRuntime.jsx(Document, {
|
|
8716
9046
|
ref,
|
|
8717
|
-
document
|
|
9047
|
+
document: document2
|
|
8718
9048
|
});
|
|
8719
9049
|
}));
|
|
8720
9050
|
exports.Box = Box;
|
|
@@ -8736,10 +9066,13 @@ exports.Form = Form;
|
|
|
8736
9066
|
exports.ImageComponent = ImageComponent;
|
|
8737
9067
|
exports.MakeswiftClient = MakeswiftClient;
|
|
8738
9068
|
exports.Navigation = Navigation;
|
|
9069
|
+
exports.PAGE_SNIPPETS_QUERY = PAGE_SNIPPETS_QUERY;
|
|
9070
|
+
exports.Page = Page;
|
|
8739
9071
|
exports.PageProvider = PageProvider;
|
|
8740
9072
|
exports.ReactRuntime = ReactRuntime;
|
|
8741
9073
|
exports.Root = Root;
|
|
8742
9074
|
exports.RuntimeProvider = RuntimeProvider;
|
|
9075
|
+
exports.SITE_FONTS_QUERY = SITE_FONTS_QUERY;
|
|
8743
9076
|
exports.SocialLinks = SocialLinks;
|
|
8744
9077
|
exports.Text = Text;
|
|
8745
9078
|
exports.cssBorder = cssBorder;
|
|
@@ -8751,6 +9084,9 @@ exports.cssMediaRules = cssMediaRules;
|
|
|
8751
9084
|
exports.cssPadding = cssPadding;
|
|
8752
9085
|
exports.cssTextStyle = cssTextStyle;
|
|
8753
9086
|
exports.cssWidth = cssWidth;
|
|
9087
|
+
exports.deepEqual = deepEqual;
|
|
9088
|
+
exports.garbageCollectGlobalCacheData = garbageCollectGlobalCacheData;
|
|
9089
|
+
exports.getGlobalCacheData = getGlobalCacheData;
|
|
8754
9090
|
exports.registerBuiltinComponents = registerBuiltinComponents;
|
|
8755
9091
|
exports.registerComponent = registerComponent$c;
|
|
8756
9092
|
exports.useBackgrounds = useBackgrounds;
|