@valbuild/next 0.86.2 → 0.87.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.
Files changed (14) hide show
  1. package/dist/ValApp-22147086.cjs.js +7 -0
  2. package/dist/{ValApp-b10c2084.cjs.prod.js → ValApp-22147086.cjs.prod.js} +9 -1
  3. package/dist/{ValApp-0ded607c.cjs.dev.js → ValApp-3df36e0d.cjs.dev.js} +9 -1
  4. package/dist/{ValApp-489d97dc.esm.js → ValApp-e2e1dfed.esm.js} +10 -2
  5. package/dist/{ValNextProvider-726026f9.cjs.dev.js → ValNextProvider-49b788b8.cjs.dev.js} +56 -36
  6. package/dist/{ValNextProvider-10c232b6.esm.js → ValNextProvider-5657aa89.esm.js} +56 -36
  7. package/dist/ValNextProvider-9ce953f7.cjs.js +7 -0
  8. package/dist/{ValNextProvider-7042b86d.cjs.prod.js → ValNextProvider-9ce953f7.cjs.prod.js} +56 -36
  9. package/dist/valbuild-next.cjs.dev.js +2 -2
  10. package/dist/valbuild-next.cjs.prod.js +2 -2
  11. package/dist/valbuild-next.esm.js +2 -2
  12. package/package.json +6 -6
  13. package/dist/ValApp-b10c2084.cjs.js +0 -7
  14. package/dist/ValNextProvider-7042b86d.cjs.js +0 -7
package/dist/ValApp-22147086.cjs.js ADDED
@@ -0,0 +1,7 @@
1
+ 'use strict';
2
+
3
+ if (process.env.NODE_ENV === "production") {
4
+ module.exports = require("./ValApp-22147086.cjs.prod.js");
5
+ } else {
6
+ module.exports = require("./ValApp-22147086.cjs.dev.js");
7
+ }
package/dist/{ValApp-b10c2084.cjs.prod.js → ValApp-22147086.cjs.prod.js} RENAMED
@@ -26,6 +26,7 @@ var ValApp = function ValApp(_ref) {
26
26
  setInMessageMode = _useState2[1];
27
27
  var isClientSIde = inMessageMode === undefined;
28
28
  cssUtils.useConfigStorageSave(config);
29
+ var container = React.useRef(null);
29
30
  React.useEffect(function () {
30
31
  if (location.search === "?message_onready=true") {
31
32
  setInMessageMode(true);
@@ -41,6 +42,12 @@ var ValApp = function ValApp(_ref) {
41
42
  setInMessageMode(false);
42
43
  }
43
44
  }, []);
45
+ React.useEffect(function () {
46
+ var _container$current;
47
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
48
+ window.dispatchEvent(new CustomEvent("val-append-studio"));
49
+ }
50
+ });
44
51
 
45
52
  // this theme is used to avoid flickering
46
53
  var _useState3 = React.useState(config.defaultTheme || null),
@@ -125,7 +132,8 @@ var ValApp = function ValApp(_ref) {
125
132
  src: "".concat(route, "/static").concat(ui.VERSION ? "/".concat(ui.VERSION) : "").concat(ui.VAL_APP_PATH),
126
133
  crossOrigin: "anonymous"
127
134
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
128
- id: ui.VAL_APP_ID
135
+ id: ui.VAL_APP_ID,
136
+ ref: container
129
137
  })]
130
138
  });
131
139
  };
package/dist/{ValApp-0ded607c.cjs.dev.js → ValApp-3df36e0d.cjs.dev.js} RENAMED
@@ -26,6 +26,7 @@ var ValApp = function ValApp(_ref) {
26
26
  setInMessageMode = _useState2[1];
27
27
  var isClientSIde = inMessageMode === undefined;
28
28
  cssUtils.useConfigStorageSave(config);
29
+ var container = React.useRef(null);
29
30
  React.useEffect(function () {
30
31
  if (location.search === "?message_onready=true") {
31
32
  setInMessageMode(true);
@@ -41,6 +42,12 @@ var ValApp = function ValApp(_ref) {
41
42
  setInMessageMode(false);
42
43
  }
43
44
  }, []);
45
+ React.useEffect(function () {
46
+ var _container$current;
47
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
48
+ window.dispatchEvent(new CustomEvent("val-append-studio"));
49
+ }
50
+ });
44
51
 
45
52
  // this theme is used to avoid flickering
46
53
  var _useState3 = React.useState(config.defaultTheme || null),
@@ -125,7 +132,8 @@ var ValApp = function ValApp(_ref) {
125
132
  src: "".concat(route, "/static").concat(ui.VERSION ? "/".concat(ui.VERSION) : "").concat(ui.VAL_APP_PATH),
126
133
  crossOrigin: "anonymous"
127
134
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
128
- id: ui.VAL_APP_ID
135
+ id: ui.VAL_APP_ID,
136
+ ref: container
129
137
  })]
130
138
  });
131
139
  };
package/dist/{ValApp-489d97dc.esm.js → ValApp-e2e1dfed.esm.js} RENAMED
@@ -2,7 +2,7 @@
2
2
  import { _ as _slicedToArray } from './slicedToArray-aa291011.esm.js';
3
3
  import { VERSION, VAL_APP_PATH, VAL_APP_ID } from '@valbuild/ui';
4
4
  import Script from 'next/script';
5
- import { useState, useEffect } from 'react';
5
+ import { useState, useRef, useEffect } from 'react';
6
6
  import { u as useConfigStorageSave, v as valPrefixedClass, c as cn } from './cssUtils-b5651c03.esm.js';
7
7
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
8
8
  import './unsupportedIterableToArray-5baabfdc.esm.js';
@@ -18,6 +18,7 @@ var ValApp = function ValApp(_ref) {
18
18
  setInMessageMode = _useState2[1];
19
19
  var isClientSIde = inMessageMode === undefined;
20
20
  useConfigStorageSave(config);
21
+ var container = useRef(null);
21
22
  useEffect(function () {
22
23
  if (location.search === "?message_onready=true") {
23
24
  setInMessageMode(true);
@@ -33,6 +34,12 @@ var ValApp = function ValApp(_ref) {
33
34
  setInMessageMode(false);
34
35
  }
35
36
  }, []);
37
+ useEffect(function () {
38
+ var _container$current;
39
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
40
+ window.dispatchEvent(new CustomEvent("val-append-studio"));
41
+ }
42
+ });
36
43
 
37
44
  // this theme is used to avoid flickering
38
45
  var _useState3 = useState(config.defaultTheme || null),
@@ -117,7 +124,8 @@ var ValApp = function ValApp(_ref) {
117
124
  src: "".concat(route, "/static").concat(VERSION ? "/".concat(VERSION) : "").concat(VAL_APP_PATH),
118
125
  crossOrigin: "anonymous"
119
126
  }), /*#__PURE__*/jsx("div", {
120
- id: VAL_APP_ID
127
+ id: VAL_APP_ID,
128
+ ref: container
121
129
  })]
122
130
  });
123
131
  };
package/dist/{ValNextProvider-726026f9.cjs.dev.js → ValNextProvider-49b788b8.cjs.dev.js} RENAMED
@@ -190,7 +190,7 @@ var ValNextProvider = function ValNextProvider(props) {
190
190
  window.dispatchEvent(new CustomEvent("val-overlay-spa", {
191
191
  detail: {
192
192
  type: "draftMode",
193
- value: draftMode
193
+ value: draftMode !== null && draftMode !== void 0 ? draftMode : false
194
194
  }
195
195
  }));
196
196
  }, [mountOverlay, draftMode, spaReady]);
@@ -243,6 +243,13 @@ var ValNextProvider = function ValNextProvider(props) {
243
243
  window.removeEventListener("message", listener);
244
244
  };
245
245
  }, [mountOverlay]);
246
+ var container = React__default["default"].useRef(null);
247
+ React__default["default"].useEffect(function () {
248
+ var _container$current;
249
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
250
+ window.dispatchEvent(new CustomEvent("val-append-overlay"));
251
+ }
252
+ });
246
253
  var _React$useState9 = React__default["default"].useState(null),
247
254
  _React$useState10 = slicedToArray._slicedToArray(_React$useState9, 2),
248
255
  dropZone = _React$useState10[0],
@@ -260,11 +267,20 @@ var ValNextProvider = function ValNextProvider(props) {
260
267
  _React$useState12 = slicedToArray._slicedToArray(_React$useState11, 2),
261
268
  spaLoaded = _React$useState12[0],
262
269
  setSpaLoaded = _React$useState12[1];
270
+ React__default["default"].useEffect(function () {
271
+ var listener = function listener() {
272
+ setSpaLoaded(true);
273
+ };
274
+ window.addEventListener("val-ui-created", listener);
275
+ return function () {
276
+ window.removeEventListener("val-ui-created", listener);
277
+ };
278
+ }, []);
263
279
  var commonStyles = React__default["default"].useMemo(function () {
264
280
  return {
265
281
  "backdrop-blur": "backdrop-filter: blur(10px);",
266
282
  "text-white": "color: white;",
267
- "bg-black": "background: black;",
283
+ "bg-bg-primary": "background: #0c111d;",
268
284
  rounded: "border-radius: 0.25rem;",
269
285
  fixed: "position: fixed;",
270
286
  "bottom-4": "bottom: 1rem;",
@@ -283,14 +299,44 @@ var ValNextProvider = function ValNextProvider(props) {
283
299
  store: valStore,
284
300
  children: [props.children, dropZone !== null && !spaLoaded && mountOverlay && /*#__PURE__*/jsxRuntime.jsxs(React__default["default"].Fragment, {
285
301
  children: [/*#__PURE__*/jsxRuntime.jsx("style", {
286
- children: "\n".concat(positionStyles, "\n").concat(cssUtils.prefixStyles(commonStyles), "\n.").concat(cssUtils.valPrefixedClass, "animate-spin {\n animation: ").concat(cssUtils.valPrefixedClass, "spin 2s linear infinite;\n}\n@keyframes ").concat(cssUtils.valPrefixedClass, "spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}")
302
+ children: "\n".concat(positionStyles, "\n").concat(cssUtils.prefixStyles(commonStyles), "\n@keyframes rotate-clock {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n")
287
303
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
288
304
  className: "".concat(getPositionClassName(dropZone), " ").concat(cssUtils.cn(["p-4"])),
289
305
  children: /*#__PURE__*/jsxRuntime.jsx("div", {
290
- className: "".concat(cssUtils.cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cssUtils.cn(["text-white", "bg-black", "rounded", "backdrop-blur"])),
291
- children: /*#__PURE__*/jsxRuntime.jsx(Clock, {
292
- className: "".concat(cssUtils.cn(["animate-spin"])),
293
- size: 16
306
+ className: "".concat(cssUtils.cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cssUtils.cn(["text-white", "bg-bg-primary", "rounded", "backdrop-blur"])),
307
+ children: /*#__PURE__*/jsxRuntime.jsxs("svg", {
308
+ xmlns: "http://www.w3.org/2000/svg",
309
+ width: "16",
310
+ height: "16",
311
+ viewBox: "0 0 24 24",
312
+ fill: "none",
313
+ stroke: "currentColor",
314
+ strokeWidth: "2",
315
+ strokeLinecap: "round",
316
+ strokeLinejoin: "round",
317
+ children: [/*#__PURE__*/jsxRuntime.jsx("circle", {
318
+ cx: "12",
319
+ cy: "12",
320
+ r: "11"
321
+ }), /*#__PURE__*/jsxRuntime.jsx("line", {
322
+ x1: "12",
323
+ y1: "4",
324
+ x2: "12",
325
+ y2: "12",
326
+ style: {
327
+ transformOrigin: "center",
328
+ animation: "rotate-clock 1000ms linear infinite"
329
+ }
330
+ }), /*#__PURE__*/jsxRuntime.jsx("line", {
331
+ x1: "12",
332
+ y1: "8",
333
+ x2: "12",
334
+ y2: "12",
335
+ style: {
336
+ transformOrigin: "center",
337
+ animation: "rotate-clock 12000ms linear infinite"
338
+ }
339
+ })]
294
340
  })
295
341
  })
296
342
  })]
@@ -298,12 +344,10 @@ var ValNextProvider = function ValNextProvider(props) {
298
344
  children: [/*#__PURE__*/jsxRuntime.jsx(Script__default["default"], {
299
345
  type: "module",
300
346
  src: "".concat(route, "/static").concat(ui.VERSION ? "/".concat(ui.VERSION) : "").concat(ui.VAL_APP_PATH),
301
- crossOrigin: "anonymous",
302
- onLoad: function onLoad() {
303
- setSpaLoaded(true);
304
- }
347
+ crossOrigin: "anonymous"
305
348
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
306
- id: ui.VAL_OVERLAY_ID
349
+ id: ui.VAL_OVERLAY_ID,
350
+ ref: container
307
351
  })]
308
352
  }), mountOverlay && iframeSrc && /*#__PURE__*/jsxRuntime.jsx("iframe", {
309
353
  loading: "eager",
@@ -458,28 +502,4 @@ function isValStudioPath(pathname) {
458
502
  // );
459
503
  // }
460
504
 
461
- function Clock(_ref) {
462
- var className = _ref.className,
463
- size = _ref.size;
464
- return /*#__PURE__*/jsxRuntime.jsxs("svg", {
465
- xmlns: "http://www.w3.org/2000/svg",
466
- width: size,
467
- height: size,
468
- viewBox: "0 0 24 24",
469
- fill: "none",
470
- stroke: "currentColor",
471
- strokeWidth: "2",
472
- strokeLinecap: "round",
473
- strokeLinejoin: "round",
474
- className: "lucide lucide-clock " + className,
475
- children: [/*#__PURE__*/jsxRuntime.jsx("circle", {
476
- cx: "12",
477
- cy: "12",
478
- r: "10"
479
- }), /*#__PURE__*/jsxRuntime.jsx("polyline", {
480
- points: "12 6 12 12 16 14"
481
- })]
482
- });
483
- }
484
-
485
505
  exports.ValNextProvider = ValNextProvider;
package/dist/{ValNextProvider-10c232b6.esm.js → ValNextProvider-5657aa89.esm.js} RENAMED
@@ -181,7 +181,7 @@ var ValNextProvider = function ValNextProvider(props) {
181
181
  window.dispatchEvent(new CustomEvent("val-overlay-spa", {
182
182
  detail: {
183
183
  type: "draftMode",
184
- value: draftMode
184
+ value: draftMode !== null && draftMode !== void 0 ? draftMode : false
185
185
  }
186
186
  }));
187
187
  }, [mountOverlay, draftMode, spaReady]);
@@ -234,6 +234,13 @@ var ValNextProvider = function ValNextProvider(props) {
234
234
  window.removeEventListener("message", listener);
235
235
  };
236
236
  }, [mountOverlay]);
237
+ var container = React.useRef(null);
238
+ React.useEffect(function () {
239
+ var _container$current;
240
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
241
+ window.dispatchEvent(new CustomEvent("val-append-overlay"));
242
+ }
243
+ });
237
244
  var _React$useState9 = React.useState(null),
238
245
  _React$useState10 = _slicedToArray(_React$useState9, 2),
239
246
  dropZone = _React$useState10[0],
@@ -251,11 +258,20 @@ var ValNextProvider = function ValNextProvider(props) {
251
258
  _React$useState12 = _slicedToArray(_React$useState11, 2),
252
259
  spaLoaded = _React$useState12[0],
253
260
  setSpaLoaded = _React$useState12[1];
261
+ React.useEffect(function () {
262
+ var listener = function listener() {
263
+ setSpaLoaded(true);
264
+ };
265
+ window.addEventListener("val-ui-created", listener);
266
+ return function () {
267
+ window.removeEventListener("val-ui-created", listener);
268
+ };
269
+ }, []);
254
270
  var commonStyles = React.useMemo(function () {
255
271
  return {
256
272
  "backdrop-blur": "backdrop-filter: blur(10px);",
257
273
  "text-white": "color: white;",
258
- "bg-black": "background: black;",
274
+ "bg-bg-primary": "background: #0c111d;",
259
275
  rounded: "border-radius: 0.25rem;",
260
276
  fixed: "position: fixed;",
261
277
  "bottom-4": "bottom: 1rem;",
@@ -274,14 +290,44 @@ var ValNextProvider = function ValNextProvider(props) {
274
290
  store: valStore,
275
291
  children: [props.children, dropZone !== null && !spaLoaded && mountOverlay && /*#__PURE__*/jsxs(React.Fragment, {
276
292
  children: [/*#__PURE__*/jsx("style", {
277
- children: "\n".concat(positionStyles, "\n").concat(prefixStyles(commonStyles), "\n.").concat(valPrefixedClass, "animate-spin {\n animation: ").concat(valPrefixedClass, "spin 2s linear infinite;\n}\n@keyframes ").concat(valPrefixedClass, "spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}")
293
+ children: "\n".concat(positionStyles, "\n").concat(prefixStyles(commonStyles), "\n@keyframes rotate-clock {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n")
278
294
  }), /*#__PURE__*/jsx("div", {
279
295
  className: "".concat(getPositionClassName(dropZone), " ").concat(cn(["p-4"])),
280
296
  children: /*#__PURE__*/jsx("div", {
281
- className: "".concat(cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cn(["text-white", "bg-black", "rounded", "backdrop-blur"])),
282
- children: /*#__PURE__*/jsx(Clock, {
283
- className: "".concat(cn(["animate-spin"])),
284
- size: 16
297
+ className: "".concat(cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cn(["text-white", "bg-bg-primary", "rounded", "backdrop-blur"])),
298
+ children: /*#__PURE__*/jsxs("svg", {
299
+ xmlns: "http://www.w3.org/2000/svg",
300
+ width: "16",
301
+ height: "16",
302
+ viewBox: "0 0 24 24",
303
+ fill: "none",
304
+ stroke: "currentColor",
305
+ strokeWidth: "2",
306
+ strokeLinecap: "round",
307
+ strokeLinejoin: "round",
308
+ children: [/*#__PURE__*/jsx("circle", {
309
+ cx: "12",
310
+ cy: "12",
311
+ r: "11"
312
+ }), /*#__PURE__*/jsx("line", {
313
+ x1: "12",
314
+ y1: "4",
315
+ x2: "12",
316
+ y2: "12",
317
+ style: {
318
+ transformOrigin: "center",
319
+ animation: "rotate-clock 1000ms linear infinite"
320
+ }
321
+ }), /*#__PURE__*/jsx("line", {
322
+ x1: "12",
323
+ y1: "8",
324
+ x2: "12",
325
+ y2: "12",
326
+ style: {
327
+ transformOrigin: "center",
328
+ animation: "rotate-clock 12000ms linear infinite"
329
+ }
330
+ })]
285
331
  })
286
332
  })
287
333
  })]
@@ -289,12 +335,10 @@ var ValNextProvider = function ValNextProvider(props) {
289
335
  children: [/*#__PURE__*/jsx(Script, {
290
336
  type: "module",
291
337
  src: "".concat(route, "/static").concat(VERSION ? "/".concat(VERSION) : "").concat(VAL_APP_PATH),
292
- crossOrigin: "anonymous",
293
- onLoad: function onLoad() {
294
- setSpaLoaded(true);
295
- }
338
+ crossOrigin: "anonymous"
296
339
  }), /*#__PURE__*/jsx("div", {
297
- id: VAL_OVERLAY_ID
340
+ id: VAL_OVERLAY_ID,
341
+ ref: container
298
342
  })]
299
343
  }), mountOverlay && iframeSrc && /*#__PURE__*/jsx("iframe", {
300
344
  loading: "eager",
@@ -449,28 +493,4 @@ function isValStudioPath(pathname) {
449
493
  // );
450
494
  // }
451
495
 
452
- function Clock(_ref) {
453
- var className = _ref.className,
454
- size = _ref.size;
455
- return /*#__PURE__*/jsxs("svg", {
456
- xmlns: "http://www.w3.org/2000/svg",
457
- width: size,
458
- height: size,
459
- viewBox: "0 0 24 24",
460
- fill: "none",
461
- stroke: "currentColor",
462
- strokeWidth: "2",
463
- strokeLinecap: "round",
464
- strokeLinejoin: "round",
465
- className: "lucide lucide-clock " + className,
466
- children: [/*#__PURE__*/jsx("circle", {
467
- cx: "12",
468
- cy: "12",
469
- r: "10"
470
- }), /*#__PURE__*/jsx("polyline", {
471
- points: "12 6 12 12 16 14"
472
- })]
473
- });
474
- }
475
-
476
496
  export { ValNextProvider };
package/dist/ValNextProvider-9ce953f7.cjs.js ADDED
@@ -0,0 +1,7 @@
1
+ 'use strict';
2
+
3
+ if (process.env.NODE_ENV === "production") {
4
+ module.exports = require("./ValNextProvider-9ce953f7.cjs.prod.js");
5
+ } else {
6
+ module.exports = require("./ValNextProvider-9ce953f7.cjs.dev.js");
7
+ }
package/dist/{ValNextProvider-7042b86d.cjs.prod.js → ValNextProvider-9ce953f7.cjs.prod.js} RENAMED
@@ -190,7 +190,7 @@ var ValNextProvider = function ValNextProvider(props) {
190
190
  window.dispatchEvent(new CustomEvent("val-overlay-spa", {
191
191
  detail: {
192
192
  type: "draftMode",
193
- value: draftMode
193
+ value: draftMode !== null && draftMode !== void 0 ? draftMode : false
194
194
  }
195
195
  }));
196
196
  }, [mountOverlay, draftMode, spaReady]);
@@ -243,6 +243,13 @@ var ValNextProvider = function ValNextProvider(props) {
243
243
  window.removeEventListener("message", listener);
244
244
  };
245
245
  }, [mountOverlay]);
246
+ var container = React__default["default"].useRef(null);
247
+ React__default["default"].useEffect(function () {
248
+ var _container$current;
249
+ if (((_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.childElementCount) === 0) {
250
+ window.dispatchEvent(new CustomEvent("val-append-overlay"));
251
+ }
252
+ });
246
253
  var _React$useState9 = React__default["default"].useState(null),
247
254
  _React$useState10 = slicedToArray._slicedToArray(_React$useState9, 2),
248
255
  dropZone = _React$useState10[0],
@@ -260,11 +267,20 @@ var ValNextProvider = function ValNextProvider(props) {
260
267
  _React$useState12 = slicedToArray._slicedToArray(_React$useState11, 2),
261
268
  spaLoaded = _React$useState12[0],
262
269
  setSpaLoaded = _React$useState12[1];
270
+ React__default["default"].useEffect(function () {
271
+ var listener = function listener() {
272
+ setSpaLoaded(true);
273
+ };
274
+ window.addEventListener("val-ui-created", listener);
275
+ return function () {
276
+ window.removeEventListener("val-ui-created", listener);
277
+ };
278
+ }, []);
263
279
  var commonStyles = React__default["default"].useMemo(function () {
264
280
  return {
265
281
  "backdrop-blur": "backdrop-filter: blur(10px);",
266
282
  "text-white": "color: white;",
267
- "bg-black": "background: black;",
283
+ "bg-bg-primary": "background: #0c111d;",
268
284
  rounded: "border-radius: 0.25rem;",
269
285
  fixed: "position: fixed;",
270
286
  "bottom-4": "bottom: 1rem;",
@@ -283,14 +299,44 @@ var ValNextProvider = function ValNextProvider(props) {
283
299
  store: valStore,
284
300
  children: [props.children, dropZone !== null && !spaLoaded && mountOverlay && /*#__PURE__*/jsxRuntime.jsxs(React__default["default"].Fragment, {
285
301
  children: [/*#__PURE__*/jsxRuntime.jsx("style", {
286
- children: "\n".concat(positionStyles, "\n").concat(cssUtils.prefixStyles(commonStyles), "\n.").concat(cssUtils.valPrefixedClass, "animate-spin {\n animation: ").concat(cssUtils.valPrefixedClass, "spin 2s linear infinite;\n}\n@keyframes ").concat(cssUtils.valPrefixedClass, "spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}")
302
+ children: "\n".concat(positionStyles, "\n").concat(cssUtils.prefixStyles(commonStyles), "\n@keyframes rotate-clock {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n")
287
303
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
288
304
  className: "".concat(getPositionClassName(dropZone), " ").concat(cssUtils.cn(["p-4"])),
289
305
  children: /*#__PURE__*/jsxRuntime.jsx("div", {
290
- className: "".concat(cssUtils.cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cssUtils.cn(["text-white", "bg-black", "rounded", "backdrop-blur"])),
291
- children: /*#__PURE__*/jsxRuntime.jsx(Clock, {
292
- className: "".concat(cssUtils.cn(["animate-spin"])),
293
- size: 16
306
+ className: "".concat(cssUtils.cn(["flex", "justify-center", "items-center", "p-2"]), " ") + "".concat(cssUtils.cn(["text-white", "bg-bg-primary", "rounded", "backdrop-blur"])),
307
+ children: /*#__PURE__*/jsxRuntime.jsxs("svg", {
308
+ xmlns: "http://www.w3.org/2000/svg",
309
+ width: "16",
310
+ height: "16",
311
+ viewBox: "0 0 24 24",
312
+ fill: "none",
313
+ stroke: "currentColor",
314
+ strokeWidth: "2",
315
+ strokeLinecap: "round",
316
+ strokeLinejoin: "round",
317
+ children: [/*#__PURE__*/jsxRuntime.jsx("circle", {
318
+ cx: "12",
319
+ cy: "12",
320
+ r: "11"
321
+ }), /*#__PURE__*/jsxRuntime.jsx("line", {
322
+ x1: "12",
323
+ y1: "4",
324
+ x2: "12",
325
+ y2: "12",
326
+ style: {
327
+ transformOrigin: "center",
328
+ animation: "rotate-clock 1000ms linear infinite"
329
+ }
330
+ }), /*#__PURE__*/jsxRuntime.jsx("line", {
331
+ x1: "12",
332
+ y1: "8",
333
+ x2: "12",
334
+ y2: "12",
335
+ style: {
336
+ transformOrigin: "center",
337
+ animation: "rotate-clock 12000ms linear infinite"
338
+ }
339
+ })]
294
340
  })
295
341
  })
296
342
  })]
@@ -298,12 +344,10 @@ var ValNextProvider = function ValNextProvider(props) {
298
344
  children: [/*#__PURE__*/jsxRuntime.jsx(Script__default["default"], {
299
345
  type: "module",
300
346
  src: "".concat(route, "/static").concat(ui.VERSION ? "/".concat(ui.VERSION) : "").concat(ui.VAL_APP_PATH),
301
- crossOrigin: "anonymous",
302
- onLoad: function onLoad() {
303
- setSpaLoaded(true);
304
- }
347
+ crossOrigin: "anonymous"
305
348
  }), /*#__PURE__*/jsxRuntime.jsx("div", {
306
- id: ui.VAL_OVERLAY_ID
349
+ id: ui.VAL_OVERLAY_ID,
350
+ ref: container
307
351
  })]
308
352
  }), mountOverlay && iframeSrc && /*#__PURE__*/jsxRuntime.jsx("iframe", {
309
353
  loading: "eager",
@@ -458,28 +502,4 @@ function isValStudioPath(pathname) {
458
502
  // );
459
503
  // }
460
504
 
461
- function Clock(_ref) {
462
- var className = _ref.className,
463
- size = _ref.size;
464
- return /*#__PURE__*/jsxRuntime.jsxs("svg", {
465
- xmlns: "http://www.w3.org/2000/svg",
466
- width: size,
467
- height: size,
468
- viewBox: "0 0 24 24",
469
- fill: "none",
470
- stroke: "currentColor",
471
- strokeWidth: "2",
472
- strokeLinecap: "round",
473
- strokeLinejoin: "round",
474
- className: "lucide lucide-clock " + className,
475
- children: [/*#__PURE__*/jsxRuntime.jsx("circle", {
476
- cx: "12",
477
- cy: "12",
478
- r: "10"
479
- }), /*#__PURE__*/jsxRuntime.jsx("polyline", {
480
- points: "12 6 12 12 16 14"
481
- })]
482
- });
483
- }
484
-
485
505
  exports.ValNextProvider = ValNextProvider;
package/dist/valbuild-next.cjs.dev.js CHANGED
@@ -7,10 +7,10 @@ var objectSpread2 = require('./objectSpread2-792eb2c2.cjs.dev.js');
7
7
  var core = require('@valbuild/core');
8
8
  var stega = require('@valbuild/react/stega');
9
9
  var internal = require('@valbuild/react/internal');
10
- var ValNextProvider = require('./ValNextProvider-726026f9.cjs.dev.js');
10
+ var ValNextProvider = require('./ValNextProvider-49b788b8.cjs.dev.js');
11
11
  var NextImage = require('next/image');
12
12
  var jsxRuntime = require('react/jsx-runtime');
13
- var ValApp = require('./ValApp-0ded607c.cjs.dev.js');
13
+ var ValApp = require('./ValApp-3df36e0d.cjs.dev.js');
14
14
  var version = require('./version-82faa1d0.cjs.dev.js');
15
15
 
16
16
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
package/dist/valbuild-next.cjs.prod.js CHANGED
@@ -7,10 +7,10 @@ var objectSpread2 = require('./objectSpread2-3c87fb4f.cjs.prod.js');
7
7
  var core = require('@valbuild/core');
8
8
  var stega = require('@valbuild/react/stega');
9
9
  var internal = require('@valbuild/react/internal');
10
- var ValNextProvider = require('./ValNextProvider-7042b86d.cjs.prod.js');
10
+ var ValNextProvider = require('./ValNextProvider-9ce953f7.cjs.prod.js');
11
11
  var NextImage = require('next/image');
12
12
  var jsxRuntime = require('react/jsx-runtime');
13
- var ValApp = require('./ValApp-b10c2084.cjs.prod.js');
13
+ var ValApp = require('./ValApp-22147086.cjs.prod.js');
14
14
  var version = require('./version-a9a6a619.cjs.prod.js');
15
15
 
16
16
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
package/dist/valbuild-next.esm.js CHANGED
@@ -6,10 +6,10 @@ export { core as expr };
6
6
  export { FILE_REF_PROP, GenericSelector, Schema, VAL_EXTENSION, derefPatch, modules } from '@valbuild/core';
7
7
  import { stegaClean, stegaEncode, stegaDecodeString, autoTagJSX } from '@valbuild/react/stega';
8
8
  export { ValRichText } from '@valbuild/react/internal';
9
- import { ValNextProvider } from './ValNextProvider-10c232b6.esm.js';
9
+ import { ValNextProvider } from './ValNextProvider-5657aa89.esm.js';
10
10
  import NextImage from 'next/image';
11
11
  import { jsx } from 'react/jsx-runtime';
12
- export { ValApp } from './ValApp-489d97dc.esm.js';
12
+ export { ValApp } from './ValApp-e2e1dfed.esm.js';
13
13
  import { V as VERSION } from './version-98ec5c7a.esm.js';
14
14
 
15
15
  function raw(val) {
package/package.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "next",
9
9
  "react"
10
10
  ],
11
- "version": "0.86.2",
11
+ "version": "0.87.0",
12
12
  "scripts": {
13
13
  "typecheck": "tsc --noEmit",
14
14
  "test": "jest"
@@ -45,11 +45,11 @@
45
45
  "exports": true
46
46
  },
47
47
  "dependencies": {
48
- "@valbuild/core": "~0.86.2",
49
- "@valbuild/react": "~0.86.2",
50
- "@valbuild/server": "~0.86.2",
51
- "@valbuild/shared": "~0.86.2",
52
- "@valbuild/ui": "~0.86.2",
48
+ "@valbuild/core": "~0.87.0",
49
+ "@valbuild/react": "~0.87.0",
50
+ "@valbuild/server": "~0.87.0",
51
+ "@valbuild/shared": "~0.87.0",
52
+ "@valbuild/ui": "~0.87.0",
53
53
  "client-only": "^0.0.1",
54
54
  "server-only": "^0.0.1"
55
55
  },
package/dist/ValApp-b10c2084.cjs.js DELETED
@@ -1,7 +0,0 @@
1
- 'use strict';
2
-
3
- if (process.env.NODE_ENV === "production") {
4
- module.exports = require("./ValApp-b10c2084.cjs.prod.js");
5
- } else {
6
- module.exports = require("./ValApp-b10c2084.cjs.dev.js");
7
- }
package/dist/ValNextProvider-7042b86d.cjs.js DELETED
@@ -1,7 +0,0 @@
1
- 'use strict';
2
-
3
- if (process.env.NODE_ENV === "production") {
4
- module.exports = require("./ValNextProvider-7042b86d.cjs.prod.js");
5
- } else {
6
- module.exports = require("./ValNextProvider-7042b86d.cjs.dev.js");
7
- }