@weaverse/react 0.6.24 → 0.6.28
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/index.js +235 -56
- package/package.json +2 -2
- package/dist/index.d.ts +0 -92
- package/dist/index.mjs +0 -782
package/dist/index.js
CHANGED
|
@@ -62,7 +62,7 @@ module.exports = __toCommonJS(src_exports);
|
|
|
62
62
|
|
|
63
63
|
// src/context.ts
|
|
64
64
|
var import_core = require("@weaverse/core");
|
|
65
|
-
var
|
|
65
|
+
var import_react16 = require("react");
|
|
66
66
|
|
|
67
67
|
// src/elements/button.tsx
|
|
68
68
|
var React = __toESM(require("react"));
|
|
@@ -241,23 +241,58 @@ var countdown_default = Countdown;
|
|
|
241
241
|
// src/elements/image.tsx
|
|
242
242
|
var import_react4 = __toESM(require("react"));
|
|
243
243
|
var Image = import_react4.default.forwardRef((props, ref) => {
|
|
244
|
-
let
|
|
245
|
-
|
|
244
|
+
let { isDesignMode } = (0, import_react4.useContext)(WeaverseContext);
|
|
245
|
+
let _a = props, {
|
|
246
|
+
src,
|
|
247
|
+
alt,
|
|
248
|
+
objectFit,
|
|
249
|
+
objectPosition,
|
|
250
|
+
onClickAction,
|
|
251
|
+
openLinkInNewTab
|
|
252
|
+
} = _a, rest = __objRest(_a, [
|
|
253
|
+
"src",
|
|
254
|
+
"alt",
|
|
255
|
+
"objectFit",
|
|
256
|
+
"objectPosition",
|
|
257
|
+
"onClickAction",
|
|
258
|
+
"openLinkInNewTab"
|
|
259
|
+
]);
|
|
260
|
+
let style = {
|
|
261
|
+
"--wv-img-object-fit": objectFit,
|
|
262
|
+
"--wv-img-object-position": objectPosition
|
|
263
|
+
};
|
|
264
|
+
let handleClick = () => {
|
|
265
|
+
if (isDesignMode) {
|
|
266
|
+
return console.log("Click action:", onClickAction);
|
|
267
|
+
}
|
|
268
|
+
if (onClickAction) {
|
|
269
|
+
console.log("TODO: click action:", onClickAction);
|
|
270
|
+
}
|
|
271
|
+
};
|
|
272
|
+
return /* @__PURE__ */ import_react4.default.createElement("div", __spreadProps(__spreadValues({
|
|
246
273
|
ref
|
|
247
|
-
}, rest),
|
|
274
|
+
}, rest), {
|
|
275
|
+
style,
|
|
276
|
+
onClick: handleClick
|
|
277
|
+
}), /* @__PURE__ */ import_react4.default.createElement("img", {
|
|
248
278
|
alt,
|
|
249
279
|
src
|
|
250
280
|
}));
|
|
251
281
|
});
|
|
252
282
|
Image.defaultProps = {
|
|
253
283
|
src: "https://ucarecdn.com/1cdc9d39-ca62-492e-8ec7-f1a86b241a90/",
|
|
254
|
-
alt: "
|
|
284
|
+
alt: "Image alt text",
|
|
285
|
+
objectFit: "cover",
|
|
286
|
+
objectPosition: "center",
|
|
287
|
+
onClickAction: "open-lightbox",
|
|
288
|
+
openLinkInNewTab: false,
|
|
255
289
|
css: {
|
|
256
290
|
"@desktop": {
|
|
257
291
|
img: {
|
|
258
292
|
width: "100%",
|
|
259
293
|
height: "100%",
|
|
260
|
-
objectFit: "cover"
|
|
294
|
+
objectFit: "var(--wv-img-object-fit, cover)",
|
|
295
|
+
objectPosition: "var(--wv-img-object-position, center)"
|
|
261
296
|
}
|
|
262
297
|
}
|
|
263
298
|
}
|
|
@@ -434,10 +469,9 @@ var Placeholder_default = Placeholder;
|
|
|
434
469
|
// src/elements/instagram.tsx
|
|
435
470
|
var INSTAGRAM_API = "https://graph.instagram.com";
|
|
436
471
|
var Instagram = (0, import_react9.forwardRef)((props, ref) => {
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
let { isDesignMode } = (0, import_react9.useContext)(WeaverseContext);
|
|
472
|
+
let _a = props, { token, username, numberOfImages, imagesPerRow, gap } = _a, rest = __objRest(_a, ["token", "username", "numberOfImages", "imagesPerRow", "gap"]);
|
|
473
|
+
let [media, setMedia] = (0, import_react9.useState)([]);
|
|
474
|
+
let [error, setError] = (0, import_react9.useState)(null);
|
|
441
475
|
(0, import_react9.useEffect)(() => {
|
|
442
476
|
if (token) {
|
|
443
477
|
let params = new URLSearchParams({
|
|
@@ -463,7 +497,7 @@ var Instagram = (0, import_react9.forwardRef)((props, ref) => {
|
|
|
463
497
|
}
|
|
464
498
|
let style = {
|
|
465
499
|
"--wv-ig-images-per-row": imagesPerRow,
|
|
466
|
-
"--wv-ig-images-gap": gap
|
|
500
|
+
"--wv-ig-images-gap": gap + "px"
|
|
467
501
|
};
|
|
468
502
|
return /* @__PURE__ */ import_react9.default.createElement("div", __spreadProps(__spreadValues({
|
|
469
503
|
ref
|
|
@@ -472,15 +506,15 @@ var Instagram = (0, import_react9.forwardRef)((props, ref) => {
|
|
|
472
506
|
}), /* @__PURE__ */ import_react9.default.createElement("div", {
|
|
473
507
|
className: "wv-ig-media-container"
|
|
474
508
|
}, media.slice(0, numberOfImages).map((item) => {
|
|
475
|
-
let
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
},
|
|
482
|
-
alt:
|
|
483
|
-
src:
|
|
509
|
+
let { id, permalink, caption, media_url } = item;
|
|
510
|
+
return /* @__PURE__ */ import_react9.default.createElement("a", {
|
|
511
|
+
key: id,
|
|
512
|
+
href: permalink,
|
|
513
|
+
target: "_blank",
|
|
514
|
+
rel: "noreferrer"
|
|
515
|
+
}, /* @__PURE__ */ import_react9.default.createElement("img", {
|
|
516
|
+
alt: caption,
|
|
517
|
+
src: media_url
|
|
484
518
|
}));
|
|
485
519
|
})));
|
|
486
520
|
});
|
|
@@ -528,7 +562,6 @@ var Accordion = (0, import_react10.forwardRef)((props, ref) => {
|
|
|
528
562
|
setActive(id);
|
|
529
563
|
}
|
|
530
564
|
};
|
|
531
|
-
console.info("9779 active", active);
|
|
532
565
|
return /* @__PURE__ */ import_react10.default.createElement("div", __spreadValues({
|
|
533
566
|
ref
|
|
534
567
|
}, rest), /* @__PURE__ */ import_react10.default.createElement(AccordionContext.Provider, {
|
|
@@ -554,14 +587,14 @@ Accordion.defaultProps = {
|
|
|
554
587
|
gap: 4,
|
|
555
588
|
".wv-accordion-header": {
|
|
556
589
|
borderRadius: 4,
|
|
557
|
-
padding:
|
|
590
|
+
padding: 12,
|
|
558
591
|
marginBottom: 4,
|
|
559
|
-
|
|
592
|
+
border: "1px solid #76A9FA",
|
|
560
593
|
"&.active": {
|
|
561
594
|
color: "blue"
|
|
562
595
|
},
|
|
563
596
|
'&.active + [data-wv-type="accordion.content"]': {
|
|
564
|
-
|
|
597
|
+
maxHeight: "var(--max-height, inherit)"
|
|
565
598
|
}
|
|
566
599
|
}
|
|
567
600
|
}
|
|
@@ -572,18 +605,17 @@ var accordion_default = Accordion;
|
|
|
572
605
|
// src/elements/accordion/AccordionWrapper.tsx
|
|
573
606
|
var import_react11 = __toESM(require("react"));
|
|
574
607
|
var AccordionWrapper = (0, import_react11.forwardRef)((props, ref) => {
|
|
575
|
-
const _a = props, {
|
|
608
|
+
const _a = props, { ["data-wv-id"]: wvId, headerText, children } = _a, rest = __objRest(_a, ["data-wv-id", "headerText", "children"]);
|
|
576
609
|
const { active, setActive } = (0, import_react11.useContext)(AccordionContext);
|
|
577
610
|
return /* @__PURE__ */ import_react11.default.createElement("div", __spreadValues({
|
|
578
611
|
ref
|
|
579
612
|
}, rest), /* @__PURE__ */ import_react11.default.createElement("div", {
|
|
580
|
-
onClick: () => setActive(
|
|
581
|
-
className: `wv-accordion-header ${active ===
|
|
582
|
-
}, headerText
|
|
613
|
+
onClick: () => setActive(wvId),
|
|
614
|
+
className: `wv-accordion-header ${active === wvId ? "active" : ""}`
|
|
615
|
+
}, headerText), children);
|
|
583
616
|
});
|
|
584
617
|
AccordionWrapper.defaultProps = {
|
|
585
|
-
|
|
586
|
-
headerText: "Header 1",
|
|
618
|
+
headerText: "Header text",
|
|
587
619
|
css: {
|
|
588
620
|
"@desktop": {
|
|
589
621
|
maxHeight: "100%"
|
|
@@ -601,7 +633,8 @@ var AccordionContent = (0, import_react12.forwardRef)((props, ref) => {
|
|
|
601
633
|
"--columns": columns,
|
|
602
634
|
"--gap": gap + "px",
|
|
603
635
|
"--row-size": rowSize + "px",
|
|
604
|
-
"--col-size": "calc((var(--grid-size) - calc(var(--columns) - 1) * var(--gap)) / var(--columns))"
|
|
636
|
+
"--col-size": "calc((var(--grid-size) - calc(var(--columns) - 1) * var(--gap)) / var(--columns))",
|
|
637
|
+
"--max-height": rows * rowSize + gap * (rowSize - 1) + "px"
|
|
605
638
|
};
|
|
606
639
|
return /* @__PURE__ */ import_react12.default.createElement("div", __spreadProps(__spreadValues({
|
|
607
640
|
ref
|
|
@@ -620,17 +653,158 @@ AccordionContent.defaultProps = {
|
|
|
620
653
|
"@desktop": {
|
|
621
654
|
width: "100%",
|
|
622
655
|
maxWidth: "var(--grid-size)",
|
|
623
|
-
|
|
624
|
-
display: "none",
|
|
656
|
+
display: "grid",
|
|
625
657
|
gridTemplateRows: "repeat(var(--rows), var(--row-size))",
|
|
626
658
|
gridTemplateColumns: "repeat(var(--columns), minmax(0, var(--col-size)))",
|
|
627
659
|
gap: "var(--gap)",
|
|
660
|
+
overflow: "hidden",
|
|
661
|
+
maxHeight: 0,
|
|
662
|
+
transition: "all var(--transition-duration, 0.3s) ease-in-out",
|
|
628
663
|
borderRadius: 4
|
|
629
664
|
}
|
|
630
665
|
}
|
|
631
666
|
};
|
|
632
667
|
var AccordionContent_default = AccordionContent;
|
|
633
668
|
|
|
669
|
+
// src/elements/tab/index.tsx
|
|
670
|
+
var import_react14 = __toESM(require("react"));
|
|
671
|
+
|
|
672
|
+
// src/elements/tab/TabHeaderWrapper.tsx
|
|
673
|
+
var import_react13 = __toESM(require("react"));
|
|
674
|
+
function TabHeader(props) {
|
|
675
|
+
const { wvId } = props;
|
|
676
|
+
const { active, setActive } = (0, import_react13.useContext)(TabContext);
|
|
677
|
+
const { itemInstances } = (0, import_react13.useContext)(WeaverseContext);
|
|
678
|
+
const instance = itemInstances.get(wvId);
|
|
679
|
+
let [data, setData] = (0, import_react13.useState)(instance.data);
|
|
680
|
+
(0, import_react13.useEffect)(() => {
|
|
681
|
+
let update = (data2) => setData(__spreadValues({}, data2));
|
|
682
|
+
instance.subscribe(update);
|
|
683
|
+
}, []);
|
|
684
|
+
const text = data.headerText;
|
|
685
|
+
return /* @__PURE__ */ import_react13.default.createElement("div", {
|
|
686
|
+
onClick: () => setActive(wvId),
|
|
687
|
+
className: `wv-tab-header${active === wvId ? " active" : ""}`
|
|
688
|
+
}, text);
|
|
689
|
+
}
|
|
690
|
+
function TabHeaderWrapper(props) {
|
|
691
|
+
const { itemInstances } = (0, import_react13.useContext)(WeaverseContext);
|
|
692
|
+
const instance = itemInstances.get(props.wvId);
|
|
693
|
+
const data = instance.data;
|
|
694
|
+
const childIds = data.childIds;
|
|
695
|
+
return /* @__PURE__ */ import_react13.default.createElement("div", {
|
|
696
|
+
className: "wv-tab-headerWrapper"
|
|
697
|
+
}, childIds.map((id) => /* @__PURE__ */ import_react13.default.createElement(TabHeader, {
|
|
698
|
+
key: id,
|
|
699
|
+
wvId: id
|
|
700
|
+
})));
|
|
701
|
+
}
|
|
702
|
+
|
|
703
|
+
// src/elements/tab/index.tsx
|
|
704
|
+
var TabContext = (0, import_react14.createContext)({
|
|
705
|
+
active: null,
|
|
706
|
+
setActive: () => {
|
|
707
|
+
}
|
|
708
|
+
});
|
|
709
|
+
var Tab = (0, import_react14.forwardRef)((props, ref) => {
|
|
710
|
+
var _b, _c, _d;
|
|
711
|
+
const wvId = props["data-wv-id"];
|
|
712
|
+
const _a = props, { items, children } = _a, rest = __objRest(_a, ["items", "children"]);
|
|
713
|
+
const defaultActive = (_d = (_c = (_b = import_react14.default.Children.toArray(children)) == null ? void 0 : _b[0]) == null ? void 0 : _c.props) == null ? void 0 : _d.id;
|
|
714
|
+
const [active, setActive] = (0, import_react14.useState)(defaultActive);
|
|
715
|
+
const setOpenTab = (id) => {
|
|
716
|
+
if (id === active) {
|
|
717
|
+
setActive(null);
|
|
718
|
+
} else {
|
|
719
|
+
setActive(id);
|
|
720
|
+
}
|
|
721
|
+
};
|
|
722
|
+
return /* @__PURE__ */ import_react14.default.createElement("div", __spreadValues({
|
|
723
|
+
ref
|
|
724
|
+
}, rest), /* @__PURE__ */ import_react14.default.createElement(TabContext.Provider, {
|
|
725
|
+
value: { active, setActive: setOpenTab }
|
|
726
|
+
}, /* @__PURE__ */ import_react14.default.createElement(TabHeaderWrapper, {
|
|
727
|
+
wvId
|
|
728
|
+
}), children));
|
|
729
|
+
});
|
|
730
|
+
Tab.defaultProps = {
|
|
731
|
+
items: [
|
|
732
|
+
{
|
|
733
|
+
headerText: "Header 1"
|
|
734
|
+
},
|
|
735
|
+
{
|
|
736
|
+
headerText: "Header 2"
|
|
737
|
+
},
|
|
738
|
+
{
|
|
739
|
+
headerText: "Header 2"
|
|
740
|
+
}
|
|
741
|
+
],
|
|
742
|
+
css: {
|
|
743
|
+
"@desktop": {
|
|
744
|
+
display: "flex",
|
|
745
|
+
flexDirection: "column",
|
|
746
|
+
gap: 4,
|
|
747
|
+
"& .wv-tab-headerWrapper": {
|
|
748
|
+
width: "100%",
|
|
749
|
+
display: "flex",
|
|
750
|
+
marginBottom: 10
|
|
751
|
+
},
|
|
752
|
+
"& .wv-tab-header": {
|
|
753
|
+
backgroundColor: "#f0f2f3",
|
|
754
|
+
padding: "10px 16px",
|
|
755
|
+
cursor: "pointer",
|
|
756
|
+
"&.active": {
|
|
757
|
+
backgroundColor: "#0F71FF",
|
|
758
|
+
color: "#fff"
|
|
759
|
+
}
|
|
760
|
+
}
|
|
761
|
+
}
|
|
762
|
+
}
|
|
763
|
+
};
|
|
764
|
+
var tab_default = Tab;
|
|
765
|
+
|
|
766
|
+
// src/elements/tab/TabContent.tsx
|
|
767
|
+
var import_react15 = __toESM(require("react"));
|
|
768
|
+
var TabContent = (0, import_react15.forwardRef)((props, ref) => {
|
|
769
|
+
const { active } = (0, import_react15.useContext)(TabContext);
|
|
770
|
+
const wvId = props["data-wv-id"];
|
|
771
|
+
const _a = props, { rows, columns, gap, rowSize, children } = _a, rest = __objRest(_a, ["rows", "columns", "gap", "rowSize", "children"]);
|
|
772
|
+
let style = {
|
|
773
|
+
"--rows": rows,
|
|
774
|
+
"--columns": columns,
|
|
775
|
+
"--gap": gap + "px",
|
|
776
|
+
"--row-size": rowSize + "px",
|
|
777
|
+
"--col-size": "calc((var(--grid-size) - calc(var(--columns) - 1) * var(--gap)) / var(--columns))",
|
|
778
|
+
"--max-height": rows * rowSize + gap * (rowSize - 1) + "px",
|
|
779
|
+
"--content-active": active === wvId ? "grid" : "none"
|
|
780
|
+
};
|
|
781
|
+
return /* @__PURE__ */ import_react15.default.createElement("div", __spreadProps(__spreadValues({
|
|
782
|
+
ref
|
|
783
|
+
}, rest), {
|
|
784
|
+
style
|
|
785
|
+
}), import_react15.default.Children.count(children) > 0 ? children : /* @__PURE__ */ import_react15.default.createElement(Placeholder_default, {
|
|
786
|
+
element: "Tab"
|
|
787
|
+
}, "Item Content"));
|
|
788
|
+
});
|
|
789
|
+
TabContent.defaultProps = {
|
|
790
|
+
rows: 2,
|
|
791
|
+
columns: 12,
|
|
792
|
+
gap: 4,
|
|
793
|
+
rowSize: 48,
|
|
794
|
+
css: {
|
|
795
|
+
"@desktop": {
|
|
796
|
+
width: "100%",
|
|
797
|
+
maxWidth: "var(--grid-size)",
|
|
798
|
+
display: "var(--content-active, none)",
|
|
799
|
+
gridTemplateRows: "repeat(var(--rows), var(--row-size))",
|
|
800
|
+
gridTemplateColumns: "repeat(var(--columns), minmax(0, var(--col-size)))",
|
|
801
|
+
gap: "var(--gap)",
|
|
802
|
+
borderRadius: 4
|
|
803
|
+
}
|
|
804
|
+
}
|
|
805
|
+
};
|
|
806
|
+
var TabContent_default = TabContent;
|
|
807
|
+
|
|
634
808
|
// src/elements/index.ts
|
|
635
809
|
var elements = {
|
|
636
810
|
Countdown: {
|
|
@@ -680,6 +854,14 @@ var elements = {
|
|
|
680
854
|
AccordionContent: {
|
|
681
855
|
Component: AccordionContent_default,
|
|
682
856
|
type: "accordion.content"
|
|
857
|
+
},
|
|
858
|
+
Tab: {
|
|
859
|
+
Component: tab_default,
|
|
860
|
+
type: "tab"
|
|
861
|
+
},
|
|
862
|
+
TabContent: {
|
|
863
|
+
Component: TabContent_default,
|
|
864
|
+
type: "tab.content"
|
|
683
865
|
}
|
|
684
866
|
};
|
|
685
867
|
var elements_default = elements;
|
|
@@ -692,13 +874,13 @@ var createRootContext = (configs) => {
|
|
|
692
874
|
});
|
|
693
875
|
return rootContext;
|
|
694
876
|
};
|
|
695
|
-
var WeaverseContext = (0,
|
|
877
|
+
var WeaverseContext = (0, import_react16.createContext)({});
|
|
696
878
|
var WeaverseContextProvider = WeaverseContext.Provider;
|
|
697
879
|
var WeaverseContextConsumer = WeaverseContext.Consumer;
|
|
698
880
|
|
|
699
881
|
// src/renderer.tsx
|
|
700
882
|
var import_core2 = require("@weaverse/core");
|
|
701
|
-
var
|
|
883
|
+
var import_react17 = __toESM(require("react"));
|
|
702
884
|
|
|
703
885
|
// src/utils/index.ts
|
|
704
886
|
var shortCssObject = (css) => {
|
|
@@ -725,15 +907,12 @@ function generateItemClass(instance, stitchesInstance) {
|
|
|
725
907
|
|
|
726
908
|
// src/renderer.tsx
|
|
727
909
|
var WeaverseRoot = ({ context }) => {
|
|
728
|
-
var _a;
|
|
729
|
-
let [, setData] = (0,
|
|
730
|
-
let rootRef = (0,
|
|
731
|
-
|
|
732
|
-
|
|
910
|
+
var _a, _b;
|
|
911
|
+
let [, setData] = (0, import_react17.useState)(context.projectData);
|
|
912
|
+
let rootRef = (0, import_react17.useRef)();
|
|
913
|
+
let update = () => setData({});
|
|
914
|
+
(0, import_react17.useEffect)(() => {
|
|
733
915
|
context.subscribe(update);
|
|
734
|
-
if (context.projectData) {
|
|
735
|
-
setTimeout(update, 110);
|
|
736
|
-
}
|
|
737
916
|
context.contentRootElement = rootRef.current;
|
|
738
917
|
return () => {
|
|
739
918
|
context.unsubscribe(update);
|
|
@@ -741,21 +920,21 @@ var WeaverseRoot = ({ context }) => {
|
|
|
741
920
|
}, []);
|
|
742
921
|
let eventHandlers = ((_a = context == null ? void 0 : context.studioBridge) == null ? void 0 : _a.eventHandlers) || {};
|
|
743
922
|
let themeClass = context.stitchesInstance.theme.className;
|
|
744
|
-
return /* @__PURE__ */
|
|
923
|
+
return ((_b = context.projectData) == null ? void 0 : _b.rootId) ? /* @__PURE__ */ import_react17.default.createElement("div", __spreadProps(__spreadValues({
|
|
745
924
|
className: `weaverse-content-root ${themeClass}`
|
|
746
925
|
}, eventHandlers), {
|
|
747
926
|
ref: rootRef
|
|
748
|
-
}), /* @__PURE__ */
|
|
927
|
+
}), /* @__PURE__ */ import_react17.default.createElement(WeaverseContextProvider, {
|
|
749
928
|
value: context
|
|
750
|
-
}, /* @__PURE__ */
|
|
751
|
-
id: context.projectData.rootId
|
|
752
|
-
})));
|
|
929
|
+
}, /* @__PURE__ */ import_react17.default.createElement(ItemInstance, {
|
|
930
|
+
id: context.projectData.rootId
|
|
931
|
+
}))) : null;
|
|
753
932
|
};
|
|
754
933
|
var ItemComponent = ({ instance }) => {
|
|
755
|
-
let { stitchesInstance, elementInstances } = (0,
|
|
756
|
-
let [data, setData] = (0,
|
|
934
|
+
let { stitchesInstance, elementInstances } = (0, import_react17.useContext)(WeaverseContext);
|
|
935
|
+
let [data, setData] = (0, import_react17.useState)(instance.data);
|
|
757
936
|
let _a = data, { id, type, childIds = [], css, className } = _a, rest = __objRest(_a, ["id", "type", "childIds", "css", "className"]);
|
|
758
|
-
(0,
|
|
937
|
+
(0, import_react17.useEffect)(() => {
|
|
759
938
|
var _a2;
|
|
760
939
|
let update = (data2) => setData(__spreadValues({}, data2));
|
|
761
940
|
instance.subscribe(update);
|
|
@@ -775,12 +954,12 @@ var ItemComponent = ({ instance }) => {
|
|
|
775
954
|
if (Component.$$typeof === Symbol.for("react.forward_ref")) {
|
|
776
955
|
rest.ref = instance.ref;
|
|
777
956
|
}
|
|
778
|
-
return /* @__PURE__ */
|
|
957
|
+
return /* @__PURE__ */ import_react17.default.createElement(Component, __spreadValues({
|
|
779
958
|
key: id,
|
|
780
959
|
"data-wv-type": type,
|
|
781
960
|
"data-wv-id": id,
|
|
782
961
|
className: generateItemClass(instance, stitchesInstance)
|
|
783
|
-
}, rest), childIds.map((id2) => /* @__PURE__ */
|
|
962
|
+
}, rest), childIds.map((id2) => /* @__PURE__ */ import_react17.default.createElement(ItemInstance, {
|
|
784
963
|
key: id2,
|
|
785
964
|
id: id2
|
|
786
965
|
})));
|
|
@@ -788,15 +967,15 @@ var ItemComponent = ({ instance }) => {
|
|
|
788
967
|
return null;
|
|
789
968
|
};
|
|
790
969
|
var ItemInstance = ({ id }) => {
|
|
791
|
-
let context = (0,
|
|
970
|
+
let context = (0, import_react17.useContext)(WeaverseContext);
|
|
792
971
|
let { itemInstances } = context;
|
|
793
972
|
let instance = itemInstances.get(id);
|
|
794
973
|
if (!instance) {
|
|
795
|
-
return /* @__PURE__ */
|
|
974
|
+
return /* @__PURE__ */ import_react17.default.createElement("div", {
|
|
796
975
|
style: { display: "none" }
|
|
797
976
|
}, "Item instance ", id, " not found");
|
|
798
977
|
}
|
|
799
|
-
return /* @__PURE__ */
|
|
978
|
+
return /* @__PURE__ */ import_react17.default.createElement(ItemComponent, {
|
|
800
979
|
instance
|
|
801
980
|
});
|
|
802
981
|
};
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.6.
|
|
2
|
+
"version": "0.6.28",
|
|
3
3
|
"license": "MIT",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"typings": "dist/index.d.ts",
|
|
@@ -31,6 +31,6 @@
|
|
|
31
31
|
"name": "@weaverse/react",
|
|
32
32
|
"author": "Weaverse Team",
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@weaverse/core": "0.6.
|
|
34
|
+
"@weaverse/core": "0.6.28"
|
|
35
35
|
}
|
|
36
36
|
}
|
package/dist/index.d.ts
DELETED
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
import * as react from 'react';
|
|
2
|
-
import { ReactElement, ReactNode } from 'react';
|
|
3
|
-
import { WeaverseType, Weaverse, ElementCSS, WeaverseItemStore } from '@weaverse/core';
|
|
4
|
-
export * from '@weaverse/core';
|
|
5
|
-
|
|
6
|
-
declare let createRootContext: (configs: WeaverseType) => Weaverse;
|
|
7
|
-
declare let WeaverseContext: react.Context<Weaverse>;
|
|
8
|
-
declare let WeaverseContextProvider: react.Provider<Weaverse>;
|
|
9
|
-
declare let WeaverseContextConsumer: react.Consumer<Weaverse>;
|
|
10
|
-
|
|
11
|
-
interface WeaverseElementProps extends ReactElement {
|
|
12
|
-
css?: ElementCSS;
|
|
13
|
-
children?: ReactElement | ReactElement[] | ReactNode | ReactNode[];
|
|
14
|
-
}
|
|
15
|
-
declare type WeaverseRootPropsType = {
|
|
16
|
-
context: Weaverse;
|
|
17
|
-
};
|
|
18
|
-
declare type ItemComponentProps = {
|
|
19
|
-
instance: InstanceType<typeof WeaverseItemStore>;
|
|
20
|
-
};
|
|
21
|
-
interface PlaceholderProps extends WeaverseElementProps {
|
|
22
|
-
element: string;
|
|
23
|
-
}
|
|
24
|
-
interface ButtonElementProps extends WeaverseElementProps {
|
|
25
|
-
value: string;
|
|
26
|
-
openInNewTab: boolean;
|
|
27
|
-
target: string;
|
|
28
|
-
type: 'button' | 'submit' | 'reset';
|
|
29
|
-
}
|
|
30
|
-
interface ContainerElementProps extends WeaverseElementProps {
|
|
31
|
-
[key: string]: any;
|
|
32
|
-
}
|
|
33
|
-
interface ImageElementProps extends WeaverseElementProps {
|
|
34
|
-
src: string;
|
|
35
|
-
alt: string;
|
|
36
|
-
}
|
|
37
|
-
interface LayoutElementProps extends WeaverseElementProps {
|
|
38
|
-
gridSize: number;
|
|
39
|
-
rows: number;
|
|
40
|
-
columns: number;
|
|
41
|
-
gap: number;
|
|
42
|
-
rowSize: number;
|
|
43
|
-
}
|
|
44
|
-
interface MapElementProps extends WeaverseElementProps {
|
|
45
|
-
place: string;
|
|
46
|
-
zoom: number;
|
|
47
|
-
}
|
|
48
|
-
interface TextElementProps extends WeaverseElementProps {
|
|
49
|
-
value: string;
|
|
50
|
-
}
|
|
51
|
-
interface VideoElementProps extends WeaverseElementProps {
|
|
52
|
-
src: string;
|
|
53
|
-
poster: string;
|
|
54
|
-
loop: boolean;
|
|
55
|
-
type: string;
|
|
56
|
-
controls: boolean;
|
|
57
|
-
autoPlay: boolean;
|
|
58
|
-
muted: boolean;
|
|
59
|
-
}
|
|
60
|
-
declare type CountdownTimeKey = 'days' | 'hours' | 'minutes' | 'seconds';
|
|
61
|
-
interface CountdownElementProps extends WeaverseElementProps {
|
|
62
|
-
timerType: 'fixed-time' | 'evergreen';
|
|
63
|
-
startTime: number;
|
|
64
|
-
endTime: number;
|
|
65
|
-
periods: number;
|
|
66
|
-
redirectUrl: string;
|
|
67
|
-
openInNewTab: boolean;
|
|
68
|
-
showLabel: boolean;
|
|
69
|
-
showColon: boolean;
|
|
70
|
-
}
|
|
71
|
-
declare type TimerBlockProps = {
|
|
72
|
-
label: string;
|
|
73
|
-
value: number;
|
|
74
|
-
};
|
|
75
|
-
interface InstagramElementProps extends WeaverseElementProps {
|
|
76
|
-
token: string;
|
|
77
|
-
username: string;
|
|
78
|
-
numberOfImages: number;
|
|
79
|
-
imagesPerRow: number;
|
|
80
|
-
gap: number;
|
|
81
|
-
}
|
|
82
|
-
declare type InstagramMedia = {
|
|
83
|
-
id: string;
|
|
84
|
-
media_type: 'IMAGE' | 'CAROUSEL_ALBUM';
|
|
85
|
-
media_url: string;
|
|
86
|
-
permalink: string;
|
|
87
|
-
caption: string;
|
|
88
|
-
};
|
|
89
|
-
|
|
90
|
-
declare let WeaverseRoot: ({ context }: WeaverseRootPropsType) => JSX.Element;
|
|
91
|
-
|
|
92
|
-
export { ButtonElementProps, ContainerElementProps, CountdownElementProps, CountdownTimeKey, ImageElementProps, InstagramElementProps, InstagramMedia, ItemComponentProps, LayoutElementProps, MapElementProps, PlaceholderProps, TextElementProps, TimerBlockProps, VideoElementProps, WeaverseContext, WeaverseContextConsumer, WeaverseContextProvider, WeaverseElementProps, WeaverseRoot, WeaverseRootPropsType, createRootContext };
|
package/dist/index.mjs
DELETED
|
@@ -1,782 +0,0 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defProps = Object.defineProperties;
|
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
-
var __objRest = (source, exclude) => {
|
|
21
|
-
var target = {};
|
|
22
|
-
for (var prop in source)
|
|
23
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
-
target[prop] = source[prop];
|
|
25
|
-
if (source != null && __getOwnPropSymbols)
|
|
26
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
-
target[prop] = source[prop];
|
|
29
|
-
}
|
|
30
|
-
return target;
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
// src/context.ts
|
|
34
|
-
import { Weaverse } from "@weaverse/core";
|
|
35
|
-
import { createContext as createContext2 } from "react";
|
|
36
|
-
|
|
37
|
-
// src/elements/button.tsx
|
|
38
|
-
import * as React from "react";
|
|
39
|
-
var Button = React.forwardRef((props, ref) => {
|
|
40
|
-
let _a = props, { openInNewTab, target, value } = _a, rest = __objRest(_a, ["openInNewTab", "target", "value"]);
|
|
41
|
-
if (target) {
|
|
42
|
-
return /* @__PURE__ */ React.createElement("a", __spreadProps(__spreadValues({
|
|
43
|
-
href: target,
|
|
44
|
-
target: openInNewTab ? "_blank" : "_self",
|
|
45
|
-
rel: "noreferrer"
|
|
46
|
-
}, rest), {
|
|
47
|
-
ref
|
|
48
|
-
}), value);
|
|
49
|
-
}
|
|
50
|
-
return /* @__PURE__ */ React.createElement("button", __spreadValues({
|
|
51
|
-
ref
|
|
52
|
-
}, rest), value);
|
|
53
|
-
});
|
|
54
|
-
Button.defaultProps = {
|
|
55
|
-
value: "Shop now",
|
|
56
|
-
openInNewTab: false,
|
|
57
|
-
target: "",
|
|
58
|
-
type: "button",
|
|
59
|
-
css: {
|
|
60
|
-
"@desktop": {
|
|
61
|
-
borderRadius: "72px",
|
|
62
|
-
border: "none",
|
|
63
|
-
backgroundColor: "#0F71FF",
|
|
64
|
-
color: "#fff",
|
|
65
|
-
fontSize: "13px",
|
|
66
|
-
padding: "10px 20px"
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
};
|
|
70
|
-
var button_default = Button;
|
|
71
|
-
|
|
72
|
-
// src/elements/container.tsx
|
|
73
|
-
import React2, { forwardRef as forwardRef2 } from "react";
|
|
74
|
-
var Container = forwardRef2((props, ref) => {
|
|
75
|
-
let _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
|
|
76
|
-
return /* @__PURE__ */ React2.createElement("div", __spreadValues({
|
|
77
|
-
ref
|
|
78
|
-
}, rest), children);
|
|
79
|
-
});
|
|
80
|
-
Container.defaultProps = {
|
|
81
|
-
css: {
|
|
82
|
-
"@desktop": {
|
|
83
|
-
alignItems: "flex-start",
|
|
84
|
-
backgroundColor: "rgba(248,203,203,0.38)",
|
|
85
|
-
display: "flex",
|
|
86
|
-
flexDirection: "column",
|
|
87
|
-
gridArea: "1 / 1 / 3 / 6",
|
|
88
|
-
height: "fit-content",
|
|
89
|
-
justifyContent: "flex-start",
|
|
90
|
-
overflow: "hidden",
|
|
91
|
-
textAlign: "left",
|
|
92
|
-
width: "100%"
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
};
|
|
96
|
-
var container_default = Container;
|
|
97
|
-
|
|
98
|
-
// src/elements/countdown/index.tsx
|
|
99
|
-
import React4, { forwardRef as forwardRef3, useContext, useEffect } from "react";
|
|
100
|
-
|
|
101
|
-
// src/elements/countdown/timer-block.tsx
|
|
102
|
-
import React3 from "react";
|
|
103
|
-
function TimerBlock({ value, label }) {
|
|
104
|
-
return /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement("div", {
|
|
105
|
-
className: "wv-countdown-number"
|
|
106
|
-
}, value.toString().padStart(2, "0")), label && /* @__PURE__ */ React3.createElement("div", {
|
|
107
|
-
className: "wv-countdown-label"
|
|
108
|
-
}, label));
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
// src/elements/countdown/utils.ts
|
|
112
|
-
var times = ["days", "hours", "minutes", "seconds"];
|
|
113
|
-
function getTime(_seconds) {
|
|
114
|
-
const ONE_MINUTE = 60 * 1e3;
|
|
115
|
-
const ONE_HOUR = 60 * ONE_MINUTE;
|
|
116
|
-
const ONE_DAY = 24 * ONE_HOUR;
|
|
117
|
-
const days = Math.floor(_seconds / ONE_DAY);
|
|
118
|
-
const hours = Math.floor((_seconds - days * ONE_DAY) / ONE_HOUR);
|
|
119
|
-
const minutes = Math.floor((_seconds - days * ONE_DAY - hours * ONE_HOUR) / ONE_MINUTE);
|
|
120
|
-
const seconds = Math.floor((_seconds - days * ONE_DAY - hours * ONE_HOUR - minutes * ONE_MINUTE) / 1e3);
|
|
121
|
-
return { days, hours, minutes, seconds };
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
// src/elements/countdown/index.tsx
|
|
125
|
-
var Countdown = forwardRef3((props, ref) => {
|
|
126
|
-
const { isDesignMode } = useContext(WeaverseContext);
|
|
127
|
-
let _a = props, {
|
|
128
|
-
timerType,
|
|
129
|
-
startTime,
|
|
130
|
-
endTime,
|
|
131
|
-
periods,
|
|
132
|
-
redirectUrl,
|
|
133
|
-
openInNewTab,
|
|
134
|
-
showColon,
|
|
135
|
-
showLabel
|
|
136
|
-
} = _a, rest = __objRest(_a, [
|
|
137
|
-
"timerType",
|
|
138
|
-
"startTime",
|
|
139
|
-
"endTime",
|
|
140
|
-
"periods",
|
|
141
|
-
"redirectUrl",
|
|
142
|
-
"openInNewTab",
|
|
143
|
-
"showColon",
|
|
144
|
-
"showLabel"
|
|
145
|
-
]);
|
|
146
|
-
const [remaining, setRemaining] = React4.useState(0);
|
|
147
|
-
if (typeof endTime !== "number") {
|
|
148
|
-
endTime = Number.parseInt(endTime);
|
|
149
|
-
}
|
|
150
|
-
useEffect(() => {
|
|
151
|
-
const flag = setInterval(() => {
|
|
152
|
-
const remainingTime = Math.max((timerType === "fixed-time" ? new Date(endTime).getTime() : new Date(startTime).getTime() + periods * 60 * 1e3) - Date.now(), 0);
|
|
153
|
-
if (!isDesignMode && redirectUrl && remainingTime > 0 && remainingTime < 1e3) {
|
|
154
|
-
window.open(redirectUrl, openInNewTab ? "_blank" : "_self");
|
|
155
|
-
}
|
|
156
|
-
setRemaining(remainingTime);
|
|
157
|
-
}, 1e3);
|
|
158
|
-
return () => {
|
|
159
|
-
clearInterval(flag);
|
|
160
|
-
};
|
|
161
|
-
}, [startTime, endTime, periods, timerType]);
|
|
162
|
-
const timer = getTime(remaining);
|
|
163
|
-
return /* @__PURE__ */ React4.createElement("div", __spreadValues({
|
|
164
|
-
ref
|
|
165
|
-
}, rest), times.map((time) => {
|
|
166
|
-
return /* @__PURE__ */ React4.createElement(React4.Fragment, {
|
|
167
|
-
key: time
|
|
168
|
-
}, /* @__PURE__ */ React4.createElement(TimerBlock, {
|
|
169
|
-
label: showLabel ? time : "",
|
|
170
|
-
value: timer[time]
|
|
171
|
-
}), time !== "seconds" && /* @__PURE__ */ React4.createElement("span", {
|
|
172
|
-
className: `wv-countdown-number ${showColon ? "" : "hidden"}`
|
|
173
|
-
}, ":"));
|
|
174
|
-
}));
|
|
175
|
-
});
|
|
176
|
-
Countdown.defaultProps = {
|
|
177
|
-
timerType: "fixed-time",
|
|
178
|
-
startTime: Date.now(),
|
|
179
|
-
endTime: 1661140528e3,
|
|
180
|
-
periods: 90,
|
|
181
|
-
redirectUrl: "https://myshop.com",
|
|
182
|
-
openInNewTab: false,
|
|
183
|
-
showLabel: true,
|
|
184
|
-
showColon: true,
|
|
185
|
-
css: {
|
|
186
|
-
"@desktop": {
|
|
187
|
-
fontFamily: "Inter",
|
|
188
|
-
fontSize: 36,
|
|
189
|
-
fontWeight: 500,
|
|
190
|
-
display: "grid",
|
|
191
|
-
gridAutoFlow: "column",
|
|
192
|
-
gap: 10,
|
|
193
|
-
"& > div": {
|
|
194
|
-
width: 48,
|
|
195
|
-
textAlign: "center"
|
|
196
|
-
},
|
|
197
|
-
".wv-countdown-label": {
|
|
198
|
-
fontSize: 10
|
|
199
|
-
},
|
|
200
|
-
"& > span": {
|
|
201
|
-
lineHeight: "100%"
|
|
202
|
-
},
|
|
203
|
-
"& .hidden": {
|
|
204
|
-
visibility: "hidden"
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
}
|
|
208
|
-
};
|
|
209
|
-
var countdown_default = Countdown;
|
|
210
|
-
|
|
211
|
-
// src/elements/image.tsx
|
|
212
|
-
import React5 from "react";
|
|
213
|
-
var Image = React5.forwardRef((props, ref) => {
|
|
214
|
-
let _a = props, { src, alt } = _a, rest = __objRest(_a, ["src", "alt"]);
|
|
215
|
-
return /* @__PURE__ */ React5.createElement("div", __spreadValues({
|
|
216
|
-
ref
|
|
217
|
-
}, rest), /* @__PURE__ */ React5.createElement("img", {
|
|
218
|
-
alt,
|
|
219
|
-
src
|
|
220
|
-
}));
|
|
221
|
-
});
|
|
222
|
-
Image.defaultProps = {
|
|
223
|
-
src: "https://ucarecdn.com/1cdc9d39-ca62-492e-8ec7-f1a86b241a90/",
|
|
224
|
-
alt: "weaverse image element",
|
|
225
|
-
css: {
|
|
226
|
-
"@desktop": {
|
|
227
|
-
img: {
|
|
228
|
-
width: "100%",
|
|
229
|
-
height: "100%",
|
|
230
|
-
objectFit: "cover"
|
|
231
|
-
}
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
};
|
|
235
|
-
var image_default = Image;
|
|
236
|
-
|
|
237
|
-
// src/elements/layout.tsx
|
|
238
|
-
import React6, { forwardRef as forwardRef4 } from "react";
|
|
239
|
-
var Layout = forwardRef4((props, ref) => {
|
|
240
|
-
let _a = props, { children, rows, gap, rowSize, columns, gridSize } = _a, rest = __objRest(_a, ["children", "rows", "gap", "rowSize", "columns", "gridSize"]);
|
|
241
|
-
let style = {
|
|
242
|
-
"--grid-size": gridSize + "px",
|
|
243
|
-
"--rows": rows,
|
|
244
|
-
"--columns": columns,
|
|
245
|
-
"--gap": gap + "px",
|
|
246
|
-
"--row-size": rowSize + "px",
|
|
247
|
-
"--col-size": "calc((var(--grid-size) - calc(var(--columns) - 1) * var(--gap)) / var(--columns))"
|
|
248
|
-
};
|
|
249
|
-
return /* @__PURE__ */ React6.createElement("section", __spreadProps(__spreadValues({
|
|
250
|
-
ref
|
|
251
|
-
}, rest), {
|
|
252
|
-
style
|
|
253
|
-
}), /* @__PURE__ */ React6.createElement("div", {
|
|
254
|
-
"data-layout-content": true
|
|
255
|
-
}, children));
|
|
256
|
-
});
|
|
257
|
-
Layout.defaultProps = {
|
|
258
|
-
gridSize: 1224,
|
|
259
|
-
rows: 12,
|
|
260
|
-
columns: 12,
|
|
261
|
-
gap: 16,
|
|
262
|
-
rowSize: 48,
|
|
263
|
-
css: {
|
|
264
|
-
"@desktop": {
|
|
265
|
-
paddingTop: "16px",
|
|
266
|
-
paddingBottom: "16px",
|
|
267
|
-
paddingLeft: "var(--gap)",
|
|
268
|
-
paddingRight: "var(--gap)",
|
|
269
|
-
"> [data-layout-content]": {
|
|
270
|
-
margin: "0 auto",
|
|
271
|
-
display: "grid !important",
|
|
272
|
-
gridTemplateRows: "repeat(var(--rows), var(--row-size))",
|
|
273
|
-
gridTemplateColumns: "repeat(var(--columns), minmax(0, var(--col-size)))",
|
|
274
|
-
gap: "var(--gap)",
|
|
275
|
-
maxWidth: "var(--grid-size)"
|
|
276
|
-
}
|
|
277
|
-
},
|
|
278
|
-
"@mobile": {
|
|
279
|
-
padding: "0 16px",
|
|
280
|
-
"> [data-layout-content]": {
|
|
281
|
-
display: "flex !important",
|
|
282
|
-
flexDirection: "column"
|
|
283
|
-
}
|
|
284
|
-
}
|
|
285
|
-
}
|
|
286
|
-
};
|
|
287
|
-
var layout_default = Layout;
|
|
288
|
-
|
|
289
|
-
// src/elements/map.tsx
|
|
290
|
-
import React7, { forwardRef as forwardRef5 } from "react";
|
|
291
|
-
var Map = forwardRef5((props, ref) => {
|
|
292
|
-
let _a = props, { place, zoom } = _a, rest = __objRest(_a, ["place", "zoom"]);
|
|
293
|
-
return /* @__PURE__ */ React7.createElement("div", __spreadValues({
|
|
294
|
-
ref
|
|
295
|
-
}, rest), /* @__PURE__ */ React7.createElement("iframe", {
|
|
296
|
-
loading: "lazy",
|
|
297
|
-
scrolling: "no",
|
|
298
|
-
width: "100%",
|
|
299
|
-
height: "100%",
|
|
300
|
-
title: "map",
|
|
301
|
-
src: `https://maps.google.com/maps?z=${zoom}&t=m&q=${place}&ie=UTF8&&output=embed`,
|
|
302
|
-
style: { pointerEvents: "none" }
|
|
303
|
-
}));
|
|
304
|
-
});
|
|
305
|
-
Map.defaultProps = {
|
|
306
|
-
place: "Hanoi",
|
|
307
|
-
zoom: 14
|
|
308
|
-
};
|
|
309
|
-
var map_default = Map;
|
|
310
|
-
|
|
311
|
-
// src/elements/text.tsx
|
|
312
|
-
import * as React8 from "react";
|
|
313
|
-
var Text = React8.forwardRef((props, ref) => {
|
|
314
|
-
let _a = props, { children, value } = _a, rest = __objRest(_a, ["children", "value"]);
|
|
315
|
-
return /* @__PURE__ */ React8.createElement("div", __spreadProps(__spreadValues({
|
|
316
|
-
ref
|
|
317
|
-
}, rest), {
|
|
318
|
-
dangerouslySetInnerHTML: { __html: value }
|
|
319
|
-
}));
|
|
320
|
-
});
|
|
321
|
-
Text.defaultProps = {
|
|
322
|
-
value: "The quick brown fox jumps over the lazy dog",
|
|
323
|
-
css: {
|
|
324
|
-
"@desktop": {
|
|
325
|
-
width: "100%",
|
|
326
|
-
height: "fit-content",
|
|
327
|
-
padding: "20px",
|
|
328
|
-
outline: "none",
|
|
329
|
-
wordBreak: "break-word",
|
|
330
|
-
overflowWrap: "break-word",
|
|
331
|
-
whiteSpace: "break-spaces"
|
|
332
|
-
}
|
|
333
|
-
}
|
|
334
|
-
};
|
|
335
|
-
var text_default = Text;
|
|
336
|
-
|
|
337
|
-
// src/elements/video.tsx
|
|
338
|
-
import React9, { forwardRef as forwardRef7, useContext as useContext2 } from "react";
|
|
339
|
-
var Video = forwardRef7((props, ref) => {
|
|
340
|
-
let { isDesignMode } = useContext2(WeaverseContext);
|
|
341
|
-
let _a = props, { src, type, controls, poster, autoPlay, loop, muted } = _a, rest = __objRest(_a, ["src", "type", "controls", "poster", "autoPlay", "loop", "muted"]);
|
|
342
|
-
return /* @__PURE__ */ React9.createElement("div", __spreadValues({
|
|
343
|
-
ref
|
|
344
|
-
}, rest), /* @__PURE__ */ React9.createElement("video", {
|
|
345
|
-
controls: isDesignMode ? false : controls,
|
|
346
|
-
autoPlay: isDesignMode ? false : autoPlay,
|
|
347
|
-
loop,
|
|
348
|
-
muted: true,
|
|
349
|
-
controlsList: "nodownload",
|
|
350
|
-
disablePictureInPicture: true
|
|
351
|
-
}, /* @__PURE__ */ React9.createElement("source", {
|
|
352
|
-
src,
|
|
353
|
-
type: type || "video/mp4"
|
|
354
|
-
}), "Your browser does not support the video tag."));
|
|
355
|
-
});
|
|
356
|
-
Video.defaultProps = {
|
|
357
|
-
src: "https://youtu.be/wM-NT6hcw48",
|
|
358
|
-
poster: "https://ucarecdn.com/48d73272-3fe3-43f6-8b5b-22b68fc5a8c8/section.png",
|
|
359
|
-
loop: false,
|
|
360
|
-
type: "video/mp4",
|
|
361
|
-
controls: false,
|
|
362
|
-
autoPlay: true,
|
|
363
|
-
muted: true,
|
|
364
|
-
css: {
|
|
365
|
-
"@desktop": {
|
|
366
|
-
video: {
|
|
367
|
-
height: "100%",
|
|
368
|
-
width: "100%",
|
|
369
|
-
aspectRatio: "16 / 9"
|
|
370
|
-
}
|
|
371
|
-
}
|
|
372
|
-
}
|
|
373
|
-
};
|
|
374
|
-
var video_default = Video;
|
|
375
|
-
|
|
376
|
-
// src/elements/instagram.tsx
|
|
377
|
-
import React11, { forwardRef as forwardRef9, useContext as useContext3, useEffect as useEffect2, useState } from "react";
|
|
378
|
-
|
|
379
|
-
// src/elements/shared/Placeholder.tsx
|
|
380
|
-
import React10, { forwardRef as forwardRef8 } from "react";
|
|
381
|
-
var Placeholder = forwardRef8((props, ref) => {
|
|
382
|
-
let _a = props, { element, children } = _a, rest = __objRest(_a, ["element", "children"]);
|
|
383
|
-
let style = {
|
|
384
|
-
position: "absolute",
|
|
385
|
-
height: "100%",
|
|
386
|
-
width: "100%",
|
|
387
|
-
display: "flex",
|
|
388
|
-
flexDirection: "column",
|
|
389
|
-
alignItems: "center",
|
|
390
|
-
justifyContent: "center",
|
|
391
|
-
color: "#374151",
|
|
392
|
-
pointerEvents: "none",
|
|
393
|
-
zIndex: 1
|
|
394
|
-
};
|
|
395
|
-
return /* @__PURE__ */ React10.createElement("div", __spreadValues({
|
|
396
|
-
style,
|
|
397
|
-
ref
|
|
398
|
-
}, rest), /* @__PURE__ */ React10.createElement("div", {
|
|
399
|
-
style: { fontWeight: 600, marginBottom: "10px" }
|
|
400
|
-
}, element), /* @__PURE__ */ React10.createElement("div", null, children));
|
|
401
|
-
});
|
|
402
|
-
var Placeholder_default = Placeholder;
|
|
403
|
-
|
|
404
|
-
// src/elements/instagram.tsx
|
|
405
|
-
var INSTAGRAM_API = "https://graph.instagram.com";
|
|
406
|
-
var Instagram = forwardRef9((props, ref) => {
|
|
407
|
-
const _a = props, { token, username, numberOfImages, imagesPerRow, gap } = _a, rest = __objRest(_a, ["token", "username", "numberOfImages", "imagesPerRow", "gap"]);
|
|
408
|
-
const [media, setMedia] = useState([]);
|
|
409
|
-
const [error, setError] = useState(null);
|
|
410
|
-
let { isDesignMode } = useContext3(WeaverseContext);
|
|
411
|
-
useEffect2(() => {
|
|
412
|
-
if (token) {
|
|
413
|
-
let params = new URLSearchParams({
|
|
414
|
-
access_token: token,
|
|
415
|
-
fields: "id,media_type,caption,media_url,permalink"
|
|
416
|
-
});
|
|
417
|
-
fetch(`${INSTAGRAM_API}/me/media?${params.toString()}`).then((res) => res.json()).then((res) => {
|
|
418
|
-
if (res.error) {
|
|
419
|
-
setError(res);
|
|
420
|
-
} else {
|
|
421
|
-
setError(null);
|
|
422
|
-
setMedia([...res.data]);
|
|
423
|
-
}
|
|
424
|
-
}).catch(setError);
|
|
425
|
-
}
|
|
426
|
-
}, [token]);
|
|
427
|
-
if (!token || error) {
|
|
428
|
-
return /* @__PURE__ */ React11.createElement("div", __spreadValues({
|
|
429
|
-
ref
|
|
430
|
-
}, rest), /* @__PURE__ */ React11.createElement(Placeholder_default, {
|
|
431
|
-
element: "Instagram"
|
|
432
|
-
}, !token ? "Connect your Instagram account to display photos on your site." : "Invalid or expired token!"));
|
|
433
|
-
}
|
|
434
|
-
let style = {
|
|
435
|
-
"--wv-ig-images-per-row": imagesPerRow,
|
|
436
|
-
"--wv-ig-images-gap": gap
|
|
437
|
-
};
|
|
438
|
-
return /* @__PURE__ */ React11.createElement("div", __spreadProps(__spreadValues({
|
|
439
|
-
ref
|
|
440
|
-
}, rest), {
|
|
441
|
-
style
|
|
442
|
-
}), /* @__PURE__ */ React11.createElement("div", {
|
|
443
|
-
className: "wv-ig-media-container"
|
|
444
|
-
}, media.slice(0, numberOfImages).map((item) => {
|
|
445
|
-
let linkProps;
|
|
446
|
-
if (!isDesignMode) {
|
|
447
|
-
linkProps = { href: item.permalink, target: "_blank" };
|
|
448
|
-
}
|
|
449
|
-
return /* @__PURE__ */ React11.createElement("a", __spreadValues({
|
|
450
|
-
key: item.id
|
|
451
|
-
}, linkProps), /* @__PURE__ */ React11.createElement("img", {
|
|
452
|
-
alt: item.caption,
|
|
453
|
-
src: item.media_url
|
|
454
|
-
}));
|
|
455
|
-
})));
|
|
456
|
-
});
|
|
457
|
-
Instagram.defaultProps = {
|
|
458
|
-
token: "",
|
|
459
|
-
username: "",
|
|
460
|
-
numberOfImages: 8,
|
|
461
|
-
imagesPerRow: 4,
|
|
462
|
-
gap: 0,
|
|
463
|
-
css: {
|
|
464
|
-
"@desktop": {
|
|
465
|
-
".wv-ig-media-container": {
|
|
466
|
-
overflow: "hidden",
|
|
467
|
-
maxWidth: "100%",
|
|
468
|
-
maxHeight: "100%",
|
|
469
|
-
display: "grid",
|
|
470
|
-
gridTemplateColumns: "repeat(var(--wv-ig-images-per-row, 4), 1fr)",
|
|
471
|
-
gap: "var(--wv-ig-images-gap, 0px)",
|
|
472
|
-
img: {
|
|
473
|
-
aspectRatio: "1 / 1",
|
|
474
|
-
width: "100%",
|
|
475
|
-
height: "100%",
|
|
476
|
-
objectFit: "cover"
|
|
477
|
-
}
|
|
478
|
-
}
|
|
479
|
-
}
|
|
480
|
-
}
|
|
481
|
-
};
|
|
482
|
-
var instagram_default = Instagram;
|
|
483
|
-
|
|
484
|
-
// src/elements/accordion/index.tsx
|
|
485
|
-
import React12, { createContext, forwardRef as forwardRef10, useState as useState2 } from "react";
|
|
486
|
-
var AccordionContext = createContext({
|
|
487
|
-
active: null,
|
|
488
|
-
setActive: () => {
|
|
489
|
-
}
|
|
490
|
-
});
|
|
491
|
-
var Accordion = forwardRef10((props, ref) => {
|
|
492
|
-
const _a = props, { items, children } = _a, rest = __objRest(_a, ["items", "children"]);
|
|
493
|
-
const [active, setActive] = useState2(null);
|
|
494
|
-
const setOpenAccordion = (id) => {
|
|
495
|
-
if (id === active) {
|
|
496
|
-
setActive(null);
|
|
497
|
-
} else {
|
|
498
|
-
setActive(id);
|
|
499
|
-
}
|
|
500
|
-
};
|
|
501
|
-
console.info("9779 active", active);
|
|
502
|
-
return /* @__PURE__ */ React12.createElement("div", __spreadValues({
|
|
503
|
-
ref
|
|
504
|
-
}, rest), /* @__PURE__ */ React12.createElement(AccordionContext.Provider, {
|
|
505
|
-
value: { active, setActive: setOpenAccordion }
|
|
506
|
-
}, children));
|
|
507
|
-
});
|
|
508
|
-
Accordion.defaultProps = {
|
|
509
|
-
items: [
|
|
510
|
-
{
|
|
511
|
-
id: 1,
|
|
512
|
-
headerText: "Header 1",
|
|
513
|
-
childrenId: true
|
|
514
|
-
},
|
|
515
|
-
{
|
|
516
|
-
id: 2,
|
|
517
|
-
headerText: "Header 2"
|
|
518
|
-
}
|
|
519
|
-
],
|
|
520
|
-
css: {
|
|
521
|
-
"@desktop": {
|
|
522
|
-
display: "flex",
|
|
523
|
-
flexDirection: "column",
|
|
524
|
-
gap: 4,
|
|
525
|
-
".wv-accordion-header": {
|
|
526
|
-
borderRadius: 4,
|
|
527
|
-
padding: 4,
|
|
528
|
-
marginBottom: 4,
|
|
529
|
-
backgroundColor: "#aaa",
|
|
530
|
-
"&.active": {
|
|
531
|
-
color: "blue"
|
|
532
|
-
},
|
|
533
|
-
'&.active + [data-wv-type="accordion.content"]': {
|
|
534
|
-
display: "grid"
|
|
535
|
-
}
|
|
536
|
-
}
|
|
537
|
-
}
|
|
538
|
-
}
|
|
539
|
-
};
|
|
540
|
-
var accordion_default = Accordion;
|
|
541
|
-
|
|
542
|
-
// src/elements/accordion/AccordionWrapper.tsx
|
|
543
|
-
import React13, { forwardRef as forwardRef11, useContext as useContext4 } from "react";
|
|
544
|
-
var AccordionWrapper = forwardRef11((props, ref) => {
|
|
545
|
-
const _a = props, { wrapperId, headerText, children } = _a, rest = __objRest(_a, ["wrapperId", "headerText", "children"]);
|
|
546
|
-
const { active, setActive } = useContext4(AccordionContext);
|
|
547
|
-
return /* @__PURE__ */ React13.createElement("div", __spreadValues({
|
|
548
|
-
ref
|
|
549
|
-
}, rest), /* @__PURE__ */ React13.createElement("div", {
|
|
550
|
-
onClick: () => setActive(wrapperId),
|
|
551
|
-
className: `wv-accordion-header ${active === wrapperId ? "active" : ""}`
|
|
552
|
-
}, headerText, " #", wrapperId), children);
|
|
553
|
-
});
|
|
554
|
-
AccordionWrapper.defaultProps = {
|
|
555
|
-
wrapperId: 1,
|
|
556
|
-
headerText: "Header 1",
|
|
557
|
-
css: {
|
|
558
|
-
"@desktop": {
|
|
559
|
-
maxHeight: "100%"
|
|
560
|
-
}
|
|
561
|
-
}
|
|
562
|
-
};
|
|
563
|
-
var AccordionWrapper_default = AccordionWrapper;
|
|
564
|
-
|
|
565
|
-
// src/elements/accordion/AccordionContent.tsx
|
|
566
|
-
import React14, { forwardRef as forwardRef12 } from "react";
|
|
567
|
-
var AccordionContent = forwardRef12((props, ref) => {
|
|
568
|
-
const _a = props, { rows, columns, gap, rowSize, children } = _a, rest = __objRest(_a, ["rows", "columns", "gap", "rowSize", "children"]);
|
|
569
|
-
let style = {
|
|
570
|
-
"--rows": rows,
|
|
571
|
-
"--columns": columns,
|
|
572
|
-
"--gap": gap + "px",
|
|
573
|
-
"--row-size": rowSize + "px",
|
|
574
|
-
"--col-size": "calc((var(--grid-size) - calc(var(--columns) - 1) * var(--gap)) / var(--columns))"
|
|
575
|
-
};
|
|
576
|
-
return /* @__PURE__ */ React14.createElement("div", __spreadProps(__spreadValues({
|
|
577
|
-
ref
|
|
578
|
-
}, rest), {
|
|
579
|
-
style
|
|
580
|
-
}), React14.Children.count(children) > 0 ? children : /* @__PURE__ */ React14.createElement(Placeholder_default, {
|
|
581
|
-
element: "Accordion"
|
|
582
|
-
}, "Item Content"));
|
|
583
|
-
});
|
|
584
|
-
AccordionContent.defaultProps = {
|
|
585
|
-
rows: 2,
|
|
586
|
-
columns: 12,
|
|
587
|
-
gap: 4,
|
|
588
|
-
rowSize: 48,
|
|
589
|
-
css: {
|
|
590
|
-
"@desktop": {
|
|
591
|
-
width: "100%",
|
|
592
|
-
maxWidth: "var(--grid-size)",
|
|
593
|
-
backgroundColor: "#DDD",
|
|
594
|
-
display: "none",
|
|
595
|
-
gridTemplateRows: "repeat(var(--rows), var(--row-size))",
|
|
596
|
-
gridTemplateColumns: "repeat(var(--columns), minmax(0, var(--col-size)))",
|
|
597
|
-
gap: "var(--gap)",
|
|
598
|
-
borderRadius: 4
|
|
599
|
-
}
|
|
600
|
-
}
|
|
601
|
-
};
|
|
602
|
-
var AccordionContent_default = AccordionContent;
|
|
603
|
-
|
|
604
|
-
// src/elements/index.ts
|
|
605
|
-
var elements = {
|
|
606
|
-
Countdown: {
|
|
607
|
-
Component: countdown_default,
|
|
608
|
-
type: "countdown"
|
|
609
|
-
},
|
|
610
|
-
Button: {
|
|
611
|
-
Component: button_default,
|
|
612
|
-
type: "button"
|
|
613
|
-
},
|
|
614
|
-
Container: {
|
|
615
|
-
Component: container_default,
|
|
616
|
-
type: "container"
|
|
617
|
-
},
|
|
618
|
-
Image: {
|
|
619
|
-
Component: image_default,
|
|
620
|
-
type: "image"
|
|
621
|
-
},
|
|
622
|
-
Instagram: {
|
|
623
|
-
Component: instagram_default,
|
|
624
|
-
type: "instagram"
|
|
625
|
-
},
|
|
626
|
-
Layout: {
|
|
627
|
-
Component: layout_default,
|
|
628
|
-
type: "layout"
|
|
629
|
-
},
|
|
630
|
-
Map: {
|
|
631
|
-
Component: map_default,
|
|
632
|
-
type: "map"
|
|
633
|
-
},
|
|
634
|
-
Text: {
|
|
635
|
-
Component: text_default,
|
|
636
|
-
type: "text"
|
|
637
|
-
},
|
|
638
|
-
Video: {
|
|
639
|
-
Component: video_default,
|
|
640
|
-
type: "video"
|
|
641
|
-
},
|
|
642
|
-
Accordion: {
|
|
643
|
-
Component: accordion_default,
|
|
644
|
-
type: "accordion"
|
|
645
|
-
},
|
|
646
|
-
AccordionWrapper: {
|
|
647
|
-
Component: AccordionWrapper_default,
|
|
648
|
-
type: "accordion.wrapper"
|
|
649
|
-
},
|
|
650
|
-
AccordionContent: {
|
|
651
|
-
Component: AccordionContent_default,
|
|
652
|
-
type: "accordion.content"
|
|
653
|
-
}
|
|
654
|
-
};
|
|
655
|
-
var elements_default = elements;
|
|
656
|
-
|
|
657
|
-
// src/context.ts
|
|
658
|
-
var createRootContext = (configs) => {
|
|
659
|
-
let rootContext = new Weaverse(configs);
|
|
660
|
-
Object.keys(elements_default).forEach((key) => {
|
|
661
|
-
rootContext.registerElement(elements_default[key]);
|
|
662
|
-
});
|
|
663
|
-
return rootContext;
|
|
664
|
-
};
|
|
665
|
-
var WeaverseContext = createContext2({});
|
|
666
|
-
var WeaverseContextProvider = WeaverseContext.Provider;
|
|
667
|
-
var WeaverseContextConsumer = WeaverseContext.Consumer;
|
|
668
|
-
|
|
669
|
-
// src/renderer.tsx
|
|
670
|
-
import { isBrowser } from "@weaverse/core";
|
|
671
|
-
import React15, { useContext as useContext5, useEffect as useEffect3, useRef, useState as useState3 } from "react";
|
|
672
|
-
|
|
673
|
-
// src/utils/index.ts
|
|
674
|
-
var shortCssObject = (css) => {
|
|
675
|
-
return {
|
|
676
|
-
"@desktop": css["@desktop"],
|
|
677
|
-
"@mobile": css["@mobile"]
|
|
678
|
-
};
|
|
679
|
-
};
|
|
680
|
-
function generateItemClass(instance, stitchesInstance) {
|
|
681
|
-
var _a, _b, _c, _d;
|
|
682
|
-
let { css, className: cls = "" } = instance.data;
|
|
683
|
-
let defaultCss = ((_c = (_b = (_a = instance.Element) == null ? void 0 : _a.Component) == null ? void 0 : _b.defaultProps) == null ? void 0 : _c.css) || {};
|
|
684
|
-
let className = "";
|
|
685
|
-
if (css || defaultCss) {
|
|
686
|
-
let formattedCss = shortCssObject(css || defaultCss);
|
|
687
|
-
let { className: newClass = "" } = stitchesInstance.css(formattedCss)();
|
|
688
|
-
let { stitchesClass } = instance;
|
|
689
|
-
let otherClass = (((_d = instance.ref.current) == null ? void 0 : _d.className) || "").replace(stitchesClass, "").replace(cls, "").trim();
|
|
690
|
-
className = `${cls} ${newClass} ${otherClass}`.trim();
|
|
691
|
-
instance.stitchesClass = newClass;
|
|
692
|
-
}
|
|
693
|
-
return className;
|
|
694
|
-
}
|
|
695
|
-
|
|
696
|
-
// src/renderer.tsx
|
|
697
|
-
var WeaverseRoot = ({ context }) => {
|
|
698
|
-
var _a;
|
|
699
|
-
let [, setData] = useState3(context.projectData);
|
|
700
|
-
let rootRef = useRef();
|
|
701
|
-
useEffect3(() => {
|
|
702
|
-
let update = () => setData({});
|
|
703
|
-
context.subscribe(update);
|
|
704
|
-
if (context.projectData) {
|
|
705
|
-
setTimeout(update, 110);
|
|
706
|
-
}
|
|
707
|
-
context.contentRootElement = rootRef.current;
|
|
708
|
-
return () => {
|
|
709
|
-
context.unsubscribe(update);
|
|
710
|
-
};
|
|
711
|
-
}, []);
|
|
712
|
-
let eventHandlers = ((_a = context == null ? void 0 : context.studioBridge) == null ? void 0 : _a.eventHandlers) || {};
|
|
713
|
-
let themeClass = context.stitchesInstance.theme.className;
|
|
714
|
-
return /* @__PURE__ */ React15.createElement("div", __spreadProps(__spreadValues({
|
|
715
|
-
className: `weaverse-content-root ${themeClass}`
|
|
716
|
-
}, eventHandlers), {
|
|
717
|
-
ref: rootRef
|
|
718
|
-
}), /* @__PURE__ */ React15.createElement(WeaverseContextProvider, {
|
|
719
|
-
value: context
|
|
720
|
-
}, /* @__PURE__ */ React15.createElement(ItemInstance, {
|
|
721
|
-
id: context.projectData.rootId || 0
|
|
722
|
-
})));
|
|
723
|
-
};
|
|
724
|
-
var ItemComponent = ({ instance }) => {
|
|
725
|
-
let { stitchesInstance, elementInstances } = useContext5(WeaverseContext);
|
|
726
|
-
let [data, setData] = useState3(instance.data);
|
|
727
|
-
let _a = data, { id, type, childIds = [], css, className } = _a, rest = __objRest(_a, ["id", "type", "childIds", "css", "className"]);
|
|
728
|
-
useEffect3(() => {
|
|
729
|
-
var _a2;
|
|
730
|
-
let update = (data2) => setData(__spreadValues({}, data2));
|
|
731
|
-
instance.subscribe(update);
|
|
732
|
-
if (isBrowser && !instance.ref.current) {
|
|
733
|
-
Object.assign(instance.ref, {
|
|
734
|
-
current: document.querySelector(`[data-wv-id="${id}"]`)
|
|
735
|
-
});
|
|
736
|
-
}
|
|
737
|
-
(_a2 = instance.ref.current) == null ? void 0 : _a2.removeAttribute("css");
|
|
738
|
-
return () => {
|
|
739
|
-
instance.unsubscribe(update);
|
|
740
|
-
};
|
|
741
|
-
}, []);
|
|
742
|
-
let Element = elementInstances.get(type);
|
|
743
|
-
if (Element == null ? void 0 : Element.Component) {
|
|
744
|
-
let Component = Element.Component;
|
|
745
|
-
if (Component.$$typeof === Symbol.for("react.forward_ref")) {
|
|
746
|
-
rest.ref = instance.ref;
|
|
747
|
-
}
|
|
748
|
-
return /* @__PURE__ */ React15.createElement(Component, __spreadValues({
|
|
749
|
-
key: id,
|
|
750
|
-
"data-wv-type": type,
|
|
751
|
-
"data-wv-id": id,
|
|
752
|
-
className: generateItemClass(instance, stitchesInstance)
|
|
753
|
-
}, rest), childIds.map((id2) => /* @__PURE__ */ React15.createElement(ItemInstance, {
|
|
754
|
-
key: id2,
|
|
755
|
-
id: id2
|
|
756
|
-
})));
|
|
757
|
-
}
|
|
758
|
-
return null;
|
|
759
|
-
};
|
|
760
|
-
var ItemInstance = ({ id }) => {
|
|
761
|
-
let context = useContext5(WeaverseContext);
|
|
762
|
-
let { itemInstances } = context;
|
|
763
|
-
let instance = itemInstances.get(id);
|
|
764
|
-
if (!instance) {
|
|
765
|
-
return /* @__PURE__ */ React15.createElement("div", {
|
|
766
|
-
style: { display: "none" }
|
|
767
|
-
}, "Item instance ", id, " not found");
|
|
768
|
-
}
|
|
769
|
-
return /* @__PURE__ */ React15.createElement(ItemComponent, {
|
|
770
|
-
instance
|
|
771
|
-
});
|
|
772
|
-
};
|
|
773
|
-
|
|
774
|
-
// src/index.ts
|
|
775
|
-
export * from "@weaverse/core";
|
|
776
|
-
export {
|
|
777
|
-
WeaverseContext,
|
|
778
|
-
WeaverseContextConsumer,
|
|
779
|
-
WeaverseContextProvider,
|
|
780
|
-
WeaverseRoot,
|
|
781
|
-
createRootContext
|
|
782
|
-
};
|